Skip to main content

Glyphs

@kanso-labs/kanso-ui-core/glyphs publishes the path data of the glyphs both libraries draw inside their own controls: a checkbox’s check and dash, a stepper’s plus and minus, a search field’s magnifier and cross, and the chevrons, arrows, calendar and clock the pickers and menus show. Each is a <name>Path constant holding an SVG path’s d on the 24-unit grid gridSize names, as Material Symbols draws it.
The package draws nothing itself. The web library renders an inline SVG and the native one react-native-svg, and each decides whether a glyph mirrors in a right-to-left layout.
arrowBackPath, arrowDownwardPath, arrowDropDownPath, arrowUpwardPath, calendarPath, checkCirclePath, checkPath, chevronDownPath, chevronEndPath, clockPath, closePath, errorPath, keyboardPath, minusPath, personPath, plusPath and searchPath.

Demo schemes

@kanso-labs/kanso-ui-core/themes publishes demoThemes, the seven schemes both Storybooks render: Editorial, Graphite, Marquee, Neon, Nordic, Poster and Terminal. Each is a record of a label, a one-sentence description and a theme, the KuiTheme a consumer would hand either library’s ThemeScope.
They are Storybook material, written to show the shape of a theme, not palettes to ship. That is why they sit on a subpath of their own rather than in the main entry.
They are still worth reading as examples, because each follows the one rule a real theme has to: it states every colour. A colour’s default is a light and dark pair, so a colour a map leaves out falls back to whichever half the reader’s device asks for. Typography, spacing, radii, shadows and motion have one value in both schemes, so a partial override of those reads the same everywhere. See them rendered in the web Storybook under Theming, or with the Theme control on any story.