@cascivo/react 0.10.0 → 0.11.0

package/README.md

@@ -3,7 +3,7 @@
 <div align="center">
   <a href="https://cascivo.com"><img src="https://cascivo.com/favicon.svg" width="72" height="72" alt="cascivo logo"></a>
   <h1>@cascivo/react</h1>
-  <p><strong>Prebuilt cascivo design system components — use without copying source</strong></p>
+  <p><strong>Prebuilt cascivo design system components — use without copying source. @cascivo/themes installs with it; pair with @cascivo/charts (data-viz) and @cascivo/icons. Docs offline: npx @cascivo/docs</strong></p>
 
 [![npm](https://img.shields.io/npm/v/%40cascivo%2Freact?style=flat-square&color=0079bf)](https://www.npmjs.com/package/@cascivo/react)
 [![downloads](https://img.shields.io/npm/dm/%40cascivo%2Freact?style=flat-square&color=0079bf)](https://www.npmjs.com/package/@cascivo/react)
@@ -25,16 +25,30 @@ can coexist in one project.
 ## Install
 
 ```sh
-pnpm add @cascivo/react @cascivo/themes @preact/signals-react
+pnpm add @cascivo/react @preact/signals-react
 ```
 
 **Peer dependencies** (install them in your app): `react >=18`, `react-dom >=18`,
 and `@preact/signals-react` — cascivo components are signal-driven, so the
-signals runtime is required. `@cascivo/themes` is optional but recommended; it
-supplies the tokens and themes the components read.
+signals runtime is required.
 
-Charts live in a separate package — add [`@cascivo/charts`](https://github.com/cascivo/cascivo/tree/main/packages/charts)
-for `LineChart`, `AreaChart`, `BarChart`, `Sparkline`, and more.
+[`@cascivo/themes`](https://github.com/cascivo/cascivo/tree/main/packages/themes)
+is a **dependency** of `@cascivo/react`, so it installs automatically — you don't
+add it yourself. It supplies the tokens and semantic color values the components
+read; **you must import its CSS once** (see below), or components render
+grayscale (`ThemeProvider` warns in dev when that happens).
+
+**The wider family** (separate installs, only if you use them):
+
+- Charts — [`@cascivo/charts`](https://github.com/cascivo/cascivo/tree/main/packages/charts):
+  `LineChart`, `AreaChart`, `BarChart`, `Sparkline`, and 20+ more.
+- Icons — [`@cascivo/icons`](https://github.com/cascivo/cascivo/tree/main/packages/icons):
+  ~440 tree-shakeable SVG icon components for `SideNav` items, `IconButton`, and
+  `Button` icons (sized by the token system) — so you don't hand-roll SVGs.
+
+> **Can't reach npmjs.com or cascivo.com?** The complete docs also ship as an npm
+> package: `npx -y @cascivo/docs` prints the index; `npx @cascivo/docs <component>`
+> prints one component's reference — no website needed. See [Using with AI tools](#using-with-ai-tools-v0-cursor-claude-code-gemini).
 
 > **Types are the reference.** The shipped `dist/index.d.ts` is a self-contained, flat
 > rollup — every component's `…Props` interface is real, documentation-grade API. Reading
@@ -58,10 +72,12 @@ Components ship with `'use client'` preserved in the bundle, so they work inside
 RSC without any extra wrapper.
 
 > **No bundler? (CDN, import maps, plain `<link>`)** Import the aggregate sheet
-> `@cascivo/react/styles.css` — every component's CSS in one file (~273 KB /
-> ~37 KB gzip, not tree-shaken). With a bundler (CSR) you don't need it; import it
-> only if you prefer one explicit stylesheet over per-component tree-shaking, or
-> for Vite SSR (below), where it is required.
+> `@cascivo/react/styles.css` — every component's CSS **plus the tokens and the
+> light & dark themes** in one file (~305 KB / ~40 KB gzip, not tree-shaken). It is
+> self-contained: this single import gives you a fully-colored app with no separate
+> `@cascivo/themes` import. With a bundler (CSR) you don't need it; import it only if
+> you prefer one explicit stylesheet over per-component tree-shaking, or for Vite SSR
+> (below), where it is required.
 
 > **Vite SSR / TanStack Start / Remix / workerd?** The 4-line SSR checklist (full
 > recipe: [USING-WITH-VITE-SSR.md](https://github.com/cascivo/cascivo/blob/main/docs/USING-WITH-VITE-SSR.md)):
@@ -145,6 +161,20 @@ the tool. cascivo has no training-data footprint yet, so **don't rely on a tool
 fetching cascivo.com** — that channel is the least reliable one. Use the channels
 that travel with the package instead:
 
+- **Zero web access needed — the whole docs surface as an npm package
+  ([`@cascivo/docs`](https://www.npmjs.com/package/@cascivo/docs)):**
+
+  ```sh
+  npx -y @cascivo/docs              # prints llms.txt (the index)
+  npx -y @cascivo/docs button       # prints one component's full reference
+  npx -y @cascivo/docs --full       # prints llms-full.txt (the entire library)
+  npx -y @cascivo/docs guide theming
+  ```
+
+  It reaches an agent through the same npm registry that installed your packages
+  — the one channel proven to work when `npmjs.com` and `cascivo.com` are blocked,
+  proxied, or offline. No install, no config; `npx` runs it from cache.
+
 - **One file, one fetch — paste or link this into any chat/agent:**
   [`https://cascivo.com/llms-full.txt`](https://cascivo.com/llms-full.txt). It is
   the entire library — setup, the signals/CSS-layer rules, and every component's

package/dist/index.d.ts

@@ -1,4 +1,27 @@
-import { ErrorBoundary, FocusScope, LinkComponent, LinkComponentProps, Portal, RovingOrientation, Signal, SuspenseBoundary, getLinkComponent, setLinkComponent } from "@cascivo/core";
+/**
+ * @cascivo/react — every cascivo component, prebuilt. Full API below.
+ *
+ * Quickstart:
+ *   pnpm add @cascivo/react @preact/signals-react
+ *   // @cascivo/themes is installed with @cascivo/react. Once, in your entry file:
+ *   import '@cascivo/themes/all.css'   // tokens + base + light & dark — REQUIRED for color
+ *   // No-bundler / single-file alternative (themes bundled in): '@cascivo/react/styles.css'
+ *   import { Button, Card } from '@cascivo/react'
+ *
+ * Skip the theme import and components render grayscale (ThemeProvider warns in dev).
+ *
+ * Wider family (separate installs):
+ *   @cascivo/charts — LineChart, AreaChart, BarChart, Sparkline, 25 chart types
+ *   @cascivo/icons  — ~440 tree-shakeable SVG icons for SideNav / IconButton / Button
+ *   @cascivo/themes — 12 themes; scope any with data-theme="…" on any element
+ *
+ * Reactivity: components are signal-driven. Without the signals Babel transform, any
+ * component reading signal.value in render must call useSignals() (from @cascivo/core) first.
+ *
+ * Docs: https://cascivo.com/llms.txt — or fully offline, no website needed:
+ *   npx -y @cascivo/docs            (index; `npx @cascivo/docs <component>` for one doc)
+ */
+import { ErrorBoundary, FocusScope, LinkComponent, LinkComponentProps, Portal, RovingOrientation, Signal, SpaceStep, SuspenseBoundary, getLinkComponent, setLinkComponent } from "@cascivo/core";
 import { AnchorHTMLAttributes, ButtonHTMLAttributes, FormHTMLAttributes, HTMLAttributes, ImgHTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, LiHTMLAttributes, MouseEvent, ReactElement, ReactNode, RefObject, SelectHTMLAttributes, TextareaHTMLAttributes, TimeHTMLAttributes } from "react";
 
 interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
@@ -670,6 +693,8 @@ interface SideNavLinkSubItem {
   id?: string;
   label: string;
   href?: string;
+  /** Leading icon (any ReactNode). `@cascivo/icons` ships ~440 SVG icon components
+   * sized by the token system — use one here instead of hand-rolling an SVG. */
   icon?: ReactNode;
   active?: boolean;
   /** Shows a trailing checkmark; use for picker-style "current selection" rows. */
@@ -689,6 +714,8 @@ interface SideNavItem {
   id?: string;
   label: string;
   href?: string;
+  /** Leading icon (any ReactNode). `@cascivo/icons` ships ~440 SVG icon components
+   * sized by the token system — use one here instead of hand-rolling an SVG. */
   icon?: ReactNode;
   active?: boolean;
   items?: SideNavSubItem[];
@@ -801,7 +828,7 @@ interface TagProps extends HTMLAttributes<HTMLSpanElement> {
   onDismiss?: () => void;
   dismissLabel?: string;
 }
-declare function Tag$1({
+declare function Tag({
   variant,
   size,
   onDismiss,
@@ -1980,7 +2007,7 @@ interface StatProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
   delta?: string;
   trend?: 'up' | 'down' | 'flat';
   helpText?: string;
-  /** Trailing visual, e.g. a `Sparkline` from `@cascivo/charts`. Purely decorative — mark it `aria-hidden` yourself if it duplicates the value/delta already announced. */
+  /** Trailing visual, e.g. a `Sparkline` from the separate `@cascivo/charts` package (not exported from `@cascivo/react`; `pnpm add @cascivo/charts`). Purely decorative — mark it `aria-hidden` yourself if it duplicates the value/delta already announced. */
   visual?: ReactNode;
 }
 declare function Stat({
@@ -2091,7 +2118,7 @@ interface TextProps extends HTMLAttributes<HTMLElement> {
   muted?: boolean;
 }
 declare function Text({
-  as: Tag,
+  as: Component,
   size,
   weight,
   muted,
@@ -2122,7 +2149,7 @@ interface ListProps extends HTMLAttributes<HTMLElement> {
   marker?: 'disc' | 'decimal' | 'none';
 }
 declare function List({
-  as: Tag,
+  as: Component,
   marker,
   className,
   children,
@@ -2368,7 +2395,8 @@ declare function Filter({
 interface IconButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
   /** Accessible name for the icon-only control. Required — there is no visible text. */
   label: string;
-  /** The icon to render. Alias for `children`. */
+  /** The icon to render. Alias for `children`. Any ReactNode — `@cascivo/icons`
+   * ships ~440 ready-made SVG icon components, or pass your own. */
   icon?: ReactNode;
   size?: 'sm' | 'md' | 'lg';
   variant?: 'ghost' | 'outline' | 'filled';
@@ -3285,7 +3313,6 @@ declare function SwipeItem({
   trailingActions,
   className
 }: SwipeItemProps): import("react").JSX.Element;
-type SpaceStep$4 = 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12;
 /** A scalar value, or a per-breakpoint object keyed by the canonical scale. */
 type Responsive<T> = T | Partial<Record<'base' | 'sm' | 'md' | 'lg' | 'xl', T>>;
 /** Grid track alignment keyword (maps directly to `align-items` / `justify-items`). */
@@ -3293,7 +3320,7 @@ type GridAlign = 'start' | 'center' | 'end' | 'stretch';
 interface GridProps extends HTMLAttributes<HTMLDivElement> {
   /** Column count. A number, or `{ base, sm, md, lg, xl }` for responsive columns. */
   cols?: Responsive<number>;
-  gap?: SpaceStep$4;
+  gap?: SpaceStep;
   /** Block-axis alignment of items within their cells (`align-items`). Defaults to `stretch`. */
   align?: GridAlign;
   /** Inline-axis alignment of items within their cells (`justify-items`). Defaults to `stretch`. */
@@ -3319,10 +3346,9 @@ declare function GridItem({
   style,
   ...props
 }: GridItemProps): import("react").JSX.Element;
-type SpaceStep$3 = 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12;
 interface FlexProps extends HTMLAttributes<HTMLDivElement> {
   direction?: 'vertical' | 'horizontal';
-  gap?: SpaceStep$3;
+  gap?: SpaceStep;
   align?: 'start' | 'center' | 'end' | 'stretch';
   justify?: 'start' | 'center' | 'end' | 'between';
   wrap?: boolean;
@@ -3337,10 +3363,9 @@ declare function Flex({
   style,
   ...props
 }: FlexProps): import("react").JSX.Element;
-type SpaceStep$2 = 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12;
 interface ColumnsProps extends HTMLAttributes<HTMLDivElement> {
   count?: 2 | 3 | 4;
-  gap?: SpaceStep$2;
+  gap?: SpaceStep;
 }
 declare function Columns({
   count,
@@ -3359,9 +3384,8 @@ declare function Center({
   style,
   ...props
 }: CenterProps): import("react").JSX.Element;
-type SpaceStep$1 = 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12;
 interface SpacerProps extends HTMLAttributes<HTMLDivElement> {
-  size?: SpaceStep$1;
+  size?: SpaceStep;
 }
 declare function Spacer({
   size,
@@ -3369,7 +3393,6 @@ declare function Spacer({
   style,
   ...props
 }: SpacerProps): import("react").JSX.Element;
-type SpaceStep = 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12;
 interface AutoGridProps extends HTMLAttributes<HTMLDivElement> {
   /** Minimum track size before items wrap to fewer columns. */
   min?: string;
@@ -3389,18 +3412,26 @@ declare function AutoGrid({
  */
 declare function setTheme(next: string): void;
 /**
- * Read and set the active theme. The returned signal is reactive — a component
- * that reads `.value` re-renders when the theme changes (this hook calls
- * `useSignals()` for you, so it works in React apps with no Babel transform).
+ * Read and set the active theme. Returns the current theme **name** (a plain
+ * string) and a setter — the component re-renders when the theme changes with no
+ * signal handling on your part (this hook calls `useSignals()` for you, so it
+ * works in React apps with no Babel transform). This is the React-idiomatic shape;
+ * for signal-native code (`computed()`, `effect()`, Preact) use {@link themeSignal}.
  *
  * ```tsx
  * const [theme, setTheme] = useTheme()
- * return <button onClick={() => setTheme(theme.value === 'dark' ? 'light' : 'dark')}>
- *   {theme.value}
+ * return <button onClick={() => setTheme(theme === 'dark' ? 'light' : 'dark')}>
+ *   {theme}
  * </button>
  * ```
  */
-declare function useTheme(): readonly [Signal<string>, (next: string) => void];
+declare function useTheme(): readonly [string, (next: string) => void];
+/**
+ * The underlying theme signal, for signal-native code — `computed()`, `effect()`,
+ * or a Preact app where signals are natively reactive. Most React apps want
+ * {@link useTheme}, which hands back a plain string and handles subscription.
+ */
+declare function themeSignal(): Signal<string>;
 interface ThemeProviderProps {
   /**
    * Theme to use when nothing is persisted yet. When set, it **wins over** the
@@ -3491,4 +3522,4 @@ declare function themePreloadScript(options?: {
   attribute?: string;
   defaultTheme?: string;
 }): string;
-export { Accordion, AccordionContent, AccordionItem, AccordionItemProps, AccordionProps, AccordionTrigger, ActionSheet, ActionSheetAction, ActionSheetProps, Alert, AlertDialog, AlertDialogLabels, AlertDialogProps, AlertProps, AppShell, AppShellProps, AspectRatio, AspectRatioProps, AutoGrid, AutoGridProps, Avatar, AvatarGroup, AvatarGroupLabels, AvatarGroupProps, AvatarProps, Badge, BadgeProps, Blockquote, BlockquoteProps, BottomSheet, BottomSheetProps, Breadcrumb, BreadcrumbItem, BreadcrumbProps, Button, ButtonGroup, ButtonGroupProps, ButtonProps, Calendar, CalendarLabels, CalendarProps, Card, CardContent, CardContentProps, CardFooter, CardFooterProps, CardHeader, CardHeaderProps, CardProps, CardTitle, CardTitleProps, Carousel, CarouselLabels, CarouselProps, Center, CenterProps, ChatBubble, ChatBubbleProps, ChatBubbleSide, Checkbox, CheckboxCard, CheckboxCardProps, CheckboxProps, Code, type CodeLang, CodeProps, CodeSnippet, CodeSnippetProps, Collapsible, CollapsibleProps, ColorPicker, ColorPickerLabels, ColorPickerProps, Column, Columns, ColumnsProps, Combobox, ComboboxLabels, ComboboxOption, ComboboxProps, CommandAction, CommandGroup, CommandItem, CommandMenu, CommandMenuProps, CommandPage, CommandScope, CommandStatus, Comparison, ComparisonProps, ContainedList, ContainedListItem, ContainedListItemProps, ContainedListProps, ContextMenu, ContextMenuItem, ContextMenuItemProps, ContextMenuProps, CopyButton, CopyButtonProps, DataList, DataListItem, DataListProps, DataTable, DataTableLabels, DataTableProps, DatePicker, DatePickerLabels, DatePickerProps, DateRange, DateRangePicker, DateRangePickerLabels, DateRangePickerProps, DateRangePreset, Dock, DockItem, DockProps, Drawer, DrawerProps, Dropdown, DropdownItem, DropdownProps, Editable, EditableProps, EmptyState, EmptyStateProps, ErrorBoundary, Fab, FabAction, FabProps, Field, FieldProps, FileUploader, FileUploaderLabels, FileUploaderProps, Filter, FilterOption, FilterProps, FilterVariant, Flex, FlexProps, FocusScope, Form, FormConfig, FormProps, FormStore, FuzzyMatch, Grid, GridAlign, GridItem, GridItemProps, GridProps, Header, HeaderLabels, HeaderLink, HeaderPanel, HeaderPanelLabels, HeaderPanelProps, HeaderProps, Heading, HeadingLevel, HeadingProps, HeadingSize, HoverCard, HoverCardContent, HoverCardContentProps, HoverCardProps, HoverCardTrigger, HoverCardTriggerProps, IconButton, IconButtonProps, Image, ImageProps, Indicator, IndicatorPlacement, IndicatorProps, InlineLoading, InlineLoadingProps, InlineLoadingStatus, Input, InputGroup, InputGroupAddon, type InputGroupAddonProps, type InputGroupProps, InputProps, Item, ItemActions, ItemActionsProps, ItemContent, ItemContentProps, ItemDescription, ItemDescriptionProps, ItemMedia, ItemMediaProps, ItemProps, ItemTitle, ItemTitleProps, Join, JoinOrientation, JoinProps, Kbd, KbdProps, Label, LabelProps, Link, type LinkComponent, type LinkComponentProps, LinkProps, List, ListItem, ListItemProps, ListProps, LogLevel, LogLine, LogViewer, LogViewerLabels, LogViewerProps, Menu, MenuButton, MenuButtonItem, MenuButtonProps, MenuItem, MenuItemProps, MenuProps, MenuSeparator, MenuTrigger, MenuTriggerProps, Menubar, MenubarItem, MenubarMenu, MenubarProps, Modal, ModalProps, MultiSelect, MultiSelectLabels, MultiSelectOption, MultiSelectProps, NativeSelect, NativeSelectOption, NativeSelectProps, NavigationMenu, NavigationMenuItem, NavigationMenuProps, Notification, NotificationProps, NotificationVariant, NumberInput, NumberInputProps, OtpInput, OtpInputProps, OverflowMenu, OverflowMenuItem, OverflowMenuProps, Pagination, PaginationLabels, PaginationProps, PasswordInput, PasswordInputLabels, PasswordInputProps, Popover, PopoverContent, PopoverContentProps, PopoverProps, PopoverTrigger, PopoverTriggerProps, Portal, Progress, ProgressBar, ProgressBarProps, ProgressCircle, ProgressCircleProps, ProgressIndicator, ProgressIndicatorProps, ProgressProps, ProgressSize, ProgressStep, ProgressVariant, Prose, ProseProps, PullToRefresh, PullToRefreshProps, QrCode, QrCodeProps, RadialProgress, RadialProgressProps, RadialProgressSize, RadialProgressVariant, Radio, RadioCard, RadioCardGroup, RadioCardGroupProps, RadioCardProps, RadioGroup, RadioGroupProps, RadioProps, RatingGroup, RatingGroupLabels, RatingGroupProps, RelativeTime, RelativeTimeProps, Resizable, ResizableProps, Responsive, ScrollArea, ScrollAreaProps, Search, SearchProps, SegmentedControl, SegmentedControlOption, SegmentedControlProps, Select, SelectOption, SelectProps, Separator, SeparatorProps, Sheet, SheetProps, ShellHeader, ShellHeaderAction, ShellHeaderBrand, ShellHeaderLabels, ShellHeaderNavItem, ShellHeaderNavLink, ShellHeaderNavMenu, ShellHeaderNavMenuItem, ShellHeaderProps, SideNav, SideNavGroup, SideNavItem, SideNavLinkProps, SideNavLinkSubItem, SideNavProps, SideNavSubItem, SideNavTone, Skeleton, SkeletonProps, SkipNavLink, SkipNavLinkProps, SkipNavTarget, SkipNavTargetProps, Slider, SliderProps, SortDirection, SortState, Spacer, SpacerProps, Spinner, SpinnerProps, Stack, StackProps, type StandardSchemaV1, Stat, StatProps, Status, StatusProps, Step, StepState, Steps, StepsProps, StructuredList, StructuredListItem, StructuredListProps, SuspenseBoundary, Swap, SwapMode, SwapProps, SwipeAction, SwipeItem, SwipeItemProps, Switcher, SwitcherEntry, SwitcherLink, SwitcherProps, Tabs, TabsContent, TabsContentProps, TabsList, TabsProps, TabsTrigger, TabsTriggerProps, Tag$1 as Tag, TagProps, TagsInput, TagsInputProps, Text, TextProps, Textarea, TextareaProps, ThemeProvider, type ThemeProviderProps, Tile, TileProps, TimePicker, TimePickerProps, Timeline, TimelineItem, TimelineProps, ToastOptions, ToastProvider, ToastVariant, Toc, TocItem, TocProps, Toggle, ToggleGroup, ToggleGroupItem, ToggleGroupProps, ToggleProps, Toggletip, ToggletipPlacement, ToggletipProps, Tooltip, TooltipProps, TreeNode, TreeView, TreeViewProps, UploaderFile, type UsePopoverOptions, type UsePopoverReturn, type UseTocFromRegionOptions, User, UserProps, VisuallyHidden, VisuallyHiddenProps, createForm, dismissAllToasts, fuzzyMatch, fuzzyScore, getLinkComponent, setLinkComponent, setTheme, themePreloadScript, treeViewMessages, useForm, usePopover, useTheme, useToast, useTocFromRegion };
+export { Accordion, AccordionContent, AccordionItem, AccordionItemProps, AccordionProps, AccordionTrigger, ActionSheet, ActionSheetAction, ActionSheetProps, Alert, AlertDialog, AlertDialogLabels, AlertDialogProps, AlertProps, AppShell, AppShellProps, AspectRatio, AspectRatioProps, AutoGrid, AutoGridProps, Avatar, AvatarGroup, AvatarGroupLabels, AvatarGroupProps, AvatarProps, Badge, BadgeProps, Blockquote, BlockquoteProps, BottomSheet, BottomSheetProps, Breadcrumb, BreadcrumbItem, BreadcrumbProps, Button, ButtonGroup, ButtonGroupProps, ButtonProps, Calendar, CalendarLabels, CalendarProps, Card, CardContent, CardContentProps, CardFooter, CardFooterProps, CardHeader, CardHeaderProps, CardProps, CardTitle, CardTitleProps, Carousel, CarouselLabels, CarouselProps, Center, CenterProps, ChatBubble, ChatBubbleProps, ChatBubbleSide, Checkbox, CheckboxCard, CheckboxCardProps, CheckboxProps, Code, type CodeLang, CodeProps, CodeSnippet, CodeSnippetProps, Collapsible, CollapsibleProps, ColorPicker, ColorPickerLabels, ColorPickerProps, Column, Columns, ColumnsProps, Combobox, ComboboxLabels, ComboboxOption, ComboboxProps, CommandAction, CommandGroup, CommandItem, CommandMenu, CommandMenuProps, CommandPage, CommandScope, CommandStatus, Comparison, ComparisonProps, ContainedList, ContainedListItem, ContainedListItemProps, ContainedListProps, ContextMenu, ContextMenuItem, ContextMenuItemProps, ContextMenuProps, CopyButton, CopyButtonProps, DataList, DataListItem, DataListProps, DataTable, DataTableLabels, DataTableProps, DatePicker, DatePickerLabels, DatePickerProps, DateRange, DateRangePicker, DateRangePickerLabels, DateRangePickerProps, DateRangePreset, Dock, DockItem, DockProps, Drawer, DrawerProps, Dropdown, DropdownItem, DropdownProps, Editable, EditableProps, EmptyState, EmptyStateProps, ErrorBoundary, Fab, FabAction, FabProps, Field, FieldProps, FileUploader, FileUploaderLabels, FileUploaderProps, Filter, FilterOption, FilterProps, FilterVariant, Flex, FlexProps, FocusScope, Form, FormConfig, FormProps, FormStore, FuzzyMatch, Grid, GridAlign, GridItem, GridItemProps, GridProps, Header, HeaderLabels, HeaderLink, HeaderPanel, HeaderPanelLabels, HeaderPanelProps, HeaderProps, Heading, HeadingLevel, HeadingProps, HeadingSize, HoverCard, HoverCardContent, HoverCardContentProps, HoverCardProps, HoverCardTrigger, HoverCardTriggerProps, IconButton, IconButtonProps, Image, ImageProps, Indicator, IndicatorPlacement, IndicatorProps, InlineLoading, InlineLoadingProps, InlineLoadingStatus, Input, InputGroup, InputGroupAddon, type InputGroupAddonProps, type InputGroupProps, InputProps, Item, ItemActions, ItemActionsProps, ItemContent, ItemContentProps, ItemDescription, ItemDescriptionProps, ItemMedia, ItemMediaProps, ItemProps, ItemTitle, ItemTitleProps, Join, JoinOrientation, JoinProps, Kbd, KbdProps, Label, LabelProps, Link, type LinkComponent, type LinkComponentProps, LinkProps, List, ListItem, ListItemProps, ListProps, LogLevel, LogLine, LogViewer, LogViewerLabels, LogViewerProps, Menu, MenuButton, MenuButtonItem, MenuButtonProps, MenuItem, MenuItemProps, MenuProps, MenuSeparator, MenuTrigger, MenuTriggerProps, Menubar, MenubarItem, MenubarMenu, MenubarProps, Modal, ModalProps, MultiSelect, MultiSelectLabels, MultiSelectOption, MultiSelectProps, NativeSelect, NativeSelectOption, NativeSelectProps, NavigationMenu, NavigationMenuItem, NavigationMenuProps, Notification, NotificationProps, NotificationVariant, NumberInput, NumberInputProps, OtpInput, OtpInputProps, OverflowMenu, OverflowMenuItem, OverflowMenuProps, Pagination, PaginationLabels, PaginationProps, PasswordInput, PasswordInputLabels, PasswordInputProps, Popover, PopoverContent, PopoverContentProps, PopoverProps, PopoverTrigger, PopoverTriggerProps, Portal, Progress, ProgressBar, ProgressBarProps, ProgressCircle, ProgressCircleProps, ProgressIndicator, ProgressIndicatorProps, ProgressProps, ProgressSize, ProgressStep, ProgressVariant, Prose, ProseProps, PullToRefresh, PullToRefreshProps, QrCode, QrCodeProps, RadialProgress, RadialProgressProps, RadialProgressSize, RadialProgressVariant, Radio, RadioCard, RadioCardGroup, RadioCardGroupProps, RadioCardProps, RadioGroup, RadioGroupProps, RadioProps, RatingGroup, RatingGroupLabels, RatingGroupProps, RelativeTime, RelativeTimeProps, Resizable, ResizableProps, Responsive, ScrollArea, ScrollAreaProps, Search, SearchProps, SegmentedControl, SegmentedControlOption, SegmentedControlProps, Select, SelectOption, SelectProps, Separator, SeparatorProps, Sheet, SheetProps, ShellHeader, ShellHeaderAction, ShellHeaderBrand, ShellHeaderLabels, ShellHeaderNavItem, ShellHeaderNavLink, ShellHeaderNavMenu, ShellHeaderNavMenuItem, ShellHeaderProps, SideNav, SideNavGroup, SideNavItem, SideNavLinkProps, SideNavLinkSubItem, SideNavProps, SideNavSubItem, SideNavTone, Skeleton, SkeletonProps, SkipNavLink, SkipNavLinkProps, SkipNavTarget, SkipNavTargetProps, Slider, SliderProps, SortDirection, SortState, Spacer, SpacerProps, Spinner, SpinnerProps, Stack, StackProps, type StandardSchemaV1, Stat, StatProps, Status, StatusProps, Step, StepState, Steps, StepsProps, StructuredList, StructuredListItem, StructuredListProps, SuspenseBoundary, Swap, SwapMode, SwapProps, SwipeAction, SwipeItem, SwipeItemProps, Switcher, SwitcherEntry, SwitcherLink, SwitcherProps, Tabs, TabsContent, TabsContentProps, TabsList, TabsProps, TabsTrigger, TabsTriggerProps, Tag, TagProps, TagsInput, TagsInputProps, Text, TextProps, Textarea, TextareaProps, ThemeProvider, type ThemeProviderProps, Tile, TileProps, TimePicker, TimePickerProps, Timeline, TimelineItem, TimelineProps, ToastOptions, ToastProvider, ToastVariant, Toc, TocItem, TocProps, Toggle, ToggleGroup, ToggleGroupItem, ToggleGroupProps, ToggleProps, Toggletip, ToggletipPlacement, ToggletipProps, Tooltip, TooltipProps, TreeNode, TreeView, TreeViewProps, UploaderFile, type UsePopoverOptions, type UsePopoverReturn, type UseTocFromRegionOptions, User, UserProps, VisuallyHidden, VisuallyHiddenProps, createForm, dismissAllToasts, fuzzyMatch, fuzzyScore, getLinkComponent, setLinkComponent, setTheme, themePreloadScript, themeSignal, treeViewMessages, useForm, usePopover, useTheme, useToast, useTocFromRegion };

package/dist/node/react/src/index.js

@@ -133,6 +133,6 @@ import { Columns as an } from "../../layouts/src/columns/columns.js";
 import { Center as on } from "../../layouts/src/center/center.js";
 import { Spacer as sn } from "../../layouts/src/spacer/spacer.js";
 import { AutoGrid as cn } from "../../layouts/src/auto-grid/auto-grid.js";
-import { ThemeProvider as ln, setTheme as un, themePreloadScript as dn, useTheme as fn } from "./theme.js";
-import { ErrorBoundary as pn, FocusScope as mn, Portal as hn, SuspenseBoundary as gn, getLinkComponent as _n, setLinkComponent as vn } from "@cascivo/core";
-export { M as Accordion, N as AccordionContent, P as AccordionItem, F as AccordionTrigger, I as ActionSheet, d as Alert, ye as AlertDialog, Xt as AppShell, vt as AspectRatio, cn as AutoGrid, f as Avatar, p as AvatarGroup, c as Badge, et as Blockquote, xe as BottomSheet, z as Breadcrumb, t as Button, ft as ButtonGroup, It as Calendar, r as Card, i as CardContent, a as CardFooter, o as CardHeader, s as CardTitle, zt as Carousel, on as Center, Zt as ChatBubble, v as Checkbox, He as CheckboxCard, $e as Code, Wt as CodeSnippet, _t as Collapsible, Rt as ColorPicker, an as Columns, ce as Combobox, ne as CommandMenu, we as Comparison, Et as ContainedList, Dt as ContainedListItem, Se as ContextMenu, Ce as ContextMenuItem, Ue as CopyButton, Ot as DataList, te as DataTable, le as DatePicker, Lt as DateRangePicker, Vt as Dock, Ht as Drawer, w as Dropdown, Ie as Editable, X as EmptyState, pn as ErrorBoundary, Z as Fab, lt as Field, ue as FileUploader, ut as Filter, rn as Flex, mn as FocusScope, ae as Form, tn as Grid, nn as GridItem, H as Header, Be as HeaderPanel, Ze as Heading, Te as HoverCard, Ee as HoverCardContent, De as HoverCardTrigger, dt as IconButton, h as Image, qt as Indicator, mt as InlineLoading, n as Input, Ne as InputGroup, Pe as InputGroupAddon, At as Item, jt as ItemActions, Mt as ItemContent, Nt as ItemDescription, Pt as ItemMedia, Ft as ItemTitle, Jt as Join, L as Kbd, ct as Label, R as Link, tt as List, nt as ListItem, rt as LogViewer, he as Menu, yt as MenuButton, ge as MenuItem, _e as MenuSeparator, ve as MenuTrigger, xt as Menubar, l as Modal, ke as MultiSelect, Ut as NativeSelect, St as NavigationMenu, ht as Notification, ee as NumberInput, je as OtpInput, Q as OverflowMenu, G as Pagination, Oe as PasswordInput, fe as Popover, pe as PopoverContent, me as PopoverTrigger, hn as Portal, Ye as Progress, Y as ProgressBar, Xe as ProgressCircle, K as ProgressIndicator, it as Prose, at as PullToRefresh, ot as QrCode, Qt as RadialProgress, y as Radio, Le as RadioCard, Re as RadioCardGroup, b as RadioGroup, Fe as RatingGroup, st as RelativeTime, Bt as Resizable, gt as ScrollArea, $ as Search, Me as SegmentedControl, _ as Select, u as Separator, be as Sheet, ze as ShellHeader, W as SideNav, J as Skeleton, qe as SkipNavLink, Je as SkipNavTarget, S as Slider, sn as Spacer, e as Spinner, Yt as Stack, We as Stat, Ge as Status, Gt as Steps, Tt as StructuredList, gn as SuspenseBoundary, $t as Swap, en as SwipeItem, Ve as Switcher, O as Tabs, k as TabsContent, A as TabsList, j as TabsTrigger, q as Tag, Ae as TagsInput, Qe as Text, g as Textarea, ln as ThemeProvider, Kt as Tile, de as TimePicker, kt as Timeline, T as ToastProvider, B as Toc, x as Toggle, pt as ToggleGroup, bt as Toggletip, C as Tooltip, Ct as TreeView, m as User, Ke as VisuallyHidden, oe as createForm, E as dismissAllToasts, re as fuzzyMatch, ie as fuzzyScore, _n as getLinkComponent, vn as setLinkComponent, un as setTheme, dn as themePreloadScript, wt as treeViewMessages, se as useForm, U as usePopover, fn as useTheme, D as useToast, V as useTocFromRegion };
+import { ThemeProvider as ln, setTheme as un, themePreloadScript as dn, themeSignal as fn, useTheme as pn } from "./theme.js";
+import { ErrorBoundary as mn, FocusScope as hn, Portal as gn, SuspenseBoundary as _n, getLinkComponent as vn, setLinkComponent as yn } from "@cascivo/core";
+export { M as Accordion, N as AccordionContent, P as AccordionItem, F as AccordionTrigger, I as ActionSheet, d as Alert, ye as AlertDialog, Xt as AppShell, vt as AspectRatio, cn as AutoGrid, f as Avatar, p as AvatarGroup, c as Badge, et as Blockquote, xe as BottomSheet, z as Breadcrumb, t as Button, ft as ButtonGroup, It as Calendar, r as Card, i as CardContent, a as CardFooter, o as CardHeader, s as CardTitle, zt as Carousel, on as Center, Zt as ChatBubble, v as Checkbox, He as CheckboxCard, $e as Code, Wt as CodeSnippet, _t as Collapsible, Rt as ColorPicker, an as Columns, ce as Combobox, ne as CommandMenu, we as Comparison, Et as ContainedList, Dt as ContainedListItem, Se as ContextMenu, Ce as ContextMenuItem, Ue as CopyButton, Ot as DataList, te as DataTable, le as DatePicker, Lt as DateRangePicker, Vt as Dock, Ht as Drawer, w as Dropdown, Ie as Editable, X as EmptyState, mn as ErrorBoundary, Z as Fab, lt as Field, ue as FileUploader, ut as Filter, rn as Flex, hn as FocusScope, ae as Form, tn as Grid, nn as GridItem, H as Header, Be as HeaderPanel, Ze as Heading, Te as HoverCard, Ee as HoverCardContent, De as HoverCardTrigger, dt as IconButton, h as Image, qt as Indicator, mt as InlineLoading, n as Input, Ne as InputGroup, Pe as InputGroupAddon, At as Item, jt as ItemActions, Mt as ItemContent, Nt as ItemDescription, Pt as ItemMedia, Ft as ItemTitle, Jt as Join, L as Kbd, ct as Label, R as Link, tt as List, nt as ListItem, rt as LogViewer, he as Menu, yt as MenuButton, ge as MenuItem, _e as MenuSeparator, ve as MenuTrigger, xt as Menubar, l as Modal, ke as MultiSelect, Ut as NativeSelect, St as NavigationMenu, ht as Notification, ee as NumberInput, je as OtpInput, Q as OverflowMenu, G as Pagination, Oe as PasswordInput, fe as Popover, pe as PopoverContent, me as PopoverTrigger, gn as Portal, Ye as Progress, Y as ProgressBar, Xe as ProgressCircle, K as ProgressIndicator, it as Prose, at as PullToRefresh, ot as QrCode, Qt as RadialProgress, y as Radio, Le as RadioCard, Re as RadioCardGroup, b as RadioGroup, Fe as RatingGroup, st as RelativeTime, Bt as Resizable, gt as ScrollArea, $ as Search, Me as SegmentedControl, _ as Select, u as Separator, be as Sheet, ze as ShellHeader, W as SideNav, J as Skeleton, qe as SkipNavLink, Je as SkipNavTarget, S as Slider, sn as Spacer, e as Spinner, Yt as Stack, We as Stat, Ge as Status, Gt as Steps, Tt as StructuredList, _n as SuspenseBoundary, $t as Swap, en as SwipeItem, Ve as Switcher, O as Tabs, k as TabsContent, A as TabsList, j as TabsTrigger, q as Tag, Ae as TagsInput, Qe as Text, g as Textarea, ln as ThemeProvider, Kt as Tile, de as TimePicker, kt as Timeline, T as ToastProvider, B as Toc, x as Toggle, pt as ToggleGroup, bt as Toggletip, C as Tooltip, Ct as TreeView, m as User, Ke as VisuallyHidden, oe as createForm, E as dismissAllToasts, re as fuzzyMatch, ie as fuzzyScore, vn as getLinkComponent, yn as setLinkComponent, un as setTheme, dn as themePreloadScript, fn as themeSignal, wt as treeViewMessages, se as useForm, U as usePopover, pn as useTheme, D as useToast, V as useTocFromRegion };

package/dist/node/react/src/theme.js

@@ -5,50 +5,63 @@ import { useSignalEffect as t, useSignals as n } from "@cascivo/core";
 import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
 import { useRef as o } from "react";
 //#region src/theme.tsx
-var s = "cascivo-theme", c = "data-theme", l = null, u = {
+var s = "cascivo-theme", c = "data-theme";
+function l() {
+	return globalThis.process?.env?.NODE_ENV !== "production";
+}
+var u = /* @__PURE__ */ new Set();
+function d(e, t) {
+	l() && (e === null || typeof document > "u" || typeof requestAnimationFrame != "function" || u.has(t) || requestAnimationFrame(() => {
+		u.has(t) || getComputedStyle(e).getPropertyValue("--cascivo-color-accent").trim() === "" && (u.add(t), console.warn(`cascivo ThemeProvider: data-theme=${JSON.stringify(t)} was set, but no cascivo theme CSS defines it — every --cascivo-color-* token is unresolved, so components render grayscale. Import '@cascivo/themes/all.css' once in your entry (or '@cascivo/react/styles.css', which bundles the light and dark themes). Using a custom theme? Ensure its stylesheet is loaded and defines [data-theme=${JSON.stringify(t)}]. Docs: https://cascivo.com/docs/theming — offline: npx -y @cascivo/docs guide theming`));
+	}));
+}
+var f = null, p = {
 	storageKey: s,
 	defaultTheme: "light",
 	explicit: !1
 };
-function d(e) {
+function m(e) {
 	return typeof window > "u" || typeof window.matchMedia != "function" ? e : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : window.matchMedia("(prefers-color-scheme: light)").matches ? "light" : e;
 }
-function f() {
-	return u.explicit ? u.defaultTheme : d(u.defaultTheme);
+function h() {
+	return p.explicit ? p.defaultTheme : m(p.defaultTheme);
 }
-function p() {
-	return l ??= e(u.storageKey, f()), l;
+function g() {
+	return f ??= e(p.storageKey, h()), f;
 }
-function m(e) {
-	p().value = e;
+function _(e) {
+	g().value = e;
 }
-function h() {
-	return n(), [p(), m];
+function v() {
+	return n(), [g().value, _];
+}
+function y() {
+	return g();
 }
-function g(e) {
+function b(e) {
 	return JSON.stringify(e).replace(/</g, "\\u003c");
 }
-function _({ defaultTheme: e, value: n, storageKey: d = s, attribute: f = c, target: m, onChange: h, nonce: _, children: v }) {
+function x({ defaultTheme: e, value: n, storageKey: l = s, attribute: u = c, target: m, onChange: h, nonce: _, children: v }) {
 	let y = o(!1);
-	y.current || (y.current = !0, (l === null || u.storageKey !== d) && (u = {
-		storageKey: d,
+	y.current || (y.current = !0, (f === null || p.storageKey !== l) && (p = {
+		storageKey: l,
 		defaultTheme: e ?? "light",
 		explicit: e !== void 0
-	}, l = null));
-	let b = p();
-	n !== void 0 && (b.value = n);
-	let x = o(h);
-	return x.current = h, t(() => {
-		let e = b.value;
-		(m ? m.current : typeof document < "u" ? document.documentElement : null)?.setAttribute(f, e), x.current?.(e);
+	}, f = null));
+	let x = g();
+	n !== void 0 && (x.value = n);
+	let S = o(h);
+	return S.current = h, t(() => {
+		let e = x.value, t = m ? m.current : typeof document < "u" ? document.documentElement : null;
+		t?.setAttribute(u, e), d(t, e), S.current?.(e);
 	}), n !== void 0 && !m ? /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("script", {
 		nonce: _,
-		dangerouslySetInnerHTML: { __html: `document.documentElement.setAttribute(${g(f)},${g(n)})` }
+		dangerouslySetInnerHTML: { __html: `document.documentElement.setAttribute(${b(u)},${b(n)})` }
 	}), v] }) : /* @__PURE__ */ i(r, { children: v });
 }
-function v(e = {}) {
+function S(e = {}) {
 	let t = JSON.stringify(e.storageKey ?? s), n = JSON.stringify(e.attribute ?? c), r = JSON.stringify(e.defaultTheme ?? "light"), i = e.defaultTheme === void 0 ? "if(typeof matchMedia==='function'){if(matchMedia('(prefers-color-scheme: dark)').matches)v='dark';else if(matchMedia('(prefers-color-scheme: light)').matches)v='light';}" : "";
 	return `(function(){try{var v=${r};` + i + `var raw=localStorage.getItem(${t});if(raw){v=raw;try{var e=JSON.parse(raw);if(e&&typeof e==='object'&&'value'in e)v=e.value;}catch(_){}}document.documentElement.setAttribute(${n},v);}catch(_){}})();`;
 }
 //#endregion
-export { _ as ThemeProvider, m as setTheme, v as themePreloadScript, h as useTheme };
+export { x as ThemeProvider, _ as setTheme, S as themePreloadScript, y as themeSignal, v as useTheme };

package/dist/react/src/index.js

@@ -133,6 +133,6 @@ import { Columns as an } from "../../layouts/src/columns/columns.js";
 import { Center as on } from "../../layouts/src/center/center.js";
 import { Spacer as sn } from "../../layouts/src/spacer/spacer.js";
 import { AutoGrid as cn } from "../../layouts/src/auto-grid/auto-grid.js";
-import { ThemeProvider as ln, setTheme as un, themePreloadScript as dn, useTheme as fn } from "./theme.js";
-import { ErrorBoundary as pn, FocusScope as mn, Portal as hn, SuspenseBoundary as gn, getLinkComponent as _n, setLinkComponent as vn } from "@cascivo/core";
-export { M as Accordion, N as AccordionContent, P as AccordionItem, F as AccordionTrigger, I as ActionSheet, d as Alert, ye as AlertDialog, Xt as AppShell, vt as AspectRatio, cn as AutoGrid, f as Avatar, p as AvatarGroup, c as Badge, et as Blockquote, xe as BottomSheet, z as Breadcrumb, t as Button, ft as ButtonGroup, It as Calendar, r as Card, i as CardContent, a as CardFooter, o as CardHeader, s as CardTitle, zt as Carousel, on as Center, Zt as ChatBubble, v as Checkbox, He as CheckboxCard, $e as Code, Wt as CodeSnippet, _t as Collapsible, Rt as ColorPicker, an as Columns, ce as Combobox, ne as CommandMenu, we as Comparison, Et as ContainedList, Dt as ContainedListItem, Se as ContextMenu, Ce as ContextMenuItem, Ue as CopyButton, Ot as DataList, te as DataTable, le as DatePicker, Lt as DateRangePicker, Vt as Dock, Ht as Drawer, w as Dropdown, Ie as Editable, X as EmptyState, pn as ErrorBoundary, Z as Fab, lt as Field, ue as FileUploader, ut as Filter, rn as Flex, mn as FocusScope, ae as Form, tn as Grid, nn as GridItem, H as Header, Be as HeaderPanel, Ze as Heading, Te as HoverCard, Ee as HoverCardContent, De as HoverCardTrigger, dt as IconButton, h as Image, qt as Indicator, mt as InlineLoading, n as Input, Ne as InputGroup, Pe as InputGroupAddon, At as Item, jt as ItemActions, Mt as ItemContent, Nt as ItemDescription, Pt as ItemMedia, Ft as ItemTitle, Jt as Join, L as Kbd, ct as Label, R as Link, tt as List, nt as ListItem, rt as LogViewer, he as Menu, yt as MenuButton, ge as MenuItem, _e as MenuSeparator, ve as MenuTrigger, xt as Menubar, l as Modal, ke as MultiSelect, Ut as NativeSelect, St as NavigationMenu, ht as Notification, ee as NumberInput, je as OtpInput, Q as OverflowMenu, G as Pagination, Oe as PasswordInput, fe as Popover, pe as PopoverContent, me as PopoverTrigger, hn as Portal, Ye as Progress, Y as ProgressBar, Xe as ProgressCircle, K as ProgressIndicator, it as Prose, at as PullToRefresh, ot as QrCode, Qt as RadialProgress, y as Radio, Le as RadioCard, Re as RadioCardGroup, b as RadioGroup, Fe as RatingGroup, st as RelativeTime, Bt as Resizable, gt as ScrollArea, $ as Search, Me as SegmentedControl, _ as Select, u as Separator, be as Sheet, ze as ShellHeader, W as SideNav, J as Skeleton, qe as SkipNavLink, Je as SkipNavTarget, S as Slider, sn as Spacer, e as Spinner, Yt as Stack, We as Stat, Ge as Status, Gt as Steps, Tt as StructuredList, gn as SuspenseBoundary, $t as Swap, en as SwipeItem, Ve as Switcher, O as Tabs, k as TabsContent, A as TabsList, j as TabsTrigger, q as Tag, Ae as TagsInput, Qe as Text, g as Textarea, ln as ThemeProvider, Kt as Tile, de as TimePicker, kt as Timeline, T as ToastProvider, B as Toc, x as Toggle, pt as ToggleGroup, bt as Toggletip, C as Tooltip, Ct as TreeView, m as User, Ke as VisuallyHidden, oe as createForm, E as dismissAllToasts, re as fuzzyMatch, ie as fuzzyScore, _n as getLinkComponent, vn as setLinkComponent, un as setTheme, dn as themePreloadScript, wt as treeViewMessages, se as useForm, U as usePopover, fn as useTheme, D as useToast, V as useTocFromRegion };
+import { ThemeProvider as ln, setTheme as un, themePreloadScript as dn, themeSignal as fn, useTheme as pn } from "./theme.js";
+import { ErrorBoundary as mn, FocusScope as hn, Portal as gn, SuspenseBoundary as _n, getLinkComponent as vn, setLinkComponent as yn } from "@cascivo/core";
+export { M as Accordion, N as AccordionContent, P as AccordionItem, F as AccordionTrigger, I as ActionSheet, d as Alert, ye as AlertDialog, Xt as AppShell, vt as AspectRatio, cn as AutoGrid, f as Avatar, p as AvatarGroup, c as Badge, et as Blockquote, xe as BottomSheet, z as Breadcrumb, t as Button, ft as ButtonGroup, It as Calendar, r as Card, i as CardContent, a as CardFooter, o as CardHeader, s as CardTitle, zt as Carousel, on as Center, Zt as ChatBubble, v as Checkbox, He as CheckboxCard, $e as Code, Wt as CodeSnippet, _t as Collapsible, Rt as ColorPicker, an as Columns, ce as Combobox, ne as CommandMenu, we as Comparison, Et as ContainedList, Dt as ContainedListItem, Se as ContextMenu, Ce as ContextMenuItem, Ue as CopyButton, Ot as DataList, te as DataTable, le as DatePicker, Lt as DateRangePicker, Vt as Dock, Ht as Drawer, w as Dropdown, Ie as Editable, X as EmptyState, mn as ErrorBoundary, Z as Fab, lt as Field, ue as FileUploader, ut as Filter, rn as Flex, hn as FocusScope, ae as Form, tn as Grid, nn as GridItem, H as Header, Be as HeaderPanel, Ze as Heading, Te as HoverCard, Ee as HoverCardContent, De as HoverCardTrigger, dt as IconButton, h as Image, qt as Indicator, mt as InlineLoading, n as Input, Ne as InputGroup, Pe as InputGroupAddon, At as Item, jt as ItemActions, Mt as ItemContent, Nt as ItemDescription, Pt as ItemMedia, Ft as ItemTitle, Jt as Join, L as Kbd, ct as Label, R as Link, tt as List, nt as ListItem, rt as LogViewer, he as Menu, yt as MenuButton, ge as MenuItem, _e as MenuSeparator, ve as MenuTrigger, xt as Menubar, l as Modal, ke as MultiSelect, Ut as NativeSelect, St as NavigationMenu, ht as Notification, ee as NumberInput, je as OtpInput, Q as OverflowMenu, G as Pagination, Oe as PasswordInput, fe as Popover, pe as PopoverContent, me as PopoverTrigger, gn as Portal, Ye as Progress, Y as ProgressBar, Xe as ProgressCircle, K as ProgressIndicator, it as Prose, at as PullToRefresh, ot as QrCode, Qt as RadialProgress, y as Radio, Le as RadioCard, Re as RadioCardGroup, b as RadioGroup, Fe as RatingGroup, st as RelativeTime, Bt as Resizable, gt as ScrollArea, $ as Search, Me as SegmentedControl, _ as Select, u as Separator, be as Sheet, ze as ShellHeader, W as SideNav, J as Skeleton, qe as SkipNavLink, Je as SkipNavTarget, S as Slider, sn as Spacer, e as Spinner, Yt as Stack, We as Stat, Ge as Status, Gt as Steps, Tt as StructuredList, _n as SuspenseBoundary, $t as Swap, en as SwipeItem, Ve as Switcher, O as Tabs, k as TabsContent, A as TabsList, j as TabsTrigger, q as Tag, Ae as TagsInput, Qe as Text, g as Textarea, ln as ThemeProvider, Kt as Tile, de as TimePicker, kt as Timeline, T as ToastProvider, B as Toc, x as Toggle, pt as ToggleGroup, bt as Toggletip, C as Tooltip, Ct as TreeView, m as User, Ke as VisuallyHidden, oe as createForm, E as dismissAllToasts, re as fuzzyMatch, ie as fuzzyScore, vn as getLinkComponent, yn as setLinkComponent, un as setTheme, dn as themePreloadScript, fn as themeSignal, wt as treeViewMessages, se as useForm, U as usePopover, pn as useTheme, D as useToast, V as useTocFromRegion };

package/dist/react/src/theme.js

@@ -5,50 +5,63 @@ import { useSignalEffect as t, useSignals as n } from "@cascivo/core";
 import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
 import { useRef as o } from "react";
 //#region src/theme.tsx
-var s = "cascivo-theme", c = "data-theme", l = null, u = {
+var s = "cascivo-theme", c = "data-theme";
+function l() {
+	return globalThis.process?.env?.NODE_ENV !== "production";
+}
+var u = /* @__PURE__ */ new Set();
+function d(e, t) {
+	l() && (e === null || typeof document > "u" || typeof requestAnimationFrame != "function" || u.has(t) || requestAnimationFrame(() => {
+		u.has(t) || getComputedStyle(e).getPropertyValue("--cascivo-color-accent").trim() === "" && (u.add(t), console.warn(`cascivo ThemeProvider: data-theme=${JSON.stringify(t)} was set, but no cascivo theme CSS defines it — every --cascivo-color-* token is unresolved, so components render grayscale. Import '@cascivo/themes/all.css' once in your entry (or '@cascivo/react/styles.css', which bundles the light and dark themes). Using a custom theme? Ensure its stylesheet is loaded and defines [data-theme=${JSON.stringify(t)}]. Docs: https://cascivo.com/docs/theming — offline: npx -y @cascivo/docs guide theming`));
+	}));
+}
+var f = null, p = {
 	storageKey: s,
 	defaultTheme: "light",
 	explicit: !1
 };
-function d(e) {
+function m(e) {
 	return typeof window > "u" || typeof window.matchMedia != "function" ? e : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : window.matchMedia("(prefers-color-scheme: light)").matches ? "light" : e;
 }
-function f() {
-	return u.explicit ? u.defaultTheme : d(u.defaultTheme);
+function h() {
+	return p.explicit ? p.defaultTheme : m(p.defaultTheme);
 }
-function p() {
-	return l ??= e(u.storageKey, f()), l;
+function g() {
+	return f ??= e(p.storageKey, h()), f;
 }
-function m(e) {
-	p().value = e;
+function _(e) {
+	g().value = e;
 }
-function h() {
-	return n(), [p(), m];
+function v() {
+	return n(), [g().value, _];
+}
+function y() {
+	return g();
 }
-function g(e) {
+function b(e) {
 	return JSON.stringify(e).replace(/</g, "\\u003c");
 }
-function _({ defaultTheme: e, value: n, storageKey: d = s, attribute: f = c, target: m, onChange: h, nonce: _, children: v }) {
+function x({ defaultTheme: e, value: n, storageKey: l = s, attribute: u = c, target: m, onChange: h, nonce: _, children: v }) {
 	let y = o(!1);
-	y.current || (y.current = !0, (l === null || u.storageKey !== d) && (u = {
-		storageKey: d,
+	y.current || (y.current = !0, (f === null || p.storageKey !== l) && (p = {
+		storageKey: l,
 		defaultTheme: e ?? "light",
 		explicit: e !== void 0
-	}, l = null));
-	let b = p();
-	n !== void 0 && (b.value = n);
-	let x = o(h);
-	return x.current = h, t(() => {
-		let e = b.value;
-		(m ? m.current : typeof document < "u" ? document.documentElement : null)?.setAttribute(f, e), x.current?.(e);
+	}, f = null));
+	let x = g();
+	n !== void 0 && (x.value = n);
+	let S = o(h);
+	return S.current = h, t(() => {
+		let e = x.value, t = m ? m.current : typeof document < "u" ? document.documentElement : null;
+		t?.setAttribute(u, e), d(t, e), S.current?.(e);
 	}), n !== void 0 && !m ? /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("script", {
 		nonce: _,
-		dangerouslySetInnerHTML: { __html: `document.documentElement.setAttribute(${g(f)},${g(n)})` }
+		dangerouslySetInnerHTML: { __html: `document.documentElement.setAttribute(${b(u)},${b(n)})` }
 	}), v] }) : /* @__PURE__ */ i(r, { children: v });
 }
-function v(e = {}) {
+function S(e = {}) {
 	let t = JSON.stringify(e.storageKey ?? s), n = JSON.stringify(e.attribute ?? c), r = JSON.stringify(e.defaultTheme ?? "light"), i = e.defaultTheme === void 0 ? "if(typeof matchMedia==='function'){if(matchMedia('(prefers-color-scheme: dark)').matches)v='dark';else if(matchMedia('(prefers-color-scheme: light)').matches)v='light';}" : "";
 	return `(function(){try{var v=${r};` + i + `var raw=localStorage.getItem(${t});if(raw){v=raw;try{var e=JSON.parse(raw);if(e&&typeof e==='object'&&'value'in e)v=e.value;}catch(_){}}document.documentElement.setAttribute(${n},v);}catch(_){}})();`;
 }
 //#endregion
-export { _ as ThemeProvider, m as setTheme, v as themePreloadScript, h as useTheme };
+export { x as ThemeProvider, _ as setTheme, S as themePreloadScript, y as themeSignal, v as useTheme };