1681-engine / react / UiSettings
Interface: UiSettings ​
Defined in: src/react/UiProvider.tsx:8
What every component of the kit reads: where it is, how big the screen is and the words it prints.
Properties ​
classNames ​
classNames: Readonly<Record<string, string>>;Defined in: src/react/UiProvider.tsx:34
A game's own class names hung beside the kit's, keyed by the kit's name without its prefix (tabs, tab, button, select-list…) or by a state (picked, open): a game whose stylesheet already styles its own names takes the kit without rewriting it. Default none.
cx ​
cx: ClassJoiner;Defined in: src/react/UiProvider.tsx:36
Joins class names, adding the game's beside each of the kit's (classNames); what every component calls.
labels ​
labels: UiLabels;Defined in: src/react/UiProvider.tsx:24
margin ​
margin: number;Defined in: src/react/UiProvider.tsx:21
Kept clear between a window and the screen's edges (default 8).
minScale ​
minScale: number;Defined in: src/react/UiProvider.tsx:17
The smallest scale a window may shrink to before its body scrolls instead (default: scale, never shrinks).
portal ​
portal: () => HTMLElement | null;Defined in: src/react/UiProvider.tsx:28
Where tooltips, the select's list and dialogs are portalled. Default: document.body.
Returns ​
HTMLElement | null
scale ​
scale: number;Defined in: src/react/UiProvider.tsx:15
The scale windows and dialogs are meant to be drawn at (fitToViewport's scale): a whole multiple for a pixel-art UI laid out on small units. Default 1.
sheetScale ​
sheetScale: number;Defined in: src/react/UiProvider.tsx:19
A player's "window size" for touch sheets: laid out on a box 1 / sheetScale the screen and drawn back down.
snap ​
snap: boolean;Defined in: src/react/UiProvider.tsx:23
Positions and sizes land on whole pixels (default true): pixel art at x.5 reads blurred.
touch ​
touch: boolean;Defined in: src/react/UiProvider.tsx:10
Fingers, not a mouse: windows become full-screen sheets, tooltips are not shown. Default: isTouchUi().
viewport ​
viewport: () => Size;Defined in: src/react/UiProvider.tsx:26
The box windows, tooltips and lists are placed in. Default: the browser window.