@hanzo/ui 8.0.41 → 8.0.43
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/backends/gui/button.cjs +19 -2
- package/dist/backends/gui/button.d.ts.map +1 -1
- package/dist/backends/gui/button.js +19 -2
- package/dist/backends/gui/button.js.map +1 -1
- package/dist/backends/gui/card.cjs +2 -3
- package/dist/backends/gui/card.d.ts +2 -2
- package/dist/backends/gui/card.d.ts.map +1 -1
- package/dist/backends/gui/card.js +2 -3
- package/dist/backends/gui/card.js.map +1 -1
- package/dist/backends/gui/collapsible.cjs +1 -6
- package/dist/backends/gui/collapsible.d.ts +1 -1
- package/dist/backends/gui/collapsible.d.ts.map +1 -1
- package/dist/backends/gui/collapsible.js +1 -6
- package/dist/backends/gui/collapsible.js.map +1 -1
- package/dist/backends/gui/focus.cjs +36 -0
- package/dist/backends/gui/focus.d.ts +39 -0
- package/dist/backends/gui/focus.d.ts.map +1 -0
- package/dist/backends/gui/focus.js +34 -0
- package/dist/backends/gui/focus.js.map +1 -0
- package/dist/backends/gui/glass.cjs +31 -0
- package/dist/backends/gui/glass.d.ts +9 -0
- package/dist/backends/gui/glass.d.ts.map +1 -0
- package/dist/backends/gui/glass.js +29 -0
- package/dist/backends/gui/glass.js.map +1 -0
- package/dist/backends/gui/index.cjs +3 -1
- package/dist/backends/gui/index.d.ts +1 -0
- package/dist/backends/gui/index.d.ts.map +1 -1
- package/dist/backends/gui/index.js +1 -0
- package/dist/backends/gui/index.js.map +1 -1
- package/dist/backends/gui/input.cjs +2 -1
- package/dist/backends/gui/input.d.ts.map +1 -1
- package/dist/backends/gui/input.js +2 -1
- package/dist/backends/gui/input.js.map +1 -1
- package/dist/backends/gui/scroll-area.cjs +1 -2
- package/dist/backends/gui/scroll-area.d.ts.map +1 -1
- package/dist/backends/gui/scroll-area.js +1 -2
- package/dist/backends/gui/scroll-area.js.map +1 -1
- package/dist/backends/gui/slider.cjs +1 -8
- package/dist/backends/gui/slider.d.ts.map +1 -1
- package/dist/backends/gui/slider.js +1 -8
- package/dist/backends/gui/slider.js.map +1 -1
- package/dist/backends/gui/switch.cjs +1 -3
- package/dist/backends/gui/switch.d.ts.map +1 -1
- package/dist/backends/gui/switch.js +1 -3
- package/dist/backends/gui/switch.js.map +1 -1
- package/dist/backends/gui/tabs.cjs +1 -1
- package/dist/backends/gui/tabs.d.ts +1 -1
- package/dist/backends/gui/tabs.d.ts.map +1 -1
- package/dist/backends/gui/tabs.js +1 -1
- package/dist/backends/gui/tabs.js.map +1 -1
- package/dist/backends/gui/textarea.cjs +2 -1
- package/dist/backends/gui/textarea.d.ts.map +1 -1
- package/dist/backends/gui/textarea.js +2 -1
- package/dist/backends/gui/textarea.js.map +1 -1
- package/dist/index.cjs +1 -6
- package/dist/index.d.ts +0 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +0 -4
- package/dist/index.js.map +1 -1
- package/dist/primitives/Glass.cjs +8 -0
- package/dist/primitives/Glass.d.ts +2 -0
- package/dist/primitives/Glass.d.ts.map +1 -0
- package/dist/primitives/Glass.js +5 -0
- package/dist/primitives/Glass.js.map +1 -0
- package/dist/theme.css +35 -39
- package/package.json +5 -15
- package/dist/gallery.cjs +0 -23
- package/dist/gallery.d.ts +0 -7
- package/dist/gallery.d.ts.map +0 -1
- package/dist/gallery.js +0 -20
- package/dist/gallery.js.map +0 -1
- package/dist/root.cjs +0 -67
- package/dist/root.d.ts +0 -10
- package/dist/root.d.ts.map +0 -1
- package/dist/root.js +0 -64
- package/dist/root.js.map +0 -1
- package/dist/styles.css +0 -1259
|
@@ -16,7 +16,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
16
16
|
*/
|
|
17
17
|
import { createContext, forwardRef, useCallback, useContext, useEffect, useRef, useState, } from "react";
|
|
18
18
|
import { ScrollView, XStack, YStack, } from "@hanzo/gui";
|
|
19
|
-
import { ink } from "./ink.js";
|
|
20
19
|
import { slot } from "./slot.js";
|
|
21
20
|
import { drag, dragPos, touch } from "./gesture.js";
|
|
22
21
|
/** Bar thickness, and the thumb's minimum length — both in px. */
|
|
@@ -118,7 +117,7 @@ const ScrollArea = /* @__PURE__ */ forwardRef(function ScrollArea({ type = "hove
|
|
|
118
117
|
const { contentOffset } = e.nativeEvent;
|
|
119
118
|
put({ offset: horizontal ? contentOffset.x : contentOffset.y });
|
|
120
119
|
wake();
|
|
121
|
-
}, children:
|
|
120
|
+
}, children: children }), _jsx(Ctx.Provider, { value: { axis, track, type, active, rtl: dir === "rtl", scrollBy }, children: _jsx(ScrollBar, { orientation: axis }) })] }));
|
|
122
121
|
});
|
|
123
122
|
export { ScrollArea, ScrollBar };
|
|
124
123
|
//# sourceMappingURL=scroll-area.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll-area.js","sourceRoot":"","sources":["../../../src/backends/gui/scroll-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;GAaG;AACH,OAAO,EACL,aAAa,EACb,UAAU,EACV,WAAW,EACX,UAAU,EACV,SAAS,EACT,MAAM,EACN,QAAQ,GAET,MAAM,OAAO,CAAA;AACd,OAAO,EACL,UAAU,EACV,MAAM,EACN,MAAM,GAIP,MAAM,YAAY,CAAA;AAEnB,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"scroll-area.js","sourceRoot":"","sources":["../../../src/backends/gui/scroll-area.tsx"],"names":[],"mappings":"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"}
|
|
@@ -9,12 +9,5 @@ const slot_1 = require("./slot.cjs");
|
|
|
9
9
|
const gesture_1 = require("./gesture.cjs");
|
|
10
10
|
const TRACK = 6;
|
|
11
11
|
const THUMB = 16;
|
|
12
|
-
const Slider = (props) => ((0, jsx_runtime_1.jsxs)(gui_1.Slider, { ...(0, slot_1.slot)('slider'), width: "100%", ...props, children: [(0, jsx_runtime_1.jsx)(gui_1.Slider.Track, { ...(0, slot_1.slot)('slider-track'), height: TRACK, bg: "$color4", rounded: "$10", children: (0, jsx_runtime_1.jsx)(gui_1.Slider.TrackActive, { ...(0, slot_1.slot)('slider-range'), bg: "$color12" }) }), (0, jsx_runtime_1.jsx)(gui_1.Slider.Thumb, { ...(0, slot_1.slot)('slider-thumb'), index: 0, circular: true, size: THUMB,
|
|
13
|
-
// A FILLED knob, no ring. It used to be a dark knob ringed in `$color12`,
|
|
14
|
-
// which is #fff on dark — the one border value the identity does not
|
|
15
|
-
// allow. `$borderColor` is not the fix either: gui gives the thumb its own
|
|
16
|
-
// `SliderThumb` sub-theme, where that token is white as well. A filled
|
|
17
|
-
// knob needs no border, and `$color12` reads on both themes (white on
|
|
18
|
-
// dark, near-black on light).
|
|
19
|
-
bg: "$color12", borderWidth: 0, ...(0, gesture_1.touch)(THUMB) })] }));
|
|
12
|
+
const Slider = (props) => ((0, jsx_runtime_1.jsxs)(gui_1.Slider, { ...(0, slot_1.slot)('slider'), width: "100%", ...props, children: [(0, jsx_runtime_1.jsx)(gui_1.Slider.Track, { ...(0, slot_1.slot)('slider-track'), height: TRACK, bg: "$color4", rounded: "$10", children: (0, jsx_runtime_1.jsx)(gui_1.Slider.TrackActive, { ...(0, slot_1.slot)('slider-range'), bg: "$color12" }) }), (0, jsx_runtime_1.jsx)(gui_1.Slider.Thumb, { ...(0, slot_1.slot)('slider-thumb'), index: 0, circular: true, size: THUMB, bg: "$background", borderWidth: 1, borderColor: "$color12", ...(0, gesture_1.touch)(THUMB) })] }));
|
|
20
13
|
exports.Slider = Slider;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/slider.tsx"],"names":[],"mappings":"AAEA,mFAAmF;AACnF,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAO3C,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,CAAA;AAE1D,QAAA,MAAM,MAAM,GAAI,OAAO,WAAW,
|
|
1
|
+
{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/slider.tsx"],"names":[],"mappings":"AAEA,mFAAmF;AACnF,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAO3C,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,CAAA;AAE1D,QAAA,MAAM,MAAM,GAAI,OAAO,WAAW,4CAgBjC,CAAA;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
|
@@ -6,13 +6,6 @@ import { slot } from './slot.js';
|
|
|
6
6
|
import { touch } from './gesture.js';
|
|
7
7
|
const TRACK = 6;
|
|
8
8
|
const THUMB = 16;
|
|
9
|
-
const Slider = (props) => (_jsxs(GuiSlider, { ...slot('slider'), width: "100%", ...props, children: [_jsx(GuiSlider.Track, { ...slot('slider-track'), height: TRACK, bg: "$color4", rounded: "$10", children: _jsx(GuiSlider.TrackActive, { ...slot('slider-range'), bg: "$color12" }) }), _jsx(GuiSlider.Thumb, { ...slot('slider-thumb'), index: 0, circular: true, size: THUMB,
|
|
10
|
-
// A FILLED knob, no ring. It used to be a dark knob ringed in `$color12`,
|
|
11
|
-
// which is #fff on dark — the one border value the identity does not
|
|
12
|
-
// allow. `$borderColor` is not the fix either: gui gives the thumb its own
|
|
13
|
-
// `SliderThumb` sub-theme, where that token is white as well. A filled
|
|
14
|
-
// knob needs no border, and `$color12` reads on both themes (white on
|
|
15
|
-
// dark, near-black on light).
|
|
16
|
-
bg: "$color12", borderWidth: 0, ...touch(THUMB) })] }));
|
|
9
|
+
const Slider = (props) => (_jsxs(GuiSlider, { ...slot('slider'), width: "100%", ...props, children: [_jsx(GuiSlider.Track, { ...slot('slider-track'), height: TRACK, bg: "$color4", rounded: "$10", children: _jsx(GuiSlider.TrackActive, { ...slot('slider-range'), bg: "$color12" }) }), _jsx(GuiSlider.Thumb, { ...slot('slider-thumb'), index: 0, circular: true, size: THUMB, bg: "$background", borderWidth: 1, borderColor: "$color12", ...touch(THUMB) })] }));
|
|
17
10
|
export { Slider };
|
|
18
11
|
//# sourceMappingURL=slider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/backends/gui/slider.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,mFAAmF;AACnF,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,YAAY,CAAA;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,KAAK,GAAG,CAAC,CAAA;AACf,MAAM,KAAK,GAAG,EAAE,CAAA;AAIhB,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,CACrC,MAAC,SAAS,OAAK,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAC,MAAM,KAAK,KAAK,aACnD,KAAC,SAAS,CAAC,KAAK,OAAK,IAAI,CAAC,cAAc,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,EAAC,SAAS,EAAC,OAAO,EAAC,KAAK,YAClF,KAAC,SAAS,CAAC,WAAW,OAAK,IAAI,CAAC,cAAc,CAAC,EAAE,EAAE,EAAC,UAAU,GAAG,GACjD,EAClB,KAAC,SAAS,CAAC,KAAK,OACV,IAAI,CAAC,cAAc,CAAC,EACxB,KAAK,EAAE,CAAC,EACR,QAAQ,QACR,IAAI,EAAE,KAAK
|
|
1
|
+
{"version":3,"file":"slider.js","sourceRoot":"","sources":["../../../src/backends/gui/slider.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,mFAAmF;AACnF,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,YAAY,CAAA;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,KAAK,GAAG,CAAC,CAAA;AACf,MAAM,KAAK,GAAG,EAAE,CAAA;AAIhB,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,CACrC,MAAC,SAAS,OAAK,IAAI,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAC,MAAM,KAAK,KAAK,aACnD,KAAC,SAAS,CAAC,KAAK,OAAK,IAAI,CAAC,cAAc,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,EAAC,SAAS,EAAC,OAAO,EAAC,KAAK,YAClF,KAAC,SAAS,CAAC,WAAW,OAAK,IAAI,CAAC,cAAc,CAAC,EAAE,EAAE,EAAC,UAAU,GAAG,GACjD,EAClB,KAAC,SAAS,CAAC,KAAK,OACV,IAAI,CAAC,cAAc,CAAC,EACxB,KAAK,EAAE,CAAC,EACR,QAAQ,QACR,IAAI,EAAE,KAAK,EACX,EAAE,EAAC,aAAa,EAChB,WAAW,EAAE,CAAC,EACd,WAAW,EAAC,UAAU,KAClB,KAAK,CAAC,KAAK,CAAC,GAChB,IACQ,CACb,CAAA;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
|
@@ -9,7 +9,5 @@ const slot_1 = require("./slot.cjs");
|
|
|
9
9
|
const gesture_1 = require("./gesture.cjs");
|
|
10
10
|
const TRACK_H = 20;
|
|
11
11
|
const THUMB = 16;
|
|
12
|
-
const Switch = (props) => ((0, jsx_runtime_1.jsx)(gui_1.Switch, { ...(0, slot_1.slot)('switch'), width: 36, height: TRACK_H, padding: 2, flexShrink: 0,
|
|
13
|
-
// Without an explicit border the UA's 2px outset button border shows.
|
|
14
|
-
borderWidth: 1, borderColor: "$borderColor", ...(0, gesture_1.touch)(TRACK_H, 44, 'y'), ...props, children: (0, jsx_runtime_1.jsx)(gui_1.Switch.Thumb, { ...(0, slot_1.slot)('switch-thumb'), width: THUMB, height: THUMB }) }));
|
|
12
|
+
const Switch = (props) => ((0, jsx_runtime_1.jsx)(gui_1.Switch, { ...(0, slot_1.slot)('switch'), width: 36, height: TRACK_H, padding: 2, flexShrink: 0, ...(0, gesture_1.touch)(TRACK_H, 44, 'y'), ...props, children: (0, jsx_runtime_1.jsx)(gui_1.Switch.Thumb, { ...(0, slot_1.slot)('switch-thumb'), width: THUMB, height: THUMB }) }));
|
|
15
13
|
exports.Switch = Switch;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/switch.tsx"],"names":[],"mappings":"AAEA,gFAAgF;AAChF,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAO3C,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,CAAA;AAE1D,QAAA,MAAM,MAAM,GAAI,OAAO,WAAW,
|
|
1
|
+
{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/switch.tsx"],"names":[],"mappings":"AAEA,gFAAgF;AAChF,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAO3C,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,CAAA;AAE1D,QAAA,MAAM,MAAM,GAAI,OAAO,WAAW,4CAgBjC,CAAA;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
|
@@ -6,8 +6,6 @@ import { slot } from './slot.js';
|
|
|
6
6
|
import { touch } from './gesture.js';
|
|
7
7
|
const TRACK_H = 20;
|
|
8
8
|
const THUMB = 16;
|
|
9
|
-
const Switch = (props) => (_jsx(GuiSwitch, { ...slot('switch'), width: 36, height: TRACK_H, padding: 2, flexShrink: 0,
|
|
10
|
-
// Without an explicit border the UA's 2px outset button border shows.
|
|
11
|
-
borderWidth: 1, borderColor: "$borderColor", ...touch(TRACK_H, 44, 'y'), ...props, children: _jsx(GuiSwitch.Thumb, { ...slot('switch-thumb'), width: THUMB, height: THUMB }) }));
|
|
9
|
+
const Switch = (props) => (_jsx(GuiSwitch, { ...slot('switch'), width: 36, height: TRACK_H, padding: 2, flexShrink: 0, ...touch(TRACK_H, 44, 'y'), ...props, children: _jsx(GuiSwitch.Thumb, { ...slot('switch-thumb'), width: THUMB, height: THUMB }) }));
|
|
12
10
|
export { Switch };
|
|
13
11
|
//# sourceMappingURL=switch.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../src/backends/gui/switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,gFAAgF;AAChF,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,YAAY,CAAA;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,OAAO,GAAG,EAAE,CAAA;AAClB,MAAM,KAAK,GAAG,EAAE,CAAA;AAIhB,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,CACrC,KAAC,SAAS,OACJ,IAAI,CAAC,QAAQ,CAAC,EAClB,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,OAAO,EACf,OAAO,EAAE,CAAC,EACV,UAAU,EAAE,CAAC
|
|
1
|
+
{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../src/backends/gui/switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,gFAAgF;AAChF,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,YAAY,CAAA;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,OAAO,GAAG,EAAE,CAAA;AAClB,MAAM,KAAK,GAAG,EAAE,CAAA;AAIhB,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE,CAAC,CACrC,KAAC,SAAS,OACJ,IAAI,CAAC,QAAQ,CAAC,EAClB,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,OAAO,EACf,OAAO,EAAE,CAAC,EACV,UAAU,EAAE,CAAC,KACT,KAAK,CAAC,OAAO,EAAE,EAAE,EAAE,GAAG,CAAC,KACvB,KAAK,YAET,KAAC,SAAS,CAAC,KAAK,OACV,IAAI,CAAC,cAAc,CAAC,EACxB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,KAAK,GACb,GACQ,CACb,CAAA;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
|
@@ -15,5 +15,5 @@ const TabsList = (p) => ((0, jsx_runtime_1.jsx)(gui_1.Tabs.List, { ...(0, slot_1
|
|
|
15
15
|
exports.TabsList = TabsList;
|
|
16
16
|
const TabsTrigger = ({ children, ...p }) => ((0, jsx_runtime_1.jsx)(gui_1.Tabs.Tab, { ...(0, slot_1.slot)('tabs-trigger'), unstyled: true, items: "center", justify: "center", height: "100%", px: "$3", gap: "$1.5", rounded: "$3", cursor: "pointer", ...(0, gesture_1.touch)(ROW_H, 44, 'y'), hoverStyle: { bg: '$color4' }, focusStyle: { bg: '$color4' }, ...p, children: (0, ink_1.ink)(children, undefined, { size: '$2', fontWeight: '500' }) }));
|
|
17
17
|
exports.TabsTrigger = TabsTrigger;
|
|
18
|
-
const TabsContent = (
|
|
18
|
+
const TabsContent = (p) => (0, jsx_runtime_1.jsx)(gui_1.Tabs.Content, { ...(0, slot_1.slot)('tabs-content'), flex: 1, ...p });
|
|
19
19
|
exports.TabsContent = TabsContent;
|
|
@@ -8,6 +8,6 @@ export type TabsContentProps = ComponentProps<typeof GuiTabs.Content>;
|
|
|
8
8
|
declare const Tabs: (p: TabsProps) => import("react/jsx-runtime").JSX.Element;
|
|
9
9
|
declare const TabsList: (p: TabsListProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
10
|
declare const TabsTrigger: ({ children, ...p }: TabsTriggerProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
|
-
declare const TabsContent: (
|
|
11
|
+
declare const TabsContent: (p: TabsContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
export { Tabs, TabsList, TabsTrigger, TabsContent };
|
|
13
13
|
//# sourceMappingURL=tabs.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/tabs.tsx"],"names":[],"mappings":"AAEA,gFAAgF;AAChF,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,MAAM,YAAY,CAAA;AAC5C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAO3C,MAAM,MAAM,SAAS,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAA;AACtD,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,IAAI,CAAC,CAAA;AAC/D,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,GAAG,CAAC,CAAA;AACjE,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,OAAO,CAAC,CAAA;AAErE,QAAA,MAAM,IAAI,GAAI,GAAG,SAAS,4CAAyE,CAAA;AAEnG,QAAA,MAAM,QAAQ,GAAI,GAAG,aAAa,4CAajC,CAAA;AAED,QAAA,MAAM,WAAW,GAAI,oBAAoB,gBAAgB,4CAkBxD,CAAA;AAED,QAAA,MAAM,WAAW,GAAI,
|
|
1
|
+
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/tabs.tsx"],"names":[],"mappings":"AAEA,gFAAgF;AAChF,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,MAAM,YAAY,CAAA;AAC5C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAO3C,MAAM,MAAM,SAAS,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAA;AACtD,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,IAAI,CAAC,CAAA;AAC/D,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,GAAG,CAAC,CAAA;AACjE,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,OAAO,CAAC,CAAA;AAErE,QAAA,MAAM,IAAI,GAAI,GAAG,SAAS,4CAAyE,CAAA;AAEnG,QAAA,MAAM,QAAQ,GAAI,GAAG,aAAa,4CAajC,CAAA;AAED,QAAA,MAAM,WAAW,GAAI,oBAAoB,gBAAgB,4CAkBxD,CAAA;AAED,QAAA,MAAM,WAAW,GAAI,GAAG,gBAAgB,4CAAkE,CAAA;AAE1G,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAA"}
|
|
@@ -9,6 +9,6 @@ const ROW_H = 36;
|
|
|
9
9
|
const Tabs = (p) => _jsx(GuiTabs, { ...slot('tabs'), flexDirection: "column", gap: "$2", ...p });
|
|
10
10
|
const TabsList = (p) => (_jsx(GuiTabs.List, { ...slot('tabs-list'), items: "center", justify: "center", self: "flex-start", height: ROW_H, p: 3, gap: 2, bg: "$color3", rounded: "$4", ...p }));
|
|
11
11
|
const TabsTrigger = ({ children, ...p }) => (_jsx(GuiTabs.Tab, { ...slot('tabs-trigger'), unstyled: true, items: "center", justify: "center", height: "100%", px: "$3", gap: "$1.5", rounded: "$3", cursor: "pointer", ...touch(ROW_H, 44, 'y'), hoverStyle: { bg: '$color4' }, focusStyle: { bg: '$color4' }, ...p, children: ink(children, undefined, { size: '$2', fontWeight: '500' }) }));
|
|
12
|
-
const TabsContent = (
|
|
12
|
+
const TabsContent = (p) => _jsx(GuiTabs.Content, { ...slot('tabs-content'), flex: 1, ...p });
|
|
13
13
|
export { Tabs, TabsList, TabsTrigger, TabsContent };
|
|
14
14
|
//# sourceMappingURL=tabs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/backends/gui/tabs.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,gFAAgF;AAChF,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,MAAM,YAAY,CAAA;AAE5C,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAC3B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,KAAK,GAAG,EAAE,CAAA;AAOhB,MAAM,IAAI,GAAG,CAAC,CAAY,EAAE,EAAE,CAAC,KAAC,OAAO,OAAK,IAAI,CAAC,MAAM,CAAC,EAAE,aAAa,EAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,KAAK,CAAC,GAAI,CAAA;AAEnG,MAAM,QAAQ,GAAG,CAAC,CAAgB,EAAE,EAAE,CAAC,CACrC,KAAC,OAAO,CAAC,IAAI,OACP,IAAI,CAAC,WAAW,CAAC,EACrB,KAAK,EAAC,QAAQ,EACd,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAC,YAAY,EACjB,MAAM,EAAE,KAAK,EACb,CAAC,EAAE,CAAC,EACJ,GAAG,EAAE,CAAC,EACN,EAAE,EAAC,SAAS,EACZ,OAAO,EAAC,IAAI,KACR,CAAC,GACL,CACH,CAAA;AAED,MAAM,WAAW,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,CAAC,EAAoB,EAAE,EAAE,CAAC,CAC5D,KAAC,OAAO,CAAC,GAAG,OACN,IAAI,CAAC,cAAc,CAAC,EACxB,QAAQ,QACR,KAAK,EAAC,QAAQ,EACd,OAAO,EAAC,QAAQ,EAChB,MAAM,EAAC,MAAM,EACb,EAAE,EAAC,IAAI,EACP,GAAG,EAAC,MAAM,EACV,OAAO,EAAC,IAAI,EACZ,MAAM,EAAC,SAAS,KACZ,KAAK,CAAC,KAAK,EAAE,EAAE,EAAE,GAAG,CAAC,EACzB,UAAU,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,EAC7B,UAAU,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,KACzB,CAAC,YAEJ,GAAG,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,GAChD,CACf,CAAA;AAED,MAAM,WAAW,GAAG,CAAC,
|
|
1
|
+
{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/backends/gui/tabs.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,gFAAgF;AAChF,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,MAAM,YAAY,CAAA;AAE5C,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAC3B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,KAAK,GAAG,EAAE,CAAA;AAOhB,MAAM,IAAI,GAAG,CAAC,CAAY,EAAE,EAAE,CAAC,KAAC,OAAO,OAAK,IAAI,CAAC,MAAM,CAAC,EAAE,aAAa,EAAC,QAAQ,EAAC,GAAG,EAAC,IAAI,KAAK,CAAC,GAAI,CAAA;AAEnG,MAAM,QAAQ,GAAG,CAAC,CAAgB,EAAE,EAAE,CAAC,CACrC,KAAC,OAAO,CAAC,IAAI,OACP,IAAI,CAAC,WAAW,CAAC,EACrB,KAAK,EAAC,QAAQ,EACd,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAC,YAAY,EACjB,MAAM,EAAE,KAAK,EACb,CAAC,EAAE,CAAC,EACJ,GAAG,EAAE,CAAC,EACN,EAAE,EAAC,SAAS,EACZ,OAAO,EAAC,IAAI,KACR,CAAC,GACL,CACH,CAAA;AAED,MAAM,WAAW,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,CAAC,EAAoB,EAAE,EAAE,CAAC,CAC5D,KAAC,OAAO,CAAC,GAAG,OACN,IAAI,CAAC,cAAc,CAAC,EACxB,QAAQ,QACR,KAAK,EAAC,QAAQ,EACd,OAAO,EAAC,QAAQ,EAChB,MAAM,EAAC,MAAM,EACb,EAAE,EAAC,IAAI,EACP,GAAG,EAAC,MAAM,EACV,OAAO,EAAC,IAAI,EACZ,MAAM,EAAC,SAAS,KACZ,KAAK,CAAC,KAAK,EAAE,EAAE,EAAE,GAAG,CAAC,EACzB,UAAU,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,EAC7B,UAAU,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,KACzB,CAAC,YAEJ,GAAG,CAAC,QAAQ,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,GAChD,CACf,CAAA;AAED,MAAM,WAAW,GAAG,CAAC,CAAmB,EAAE,EAAE,CAAC,KAAC,OAAO,CAAC,OAAO,OAAK,IAAI,CAAC,cAAc,CAAC,EAAE,IAAI,EAAE,CAAC,KAAM,CAAC,GAAI,CAAA;AAE1G,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAA"}
|
|
@@ -38,6 +38,7 @@ exports.Textarea = void 0;
|
|
|
38
38
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
39
39
|
const React = __importStar(require("react"));
|
|
40
40
|
const gui_1 = require("@hanzo/gui");
|
|
41
|
+
const focus_1 = require("./focus.cjs");
|
|
41
42
|
/** Floor for the grown row count. */
|
|
42
43
|
const MIN_ROWS = 3;
|
|
43
44
|
const rowsOf = (v) => typeof v === "string" ? v.split("\n").length : 0;
|
|
@@ -45,6 +46,6 @@ const Textarea = /* @__PURE__ */ React.forwardRef(function Textarea({ rows, valu
|
|
|
45
46
|
const [typed, setTyped] = React.useState(() => rowsOf(defaultValue));
|
|
46
47
|
const uncontrolled = value === undefined;
|
|
47
48
|
const invalid = props["aria-invalid"];
|
|
48
|
-
return ((0, jsx_runtime_1.jsx)(gui_1.TextArea, { ref: ref, "data-slot": "textarea", rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, width: "100%", minH: 64, rounded: "$4", bg: "transparent", borderWidth: 1, borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", placeholderTextColor: "$color10", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props }));
|
|
49
|
+
return ((0, jsx_runtime_1.jsx)(gui_1.TextArea, { ref: ref, "data-slot": "textarea", rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, width: "100%", minH: 64, rounded: "$4", bg: "transparent", borderWidth: 1, borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", ...focus_1.FOCUS, placeholderTextColor: "$color10", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props }));
|
|
49
50
|
});
|
|
50
51
|
exports.Textarea = Textarea;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;
|
|
1
|
+
{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AASrC;;;;;;;GAOG;AACH;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,EAAE,UAAU,CAAC,GACjF,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC,CAAA;AAE9D,QAAA,MAAM,QAAQ,wGA2Bb,CAAA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { TextArea } from "@hanzo/gui";
|
|
5
|
+
import { FOCUS } from "./focus.js";
|
|
5
6
|
/** Floor for the grown row count. */
|
|
6
7
|
const MIN_ROWS = 3;
|
|
7
8
|
const rowsOf = (v) => typeof v === "string" ? v.split("\n").length : 0;
|
|
@@ -9,7 +10,7 @@ const Textarea = /* @__PURE__ */ React.forwardRef(function Textarea({ rows, valu
|
|
|
9
10
|
const [typed, setTyped] = React.useState(() => rowsOf(defaultValue));
|
|
10
11
|
const uncontrolled = value === undefined;
|
|
11
12
|
const invalid = props["aria-invalid"];
|
|
12
|
-
return (_jsx(TextArea, { ref: ref, "data-slot": "textarea", rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, width: "100%", minH: 64, rounded: "$4", bg: "transparent", borderWidth: 1, borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", placeholderTextColor: "$color10", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props }));
|
|
13
|
+
return (_jsx(TextArea, { ref: ref, "data-slot": "textarea", rows: Math.max(rows ?? MIN_ROWS, uncontrolled ? typed : rowsOf(value)), value: value, defaultValue: defaultValue, onChangeText: uncontrolled ? (t) => setTyped(rowsOf(t)) : undefined, width: "100%", minH: 64, rounded: "$4", bg: "transparent", borderWidth: 1, borderColor: invalid && invalid !== "false" ? "$red7" : "$borderColor", ...FOCUS, placeholderTextColor: "$color10", fontSize: "$3", opacity: props.disabled ? 0.5 : 1, ...props }));
|
|
13
14
|
});
|
|
14
15
|
export { Textarea };
|
|
15
16
|
//# sourceMappingURL=textarea.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;
|
|
1
|
+
{"version":3,"file":"textarea.js","sourceRoot":"","sources":["../../../src/backends/gui/textarea.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,qCAAqC;AACrC,MAAM,QAAQ,GAAG,CAAC,CAAA;AAElB,MAAM,MAAM,GAAG,CAAC,CAAU,EAAE,EAAE,CAC5B,OAAO,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAA;AAkBlD,MAAM,QAAQ,GAAG,eAAe,CAAC,KAAK,CAAC,UAAU,CAC/C,SAAS,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG;IAC9D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAA;IACpE,MAAM,YAAY,GAAG,KAAK,KAAK,SAAS,CAAA;IACxC,MAAM,OAAO,GAAG,KAAK,CAAC,cAAc,CAAC,CAAA;IACrC,OAAO,CACL,KAAC,QAAQ,IACP,GAAG,EAAE,GAAY,eACP,UAAU,EACpB,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,IAAI,QAAQ,EAAE,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EACtE,KAAK,EAAE,KAA2B,EAClC,YAAY,EAAE,YAAkC,EAChD,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EACnE,KAAK,EAAC,MAAM,EACZ,IAAI,EAAE,EAAE,EACR,OAAO,EAAC,IAAI,EACZ,EAAE,EAAC,aAAa,EAChB,WAAW,EAAE,CAAC,EACd,WAAW,EAAE,OAAO,IAAI,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,cAAc,KAClE,KAAK,EACT,oBAAoB,EAAC,UAAU,EAC/B,QAAQ,EAAC,IAAI,EACb,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAC5B,KAAiC,GACtC,CACH,CAAA;AACD,CAAC,CACF,CAAA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
|
package/dist/index.cjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use client';"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.DropdownMenuSubTrigger = exports.DropdownMenuSubContent = exports.DropdownMenuSub = exports.DropdownMenuShortcut = exports.DropdownMenuSeparator = exports.DropdownMenuRadioItem = exports.DropdownMenuRadioGroup = exports.DropdownMenuPortal = exports.DropdownMenuLabel = exports.DropdownMenuItem = exports.DropdownMenuGroup = exports.DropdownMenuContent = exports.DropdownMenuCheckboxItem = exports.DropdownMenu = exports.DialogTrigger = exports.DialogTitle = exports.DialogPortal = exports.DialogOverlay = exports.DialogHeader = exports.DialogFooter = exports.DialogDescription = exports.DialogContent = exports.DialogClose = exports.Dialog = exports.CommandShortcut = exports.CommandSeparator = exports.CommandList = exports.CommandItem = exports.CommandInput = exports.CommandGroup = exports.CommandEmpty = exports.CommandDialog = exports.Command = exports.CollapsibleTrigger = exports.CollapsibleContent = exports.Collapsible = exports.Checkbox = exports.CardTitle = exports.CardHeader = exports.CardFooter = exports.CardDescription = exports.CardContent = exports.CardAction = exports.Card = exports.Button = exports.Badge = exports.AvatarImage = exports.AvatarFallback = exports.Avatar = exports.AspectRatio = void 0;
|
|
4
|
-
exports.cn = exports.
|
|
4
|
+
exports.cn = exports.toast = exports.buttonVariants = exports.badgeVariants = exports.TooltipTrigger = exports.TooltipProvider = exports.TooltipContent = exports.Tooltip = exports.Toaster = exports.Textarea = exports.TabsTrigger = exports.TabsList = exports.TabsContent = exports.Tabs = exports.Switch = exports.Slider = exports.Separator = exports.SelectValue = exports.SelectTrigger = exports.SelectSeparator = exports.SelectScrollUpButton = exports.SelectScrollDownButton = exports.SelectLabel = exports.SelectItem = exports.SelectGroup = exports.SelectContent = exports.Select = exports.ScrollBar = exports.ScrollArea = exports.ResizablePanelGroup = exports.ResizablePanel = exports.ResizableHandle = exports.Progress = exports.PopoverTrigger = exports.PopoverContent = exports.PopoverClose = exports.PopoverAnchor = exports.Popover = exports.Label = exports.Input = exports.DropdownMenuTrigger = void 0;
|
|
5
5
|
// @hanzo/ui — the one Hanzo component library, on @hanzo/gui + @hanzo/tokens.
|
|
6
6
|
//
|
|
7
7
|
// ONE substrate: every component renders through @hanzo/gui primitives, so the
|
|
@@ -122,11 +122,6 @@ Object.defineProperty(exports, "TooltipTrigger", { enumerable: true, get: functi
|
|
|
122
122
|
Object.defineProperty(exports, "badgeVariants", { enumerable: true, get: function () { return gui_1.badgeVariants; } });
|
|
123
123
|
Object.defineProperty(exports, "buttonVariants", { enumerable: true, get: function () { return gui_1.buttonVariants; } });
|
|
124
124
|
Object.defineProperty(exports, "toast", { enumerable: true, get: function () { return gui_1.toast; } });
|
|
125
|
-
// `Hanzo` — the root, and the only thing an app mounts. It carries the gui
|
|
126
|
-
// config and the generated stylesheet, so `npm i @hanzo/ui` is the whole setup:
|
|
127
|
-
// no gui.config.ts, no CSS import, no generator script.
|
|
128
|
-
var root_1 = require("./root.cjs");
|
|
129
|
-
Object.defineProperty(exports, "Hanzo", { enumerable: true, get: function () { return root_1.Hanzo; } });
|
|
130
125
|
// `cn` — the class-name composer, surfaced for convenience.
|
|
131
126
|
var cn_1 = require("./core/cn.cjs");
|
|
132
127
|
Object.defineProperty(exports, "cn", { enumerable: true, get: function () { return cn_1.cn; } });
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
export { AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, 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, Input, Label, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Slider, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, toast, } from './backends/gui/index.js';
|
|
2
2
|
export type { AspectRatioProps, BadgeProps, BadgeVariant, ButtonProps, ButtonSize, ButtonVariant, CommandFilter, CommandProps, DropdownMenuProps, InputProps, ResizableHandleProps, ResizablePanelGroupProps, ResizablePanelProps, } from './backends/gui/index.js';
|
|
3
|
-
export { Hanzo, type HanzoProps } from './root.js';
|
|
4
3
|
export { cn } from './core/cn.js';
|
|
5
4
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AA6BA,OAAO,EACL,WAAW,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EACjF,WAAW,EAAE,eAAe,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EACtF,kBAAkB,EAAE,kBAAkB,EAAE,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAC1F,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,EACjF,WAAW,EAAE,aAAa,EAAE,iBAAiB,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EACxF,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,wBAAwB,EAChF,mBAAmB,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,iBAAiB,EAC3E,kBAAkB,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,qBAAqB,EACxF,oBAAoB,EAAE,eAAe,EAAE,sBAAsB,EAAE,sBAAsB,EACrF,mBAAmB,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,cAAc,EACvF,cAAc,EAAE,QAAQ,EAAE,eAAe,EAAE,cAAc,EAAE,mBAAmB,EAAE,UAAU,EAC1F,SAAS,EAAE,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,WAAW,EACtE,sBAAsB,EAAE,oBAAoB,EAAE,eAAe,EAAE,aAAa,EAAE,WAAW,EACzF,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,EACtF,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,cAAc,EAAE,aAAa,EAAE,cAAc,EACvF,KAAK,GACN,MAAM,gBAAgB,CAAA;AAEvB,YAAY,EACV,gBAAgB,EAAE,UAAU,EAAE,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,aAAa,EAClF,aAAa,EAAE,YAAY,EAAE,iBAAiB,EAAE,UAAU,EAAE,oBAAoB,EAChF,wBAAwB,EAAE,mBAAmB,GAC9C,MAAM,gBAAgB,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AA6BA,OAAO,EACL,WAAW,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EACjF,WAAW,EAAE,eAAe,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EACtF,kBAAkB,EAAE,kBAAkB,EAAE,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAC1F,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,EACjF,WAAW,EAAE,aAAa,EAAE,iBAAiB,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EACxF,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,wBAAwB,EAChF,mBAAmB,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,iBAAiB,EAC3E,kBAAkB,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,qBAAqB,EACxF,oBAAoB,EAAE,eAAe,EAAE,sBAAsB,EAAE,sBAAsB,EACrF,mBAAmB,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,cAAc,EACvF,cAAc,EAAE,QAAQ,EAAE,eAAe,EAAE,cAAc,EAAE,mBAAmB,EAAE,UAAU,EAC1F,SAAS,EAAE,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,WAAW,EACtE,sBAAsB,EAAE,oBAAoB,EAAE,eAAe,EAAE,aAAa,EAAE,WAAW,EACzF,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,EACtF,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,cAAc,EAAE,aAAa,EAAE,cAAc,EACvF,KAAK,GACN,MAAM,gBAAgB,CAAA;AAEvB,YAAY,EACV,gBAAgB,EAAE,UAAU,EAAE,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,aAAa,EAClF,aAAa,EAAE,YAAY,EAAE,iBAAiB,EAAE,UAAU,EAAE,oBAAoB,EAChF,wBAAwB,EAAE,mBAAmB,GAC9C,MAAM,gBAAgB,CAAA;AAGvB,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAA"}
|
package/dist/index.js
CHANGED
|
@@ -28,10 +28,6 @@
|
|
|
28
28
|
// ./backends/gui already declares these as explicit named blocks; this list mirrors
|
|
29
29
|
// it and is regenerated the same way (scripts/gen-primitives.mjs reads that manifest).
|
|
30
30
|
export { AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, 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, Input, Label, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Slider, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, toast, } from './backends/gui/index.js';
|
|
31
|
-
// `Hanzo` — the root, and the only thing an app mounts. It carries the gui
|
|
32
|
-
// config and the generated stylesheet, so `npm i @hanzo/ui` is the whole setup:
|
|
33
|
-
// no gui.config.ts, no CSS import, no generator script.
|
|
34
|
-
export { Hanzo } from './root.js';
|
|
35
31
|
// `cn` — the class-name composer, surfaced for convenience.
|
|
36
32
|
export { cn } from './core/cn.js';
|
|
37
33
|
// The design-token scale (colors, dark/light themes, radii, spacing, typography)
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,8EAA8E;AAC9E,EAAE;AACF,+EAA+E;AAC/E,kFAAkF;AAClF,4EAA4E;AAC5E,+EAA+E;AAC/E,EAAE;AACF,qGAAqG;AACrG,yGAAyG;AACzG,6GAA6G;AAC7G,4GAA4G;AAC5G,4GAA4G;AAC5G,mHAAmH;AACnH,EAAE;AACF,6EAA6E;AAC7E,2EAA2E;AAC3E,gEAAgE;AAChE,yBAAyB;AACzB,EAAE;AACF,6EAA6E;AAC7E,mFAAmF;AACnF,mFAAmF;AACnF,EAAE;AACF,+EAA+E;AAC/E,mFAAmF;AACnF,wBAAwB;AACxB,EAAE;AACF,oFAAoF;AACpF,uFAAuF;AACvF,OAAO,EACL,WAAW,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EACjF,WAAW,EAAE,eAAe,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EACtF,kBAAkB,EAAE,kBAAkB,EAAE,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAC1F,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,EACjF,WAAW,EAAE,aAAa,EAAE,iBAAiB,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EACxF,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,wBAAwB,EAChF,mBAAmB,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,iBAAiB,EAC3E,kBAAkB,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,qBAAqB,EACxF,oBAAoB,EAAE,eAAe,EAAE,sBAAsB,EAAE,sBAAsB,EACrF,mBAAmB,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,cAAc,EACvF,cAAc,EAAE,QAAQ,EAAE,eAAe,EAAE,cAAc,EAAE,mBAAmB,EAAE,UAAU,EAC1F,SAAS,EAAE,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,WAAW,EACtE,sBAAsB,EAAE,oBAAoB,EAAE,eAAe,EAAE,aAAa,EAAE,WAAW,EACzF,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,EACtF,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,cAAc,EAAE,aAAa,EAAE,cAAc,EACvF,KAAK,GACN,MAAM,gBAAgB,CAAA;AAQvB,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,8EAA8E;AAC9E,EAAE;AACF,+EAA+E;AAC/E,kFAAkF;AAClF,4EAA4E;AAC5E,+EAA+E;AAC/E,EAAE;AACF,qGAAqG;AACrG,yGAAyG;AACzG,6GAA6G;AAC7G,4GAA4G;AAC5G,4GAA4G;AAC5G,mHAAmH;AACnH,EAAE;AACF,6EAA6E;AAC7E,2EAA2E;AAC3E,gEAAgE;AAChE,yBAAyB;AACzB,EAAE;AACF,6EAA6E;AAC7E,mFAAmF;AACnF,mFAAmF;AACnF,EAAE;AACF,+EAA+E;AAC/E,mFAAmF;AACnF,wBAAwB;AACxB,EAAE;AACF,oFAAoF;AACpF,uFAAuF;AACvF,OAAO,EACL,WAAW,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EACjF,WAAW,EAAE,eAAe,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EACtF,kBAAkB,EAAE,kBAAkB,EAAE,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,YAAY,EAC1F,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,EACjF,WAAW,EAAE,aAAa,EAAE,iBAAiB,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EACxF,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,wBAAwB,EAChF,mBAAmB,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,iBAAiB,EAC3E,kBAAkB,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,qBAAqB,EACxF,oBAAoB,EAAE,eAAe,EAAE,sBAAsB,EAAE,sBAAsB,EACrF,mBAAmB,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,cAAc,EACvF,cAAc,EAAE,QAAQ,EAAE,eAAe,EAAE,cAAc,EAAE,mBAAmB,EAAE,UAAU,EAC1F,SAAS,EAAE,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,WAAW,EACtE,sBAAsB,EAAE,oBAAoB,EAAE,eAAe,EAAE,aAAa,EAAE,WAAW,EACzF,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,EACtF,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,cAAc,EAAE,aAAa,EAAE,cAAc,EACvF,KAAK,GACN,MAAM,gBAAgB,CAAA;AAQvB,4DAA4D;AAC5D,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAA;AAE9B,iFAAiF;AACjF,6EAA6E;AAC7E,WAAW"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
'use client';"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.Glass = void 0;
|
|
4
|
+
// GENERATED by scripts/gen-primitives.mjs — do not edit. Per-member entrypoint
|
|
5
|
+
// for hosts that modularize `@hanzo/ui` imports. Source of truth:
|
|
6
|
+
// src/backends/gui/index.ts. Re-run: node scripts/gen-primitives.mjs
|
|
7
|
+
var glass_1 = require("../backends/gui/glass.cjs");
|
|
8
|
+
Object.defineProperty(exports, "Glass", { enumerable: true, get: function () { return glass_1.Glass; } });
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Glass.d.ts","sourceRoot":"","sources":["../../src/primitives/Glass.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
// GENERATED by scripts/gen-primitives.mjs — do not edit. Per-member entrypoint
|
|
2
|
+
// for hosts that modularize `@hanzo/ui` imports. Source of truth:
|
|
3
|
+
// src/backends/gui/index.ts. Re-run: node scripts/gen-primitives.mjs
|
|
4
|
+
export { Glass } from '../backends/gui/glass.js';
|
|
5
|
+
//# sourceMappingURL=Glass.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Glass.js","sourceRoot":"","sources":["../../src/primitives/Glass.tsx"],"names":[],"mappings":"AAAA,+EAA+E;AAC/E,kEAAkE;AAClE,qEAAqE;AACrE,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA"}
|
package/dist/theme.css
CHANGED
|
@@ -9,18 +9,14 @@
|
|
|
9
9
|
* transparent). Values originate in `@hanzo/tokens` (dark/light theme sets) —
|
|
10
10
|
* the same source `@hanzo/ui/tokens` exposes to code — so CSS and runtime agree.
|
|
11
11
|
*
|
|
12
|
-
* Dark-first Hanzo identity: neutral zinc-on-black, calm, high-contrast.
|
|
13
|
-
*
|
|
14
|
-
*
|
|
15
|
-
* own CSS got white. `.light` retunes. Both themes also answer to gui's own
|
|
16
|
-
* `.t_light` / `.t_dark`, which <Hanzo> stamps on the body, so the CSS custom
|
|
17
|
-
* properties and the component tokens name one theme and never disagree.
|
|
18
|
-
* Typography is Geist Sans (UI/body) + Geist Mono (code) — bound
|
|
12
|
+
* Dark-first Hanzo identity: neutral zinc-on-black, calm, high-contrast. Add
|
|
13
|
+
* `class="dark"` on <html> for the canonical dark look; `:root` is the light
|
|
14
|
+
* counterpart. Typography is Geist Sans (UI/body) + Geist Mono (code) — bound
|
|
19
15
|
* through `--font-geist-sans` / `--font-geist-mono`; a host that loads Geist
|
|
20
16
|
* (next/font, @fontsource, CDN) binds those variables and everything inherits
|
|
21
17
|
* it. No Inter, no system-stack default anywhere.
|
|
22
18
|
*
|
|
23
|
-
* Plain CSS, nothing else: `:root`
|
|
19
|
+
* Plain CSS, nothing else: `:root`/`.dark` custom properties plus the base font
|
|
24
20
|
* and the touch/elevation rules the components name. The Tailwind v4 `@theme
|
|
25
21
|
* inline` block that used to map these onto utilities is gone with Tailwind.
|
|
26
22
|
*/
|
|
@@ -34,13 +30,22 @@
|
|
|
34
30
|
--font-geist-mono: var(--font-geist-mono-provided, 'Geist Mono');
|
|
35
31
|
}
|
|
36
32
|
|
|
37
|
-
/*
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
.dark,
|
|
41
|
-
.t_dark {
|
|
42
|
-
--radius: 0.5rem;
|
|
33
|
+
/* Light identity (the counterpart to dark-first). */
|
|
34
|
+
/* DARK IS THE DEFAULT, and it is the default HERE, not only in a consumer that
|
|
35
|
+
remembers to say so.
|
|
43
36
|
|
|
37
|
+
`:root` used to hold the light palette with dark behind `.dark`, so an app
|
|
38
|
+
that imported this file and did not put class="dark" on <html> rendered pure
|
|
39
|
+
white — oklch(1 0 0) — and every surface built that way came out bright white
|
|
40
|
+
by accident. It is also the opposite of @hanzo/design, whose `:root` is dark
|
|
41
|
+
with `.light` to opt out, so mixing the two inverted an app's theme depending
|
|
42
|
+
on which file won.
|
|
43
|
+
|
|
44
|
+
One convention now, matching the design system: `:root` is dark, `.light`
|
|
45
|
+
opts out. `.dark` is kept so an app that already states it is unaffected, and
|
|
46
|
+
`.light` follows both so it can still win. */
|
|
47
|
+
:root,
|
|
48
|
+
.dark {
|
|
44
49
|
--background: oklch(0.145 0 0);
|
|
45
50
|
--foreground: oklch(0.985 0 0);
|
|
46
51
|
--card: oklch(0.205 0 0);
|
|
@@ -76,10 +81,9 @@
|
|
|
76
81
|
--sidebar-ring: oklch(0.439 0 0);
|
|
77
82
|
}
|
|
78
83
|
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
.t_light {
|
|
84
|
+
.light {
|
|
85
|
+
--radius: 0.5rem;
|
|
86
|
+
|
|
83
87
|
--background: oklch(1 0 0);
|
|
84
88
|
--foreground: oklch(0.145 0 0);
|
|
85
89
|
--card: oklch(1 0 0);
|
|
@@ -115,27 +119,7 @@
|
|
|
115
119
|
--sidebar-ring: oklch(0.708 0 0);
|
|
116
120
|
}
|
|
117
121
|
|
|
118
|
-
/*
|
|
119
|
-
gui renders REAL <button>, <input> and <textarea> elements, and the browser
|
|
120
|
-
has opinions about those: a button is #efefef with a 2px OUTSET border. gui
|
|
121
|
-
compiles style props to border-WIDTH and border-COLOR and never emits
|
|
122
|
-
border-STYLE, so the UA's `outset` survived every one of them — which is why
|
|
123
|
-
a Collapsible trigger rendered as a white bar across a dark page and a Switch
|
|
124
|
-
wore a 2px black ring. A <div> was never affected (its border-style starts at
|
|
125
|
-
`none`), so this only ever showed on the components that are really buttons.
|
|
126
|
-
|
|
127
|
-
`:where()` carries ZERO specificity, so every gui atomic class still wins;
|
|
128
|
-
`border: 0 solid transparent` leaves the STYLE resolved so that a component
|
|
129
|
-
setting only a width and a colour actually draws its line. */
|
|
130
|
-
:where(button, input, textarea) {
|
|
131
|
-
appearance: none;
|
|
132
|
-
background-color: transparent;
|
|
133
|
-
border: 0 solid transparent;
|
|
134
|
-
color: inherit;
|
|
135
|
-
font: inherit;
|
|
136
|
-
margin: 0;
|
|
137
|
-
padding: 0;
|
|
138
|
-
}
|
|
122
|
+
/* Dark-first Hanzo identity — neutral zinc-on-black. */
|
|
139
123
|
|
|
140
124
|
/* Geist by default — UI/body inherits Geist Sans; code/mono surfaces get Geist
|
|
141
125
|
Mono. Components never hard-code a family; they inherit this or bind
|
|
@@ -214,3 +198,15 @@
|
|
|
214
198
|
.hz-elevation-2 { box-shadow: var(--hz-elevation-2, 0 4px 12px rgba(0, 0, 0, 0.24)); }
|
|
215
199
|
.hz-elevation-3 { box-shadow: var(--hz-elevation-3, 0 8px 24px rgba(0, 0, 0, 0.36)); }
|
|
216
200
|
.hz-elevation-4 { box-shadow: var(--hz-elevation-4, 0 16px 48px rgba(0, 0, 0, 0.44)); }
|
|
201
|
+
|
|
202
|
+
/* Glass — the ONE frosted material (see backends/gui/glass.tsx). The component
|
|
203
|
+
stands as a solid raised panel; only a browser that can actually blur the
|
|
204
|
+
backdrop trades it for the translucent material, so content never sits on
|
|
205
|
+
see-through ground without the blur. !important beats the compiled bg atom. */
|
|
206
|
+
@supports (backdrop-filter: blur(8px)) {
|
|
207
|
+
[data-slot="glass"] {
|
|
208
|
+
background-color: color-mix(in oklab, var(--background) 72%, transparent) !important;
|
|
209
|
+
-webkit-backdrop-filter: blur(20px) saturate(1.8);
|
|
210
|
+
backdrop-filter: blur(20px) saturate(1.8);
|
|
211
|
+
}
|
|
212
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hanzo/ui",
|
|
3
|
-
"version": "8.0.
|
|
3
|
+
"version": "8.0.43",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Hanzo UI — the one canonical Hanzo component library, on @hanzo/gui + @hanzo/tokens. 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.",
|
|
6
6
|
"exports": {
|
|
@@ -10,13 +10,6 @@
|
|
|
10
10
|
"require": "./dist/index.cjs",
|
|
11
11
|
"default": "./dist/index.js"
|
|
12
12
|
},
|
|
13
|
-
"./gallery": {
|
|
14
|
-
"types": "./dist/gallery.d.ts",
|
|
15
|
-
"import": "./dist/gallery.js",
|
|
16
|
-
"require": "./dist/gallery.cjs",
|
|
17
|
-
"default": "./dist/gallery.js"
|
|
18
|
-
},
|
|
19
|
-
"./styles.css": "./dist/styles.css",
|
|
20
13
|
"./models": {
|
|
21
14
|
"types": "./dist/models/index.d.ts",
|
|
22
15
|
"import": "./dist/models/index.js",
|
|
@@ -221,24 +214,21 @@
|
|
|
221
214
|
"react-native-web": "^0.21.2",
|
|
222
215
|
"typescript": "^5.9.3",
|
|
223
216
|
"vitest": "^4.1.8",
|
|
224
|
-
"@playwright/test": "^1.61.0",
|
|
225
217
|
"@hanzo/cd": "0.1.1"
|
|
226
218
|
},
|
|
227
219
|
"publishConfig": {
|
|
228
220
|
"access": "public"
|
|
229
221
|
},
|
|
230
|
-
"license": "
|
|
222
|
+
"license": "MIT",
|
|
231
223
|
"author": "Hanzo AI <dev@hanzo.ai>",
|
|
232
224
|
"scripts": {
|
|
233
|
-
"build": "rm -rf dist dist-cjs && tsc -p tsconfig.build.json && tsc -p tsconfig.cjs.json --noCheck && mkdir -p dist/styles && cp src/theme.css dist/theme.css && cp src/styles/hanzo-motion.css dist/styles/hanzo-motion.css && node scripts/postbuild.mjs
|
|
225
|
+
"build": "rm -rf dist dist-cjs && tsc -p tsconfig.build.json && tsc -p tsconfig.cjs.json --noCheck && mkdir -p dist/styles && cp src/theme.css dist/theme.css && cp src/styles/hanzo-motion.css dist/styles/hanzo-motion.css && node scripts/postbuild.mjs",
|
|
234
226
|
"clean": "rm -rf dist dist-cjs types",
|
|
235
227
|
"gen:primitives": "node scripts/gen-primitives.mjs",
|
|
236
228
|
"tc": "tsc --noEmit",
|
|
237
229
|
"typecheck": "tsc --noEmit",
|
|
238
230
|
"typecheck:ui": "tsc -p tsconfig.check.json",
|
|
239
|
-
"test": "vitest run
|
|
240
|
-
"test:watch": "vitest"
|
|
241
|
-
"test:consumer": "node scripts/consumer-test.mjs",
|
|
242
|
-
"test:unit": "vitest run"
|
|
231
|
+
"test": "vitest run",
|
|
232
|
+
"test:watch": "vitest"
|
|
243
233
|
}
|
|
244
234
|
}
|
package/dist/gallery.cjs
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
'use client';"use strict";
|
|
2
|
-
'use client';
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
exports.Gallery = void 0;
|
|
5
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
const gui_1 = require("./backends/gui/index.cjs");
|
|
7
|
-
const BUTTON_VARIANTS = [
|
|
8
|
-
'default', 'destructive', 'outline', 'secondary', 'ghost', 'link', 'primary', 'linkFG', 'linkMuted',
|
|
9
|
-
];
|
|
10
|
-
const BUTTON_SIZES = ['default', 'sm', 'lg', 'icon', 'icon-sm', 'icon-lg'];
|
|
11
|
-
const BADGE_VARIANTS = ['default', 'secondary', 'destructive', 'outline'];
|
|
12
|
-
/** One section. Plain CSS on a plain div — the gallery is a harness, and laying
|
|
13
|
-
* it out with the components under test would make a layout bug read as a
|
|
14
|
-
* styling bug. Rows wrap so the same tree is legible at 390px and at 1280px,
|
|
15
|
-
* which is what makes the screenshot baselines worth comparing. */
|
|
16
|
-
const Section = ({ name, children }) => ((0, jsx_runtime_1.jsx)("section", { "data-gallery": name, style: { display: 'flex', flexWrap: 'wrap', gap: 12, alignItems: 'center', maxWidth: 880 }, children: children }));
|
|
17
|
-
/**
|
|
18
|
-
* Every component, once. `data-gallery` names each section so a browser test can
|
|
19
|
-
* scope its assertions without depending on document order.
|
|
20
|
-
*/
|
|
21
|
-
const Gallery = () => ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column', gap: 28, padding: 24, maxWidth: 928 }, children: [(0, jsx_runtime_1.jsxs)(Section, { name: "button", children: [BUTTON_VARIANTS.map((variant) => ((0, jsx_runtime_1.jsx)(gui_1.Button, { variant: variant, children: variant }, variant))), BUTTON_SIZES.map((size) => ((0, jsx_runtime_1.jsx)(gui_1.Button, { size: size, children: size }, size))), (0, jsx_runtime_1.jsx)(gui_1.Button, { disabled: true, children: "disabled" }), (0, jsx_runtime_1.jsx)(gui_1.Button, { isLoading: true, children: "loading" })] }), (0, jsx_runtime_1.jsx)(Section, { name: "badge", children: BADGE_VARIANTS.map((variant) => ((0, jsx_runtime_1.jsx)(gui_1.Badge, { variant: variant, children: variant }, variant))) }), (0, jsx_runtime_1.jsx)(Section, { name: "card", children: (0, jsx_runtime_1.jsxs)(gui_1.Card, { children: [(0, jsx_runtime_1.jsxs)(gui_1.CardHeader, { children: [(0, jsx_runtime_1.jsx)(gui_1.CardTitle, { children: "Card title" }), (0, jsx_runtime_1.jsx)(gui_1.CardDescription, { children: "Card description" }), (0, jsx_runtime_1.jsx)(gui_1.CardAction, { children: (0, jsx_runtime_1.jsx)(gui_1.Button, { size: "sm", variant: "ghost", children: "action" }) })] }), (0, jsx_runtime_1.jsx)(gui_1.CardContent, { children: "Card content" }), (0, jsx_runtime_1.jsx)(gui_1.CardFooter, { children: "Card footer" })] }) }), (0, jsx_runtime_1.jsxs)(Section, { name: "form", children: [(0, jsx_runtime_1.jsx)(gui_1.Label, { children: "Label" }), (0, jsx_runtime_1.jsx)(gui_1.Input, { placeholder: "Input" }), (0, jsx_runtime_1.jsx)(gui_1.Input, { placeholder: "Password", type: "password" }), (0, jsx_runtime_1.jsx)(gui_1.Textarea, { placeholder: "Textarea" }), (0, jsx_runtime_1.jsx)(gui_1.Checkbox, {}), (0, jsx_runtime_1.jsx)(gui_1.Checkbox, { checked: true }), (0, jsx_runtime_1.jsx)(gui_1.Switch, {}), (0, jsx_runtime_1.jsx)(gui_1.Switch, { checked: true }), (0, jsx_runtime_1.jsx)(gui_1.Slider, { defaultValue: [40] }), (0, jsx_runtime_1.jsx)(gui_1.Progress, { value: 40 })] }), (0, jsx_runtime_1.jsx)(Section, { name: "tabs", children: (0, jsx_runtime_1.jsxs)(gui_1.Tabs, { defaultValue: "one", children: [(0, jsx_runtime_1.jsxs)(gui_1.TabsList, { children: [(0, jsx_runtime_1.jsx)(gui_1.TabsTrigger, { value: "one", children: "One" }), (0, jsx_runtime_1.jsx)(gui_1.TabsTrigger, { value: "two", children: "Two" })] }), (0, jsx_runtime_1.jsx)(gui_1.TabsContent, { value: "one", children: "Panel one" })] }) }), (0, jsx_runtime_1.jsxs)(Section, { name: "surface", children: [(0, jsx_runtime_1.jsx)(gui_1.Separator, {}), (0, jsx_runtime_1.jsx)(gui_1.AspectRatio, { ratio: 16 / 9 }), (0, jsx_runtime_1.jsx)(gui_1.Avatar, { children: (0, jsx_runtime_1.jsx)(gui_1.AvatarFallback, { children: "HZ" }) }), (0, jsx_runtime_1.jsx)(gui_1.ScrollArea, { height: 80, children: "Scroll area" }), (0, jsx_runtime_1.jsxs)(gui_1.ResizablePanelGroup, { direction: "horizontal", children: [(0, jsx_runtime_1.jsx)(gui_1.ResizablePanel, {}), (0, jsx_runtime_1.jsx)(gui_1.ResizableHandle, {}), (0, jsx_runtime_1.jsx)(gui_1.ResizablePanel, {})] })] }), (0, jsx_runtime_1.jsx)(Section, { name: "collapsible", children: (0, jsx_runtime_1.jsxs)(gui_1.Collapsible, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.CollapsibleTrigger, { children: "Collapsible trigger" }), (0, jsx_runtime_1.jsx)(gui_1.CollapsibleContent, { children: "Collapsible content" })] }) }), (0, jsx_runtime_1.jsx)(Section, { name: "command", children: (0, jsx_runtime_1.jsxs)(gui_1.Command, { children: [(0, jsx_runtime_1.jsx)(gui_1.CommandInput, {}), (0, jsx_runtime_1.jsxs)(gui_1.CommandList, { children: [(0, jsx_runtime_1.jsx)(gui_1.CommandEmpty, { children: "No results" }), (0, jsx_runtime_1.jsx)(gui_1.CommandGroup, { heading: "Group", children: (0, jsx_runtime_1.jsxs)(gui_1.CommandItem, { value: "a", children: ["Item", (0, jsx_runtime_1.jsx)(gui_1.CommandShortcut, { children: "\u2318A" })] }) }), (0, jsx_runtime_1.jsx)(gui_1.CommandSeparator, {})] })] }) }), (0, jsx_runtime_1.jsxs)(Section, { name: "overlay", children: [(0, jsx_runtime_1.jsx)(gui_1.Dialog, { open: true, children: (0, jsx_runtime_1.jsxs)(gui_1.DialogContent, { children: [(0, jsx_runtime_1.jsxs)(gui_1.DialogHeader, { children: [(0, jsx_runtime_1.jsx)(gui_1.DialogTitle, { children: "Dialog title" }), (0, jsx_runtime_1.jsx)(gui_1.DialogDescription, { children: "Dialog description" })] }), (0, jsx_runtime_1.jsx)(gui_1.DialogFooter, { children: (0, jsx_runtime_1.jsx)(gui_1.Button, { size: "sm", children: "OK" }) })] }) }), (0, jsx_runtime_1.jsxs)(gui_1.DropdownMenu, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.DropdownMenuTrigger, { children: "Menu" }), (0, jsx_runtime_1.jsxs)(gui_1.DropdownMenuContent, { children: [(0, jsx_runtime_1.jsx)(gui_1.DropdownMenuLabel, { children: "Label" }), (0, jsx_runtime_1.jsx)(gui_1.DropdownMenuSeparator, {}), (0, jsx_runtime_1.jsx)(gui_1.DropdownMenuItem, { children: "Item" })] })] }), (0, jsx_runtime_1.jsxs)(gui_1.Popover, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.PopoverTrigger, { children: "Popover" }), (0, jsx_runtime_1.jsx)(gui_1.PopoverContent, { children: "Popover content" })] }), (0, jsx_runtime_1.jsxs)(gui_1.Select, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.SelectTrigger, { children: (0, jsx_runtime_1.jsx)(gui_1.SelectValue, { placeholder: "Select" }) }), (0, jsx_runtime_1.jsx)(gui_1.SelectContent, { children: (0, jsx_runtime_1.jsx)(gui_1.SelectItem, { value: "x", index: 0, children: "Option" }) })] }), (0, jsx_runtime_1.jsx)(gui_1.TooltipProvider, { delay: 0, children: (0, jsx_runtime_1.jsxs)(gui_1.Tooltip, { open: true, children: [(0, jsx_runtime_1.jsx)(gui_1.TooltipTrigger, { children: "Tooltip" }), (0, jsx_runtime_1.jsx)(gui_1.TooltipContent, { children: "Tooltip content" })] }) }), (0, jsx_runtime_1.jsx)(gui_1.Toaster, {})] })] }));
|
|
22
|
-
exports.Gallery = Gallery;
|
|
23
|
-
exports.default = exports.Gallery;
|
package/dist/gallery.d.ts
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Every component, once. `data-gallery` names each section so a browser test can
|
|
3
|
-
* scope its assertions without depending on document order.
|
|
4
|
-
*/
|
|
5
|
-
export declare const Gallery: () => import("react/jsx-runtime").JSX.Element;
|
|
6
|
-
export default Gallery;
|
|
7
|
-
//# sourceMappingURL=gallery.d.ts.map
|
package/dist/gallery.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"gallery.d.ts","sourceRoot":"","sources":["../src/gallery.tsx"],"names":[],"mappings":"AA2DA;;;GAGG;AACH,eAAO,MAAM,OAAO,+CAiJnB,CAAA;AAED,eAAe,OAAO,CAAA"}
|
package/dist/gallery.js
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { AspectRatio, Avatar, AvatarFallback, Badge, Button, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, Input, Label, Popover, PopoverContent, PopoverTrigger, Progress, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Separator, Slider, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from './backends/gui/index.js';
|
|
4
|
-
const BUTTON_VARIANTS = [
|
|
5
|
-
'default', 'destructive', 'outline', 'secondary', 'ghost', 'link', 'primary', 'linkFG', 'linkMuted',
|
|
6
|
-
];
|
|
7
|
-
const BUTTON_SIZES = ['default', 'sm', 'lg', 'icon', 'icon-sm', 'icon-lg'];
|
|
8
|
-
const BADGE_VARIANTS = ['default', 'secondary', 'destructive', 'outline'];
|
|
9
|
-
/** One section. Plain CSS on a plain div — the gallery is a harness, and laying
|
|
10
|
-
* it out with the components under test would make a layout bug read as a
|
|
11
|
-
* styling bug. Rows wrap so the same tree is legible at 390px and at 1280px,
|
|
12
|
-
* which is what makes the screenshot baselines worth comparing. */
|
|
13
|
-
const Section = ({ name, children }) => (_jsx("section", { "data-gallery": name, style: { display: 'flex', flexWrap: 'wrap', gap: 12, alignItems: 'center', maxWidth: 880 }, children: children }));
|
|
14
|
-
/**
|
|
15
|
-
* Every component, once. `data-gallery` names each section so a browser test can
|
|
16
|
-
* scope its assertions without depending on document order.
|
|
17
|
-
*/
|
|
18
|
-
export const Gallery = () => (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 28, padding: 24, maxWidth: 928 }, children: [_jsxs(Section, { name: "button", children: [BUTTON_VARIANTS.map((variant) => (_jsx(Button, { variant: variant, children: variant }, variant))), BUTTON_SIZES.map((size) => (_jsx(Button, { size: size, children: size }, size))), _jsx(Button, { disabled: true, children: "disabled" }), _jsx(Button, { isLoading: true, children: "loading" })] }), _jsx(Section, { name: "badge", children: BADGE_VARIANTS.map((variant) => (_jsx(Badge, { variant: variant, children: variant }, variant))) }), _jsx(Section, { name: "card", children: _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Card title" }), _jsx(CardDescription, { children: "Card description" }), _jsx(CardAction, { children: _jsx(Button, { size: "sm", variant: "ghost", children: "action" }) })] }), _jsx(CardContent, { children: "Card content" }), _jsx(CardFooter, { children: "Card footer" })] }) }), _jsxs(Section, { name: "form", children: [_jsx(Label, { children: "Label" }), _jsx(Input, { placeholder: "Input" }), _jsx(Input, { placeholder: "Password", type: "password" }), _jsx(Textarea, { placeholder: "Textarea" }), _jsx(Checkbox, {}), _jsx(Checkbox, { checked: true }), _jsx(Switch, {}), _jsx(Switch, { checked: true }), _jsx(Slider, { defaultValue: [40] }), _jsx(Progress, { value: 40 })] }), _jsx(Section, { name: "tabs", children: _jsxs(Tabs, { defaultValue: "one", children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "one", children: "One" }), _jsx(TabsTrigger, { value: "two", children: "Two" })] }), _jsx(TabsContent, { value: "one", children: "Panel one" })] }) }), _jsxs(Section, { name: "surface", children: [_jsx(Separator, {}), _jsx(AspectRatio, { ratio: 16 / 9 }), _jsx(Avatar, { children: _jsx(AvatarFallback, { children: "HZ" }) }), _jsx(ScrollArea, { height: 80, children: "Scroll area" }), _jsxs(ResizablePanelGroup, { direction: "horizontal", children: [_jsx(ResizablePanel, {}), _jsx(ResizableHandle, {}), _jsx(ResizablePanel, {})] })] }), _jsx(Section, { name: "collapsible", children: _jsxs(Collapsible, { open: true, children: [_jsx(CollapsibleTrigger, { children: "Collapsible trigger" }), _jsx(CollapsibleContent, { children: "Collapsible content" })] }) }), _jsx(Section, { name: "command", children: _jsxs(Command, { children: [_jsx(CommandInput, {}), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "No results" }), _jsx(CommandGroup, { heading: "Group", children: _jsxs(CommandItem, { value: "a", children: ["Item", _jsx(CommandShortcut, { children: "\u2318A" })] }) }), _jsx(CommandSeparator, {})] })] }) }), _jsxs(Section, { name: "overlay", children: [_jsx(Dialog, { open: true, children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Dialog title" }), _jsx(DialogDescription, { children: "Dialog description" })] }), _jsx(DialogFooter, { children: _jsx(Button, { size: "sm", children: "OK" }) })] }) }), _jsxs(DropdownMenu, { open: true, children: [_jsx(DropdownMenuTrigger, { children: "Menu" }), _jsxs(DropdownMenuContent, { children: [_jsx(DropdownMenuLabel, { children: "Label" }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuItem, { children: "Item" })] })] }), _jsxs(Popover, { open: true, children: [_jsx(PopoverTrigger, { children: "Popover" }), _jsx(PopoverContent, { children: "Popover content" })] }), _jsxs(Select, { open: true, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Select" }) }), _jsx(SelectContent, { children: _jsx(SelectItem, { value: "x", index: 0, children: "Option" }) })] }), _jsx(TooltipProvider, { delay: 0, children: _jsxs(Tooltip, { open: true, children: [_jsx(TooltipTrigger, { children: "Tooltip" }), _jsx(TooltipContent, { children: "Tooltip content" })] }) }), _jsx(Toaster, {})] })] }));
|
|
19
|
-
export default Gallery;
|
|
20
|
-
//# sourceMappingURL=gallery.js.map
|