All files / virtual-keyboard/src/layouts hangul.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
 
 
 
 
 
 
 
 
 
 
 
 
 
78x
78x
78x
78x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
3x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { createLayout } from "../engine/createLayout";
import { hangulComposer } from "../composer/hangul";
import type { KeyDefinition } from "../types";
import {
  BACKSPACE_KEY,
  ENTER_KEY,
  LAYER_KEY,
  SHIFT_KEY,
  SPACE_KEY,
} from "./qwerty";
 
/** Build a jamo char key with an optional symbol-layer glyph and Shift alternate. */
function jk(key: string, layerKey?: string, shiftKey?: string): KeyDefinition {
  const def: KeyDefinition = { key, type: "char" };
  Eif (layerKey !== undefined) def.layerKey = layerKey;
  if (shiftKey !== undefined) def.shiftKey = shiftKey;
  return def;
}
 
/**
 * Korean **두벌식 (dubeolsik)** layout, pre-wired with {@link hangulComposer}. The
 * five tense consonants (ㄲ ㄸ ㅃ ㅆ ㅉ) and the two tense vowels (ㅒ ㅖ) are typed
 * with Shift; a `?123` symbol layer and Shift/Backspace/Space/Enter behave as on
 * the Latin layouts. Because the layout carries a `composer`, the
 * {@link VirtualKeyboard} assembles jamo into syllable blocks and renders the
 * in-progress block underlined until it commits.
 *
 * @example
 * ```tsx
 * import { VirtualKeyboard } from "@usefy/virtual-keyboard";
 * import { hangulLayout } from "@usefy/virtual-keyboard/hangul";
 *
 * <VirtualKeyboard layouts={hangulLayout} />;
 * ```
 */
export const hangulLayout = createLayout({
  name: "hangul",
  label: "한글",
  composer: hangulComposer,
  rows: [
    [
      jk("ㅂ", "1", "ㅃ"),
      jk("ㅈ", "2", "ㅉ"),
      jk("ㄷ", "3", "ㄸ"),
      jk("ㄱ", "4", "ㄲ"),
      jk("ㅅ", "5", "ㅆ"),
      jk("ㅛ", "6"),
      jk("ㅕ", "7"),
      jk("ㅑ", "8"),
      jk("ㅐ", "9", "ㅒ"),
      jk("ㅔ", "0", "ㅖ"),
    ],
    [
      jk("ㅁ", "@"),
      jk("ㄴ", "#"),
      jk("ㅇ", "$"),
      jk("ㄹ", "_"),
      jk("ㅎ", "&"),
      jk("ㅗ", "-"),
      jk("ㅓ", "+"),
      jk("ㅏ", "("),
      jk("ㅣ", ")"),
    ],
    [
      SHIFT_KEY,
      jk("ㅋ", "*"),
      jk("ㅌ", '"'),
      jk("ㅊ", "'"),
      jk("ㅍ", ":"),
      jk("ㅠ", ";"),
      jk("ㅜ", "!"),
      jk("ㅡ", "?"),
      BACKSPACE_KEY,
    ],
    [
      LAYER_KEY,
      { key: ",", type: "char", layerKey: "<" },
      SPACE_KEY,
      { key: ".", type: "char", layerKey: ">" },
      ENTER_KEY,
    ],
  ],
});