sheengemologic ui
All components

ThemeScope

Overrides theme axes locally, with inherited messages and a contextual overlay target.@gemologic/sheen · theming

Playground

<ThemeScope theme="paper" mode="light" accent="indigo" controllable={false}><Input label="Preview name" /></ThemeScope>

Variant matrix

Light comparison pane
mode: dark
mode: light
mode: system
mode: null
density: compact
density: comfortable
density: spacious
density: null
radius: sharp
radius: soft
radius: round
radius: null
motion: full
motion: reduced
motion: null
direction: ltr
direction: rtl
direction: null

Anatomy

Package
@gemologic/sheen
Source
packages/ui/src/theme/ThemeProvider.tsx
Tokens
None

Accessibility

Role: themed regionKeyboard: No component-owned keys

Do

  • Use independent iframes for full-layout comparisons.

Do not

  • Do not expect scopes to persist preferences.

Generated props

NameTypeDefaultDescription
controllablebooleanfalseAllows scoped setters to modify local overrides only.
classstringClass for the scope wrapper.
messagesPartial<Messages>Partial translations layered over the parent scope's messages.
themestring | null | undefinedLocal theme ID; omitted inherits and null resets to provider default.
modeMode | "system" | null | undefinedLocal mode; omitted inherits and null resets.
accentimport("@gemologic/sheen-tokens").AccentName | null | undefinedLocal accent preset; never changes root persistence.
density"compact" | "comfortable" | "spacious" | null | undefinedLocal density; omitted inherits and null resets.
radius"sharp" | "soft" | "round" | null | undefinedLocal corner treatment; omitted inherits and null resets.
motion"full" | "reduced" | null | undefinedLocal motion preference; OS reduced motion still wins.
direction"ltr" | "rtl" | null | undefinedLocal writing direction; omitted inherits and null resets.
localestring | null | undefinedLocal explicit formatting locale; omitted inherits and null resets.
Native Solid/HTML attributes remain available and are omitted from this authored-prop view.