Skip to content

Commit

Permalink
feat: display the space key
Browse files Browse the repository at this point in the history
  • Loading branch information
@aradzie
aradzie committed Apr 4, 2024
1 parent f33ed38 commit 943ce91
Show file tree
Hide file tree
Showing 49 changed files with 232 additions and 134 deletions.
4 changes: 2 additions & 2 deletions packages/keybr-keyboard-generator/lib/util/generate.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ export function writeGeneratedFile(keymap: KeyMap, filename: string): void {
.toUpperCase()
.replaceAll("-", "_")
.replaceAll(".", "_");
const codePointDict = toCodePointDict(keymap);
const sourceFile = generateSourceFile(id, codePointDict);
const dict = toCodePointDict(keymap);
const sourceFile = generateSourceFile(id, dict);
writeFileSync(filename, sourceFile);
}

Expand Down
2 changes: 2 additions & 0 deletions packages/keybr-keyboard-generator/lib/util/keys.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -61,4 +61,6 @@ export const characterKeys: readonly KeyId[] = [
"Period",
"Slash",
"IntlRo",
// ---
"Space",
];
2 changes: 1 addition & 1 deletion packages/keybr-keyboard-generator/lib/util/layout.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@ export function toCodePointDict(keymap: KeyMap): CodePointDict {
for (const keyId of characterKeys) {
map.set(keyId, codePointsOf(keyId, keymap[keyId]));
}
return Object.fromEntries(map) as any;
return { ...Object.fromEntries(map), Space: [0x0020] };
}

function codePointsOf(keyId: KeyId, list: CodePointList | null): CodePoint[] {
Expand Down
48 changes: 24 additions & 24 deletions packages/keybr-keyboard-ui/lib/Key.test.tsx.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,30 @@ Generated by [AVA](https://avajs.dev).
},
type: 'rect',
},
{
children: null,
props: {
className: 'bump',
cx: 19,
cy: 33,
r: 3,
},
type: 'circle',
},
{
children: [
'XYZ',
],
props: {
className: 'symbol',
direction: 'ltr',
dominantBaseline: 'middle',
textAnchor: 'middle',
x: 20,
y: 20,
},
type: 'text',
},
{
children: [
'A',
Expand Down Expand Up @@ -77,30 +101,6 @@ Generated by [AVA](https://avajs.dev).
},
type: 'text',
},
{
children: [
'XYZ',
],
props: {
className: 'symbol',
direction: 'ltr',
dominantBaseline: 'middle',
textAnchor: 'middle',
x: 20,
y: 20,
},
type: 'text',
},
{
children: null,
props: {
className: 'bump',
cx: 20,
cy: 33,
r: 3,
},
type: 'circle',
},
],
props: {
className: 'key',
Expand Down
Binary file modified packages/keybr-keyboard-ui/lib/Key.test.tsx.snap
View file
Binary file not shown.
59 changes: 27 additions & 32 deletions packages/keybr-keyboard-ui/lib/Key.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@ import {
type LabelShape,
type ZoneId,
} from "@keybr/keyboard";
import { type CodePoint } from "@keybr/unicode";
import { type ClassName } from "@keybr/widget";
import { clsx } from "clsx";
import {
type FunctionComponent,
Expand All @@ -27,23 +29,29 @@ export type KeyProps = {
};

export function makeKeyComponent(shape: KeyShape): FunctionComponent<KeyProps> {
const { id, a, b, c, d, finger } = shape;
const x = shape.x * keySize;
const y = shape.y * keySize;
const w = shape.w * keySize - keyGap;
const h = shape.h * keySize - keyGap;
const children: ReactNode[] = [];
children.push(
shape.shape ? (
<path className={styles.button} d={shape.shape} />
) : (
<rect
className={styles.button}
x={0}
y={0}
width={shape.w * keySize - keyGap}
height={shape.h * keySize - keyGap}
/>
<rect className={styles.button} x={0} y={0} width={w} height={h} />
),
);
const { a, b, c, d } = shape;
const ab = a > 0 && b > 0 && keySymbol(a) === keySymbol(b);
const cd = c > 0 && d > 0 && keySymbol(c) === keySymbol(d);
if (shape.homing) {
children.push(
<circle className={styles.bump} cx={w / 2} cy={h - 5} r={3} />,
);
}
for (const label of shape.labels) {
children.push(makeLabel(label));
}
const ab = a > 0 && b > 0 && symbolText(a) === symbolText(b);
const cd = c > 0 && d > 0 && symbolText(c) === symbolText(d);
if (a > 0 && !ab) {
children.push(makeSymbolLabel(a, 10, 27, styles.secondarySymbol));
}
Expand All @@ -62,18 +70,6 @@ export function makeKeyComponent(shape: KeyShape): FunctionComponent<KeyProps> {
if (c > 0 && cd) {
children.push(makeSymbolLabel(c, 25, 27, styles.primarySymbol));
}
for (const label of shape.labels) {
children.push(makeLabel(label));
}
if (shape.homing) {
children.push(<circle className={styles.bump} cx={20} cy={33} r={3} />);
}
const id = shape.id;
const x = shape.x * keySize;
const y = shape.y * keySize;
const w = shape.w * keySize - keyGap;
const h = shape.h * keySize - keyGap;
const finger = shape.finger;
function KeyComponent({
depressed,
toggled,
Expand Down Expand Up @@ -111,7 +107,7 @@ export function makeKeyComponent(shape: KeyShape): FunctionComponent<KeyProps> {
return memo(KeyComponent);
}

function makeLabel(label: LabelShape, className: any = null): ReactNode {
function makeLabel(label: LabelShape, className: ClassName = null): ReactNode {
const { text, pos = [10, 20], align = ["s", "m"] } = label;
const [x, y] = pos;
const [ha, va] = align;
Expand Down Expand Up @@ -157,29 +153,28 @@ function makeSymbolLabel(
codePoint: number,
x: number,
y: number,
className: any,
className: ClassName,
): ReactNode {
if (codePoint === 0x0020) {
return null;
}
let text: string;
if (isDiacritic(codePoint)) {
text = deadKeySymbol(codePoint);
className = clsx(styles.deadSymbol, className);
text = String.fromCodePoint(/* ◌ */ 0x25cc, codePoint);
className = clsx(className, styles.deadSymbol);
} else {
text = keySymbol(codePoint);
text = symbolText(codePoint);
}
return makeLabel({ text, pos: [x, y], align: ["m", "m"] }, className);
}

function keySymbol(codePoint: number): string {
function symbolText(codePoint: CodePoint): string {
if (codePoint === /* ß */ 0x00df || codePoint === /* ẞ */ 0x1e9e) {
return "ẞ";
}
return String.fromCodePoint(codePoint).toUpperCase();
}

function deadKeySymbol(codePoint: number): string {
return String.fromCodePoint(/* ◌ */ 0x25cc, codePoint);
}

function fingerStyleName(finger: ZoneId | null): string | null {
switch (finger) {
case "pinky":
Expand Down
80 changes: 40 additions & 40 deletions packages/keybr-keyboard-ui/lib/KeyLayer.test.tsx.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1623,6 +1623,16 @@ Generated by [AVA](https://avajs.dev).
},
type: 'rect',
},
{
children: null,
props: {
className: 'bump',
cx: 19,
cy: 33,
r: 3,
},
type: 'circle',
},
{
children: [
'F',
Expand All @@ -1637,16 +1647,6 @@ Generated by [AVA](https://avajs.dev).
},
type: 'text',
},
{
children: null,
props: {
className: 'bump',
cx: 20,
cy: 33,
r: 3,
},
type: 'circle',
},
],
props: {
className: 'key',
Expand Down Expand Up @@ -1762,6 +1762,16 @@ Generated by [AVA](https://avajs.dev).
},
type: 'rect',
},
{
children: null,
props: {
className: 'bump',
cx: 19,
cy: 33,
r: 3,
},
type: 'circle',
},
{
children: [
'J',
Expand All @@ -1776,16 +1786,6 @@ Generated by [AVA](https://avajs.dev).
},
type: 'text',
},
{
children: null,
props: {
className: 'bump',
cx: 20,
cy: 33,
r: 3,
},
type: 'circle',
},
],
props: {
className: 'key',
Expand Down Expand Up @@ -4431,6 +4431,16 @@ Generated by [AVA](https://avajs.dev).
},
type: 'rect',
},
{
children: null,
props: {
className: 'bump',
cx: 19,
cy: 33,
r: 3,
},
type: 'circle',
},
{
children: [
'F',
Expand All @@ -4445,16 +4455,6 @@ Generated by [AVA](https://avajs.dev).
},
type: 'text',
},
{
children: null,
props: {
className: 'bump',
cx: 20,
cy: 33,
r: 3,
},
type: 'circle',
},
],
props: {
className: 'key',
Expand Down Expand Up @@ -4570,6 +4570,16 @@ Generated by [AVA](https://avajs.dev).
},
type: 'rect',
},
{
children: null,
props: {
className: 'bump',
cx: 19,
cy: 33,
r: 3,
},
type: 'circle',
},
{
children: [
'J',
Expand All @@ -4584,16 +4594,6 @@ Generated by [AVA](https://avajs.dev).
},
type: 'text',
},
{
children: null,
props: {
className: 'bump',
cx: 20,
cy: 33,
r: 3,
},
type: 'circle',
},
],
props: {
className: 'key',
Expand Down
Binary file modified packages/keybr-keyboard-ui/lib/KeyLayer.test.tsx.snap
View file
Binary file not shown.
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/be_by-win.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,5 @@ export const LAYOUT_BE_BY_WIN: CodePointDict = {
Comma: [/* б */ 0x0431, /* Б */ 0x0411],
Period: [/* ю */ 0x044e, /* Ю */ 0x042e],
Slash: [/* . */ 0x002e, /* , */ 0x002c],
Space: [/* SPACE */ 0x0020],
};
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/cs_cz-win.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,5 @@ export const LAYOUT_CS_CZ_WIN: CodePointDict = {
Comma: [/* , */ 0x002c, /* ? */ 0x003f, /* < */ 0x003c],
Period: [/* . */ 0x002e, /* : */ 0x003a, /* > */ 0x003e],
Slash: [/* - */ 0x002d, /* _ */ 0x005f, /* * */ 0x002a],
Space: [/* SPACE */ 0x0020],
};
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/de_bone.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,4 +50,5 @@ export const LAYOUT_DE_BONE: CodePointDict = {
Comma: [/* , */ 0x002c, /* – */ 0x2013],
Period: [/* . */ 0x002e, /* • */ 0x2022],
Slash: [/* k */ 0x006b, /* K */ 0x004b],
Space: [/* SPACE */ 0x0020],
};
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/de_ch-win.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,5 @@ export const LAYOUT_DE_CH_WIN: CodePointDict = {
Comma: [/* , */ 0x002c, /* ; */ 0x003b],
Period: [/* . */ 0x002e, /* : */ 0x003a],
Slash: [/* - */ 0x002d, /* _ */ 0x005f],
Space: [/* SPACE */ 0x0020],
};
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/de_de-win.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,5 @@ export const LAYOUT_DE_DE_WIN: CodePointDict = {
Comma: [/* , */ 0x002c, /* ; */ 0x003b],
Period: [/* . */ 0x002e, /* : */ 0x003a],
Slash: [/* - */ 0x002d, /* _ */ 0x005f],
Space: [/* SPACE */ 0x0020],
};
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/de_mine.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,4 +50,5 @@ export const LAYOUT_DE_MINE: CodePointDict = {
Comma: [/* , */ 0x002c, /* – */ 0x2013],
Period: [/* . */ 0x002e, /* • */ 0x2022],
Slash: [/* k */ 0x006b, /* K */ 0x004b],
Space: [/* SPACE */ 0x0020],
};
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/de_neo_2.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,4 +50,5 @@ export const LAYOUT_DE_NEO_2: CodePointDict = {
Comma: [/* , */ 0x002c, /* – */ 0x2013],
Period: [/* . */ 0x002e, /* • */ 0x2022],
Slash: [/* j */ 0x006a, /* J */ 0x004a],
Space: [/* SPACE */ 0x0020],
};
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/el_gr-win.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,5 @@ export const LAYOUT_EL_GR_WIN: CodePointDict = {
Comma: [/* , */ 0x002c, /* < */ 0x003c],
Period: [/* . */ 0x002e, /* > */ 0x003e],
Slash: [/* / */ 0x002f, /* ? */ 0x003f],
Space: [/* SPACE */ 0x0020],
};
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/en_canary_matrix.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,5 @@ export const LAYOUT_EN_CANARY_MATRIX: CodePointDict = {
Comma: [/* / */ 0x002f, /* ? */ 0x003f],
Period: [/* , */ 0x002c, /* < */ 0x003c],
Slash: [/* . */ 0x002e, /* > */ 0x003e],
Space: [/* SPACE */ 0x0020],
};
1 change: 1 addition & 0 deletions packages/keybr-keyboard/lib/data/layout/en_colemak.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,5 @@ export const LAYOUT_EN_COLEMAK: CodePointDict = {
Comma: [/* , */ 0x002c, /* < */ 0x003c],
Period: [/* . */ 0x002e, /* > */ 0x003e],
Slash: [/* / */ 0x002f, /* ? */ 0x003f],
Space: [/* SPACE */ 0x0020],
};
Loading

0 comments on commit 943ce91

Please sign in to comment.