@a-type/ui 2.8.13 → 3.0.0

package/dist/cjs/components/progress/Progress.js

@@ -44,16 +44,22 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Progress = exports.ProgressIndicator = exports.ProgressRoot = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const ProgressPrimitive = __importStar(require("@radix-ui/react-progress"));
+const clsx_1 = __importDefault(require("clsx"));
 const hooks_js_1 = require("../../hooks.js");
 exports.ProgressRoot = (0, hooks_js_1.withClassName)(ProgressPrimitive.Root, 'layer-components:w-full layer-components:relative layer-components:overflow-hidden layer-components:border layer-components:border-default layer-components:rounded-lg');
-exports.ProgressIndicator = (0, hooks_js_1.withClassName)(ProgressPrimitive.Indicator, 'layer-components:bg-primary layer-components:w-full layer-components:h-6px layer-components:translate-x-[calc(-100%*(1-var(--value)))] layer-components:rounded-lg layer-components:transition-transform', 'layer-components:[&[data-state=complete]]:bg-accent', 'layer-variants:[&[data-color=accent]]:bg-accent');
+exports.ProgressIndicator = (0, hooks_js_1.withClassName)(ProgressPrimitive.Indicator, 'layer-components:bg-main layer-components:w-full layer-components:h-6px layer-components:translate-x-[calc(-100%*(1-var(--value)))] layer-components:rounded-lg layer-components:transition-transform', 'layer-components:[&[data-state=complete]]:bg-success');
 const ProgressBase = function ProgressBase(_a) {
-    var { ref, children, color, max = 100, value } = _a, props = __rest(_a, ["ref", "children", "color", "max", "value"]);
-    return ((0, jsx_runtime_1.jsx)(exports.ProgressRoot, Object.assign({}, props, { value: value, max: max, ref: ref, children: (0, jsx_runtime_1.jsx)(exports.ProgressIndicator, { "data-color": color, 
+    var { ref, children, color, max = 100, value, className } = _a, props = __rest(_a, ["ref", "children", "color", "max", "value", "className"]);
+    return ((0, jsx_runtime_1.jsx)(exports.ProgressRoot, Object.assign({}, props, { className: (0, clsx_1.default)(color && `palette-${color}`, className), value: value, max: max, ref: ref, children: (0, jsx_runtime_1.jsx)(exports.ProgressIndicator
+        // @ts-ignore
+        , { 
             // @ts-ignore
             style: { '--value': (value || 0) / max } }) })));
 };

package/dist/cjs/components/progress/Progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../../src/components/progress/Progress.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,4EAA8D;AAC9D,6CAA+C;AAElC,QAAA,YAAY,GAAG,IAAA,wBAAa,EACxC,iBAAiB,CAAC,IAAI,EACtB,qFAAqF,CACrF,CAAC;AACW,QAAA,iBAAiB,GAAG,IAAA,wBAAa,EAC7C,iBAAiB,CAAC,SAAS,EAC3B,uHAAuH,EACvH,uDAAuD,EACvD,mDAAmD,CACnD,CAAC;AAEF,MAAM,YAAY,GAAG,SAAS,YAAY,CAAC,EAU1C;QAV0C,EAC1C,GAAG,EACH,QAAQ,EACR,KAAK,EACL,GAAG,GAAG,GAAG,EACT,KAAK,OAKL,EAJG,KAAK,cANkC,4CAO1C,CADQ;IAKR,OAAO,CACN,uBAAC,oBAAY,oBAAK,KAAK,IAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,YACxD,uBAAC,yBAAiB,kBACL,KAAK;YACjB,aAAa;YACb,KAAK,EAAE,EAAE,SAAS,EAAE,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,GAAG,EAAE,GACvC,IACY,CACf,CAAC;AACH,CAAC,CAAC;AAEW,QAAA,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE;IACnD,IAAI,EAAE,oBAAY;IAClB,SAAS,EAAE,yBAAiB;CAC5B,CAAC,CAAC"}
+{"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../../src/components/progress/Progress.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,4EAA8D;AAC9D,gDAAwB;AACxB,6CAA+C;AAGlC,QAAA,YAAY,GAAG,IAAA,wBAAa,EACxC,iBAAiB,CAAC,IAAI,EACtB,qFAAqF,CACrF,CAAC;AACW,QAAA,iBAAiB,GAAG,IAAA,wBAAa,EAC7C,iBAAiB,CAAC,SAAS,EAC3B,oHAAoH,EACpH,wDAAwD,CACxD,CAAC;AAEF,MAAM,YAAY,GAAG,SAAS,YAAY,CAAC,EAW1C;QAX0C,EAC1C,GAAG,EACH,QAAQ,EACR,KAAK,EACL,GAAG,GAAG,GAAG,EACT,KAAK,EACL,SAAS,OAKT,EAJG,KAAK,cAPkC,yDAQ1C,CADQ;IAKR,OAAO,CACN,uBAAC,oBAAY,oBACR,KAAK,IACT,SAAS,EAAE,IAAA,cAAI,EAAC,KAAK,IAAI,WAAW,KAAK,EAAE,EAAE,SAAS,CAAC,EACvD,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,YAER,uBAAC,yBAAiB;QACjB,aAAa;;YAAb,aAAa;YACb,KAAK,EAAE,EAAE,SAAS,EAAE,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,GAAG,EAAE,GACvC,IACY,CACf,CAAC;AACH,CAAC,CAAC;AAEW,QAAA,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE;IACnD,IAAI,EAAE,oBAAY;IAClB,SAAS,EAAE,yBAAiB;CAC5B,CAAC,CAAC"}

package/dist/cjs/components/progress/Progress.stories.d.ts

@@ -2,9 +2,9 @@ import type { StoryObj } from '@storybook/react';
 import { Progress } from './Progress.js';
 declare const meta: {
     title: string;
-    component: (({ ref, children, color, max, value, ...props }: import("@radix-ui/react-progress").ProgressProps & {
+    component: (({ ref, children, color, max, value, className, ...props }: import("@radix-ui/react-progress").ProgressProps & {
         ref?: React.Ref<HTMLDivElement>;
-        color?: "accent";
+        color?: import("../../uno/logic/color.js").PaletteName;
     }) => import("react/jsx-runtime.js").JSX.Element) & {
         Root: import("react").FunctionComponent<import("@radix-ui/react-progress").ProgressProps & import("react").RefAttributes<HTMLDivElement>>;
         Indicator: import("react").FunctionComponent<import("@radix-ui/react-progress").ProgressIndicatorProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/richEditor/index.js

@@ -6,6 +6,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.tipTapReadonlyClassName = exports.tipTapClassName = void 0;
 const clsx_1 = __importDefault(require("clsx"));
-exports.tipTapClassName = (0, clsx_1.default)('layer-components:w-full layer-components:leading-relaxed', 'layer-components:[&_.ProseMirror:focus]:outline-none layer-components:[&_.ProseMirror:focus]:shadow-focus', 'layer-components:[&_h1,h2,h3,p]:mt-0', 'layer-components:[&_h1]:text-2xl layer-components:[&_h1]:font-semibold layer-components:[&_h1]:mb-md layer-components:[&_h1]:[&:not:first-child]:mt-xl', 'layer-components:[&_h2]:text-lg layer-components:[&_h2]:font-bold layer-components:[&_h2]:color-gray-dark layer-components:[&_h2]:color-darken-3 layer-components:[&_h2]:mb-md layer-components:[&_h2]:[&:not:first-child]:mt-lg', 'layer-components:[&_h3]:text-md layer-components:[&_h3]:font-500 layer-components:[&_h3]:color-gray-dark layer-components:[&_h3]:color-darken-2 layer-components:[&_h3]:mb-sm layer-components:[&_h3]:[&:not:first-child]:mt-md', 'layer-components:[&_h4]:text-xs layer-components:[&_h4]:color-gray-dark layer-components:[&_h4]:color-darken-1 layer-components:[&_h4]:mb-sm layer-components:[&_h4]:[&:not:first-child]:mt-md layer-components:[&_h4]:uppercase', 'layer-components:[&_p]:mb-md layer-components:[&_p]:mt-0', 'layer-components:[&_a]:underline', 'layer-components:[&_blockquote]:border-l-4 layer-components:[&_blockquote]:border-l-solid layer-components:[&_blockquote]:border-gray layer-components:[&_blockquote]:pl-4 layer-components:[&_blockquote]:mb-md layer-components:[&_blockquote]:mt-md layer-components:[&_blockquote]:ml-md', 'layer-components:[&_ul]:list-disc layer-components:[&_ul]:pl-6 layer-components:[&_ul]:mb-md layer-components:[&_ul]:mt-md', 'layer-components:[&_ol]:list-decimal layer-components:[&_ol]:pl-6 layer-components:[&_ol]:mb-md layer-components:[&_ol]:mt-md', 'layer-components:[&_li]:mb-sm', 'layer-components:[&_mark]:bg-primary-wash layer-components:[&_mark]:bg-darken-2', 'layer-components:[&_strong]:font-semibold', 'layer-components:[&_em]:italic', 'layer-components:[&_hr]:my-lg layer-components:[&_hr]:border-gray', 'layer-components:[&_a]:underline', 'layer-components:[&_a:hover]:underline', 'layer-components:[&_a:focus]:outline-none layer-components:[&_a:focus]:shadow-focus', 'layer-components:[&_a:focus-visible]:outline-none layer-components:[&_a:focus-visible]:ring-inset layer-components:[&_a:focus-visible]:ring-4 layer-components:[&_a:focus-visible]:ring-gray', 'layer-components:[&_.ProseMirror]:bg-white layer-components:[&_.ProseMirror]:rounded-[20px] layer-components:[&_.ProseMirror]:px-4 layer-components:[&_.ProseMirror]:py-2 layer-components:[&_.ProseMirror]:shadow-sm-inset layer-components:[&_.ProseMirror]:border-gray-dark layer-components:[&_.ProseMirror]:border-solid layer-components:[&_.ProseMirror]:border-1');
+exports.tipTapClassName = (0, clsx_1.default)('layer-components:w-full layer-components:leading-relaxed', 'layer-components:[&_.ProseMirror:focus]:outline-none layer-components:[&_.ProseMirror:focus]:shadow-focus', 'layer-components:[&_h1,h2,h3,p]:mt-0', 'layer-components:[&_h1]:text-2xl layer-components:[&_h1]:font-semibold layer-components:[&_h1]:mb-md layer-components:[&_h1]:[&:not:first-child]:mt-xl', 'layer-components:[&_h2]:text-lg layer-components:[&_h2]:font-bold layer-components:[&_h2]:color-gray-dark layer-components:[&_h2]:color-darken-3 layer-components:[&_h2]:mb-md layer-components:[&_h2]:[&:not:first-child]:mt-lg', 'layer-components:[&_h3]:text-md layer-components:[&_h3]:font-500 layer-components:[&_h3]:color-gray-dark layer-components:[&_h3]:color-darken-2 layer-components:[&_h3]:mb-sm layer-components:[&_h3]:[&:not:first-child]:mt-md', 'layer-components:[&_h4]:text-xs layer-components:[&_h4]:color-gray-dark layer-components:[&_h4]:color-darken-1 layer-components:[&_h4]:mb-sm layer-components:[&_h4]:[&:not:first-child]:mt-md layer-components:[&_h4]:uppercase', 'layer-components:[&_p]:mb-md layer-components:[&_p]:mt-0', 'layer-components:[&_a]:underline', 'layer-components:[&_blockquote]:border-l-4 layer-components:[&_blockquote]:border-l-solid layer-components:[&_blockquote]:border-gray layer-components:[&_blockquote]:pl-4 layer-components:[&_blockquote]:mb-md layer-components:[&_blockquote]:mt-md layer-components:[&_blockquote]:ml-md', 'layer-components:[&_ul]:list-disc layer-components:[&_ul]:pl-6 layer-components:[&_ul]:mb-md layer-components:[&_ul]:mt-md', 'layer-components:[&_ol]:list-decimal layer-components:[&_ol]:pl-6 layer-components:[&_ol]:mb-md layer-components:[&_ol]:mt-md', 'layer-components:[&_li]:mb-sm', 'layer-components:[&_mark]:bg-main-wash layer-components:[&_mark]:bg-darken-2', 'layer-components:[&_strong]:font-semibold', 'layer-components:[&_em]:italic', 'layer-components:[&_hr]:my-lg layer-components:[&_hr]:border-gray', 'layer-components:[&_a]:underline', 'layer-components:[&_a:hover]:underline', 'layer-components:[&_a:focus]:outline-none layer-components:[&_a:focus]:shadow-focus', 'layer-components:[&_a:focus-visible]:outline-none layer-components:[&_a:focus-visible]:ring-inset layer-components:[&_a:focus-visible]:ring-4 layer-components:[&_a:focus-visible]:ring-gray', 'layer-components:[&_.ProseMirror]:bg-white layer-components:[&_.ProseMirror]:rounded-[20px] layer-components:[&_.ProseMirror]:px-4 layer-components:[&_.ProseMirror]:py-2 layer-components:[&_.ProseMirror]:shadow-sm-inset layer-components:[&_.ProseMirror]:border-gray-dark layer-components:[&_.ProseMirror]:border-solid layer-components:[&_.ProseMirror]:border-1');
 exports.tipTapReadonlyClassName = (0, clsx_1.default)('[&_.ProseMirror]:bg-transparent [&_.ProseMirror]:border-none [&_.ProseMirror]:shadow-none', '[&_.ProseMirror:focus]:outline-none [&_.ProseMirror:focus]:shadow-none [&_.ProseMirror:focus]:bg-transparent');
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/richEditor/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/richEditor/index.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAwB;AAEX,QAAA,eAAe,GAAG,IAAA,cAAI,EAClC,2CAA2C,EAC3C,qEAAqE,EACrE,sCAAsC,EACtC,kFAAkF,EAClF,4GAA4G,EAC5G,2GAA2G,EAC3G,4GAA4G,EAC5G,qCAAqC,EACrC,kCAAkC,EAClC,gGAAgG,EAChG,sDAAsD,EACtD,yDAAyD,EACzD,iCAAiC,EACjC,yDAAyD,EACzD,6CAA6C,EAC7C,kCAAkC,EAClC,6CAA6C,EAC7C,oCAAoC,EACpC,0CAA0C,EAC1C,0DAA0D,EAC1D,iFAAiF,EACjF,8HAA8H,CAC9H,CAAC;AAEW,QAAA,uBAAuB,GAAG,IAAA,cAAI,EAC1C,2DAA2D,EAC3D,kEAAkE,CAClE,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/richEditor/index.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAwB;AAEX,QAAA,eAAe,GAAG,IAAA,cAAI,EAClC,2CAA2C,EAC3C,qEAAqE,EACrE,sCAAsC,EACtC,kFAAkF,EAClF,4GAA4G,EAC5G,2GAA2G,EAC3G,4GAA4G,EAC5G,qCAAqC,EACrC,kCAAkC,EAClC,gGAAgG,EAChG,sDAAsD,EACtD,yDAAyD,EACzD,iCAAiC,EACjC,sDAAsD,EACtD,6CAA6C,EAC7C,kCAAkC,EAClC,6CAA6C,EAC7C,oCAAoC,EACpC,0CAA0C,EAC1C,0DAA0D,EAC1D,iFAAiF,EACjF,8HAA8H,CAC9H,CAAC;AAEW,QAAA,uBAAuB,GAAG,IAAA,cAAI,EAC1C,2DAA2D,EAC3D,kEAAkE,CAClE,CAAC"}

package/dist/cjs/components/select/Select.js

@@ -68,8 +68,8 @@ const SelectItem = (_a) => {
     return ((0, jsx_runtime_1.jsxs)(exports.SelectItemRoot, Object.assign({ className: className }, props, { ref: forwardedRef, children: [(0, jsx_runtime_1.jsx)(SelectPrimitive.ItemText, { children: children }), (0, jsx_runtime_1.jsx)(exports.SelectItemIndicator, {})] })));
 };
 exports.SelectItem = SelectItem;
-exports.SelectItemRoot = (0, withClassName_js_1.withClassName)(SelectPrimitive.Item, 'layer-components:text-md layer-components:leading-4 layer-components:color-black layer-components:flex layer-components:items-center layer-components:flex-row layer-components:h-36px layer-components:pr-4 layer-components:pl-35px layer-components:relative layer-components:select-none', 'layer-components:[&[data-disabled]]:color-gray layer-components:[&[data-disabled]]:pointer-events-none [&[data-highlighted]]:outline-none [&[data-highlighted]]:bg-gray [&[data-highlighted]]:bg-lighten-3 [&[data-highlighted]]:color-black');
-exports.SelectItemIndicatorRoot = (0, withClassName_js_1.withClassName)(SelectPrimitive.ItemIndicator, 'absolute left-0 w-25px inline-flex items-center justify-center');
+exports.SelectItemRoot = (0, withClassName_js_1.withClassName)(SelectPrimitive.Item, 'layer-components:text-md layer-components:leading-4 layer-components:color-black layer-components:flex layer-components:items-center layer-components:flex-row layer-components:h-36px layer-components:pr-4 layer-components:pl-35px layer-components:min-h-touch layer-components:relative layer-components:select-none', 'layer-components:[&[data-disabled]]:color-gray layer-components:[&[data-disabled]]:pointer-events-none [&[data-highlighted]]:outline-none [&[data-highlighted]]:bg-gray-light [&[data-highlighted]]:color-black');
+exports.SelectItemIndicatorRoot = (0, withClassName_js_1.withClassName)(SelectPrimitive.ItemIndicator, 'layer-components:absolute layer-components:left-0 layer-components:w-25px layer-components:inline-flex layer-components:items-center layer-components:justify-center');
 exports.SelectItemIndicator = withNoNativeRender((props) => ((0, jsx_runtime_1.jsx)(exports.SelectItemIndicatorRoot, Object.assign({}, props, { children: (0, jsx_runtime_1.jsx)(index_js_1.Icon, { name: "check" }) }))));
 exports.SelectItemText = (0, withClassName_js_1.withClassName)(SelectPrimitive.ItemText, '');
 const SelectGroup = (props) => {
@@ -81,7 +81,7 @@ const SelectGroup = (props) => {
 };
 exports.SelectGroup = SelectGroup;
 exports.SelectRoot = SelectPrimitive.Root;
-exports.selectTriggerClassName = (0, clsx_1.default)((0, classes_js_1.getButtonClassName)({ color: 'default' }), 'layer-components:[all:unset] layer-components:inline-flex layer-components:[&[data-placeholder]]:color-gray-dark');
+exports.selectTriggerClassName = (0, clsx_1.default)((0, classes_js_1.getButtonClassName)({}), 'layer-components:([all:unset] inline-flex [&[data-placeholder]]:color-gray-dark)');
 exports.SelectTriggerBase = withNoNativeRender((0, withClassName_js_1.withClassName)(SelectPrimitive.Trigger, exports.selectTriggerClassName));
 exports.UnstyledSelectTrigger = withNoNativeRender(SelectPrimitive.Trigger);
 const SelectTrigger = function SelectTrigger(_a) {
@@ -103,7 +103,7 @@ const contentStyle = {
 const viewportStyle = { '--local-corner-scale': '0.9' };
 exports.SelectContent = withPassthroughNativeRender((_a) => {
     var { ref: forwardedRef, children, inDialog, className } = _a, props = __rest(_a, ["ref", "children", "inDialog", "className"]);
-    return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Portal, { children: (0, jsx_runtime_1.jsx)(Box_js_1.BoxContext.Provider, { value: { spacingScale: 1 }, children: (0, jsx_runtime_1.jsxs)(SelectPrimitive.Content, Object.assign({ className: (0, clsx_1.default)('layer-components:overflow-hidden layer-components:bg-white layer-components:rounded-md layer-components:border layer-components:border-solid layer-components:border layer-components:border-black layer-components:z-menu layer-components:shadow-lg', 'layer-components:transform-origin-[var(--radix-select-content-transform-origin)]', 'layer-components:[&[data-state=open]]:animate-popover-in', 'layer-components:[&[data-state=closed]]:animate-popover-out', 'layer-components:min-w-[var(--radix-select-trigger-width)] layer-components:max-h-[var(--radix-select-content-available-height)]', inDialog && 'z-[calc(var(--z-dialog)+1)]', className), style: contentStyle }, props, { ref: forwardedRef, children: [(0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollUpButton, { className: "flex items-center justify-center h-25px bg-white color-primary-dark cursor-default", children: (0, jsx_runtime_1.jsx)(index_js_1.Icon, { name: "chevron", className: "rotate-180" }) }), (0, jsx_runtime_1.jsx)(SelectPrimitive.Viewport, { style: viewportStyle, children: children }), (0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollDownButton, { className: "flex items-center justify-center h-25px bg-white color-primary-dark cursor-default", children: (0, jsx_runtime_1.jsx)(index_js_1.Icon, { name: "chevron" }) })] })) }) }));
+    return ((0, jsx_runtime_1.jsx)(SelectPrimitive.Portal, { children: (0, jsx_runtime_1.jsx)(Box_js_1.BoxContext.Provider, { value: { spacingScale: 1 }, children: (0, jsx_runtime_1.jsxs)(SelectPrimitive.Content, Object.assign({ className: (0, clsx_1.default)('layer-components:overflow-hidden layer-components:bg-white layer-components:rounded-md layer-components:border layer-components:border-solid layer-components:border layer-components:border-black layer-components:z-menu layer-components:shadow-lg', 'layer-components:transform-origin-[var(--radix-select-content-transform-origin)]', 'layer-components:[&[data-state=open]]:animate-popover-in', 'layer-components:[&[data-state=closed]]:animate-popover-out', 'layer-components:min-w-[var(--radix-select-trigger-width)] layer-components:max-h-[var(--radix-select-content-available-height)]', inDialog && 'z-[calc(var(--z-dialog)+1)]', className), style: contentStyle }, props, { ref: forwardedRef, children: [(0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollUpButton, { className: "flex items-center justify-center h-25px bg-white color-main-dark cursor-default", children: (0, jsx_runtime_1.jsx)(index_js_1.Icon, { name: "chevron", className: "rotate-180" }) }), (0, jsx_runtime_1.jsx)(SelectPrimitive.Viewport, { style: viewportStyle, children: children }), (0, jsx_runtime_1.jsx)(SelectPrimitive.ScrollDownButton, { className: "flex items-center justify-center h-25px bg-white color-main-dark cursor-default", children: (0, jsx_runtime_1.jsx)(index_js_1.Icon, { name: "chevron" }) })] })) }) }));
 });
 const NativeSelect = (_a) => {
     var { ref: forwardedRef, className } = _a, props = __rest(_a, ["ref", "className"]);

package/dist/cjs/components/select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../src/components/select/Select.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../src/components/select/Select.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEb,wEAA0D;AAC1D,gDAA8B;AAC9B,iCAQe;AACf,mEAA6D;AAC7D,0CAA2C;AAC3C,mDAA0D;AAC1D,qDAA0D;AAC1D,+CAAwC;AAEjC,MAAM,UAAU,GAAG,CAAC,EAO1B,EAAE,EAAE;QAPsB,EAC1B,GAAG,EAAE,YAAY,EACjB,QAAQ,EACR,SAAS,OAIT,EAHG,KAAK,cAJkB,gCAK1B,CADQ;IAIR,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAAC,eAAe,CAAC,CAAC;IAE7C,IAAI,QAAQ,EAAE,CAAC;QACd,OAAO,mCAAQ,KAAK,EAAE,KAAK,CAAC,KAAK,YAAG,QAAQ,GAAU,CAAC;IACxD,CAAC;IAED,OAAO,CACN,wBAAC,sBAAc,kBAAC,SAAS,EAAE,SAAS,IAAM,KAAK,IAAE,GAAG,EAAE,YAAY,aACjE,uBAAC,eAAe,CAAC,QAAQ,cAAE,QAAQ,GAA4B,EAC/D,uBAAC,2BAAmB,KAAG,KACP,CACjB,CAAC;AACH,CAAC,CAAC;AApBW,QAAA,UAAU,cAoBrB;AAEW,QAAA,cAAc,GAAG,IAAA,gCAAa,EAC1C,eAAe,CAAC,IAAI,EACpB,kIAAkI,EAClI,qIAAqI,CACrI,CAAC;AACW,QAAA,uBAAuB,GAAG,IAAA,gCAAa,EACnD,eAAe,CAAC,aAAa,EAC7B,mFAAmF,CACnF,CAAC;AACW,QAAA,mBAAmB,GAAG,kBAAkB,CACpD,CAAC,KAA+C,EAAE,EAAE,CAAC,CACpD,uBAAC,+BAAuB,oBAAK,KAAK,cACjC,uBAAC,eAAI,IAAC,IAAI,EAAC,OAAO,GAAG,IACI,CAC1B,CACD,CAAC;AACW,QAAA,cAAc,GAAG,IAAA,gCAAa,EAAC,eAAe,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;AACnE,MAAM,WAAW,GAAG,CAAC,KAAuC,EAAE,EAAE;IACtE,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAAC,eAAe,CAAC,CAAC;IAE7C,IAAI,QAAQ,EAAE,CAAC;QACd,OAAO,CACN,qCAAU,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,YAChD,KAAK,CAAC,QAAQ,GACL,CACX,CAAC;IACH,CAAC;IAED,OAAO,uBAAC,eAAe,CAAC,KAAK,oBAAK,KAAK,EAAI,CAAC;AAC7C,CAAC,CAAC;AAZW,QAAA,WAAW,eAYtB;AAEW,QAAA,UAAU,GAAG,eAAe,CAAC,IAAI,CAAC;AAClC,QAAA,sBAAsB,GAAG,IAAA,cAAU,EAC/C,IAAA,+BAAkB,EAAC,EAAE,CAAC,EACtB,kFAAkF,CAClF,CAAC;AACW,QAAA,iBAAiB,GAAG,kBAAkB,CAClD,IAAA,gCAAa,EAAC,eAAe,CAAC,OAAO,EAAE,8BAAsB,CAAC,CAC9D,CAAC;AACW,QAAA,qBAAqB,GAAG,kBAAkB,CACtD,eAAe,CAAC,OAAO,CACvB,CAAC;AAGK,MAAM,aAAa,GAAG,SAAS,aAAa,CAAC,EAOnD;QAPmD,EACnD,GAAG,EACH,QAAQ,EACR,OAAO,OAIP,EAHG,KAAK,cAJ2C,8BAKnD,CADQ;IAIR,OAAO,CACN,uBAAC,6BAAqB,kBAAC,OAAO,UAAK,KAAK,IAAE,GAAG,EAAE,GAAG,YACjD,uBAAC,kBAAM,IAAC,SAAS,EAAC,mBAAmB,EAAC,OAAO,EAAE,OAAO,YACpD,QAAQ,IAAI,CACZ,6DACC,uBAAC,mBAAW,KAAG,EACf,uBAAC,kBAAU,KAAG,IACZ,CACH,GACO,IACc,CACxB,CAAC;AACH,CAAC,CAAC;AApBW,QAAA,aAAa,iBAoBxB;AAEW,QAAA,WAAW,GAAG,kBAAkB,CAC5C,IAAA,gCAAa,EAAC,eAAe,CAAC,KAAK,EAAE,eAAe,CAAC,CACrD,CAAC;AACW,QAAA,WAAW,GAAG,kBAAkB,CAC5C,IAAA,gCAAa,EACZ,eAAe,CAAC,KAAK,EACrB,mDAAmD,CACnD,CACD,CAAC;AACW,QAAA,eAAe,GAAG,kBAAkB,CAChD,IAAA,gCAAa,EAAC,eAAe,CAAC,SAAS,EAAE,yBAAyB,CAAC,CACnE,CAAC;AACW,QAAA,UAAU,GAAG,kBAAkB,CAC3C,CAAC,EAMA,EAAE,EAAE;QANJ,EACA,GAAG,EAAE,YAAY,EACjB,SAAS,OAIT,EAHG,KAAK,cAHR,oBAIA,CADQ;IAIR,OAAO,CACN,uBAAC,eAAe,CAAC,IAAI,kBACpB,SAAS,EAAE,IAAA,cAAU,EAAC,uBAAuB,EAAE,SAAS,CAAC,IACrD,KAAK,IACT,GAAG,EAAE,YAAY,YAEjB,uBAAC,eAAI,IAAC,IAAI,EAAC,SAAS,EAAC,SAAS,EAAC,oCAAoC,GAAG,IAChD,CACvB,CAAC;AACH,CAAC,CACD,CAAC;AAEF,MAAM,YAAY,GAAG;IACpB,MAAM,EAAE,IAAI;IACZ,sBAAsB,EAAE,GAAG;CACJ,CAAC;AACzB,MAAM,aAAa,GAAG,EAAE,sBAAsB,EAAE,KAAK,EAAyB,CAAC;AAClE,QAAA,aAAa,GAAG,2BAA2B,CACvD,CAAC,EAA8D,EAAE,EAAE;QAAlE,EAAE,GAAG,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA5D,4CAA8D,CAAF;IAC5D,OAAO,CACN,uBAAC,eAAe,CAAC,MAAM,cACtB,uBAAC,mBAAU,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,YAC9C,wBAAC,eAAe,CAAC,OAAO,kBACvB,SAAS,EAAE,IAAA,cAAU,EACpB,iHAAiH,EACjH,kFAAkF,EAClF,0DAA0D,EAC1D,6DAA6D,EAC7D,mHAAmH,EACnH,QAAQ,IAAI,6BAA6B,EACzC,SAAS,CACT,EACD,KAAK,EAAE,YAAY,IACf,KAAK,IACT,GAAG,EAAE,YAAY,aAEjB,uBAAC,eAAe,CAAC,cAAc,IAAC,SAAS,EAAC,iFAAiF,YAC1H,uBAAC,eAAI,IAAC,IAAI,EAAC,SAAS,EAAC,SAAS,EAAC,YAAY,GAAG,GACd,EACjC,uBAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,YAC5C,QAAQ,GACiB,EAC3B,uBAAC,eAAe,CAAC,gBAAgB,IAAC,SAAS,EAAC,iFAAiF,YAC5H,uBAAC,eAAI,IAAC,IAAI,EAAC,SAAS,GAAG,GACW,KACV,GACL,GACE,CACzB,CAAC;AACH,CAAC,CACD,CAAC;AAEK,MAAM,YAAY,GAAG,CAAC,EAM5B,EAAE,EAAE;QANwB,EAC5B,GAAG,EAAE,YAAY,EACjB,SAAS,OAIT,EAHG,KAAK,cAHoB,oBAI5B,CADQ;IAIR,OAAO,CACN,iCAAK,SAAS,EAAE,IAAA,cAAU,EAAC,UAAU,EAAE,SAAS,CAAC,aAChD,iDACC,SAAS,EAAE,IAAA,cAAU,EACpB,8QAA8Q,CAC9Q,IACG,KAAK,IACT,GAAG,EAAE,YAAY,IAChB,EACF,gCAAK,SAAS,EAAC,iEAAiE,YAC/E,uBAAC,eAAI,IAAC,IAAI,EAAC,SAAS,EAAC,SAAS,EAAC,aAAa,GAAG,GAC1C,IACD,CACN,CAAC;AACH,CAAC,CAAC;AArBW,QAAA,YAAY,gBAqBvB;AAeF;;GAEG;AACH,MAAM,UAAU,GAAG,CAA4B,EAM9B,EAAE,EAAE;QAN0B,EAC9C,QAAQ,EACR,KAAK,EACL,aAAa,EACb,YAAY,OAEI,EADb,IAAI,cALuC,sDAM9C,CADO;IAEP,MAAM,MAAM,GAAG,QAAQ,EAAE,CAAC;IAE1B,IAAI,MAAM,IAAI,YAAY,EAAE,CAAC;QAC5B,OAAO,CACN,uBAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,YACpC,uBAAC,oBAAY,kBACZ,QAAQ,EAAE,CAAC,EAAE,EAAE,EAAE;oBAChB,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,EAAE,CAAC,MAAM,CAAC,KAAY,CAAC,CAAC;gBACzC,CAAC,EACD,KAAK,EAAE,KAAK,IACR,IAAI,cAEP,QAAQ,IACK,GACW,CAC3B,CAAC;IACH,CAAC;IAED,OAAO,CACN,uBAAC,kBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,aAAa,YACpD,QAAQ,GACG,CACb,CAAC;AACH,CAAC,CAAC;AAEW,QAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,UAAU,EAAE;IAC/C,IAAI,EAAE,kBAAU;IAChB,IAAI,EAAE,kBAAU;IAChB,KAAK,EAAE,mBAAW;IAClB,OAAO,EAAE,qBAAa;IACtB,KAAK,EAAE,mBAAW;IAClB,KAAK,EAAE,mBAAW;IAClB,SAAS,EAAE,uBAAe;IAC1B,IAAI,EAAE,kBAAU;IAChB,OAAO,EAAE,qBAAa;CACtB,CAAC,CAAC;AAEH,SAAS,QAAQ;IAChB,OAAO,gEAAgE,CAAC,IAAI,CAC3E,SAAS,CAAC,SAAS,CACnB,CAAC;AACH,CAAC;AAED,uCAAuC;AACvC,MAAM,eAAe,GAAG,IAAA,qBAAa,EAAC,KAAK,CAAC,CAAC;AAE7C,SAAS,kBAAkB,CAC1B,SAAY;IAEZ,MAAM,kBAAkB,GAAG,CAAC,KAAU,EAAE,EAAE;QACzC,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAAC,eAAe,CAAC,CAAC;QAE7C,IAAI,QAAQ;YAAE,OAAO,IAAI,CAAC;QAE1B,OAAO,uBAAC,SAAS,oBAAK,KAAK,EAAI,CAAC;IACjC,CAAC,CAAC;IACF,OAAO,kBAAyB,CAAC;AAClC,CAAC;AAED,SAAS,2BAA2B,CAElC,SAAY;IACb,MAAM,2BAA2B,GAAG,CAAC,KAAU,EAAE,EAAE;QAClD,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAAC,eAAe,CAAC,CAAC;QAE7C,IAAI,QAAQ,EAAE,CAAC;YACd,OAAO,2DAAG,KAAK,CAAC,QAAQ,GAAI,CAAC;QAC9B,CAAC;QAED,OAAO,uBAAC,SAAS,oBAAK,KAAK,EAAI,CAAC;IACjC,CAAC,CAAC;IACF,OAAO,2BAAkC,CAAC;AAC3C,CAAC"}

package/dist/cjs/components/skeletons/TextSkeleton.stories.js

@@ -29,7 +29,7 @@ exports.Default = {
 };
 exports.OnBackground = {
     render(args) {
-        return ((0, jsx_runtime_1.jsxs)(index_js_1.Box, { col: true, gap: true, p: true, surface: "attention", layout: "start center", children: [(0, jsx_runtime_1.jsx)(skeletons_js_1.TextSkeleton, Object.assign({}, args)), (0, jsx_runtime_1.jsx)(skeletons_js_1.TextSkeleton, Object.assign({}, args)), (0, jsx_runtime_1.jsx)(skeletons_js_1.TextSkeleton, Object.assign({}, args))] }));
+        return ((0, jsx_runtime_1.jsxs)(index_js_1.Box, { col: true, gap: true, p: true, color: "attention", surface: true, layout: "start center", children: [(0, jsx_runtime_1.jsx)(skeletons_js_1.TextSkeleton, Object.assign({}, args)), (0, jsx_runtime_1.jsx)(skeletons_js_1.TextSkeleton, Object.assign({}, args)), (0, jsx_runtime_1.jsx)(skeletons_js_1.TextSkeleton, Object.assign({}, args))] }));
     },
 };
 //# sourceMappingURL=TextSkeleton.stories.js.map

package/dist/cjs/components/skeletons/TextSkeleton.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextSkeleton.stories.js","sourceRoot":"","sources":["../../../../src/components/skeletons/TextSkeleton.stories.tsx"],"names":[],"mappings":";;;;AACA,0CAAkC;AAClC,iDAA8C;AAE9C,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,2BAAY;IACvB,QAAQ,EAAE;QACT,SAAS,EAAE;YACV,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,WAAW,EAAE,4CAA4C;SACzD;KACD;IACD,IAAI,EAAE;QACL,SAAS,EAAE,EAAE;KACb;IACD,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CACmC,CAAC;AAEtC,kBAAe,IAAI,CAAC;AAIP,QAAA,OAAO,GAAU;IAC7B,MAAM,CAAC,IAAI;QACV,OAAO,uBAAC,2BAAY,oBAAK,IAAI,EAAI,CAAC;IACnC,CAAC;CACD,CAAC;AAEW,QAAA,YAAY,GAAU;IAClC,MAAM,CAAC,IAAI;QACV,OAAO,CACN,wBAAC,cAAG,IAAC,GAAG,QAAC,GAAG,QAAC,CAAC,QAAC,OAAO,EAAC,WAAW,EAAC,MAAM,EAAC,cAAc,aACvD,uBAAC,2BAAY,oBAAK,IAAI,EAAI,EAC1B,uBAAC,2BAAY,oBAAK,IAAI,EAAI,EAC1B,uBAAC,2BAAY,oBAAK,IAAI,EAAI,IACrB,CACN,CAAC;IACH,CAAC;CACD,CAAC"}
+{"version":3,"file":"TextSkeleton.stories.js","sourceRoot":"","sources":["../../../../src/components/skeletons/TextSkeleton.stories.tsx"],"names":[],"mappings":";;;;AACA,0CAAkC;AAClC,iDAA8C;AAE9C,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,2BAAY;IACvB,QAAQ,EAAE;QACT,SAAS,EAAE;YACV,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,WAAW,EAAE,4CAA4C;SACzD;KACD;IACD,IAAI,EAAE;QACL,SAAS,EAAE,EAAE;KACb;IACD,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CACmC,CAAC;AAEtC,kBAAe,IAAI,CAAC;AAIP,QAAA,OAAO,GAAU;IAC7B,MAAM,CAAC,IAAI;QACV,OAAO,uBAAC,2BAAY,oBAAK,IAAI,EAAI,CAAC;IACnC,CAAC;CACD,CAAC;AAEW,QAAA,YAAY,GAAU;IAClC,MAAM,CAAC,IAAI;QACV,OAAO,CACN,wBAAC,cAAG,IAAC,GAAG,QAAC,GAAG,QAAC,CAAC,QAAC,KAAK,EAAC,WAAW,EAAC,OAAO,QAAC,MAAM,EAAC,cAAc,aAC7D,uBAAC,2BAAY,oBAAK,IAAI,EAAI,EAC1B,uBAAC,2BAAY,oBAAK,IAAI,EAAI,EAC1B,uBAAC,2BAAY,oBAAK,IAAI,EAAI,IACrB,CACN,CAAC;IACH,CAAC;CACD,CAAC"}

package/dist/cjs/components/slider/Slider.d.ts

@@ -1,13 +1,14 @@
 import * as SliderPrimitive from '@radix-ui/react-slider';
+import { PaletteName } from '../../uno/logic/color.js';
 export declare const SliderRoot: import("react").FunctionComponent<SliderPrimitive.SliderProps & import("react").RefAttributes<HTMLSpanElement>>;
 export declare const SliderTrack: import("react").FunctionComponent<SliderPrimitive.SliderTrackProps & import("react").RefAttributes<HTMLSpanElement>>;
 export declare const SliderRange: import("react").FunctionComponent<SliderPrimitive.SliderRangeProps & import("react").RefAttributes<HTMLSpanElement>>;
 export declare const SliderThumb: import("react").FunctionComponent<SliderPrimitive.SliderThumbProps & import("react").RefAttributes<HTMLSpanElement>>;
 export interface SliderProps extends SliderPrimitive.SliderProps {
     label?: string;
-    color?: 'default' | 'primary';
+    color?: PaletteName;
 }
-export declare const Slider: (({ ref, label, color, ...props }: SliderProps & {
+export declare const Slider: (({ ref, label, color, className, ...props }: SliderProps & {
     ref?: React.Ref<HTMLDivElement>;
 }) => import("react/jsx-runtime.js").JSX.Element) & {
     Root: import("react").FunctionComponent<SliderPrimitive.SliderProps & import("react").RefAttributes<HTMLSpanElement>>;

package/dist/cjs/components/slider/Slider.js

@@ -44,18 +44,22 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Slider = exports.SliderThumb = exports.SliderRange = exports.SliderTrack = exports.SliderRoot = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const SliderPrimitive = __importStar(require("@radix-ui/react-slider"));
+const clsx_1 = __importDefault(require("clsx"));
 const hooks_js_1 = require("../../hooks.js");
 exports.SliderRoot = (0, hooks_js_1.withClassName)(SliderPrimitive.Root, 'layer-components:relative layer-components:flex layer-components:items-center layer-components:select-none layer-components:touch-none layer-components:w-full layer-components:h-30px layer-components:translate-z-0');
-exports.SliderTrack = (0, hooks_js_1.withClassName)(SliderPrimitive.Track, 'layer-components:bg-transparent layer-components:relative layer-components:grow layer-components:rounded-lg layer-components:h-9px layer-components:border layer-components:borderpx layer-components:border-solid layer-components:border-black');
-exports.SliderRange = (0, hooks_js_1.withClassName)(SliderPrimitive.Range, 'layer-components:absolute layer-components:bg-accent layer-components:rounded-lg layer-components:h-full', 'layer-variants:[&[data-color=primary]]:bg-primary');
-exports.SliderThumb = (0, hooks_js_1.withClassName)(SliderPrimitive.Thumb, 'layer-components:block layer-components:w-5 layer-components:h-5 layer-components:bg-white layer-components:shadow-sm layer-components:rounded-lg layer-components:ring-2 layer-components:ring-black layer-components:touch-none layer-components:transition-all', 'layer-components:hover:shadow-md', 'layer-components:active:shadow-lg layer-components:active:ring-4 layer-components:active:ring-accent-dark layer-components:active:ring-opacity-50 layer-components:active:bg-accent-light', 'layer-components:focus-visible:shadow-lg layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-accent-dark layer-components:focus-visible:ring-opacity-50 layer-components:focus-visible:outline-none layer-components:focus-visible:bg-accent-light', 'layer-components:focus:outline-none', 'layer-components:disabled:opacity-50', 'layer-variants:[&[data-color=primary]]:active:bg-primary layer-variants:[&[data-color=primary]]:active:ring-primary-dark', 'layer-variants:[&[data-color=primary]]:focus-visible:bg-primary layer-variants:[&[data-color=primary]]:focus-visible:ring-primary-dark');
+exports.SliderTrack = (0, hooks_js_1.withClassName)(SliderPrimitive.Track, 'layer-components:bg-transparent layer-components:relative layer-components:grow layer-components:rounded-lg layer-components:h-9px layer-components:border layer-components:border-1 layer-components:border-solid layer-components:border-black');
+exports.SliderRange = (0, hooks_js_1.withClassName)(SliderPrimitive.Range, 'layer-components:absolute layer-components:bg-main layer-components:rounded-lg layer-components:h-full');
+exports.SliderThumb = (0, hooks_js_1.withClassName)(SliderPrimitive.Thumb, 'layer-components:block layer-components:cursor-pointer layer-components:w-5 layer-components:h-5 layer-components:bg-white layer-components:shadow-sm layer-components:rounded-lg layer-components:ring-2 layer-components:ring-black layer-components:touch-none layer-components:transition-all', 'layer-components:hover:shadow-md', 'layer-components:active:shadow-lg layer-components:active:ring-4 layer-components:active:ring-main-dark layer-components:active:ring-opacity-50 layer-components:active:bg-main-light', 'layer-components:focus-visible:shadow-lg layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-accent layer-components:focus-visible:ring-opacity-50 layer-components:focus-visible:outline-none layer-components:focus-visible:bg-main-light', 'layer-components:focus:outline-none', 'layer-components:disabled:opacity-50');
 exports.Slider = Object.assign(function Slider(_a) {
-    var { ref, label, color } = _a, props = __rest(_a, ["ref", "label", "color"]);
-    return ((0, jsx_runtime_1.jsxs)(exports.SliderRoot, Object.assign({ ref: ref }, props, { children: [(0, jsx_runtime_1.jsx)(exports.SliderTrack, { children: (0, jsx_runtime_1.jsx)(exports.SliderRange, { "data-color": color }) }), (0, jsx_runtime_1.jsx)(exports.SliderThumb, { "aria-label": label, "data-color": color })] })));
+    var { ref, label, color, className } = _a, props = __rest(_a, ["ref", "label", "color", "className"]);
+    return ((0, jsx_runtime_1.jsxs)(exports.SliderRoot, Object.assign({ ref: ref, className: (0, clsx_1.default)(color && `palette-${color}`, className) }, props, { children: [(0, jsx_runtime_1.jsx)(exports.SliderTrack, { children: (0, jsx_runtime_1.jsx)(exports.SliderRange, { "data-color": color }) }), (0, jsx_runtime_1.jsx)(exports.SliderThumb, { "aria-label": label, "data-color": color })] })));
 }, {
     Root: exports.SliderRoot,
     Track: exports.SliderTrack,

package/dist/cjs/components/slider/Slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../../src/components/slider/Slider.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wEAA0D;AAC1D,6CAA+C;AAElC,QAAA,UAAU,GAAG,IAAA,wBAAa,EACtC,eAAe,CAAC,IAAI,EACpB,kGAAkG,CAClG,CAAC;AACW,QAAA,WAAW,GAAG,IAAA,wBAAa,EACvC,eAAe,CAAC,KAAK,EACrB,4GAA4G,CAC5G,CAAC;AACW,QAAA,WAAW,GAAG,IAAA,wBAAa,EACvC,eAAe,CAAC,KAAK,EACrB,yDAAyD,EACzD,mDAAmD,CACnD,CAAC;AACW,QAAA,WAAW,GAAG,IAAA,wBAAa,EACvC,eAAe,CAAC,KAAK,EACrB,4GAA4G,EAC5G,oCAAoC,EACpC,6FAA6F,EAC7F,iHAAiH,EACjH,uCAAuC,EACvC,wCAAwC,EACxC,8EAA8E,EAC9E,qFAAqF,CACrF,CAAC;AAOW,QAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAClC,SAAS,MAAM,CAAC,EAOf;QAPe,EACf,GAAG,EACH,KAAK,EACL,KAAK,OAIL,EAHG,KAAK,cAJO,yBAKf,CADQ;IAIR,OAAO,CACN,wBAAC,kBAAU,kBAAC,GAAG,EAAE,GAAG,IAAM,KAAK,eAC9B,uBAAC,mBAAW,cACX,uBAAC,mBAAW,kBAAa,KAAK,GAAI,GACrB,EACd,uBAAC,mBAAW,kBAAa,KAAK,gBAAc,KAAK,GAAI,KACzC,CACb,CAAC;AACH,CAAC,EACD;IACC,IAAI,EAAE,kBAAU;IAChB,KAAK,EAAE,mBAAW;IAClB,KAAK,EAAE,mBAAW;IAClB,KAAK,EAAE,mBAAW;CAClB,CACD,CAAC"}
+{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../../src/components/slider/Slider.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wEAA0D;AAC1D,gDAAwB;AACxB,6CAA+C;AAGlC,QAAA,UAAU,GAAG,IAAA,wBAAa,EACtC,eAAe,CAAC,IAAI,EACpB,kGAAkG,CAClG,CAAC;AACW,QAAA,WAAW,GAAG,IAAA,wBAAa,EACvC,eAAe,CAAC,KAAK,EACrB,4GAA4G,CAC5G,CAAC;AACW,QAAA,WAAW,GAAG,IAAA,wBAAa,EACvC,eAAe,CAAC,KAAK,EACrB,uDAAuD,CACvD,CAAC;AACW,QAAA,WAAW,GAAG,IAAA,wBAAa,EACvC,eAAe,CAAC,KAAK,EACrB,2HAA2H,EAC3H,oCAAoC,EACpC,yFAAyF,EACzF,0GAA0G,EAC1G,uCAAuC,EACvC,wCAAwC,CACxC,CAAC;AAOW,QAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAClC,SAAS,MAAM,CAAC,EAQf;QARe,EACf,GAAG,EACH,KAAK,EACL,KAAK,EACL,SAAS,OAIT,EAHG,KAAK,cALO,sCAMf,CADQ;IAIR,OAAO,CACN,wBAAC,kBAAU,kBACV,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAI,EAAC,KAAK,IAAI,WAAW,KAAK,EAAE,EAAE,SAAS,CAAC,IACnD,KAAK,eAET,uBAAC,mBAAW,cACX,uBAAC,mBAAW,kBAAa,KAAK,GAAI,GACrB,EACd,uBAAC,mBAAW,kBAAa,KAAK,gBAAc,KAAK,GAAI,KACzC,CACb,CAAC;AACH,CAAC,EACD;IACC,IAAI,EAAE,kBAAU;IAChB,KAAK,EAAE,mBAAW;IAClB,KAAK,EAAE,mBAAW;IAClB,KAAK,EAAE,mBAAW;CAClB,CACD,CAAC"}

package/dist/cjs/components/slider/Slider.stories.d.ts

@@ -2,7 +2,7 @@ import type { StoryObj } from '@storybook/react';
 import { Slider } from './Slider.js';
 declare const meta: {
     title: string;
-    component: (({ ref, label, color, ...props }: import("./Slider.js").SliderProps & {
+    component: (({ ref, label, color, className, ...props }: import("./Slider.js").SliderProps & {
         ref?: React.Ref<HTMLDivElement>;
     }) => import("react/jsx-runtime.js").JSX.Element) & {
         Root: import("react").FunctionComponent<import("@radix-ui/react-slider").SliderProps & import("react").RefAttributes<HTMLSpanElement>>;

package/dist/cjs/components/switch/Switch.js

@@ -16,8 +16,8 @@ exports.Switch = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_switch_1 = require("@radix-ui/react-switch");
 const withClassName_js_1 = require("../../hooks/withClassName.js");
-const SwitchRoot = (0, withClassName_js_1.withClassName)(react_switch_1.Root, 'unset w-42px h-25px bg-white rounded-lg relative transition-color border-default flex-shrink-0 focus-visible:shadow-focus [&[data-state=checked]]:bg-accent');
-const SwitchThumb = (0, withClassName_js_1.withClassName)(react_switch_1.Thumb, 'block w-21px h-21px bg-white rounded-lg border-default transition-transform will-change-transform [&[data-state=checked]]:translate-x-19px');
+const SwitchRoot = (0, withClassName_js_1.withClassName)(react_switch_1.Root, 'layer-components:unset layer-components:transition-all layer-components:cursor-pointer layer-components:w-42px layer-components:h-25px layer-components:bg-white layer-components:rounded-lg layer-components:relative layer-components:border-default layer-components:flex-shrink-0 layer-components:shadow-sm', 'layer-components:[&[data-state=checked]]:bg-main', 'layer-components:hover:[&:not(:disabled)]:bg-lighten-2 layer-components:hover:[&:not(:disabled)]:ring-2 layer-components:hover:[&:not(:disabled)]:ring-bg', 'layer-components:active:[&:not(:disabled)]:bg-darken-1 layer-components:active:[&:not(:disabled)]:ring-4', 'layer-components:focus:outline-none', 'layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-accent layer-components:focus-visible:outline-off');
+const SwitchThumb = (0, withClassName_js_1.withClassName)(react_switch_1.Thumb, 'layer-components:block layer-components:w-21px layer-components:h-21px layer-components:bg-white layer-components:rounded-lg layer-components:border-default layer-components:transition-transform layer-components:will-change-transform', 'layer-components:[&[data-state=checked]]:translate-x-18px');
 exports.Switch = Object.assign(function Switch(_a) {
     var { ref } = _a, props = __rest(_a, ["ref"]);
     return ((0, jsx_runtime_1.jsx)(SwitchRoot, Object.assign({}, props, { ref: ref, children: (0, jsx_runtime_1.jsx)(SwitchThumb, {}) })));

package/dist/cjs/components/switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../src/components/switch/Switch.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,yDAAkE;AAClE,mEAA6D;AAE7D,MAAM,UAAU,GAAG,IAAA,gCAAa,EAC/B,mBAAI,EACJ,6JAA6J,CAC7J,CAAC;AAEF,MAAM,WAAW,GAAG,IAAA,gCAAa,EAChC,oBAAK,EACL,4IAA4I,CAC5I,CAAC;AAEW,QAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAClC,SAAS,MAAM,CAAC,EAKf;QALe,EACf,GAAG,OAIH,EAHG,KAAK,cAFO,OAGf,CADQ;IAIR,OAAO,CACN,uBAAC,UAAU,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,YAC9B,uBAAC,WAAW,KAAG,IACH,CACb,CAAC;AACH,CAAC,EACD;IACC,IAAI,EAAE,UAAU;IAChB,KAAK,EAAE,WAAW;CAClB,CACD,CAAC"}
+{"version":3,"file":"Switch.js","sourceRoot":"","sources":["../../../../src/components/switch/Switch.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,yDAAkE;AAClE,mEAA6D;AAE7D,MAAM,UAAU,GAAG,IAAA,gCAAa,EAC/B,mBAAI,EACJ,0IAA0I,EAC1I,kDAAkD,EAClD,yEAAyE,EACzE,iEAAiE,EACjE,qCAAqC,EACrC,iEAAiE,CACjE,CAAC;AAEF,MAAM,WAAW,GAAG,IAAA,gCAAa,EAChC,oBAAK,EACL,sHAAsH,EACtH,2DAA2D,CAC3D,CAAC;AAEW,QAAA,MAAM,GAAG,MAAM,CAAC,MAAM,CAClC,SAAS,MAAM,CAAC,EAKf;QALe,EACf,GAAG,OAIH,EAHG,KAAK,cAFO,OAGf,CADQ;IAIR,OAAO,CACN,uBAAC,UAAU,oBAAK,KAAK,IAAE,GAAG,EAAE,GAAG,YAC9B,uBAAC,WAAW,KAAG,IACH,CACb,CAAC;AACH,CAAC,EACD;IACC,IAAI,EAAE,UAAU;IAChB,KAAK,EAAE,WAAW;CAClB,CACD,CAAC"}

package/dist/cjs/components/tabs/tabs.js

@@ -54,11 +54,11 @@ const TabsPrimitive = __importStar(require("@radix-ui/react-tabs"));
 const clsx_1 = __importDefault(require("clsx"));
 const withClassName_js_1 = require("../../hooks/withClassName.js");
 exports.TabsRoot = (0, withClassName_js_1.withClassName)(TabsPrimitive.Root, '');
-exports.TabsList = (0, withClassName_js_1.withClassName)(TabsPrimitive.List, 'flex flex-row flex-wrap py-2 px-2 items-start gap-2');
-exports.TabsTriggerBase = (0, withClassName_js_1.withClassName)(TabsPrimitive.Trigger, 'layer-components:flex layer-components:flex-row layer-components:items-center layer-components:cursor-pointer layer-components:justify-center layer-components:gap-2 layer-components:color-black layer-components:py-1 layer-components:px-5 layer-components:bg-wash layer-components:text-md layer-components:min-w-100px layer-components:rounded-lg layer-components:border-default layer-components:font-semibold layer-components:color-gray-ink layer-components:border-gray-dark layer-components:transition-all layer-components:cursor-pointer layer-components:select-none layer-components:font-inherit layer-components:flex-shrink-0 layer-components:shadow-sm', 'layer-components:hover:bg-darken-1 layer-components:hover:ring-4 layer-components:hover:ring-bg', 'layer-components:focus-visible:bg-darken-1 layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-bg layer-components:focus-visible:outline-off', '[&[data-state=active]]:bg-[var(--bg)] [&[data-state=active]]:font-semibold [&[data-state=active]]:color-black [&[data-state=active]]:cursor-default [&[data-state=active]]:hover:bg-darken-1 [&[data-state=active]]:relative [&[data-state=active]]:z-1');
+exports.TabsList = (0, withClassName_js_1.withClassName)(TabsPrimitive.List, 'layer-components:flex layer-components:flex-row layer-components:items-start layer-components:gap-2', 'layer-components:border layer-components:border-thin layer-components:border-color layer-components:rounded-xl', 'layer-components:shadow-sm layer-components:bg-white', 'layer-components:overflow-x-auto layer-components:overflow-unstable layer-components:w-max-content layer-components:max-w-full');
+exports.TabsTriggerBase = (0, withClassName_js_1.withClassName)(TabsPrimitive.Trigger, 'layer-components:flex layer-components:flex-row layer-components:items-center layer-components:justify-center layer-components:gap-2 layer-components:py-xs layer-components:px-lg', 'layer-components:transition-all layer-components:cursor-pointer layer-components:select-none', 'layer-components:text-center layer-components:text-md layer-components:font-semibold layer-components:color-gray-ink layer-components:font-inherit layer-components:text-nowrap', 'layer-components:min-w-100px layer-components:min-h-touch layer-components:flex-shrink-0', 'layer-components:bg-transparent layer-components:border layer-components:border-transparent layer-components:rounded-lg', 'layer-components:hover:[&[data-state=inactive]]:bg-gray-light layer-components:hover:[&[data-state=inactive]]:bg-darken-1 layer-components:hover:[&[data-state=inactive]]:ring-4 layer-components:hover:[&[data-state=inactive]]:ring-bg', 'layer-components:focus-visible:bg-darken-1 layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-accent layer-components:focus-visible:outline-off layer-components:focus-visible:border layer-components:focus-visible:border-black', '[&[data-state=active]]:cursor-default [&[data-state=active]]:border-gray-dark [&[data-state=active]]:relative [&[data-state=active]]:z-1');
 const colorClasses = {
-    default: 'layer-variants:[--bg:var(--color-white)]',
-    primary: 'layer-variants:[--bg:var(--color-primary)]',
+    default: 'layer-variants:[&[data-state=active]]:bg-gray',
+    primary: 'layer-variants:[&[data-state=active]]:bg-main-light',
 };
 const TabsTrigger = (_a) => {
     var { className, color = 'primary' } = _a, props = __rest(_a, ["className", "color"]);

package/dist/cjs/components/tabs/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../../src/components/tabs/tabs.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,oEAAsD;AACtD,gDAAwB;AACxB,mEAA6D;AAEhD,QAAA,QAAQ,GAAG,IAAA,gCAAa,EAAC,aAAa,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;AAEjD,QAAA,QAAQ,GAAG,IAAA,gCAAa,EACpC,aAAa,CAAC,IAAI,EAClB,qDAAqD,CACrD,CAAC;AAEW,QAAA,eAAe,GAAG,IAAA,gCAAa,EAC3C,aAAa,CAAC,OAAO,EACrB,4RAA4R,EAC5R,qDAAqD,EACrD,yEAAyE,EACzE,iHAAiH,CACjH,CAAC;AAEF,MAAM,YAAY,GAAG;IACpB,OAAO,EAAE,4CAA4C;IACrD,OAAO,EAAE,8CAA8C;CACvD,CAAC;AAOK,MAAM,WAAW,GAAG,CAAC,EAIT,EAAE,EAAE;QAJK,EAC3B,SAAS,EACT,KAAK,GAAG,SAAS,OAEC,EADf,KAAK,cAHmB,sBAI3B,CADQ;IACe,OAAA,CACvB,uBAAC,uBAAe,kBACf,SAAS,EAAE,IAAA,cAAI,EAAC,YAAY,CAAC,KAAK,CAAC,EAAE,aAAa,KAAK,EAAE,EAAE,SAAS,CAAC,IACjE,KAAK,EACR,CACF,CAAA;CAAA,CAAC;AATW,QAAA,WAAW,eAStB;AAEW,QAAA,WAAW,GAAG,IAAA,gCAAa,EACvC,aAAa,CAAC,OAAO,EACrB,gGAAgG,CAChG,CAAC;AAEW,QAAA,IAAI,GAAG,MAAM,CAAC,MAAM,CAAC,gBAAQ,EAAE;IAC3C,IAAI,EAAE,gBAAQ;IACd,OAAO,EAAE,mBAAW;IACpB,OAAO,EAAE,mBAAW;CACpB,CAAC,CAAC"}
+{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../../src/components/tabs/tabs.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,oEAAsD;AACtD,gDAAwB;AACxB,mEAA6D;AAEhD,QAAA,QAAQ,GAAG,IAAA,gCAAa,EAAC,aAAa,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;AAEjD,QAAA,QAAQ,GAAG,IAAA,gCAAa,EACpC,aAAa,CAAC,IAAI,EAClB,oDAAoD,EACpD,+DAA+D,EAC/D,uCAAuC,EACvC,+EAA+E,CAC/E,CAAC;AAEW,QAAA,eAAe,GAAG,IAAA,gCAAa,EAC3C,aAAa,CAAC,OAAO,EACrB,gFAAgF,EAChF,8DAA8D,EAC9D,8FAA8F,EAC9F,0DAA0D,EAC1D,wEAAwE,EACxE,4FAA4F,EAC5F,iGAAiG,EACjG,uEAAuE,CACvE,CAAC;AAEF,MAAM,YAAY,GAAG;IACpB,OAAO,EAAE,iDAAiD;IAC1D,OAAO,EAAE,uDAAuD;CAChE,CAAC;AAOK,MAAM,WAAW,GAAG,CAAC,EAIT,EAAE,EAAE;QAJK,EAC3B,SAAS,EACT,KAAK,GAAG,SAAS,OAEC,EADf,KAAK,cAHmB,sBAI3B,CADQ;IACe,OAAA,CACvB,uBAAC,uBAAe,kBACf,SAAS,EAAE,IAAA,cAAI,EAAC,YAAY,CAAC,KAAK,CAAC,EAAE,aAAa,KAAK,EAAE,EAAE,SAAS,CAAC,IACjE,KAAK,EACR,CACF,CAAA;CAAA,CAAC;AATW,QAAA,WAAW,eAStB;AAEW,QAAA,WAAW,GAAG,IAAA,gCAAa,EACvC,aAAa,CAAC,OAAO,EACrB,gGAAgG,CAChG,CAAC;AAEW,QAAA,IAAI,GAAG,MAAM,CAAC,MAAM,CAAC,gBAAQ,EAAE;IAC3C,IAAI,EAAE,gBAAQ;IACd,OAAO,EAAE,mBAAW;IACpB,OAAO,EAAE,mBAAW;CACpB,CAAC,CAAC"}

package/dist/cjs/components/tabs/tabs.stories.d.ts

@@ -16,3 +16,4 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<Meta>;
 export declare const Default: Story;
+export declare const WithManyTabs: Story;

package/dist/cjs/components/tabs/tabs.stories.js

@@ -1,7 +1,7 @@
 // @unocss-include
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
+exports.WithManyTabs = exports.Default = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const tabs_js_1 = require("./tabs.js");
@@ -24,4 +24,10 @@ exports.Default = {
         return ((0, jsx_runtime_1.jsxs)(tabs_js_1.TabsRoot, { value: value, onValueChange: setValue, children: [(0, jsx_runtime_1.jsxs)(tabs_js_1.TabsList, { children: [(0, jsx_runtime_1.jsx)(tabs_js_1.TabsTrigger, { value: "tab1", color: args.color, children: "Tab 1" }), (0, jsx_runtime_1.jsx)(tabs_js_1.TabsTrigger, { value: "tab2", color: args.color, children: "Tab 2 (long)" }), (0, jsx_runtime_1.jsx)(tabs_js_1.TabsTrigger, { value: "tab3", color: args.color, children: "Tab 3" })] }), (0, jsx_runtime_1.jsx)(tabs_js_1.TabsContent, { value: "tab1", children: (0, jsx_runtime_1.jsx)("div", { children: "Tab 1 content" }) }), (0, jsx_runtime_1.jsx)(tabs_js_1.TabsContent, { value: "tab2", children: (0, jsx_runtime_1.jsx)("div", { children: "Tab 2 content" }) }), (0, jsx_runtime_1.jsx)(tabs_js_1.TabsContent, { value: "tab3", children: (0, jsx_runtime_1.jsx)("div", { children: "Tab 3 content" }) })] }));
     },
 };
+exports.WithManyTabs = {
+    render: (args) => {
+        const [value, setValue] = (0, react_1.useState)('tab1');
+        return ((0, jsx_runtime_1.jsxs)(tabs_js_1.TabsRoot, { value: value, onValueChange: setValue, children: [(0, jsx_runtime_1.jsx)(tabs_js_1.TabsList, { children: Array.from({ length: 20 }).map((_, i) => ((0, jsx_runtime_1.jsxs)(tabs_js_1.TabsTrigger, { value: `tab${i + 1}`, color: args.color, children: ["Tab ", i + 1] }, i))) }), Array.from({ length: 20 }).map((_, i) => ((0, jsx_runtime_1.jsx)(tabs_js_1.TabsContent, { value: `tab${i + 1}`, children: (0, jsx_runtime_1.jsxs)("div", { children: ["Tab ", i + 1, " content"] }) }, i)))] }));
+    },
+};
 //# sourceMappingURL=tabs.stories.js.map

package/dist/cjs/components/tabs/tabs.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.stories.js","sourceRoot":"","sources":["../../../../src/components/tabs/tabs.stories.tsx"],"names":[],"mappings":";;;;AACA,iCAAiC;AACjC,uCAAyE;AAEzE,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,iBAAiB;IACxB,QAAQ,EAAE;QACT,KAAK,EAAE;YACN,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;SAC/B;KACD;IACD,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CACc,CAAC;AAEjB,kBAAe,IAAI,CAAC;AAIP,QAAA,OAAO,GAAU;IAC7B,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE;QAChB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,MAAM,CAAC,CAAC;QAC3C,OAAO,CACN,wBAAC,kBAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,aAC9C,wBAAC,kBAAQ,eACR,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,sBAE7B,EACd,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,6BAE7B,EACd,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,sBAE7B,IACJ,EACX,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,YACxB,4DAAwB,GACX,EACd,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,YACxB,4DAAwB,GACX,EACd,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,YACxB,4DAAwB,GACX,IACJ,CACX,CAAC;IACH,CAAC;CACe,CAAC"}
+{"version":3,"file":"tabs.stories.js","sourceRoot":"","sources":["../../../../src/components/tabs/tabs.stories.tsx"],"names":[],"mappings":";;;;AACA,iCAAiC;AACjC,uCAAyE;AAEzE,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,iBAAiB;IACxB,QAAQ,EAAE;QACT,KAAK,EAAE;YACN,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC;SAC/B;KACD;IACD,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CACc,CAAC;AAEjB,kBAAe,IAAI,CAAC;AAIP,QAAA,OAAO,GAAU;IAC7B,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE;QAChB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,MAAM,CAAC,CAAC;QAC3C,OAAO,CACN,wBAAC,kBAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,aAC9C,wBAAC,kBAAQ,eACR,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,sBAE7B,EACd,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,6BAE7B,EACd,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,sBAE7B,IACJ,EACX,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,YACxB,4DAAwB,GACX,EACd,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,YACxB,4DAAwB,GACX,EACd,uBAAC,qBAAW,IAAC,KAAK,EAAC,MAAM,YACxB,4DAAwB,GACX,IACJ,CACX,CAAC;IACH,CAAC;CACe,CAAC;AAEL,QAAA,YAAY,GAAU;IAClC,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE;QAChB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,MAAM,CAAC,CAAC;QAC3C,OAAO,CACN,wBAAC,kBAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,aAC9C,uBAAC,kBAAQ,cACP,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACzC,wBAAC,qBAAW,IAAS,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,qBACtD,CAAC,GAAG,CAAC,KADO,CAAC,CAEL,CACd,CAAC,GACQ,EACV,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACzC,uBAAC,qBAAW,IAAS,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC,EAAE,YACxC,oDAAU,CAAC,GAAG,CAAC,gBAAe,IADb,CAAC,CAEL,CACd,CAAC,IACQ,CACX,CAAC;IACH,CAAC;CACe,CAAC"}

package/dist/cjs/components/toggleGroup/toggleGroup.js

@@ -37,8 +37,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ToggleGroup = exports.ToggleGroupItem = exports.ToggleGroupRoot = void 0;
 const ToggleGroupPrimitive = __importStar(require("@radix-ui/react-toggle-group"));
 const withClassName_js_1 = require("../../hooks/withClassName.js");
-exports.ToggleGroupRoot = (0, withClassName_js_1.withClassName)(ToggleGroupPrimitive.Root, 'layer-components:inline-flex layer-components:bg-gray-wash layer-components:bg-darken-1 layer-components:rounded-lg layer-components:gap-sm');
-exports.ToggleGroupItem = (0, withClassName_js_1.withClassName)(ToggleGroupPrimitive.Item, 'layer-components:rounded-full layer-components:color-black layer-components:bg-gray layer-components:bg-lighten-3 layer-components:py-sm layer-components:px-md layer-components:flex layer-components:items-center layer-components:border-transparent layer-components:border-1 layer-components:border-solid layer-components:justify-center layer-components:cursor-pointer', 'layer-components:hover:bg-lighten-2 layer-components:active:bg-lighten-2 layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-primary layer-components:focus-visible:outline-off', 'layer-components:[&[data-state=on]]:bg-primary-light layer-components:[&[data-state=on]]:border-default');
+exports.ToggleGroupRoot = (0, withClassName_js_1.withClassName)(ToggleGroupPrimitive.Root, 'layer-components:inline-flex layer-components:bg-main-light/20 layer-components:rounded-lg layer-components:gap-sm layer-components:w-fit');
+exports.ToggleGroupItem = (0, withClassName_js_1.withClassName)(ToggleGroupPrimitive.Item, 'layer-components:rounded-full layer-components:text-nowrap layer-components:transition-all layer-components:color-black layer-components:bg-gray/30 layer-components:py-sm layer-components:px-md layer-components:flex layer-components:items-center layer-components:border-transparent layer-components:border-1 layer-components:border-solid layer-components:justify-center layer-components:cursor-pointer', 'layer-components:hover:bg-lighten-2 layer-components:hover:border-main-ink/20 layer-components:hover:ring-bg layer-components:hover:ring-2', 'layer-components:active:bg-darken-1 layer-components:active:border-main-ink/30 layer-components:active:ring-4', 'layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-accent layer-components:focus-visible:outline-off', 'layer-components:[&[data-state=on]]:bg-main layer-components:[&[data-state=on]]:border-default layer-components:[&[data-state=on]]:shadow-sm layer-components:[&[data-state=on]]:hover:border-default');
 exports.ToggleGroup = Object.assign(exports.ToggleGroupRoot, {
     Item: exports.ToggleGroupItem,
 });

package/dist/cjs/components/toggleGroup/toggleGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggleGroup.js","sourceRoot":"","sources":["../../../../src/components/toggleGroup/toggleGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,mFAAqE;AACrE,mEAA6D;AAEhD,QAAA,eAAe,GAAG,IAAA,gCAAa,EAC3C,oBAAoB,CAAC,IAAI,EACzB,2EAA2E,CAC3E,CAAC;AACW,QAAA,eAAe,GAAG,IAAA,gCAAa,EAC3C,oBAAoB,CAAC,IAAI,EACzB,uKAAuK,EACvK,2GAA2G,EAC3G,uEAAuE,CACvE,CAAC;AAEW,QAAA,WAAW,GAAG,MAAM,CAAC,MAAM,CAAC,uBAAe,EAAE;IACzD,IAAI,EAAE,uBAAe;CACrB,CAAC,CAAC"}
+{"version":3,"file":"toggleGroup.js","sourceRoot":"","sources":["../../../../src/components/toggleGroup/toggleGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,mFAAqE;AACrE,mEAA6D;AAEhD,QAAA,eAAe,GAAG,IAAA,gCAAa,EAC3C,oBAAoB,CAAC,IAAI,EACzB,yEAAyE,CACzE,CAAC;AACW,QAAA,eAAe,GAAG,IAAA,gCAAa,EAC3C,oBAAoB,CAAC,IAAI,EACzB,wLAAwL,EACxL,yEAAyE,EACzE,iEAAiE,EACjE,iEAAiE,EACjE,6FAA6F,CAC7F,CAAC;AAEW,QAAA,WAAW,GAAG,MAAM,CAAC,MAAM,CAAC,uBAAe,EAAE;IACzD,IAAI,EAAE,uBAAe;CACrB,CAAC,CAAC"}

package/dist/cjs/components/viewport/Viewport.stories.js

@@ -17,7 +17,7 @@ const meta = {
 exports.default = meta;
 const CenterButton = () => {
     const viewport = (0, ViewportContext_js_1.useViewport)();
-    return ((0, jsx_runtime_1.jsx)(Button_js_1.Button, { color: "ghost", size: "small", onClick: () => viewport.recenter(), children: (0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "locate" }) }));
+    return ((0, jsx_runtime_1.jsx)(Button_js_1.Button, { emphasis: "ghost", size: "small", onClick: () => viewport.recenter(), children: (0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "locate" }) }));
 };
 exports.Default = {
     render(args) {

package/dist/cjs/components/viewport/Viewport.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Viewport.stories.js","sourceRoot":"","sources":["../../../../src/components/viewport/Viewport.stories.tsx"],"names":[],"mappings":";;;;AACA,mDAA6C;AAC7C,6CAAuC;AACvC,+CAAyC;AACzC,6DAAmD;AAEnD,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,sBAAQ;IACnB,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CAC+B,CAAC;AAElC,kBAAe,IAAI,CAAC;AAIpB,MAAM,YAAY,GAAG,GAAG,EAAE;IACzB,MAAM,QAAQ,GAAG,IAAA,gCAAW,GAAE,CAAC;IAE/B,OAAO,CACN,uBAAC,kBAAM,IAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,YACpE,uBAAC,cAAI,IAAC,IAAI,EAAC,QAAQ,GAAG,GACd,CACT,CAAC;AACH,CAAC,CAAC;AAEW,QAAA,OAAO,GAAU;IAC7B,MAAM,CAAC,IAAI;QACV,OAAO,CACN,wBAAC,sBAAQ,kBAAC,SAAS,EAAC,gBAAgB,IAAK,IAAI,eAC5C,gCAAK,GAAG,EAAC,mDAAmD,GAAG,EAC/D,uBAAC,sBAAQ,CAAC,OAAO,cAChB,uBAAC,sBAAQ,CAAC,YAAY,KAAG,GACP,EACnB,uBAAC,sBAAQ,CAAC,OAAO,IAAC,QAAQ,EAAC,cAAc,YACxC,uBAAC,YAAY,KAAG,GACE,KACT,CACX,CAAC;IACH,CAAC;CACD,CAAC"}
+{"version":3,"file":"Viewport.stories.js","sourceRoot":"","sources":["../../../../src/components/viewport/Viewport.stories.tsx"],"names":[],"mappings":";;;;AACA,mDAA6C;AAC7C,6CAAuC;AACvC,+CAAyC;AACzC,6DAAmD;AAEnD,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,qBAAqB;IAC5B,SAAS,EAAE,sBAAQ;IACnB,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CAC+B,CAAC;AAElC,kBAAe,IAAI,CAAC;AAIpB,MAAM,YAAY,GAAG,GAAG,EAAE;IACzB,MAAM,QAAQ,GAAG,IAAA,gCAAW,GAAE,CAAC;IAE/B,OAAO,CACN,uBAAC,kBAAM,IAAC,QAAQ,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,YACvE,uBAAC,cAAI,IAAC,IAAI,EAAC,QAAQ,GAAG,GACd,CACT,CAAC;AACH,CAAC,CAAC;AAEW,QAAA,OAAO,GAAU;IAC7B,MAAM,CAAC,IAAI;QACV,OAAO,CACN,wBAAC,sBAAQ,kBAAC,SAAS,EAAC,gBAAgB,IAAK,IAAI,eAC5C,gCAAK,GAAG,EAAC,mDAAmD,GAAG,EAC/D,uBAAC,sBAAQ,CAAC,OAAO,cAChB,uBAAC,sBAAQ,CAAC,YAAY,KAAG,GACP,EACnB,uBAAC,sBAAQ,CAAC,OAAO,IAAC,QAAQ,EAAC,cAAc,YACxC,uBAAC,YAAY,KAAG,GACE,KACT,CACX,CAAC;IACH,CAAC;CACD,CAAC"}

package/dist/cjs/components/viewport/ViewportZoomControls.js

@@ -38,6 +38,6 @@ function ViewportZoomControls(_a) {
     const reset = () => {
         viewport.fitEverythingOnScreen({ origin: 'control' });
     };
-    return ((0, jsx_runtime_1.jsxs)(Box_js_1.Box, Object.assign({ gap: true, col: true, className: (0, clsx_1.default)(className) }, props, { children: [fit && ((0, jsx_runtime_1.jsx)(Button_js_1.Button, { color: "ghost", size: "small", onClick: reset, children: (0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "maximize" }) })), zoomIn && ((0, jsx_runtime_1.jsx)(Button_js_1.Button, { color: "ghost", size: "small", onClick: doZoomIn, children: (0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "zoomIn" }) })), zoomOut && ((0, jsx_runtime_1.jsx)(Button_js_1.Button, { color: "ghost", size: "small", onClick: doZoomOut, children: (0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "zoomOut" }) }))] })));
+    return ((0, jsx_runtime_1.jsxs)(Box_js_1.Box, Object.assign({ gap: true, col: true, className: (0, clsx_1.default)(className) }, props, { children: [fit && ((0, jsx_runtime_1.jsx)(Button_js_1.Button, { emphasis: "ghost", size: "small", onClick: reset, children: (0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "maximize" }) })), zoomIn && ((0, jsx_runtime_1.jsx)(Button_js_1.Button, { emphasis: "ghost", size: "small", onClick: doZoomIn, children: (0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "zoomIn" }) })), zoomOut && ((0, jsx_runtime_1.jsx)(Button_js_1.Button, { emphasis: "ghost", size: "small", onClick: doZoomOut, children: (0, jsx_runtime_1.jsx)(Icon_js_1.Icon, { name: "zoomOut" }) }))] })));
 }
 //# sourceMappingURL=ViewportZoomControls.js.map

package/dist/cjs/components/viewport/ViewportZoomControls.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewportZoomControls.js","sourceRoot":"","sources":["../../../../src/components/viewport/ViewportZoomControls.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAMA,oDA4CC;;AAlDD,gDAAwB;AACxB,0CAA8C;AAC9C,mDAA6C;AAC7C,6CAAuC;AACvC,6DAAmD;AAEnD,SAAgB,oBAAoB,CAAC,EAUpC;QAVoC,EACpC,SAAS,EACT,MAAM,GAAG,IAAI,EACb,OAAO,GAAG,IAAI,EACd,GAAG,GAAG,IAAI,OAMV,EALG,KAAK,cAL4B,yCAMpC,CADQ;IAMR,MAAM,QAAQ,GAAG,IAAA,gCAAW,GAAE,CAAC;IAC/B,MAAM,QAAQ,GAAG,GAAG,EAAE;QACrB,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,GAAG,GAAG,EAAE;YACrC,MAAM,EAAE,SAAS;SACjB,CAAC,CAAC;IACJ,CAAC,CAAC;IACF,MAAM,SAAS,GAAG,GAAG,EAAE;QACtB,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,GAAG,GAAG,EAAE;YACrC,MAAM,EAAE,SAAS;SACjB,CAAC,CAAC;IACJ,CAAC,CAAC;IACF,MAAM,KAAK,GAAG,GAAG,EAAE;QAClB,QAAQ,CAAC,qBAAqB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC;IACvD,CAAC,CAAC;IACF,OAAO,CACN,wBAAC,YAAG,kBAAC,GAAG,QAAC,GAAG,QAAC,SAAS,EAAE,IAAA,cAAI,EAAC,SAAS,CAAC,IAAM,KAAK,eAChD,GAAG,IAAI,CACP,uBAAC,kBAAM,IAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,KAAK,YAChD,uBAAC,cAAI,IAAC,IAAI,EAAC,UAAU,GAAG,GAChB,CACT,EACA,MAAM,IAAI,CACV,uBAAC,kBAAM,IAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,QAAQ,YACnD,uBAAC,cAAI,IAAC,IAAI,EAAC,QAAQ,GAAG,GACd,CACT,EACA,OAAO,IAAI,CACX,uBAAC,kBAAM,IAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,SAAS,YACpD,uBAAC,cAAI,IAAC,IAAI,EAAC,SAAS,GAAG,GACf,CACT,KACI,CACN,CAAC;AACH,CAAC"}
+{"version":3,"file":"ViewportZoomControls.js","sourceRoot":"","sources":["../../../../src/components/viewport/ViewportZoomControls.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAMA,oDA4CC;;AAlDD,gDAAwB;AACxB,0CAA8C;AAC9C,mDAA6C;AAC7C,6CAAuC;AACvC,6DAAmD;AAEnD,SAAgB,oBAAoB,CAAC,EAUpC;QAVoC,EACpC,SAAS,EACT,MAAM,GAAG,IAAI,EACb,OAAO,GAAG,IAAI,EACd,GAAG,GAAG,IAAI,OAMV,EALG,KAAK,cAL4B,yCAMpC,CADQ;IAMR,MAAM,QAAQ,GAAG,IAAA,gCAAW,GAAE,CAAC;IAC/B,MAAM,QAAQ,GAAG,GAAG,EAAE;QACrB,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,GAAG,GAAG,EAAE;YACrC,MAAM,EAAE,SAAS;SACjB,CAAC,CAAC;IACJ,CAAC,CAAC;IACF,MAAM,SAAS,GAAG,GAAG,EAAE;QACtB,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,GAAG,GAAG,EAAE;YACrC,MAAM,EAAE,SAAS;SACjB,CAAC,CAAC;IACJ,CAAC,CAAC;IACF,MAAM,KAAK,GAAG,GAAG,EAAE;QAClB,QAAQ,CAAC,qBAAqB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC;IACvD,CAAC,CAAC;IACF,OAAO,CACN,wBAAC,YAAG,kBAAC,GAAG,QAAC,GAAG,QAAC,SAAS,EAAE,IAAA,cAAI,EAAC,SAAS,CAAC,IAAM,KAAK,eAChD,GAAG,IAAI,CACP,uBAAC,kBAAM,IAAC,QAAQ,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,KAAK,YACnD,uBAAC,cAAI,IAAC,IAAI,EAAC,UAAU,GAAG,GAChB,CACT,EACA,MAAM,IAAI,CACV,uBAAC,kBAAM,IAAC,QAAQ,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,QAAQ,YACtD,uBAAC,cAAI,IAAC,IAAI,EAAC,QAAQ,GAAG,GACd,CACT,EACA,OAAO,IAAI,CACX,uBAAC,kBAAM,IAAC,QAAQ,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,SAAS,YACvD,uBAAC,cAAI,IAAC,IAAI,EAAC,SAAS,GAAG,GACf,CACT,KACI,CACN,CAAC;AACH,CAAC"}

package/dist/cjs/themes.stories.js

@@ -17,7 +17,6 @@ const index_js_5 = require("./components/index.js");
 const index_js_6 = require("./components/input/index.js");
 const tabs_js_1 = require("./components/tabs/tabs.js");
 const index_js_7 = require("./components/textArea/index.js");
-const hooks_js_1 = require("./hooks.js");
 const useOverrideTheme_js_1 = require("./hooks/useOverrideTheme.js");
 const meta = {
     title: 'Theme Demo',
@@ -32,10 +31,10 @@ exports.default = meta;
 function DemoUI({ className }) {
     const nextWeek = new Date();
     nextWeek.setDate(nextWeek.getDate() + 7);
-    return ((0, jsx_runtime_1.jsxs)(index_js_5.PageRoot, { className: (0, clsx_1.default)('flex-1', className), children: [(0, jsx_runtime_1.jsx)(index_js_5.PageContent, { children: (0, jsx_runtime_1.jsxs)("div", { className: (0, clsx_1.default)('grid gap-2 grid-cols-2'), children: [(0, jsx_runtime_1.jsxs)(index_js_5.Box, { gap: true, wrap: true, p: true, children: [(0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "primary", children: "Primary" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "accent", children: "Accent" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { children: "Default" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "contrast", children: "Contrast" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "destructive", children: "Destructive" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "ghost", children: "Ghost" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "ghostAccent", children: "Ghost Accent" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", color: "destructive", children: "Destructive Small" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", color: "ghostDestructive", children: "Ghost Destructive Small" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { gap: true, wrap: true, p: true, items: "start", children: [(0, jsx_runtime_1.jsx)(index_js_6.Input, { placeholder: "Placeholder" }), (0, jsx_runtime_1.jsx)(index_js_7.TextArea, { placeholder: "Placeholder" }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { d: "row", gap: true, items: "center", children: [(0, jsx_runtime_1.jsx)(index_js_5.Checkbox, { defaultChecked: true }), (0, jsx_runtime_1.jsx)("span", { children: "Checkbox" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.ToggleGroup, { type: "single", defaultValue: "1", children: [(0, jsx_runtime_1.jsx)(index_js_5.ToggleGroup.Item, { value: "1", children: "Toggle 1" }), (0, jsx_runtime_1.jsx)(index_js_5.ToggleGroup.Item, { value: "2", children: "Toggle 2" })] })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { layout: "start safe-center", d: "col", gap: true, p: true, className: "max-h-200px", overflow: "auto-y", children: [(0, jsx_runtime_1.jsx)(index_js_5.H1, { children: "Heading 1" }), (0, jsx_runtime_1.jsx)(index_js_5.H2, { children: "Heading 2" }), (0, jsx_runtime_1.jsx)(index_js_5.H3, { children: "Heading 3" }), (0, jsx_runtime_1.jsx)(index_js_5.H4, { children: "Heading 4" }), (0, jsx_runtime_1.jsx)(index_js_5.P, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." }), (0, jsx_runtime_1.jsx)(index_js_5.TextSkeleton, { maxLength: 30 }), (0, jsx_runtime_1.jsx)(index_js_5.TextSkeleton, { maxLength: 10 })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { d: "col", gap: true, children: [(0, jsx_runtime_1.jsxs)(index_js_3.Card, { children: [(0, jsx_runtime_1.jsxs)(index_js_3.Card.Main, { onClick: () => { }, children: [(0, jsx_runtime_1.jsx)(index_js_3.Card.Title, { children: "Card Title" }), (0, jsx_runtime_1.jsx)(index_js_3.Card.Content, { children: "Card Content" })] }), (0, jsx_runtime_1.jsx)(index_js_3.Card.Footer, { children: (0, jsx_runtime_1.jsxs)(index_js_3.Card.Actions, { children: [(0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Action 1" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", color: "ghost", children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }) })] }) })] }), (0, jsx_runtime_1.jsxs)(index_js_3.Card, { children: [(0, jsx_runtime_1.jsxs)(index_js_3.Card.Main, { compact: true, onClick: () => { }, children: [(0, jsx_runtime_1.jsx)(index_js_3.Card.Title, { children: "Card Title" }), (0, jsx_runtime_1.jsx)(index_js_3.Card.Content, { children: "Card Content" })] }), (0, jsx_runtime_1.jsx)(index_js_3.Card.Footer, { children: (0, jsx_runtime_1.jsxs)(index_js_3.Card.Actions, { children: [(0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Action 1" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", color: "ghost", children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }) })] }) })] })] }), (0, jsx_runtime_1.jsxs)(tabs_js_1.Tabs, { defaultValue: "tab1", children: [(0, jsx_runtime_1.jsxs)(tabs_js_1.Tabs.List, { children: [(0, jsx_runtime_1.jsx)(tabs_js_1.Tabs.Trigger, { value: "tab1", children: "Tab 1" }), (0, jsx_runtime_1.jsx)(tabs_js_1.Tabs.Trigger, { value: "tab2", children: "Tab 2" })] }), (0, jsx_runtime_1.jsx)(tabs_js_1.Tabs.Content, { value: "tab1", children: "Tab 1 Content" }), (0, jsx_runtime_1.jsx)(tabs_js_1.Tabs.Content, { value: "tab2", children: "Tab 2 Content" })] }), (0, jsx_runtime_1.jsxs)(index_js_1.ActionBar, { children: [(0, jsx_runtime_1.jsxs)(index_js_1.ActionButton, { children: [(0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }), "Hello"] }), (0, jsx_runtime_1.jsxs)(index_js_1.ActionButton, { color: "primary", children: [(0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }), "World"] }), (0, jsx_runtime_1.jsx)(index_js_1.ActionButton, { children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }) })] }), (0, jsx_runtime_1.jsxs)(index_js_5.AvatarList, { count: 3, children: [(0, jsx_runtime_1.jsx)(index_js_5.AvatarList.Item, { index: 0, name: "John Doe" }), (0, jsx_runtime_1.jsx)(index_js_5.AvatarList.Item, { index: 1, name: "Jane Doe" }), (0, jsx_runtime_1.jsx)(index_js_5.AvatarList.Item, { index: 2, name: "John Smith" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.ContextMenu, { children: [(0, jsx_runtime_1.jsx)(index_js_5.ContextMenu.Trigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_5.Tooltip, { content: "Hello World", children: (0, jsx_runtime_1.jsx)(index_js_2.Button, { children: "Hover or right click" }) }) }), (0, jsx_runtime_1.jsxs)(index_js_5.ContextMenu.Content, { children: [(0, jsx_runtime_1.jsx)(index_js_5.ContextMenu.Item, { children: "Item 1" }), (0, jsx_runtime_1.jsx)(index_js_5.ContextMenu.Item, { children: "Item 2" }), (0, jsx_runtime_1.jsx)(index_js_5.ContextMenu.Item, { children: "Item 3" })] })] }), (0, jsx_runtime_1.jsxs)(index_js_5.DropdownMenu, { children: [(0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Trigger, { asChild: true, className: "m-auto", children: (0, jsx_runtime_1.jsx)(index_js_2.Button, { children: "Dropdown" }) }), (0, jsx_runtime_1.jsxs)(index_js_5.DropdownMenu.Content, { children: [(0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 1" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 2" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 3" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { disabled: true, children: "Disabled Item" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Separator, {}), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 4" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 5" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 6" }), (0, jsx_runtime_1.jsxs)(index_js_5.DropdownMenu.Item, { children: ["With icon", (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.ItemRightSlot, { children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "flag" }) })] })] })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Select, { value: "1", children: [(0, jsx_runtime_1.jsx)(index_js_5.Select.Trigger, {}), (0, jsx_runtime_1.jsxs)(index_js_5.Select.Content, { children: [(0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "1", children: "Item 1" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "2", children: "Item 2" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "3", children: "Item 3" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "4", children: "Item 4" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "5", children: "Item 5" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "6", children: "Item 6" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "7", children: "Item 7" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "8", children: "Item 8" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "9", children: "Item 9" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "10", children: "Item 10" })] })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Dialog, { children: [(0, jsx_runtime_1.jsx)(index_js_5.Dialog.Trigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_2.Button, { children: "Click" }) }), (0, jsx_runtime_1.jsxs)(index_js_5.Dialog.Content, { children: [(0, jsx_runtime_1.jsx)(index_js_5.Dialog.Title, { children: "Hello there" }), (0, jsx_runtime_1.jsx)(index_js_5.Dialog.Description, { children: "Im a dialog" }), (0, jsx_runtime_1.jsxs)(index_js_5.Dialog.Actions, { children: [(0, jsx_runtime_1.jsx)(index_js_5.Dialog.Close, { children: "Close" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "primary", children: "Action" })] })] })] }), (0, jsx_runtime_1.jsx)(index_js_5.DateRangePicker, { className: "grid-col-span-2", value: {
+    return ((0, jsx_runtime_1.jsxs)(index_js_5.PageRoot, { className: (0, clsx_1.default)('flex-1', className), children: [(0, jsx_runtime_1.jsx)(index_js_5.PageContent, { children: (0, jsx_runtime_1.jsxs)("div", { className: (0, clsx_1.default)('grid gap-2 grid-cols-2'), children: [(0, jsx_runtime_1.jsxs)(index_js_5.Box, { gap: true, wrap: true, p: true, children: [(0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "primary", emphasis: "primary", children: "Primary" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "accent", emphasis: "primary", children: "Accent" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { children: "Default" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { emphasis: "contrast", children: "Contrast" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "attention", emphasis: "primary", children: "Destructive" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { emphasis: "ghost", children: "Ghost" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "accent", emphasis: "ghost", children: "Ghost Accent" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", color: "attention", emphasis: "primary", children: "Destructive Small" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", color: "attention", emphasis: "ghost", children: "Ghost Destructive Small" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { gap: true, wrap: true, p: true, items: "start", children: [(0, jsx_runtime_1.jsx)(index_js_6.Input, { placeholder: "Placeholder" }), (0, jsx_runtime_1.jsx)(index_js_7.TextArea, { placeholder: "Placeholder" }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { d: "row", gap: true, items: "center", children: [(0, jsx_runtime_1.jsx)(index_js_5.Checkbox, { defaultChecked: true }), (0, jsx_runtime_1.jsx)("span", { children: "Checkbox" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.ToggleGroup, { type: "single", defaultValue: "1", children: [(0, jsx_runtime_1.jsx)(index_js_5.ToggleGroup.Item, { value: "1", children: "Toggle 1" }), (0, jsx_runtime_1.jsx)(index_js_5.ToggleGroup.Item, { value: "2", children: "Toggle 2" })] })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { layout: "start safe-center", d: "col", gap: true, p: true, className: "max-h-200px", overflow: "auto-y", children: [(0, jsx_runtime_1.jsx)(index_js_5.H1, { children: "Heading 1" }), (0, jsx_runtime_1.jsx)(index_js_5.H2, { children: "Heading 2" }), (0, jsx_runtime_1.jsx)(index_js_5.H3, { children: "Heading 3" }), (0, jsx_runtime_1.jsx)(index_js_5.H4, { children: "Heading 4" }), (0, jsx_runtime_1.jsx)(index_js_5.P, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." }), (0, jsx_runtime_1.jsx)(index_js_5.TextSkeleton, { maxLength: 30 }), (0, jsx_runtime_1.jsx)(index_js_5.TextSkeleton, { maxLength: 10 })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { d: "col", gap: true, children: [(0, jsx_runtime_1.jsxs)(index_js_3.Card, { children: [(0, jsx_runtime_1.jsxs)(index_js_3.Card.Main, { onClick: () => { }, children: [(0, jsx_runtime_1.jsx)(index_js_3.Card.Title, { children: "Card Title" }), (0, jsx_runtime_1.jsx)(index_js_3.Card.Content, { children: "Card Content" })] }), (0, jsx_runtime_1.jsx)(index_js_3.Card.Footer, { children: (0, jsx_runtime_1.jsxs)(index_js_3.Card.Actions, { children: [(0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Action 1" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", emphasis: "ghost", children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }) })] }) })] }), (0, jsx_runtime_1.jsxs)(index_js_3.Card, { children: [(0, jsx_runtime_1.jsxs)(index_js_3.Card.Main, { compact: true, onClick: () => { }, children: [(0, jsx_runtime_1.jsx)(index_js_3.Card.Title, { children: "Card Title" }), (0, jsx_runtime_1.jsx)(index_js_3.Card.Content, { children: "Card Content" })] }), (0, jsx_runtime_1.jsx)(index_js_3.Card.Footer, { children: (0, jsx_runtime_1.jsxs)(index_js_3.Card.Actions, { children: [(0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Action 1" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", emphasis: "ghost", children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }) })] }) })] })] }), (0, jsx_runtime_1.jsxs)(tabs_js_1.Tabs, { defaultValue: "tab1", children: [(0, jsx_runtime_1.jsxs)(tabs_js_1.Tabs.List, { children: [(0, jsx_runtime_1.jsx)(tabs_js_1.Tabs.Trigger, { value: "tab1", children: "Tab 1" }), (0, jsx_runtime_1.jsx)(tabs_js_1.Tabs.Trigger, { value: "tab2", children: "Tab 2" })] }), (0, jsx_runtime_1.jsx)(tabs_js_1.Tabs.Content, { value: "tab1", children: "Tab 1 Content" }), (0, jsx_runtime_1.jsx)(tabs_js_1.Tabs.Content, { value: "tab2", children: "Tab 2 Content" })] }), (0, jsx_runtime_1.jsxs)(index_js_1.ActionBar, { children: [(0, jsx_runtime_1.jsxs)(index_js_1.ActionButton, { children: [(0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }), "Hello"] }), (0, jsx_runtime_1.jsxs)(index_js_1.ActionButton, { color: "primary", children: [(0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }), "World"] }), (0, jsx_runtime_1.jsx)(index_js_1.ActionButton, { children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "placeholder" }) })] }), (0, jsx_runtime_1.jsxs)(index_js_5.AvatarList, { count: 3, children: [(0, jsx_runtime_1.jsx)(index_js_5.AvatarList.Item, { index: 0, name: "John Doe" }), (0, jsx_runtime_1.jsx)(index_js_5.AvatarList.Item, { index: 1, name: "Jane Doe" }), (0, jsx_runtime_1.jsx)(index_js_5.AvatarList.Item, { index: 2, name: "John Smith" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.ContextMenu, { children: [(0, jsx_runtime_1.jsx)(index_js_5.ContextMenu.Trigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_5.Tooltip, { content: "Hello World", children: (0, jsx_runtime_1.jsx)(index_js_2.Button, { children: "Hover or right click" }) }) }), (0, jsx_runtime_1.jsxs)(index_js_5.ContextMenu.Content, { children: [(0, jsx_runtime_1.jsx)(index_js_5.ContextMenu.Item, { children: "Item 1" }), (0, jsx_runtime_1.jsx)(index_js_5.ContextMenu.Item, { children: "Item 2" }), (0, jsx_runtime_1.jsx)(index_js_5.ContextMenu.Item, { children: "Item 3" })] })] }), (0, jsx_runtime_1.jsxs)(index_js_5.DropdownMenu, { children: [(0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Trigger, { asChild: true, className: "m-auto", children: (0, jsx_runtime_1.jsx)(index_js_2.Button, { children: "Dropdown" }) }), (0, jsx_runtime_1.jsxs)(index_js_5.DropdownMenu.Content, { children: [(0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 1" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 2" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 3" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { disabled: true, children: "Disabled Item" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Separator, {}), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 4" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 5" }), (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.Item, { children: "Item 6" }), (0, jsx_runtime_1.jsxs)(index_js_5.DropdownMenu.Item, { children: ["With icon", (0, jsx_runtime_1.jsx)(index_js_5.DropdownMenu.ItemRightSlot, { children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "flag" }) })] })] })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Select, { value: "1", children: [(0, jsx_runtime_1.jsx)(index_js_5.Select.Trigger, {}), (0, jsx_runtime_1.jsxs)(index_js_5.Select.Content, { children: [(0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "1", children: "Item 1" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "2", children: "Item 2" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "3", children: "Item 3" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "4", children: "Item 4" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "5", children: "Item 5" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "6", children: "Item 6" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "7", children: "Item 7" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "8", children: "Item 8" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "9", children: "Item 9" }), (0, jsx_runtime_1.jsx)(index_js_5.Select.Item, { value: "10", children: "Item 10" })] })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Dialog, { children: [(0, jsx_runtime_1.jsx)(index_js_5.Dialog.Trigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_2.Button, { children: "Click" }) }), (0, jsx_runtime_1.jsxs)(index_js_5.Dialog.Content, { children: [(0, jsx_runtime_1.jsx)(index_js_5.Dialog.Title, { children: "Hello there" }), (0, jsx_runtime_1.jsx)(index_js_5.Dialog.Description, { children: "Im a dialog" }), (0, jsx_runtime_1.jsxs)(index_js_5.Dialog.Actions, { children: [(0, jsx_runtime_1.jsx)(index_js_5.Dialog.Close, { children: "Close" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "primary", children: "Action" })] })] })] }), (0, jsx_runtime_1.jsx)(index_js_5.DateRangePicker, { className: "grid-col-span-2", value: {
                                 start: new Date(),
                                 end: nextWeek,
-                            }, onChange: () => { } }), (0, jsx_runtime_1.jsx)(index_js_5.Progress, { value: 50, className: "m-auto" }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { surface: "primary", p: true, gap: true, d: "col", children: [(0, jsx_runtime_1.jsx)(index_js_5.H1, { children: "Primary surface" }), (0, jsx_runtime_1.jsx)(index_js_5.H2, { children: "Primary surface" }), (0, jsx_runtime_1.jsx)(index_js_5.H3, { children: "Primary surface" }), (0, jsx_runtime_1.jsx)("div", { children: "Primary surface" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "ghost", children: "Ghost" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { surface: "accent", p: true, d: "col", className: "max-h-200px", overflow: "auto-y", children: [(0, jsx_runtime_1.jsx)(index_js_5.H2, { children: "Accent surface" }), (0, jsx_runtime_1.jsx)(index_js_5.H3, { children: "Accent surface" }), (0, jsx_runtime_1.jsx)(index_js_5.P, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." }), (0, jsx_runtime_1.jsx)(index_js_5.P, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." }), (0, jsx_runtime_1.jsx)(index_js_5.P, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." }), (0, jsx_runtime_1.jsx)(index_js_5.TextSkeleton, { maxLength: 30 }), (0, jsx_runtime_1.jsx)(index_js_5.TextSkeleton, { maxLength: 10 }), "Accent surface"] }), (0, jsx_runtime_1.jsx)(index_js_5.Box, { surface: "default", p: true, d: "col", children: "Default surface" }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { surface: "attention", p: true, d: "col", children: [(0, jsx_runtime_1.jsx)(index_js_5.H2, { children: "Attention surface" }), (0, jsx_runtime_1.jsx)(index_js_5.H3, { children: "Attention surface" }), "Attention surface"] }), (0, jsx_runtime_1.jsx)(index_js_5.Box, { children: (0, jsx_runtime_1.jsx)(index_js_5.Note, { children: "Note note" }) }), (0, jsx_runtime_1.jsx)(index_js_5.Box, { justify: "start", items: "start", children: (0, jsx_runtime_1.jsxs)(index_js_5.HorizontalList, { openDirection: "down", children: [(0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "One" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Two" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Three" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Four" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Five" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Six" })] }) }), (0, jsx_runtime_1.jsx)(index_js_5.ImageUploader, { className: "h-200px", value: null, onChange: () => { } })] }) }), (0, jsx_runtime_1.jsx)(index_js_5.PageNav, { children: (0, jsx_runtime_1.jsxs)(index_js_5.NavBarRoot, { children: [(0, jsx_runtime_1.jsxs)(index_js_5.NavBarItem, { children: [(0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIconWrapper, { children: (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIcon, { name: "cart" }) }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemText, { children: "Item 1 long" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.NavBarItem, { active: true, children: [(0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIconWrapper, { children: (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIcon, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "book" }) }) }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemText, { children: "Item 2" }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemPip, {})] }), (0, jsx_runtime_1.jsxs)(index_js_5.NavBarItem, { color: "neutral", active: true, children: [(0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIconWrapper, { children: (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIcon, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "book" }) }) }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemText, { children: "Neutral" }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemPip, {})] })] }) })] }));
+                            }, onChange: () => { } }), (0, jsx_runtime_1.jsx)(index_js_5.Progress, { value: 50, className: "m-auto" }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { surface: true, color: "primary", p: true, gap: true, d: "col", children: [(0, jsx_runtime_1.jsx)(index_js_5.H1, { children: "Primary surface" }), (0, jsx_runtime_1.jsx)(index_js_5.H2, { children: "Primary surface" }), (0, jsx_runtime_1.jsx)(index_js_5.H3, { children: "Primary surface" }), (0, jsx_runtime_1.jsx)("div", { children: "Primary surface" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { emphasis: "ghost", children: "Ghost" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { surface: true, color: "accent", p: true, d: "col", className: "max-h-200px", overflow: "auto-y", children: [(0, jsx_runtime_1.jsx)(index_js_5.H2, { children: "Accent surface" }), (0, jsx_runtime_1.jsx)(index_js_5.H3, { children: "Accent surface" }), (0, jsx_runtime_1.jsx)(index_js_5.P, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." }), (0, jsx_runtime_1.jsx)(index_js_5.P, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." }), (0, jsx_runtime_1.jsx)(index_js_5.P, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." }), (0, jsx_runtime_1.jsx)(index_js_5.TextSkeleton, { maxLength: 30 }), (0, jsx_runtime_1.jsx)(index_js_5.TextSkeleton, { maxLength: 10 }), "Accent surface"] }), (0, jsx_runtime_1.jsx)(index_js_5.Box, { surface: true, p: true, d: "col", children: "Default surface" }), (0, jsx_runtime_1.jsxs)(index_js_5.Box, { surface: true, color: "attention", p: true, d: "col", children: [(0, jsx_runtime_1.jsx)(index_js_5.H2, { children: "Attention surface" }), (0, jsx_runtime_1.jsx)(index_js_5.H3, { children: "Attention surface" }), "Attention surface", (0, jsx_runtime_1.jsx)(index_js_2.Button, { emphasis: "ghost", children: "Ghost" })] }), (0, jsx_runtime_1.jsx)(index_js_5.Box, { children: (0, jsx_runtime_1.jsx)(index_js_5.Note, { children: "Note note" }) }), (0, jsx_runtime_1.jsx)(index_js_5.Box, { justify: "start", items: "start", children: (0, jsx_runtime_1.jsxs)(index_js_5.HorizontalList, { openDirection: "down", children: [(0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "One" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Two" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Three" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Four" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Five" }), (0, jsx_runtime_1.jsx)(index_js_2.Button, { size: "small", children: "Six" })] }) }), (0, jsx_runtime_1.jsx)(index_js_5.ImageUploader, { className: "h-200px", value: null, onChange: () => { } })] }) }), (0, jsx_runtime_1.jsx)(index_js_5.PageNav, { children: (0, jsx_runtime_1.jsxs)(index_js_5.NavBarRoot, { children: [(0, jsx_runtime_1.jsxs)(index_js_5.NavBarItem, { children: [(0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIconWrapper, { children: (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIcon, { name: "cart" }) }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemText, { children: "Item 1 long" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.NavBarItem, { active: true, children: [(0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIconWrapper, { children: (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIcon, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "book" }) }) }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemText, { children: "Item 2" }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemPip, {})] }), (0, jsx_runtime_1.jsxs)(index_js_5.NavBarItem, { color: "gray", children: [(0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIconWrapper, { children: (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIcon, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "book" }) }) }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemText, { children: "Neutral" })] }), (0, jsx_runtime_1.jsxs)(index_js_5.NavBarItem, { color: "gray", active: true, children: [(0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIconWrapper, { children: (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemIcon, { asChild: true, children: (0, jsx_runtime_1.jsx)(index_js_4.Icon, { name: "book" }) }) }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemText, { children: "Neutral" }), (0, jsx_runtime_1.jsx)(index_js_5.NavBarItemPip, {})] })] }) })] }));
 }
 exports.Default = {
     render() {
@@ -44,7 +43,7 @@ exports.Default = {
 };
 exports.Nesting = {
     render() {
-        return ((0, jsx_runtime_1.jsxs)(index_js_5.Box, { d: "col", p: true, gap: true, children: [(0, jsx_runtime_1.jsx)(index_js_5.Box, { d: "row", gap: true, surface: "primary", children: (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "primary", children: "Root theme" }) }), (0, jsx_runtime_1.jsx)(DemoUI, { className: "theme-eggplant override-dark flex-1" })] }));
+        return ((0, jsx_runtime_1.jsxs)(index_js_5.Box, { d: "col", p: true, gap: true, children: [(0, jsx_runtime_1.jsx)(index_js_5.Box, { d: "row", gap: true, surface: true, color: "primary", children: (0, jsx_runtime_1.jsx)(index_js_2.Button, { color: "primary", children: "Root theme" }) }), (0, jsx_runtime_1.jsx)(DemoUI, { className: "theme-eggplant override-dark flex-1" })] }));
     },
 };
 exports.Override = {
@@ -58,25 +57,21 @@ exports.Override = {
 exports.Custom = {
     render() {
         const [theme, setTheme] = (0, react_1.useState)({
-            '--dyn-primary-source': 70,
-            '--dyn-accent-source': 290,
+            '--p-primary-hue': 70,
+            '--p-accent-hue': 290,
             '--global-saturation': 0.5,
             '--global-border-scale': 1.5,
             '--global-spacing-scale': 1,
             '--global-corner-scale': 1,
-            '--dyn-primary-hue-rotate': 0,
-            '--dyn-accent-hue-rotate': 0,
         });
         const reroll = () => {
             setTheme({
-                '--dyn-primary-source': Math.floor(Math.random() * 360),
-                '--dyn-accent-source': Math.floor(Math.random() * 360),
+                '--p-primary-hue': Math.floor(Math.random() * 360),
+                '--p-accent-hue': Math.floor(Math.random() * 360),
                 '--global-saturation': Math.random(),
                 '--global-border-scale': Math.random() * 2,
                 '--global-spacing-scale': Math.random() * 2,
                 '--global-corner-scale': Math.random() * 1.25,
-                '--dyn-primary-hue-rotate': Math.random() * 4 - 2,
-                '--dyn-accent-hue-rotate': Math.random() * 4 - 2,
             });
         };
         return ((0, jsx_runtime_1.jsxs)(index_js_5.Box, { d: "col", gap: true, items: "start", style: theme, children: [(0, jsx_runtime_1.jsx)(index_js_2.Button, { onClick: reroll, children: "Reroll" }), (0, jsx_runtime_1.jsx)(DemoUI, { className: "theme" })] }));
@@ -93,7 +88,8 @@ exports.Trippy = {
             spacingScale: 0.5,
             cornerScale: 0.5,
         });
-        (0, hooks_js_1.useAnimationFrame)((dt) => {
+        const dt = 1000;
+        setInterval(() => {
             const current = ref.current;
             if (!current)
                 return;
@@ -116,7 +112,7 @@ exports.Trippy = {
             current.style.setProperty('--global-corner-scale', values.current.cornerScale.toString());
             current.style.setProperty('--dyn-primary-hue-rotate', '0');
             current.style.setProperty('--dyn-accent-hue-rotate', '0');
-        });
+        }, dt);
         return ((0, jsx_runtime_1.jsx)("div", { ref: ref, children: (0, jsx_runtime_1.jsx)(DemoUI, { className: "theme" }) }));
     },
 };