@foldstryx/foldkit

Astryx-styled Foldkit view helpers. Named composition primitives (Button, Card, Stack, Row, Text, Sidebar, Dialog, Tabs, …) that pair Foldkit headless behavior with @foldstryx/styles visuals.

import { Button, Stack, Text } from '@foldstryx/foldkit'

@foldkit/ui, effect, and foldkit are peer dependencies supplied by the host. See the root README for the layer map and packaging notes.

Compatibility

Requires the Foldkit 0.147 / Effect RC compatibility line:

• foldkit@>=0.147.0, @foldkit/ui@>=0.147.0
• effect@>=4.0.0-rc.109

Since Foldkit 0.145, foldkit/html threads an HtmlBuilder<Message> into every view instead of exposing an html<Message>() factory. Foldstryx composition views mirror that: views take the frame's builder as their last parameter (Button.view(config, h)). Switch, Checkbox, and Tabs are stateless controlled views with parent-owned state and toggle messages.

StyleX attributes (sxAttrs)

Foldkit's Class handler is last-write-wins on a vnode. When you pass elAttrs(sxAttrs(h, someStyles), h.Class('extra')), only the trailing h.Class survives — StyleX classes from sxAttrs are silently dropped.

Rule: sxAttrs must be the only Class source on an element. Pass extra visuals as additional StyleX entries in the same call:

h.div(elAttrs(sxAttrs(h, sidebarStyles.shell)), [children])

Do not append a raw h.Class('overflow-hidden') or Tailwind utility string after sxAttrs. The foldstryx/no-stylex-clobber oxlint rule flags sxAttrs / stylex.props mixed with raw h.Class or h.Style on the same element. The same last-write-wins behavior applies to h.Style — keep inline styles inside sxAttrs output only.