@hanzo/ui 8.4.10 → 8.4.12

package/dist/box.cjs

@@ -39,6 +39,21 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const gui_1 = require("@hanzo/gui");
 const tw_1 = require("./tw.cjs");
+/**
+ * The display each element has before any class touches it.
+ *
+ * Box stated `block` for everything, which is the div's answer and wrong for the
+ * inline ones: a converted `<a>` became a full-width block, so two links that had
+ * sat side by side in a sentence stacked and the footer grew from 47px to 112px.
+ * Anything absent here is `block`, which is right for div, p, section, the
+ * headings, the lists and the landmarks.
+ *
+ * A class still wins — `flex` says flex, and silence says whatever the element
+ * already was.
+ */
+const INLINE = new Set(['a', 'span', 'em', 'strong', 'b', 'i', 'u', 's', 'small',
+    'abbr', 'cite', 'code', 'kbd', 'samp', 'var', 'sub', 'sup', 'mark', 'q', 'time',
+    'label', 'output', 'bdi', 'bdo', 'ruby', 'wbr']);
 /** Properties a frame ignores and a DOM element passes to its children. */
 const TEXT_PROPS = ['fontSize', 'lineHeight', 'fontWeight', 'letterSpacing',
     'textTransform', 'fontFamily', 'fontStyle', 'textAlign', 'color',
@@ -76,12 +91,17 @@ const BoxInner = (0, react_1.forwardRef)(function Box({ className, children, 'ar
     // class said otherwise, so `leading-relaxed` still wins.
     if (!('lineHeight' in text))
         text.lineHeight = 'inherit';
+    // A list item needs `display: list-item` or it loses its marker, and gui's
+    // display prop has no such value — its set is block/contents/flex/inline/…
+    // So it rides as a plain style, where it also outranks the class gui emits.
+    if (tag === 'li' && !('display' in props))
+        text.display = 'list-item';
     const style = Object.keys(text).length
         ? { ...text, ...rest.style }
         : rest.style;
     // Explicit props win: a caller who states a value directly means it, and the
     // classes are what they are migrating away from.
-    const frame = ((0, jsx_runtime_1.jsx)(gui_1.YStack, { ref: tag ? undefined : ref, asChild: tag ? true : undefined, display: "block", 
+    const frame = ((0, jsx_runtime_1.jsx)(gui_1.YStack, { ref: tag ? undefined : ref, asChild: tag ? true : undefined, display: tag && INLINE.has(tag) ? 'inline' : 'block', 
         // A View does not shrink; a div does. Left at the View's default, every
         // converted flex child held its full basis and overflowed its row instead
         // of sharing it — two half-width columns came out 608px each in a 1216px

package/dist/box.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"box.d.ts","sourceRoot":"","sources":["../src/box.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AACjE,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACnC,OAAO,EAAM,KAAK,UAAU,EAAE,MAAM,MAAM,CAAA;AAa1C;;;;;;;;;GASG;AACH,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,MAAM,KAAK,CAAC,GAAG,CAAC,iBAAiB,GAAG,KAAK,IAWtE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EACpC,aAAa,GAAG,KAAK,GAAG,OAAO,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,GAAG,IAAI,GAC3E,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GACnE,SAAS,GAAG,QAAQ,GAAG,WAAW,GAAG,SAAS,GAAG,YAAY,GAC7D,cAAc,GAAG,cAAc,GAAG,aAAa,GAAG,WAAW,GAC7D,UAAU,GAAG,UAAU,GAAG,UAAU,CAAC,GACzC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC,GAAG;IAC3F,SAAS,CAAC,EAAE,UAAU,CAAA;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IACpB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B;;OAEG;IACH,GAAG,CAAC,EAAE,CAAC,CAAA;IACP;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA;CAC3C,CAAA;AAmEH;;;;;;;GAOG;AACH,eAAO,MAAM,GAAG,EAAe,CAAC,CAAC,SAAS,MAAM,KAAK,CAAC,GAAG,CAAC,iBAAiB,GAAG,KAAK,EACjF,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;CAAE,KAC1C,KAAK,CAAC,YAAY,GAAG,IAAI,CAAA;eAEf,GAAG"}
+{"version":3,"file":"box.d.ts","sourceRoot":"","sources":["../src/box.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AACjE,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACnC,OAAO,EAAM,KAAK,UAAU,EAAE,MAAM,MAAM,CAAA;AA6B1C;;;;;;;;;GASG;AACH,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,MAAM,KAAK,CAAC,GAAG,CAAC,iBAAiB,GAAG,KAAK,IAWtE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EACpC,aAAa,GAAG,KAAK,GAAG,OAAO,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,GAAG,IAAI,GAC3E,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GACnE,SAAS,GAAG,QAAQ,GAAG,WAAW,GAAG,SAAS,GAAG,YAAY,GAC7D,cAAc,GAAG,cAAc,GAAG,aAAa,GAAG,WAAW,GAC7D,UAAU,GAAG,UAAU,GAAG,UAAU,CAAC,GACzC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC,GAAG;IAC3F,SAAS,CAAC,EAAE,UAAU,CAAA;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IACpB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B;;OAEG;IACH,GAAG,CAAC,EAAE,CAAC,CAAA;IACP;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA;CAC3C,CAAA;AAuEH;;;;;;;GAOG;AACH,eAAO,MAAM,GAAG,EAAe,CAAC,CAAC,SAAS,MAAM,KAAK,CAAC,GAAG,CAAC,iBAAiB,GAAG,KAAK,EACjF,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;CAAE,KAC1C,KAAK,CAAC,YAAY,GAAG,IAAI,CAAA;eAEf,GAAG"}

package/dist/box.js

@@ -36,6 +36,21 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { createElement, forwardRef } from 'react';
 import { YStack } from '@hanzo/gui';
 import { tw } from './tw.js';
+/**
+ * The display each element has before any class touches it.
+ *
+ * Box stated `block` for everything, which is the div's answer and wrong for the
+ * inline ones: a converted `<a>` became a full-width block, so two links that had
+ * sat side by side in a sentence stacked and the footer grew from 47px to 112px.
+ * Anything absent here is `block`, which is right for div, p, section, the
+ * headings, the lists and the landmarks.
+ *
+ * A class still wins — `flex` says flex, and silence says whatever the element
+ * already was.
+ */
+const INLINE = new Set(['a', 'span', 'em', 'strong', 'b', 'i', 'u', 's', 'small',
+    'abbr', 'cite', 'code', 'kbd', 'samp', 'var', 'sub', 'sup', 'mark', 'q', 'time',
+    'label', 'output', 'bdi', 'bdo', 'ruby', 'wbr']);
 /** Properties a frame ignores and a DOM element passes to its children. */
 const TEXT_PROPS = ['fontSize', 'lineHeight', 'fontWeight', 'letterSpacing',
     'textTransform', 'fontFamily', 'fontStyle', 'textAlign', 'color',
@@ -73,12 +88,17 @@ const BoxInner = forwardRef(function Box({ className, children, 'aria-hidden': h
     // class said otherwise, so `leading-relaxed` still wins.
     if (!('lineHeight' in text))
         text.lineHeight = 'inherit';
+    // A list item needs `display: list-item` or it loses its marker, and gui's
+    // display prop has no such value — its set is block/contents/flex/inline/…
+    // So it rides as a plain style, where it also outranks the class gui emits.
+    if (tag === 'li' && !('display' in props))
+        text.display = 'list-item';
     const style = Object.keys(text).length
         ? { ...text, ...rest.style }
         : rest.style;
     // Explicit props win: a caller who states a value directly means it, and the
     // classes are what they are migrating away from.
-    const frame = (_jsx(YStack, { ref: tag ? undefined : ref, asChild: tag ? true : undefined, display: "block", 
+    const frame = (_jsx(YStack, { ref: tag ? undefined : ref, asChild: tag ? true : undefined, display: tag && INLINE.has(tag) ? 'inline' : 'block', 
         // A View does not shrink; a div does. Left at the View's default, every
         // converted flex child held its full basis and overflowed its row instead
         // of sharing it — two half-width columns came out 608px each in a 1216px

package/dist/box.js.map

@@ -1 +1 @@
-{"version":3,"file":"box.js","sourceRoot":"","sources":["../src/box.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"box.js","sourceRoot":"","sources":["../src/box.tsx"],"names":[],"mappings":"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"}

package/dist/gallery.html

@@ -1,4 +1,4 @@
-<!doctype html><html lang="en" class="t_dark"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>@hanzo/ui 8.4.10</title><style>/* @hanzo/ui — generated by scripts/gen-css.mjs. Do not edit. */
+<!doctype html><html lang="en" class="t_dark"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>@hanzo/ui 8.4.12</title><style>/* @hanzo/ui — generated by scripts/gen-css.mjs. Do not edit. */
 :root { --hanzo-ui-styles: 1; }
 /* Hanzo Design System — the entry point. Import THIS one file.
  *

package/dist/index.node.js

@@ -0,0 +1,65 @@
+// @hanzo/ui — the one Hanzo component library, on @hanzo/gui + @hanzo/design.
+//
+// ONE substrate: every component renders through @hanzo/gui primitives, so the
+// same import works on web, native (expo) and desktop (Tauri). The ROOT barrel is
+// the canonical component API apps import; the product layer and the design
+// tokens are their own subpaths, so importing a Button never drags in a chart.
+//
+//   import { Button, Card, Dialog, DropdownMenu, Input, Toaster } from '@hanzo/ui'  // component API
+//   import { PageHeader, Sparkline, EmptyState } from '@hanzo/ui/product'           // product/app layer
+//   import { RecordsView, registerField } from '@hanzo/ui/data'                     // metadata record layer
+//   import { ModelSelector } from '@hanzo/ui/models'                                // unified model picker
+//   import { cn, themes, colors } from '@hanzo/ui/core'                             // design core + tokens
+//   import '@hanzo/ui/theme.css'                                                    // the self-contained identity
+//
+// Styling is theme tokens, never utility classes: `$background`, `$color12`,
+// `$borderColor` resolve through the gui token config on every host. Touch
+// targets meet the 44px floor via `hitSlop`, never via padding.
+// Named, not `export *`.
+//
+// This module is a client boundary ('use client' above), and Next 16 refuses
+// `export *` across one: "It's currently unsupported to use `export *` in a client
+// boundary." Every app importing the root barrel failed to build on that one line.
+//
+// Naming them also restores tree-shaking, which `export *` defeats — a bundler
+// cannot prove which members are unused through a star, so importing Button pulled
+// the whole surface in.
+//
+// ./backends/gui declares these as explicit named blocks and this list mirrors it.
+//
+// It is maintained BY HAND — `scripts/gen-primitives.mjs` writes `src/primitives/`,
+// not this file, so nothing regenerates it and nothing used to notice when the two
+// drifted. Glass, Grid, Section and CardMedia were all exported by the backend and
+// absent here, which means a consumer could not import them AT ALL: the component
+// existed, the docs named it, and `import { Grid } from '@hanzo/ui'` was undefined.
+// `src/__tests__/barrel.test.ts` now fails when the two disagree.
+export { AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardMedia, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Em, Glass, Fill, H1, H2, H3, H4, H5, H6, Heading, Image, Input, Label, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Paragraph, Screen, ScrollView, Section, Separator, SizableText, Slider, Spacer, Span, Spinner, Strong, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Text, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, View, XStack, YStack, ZStack, badgeVariants, buttonVariants, toast, Accordion, AccordionContent, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, HoverCard, HoverCardContent, HoverCardTrigger, RadioGroup, RadioGroupItem, ToggleGroup, ToggleGroupItem, } from './backends/gui/index.js';
+// LAYOUT — the stacks and the type scale reach consumers through the component
+// barrel above, which already names XStack/YStack/ZStack, the type scale
+// (SizableText, Paragraph, Heading, H1-H6, Span, Strong, Em) and Image, Spacer,
+// ScrollView, View and Text. This block adds only what that one lacks.
+//
+// It used to repeat all twenty, and TypeScript rejects a name exported twice from
+// one module: `error TS2300: Duplicate identifier 'Em'` and nineteen more, so
+// `tsc -p tsconfig.build.json` failed and @hanzo/ui could not build AT ALL. That
+// took the whole cicd lane down with it — the test gate runs
+// `pnpm --filter @hanzo/ui... build` first, so no test ever ran and ui.hanzo.ai
+// could not ship.
+//
+// The concern the duplication came from is real and still holds: a name must be
+// on the ROOT barrel to reach a consumer — 8.0.65 added these to the backend only
+// and the dist still had no XStack, a green release that changed nothing. The fix
+// for that is to name it once here, not twice.
+export { Anchor, } from './backends/gui/index.js';
+// `Hanzo` — the root, and the only thing an app mounts. It carries the gui
+// config and the generated stylesheet, so `npm i @hanzo/ui` is the whole setup:
+// no gui.config.ts, no CSS import, no generator script.
+export { Hanzo } from './root.node.js';
+// `cn` — the class-name composer, surfaced for convenience.
+export { cn } from './core/cn.js';
+// The design-token scale (colors, dark/light themes, radii, spacing, typography)
+// lives on the `@hanzo/ui/core` / `@hanzo/ui/tokens` subpath — pure data, no
+// runtime.
+export { tw } from './tw.js';
+export { Box } from './box.js';
+//# sourceMappingURL=index.js.map

package/dist/root.node.js

@@ -0,0 +1,98 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * `Hanzo` — the root. The only thing an app has to mount.
+ *
+ *   import { Hanzo, Button } from '@hanzo/ui'
+ *   <Hanzo><Button>Ship</Button></Hanzo>
+ *
+ * No config file, no CSS import, no generator script, no bundler aliases. Three
+ * things used to be the app's job and are now the package's:
+ *
+ *   the config — @hanzo/gui resolves `$3` / `$background` / `$borderColor`
+ *     against ONE process-global config, and @hanzo/ui owns it (gui-config.ts).
+ *     It is passed here as a value, not imported for its side effect: Vite 8
+ *     ignores package.json `sideEffects` ARRAYS outright, so a bare
+ *     `import './gui-config.js'` is dropped and the first render dies on "Missing
+ *     hanzogui config". A value a rendered component needs cannot be shaken out.
+ *
+ *   the stylesheet — `styles.css` is generated at OUR publish time by rendering
+ *     every component and harvesting the atomic CSS that render produces
+ *     (scripts/gen-css.mjs). It used to be each app's job to run a generator and
+ *     import its output; hanzo.app never did, and shipped 103 `_bg-` classes
+ *     against zero `_bg-` rules with a green build the whole time.
+ *
+ *   the theme — gui throws "Missing theme." for any component without a root
+ *     theme context, so there is no version of this that works with no root at
+ *     all. Dark-first, matching the Hanzo identity.
+ *
+ * `disableInjectCSS` because the sheet is a real file. Left on, the provider
+ * inlines `config.getCSS()` into the document on every streaming flush — that is
+ * how hanzo.ai once shipped thirteen byte-identical copies, 591,305 of its
+ * 638,443 bytes. A file is cached once and costs nothing after the first page.
+ * Styles gui generates at runtime for props we could not know at publish time
+ * still reach the document: that path is `insertStyleRules`, and it is not what
+ * this flag controls.
+ */
+import { GuiProvider } from '@hanzo/gui';
+import { TelemetryProvider } from '@hanzogui/telemetry';
+import { useEffect } from 'react';
+import { apply, read } from '@hanzo/appearance/state';
+import { config } from './gui-config.js';
+// styles.css is omitted from the node entry: node cannot load a stylesheet.
+/** A stylesheet that did not reach the document is invisible until someone opens
+ *  production. `styles.css` declares `--hanzo-ui-styles`, so the check is one
+ *  lookup, it runs once, and it names the fix. Development only.
+ *
+ *  Only a sheet with an OWNER ELEMENT counts. A bundler that processed the CSS
+ *  emits a `<link>` or a `<style>`; jsdom loads no CSS at all, so a document
+ *  with no such element cannot answer the question and must not be asked —
+ *  throwing there breaks every consumer's unit tests to report a condition that
+ *  cannot exist. Counting SHEETS instead of elements is what made that happen:
+ *  the gui runtime inserts its own ownerless sheet while this module is being
+ *  imported, so by first render jsdom was never empty and every jest consumer
+ *  rendering `<Hanzo>` threw. */
+let checked = false;
+const styled = () => [...document.styleSheets].some((s) => s.ownerNode);
+const assertStylesheet = () => {
+    if (checked || typeof document === 'undefined' || !styled())
+        return;
+    checked = true;
+    if (getComputedStyle(document.documentElement).getPropertyValue('--hanzo-ui-styles').trim())
+        return;
+    throw new Error('@hanzo/ui: styles.css did not reach the document. <Hanzo> imports it, so a bundler ' +
+        'that does not process CSS imported from node_modules has dropped it. Import it ' +
+        "directly instead: import '@hanzo/ui/styles.css'.");
+};
+export const Hanzo = ({ children, theme = 'dark', analytics }) => {
+    if (process.env.NODE_ENV !== 'production')
+        assertStylesheet();
+    // A person's stored type size, density and accent, put on the document.
+    //
+    // Unconditional, unlike `analytics`, and the difference is the whole reason
+    // that one is a prop. Analytics starts a conversation with a server the app
+    // did not ask for; this reads a preference the PERSON already set on this
+    // device and honours it. An app that has to opt in is an app that forgets to,
+    // and then the setting silently does nothing on that surface — which is worse
+    // than not offering it.
+    //
+    // Costs nothing when unused: an axis nobody set is absent rather than
+    // neutral, so `apply()` removes the property instead of stamping a `1` that
+    // would outrank a brand's own scale.
+    //
+    // This is the MOUNT half only. First paint still wants `bootScript()` in
+    // <head>, because no component can run before the document exists.
+    useEffect(() => {
+        apply(read());
+    }, []);
+    const tree = (_jsx(GuiProvider, { config: config, defaultTheme: theme, disableInjectCSS: true, children: children }));
+    // OUTSIDE the gui provider: capture is delegated at the document, so it does
+    // not need to be inside the styled tree, and an app that renders its own
+    // `<TelemetryProvider/>` above `<Hanzo>` then nests two providers of the same
+    // kind rather than interleaving them with the theme.
+    if (!analytics)
+        return tree;
+    return _jsx(TelemetryProvider, { ...(analytics === true ? {} : analytics), children: tree });
+};
+export default Hanzo;
+//# sourceMappingURL=root.js.map

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@hanzo/ui",
-  "version": "8.4.10",
+  "version": "8.4.12",
   "type": "module",
   "description": "Hanzo UI — the one canonical Hanzo component library, on @hanzo/gui + @hanzo/design. ONE substrate: every component renders through @hanzo/gui primitives, so the same import works on web, native (expo) and desktop (Tauri). Self-contained (theme.css), presentational, host-agnostic, clean-room.",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
+      "node": "./dist/index.node.js",
       "import": "./dist/index.js",
       "require": "./dist/index.cjs",
       "default": "./dist/index.js"