@hanzo/ui 8.1.21 → 8.2.1

package/dist/styles.css

@@ -1686,6 +1686,180 @@
   }
 }
 
+[stylesheet-group="0"]{}
+body{margin:0;}
+button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}
+html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);}
+input::-webkit-search-cancel-button,input::-webkit-search-decoration,input::-webkit-search-results-button,input::-webkit-search-results-decoration{display:none;}
+[stylesheet-group="1"]{}
+.css-accessibilityImage-9pa8cd{bottom:0px;height:100%;left:0px;opacity:0;position:absolute;right:0px;top:0px;width:100%;z-index:-1;}
+.css-text-146c3p1{background-color:rgba(0,0,0,0.00);border:0 solid black;box-sizing:border-box;color:rgba(0,0,0,1.00);display:inline;font:14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;list-style:none;margin:0px;padding:0px;position:relative;text-align:start;text-decoration:none;white-space:pre-wrap;word-wrap:break-word;}
+.css-textHasAncestor-1jxf684{background-color:rgba(0,0,0,0.00);border:0 solid black;box-sizing:border-box;color:inherit;display:inline;font:inherit;list-style:none;margin:0px;padding:0px;position:relative;text-align:inherit;text-decoration:none;white-space:inherit;word-wrap:break-word;}
+.css-textinput-11aywtz{-moz-appearance:textfield;-webkit-appearance:none;background-color:rgba(0,0,0,0.00);border-bottom-left-radius:0px;border-bottom-right-radius:0px;border-top-left-radius:0px;border-top-right-radius:0px;border:0 solid black;box-sizing:border-box;font:14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;margin:0px;padding:0px;resize:none;}
+.css-view-g5y9jx{align-content:flex-start;align-items:stretch;background-color:rgba(0,0,0,0.00);border:0 solid black;box-sizing:border-box;display:flex;flex-basis:auto;flex-direction:column;flex-shrink:0;list-style:none;margin:0px;min-height:0px;min-width:0px;padding:0px;position:relative;text-decoration:none;z-index:0;}
+[stylesheet-group="2"]{}
+.r-borderColor-1awa8pu{border-bottom-color:rgba(101,119,134,1.00);border-left-color:rgba(101,119,134,1.00);border-right-color:rgba(101,119,134,1.00);border-top-color:rgba(101,119,134,1.00);}
+.r-borderColor-1d4xg89{border-bottom-color:rgba(170,184,194,1.00);border-left-color:rgba(170,184,194,1.00);border-right-color:rgba(170,184,194,1.00);border-top-color:rgba(170,184,194,1.00);}
+.r-borderColor-1jyn79y{border-bottom-color:rgba(0,150,136,1.00);border-left-color:rgba(0,150,136,1.00);border-right-color:rgba(0,150,136,1.00);border-top-color:rgba(0,150,136,1.00);}
+.r-borderColor-4a18lf{border-bottom-color:rgba(255,0,0,1.00);border-left-color:rgba(255,0,0,1.00);border-right-color:rgba(255,0,0,1.00);border-top-color:rgba(255,0,0,1.00);}
+.r-borderColor-60ke3l{border-bottom-color:rgba(0,128,0,1.00);border-left-color:rgba(0,128,0,1.00);border-right-color:rgba(0,128,0,1.00);border-top-color:rgba(0,128,0,1.00);}
+.r-borderColor-9x6qib{border-bottom-color:rgba(204,214,221,1.00);border-left-color:rgba(204,214,221,1.00);border-right-color:rgba(204,214,221,1.00);border-top-color:rgba(204,214,221,1.00);}
+.r-borderColor-fx7oqy{border-bottom-color:rgba(0,0,255,1.00);border-left-color:rgba(0,0,255,1.00);border-right-color:rgba(0,0,255,1.00);border-top-color:rgba(0,0,255,1.00);}
+.r-borderRadius-1j16mh1{border-bottom-left-radius:100%;border-bottom-right-radius:100%;border-top-left-radius:100%;border-top-right-radius:100%;}
+.r-borderRadius-1jkafct{border-bottom-left-radius:2px;border-bottom-right-radius:2px;border-top-left-radius:2px;border-top-right-radius:2px;}
+.r-borderStyle-1phboty{border-bottom-style:solid;border-left-style:solid;border-right-style:solid;border-top-style:solid;}
+.r-borderWidth-d045u9{border-bottom-width:2px;border-left-width:2px;border-right-width:2px;border-top-width:2px;}
+.r-borderWidth-rs99b7{border-bottom-width:1px;border-left-width:1px;border-right-width:1px;border-top-width:1px;}
+.r-display-krxsd3{display:-webkit-box;}
+.r-display-xoduu5{display:inline-flex;}
+.r-flex-13awgt0{flex:1;}
+.r-margin-crgep1{margin:0px;}
+.r-margin-ywje51{margin:auto;}
+.r-overflow-1qsk4np{overflow-x:clip;overflow-y:clip;}
+.r-overflow-1udh08x{overflow-x:hidden;overflow-y:hidden;}
+.r-padding-edyy15{padding:8px;}
+.r-padding-t60dpp{padding:0px;}
+[stylesheet-group="2.2"]{}
+.r-insetInlineStart-10s2tm5{left:0%;}
+.r-insetInlineStart-16o8guy{right:100%;}
+.r-insetInlineStart-dqe1q{right:0%;}
+.r-insetInlineStart-rci37q{left:100%;}
+[stylesheet-group="3"]{}
+.r-WebkitBoxOrient-8akbws{-webkit-box-orient:vertical;}
+.r-WebkitOverflowScrolling-150rngu{-webkit-overflow-scrolling:touch;}
+.r-alignItems-1awozwy{align-items:center;}
+.r-alignSelf-k200y{align-self:flex-start;}
+.r-animationDuration-17bb2tj{animation-duration:0.75s;}
+.r-animationDuration-1ay1djp{animation-duration:1s;}
+.r-animationDuration-9daxd3{animation-duration:250ms;}
+.r-animationIterationCount-1muvv40{animation-iteration-count:infinite;}
+.r-animationKeyframes-13aq9py{animation-name:r-animation-1iq689l;}
+.r-animationKeyframes-1qulhi1{animation-name:r-animation-1pzkwqh;}
+.r-animationKeyframes-1yef0xd{animation-name:r-animation-11cv4x;}
+.r-animationKeyframes-ebwn4k{animation-name:r-animation-q67da2;}
+.r-animationKeyframes-g3mlsw{animation-name:r-animation-t2lo5v;}
+.r-animationKeyframes-xx3c9p{animation-name:r-animation-imtty0;}
+.r-animationPlayState-1abnn5w{animation-play-state:paused;}
+.r-animationTimingFunction-1ldzwu0{animation-timing-function:linear;}
+.r-animationTimingFunction-leqjx2{animation-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1);}
+.r-animationTimingFunction-s62m2j{animation-timing-function:cubic-bezier(0.47, 0, 0.745, 0.715);}
+.r-appearance-30o5oe{-moz-appearance:none;-ms-appearance:none;-webkit-appearance:none;appearance:none;}
+.r-backgroundColor-11mpjr4{background-color:rgba(223,223,223,1.00);}
+.r-backgroundColor-11udlyb{background-color:rgba(0,150,136,1.00);}
+.r-backgroundColor-14lw9ot{background-color:rgba(255,255,255,1.00);}
+.r-backgroundColor-14sbq61{background-color:rgba(33,150,243,1.00);}
+.r-backgroundColor-1niwhzg{background-color:rgba(0,0,0,0.00);}
+.r-backgroundColor-dkge59{background-color:rgba(170,184,194,1.00);}
+.r-backgroundColor-u92y06{background-color:rgba(255,165,0,1.00);}
+.r-backgroundImage-rs94m5{background-image:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K");}
+.r-backgroundPosition-1mrlafo{background-position:0;}
+.r-backgroundPosition-vvn4in{background-position:center;}
+.r-backgroundRepeat-17leim2{background-repeat:repeat;}
+.r-backgroundRepeat-u6sd8q{background-repeat:no-repeat;}
+.r-backgroundSize-1sxrcry{background-size:auto;}
+.r-backgroundSize-4gszlv{background-size:cover;}
+.r-backgroundSize-ehq7j7{background-size:contain;}
+.r-backgroundSize-x3cy2q{background-size:100% 100%;}
+.r-bottom-1p0dtai{bottom:0px;}
+.r-boxShadow-1ewcgjf{box-shadow:0px 1px 3px rgba(0,0,0,0.5);}
+.r-caretColor-van48c{caret-color:transparent;}
+.r-color-c68hjy{color:rgba(161,161,161,1.00);}
+.r-color-jwli3a{color:rgba(255,255,255,1.00);}
+.r-cursor-1ei5mc7{cursor:inherit;}
+.r-cursor-1loqt21{cursor:pointer;}
+.r-cursor-7q8q6z{cursor:default;}
+.r-flexBasis-1mlwlqe{flex-basis:auto;}
+.r-flexDirection-18u37iz{flex-direction:row;}
+.r-flexDirection-1d5kdc7{flex-direction:column-reverse;}
+.r-flexDirection-1euycsn{flex-direction:row-reverse;}
+.r-flexDirection-eqz5dr{flex-direction:column;}
+.r-flexGrow-16y2uox{flex-grow:1;}
+.r-flexShrink-1wbh5a2{flex-shrink:1;}
+.r-fontFamily-1qd0xha{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
+.r-fontSize-7cikom{font-size:inherit;}
+.r-fontWeight-majxgm{font-weight:500;}
+.r-forcedColorAdjust-1c6unfx{forced-color-adjust:none;}
+.r-height-10ptun7{height:16px;}
+.r-height-1dernwh{height:70%;}
+.r-height-1pi2tsx{height:100%;}
+.r-height-1r8g8re{height:36px;}
+.r-height-4v7adb{height:5px;}
+.r-height-z80fyv{height:20px;}
+.r-justifyContent-1777fci{justify-content:center;}
+.r-left-1d2f490{left:0px;}
+.r-maxWidth-dnmrzs{max-width:100%;}
+.r-opacity-6dt33c{opacity:1;}
+.r-opacity-orgf3d{opacity:0;}
+.r-outlineStyle-1ny4l3l{outline-style:none;}
+.r-overflowX-11yh6sk{overflow-x:hidden;}
+.r-overflowX-lltvgl{overflow-x:auto;}
+.r-overflowY-1rnoaur{overflow-y:auto;}
+.r-overflowY-buy8e9{overflow-y:hidden;}
+.r-paddingBottom-97e31f{padding-bottom:env(safe-area-inset-bottom);}
+.r-paddingLeft-bv2aro{padding-left:env(safe-area-inset-left);}
+.r-paddingRight-hxflta{padding-right:env(safe-area-inset-right);}
+.r-paddingTop-10xqauy{padding-top:env(safe-area-inset-top);}
+.r-placeholderTextColor-6taxm2:-ms-input-placeholder{color:var(--placeholderTextColor);opacity:1;}
+.r-placeholderTextColor-6taxm2::-moz-placeholder{color:var(--placeholderTextColor);opacity:1;}
+.r-placeholderTextColor-6taxm2::-webkit-input-placeholder{color:var(--placeholderTextColor);opacity:1;}
+.r-placeholderTextColor-6taxm2::placeholder{color:var(--placeholderTextColor);opacity:1;}
+.r-pointerEvents-105ug2t{pointer-events:auto!important;}
+.r-pointerEvents-12vffkv>* {pointer-events:auto;}
+.r-pointerEvents-12vffkv{pointer-events:none!important;}
+.r-pointerEvents-633pao>* {pointer-events:none;}
+.r-pointerEvents-633pao{pointer-events:none!important;}
+.r-pointerEvents-ah5dr5>* {pointer-events:none;}
+.r-pointerEvents-ah5dr5{pointer-events:auto!important;}
+.r-position-1xcajam{position:fixed;}
+.r-position-gtdqiz{position:-webkit-sticky;position:sticky;}
+.r-position-u8s1d{position:absolute;}
+.r-right-zchlnj{right:0px;}
+.r-scrollSnapAlign-cpa5s6{scroll-snap-align:start;}
+.r-scrollSnapType-1ocf4r9{scroll-snap-type:y mandatory;}
+.r-scrollSnapType-mfh4gg{scroll-snap-type:x mandatory;}
+.r-scrollbarWidth-2eszeu::-webkit-scrollbar{display:none}
+.r-scrollbarWidth-2eszeu{scrollbar-width:none;}
+.r-textAlign-1ff274t{text-align:right;}
+.r-textAlign-fdjqy7{text-align:left;}
+.r-textAlign-q4m81j{text-align:center;}
+.r-textOverflow-1udbk01{text-overflow:ellipsis;}
+.r-textTransform-tsynxw{text-transform:uppercase;}
+.r-top-ipm5af{top:0px;}
+.r-touchAction-19z077z{touch-action:none;}
+.r-touchAction-1otgn73{touch-action:manipulation;}
+.r-transform-10v3vxq{transform:scaleX(-1);}
+.r-transform-173mzie{transform:scaleY(-1);}
+.r-transform-agouwx{transform:translateZ(0);}
+.r-transform-bi4vy9{transform:translateY(100%);}
+.r-transform-ghxds0{transform:translateY(0%);}
+.r-transitionDuration-13tjlyg{transition-duration:0.1s;}
+.r-transitionDuration-eafdt9{transition-duration:0.15s;}
+.r-transitionProperty-1i6wzkk{-moz-transition-property:opacity;-webkit-transition-property:opacity;transition-property:opacity;}
+.r-userSelect-1xnzce8{-moz-user-select:text;-webkit-user-select:text;user-select:text;}
+.r-userSelect-lrvibr{-moz-user-select:none;-webkit-user-select:none;user-select:none;}
+.r-visibility-11j9u27{visibility:hidden;}
+.r-whiteSpace-3s2u2q{white-space:nowrap;}
+.r-width-13qz1uu{width:100%;}
+.r-width-19wmn03{width:20px;}
+.r-width-1acpoxo{width:36px;}
+.r-width-1janqcz{width:16px;}
+.r-wordWrap-1iln25a{word-wrap:normal;}
+.r-zIndex-1wyyakw{z-index:-1;}
+.r-zIndex-417010{z-index:0;}
+.r-zIndex-mhe3cw{z-index:10;}
+.r-zIndex-sfbmgh{z-index:9999;}
+@-webkit-keyframes r-animation-11cv4x{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}
+@-webkit-keyframes r-animation-1iq689l{0%{transform:translateY(0%);}100%{transform:translateY(100%);}}
+@-webkit-keyframes r-animation-1pzkwqh{0%{transform:translateY(100%);}100%{transform:translateY(0%);}}
+@-webkit-keyframes r-animation-imtty0{0%{opacity:0;}100%{opacity:1;}}
+@-webkit-keyframes r-animation-q67da2{0%{transform:translateX(-100%);}100%{transform:translateX(400%);}}
+@-webkit-keyframes r-animation-t2lo5v{0%{opacity:1;}100%{opacity:0;}}
+@keyframes r-animation-11cv4x{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}
+@keyframes r-animation-1iq689l{0%{transform:translateY(0%);}100%{transform:translateY(100%);}}
+@keyframes r-animation-1pzkwqh{0%{transform:translateY(100%);}100%{transform:translateY(0%);}}
+@keyframes r-animation-imtty0{0%{opacity:0;}100%{opacity:1;}}
+@keyframes r-animation-q67da2{0%{transform:translateX(-100%);}100%{transform:translateX(400%);}}
+@keyframes r-animation-t2lo5v{0%{opacity:1;}100%{opacity:0;}}
 /* @hanzo/ui motion primitives — the calm, restrained animation vocabulary the
    Hanzo surfaces share. One place defines the easing; components apply the class.
    `className` forwards to the underlying DOM node on web, so the browser

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/ui",
-  "version": "8.1.21",
+  "version": "8.2.1",
   "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": {
@@ -188,6 +188,11 @@
       "types": "./dist/dots.d.ts",
       "import": "./dist/dots.js",
       "require": "./dist/dots.cjs"
+    },
+    "./grid": {
+      "types": "./dist/grid.d.ts",
+      "import": "./dist/grid.js",
+      "require": "./dist/grid.cjs"
     }
   },
   "main": "./dist/index.cjs",
@@ -295,6 +300,7 @@
     "test": "pnpm run test:unit",
     "test:watch": "vitest",
     "test:responsive": "node scripts/responsive.mjs",
+    "test:contain": "node scripts/contain.mjs",
     "test:consumer": "node scripts/consumer-test.mjs",
     "test:unit": "vitest run",
     "test:consumer:webpack": "node scripts/consumer-webpack.mjs"

package/dist/backends/gui/grid.cjs

@@ -1,73 +0,0 @@
-'use client';"use strict";
-'use client';
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Grid = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * Grid — a real CSS grid whose tracks come from the CONTAINER, not the children.
- *
- * This exists to kill a specific shipped defect: hand-rolled
- * `width="calc(25% - 7.5px)"` grids that collapse asymmetrically. That shape is
- * broken by construction — each child computes its own width, so the row is only
- * even while every child agrees, and one long word or one `box-sizing` surprise
- * makes the row ragged. Nothing about it can be fixed by tuning the number.
- *
- * Here the parent declares the tracks once and the children have no say. Equal
- * columns are structural, not arithmetic, and no child can widen its own track.
- *
- * Why a plain div and not a gui YStack: gui's box model is Yoga, which is
- * flexbox and has no grid — a YStack would compile its own `display:flex`
- * atomic class and fight the grid. Inline styles, not a stylesheet class, so
- * there is no rule to fail to ship: this package's own checker exists because
- * "class with no rule" has shipped here three times.
- *
- * The two track formulas, both deliberate:
- *
- *   auto  repeat(auto-fill, minmax(min(Npx, 100%), 1fr))
- *         The `min(Npx, 100%)` is what makes it safe below N: a bare
- *         `minmax(240px, 1fr)` forces a 240px track inside a 200px phone and
- *         overflows the viewport horizontally. Responsive with ZERO breakpoint
- *         props — the wrap count follows the container, so the same tree is
- *         right at 390 and at 1280.
- *
- *   cols  repeat(n, minmax(0, 1fr))
- *         `1fr` alone means `minmax(auto, 1fr)`, and `auto` floors the track at
- *         the content's min-content width — so one long unbroken string pushes
- *         its own column wider and every sibling narrower. That IS the ragged
- *         row. `minmax(0, 1fr)` is the fix.
- *
- * `[data-slot='grid'] > *` also gets `min-width: 0` in the stylesheet, for the
- * same reason: a grid item's default `min-width: auto` lets its content set the
- * floor and blow the track out.
- */
-const gui_1 = require("@hanzo/gui");
-/** `'$3'` -> 12. A raw number passes through as px. */
-const space = (v, fallback) => {
-    if (v == null)
-        return fallback;
-    if (typeof v === 'number')
-        return v;
-    const t = (0, gui_1.getTokenValue)(v, 'space');
-    return typeof t === 'number' ? t : fallback;
-};
-const Grid = ({ min = 240, cols, max, gap = '$3', style, ...props }) => {
-    const g = space(gap, 12);
-    // The track floor, capped. Without `max` it is `min(Npx, 100%)` — N wide, but
-    // never wider than the container, which is what keeps a 900px min from
-    // overflowing a 390px phone.
-    //
-    // With `max` the floor also has to be at least "one Mth of the row", so
-    // auto-fill can never fit an (M+1)th track: subtract the M-1 gaps first, then
-    // divide. Below that width the max() picks Npx again and the grid wraps
-    // normally — so the cap costs nothing on small screens, which is the whole
-    // point of expressing it as a floor rather than a breakpoint.
-    const floor = max
-        ? `max(min(${min}px, 100%), calc((100% - ${(max - 1) * g}px) / ${max}))`
-        : `min(${min}px, 100%)`;
-    const columns = cols
-        ? `repeat(${cols}, minmax(0, 1fr))`
-        : `repeat(auto-fill, minmax(${floor}, 1fr))`;
-    const grid = { display: 'grid', gridTemplateColumns: columns, gap: g };
-    return (0, jsx_runtime_1.jsx)("div", { "data-slot": "grid", style: { ...grid, ...style }, ...props });
-};
-exports.Grid = Grid;

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

@@ -1,25 +0,0 @@
-import type { ComponentProps, ReactNode } from 'react';
-export interface GridProps extends Omit<ComponentProps<'div'>, 'children'> {
-    /**
-     * Narrowest a column may get before the grid drops one. The whole responsive
-     * story: no breakpoints, no props per screen size.
-     */
-    min?: number;
-    /** Fixed column count. Overrides `min` — use it when the count is the design. */
-    cols?: number;
-    /**
-     * Never exceed this many columns, while still wrapping down on narrow
-     * screens. `<Grid min={160} max={4}>` is 2-up on a phone and 4-up on a
-     * desktop, with nothing in between to configure.
-     *
-     * A single `min` cannot express that: 2-up at 390px needs min ~170, and that
-     * same 170 gives SIX columns at 1280. Capping is the missing half.
-     */
-    max?: number;
-    /** A `$n` space token or a raw px number. */
-    gap?: number | string;
-    children?: ReactNode;
-}
-declare const Grid: ({ min, cols, max, gap, style, ...props }: GridProps) => import("react/jsx-runtime").JSX.Element;
-export { Grid };
-//# sourceMappingURL=grid.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/grid.tsx"],"names":[],"mappings":"AAwCA,OAAO,KAAK,EAAE,cAAc,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAA;AAErE,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACxE;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,iFAAiF;IACjF,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;;;;;OAOG;IACH,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,6CAA6C;IAC7C,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAUD,QAAA,MAAM,IAAI,GAAI,0CAAuD,SAAS,4CAmB7E,CAAA;AAED,OAAO,EAAE,IAAI,EAAE,CAAA"}

package/dist/backends/gui/grid.js

@@ -1,71 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-/**
- * Grid — a real CSS grid whose tracks come from the CONTAINER, not the children.
- *
- * This exists to kill a specific shipped defect: hand-rolled
- * `width="calc(25% - 7.5px)"` grids that collapse asymmetrically. That shape is
- * broken by construction — each child computes its own width, so the row is only
- * even while every child agrees, and one long word or one `box-sizing` surprise
- * makes the row ragged. Nothing about it can be fixed by tuning the number.
- *
- * Here the parent declares the tracks once and the children have no say. Equal
- * columns are structural, not arithmetic, and no child can widen its own track.
- *
- * Why a plain div and not a gui YStack: gui's box model is Yoga, which is
- * flexbox and has no grid — a YStack would compile its own `display:flex`
- * atomic class and fight the grid. Inline styles, not a stylesheet class, so
- * there is no rule to fail to ship: this package's own checker exists because
- * "class with no rule" has shipped here three times.
- *
- * The two track formulas, both deliberate:
- *
- *   auto  repeat(auto-fill, minmax(min(Npx, 100%), 1fr))
- *         The `min(Npx, 100%)` is what makes it safe below N: a bare
- *         `minmax(240px, 1fr)` forces a 240px track inside a 200px phone and
- *         overflows the viewport horizontally. Responsive with ZERO breakpoint
- *         props — the wrap count follows the container, so the same tree is
- *         right at 390 and at 1280.
- *
- *   cols  repeat(n, minmax(0, 1fr))
- *         `1fr` alone means `minmax(auto, 1fr)`, and `auto` floors the track at
- *         the content's min-content width — so one long unbroken string pushes
- *         its own column wider and every sibling narrower. That IS the ragged
- *         row. `minmax(0, 1fr)` is the fix.
- *
- * `[data-slot='grid'] > *` also gets `min-width: 0` in the stylesheet, for the
- * same reason: a grid item's default `min-width: auto` lets its content set the
- * floor and blow the track out.
- */
-import { getTokenValue } from '@hanzo/gui';
-/** `'$3'` -> 12. A raw number passes through as px. */
-const space = (v, fallback) => {
-    if (v == null)
-        return fallback;
-    if (typeof v === 'number')
-        return v;
-    const t = getTokenValue(v, 'space');
-    return typeof t === 'number' ? t : fallback;
-};
-const Grid = ({ min = 240, cols, max, gap = '$3', style, ...props }) => {
-    const g = space(gap, 12);
-    // The track floor, capped. Without `max` it is `min(Npx, 100%)` — N wide, but
-    // never wider than the container, which is what keeps a 900px min from
-    // overflowing a 390px phone.
-    //
-    // With `max` the floor also has to be at least "one Mth of the row", so
-    // auto-fill can never fit an (M+1)th track: subtract the M-1 gaps first, then
-    // divide. Below that width the max() picks Npx again and the grid wraps
-    // normally — so the cap costs nothing on small screens, which is the whole
-    // point of expressing it as a floor rather than a breakpoint.
-    const floor = max
-        ? `max(min(${min}px, 100%), calc((100% - ${(max - 1) * g}px) / ${max}))`
-        : `min(${min}px, 100%)`;
-    const columns = cols
-        ? `repeat(${cols}, minmax(0, 1fr))`
-        : `repeat(auto-fill, minmax(${floor}, 1fr))`;
-    const grid = { display: 'grid', gridTemplateColumns: columns, gap: g };
-    return _jsx("div", { "data-slot": "grid", style: { ...grid, ...style }, ...props });
-};
-export { Grid };
-//# sourceMappingURL=grid.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../src/backends/gui/grid.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAyB1C,uDAAuD;AACvD,MAAM,KAAK,GAAG,CAAC,CAA8B,EAAE,QAAgB,EAAU,EAAE;IACzE,IAAI,CAAC,IAAI,IAAI;QAAE,OAAO,QAAQ,CAAA;IAC9B,IAAI,OAAO,CAAC,KAAK,QAAQ;QAAE,OAAO,CAAC,CAAA;IACnC,MAAM,CAAC,GAAG,aAAa,CAAC,CAAU,EAAE,OAAO,CAAC,CAAA;IAC5C,OAAO,OAAO,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAA;AAC7C,CAAC,CAAA;AAED,MAAM,IAAI,GAAG,CAAC,EAAE,GAAG,GAAG,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,EAAa,EAAE,EAAE;IAChF,MAAM,CAAC,GAAG,KAAK,CAAC,GAAG,EAAE,EAAE,CAAC,CAAA;IACxB,8EAA8E;IAC9E,uEAAuE;IACvE,6BAA6B;IAC7B,EAAE;IACF,wEAAwE;IACxE,8EAA8E;IAC9E,wEAAwE;IACxE,2EAA2E;IAC3E,8DAA8D;IAC9D,MAAM,KAAK,GAAG,GAAG;QACf,CAAC,CAAC,WAAW,GAAG,2BAA2B,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG,CAAC,SAAS,GAAG,IAAI;QACxE,CAAC,CAAC,OAAO,GAAG,WAAW,CAAA;IACzB,MAAM,OAAO,GAAG,IAAI;QAClB,CAAC,CAAC,UAAU,IAAI,mBAAmB;QACnC,CAAC,CAAC,4BAA4B,KAAK,SAAS,CAAA;IAC9C,MAAM,IAAI,GAAkB,EAAE,OAAO,EAAE,MAAM,EAAE,mBAAmB,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,EAAE,CAAA;IACrF,OAAO,2BAAe,MAAM,EAAC,KAAK,EAAE,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,EAAE,KAAM,KAAK,GAAI,CAAA;AAC1E,CAAC,CAAA;AAED,OAAO,EAAE,IAAI,EAAE,CAAA"}

package/dist/primitives/Grid.cjs

@@ -1,8 +0,0 @@
-'use client';"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Grid = void 0;
-// GENERATED by scripts/gen-primitives.mjs — do not edit. Per-member entrypoint
-// for hosts that modularize `@hanzo/ui` imports. Source of truth:
-// src/backends/gui/index.ts. Re-run: node scripts/gen-primitives.mjs
-var grid_1 = require("../backends/gui/grid.cjs");
-Object.defineProperty(exports, "Grid", { enumerable: true, get: function () { return grid_1.Grid; } });

package/dist/primitives/Grid.d.ts

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

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

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

package/dist/primitives/Grid.js

@@ -1,5 +0,0 @@
-// GENERATED by scripts/gen-primitives.mjs — do not edit. Per-member entrypoint
-// for hosts that modularize `@hanzo/ui` imports. Source of truth:
-// src/backends/gui/index.ts. Re-run: node scripts/gen-primitives.mjs
-export { Grid } from '../backends/gui/grid.js';
-//# sourceMappingURL=Grid.js.map

package/dist/primitives/Grid.js.map

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