@g4rcez/components 0.0.71 → 0.0.73

package/dist/preset/preset.tailwind.js

@@ -33,9 +33,9 @@ var config = {
             zIndex: {
                 normal: "1",
                 tooltip: "13",
-                floating: "12",
-                overlay: "11",
-                navbar: "10",
+                floating: "21",
+                overlay: "20",
+                navbar: "19",
                 calendar: "2",
             },
             boxShadow: {

package/dist/preset/src/styles/dark.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dark.d.ts","sourceRoot":"","sources":["../../../../src/styles/dark.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,UAAU,EAAE,YA0LxB,CAAC"}
+{"version":3,"file":"dark.d.ts","sourceRoot":"","sources":["../../../../src/styles/dark.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,UAAU,EAAE,YAyMxB,CAAC"}

package/dist/preset/src/styles/dark.js

@@ -9,6 +9,7 @@ export var DARK_THEME = {
     colors: {
         foreground: "hsla(210, 50%, 98%)",
         background: "hsla(0, 0%, 9%)",
+        muted: "hsla(0, 0%, 12%)",
         disabled: "hsla(240, 4%, 33%)",
         emphasis: {
             foreground: "hsla(251, 91%, 95%)",
@@ -65,8 +66,9 @@ export var DARK_THEME = {
             switch: "hsla(0, 0%, 100%)",
         },
         card: {
-            background: "hsla(0, 0%, 15%)",
+            muted: "hsla(0, 0%, 22%)",
             border: "hsla(240, 7%, 27%)",
+            background: "hsla(0, 0%, 15%)",
         },
         floating: {
             foreground: "hsla(210, 40%, 98%)",
@@ -108,6 +110,10 @@ export var DARK_THEME = {
                 text: "hsla(2,100%,90%)",
                 bg: "hsla(5,62%,23%)",
             },
+            muted: {
+                text: "hsla(0, 100%, 100%)",
+                bg: "hsla(0, 0%, 12%)",
+            },
             neutral: {
                 text: "hsla(200,98%,60%)",
                 bg: "hsla(200,28%,19%)",
@@ -146,6 +152,10 @@ export var DARK_THEME = {
                 text: "hsla(216,10%,90%)",
                 bg: "hsla(214,7%,19%)",
             },
+            muted: {
+                text: "hsla(0, 100%, 100%)",
+                bg: "hsla(0, 0%, 12%)",
+            },
         },
         alert: {
             primary: {
@@ -183,6 +193,11 @@ export var DARK_THEME = {
                 bg: "hsla(220,6%,10%)",
                 border: "hsla(214,7%,19%)",
             },
+            muted: {
+                bg: "hsla(0, 0%, 12%)",
+                border: "hsla(0, 0%, 40%)",
+                text: "hsla(0, 100%, 100%)",
+            },
         },
     },
 };

package/dist/preset/src/styles/light.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"light.d.ts","sourceRoot":"","sources":["../../../../src/styles/light.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,WAAW,EAAE,YA0LzB,CAAC"}
+{"version":3,"file":"light.d.ts","sourceRoot":"","sources":["../../../../src/styles/light.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,WAAW,EAAE,YAyMzB,CAAC"}

package/dist/preset/src/styles/light.js

@@ -9,6 +9,7 @@ export var LIGHT_THEME = {
     colors: {
         foreground: "hsla(217, 15%, 30%)",
         background: "hsla(210, 34%, 96%)",
+        muted: "hsla(210, 30%, 86%)",
         disabled: "hsla(240, 10%, 78%)",
         emphasis: {
             foreground: "hsla(251,91%,95%)",
@@ -65,8 +66,9 @@ export var LIGHT_THEME = {
             switch: "hsla(0, 0%, 100%)",
         },
         card: {
-            background: "hsla(0, 0%, 100%)",
+            muted: "hsla(210, 25%, 94%)",
             border: "hsla(210, 25%, 88%)",
+            background: "hsla(0, 0%, 100%)",
         },
         floating: {
             foreground: "hsla(217, 15%, 20%)",
@@ -88,6 +90,10 @@ export var LIGHT_THEME = {
             border: "hsla(210, 25%, 88%)",
         },
         button: {
+            muted: {
+                bg: "hsla(210, 30%, 86%)",
+                text: "hsla(210, 10%, 15%)",
+            },
             primary: {
                 text: "hsla(0, 0%, 100%)",
                 bg: "hsla(207,96%,48%)",
@@ -118,6 +124,10 @@ export var LIGHT_THEME = {
             },
         },
         tag: {
+            muted: {
+                bg: "hsla(210, 30%, 86%)",
+                text: "hsla(210, 30%, 86%)",
+            },
             primary: {
                 text: "hsla(0, 0%, 100%)",
                 bg: "hsla(207,70%,55%)",
@@ -148,6 +158,11 @@ export var LIGHT_THEME = {
             },
         },
         alert: {
+            muted: {
+                bg: "hsla(210, 30%, 86%)",
+                text: "hsla(210, 30%, 86%)",
+                border: "hsla(210, 10%, 70%)",
+            },
             primary: {
                 text: "hsla(206,70%,50%)",
                 border: "hsla(206,90%,89%)",

package/dist/preset/src/styles/theme.types.d.ts

@@ -1,7 +1,7 @@
 export type GeneralTokens = {
     [K in string]: string | GeneralTokens;
 };
-export type ThemeState = "primary" | "warn" | "secondary" | "info" | "danger" | "success" | "neutral";
+export type ThemeState = "primary" | "warn" | "secondary" | "info" | "danger" | "success" | "neutral" | "muted";
 type BasicTokens = {
     hover: string;
     subtle: string;
@@ -24,6 +24,7 @@ export type DesignTokens = {
     colors: {
         disabled: string;
         background: string;
+        muted: string;
         foreground: string;
         primary: BasicTokens;
         emphasis: BasicTokens;
@@ -38,6 +39,7 @@ export type DesignTokens = {
         card: {
             background: string;
             border: string;
+            muted: string;
         };
         danger: BasicTokens & {
             notification: string;

package/dist/preset/src/styles/theme.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.types.d.ts","sourceRoot":"","sources":["../../../../src/styles/theme.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"theme.types.d.ts","sourceRoot":"","sources":["../../../../src/styles/theme.types.ts"],"names":[],"mappings":"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"}

package/dist/preset.tailwind.js

@@ -22,9 +22,9 @@ const config = {
             zIndex: {
                 normal: "1",
                 tooltip: "13",
-                floating: "12",
-                overlay: "11",
-                navbar: "10",
+                floating: "21",
+                overlay: "20",
+                navbar: "19",
                 calendar: "2",
             },
             boxShadow: {

package/dist/src/components/core/button.d.ts

@@ -3,9 +3,9 @@ import React from "react";
 import { type Label } from "../../types";
 import { PolymorphicProps } from "./polymorph";
 declare const buttonVariants: (props?: ({
-    size?: "big" | "small" | "min" | "default" | "icon" | null | undefined;
+    size?: "big" | "small" | "default" | "icon" | "min" | null | undefined;
     rounded?: "circle" | "default" | "rough" | "squared" | null | undefined;
-    theme?: "main" | "disabled" | "loading" | "raw" | "info" | "warn" | "danger" | "neutral" | "primary" | "success" | "secondary" | "ghost-info" | "ghost-warn" | "ghost-danger" | "ghost-primary" | "ghost-success" | "ghost-secondary" | null | undefined;
+    theme?: "main" | "disabled" | "raw" | "loading" | "info" | "warn" | "muted" | "danger" | "neutral" | "primary" | "success" | "secondary" | "ghost-info" | "ghost-warn" | "ghost-danger" | "ghost-primary" | "ghost-success" | "ghost-secondary" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export type ButtonProps<T extends React.ElementType = "button"> = PolymorphicProps<VariantProps<typeof buttonVariants> & Partial<{
     icon: Label;

package/dist/src/components/core/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/core/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,cAAc;;;;mFAwCnB,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,gBAAgB,CAC9E,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC,EAChF,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,GAyB7E,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/core/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,cAAc;;;;mFAyCnB,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,gBAAgB,CAC9E,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC,EAChF,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,GAwB7E,CAAC"}

package/dist/src/components/core/button.js

@@ -3,7 +3,7 @@ import { cva } from "class-variance-authority";
 import { forwardRef } from "react";
 import { css } from "../../lib/dom";
 import { Polymorph } from "./polymorph";
-const buttonVariants = cva("relative overflow-hidden inline-flex duration-500 enabled:hover:bg-opacity-70 enabled:focus:bg-opacity-70 data-[loading=true]:opacity-30 data-[loading=true]:animate-pulse gap-1.5 items-center justify-center align-middle cursor-pointer whitespace-nowrap font-medium transition-colors ease-in disabled:cursor-not-allowed disabled:bg-opacity-40 disabled:text-opacity-80 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring ease-normal", {
+const buttonVariants = cva("relative overflow-hidden inline-flex duration-500 enabled:hover:bg-opacity-70 enabled:focus:bg-opacity-70 data-[loading=true]:opacity-30 data-[loading=true]:animate-pulse gap-1.5 items-center justify-center align-middle cursor-pointer whitespace-nowrap font-medium transition-colors ease-in disabled:cursor-not-allowed disabled:bg-opacity-40 disabled:text-opacity-80 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring", {
     variants: {
         size: {
             icon: "p-1",
@@ -20,15 +20,16 @@ const buttonVariants = cva("relative overflow-hidden inline-flex duration-500 en
         },
         theme: {
             raw: "",
+            disabled: "bg-disabled opacity-70",
+            loading: "animate-pulse bg-disabled",
             main: "bg-primary text-primary-foreground",
-            disabled: "bg-disabled duration-700 opacity-70",
             info: "bg-button-info-bg text-button-info-text",
             warn: "bg-button-warn-bg text-button-warn-text",
+            muted: "bg-button-muted-bg text-button-muted-text",
             danger: "bg-button-danger-bg text-button-danger-text",
             neutral: "bg-transparent border-2 border-card-border",
             primary: "bg-button-primary-bg text-button-primary-text",
             success: "bg-button-success-bg text-button-success-text",
-            loading: "animate-pulse bg-disabled duration-700 opacity-70",
             secondary: "bg-button-secondary-bg text-button-secondary-text",
             "ghost-info": "bg-transparent hover:bg-info/20 border border-info text-info",
             "ghost-warn": "bg-transparent hover:bg-warn/20 border border-warn text-warn",

package/dist/src/components/core/polymorph.d.ts

@@ -1,10 +1,11 @@
-import React, { ComponentProps, ElementType, PropsWithChildren } from "react";
-import { Override } from "../../types";
-type Polymorphism<T extends ElementType> = PropsWithChildren<{
-    as?: T;
-}>;
-type Props<T extends ElementType = ElementType> = Polymorphism<T> & Omit<React.ComponentPropsWithRef<T>, keyof Polymorphism<T>>;
-export type PolymorphicProps<P extends {}, T extends ElementType = ElementType> = Override<Props<T>, P> & Polymorphism<T>;
-export declare const Polymorph: <T extends ElementType>(p: PolymorphicProps<ComponentProps<T>, T>) => React.ReactElement;
+import type React from "react";
+import { Any, Override } from "../../types";
+type TransformProps<E extends React.ElementType = React.ElementType> = {
+    as?: E;
+};
+export type PolymorphicProps<P extends Any, E extends React.ElementType> = Override<TransformProps<E> & Omit<React.ComponentProps<E>, keyof TransformProps>, P>;
+type InnerPolymorphicProps<E extends React.ElementType> = TransformProps<E> & Omit<React.ComponentProps<E>, keyof TransformProps>;
+declare const defaultElement = "span";
+export declare const Polymorph: <E extends React.ElementType = typeof defaultElement>(props: InnerPolymorphicProps<E>) => React.ReactElement | null;
 export {};
 //# sourceMappingURL=polymorph.d.ts.map

package/dist/src/components/core/polymorph.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"polymorph.d.ts","sourceRoot":"","sources":["../../../../src/components/core/polymorph.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAc,WAAW,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AACtG,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,KAAK,YAAY,CAAC,CAAC,SAAS,WAAW,IAAI,iBAAiB,CAAC;IACzD,EAAE,CAAC,EAAE,CAAC,CAAC;CACV,CAAC,CAAC;AAEH,KAAK,KAAK,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI,YAAY,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,MAAM,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC;AAEhI,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,CAAC;AAE1H,eAAO,MAAM,SAAS,EAAE,CAAC,CAAC,SAAS,WAAW,EAAE,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,YAS3F,CAAC"}
+{"version":3,"file":"polymorph.d.ts","sourceRoot":"","sources":["../../../../src/components/core/polymorph.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE5C,KAAK,cAAc,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI;IACnE,EAAE,CAAC,EAAE,CAAC,CAAC;CACV,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,GAAG,EAAE,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,QAAQ,CAC/E,cAAc,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,MAAM,cAAc,CAAC,EACvE,CAAC,CACJ,CAAC;AAEF,KAAK,qBAAqB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,cAAc,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAElI,QAAA,MAAM,cAAc,SAAS,CAAC;AAE9B,eAAO,MAAM,SAAS,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,OAAO,cAAc,EAAE,KAAK,EAAE,qBAAqB,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,YAAY,GAAG,IAI1H,CAAC"}

package/dist/src/components/core/polymorph.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
-export const Polymorph = forwardRef(function Polymorph({ as, children, ...props }, ref) {
-    const Component = as || "span";
-    return (_jsx(Component, { ref: ref, ...props, children: children }));
+const defaultElement = "span";
+export const Polymorph = forwardRef(function InnerPolymorph(props, ref) {
+    const Element = props.as || defaultElement;
+    return _jsx(Element, { ref: ref, ...props, as: undefined });
 });

package/dist/src/components/core/tag.d.ts

@@ -3,11 +3,11 @@ import React from "react";
 import { Label } from "../../types";
 import { PolymorphicProps } from "./polymorph";
 declare const indicatorVariant: (props?: ({
-    theme?: "main" | "info" | "warn" | "danger" | "success" | "secondary" | null | undefined;
+    theme?: "main" | "info" | "warn" | "muted" | "danger" | "success" | "secondary" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 declare const tagVariants: (props?: ({
     size?: "big" | "small" | "default" | "icon" | null | undefined;
-    theme?: "disabled" | "loading" | "info" | "warn" | "danger" | "neutral" | "primary" | "success" | "secondary" | null | undefined;
+    theme?: "disabled" | "loading" | "info" | "warn" | "muted" | "danger" | "neutral" | "primary" | "success" | "secondary" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export type TagProps<T extends React.ElementType = "span"> = PolymorphicProps<VariantProps<typeof tagVariants> & Partial<{
     icon: Label;

package/dist/src/components/core/tag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../../src/components/core/tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,gBAAgB;;mFAWpB,CAAC;AAEH,QAAA,MAAM,WAAW;;;mFAqBf,CAAC;AAEH,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,YAAY,CAAC,OAAO,WAAW,CAAC,GAC5B,OAAO,CAAC;IACJ,IAAI,EAAE,KAAK,CAAC;IACZ,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC,OAAO,CAAC,CAAC;CAC7D,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,GAkBrE,CAAC"}
+{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../../src/components/core/tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,gBAAgB;;mFAYpB,CAAC;AAEH,QAAA,MAAM,WAAW;;;mFAsBf,CAAC;AAEH,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,YAAY,CAAC,OAAO,WAAW,CAAC,GAC5B,OAAO,CAAC;IACJ,IAAI,EAAE,KAAK,CAAC;IACZ,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC,OAAO,CAAC,CAAC;CAC7D,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,GAkBrE,CAAC"}

package/dist/src/components/core/tag.js

@@ -6,8 +6,9 @@ import { Polymorph } from "./polymorph";
 const indicatorVariant = cva("size-2.5 aspect-square rounded-full border-0", {
     variants: {
         theme: {
-            warn: "bg-warn",
             info: "bg-info",
+            warn: "bg-warn",
+            muted: "bg-muted",
             main: "bg-primary",
             danger: "bg-danger",
             success: "bg-success",
@@ -30,6 +31,7 @@ const tagVariants = cva("inline-flex rounded-pill gap-1.5 border-2 border-transp
             success: "bg-tag-success-bg text-tag-success-text",
             secondary: "bg-tag-secondary-bg text-tag-secondary-text",
             warn: "bg-tag-warn-bg text-tag-warn-text",
+            muted: "bg-tag-muted-bg text-tag-muted-text",
             neutral: "bg-transparent border border-card-border",
             disabled: "bg-disabled duration-700 opacity-70",
             loading: "animate-pulse bg-disabled duration-700 opacity-70",

package/dist/src/components/display/calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../src/components/display/calendar.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAqB,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAqBvD,KAAK,KAAK,GAAG;IAAE,IAAI,CAAC,EAAE,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,IAAI,CAAA;CAAE,CAAC;AAExC,KAAK,YAAY,GAAG,CAAC,CAAC,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;AAElD,KAAK,aAAa,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;AAEpD,KAAK,cAAc,GAAG,OAAO,CAAC;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;AAEH,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,IAAI,OAAO,CACrF;IACE,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,cAAc,CAAC;IACvB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,YAAY,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,UAAU,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;CAC1C,GAAG,CAAC,CAAC,SAAS,MAAM,GACjB;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GACtC,CAAC,SAAS,OAAO,GACjB;IACA,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,aAAa,CAAC;CACzB,GACC,EAAE,CAAC,GACP,CAAC;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,QAAQ,EAAE,aAAa,CAAA;CAAE,CAAC,CACrF,CAAC;AA0HF,eAAO,MAAM,QAAQ,mKAclB,aAAa,4CA+Of,CAAC"}
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../src/components/display/calendar.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAqB,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAqBvD,KAAK,KAAK,GAAG;IAAE,IAAI,CAAC,EAAE,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,IAAI,CAAA;CAAE,CAAC;AAExC,KAAK,YAAY,GAAG,CAAC,CAAC,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;AAElD,KAAK,aAAa,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;AAEpD,KAAK,cAAc,GAAG,OAAO,CAAC;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;AAEH,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,IAAI,OAAO,CACrF;IACE,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,cAAc,CAAC;IACvB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,YAAY,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,UAAU,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;CAC1C,GAAG,CAAC,CAAC,SAAS,MAAM,GACjB;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GACtC,CAAC,SAAS,OAAO,GACjB;IACA,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,aAAa,CAAC;CACzB,GACC,EAAE,CAAC,GACP,CAAC;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,EAAE,YAAY,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,QAAQ,EAAE,aAAa,CAAA;CAAE,CAAC,CACrF,CAAC;AA0HF,eAAO,MAAM,QAAQ,mKAclB,aAAa,4CAiPf,CAAC"}

package/dist/src/components/display/calendar.js

@@ -209,5 +209,5 @@ export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, labelRange, d
         onChangeYear?.(new Date(value));
         defer(value);
     };
-    return (_jsx(MotionConfig, { transition: transition, children: _jsxs("div", { "data-component": "calendar", ref: root, className: css("relative overflow-hidden", styles?.calendar), children: [_jsx("div", { className: "flex flex-col justify-center rounded text-center", children: _jsx(AnimatePresence, { initial: false, mode: "popLayout", custom: state.direction, onExitComplete: dispatch.onExitComplete, children: _jsxs(motion.div, { initial: "enter", animate: "middle", exit: "exit", children: [_jsxs("header", { className: "relative flex justify-between", children: [_jsx(motion.button, { type: "button", layout: true, "data-focustrap": "prev", variants: removeImmediately, onClick: dispatch.previousMonth, className: "z-calendar rounded-full p-1.5 hover:bg-primary", children: _jsx(ChevronLeftIcon, { className: "h-4 w-4" }) }), _jsx(motion.span, { layout: true, variants: variants, custom: state.direction, className: "absolute inset-0 isolate z-normal flex items-center justify-center font-semibold", children: _jsxs("span", { className: "flex w-fit items-center justify-center gap-0.5 py-1", children: [_jsx("select", { value: monthString, onChange: dispatch.onChangeMonth, style: { width: `${monthString.length + 1}ch` }, className: "cursor-pointer appearance-none bg-transparent capitalize proportional-nums hover:text-primary", children: state.months }), _jsx(TheMaskInput, { mask: "int", maxLength: 4, placeholder: "YYYY", value: state.year, onChange: internalOnChangeYear, style: { width: `${state.year.length}ch` }, className: "w-16 cursor-pointer appearance-none bg-transparent hover:text-primary" })] }) }), _jsx(motion.button, { layout: true, type: "button", "data-focustrap": "next", variants: removeImmediately, onClick: dispatch.nextMonth, className: "z-calendar rounded-full p-1.5 hover:bg-primary", children: _jsx(ChevronRightIcon, { className: "h-4 w-4" }) }), _jsx("div", { className: "absolute inset-0", style: { backgroundImage: "linear-gradient(to right, hsla(var(--card-background)) 15%, transparent 30%, transparent 70%, hsla(var(--card-background)) 85%)" } })] }), _jsxs(motion.table, { className: "mt-2 table min-w-full table-auto border-0", children: [_jsx("thead", { children: _jsx("tr", { children: state.week.map((dayOfWeek) => (_jsx("th", { className: css("py-2 text-sm font-medium capitalize", styles?.weekDay), children: dayOfWeek.toLocaleDateString(currentLocale, { weekday: "short" }) }, dayOfWeek.toString()))) }) }), _jsx(CalendarBody, { zip: zip, range: range, styles: styles, date: date || null, dispatch: dispatch, markRange: markRange, markToday: markToday, rangeMode: rangeMode, stateDate: state.date, labelRange: labelRange, stateRange: state.range, RenderOnDay: RenderOnDay, direction: state.direction, disabledDate: disabledDate, onKeyDown: dispatch.onKeyDown })] })] }, monthString) }) }), _jsx("footer", { className: "mt-2 text-center text-primary", children: _jsx("button", { className: "transition-transform duration-300 hover:scale-105", type: "button", onClick: dispatch.setToday, children: translations.calendarToday }) })] }) }));
+    return (_jsx(MotionConfig, { transition: transition, children: _jsxs("div", { "data-component": "calendar", ref: root, className: css("relative overflow-hidden", styles?.calendar), children: [_jsx("div", { className: "flex flex-col justify-center rounded text-center", children: _jsx(AnimatePresence, { initial: false, mode: "popLayout", custom: state.direction, onExitComplete: dispatch.onExitComplete, children: _jsxs(motion.div, { initial: "enter", animate: "middle", exit: "exit", children: [_jsxs("header", { className: "relative flex justify-between", children: [_jsx(motion.button, { layout: true, type: "button", "data-focustrap": "prev", variants: removeImmediately, onClick: dispatch.previousMonth, title: translations.calendarBackMonth, className: "z-calendar rounded-full p-1.5 hover:bg-primary hover:text-primary-foreground", children: _jsx(ChevronLeftIcon, { className: "h-4 w-4" }) }), _jsx(motion.span, { layout: true, variants: variants, custom: state.direction, className: "absolute inset-0 isolate z-normal flex items-center justify-center font-semibold", children: _jsxs("span", { className: "flex w-fit items-center justify-center gap-0.5 py-1", children: [_jsx("select", { value: monthString, onChange: dispatch.onChangeMonth, style: { width: `${monthString.length + 1}ch` }, className: "cursor-pointer appearance-none bg-transparent capitalize proportional-nums hover:text-primary", children: state.months }), _jsx(TheMaskInput, { mask: "int", maxLength: 4, placeholder: "YYYY", value: state.year, onChange: internalOnChangeYear, style: { width: `${state.year.length}ch` }, className: "w-16 cursor-pointer appearance-none bg-transparent hover:text-primary" })] }) }), _jsx(motion.button, { layout: true, type: "button", "data-focustrap": "next", variants: removeImmediately, onClick: dispatch.nextMonth, title: translations.calendarNextMonth, className: "z-calendar rounded-full p-1.5 hover:bg-primary hover:text-primary-foreground", children: _jsx(ChevronRightIcon, { className: "h-4 w-4" }) }), _jsx("div", { className: "absolute inset-0", style: { backgroundImage: "linear-gradient(to right, hsla(var(--card-background)) 15%, transparent 30%, transparent 70%, hsla(var(--card-background)) 85%)" } })] }), _jsxs(motion.table, { className: "mt-2 table min-w-full table-auto border-0", children: [_jsx("thead", { children: _jsx("tr", { children: state.week.map((dayOfWeek) => (_jsx("th", { className: css("py-2 text-sm font-medium capitalize", styles?.weekDay), children: dayOfWeek.toLocaleDateString(currentLocale, { weekday: "short" }) }, dayOfWeek.toString()))) }) }), _jsx(CalendarBody, { zip: zip, range: range, styles: styles, date: date || null, dispatch: dispatch, markRange: markRange, markToday: markToday, rangeMode: rangeMode, stateDate: state.date, labelRange: labelRange, stateRange: state.range, RenderOnDay: RenderOnDay, direction: state.direction, disabledDate: disabledDate, onKeyDown: dispatch.onKeyDown })] })] }, monthString) }) }), _jsx("footer", { className: "mt-2 text-center text-primary", children: _jsx("button", { className: "transition-transform duration-300 hover:scale-105", type: "button", onClick: dispatch.setToday, children: translations.calendarToday }) })] }) }));
 };

package/dist/src/components/display/step.d.ts

@@ -1,6 +1,6 @@
-import { PropsWithChildren } from "react";
+import React, { PropsWithChildren } from "react";
 type StepStatus = "active" | "inactive" | "complete" | "error";
-export type StepProps = {
+export type StepProps = React.ComponentProps<"button"> & {
     step: number;
     currentStep: number;
     status?: StepStatus;

package/dist/src/components/display/step.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"step.d.ts","sourceRoot":"","sources":["../../../../src/components/display/step.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAkB,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAmCrE,KAAK,UAAU,GAAG,QAAQ,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC;AAE/D,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,UAAU,CAAA;CAAE,CAAC;AAkBnF,eAAO,MAAM,cAAc,UAAW,iBAAiB,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,CAAC,4CA2B9F,CAAC;AAEF,eAAO,MAAM,IAAI,UAAW,SAAS,4CAkDpC,CAAC"}
+{"version":3,"file":"step.d.ts","sourceRoot":"","sources":["../../../../src/components/display/step.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAkB,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAmC5E,KAAK,UAAU,GAAG,QAAQ,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC;AAE/D,MAAM,MAAM,SAAS,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,UAAU,CAAA;CAAE,CAAC;AAkBpH,eAAO,MAAM,cAAc,UAAW,iBAAiB,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,CAAC,4CA6B9F,CAAC;AAEF,eAAO,MAAM,IAAI,UAAW,SAAS,4CAkDpC,CAAC"}

package/dist/src/components/display/step.js

@@ -5,16 +5,16 @@ import { useEffect } from "react";
 import { useColorParser } from "../../hooks/use-components-provider";
 const iconTransitions = {
     delay: 0.2,
+    duration: 0.3,
     type: "tween",
     ease: "easeOut",
-    duration: 0.3,
 };
 const states = {
     initial: { pathLength: 0, opacity: 0 },
     animate: { pathLength: 1, opacity: 1 },
 };
 const ErrorIcon = (props) => (_jsxs("svg", { ...props, viewBox: "0 0 24 24", fill: "currentColor", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx(motion.path, { className: "currentColor", initial: states.initial, animate: states.animate, transition: iconTransitions, d: "M18 6 6 18" }), _jsx(motion.path, { className: "currentColor", initial: states.initial, animate: states.animate, transition: iconTransitions, d: "m6 6 12 12" })] }));
-const CheckIcon = (props) => (_jsx("svg", { ...props, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 3, children: _jsx(motion.path, { initial: states.initial, animate: states.animate, transition: iconTransitions, strokeLinecap: "round", strokeLinejoin: "round", d: "M5 13l4 4L19 7" }) }));
+const CheckIcon = (props) => (_jsx("svg", { ...props, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 3, children: _jsx(motion.path, { d: "M5 13l4 4L19 7", strokeLinecap: "round", strokeLinejoin: "round", animate: states.animate, initial: states.initial, transition: iconTransitions }) }));
 const variants = { complete: { scale: 1.25 }, active: { scale: 1, transition: { delay: 0, duration: 0.2 } } };
 const transitions = {
     duration: 0.6,
@@ -37,8 +37,8 @@ export const StepsContainer = (props) => {
         if (props.currentStep === 0)
             return;
         const container = ref.current;
-        const first = container.querySelectorAll(`div[data-step]`)[0];
-        const step = container.querySelector(`div[data-step="${props.currentStep}"]`);
+        const first = container.querySelectorAll('[data-step]')[0];
+        const step = container.querySelector(`[data-step="${props.currentStep}"]`);
         if (first && step) {
             const diff = step.getBoundingClientRect().left - first.getBoundingClientRect().left;
             animate("div[data-name='progress']", { width: `${Math.max(0, diff)}px` }, {
@@ -48,12 +48,12 @@ export const StepsContainer = (props) => {
             });
         }
     }, [props.currentStep]);
-    return (_jsxs("div", { className: "relative flex justify-between", ref: ref, children: [_jsx("div", { className: "absolute top-1/2 h-1 w-[calc(100%)] bg-card-border" }), _jsx("div", { "data-name": "progress", className: "absolute top-1/2 h-1 w-0 bg-success" }), props.children] }));
+    return (_jsxs("div", { className: "relative flex justify-between", ref: ref, children: [_jsx("div", { className: "absolute top-1/2 h-1 w-[calc(100%)] bg-card-border" }), _jsx("div", { "data-name": "progress", className: "absolute top-1/2 h-1 w-0 bg-success transition-all duration-300 ease-out" }), props.children] }));
 };
 export const Step = (props) => {
     const parser = useColorParser();
     const status = getCurrentStatus(props);
-    return (_jsxs(motion.div, { "data-step": props.step, animate: status, className: "relative", children: [_jsx(motion.div, { variants: variants, transition: transitions, className: `absolute inset-0 rounded-full ${props.status === "error" ? "bg-danger" : ""}` }), _jsx(motion.div, { initial: false, variants: {
+    return (_jsxs(motion.button, { ...props, type: "button", "data-step": props.step, animate: status, className: "relative block w-auto", children: [_jsx(motion.div, { variants: variants, transition: transitions, className: `absolute inset-0 rounded-full ${props.status === "error" ? "bg-danger" : ""}` }), _jsx(motion.div, { initial: false, variants: {
                     error: {
                         backgroundColor: parser("var(--danger-DEFAULT)"),
                         borderColor: parser("var(--danger-hover)"),
@@ -72,7 +72,7 @@ export const Step = (props) => {
                     complete: {
                         backgroundColor: parser("var(--success-DEFAULT)"),
                         borderColor: parser("var(--success-DEFAULT)"),
-                        color: parser("var(--success-DEFAULT)"),
+                        color: parser("var(--success-foreground)"),
                     },
                 }, transition: { duration: 0.2 }, className: "relative flex h-10 w-10 items-center justify-center rounded-full font-semibold", children: _jsx("div", { className: "flex items-center justify-center", children: status === "complete" ? (_jsx(CheckIcon, { className: "h-6 w-6 text-primary-foreground" })) : status === "error" ? (_jsx(ErrorIcon, { className: "h-6 w-6 text-danger-foreground" })) : (_jsx("span", { children: props.step })) }) })] }));
 };

package/dist/src/components/display/tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/display/tabs.tsx"],"names":[],"mappings":"AAEA,OAAc,EAA2B,iBAAiB,EAAkD,MAAM,OAAO,CAAC;AAG1H,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGpC,MAAM,MAAM,SAAS,GAAG;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAIF,eAAO,MAAM,IAAI,UAAW,iBAAiB,CAAC,SAAS,CAAC,4CA2FvD,CAAC;AAIF,MAAM,MAAM,QAAQ,GACd;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,GAChD;IACI,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAER,eAAO,MAAM,GAAG,UAAW,iBAAiB,CAAC,QAAQ,CAAC,4CAGrD,CAAC"}
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/display/tabs.tsx"],"names":[],"mappings":"AAEA,OAAc,EAA2B,iBAAiB,EAAiC,MAAM,OAAO,CAAC;AAGzG,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGpC,MAAM,MAAM,SAAS,GAAG;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAIF,eAAO,MAAM,IAAI,UAAW,iBAAiB,CAAC,SAAS,CAAC,4CA2FvD,CAAC;AAIF,MAAM,MAAM,QAAQ,GACd;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,GAChD;IACI,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAER,eAAO,MAAM,GAAG,UAAW,iBAAiB,CAAC,QAAQ,CAAC,4CAGrD,CAAC"}

package/dist/src/components/display/tabs.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useMotionValue } from "motion/react";
-import React, { createContext, Fragment, useContext, useEffect, useLayoutEffect, useRef } from "react";
+import React, { createContext, Fragment, useContext, useEffect, useRef } from "react";
 import { useReactive } from "../../hooks/use-reactive";
 import { useStableRef } from "../../hooks/use-stable-ref";
 import { Card } from "./card";
@@ -12,7 +12,7 @@ export const Tabs = (props) => {
     const width = useMotionValue(0);
     const ref = useRef(null);
     const Render = props.useHash ? "a" : "button";
-    useLayoutEffect(() => {
+    useEffect(() => {
         const header = ref.current;
         if (header === null)
             return;
@@ -57,7 +57,7 @@ export const Tabs = (props) => {
     };
     return (_jsx(Context.Provider, { value: active, children: _jsx(Card, { className: props.className, container: "pt-0 max-w-full w-full min-w-0", header: _jsx("header", { ref: ref, className: "relative mb-2 overflow-x-auto border-b border-card-border", children: _jsx("nav", { className: "min-w-0", children: _jsx("ul", { className: "flex w-0 min-w-full flex-1 justify-start overflow-x-auto", children: items.map((x) => {
                             const inner = x.props;
-                            return (_jsx("li", { "data-id": inner.id, "data-active": active === inner.id, className: "w-full border-b-2 border-card-border data-[active=true]:border-primary data-[active=true]:font-bold data-[active=true]:text-primary", children: _jsx(Render, { "data-id": inner.id, onClick: onClick, "aria-current": "page", href: props.useHash ? `#${inner.id}` : undefined, className: "block w-full whitespace-nowrap px-10 py-4", children: inner.title }) }, `tab-header-${inner.id}`));
+                            return (_jsx("li", { "data-id": inner.id, "data-active": active === inner.id, className: "w-full border-b-2 transition-all border-card-border data-[active=true]:border-primary data-[active=true]:text-primary", children: _jsx(Render, { "data-id": inner.id, onClick: onClick, "aria-current": "page", href: props.useHash ? `#${inner.id}` : undefined, className: "block w-full whitespace-nowrap px-10 py-4", children: inner.title }) }, `tab-header-${inner.id}`));
                         }) }) }) }), children: props.children }) }));
 };
 const useTabs = () => useContext(Context);

package/dist/src/components/floating/menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../../src/components/floating/menu.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAAoB,WAAW,EAAE,MAAM,cAAc,CAAC;AAC7D,OAAO,KAA2E,MAAM,OAAO,CAAC;AAGhG,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AA0BvC,MAAM,MAAM,SAAS,GAAG,OAAO,CAC3B;IACI,iBAAiB,EAAE,KAAK,CAAC,WAAW,CAAC;IACrC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,GAAG,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CACzE,CAAC;AAiKF,KAAK,aAAa,GACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,GACpE;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAEtG,eAAO,MAAM,QAAQ,kJAkCpB,CAAC;AAEF,eAAO,MAAM,IAAI;uBAjNU,KAAK,CAAC,WAAW;uBACjB,MAAM;WAClB,OAAO;YACN,OAAO;cACL,OAAO;aACR,OAAO;cACN,KAAK,CAAC,SAAS;;WACf,MAAM;;uBAPG,KAAK,CAAC,WAAW;uBACjB,MAAM;WAClB,OAAO;YACN,OAAO;cACL,OAAO;aACR,OAAO;cACN,KAAK,CAAC,SAAS;;WACK,KAAK,CAAC,YAAY;WAAS,MAAM;qDAmNrE,CAAC"}
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../../src/components/floating/menu.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAAoB,WAAW,EAAE,MAAM,cAAc,CAAC;AAC7D,OAAO,KAA2E,MAAM,OAAO,CAAC;AAGhG,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AA0BvC,MAAM,MAAM,SAAS,GAAG,OAAO,CAC7B;IACE,iBAAiB,EAAE,KAAK,CAAC,WAAW,CAAC;IACrC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,GAAG,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CACvE,CAAC;AA8KF,KAAK,aAAa,GACd;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,GACpE;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAEpG,eAAO,MAAM,QAAQ,kJAkCpB,CAAC;AAEF,eAAO,MAAM,IAAI;uBA9NM,KAAK,CAAC,WAAW;uBACjB,MAAM;WAClB,OAAO;YACN,OAAO;cACL,OAAO;aACR,OAAO;cACN,KAAK,CAAC,SAAS;;WACb,MAAM;;uBAPC,KAAK,CAAC,WAAW;uBACjB,MAAM;WAClB,OAAO;YACN,OAAO;cACL,OAAO;aACR,OAAO;cACN,KAAK,CAAC,SAAS;;WACO,KAAK,CAAC,YAAY;WAAS,MAAM;qDAgOnE,CAAC"}

package/dist/src/components/floating/menu.js

@@ -8,24 +8,24 @@ import { FLOATING_DELAY, TYPEAHEAD_RESET_DELAY } from "../../constants";
 import { css } from "../../lib/dom";
 const menuItemClassName = (highlight = "") => css("w-full min-w-36 outline-none p-2.5 items-center flex justify-between text-left", "hover:bg-primary focus:bg-primary aria-expanded:opacity-80", "focus:text-primary-foreground hover:text-primary-foreground", "first-of-type:rounded-t-lg last-of-type:rounded-b-lg", "disabled:opacity-40 disabled:cursor-not-allowed", highlight);
 const MenuContext = createContext({
+    isOpen: false,
     activeIndex: null,
     getItemProps: () => ({}),
-    isOpen: false,
     setActiveIndex: () => { },
     setHasFocusInside: () => { },
 });
 const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", hover = true, isParent, floatingClassName = "", label, ...props }, forwardedRef) => {
-    const parentId = useFloatingParentNodeId();
-    const isNested = parentId !== null;
     const [isOpen, setIsOpen] = useState(false);
     const [hasFocusInside, setHasFocusInside] = useState(false);
     const [activeIndex, setActiveIndex] = useState(null);
     const elementsRef = useRef([]);
     const labelsRef = useRef([]);
     const parent = useContext(MenuContext);
+    const parentId = useFloatingParentNodeId();
     const tree = useFloatingTree();
     const nodeId = useFloatingNodeId();
     const item = useListItem();
+    const isNested = parentId !== null;
     const { floatingStyles, refs, context } = useFloating({
         nodeId,
         open: isOpen,
@@ -39,9 +39,10 @@ const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", h
     const role = useRole(context, { role: "menu", enabled: true });
     const dismiss = useDismiss(context, { bubbles: true });
     const hoverModule = useHover(context, {
+        move: false,
         enabled: hover,
         delay: { open: FLOATING_DELAY },
-        handleClose: safePolygon({ blockPointerEvents: true, buffer: 1 }),
+        handleClose: safePolygon({ blockPointerEvents: true }),
     });
     const click = useClick(context, {
         event: "mousedown",
@@ -51,13 +52,10 @@ const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", h
     });
     const listNavigation = useListNavigation(context, {
         loop: true,
+        listRef: elementsRef,
         activeIndex,
-        virtual: true,
         nested: isNested,
-        allowEscape: true,
-        listRef: elementsRef,
-        scrollItemIntoView: true,
-        onNavigate: setActiveIndex,
+        onNavigate: setActiveIndex
     });
     const typeahead = useTypeahead(context, {
         activeIndex,
@@ -65,16 +63,20 @@ const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", h
         resetMs: TYPEAHEAD_RESET_DELAY,
         onMatch: isOpen ? setActiveIndex : undefined,
     });
-    const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions([hoverModule, click, role, dismiss, listNavigation, typeahead]);
+    const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions([
+        hoverModule, click, role, dismiss, listNavigation, typeahead
+    ]);
     useEffect(() => {
         if (!tree)
             return;
-        const handleTreeClick = () => setIsOpen(false);
-        const onSubMenuOpen = (event) => {
+        function handleTreeClick() {
+            setIsOpen(false);
+        }
+        function onSubMenuOpen(event) {
             if (event.nodeId !== nodeId && event.parentId === parentId) {
                 setIsOpen(false);
             }
-        };
+        }
         tree.events.on("click", handleTreeClick);
         tree.events.on("menuopen", onSubMenuOpen);
         return () => {
@@ -83,8 +85,9 @@ const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", h
         };
     }, [tree, nodeId, parentId]);
     useEffect(() => {
-        if (isOpen && tree)
+        if (isOpen && tree) {
             tree.events.emit("menuopen", { parentId, nodeId });
+        }
     }, [tree, isOpen, nodeId, parentId]);
     const className = isParent ? props.className : css(menuItemClassName(props.className));
     return (_jsxs(FloatingNode, { id: nodeId, children: [_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, { children: label, ref: useMergeRefs([refs.setReference, item.ref, forwardedRef]), tabIndex: !isNested ? undefined : parent.activeIndex === item.index ? 0 : -1, "data-open": isOpen ? "" : undefined, "data-nested": isNested ? "" : undefined, role: isNested ? "menuitem" : undefined, "data-focus-inside": hasFocusInside ? "" : undefined, className: className, ...getReferenceProps(parent.getItemProps({
@@ -94,7 +97,7 @@ const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", h
                             setHasFocusInside(false);
                             parent.setHasFocusInside(true);
                         },
-                    })) })) : (_jsxs("button", { type: "button", ref: useMergeRefs([refs.setReference, item.ref, forwardedRef]), tabIndex: !isNested ? undefined : parent.activeIndex === item.index ? 0 : -1, "data-open": isOpen ? "" : undefined, "data-nested": isNested ? "" : undefined, role: isNested ? "menuitem" : undefined, "data-focus-inside": hasFocusInside ? "" : undefined, className: className, ...getReferenceProps(parent.getItemProps({
+                    })) })) : (_jsxs("button", { type: "button", className: className, "data-open": isOpen ? "" : undefined, "data-nested": isNested ? "" : undefined, role: isNested ? "menuitem" : undefined, "data-focus-inside": hasFocusInside ? "" : undefined, ref: useMergeRefs([refs.setReference, item.ref, forwardedRef]), tabIndex: !isNested ? undefined : parent.activeIndex === item.index ? 0 : -1, ...getReferenceProps(parent.getItemProps({
                         ...props,
                         onFocus(event) {
                             props.onFocus?.(event);
@@ -108,7 +111,7 @@ export const MenuItem = React.forwardRef(({ label, title, Right, disabled, ...pr
     const item = useListItem({ label: disabled ? null : typeof label === "string" ? label : title });
     const tree = useFloatingTree();
     const isActive = item.index === menu.activeIndex;
-    return (_jsxs("button", { ...props, ref: useMergeRefs([item.ref, forwardedRef]), "data-active": isActive, "data-open": menu.isOpen, type: "button", role: "menuitem", disabled: disabled, tabIndex: isActive ? 0 : -1, className: menuItemClassName(props.className), ...menu.getItemProps({
+    return (_jsxs("button", { ...props, type: "button", role: "menuitem", disabled: disabled, "data-active": isActive, "data-open": menu.isOpen, tabIndex: isActive ? 0 : -1, ref: useMergeRefs([item.ref, forwardedRef]), className: menuItemClassName(`${props.className ?? ""} ${isActive ? "bg-primary text-primary-foreground" : ""}`), ...menu.getItemProps({
             onClick(event) {
                 props.onClick?.(event);
                 tree?.events.emit("click");

package/dist/src/components/floating/modal.d.ts

@@ -1,19 +1,22 @@
+import { HTMLMotionProps } from "motion/react";
 import React, { PropsWithChildren } from "react";
-import { Label } from "../../types";
-export type ModalProps = {
-    layoutId?: string;
-    title?: Label;
+import { Label, Override } from "../../types";
+export type ModalProps = Override<HTMLMotionProps<"div">, {
     open: boolean;
+    title?: Label;
     footer?: Label;
-    resizer?: boolean;
     asChild?: boolean;
+    layoutId?: string;
+    resizer?: boolean;
+    className?: string;
     closable?: boolean;
+    forceType?: boolean;
+    overlayClassName?: string;
     overlayClickClose?: boolean;
     position?: "left" | "right";
     trigger?: Label | React.FC<any>;
-    forceType?: boolean;
     type?: "dialog" | "drawer" | "sheet";
     onChange: (nextState: boolean) => void;
-};
-export declare const Modal: ({ type: _type, resizer, overlayClickClose, forceType, closable, ...props }: PropsWithChildren<ModalProps>) => import("react/jsx-runtime").JSX.Element;
+}>;
+export declare const Modal: ({ open, title, footer, asChild, trigger, children, layoutId, onChange, className, resizer, closable, forceType, overlayClassName, type: _type, position: propsPosition, overlayClickClose, ...props }: PropsWithChildren<ModalProps>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=modal.d.ts.map