@hanzo/ui 8.4.11 → 8.4.13

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@hanzo/ui",
-  "version": "8.4.11",
+  "version": "8.4.13",
   "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"
@@ -222,14 +223,14 @@
     "@hanzo/cd": ">=0.1.0",
     "@hanzo/dashboard": ">=0.1.0",
     "@hanzo/data": ">=1.2.3",
-    "@hanzo/gui": ">=8.1.0",
+    "@hanzo/gui": ">=8.2.1",
     "@hanzo/usage": ">=0.1.0",
-    "@hanzogui/animations-css": ">=8.1.0",
-    "@hanzogui/config": ">=8.1.0",
-    "@hanzogui/lucide-icons-2": ">=8.1.0",
-    "@hanzogui/next-theme": ">=8.1.0",
-    "@hanzogui/telemetry": ">=8.1.0",
-    "@hanzogui/toast": ">=8.1.0",
+    "@hanzogui/animations-css": ">=8.2.1",
+    "@hanzogui/config": ">=8.2.1",
+    "@hanzogui/lucide-icons-2": ">=8.2.1",
+    "@hanzogui/next-theme": ">=8.2.1",
+    "@hanzogui/telemetry": ">=8.2.1",
+    "@hanzogui/toast": ">=8.2.1",
     "next": ">=14",
     "next-themes": ">=0.2.1",
     "react": ">=19",
@@ -265,16 +266,16 @@
   "devDependencies": {
     "@hanzo/dashboard": "^0.2.0",
     "@hanzo/data": "1.2.3",
-    "@hanzo/gui": "8.1.0",
+    "@hanzo/gui": "8.2.1",
     "@hanzo/usage": "^0.1.6",
-    "@hanzogui/animations-css": "^8.1.1",
-    "@hanzogui/config": "8.1.0",
-    "@hanzogui/core": "8.1.0",
-    "@hanzogui/lucide-icons-2": "8.1.0",
-    "@hanzogui/next-theme": "8.1.0",
-    "@hanzogui/telemetry": "8.1.0",
-    "@hanzogui/toast": "8.1.0",
-    "@hanzogui/web": "8.1.0",
+    "@hanzogui/animations-css": "8.2.1",
+    "@hanzogui/config": "8.2.1",
+    "@hanzogui/core": "8.2.1",
+    "@hanzogui/lucide-icons-2": "8.2.1",
+    "@hanzogui/next-theme": "8.2.1",
+    "@hanzogui/telemetry": "8.2.1",
+    "@hanzogui/toast": "8.2.1",
+    "@hanzogui/web": "8.2.1",
     "@playwright/test": "^1.61.0",
     "@types/node": "^22.10.2",
     "@types/react": "^19.1.10",

package/dist/backends/gui/section.cjs

@@ -1,39 +0,0 @@
-'use client';"use strict";
-'use client';
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Section = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * Section — the page's vertical rhythm, in one place.
- *
- * Components kept inventing their own vertical story: a margin here, a padding
- * there, a `<div style={{marginTop: 64}}>` somewhere else. The result is a page
- * whose spacing is the sum of everyone's guesses, and which is never the same
- * twice on a phone.
- *
- * So the page-level spacing decision is made once, from the space scale, and it
- * is mobile-first: phone values by default, stepping up past `$gtSm`. A caller
- * that writes nothing gets the right answer at every width, which is the point —
- * the failure mode being designed out is "had to remember something".
- *
- * Two boxes, because they do two different jobs and merging them is what breaks:
- * the OUTER runs full-bleed and owns the vertical rhythm and the side gutter, so
- * a background set on it reaches both edges; the INNER is the centred measure and
- * owns `maxWidth`. Put `maxWidth` on the outer box instead and a section can
- * never have a full-width background.
- */
-const gui_1 = require("@hanzo/gui");
-const slot_1 = require("./slot.cjs");
-const Section = ({ maxWidth = 1200, children, innerProps, ...props }) => ((0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('section'), width: "100%", 
-    // Values come from the space scale, never literals — a section spaced in
-    // raw px drifts from everything else on the page. `$md` is a MAX-width
-    // query in this config, so the base is the roomy value and the phone steps
-    // it down; that is the direction every other responsive prop in this
-    // package is written in ($md/$sm in Field, PageHeader, SiteNav) and mixing
-    // both directions in one codebase is how a breakpoint ends up applying
-    // twice.
-    py: "$11", px: "$6", $md: { py: '$8', px: '$4' }, ...props, children: (0, jsx_runtime_1.jsx)(gui_1.YStack, { ...(0, slot_1.slot)('section-inner'), width: "100%", ...(maxWidth === false ? {} : { maxWidth }), 
-        // The centring. `self: center` is the cross-axis rule a YStack understands
-        // on web AND native, where `margin: auto` is web-only.
-        self: "center", ...innerProps, children: children }) }));
-exports.Section = Section;

package/dist/backends/gui/section.d.ts

@@ -1,29 +0,0 @@
-/**
- * Section — the page's vertical rhythm, in one place.
- *
- * Components kept inventing their own vertical story: a margin here, a padding
- * there, a `<div style={{marginTop: 64}}>` somewhere else. The result is a page
- * whose spacing is the sum of everyone's guesses, and which is never the same
- * twice on a phone.
- *
- * So the page-level spacing decision is made once, from the space scale, and it
- * is mobile-first: phone values by default, stepping up past `$gtSm`. A caller
- * that writes nothing gets the right answer at every width, which is the point —
- * the failure mode being designed out is "had to remember something".
- *
- * Two boxes, because they do two different jobs and merging them is what breaks:
- * the OUTER runs full-bleed and owns the vertical rhythm and the side gutter, so
- * a background set on it reaches both edges; the INNER is the centred measure and
- * owns `maxWidth`. Put `maxWidth` on the outer box instead and a section can
- * never have a full-width background.
- */
-import { type YStackProps } from '@hanzo/gui';
-export interface SectionProps extends YStackProps {
-    /** The centred measure. `false` lets the content run the full width. */
-    maxWidth?: number | false;
-    /** Props for the inner centred column. */
-    innerProps?: YStackProps;
-}
-declare const Section: ({ maxWidth, children, innerProps, ...props }: SectionProps) => import("react/jsx-runtime").JSX.Element;
-export { Section };
-//# sourceMappingURL=section.d.ts.map

package/dist/backends/gui/section.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"section.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/section.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,YAAY,CAAA;AAGrD,MAAM,WAAW,YAAa,SAAQ,WAAW;IAC/C,wEAAwE;IACxE,QAAQ,CAAC,EAAE,MAAM,GAAG,KAAK,CAAA;IACzB,0CAA0C;IAC1C,UAAU,CAAC,EAAE,WAAW,CAAA;CACzB;AAED,QAAA,MAAM,OAAO,iDAAyD,YAAY,4CA4BjF,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}

package/dist/backends/gui/section.js

@@ -1,37 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-/**
- * Section — the page's vertical rhythm, in one place.
- *
- * Components kept inventing their own vertical story: a margin here, a padding
- * there, a `<div style={{marginTop: 64}}>` somewhere else. The result is a page
- * whose spacing is the sum of everyone's guesses, and which is never the same
- * twice on a phone.
- *
- * So the page-level spacing decision is made once, from the space scale, and it
- * is mobile-first: phone values by default, stepping up past `$gtSm`. A caller
- * that writes nothing gets the right answer at every width, which is the point —
- * the failure mode being designed out is "had to remember something".
- *
- * Two boxes, because they do two different jobs and merging them is what breaks:
- * the OUTER runs full-bleed and owns the vertical rhythm and the side gutter, so
- * a background set on it reaches both edges; the INNER is the centred measure and
- * owns `maxWidth`. Put `maxWidth` on the outer box instead and a section can
- * never have a full-width background.
- */
-import { YStack } from '@hanzo/gui';
-import { slot } from './slot.js';
-const Section = ({ maxWidth = 1200, children, innerProps, ...props }) => (_jsx(YStack, { ...slot('section'), width: "100%", 
-    // Values come from the space scale, never literals — a section spaced in
-    // raw px drifts from everything else on the page. `$md` is a MAX-width
-    // query in this config, so the base is the roomy value and the phone steps
-    // it down; that is the direction every other responsive prop in this
-    // package is written in ($md/$sm in Field, PageHeader, SiteNav) and mixing
-    // both directions in one codebase is how a breakpoint ends up applying
-    // twice.
-    py: "$11", px: "$6", $md: { py: '$8', px: '$4' }, ...props, children: _jsx(YStack, { ...slot('section-inner'), width: "100%", ...(maxWidth === false ? {} : { maxWidth }), 
-        // The centring. `self: center` is the cross-axis rule a YStack understands
-        // on web AND native, where `margin: auto` is web-only.
-        self: "center", ...innerProps, children: children }) }));
-export { Section };
-//# sourceMappingURL=section.js.map

package/dist/backends/gui/section.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"section.js","sourceRoot":"","sources":["../../../src/backends/gui/section.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAE,MAAM,EAAoB,MAAM,YAAY,CAAA;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAS7B,MAAM,OAAO,GAAG,CAAC,EAAE,QAAQ,GAAG,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE,CAAC,CACrF,KAAC,MAAM,OACD,IAAI,CAAC,SAAS,CAAC,EACnB,KAAK,EAAC,MAAM;IACZ,yEAAyE;IACzE,uEAAuE;IACvE,2EAA2E;IAC3E,qEAAqE;IACrE,2EAA2E;IAC3E,uEAAuE;IACvE,SAAS;IACT,EAAE,EAAC,KAAK,EACR,EAAE,EAAC,IAAI,EACP,GAAG,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,KACvB,KAAK,YAET,KAAC,MAAM,OACD,IAAI,CAAC,eAAe,CAAC,EACzB,KAAK,EAAC,MAAM,KACR,CAAC,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC;QAC5C,2EAA2E;QAC3E,uDAAuD;QACvD,IAAI,EAAC,QAAQ,KACT,UAAU,YAEb,QAAQ,GACF,GACF,CACV,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}

package/dist/backends/gui/separator.cjs

@@ -1,10 +0,0 @@
-'use client';"use strict";
-'use client';
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Separator = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-/** Separator — a 1px rule on either axis. */
-const gui_1 = require("@hanzo/gui");
-const slot_1 = require("./slot.cjs");
-const Separator = ({ orientation = 'horizontal', decorative: _decorative, ...props }) => ((0, jsx_runtime_1.jsx)(gui_1.Separator, { ...(0, slot_1.slot)('separator'), "data-orientation": orientation, vertical: orientation === 'vertical', borderColor: "$borderColor", ...props }));
-exports.Separator = Separator;

package/dist/backends/gui/separator.d.ts

@@ -1,11 +0,0 @@
-/** Separator — a 1px rule on either axis. */
-import { Separator as GuiSeparator } from '@hanzo/gui';
-import type { ComponentProps } from 'react';
-export type SeparatorProps = Omit<ComponentProps<typeof GuiSeparator>, 'vertical'> & {
-    orientation?: 'horizontal' | 'vertical';
-    /** Radix parity — gui separators are always presentational. */
-    decorative?: boolean;
-};
-declare const Separator: ({ orientation, decorative: _decorative, ...props }: SeparatorProps) => import("react/jsx-runtime").JSX.Element;
-export { Separator };
-//# sourceMappingURL=separator.d.ts.map

package/dist/backends/gui/separator.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"separator.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/separator.tsx"],"names":[],"mappings":"AAEA,6CAA6C;AAC7C,OAAO,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,YAAY,CAAA;AACtD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAG3C,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,YAAY,CAAC,EAAE,UAAU,CAAC,GAAG;IACnF,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IACvC,+DAA+D;IAC/D,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAED,QAAA,MAAM,SAAS,uDAAuE,cAAc,4CAQnG,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/dist/backends/gui/separator.js

@@ -1,8 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-/** Separator — a 1px rule on either axis. */
-import { Separator as GuiSeparator } from '@hanzo/gui';
-import { slot } from './slot.js';
-const Separator = ({ orientation = 'horizontal', decorative: _decorative, ...props }) => (_jsx(GuiSeparator, { ...slot('separator'), "data-orientation": orientation, vertical: orientation === 'vertical', borderColor: "$borderColor", ...props }));
-export { Separator };
-//# sourceMappingURL=separator.js.map

package/dist/backends/gui/separator.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"separator.js","sourceRoot":"","sources":["../../../src/backends/gui/separator.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,6CAA6C;AAC7C,OAAO,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,YAAY,CAAA;AAEtD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAQ7B,MAAM,SAAS,GAAG,CAAC,EAAE,WAAW,GAAG,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,KAAK,EAAkB,EAAE,EAAE,CAAC,CACvG,KAAC,YAAY,OACP,IAAI,CAAC,WAAW,CAAC,sBACH,WAAW,EAC7B,QAAQ,EAAE,WAAW,KAAK,UAAU,EACpC,WAAW,EAAC,cAAc,KACtB,KAAK,GACT,CACH,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/dist/primitives/Section.d.ts

@@ -1,2 +0,0 @@
-export { Section } from '../backends/gui/section.js';
-//# sourceMappingURL=Section.d.ts.map

package/dist/primitives/Section.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Section.d.ts","sourceRoot":"","sources":["../../src/primitives/Section.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAA"}

package/dist/primitives/Section.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Section.js","sourceRoot":"","sources":["../../src/primitives/Section.tsx"],"names":[],"mappings":"AAAA,+EAA+E;AAC/E,kEAAkE;AAClE,qEAAqE;AACrE,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAA"}