@g4rcez/components 0.2.5 → 0.3.0

package/dist/preset/preset.tailwind.d.ts

@@ -2,6 +2,6 @@ import { Config } from "tailwindcss";
 import { createDesignTokens, parsers } from "./src/styles/design-tokens";
 import { defaultLightTheme as theme } from "./src/styles/theme";
 declare const config: Partial<Config>;
-export { createDesignTokens, parsers, theme };
+export { createDesignTokens, parsers, theme, config };
 export default config;
 //# sourceMappingURL=preset.tailwind.d.ts.map

package/dist/preset/preset.tailwind.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"preset.tailwind.d.ts","sourceRoot":"","sources":["../../preset.tailwind.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,iBAAiB,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAMhE,QAAA,MAAM,MAAM,EAAE,OAAO,CAAC,MAAM,CA2C3B,CAAC;AAEF,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;AAE9C,eAAe,MAAM,CAAC"}
+{"version":3,"file":"preset.tailwind.d.ts","sourceRoot":"","sources":["../../preset.tailwind.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,iBAAiB,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAMhE,QAAA,MAAM,MAAM,EAAE,OAAO,CAAC,MAAM,CA2C3B,CAAC;AAEF,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;AAEtD,eAAe,MAAM,CAAC"}

package/dist/preset/preset.tailwind.js

@@ -60,5 +60,5 @@ var config = {
         }),
     ],
 };
-export { createDesignTokens, parsers, theme };
+export { createDesignTokens, parsers, theme, config };
 export default config;

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

@@ -10,7 +10,7 @@ export var DARK_THEME = {
     colors: {
         foreground: "hsla(210, 50%, 98%)",
         background: "hsla(0, 0%, 9%)",
-        muted: "hsla(0, 0%, 12%)",
+        muted: "hsla(210, 10%, 40%)",
         disabled: "hsla(240, 4%, 33%)",
         emphasis: {
             foreground: "hsla(251, 91%, 95%)",

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

@@ -26,7 +26,7 @@ export var LIGHT_THEME = {
         },
         secondary: {
             background: "hsla(210, 25%, 35%)",
-            DEFAULT: "hsla(210, 25%, 35%)",
+            DEFAULT: "hsla(210, 25%, 45%)",
             subtle: "hsla(207, 29%, 39%)",
             hover: "hsla(210, 21%, 67%)",
             foreground: "hsla(210, 40%, 98%)",

package/dist/preset.tailwind.d.ts

@@ -2,6 +2,6 @@ import { Config } from "tailwindcss";
 import { createDesignTokens, parsers } from "./src/styles/design-tokens";
 import { defaultLightTheme as theme } from "./src/styles/theme";
 declare const config: Partial<Config>;
-export { createDesignTokens, parsers, theme };
+export { createDesignTokens, parsers, theme, config };
 export default config;
 //# sourceMappingURL=preset.tailwind.d.ts.map

package/dist/preset.tailwind.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"preset.tailwind.d.ts","sourceRoot":"","sources":["../preset.tailwind.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,iBAAiB,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAMhE,QAAA,MAAM,MAAM,EAAE,OAAO,CAAC,MAAM,CA2C3B,CAAC;AAEF,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;AAE9C,eAAe,MAAM,CAAC"}
+{"version":3,"file":"preset.tailwind.d.ts","sourceRoot":"","sources":["../preset.tailwind.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,iBAAiB,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAMhE,QAAA,MAAM,MAAM,EAAE,OAAO,CAAC,MAAM,CA2C3B,CAAC;AAEF,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;AAEtD,eAAe,MAAM,CAAC"}

package/dist/preset.tailwind.js

@@ -48,5 +48,5 @@ const config = {
         }),
     ],
 };
-export { createDesignTokens, parsers, theme };
+export { createDesignTokens, parsers, theme, config };
 export default config;

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

@@ -1,16 +1,46 @@
-import { type VariantProps } from "class-variance-authority";
-import React from "react";
-import { type Label } from "../../types";
+import React, { PropsWithChildren } from "react";
+import { CvaVariants, type Label } from "../../types";
 import { PolymorphicProps } from "./polymorph";
-declare const buttonVariants: (props?: ({
-    size?: "big" | "small" | "default" | "icon" | "min" | null | undefined;
-    rounded?: "circle" | "default" | "rough" | "squared" | 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<{
+declare const variants: {
+    size: {
+        icon: string;
+        big: string;
+        default: string;
+        min: string;
+        small: string;
+    };
+    rounded: {
+        rough: string;
+        squared: string;
+        default: string;
+        circle: string;
+    };
+    theme: {
+        raw: string;
+        disabled: string;
+        loading: string;
+        main: string;
+        info: string;
+        warn: string;
+        muted: string;
+        danger: string;
+        neutral: string;
+        primary: string;
+        success: string;
+        secondary: string;
+        "ghost-info": string;
+        "ghost-warn": string;
+        "ghost-danger": string;
+        "ghost-primary": string;
+        "ghost-success": string;
+        "ghost-secondary": string;
+    };
+};
+type Variants = CvaVariants<typeof variants>;
+export type ButtonProps<T extends React.ElementType = "button"> = PropsWithChildren<PolymorphicProps<Variants & Partial<{
     icon: Label;
     loading: boolean;
-}>, T>;
-export declare const Button: <T extends React.ElementType = "button">(props: ButtonProps<T>) => any;
+}>, T>>;
+export declare const Button: <T extends React.ElementType = "button">(props: ButtonProps<T>) => React.ReactNode;
 export {};
 //# sourceMappingURL=button.d.ts.map

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;;;;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"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/core/button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,WAAW,EAAE,KAAK,KAAK,EAAE,MAAM,aAAa,CAAC;AACtD,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCb,CAAC;AAUF,KAAK,QAAQ,GAAG,WAAW,CAAC,OAAO,QAAQ,CAAC,CAAC;AAE7C,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,iBAAiB,CAC/E,gBAAgB,CAAC,QAAQ,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC,EAAE,CAAC,CAAC,CAC7E,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAwB5F,CAAC"}

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

@@ -3,42 +3,43 @@ 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", {
-    variants: {
-        size: {
-            icon: "p-1",
-            big: "h-12 px-6 py-4",
-            default: "h-10 px-4 py-2",
-            min: "h-7 px-3 py-1 text-sm",
-            small: "h-8 px-4 py-2 text-sm",
-        },
-        rounded: {
-            rough: "rounded-sm",
-            squared: "rounded-none",
-            default: "rounded-button",
-            circle: "rounded-full aspect-square",
-        },
-        theme: {
-            raw: "",
-            disabled: "bg-disabled opacity-70",
-            loading: "animate-pulse bg-disabled",
-            main: "bg-primary text-primary-foreground",
-            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",
-            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",
-            "ghost-danger": "bg-transparent hover:bg-danger/20 border border-danger text-danger",
-            "ghost-primary": "bg-transparent hover:bg-primary/20 border border-primary text-primary",
-            "ghost-success": "bg-transparent hover:bg-success/20 border border-success text-success",
-            "ghost-secondary": "bg-transparent hover:bg-secondary/20 border border-secondary text-secondary",
-        },
+const variants = {
+    size: {
+        icon: "p-1",
+        big: "h-12 px-6 py-4",
+        default: "h-10 px-4 py-2",
+        min: "h-7 px-3 py-1 text-sm",
+        small: "h-8 px-4 py-2 text-sm",
+    },
+    rounded: {
+        rough: "rounded-sm",
+        squared: "rounded-none",
+        default: "rounded-button",
+        circle: "rounded-full aspect-square",
     },
+    theme: {
+        raw: "",
+        disabled: "bg-disabled opacity-70",
+        loading: "animate-pulse bg-disabled",
+        main: "bg-primary text-primary-foreground",
+        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",
+        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",
+        "ghost-danger": "bg-transparent hover:bg-danger/20 border border-danger text-danger",
+        "ghost-primary": "bg-transparent hover:bg-primary/20 border border-primary text-primary",
+        "ghost-success": "bg-transparent hover:bg-success/20 border border-success text-success",
+        "ghost-secondary": "bg-transparent hover:bg-secondary/20 border border-secondary text-secondary",
+    },
+};
+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,
     defaultVariants: { theme: "main", size: "default", rounded: "default" },
 });
 export const Button = forwardRef(function Button({ className, icon, loading, theme, type = "button", size, rounded, ...props }, ref) {

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

@@ -1,11 +1,9 @@
 import type React from "react";
-import { Any, Override } from "../../types";
-type TransformProps<E extends React.ElementType = React.ElementType> = {
+import { Merge, Override } from "../../types";
+type TransformProps<E extends React.ElementType = React.ElementType> = Merge<{
     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;
+} & React.ComponentPropsWithRef<E>>;
+export type PolymorphicProps<P extends object, E extends React.ElementType> = Merge<Override<TransformProps<E>, P>>;
+export declare const Polymorph: <E extends React.ElementType = React.ElementType>(props: TransformProps<E>) => React.ReactNode;
 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,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"}
+{"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,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE9C,KAAK,cAAc,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI,KAAK,CACxE;IACI,EAAE,CAAC,EAAE,CAAC,CAAC;CACV,GAAG,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,CACrC,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;AAIpH,eAAO,MAAM,SAAS,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,CAAC,WAAW,EAAE,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAKrG,CAAC"}

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

@@ -1,15 +1,31 @@
 import { type VariantProps } from "class-variance-authority";
 import React from "react";
-import { Label } from "../../types";
+import { CvaVariants, Label } from "../../types";
 import { PolymorphicProps } from "./polymorph";
 declare const indicatorVariant: (props?: ({
     theme?: "info" | "warn" | "muted" | "danger" | "primary" | "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" | "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<{
+declare const variants: {
+    size: {
+        icon: string;
+        big: string;
+        default: string;
+        small: string;
+    };
+    theme: {
+        primary: string;
+        danger: string;
+        info: string;
+        success: string;
+        secondary: string;
+        warn: string;
+        muted: string;
+        neutral: string;
+        disabled: string;
+        loading: string;
+    };
+};
+export type TagProps<T extends React.ElementType = "span"> = PolymorphicProps<CvaVariants<typeof variants> & Partial<{
     icon: Label;
     loading: boolean;
     indicator: VariantProps<typeof indicatorVariant>["theme"];

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;;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"}
+{"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,WAAW,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,gBAAgB;;mFAYpB,CAAC;AAEH,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;CAmBb,CAAC;AAOF,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,WAAW,CAAC,OAAO,QAAQ,CAAC,GACxB,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,GAkB9E,CAAC"}

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

@@ -16,27 +16,28 @@ const indicatorVariant = cva("size-2.5 aspect-square rounded-full border-0", {
         },
     },
 });
-const tagVariants = cva("inline-flex rounded-pill gap-1.5 border-2 border-transparent items-center justify-center align-middle whitespace-nowrap", {
-    variants: {
-        size: {
-            icon: "p-1",
-            big: "h-12 px-6 py-4",
-            default: "h-8 px-4 py-2",
-            small: "h-6 p-2 px-3 text-sm",
-        },
-        theme: {
-            primary: "bg-tag-primary-bg text-tag-primary-text",
-            danger: "bg-tag-danger-bg text-tag-danger-text",
-            info: "bg-tag-info-bg text-tag-info-text",
-            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",
-        },
+const variants = {
+    size: {
+        icon: "p-1",
+        big: "h-12 px-6 py-4",
+        default: "h-8 px-4 py-2",
+        small: "h-6 p-2 px-3 text-sm",
+    },
+    theme: {
+        primary: "bg-tag-primary-bg text-tag-primary-text",
+        danger: "bg-tag-danger-bg text-tag-danger-text",
+        info: "bg-tag-info-bg text-tag-info-text",
+        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",
     },
+};
+const tagVariants = cva("inline-flex rounded-pill gap-1.5 border-2 border-transparent items-center justify-center align-middle whitespace-nowrap", {
+    variants,
     defaultVariants: { theme: "primary", size: "default" },
 });
 export const Tag = forwardRef(function Tag({ className, indicator = undefined, icon, loading, theme, size, ...props }, ref) {

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

@@ -1,18 +1,26 @@
-import { type VariantProps } from "class-variance-authority";
 import { HTMLMotionProps } from "motion/react";
 import React, { PropsWithChildren } from "react";
+import { CvaVariants } from "../../types";
 import { PolymorphicProps } from "../core/polymorph";
 type CollapseProps = HTMLMotionProps<"section"> & {
     open: boolean;
 };
 export declare const Collapse: (props: PropsWithChildren<CollapseProps>) => import("react/jsx-runtime").JSX.Element;
-declare const alertVariants: (props?: ({
-    theme?: "info" | "warn" | "danger" | "neutral" | "primary" | "success" | "secondary" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-export type AlertProps<T extends React.ElementType = "div"> = PolymorphicProps<VariantProps<typeof alertVariants> & Partial<{
-    Icon: React.ReactElement;
-    container: string;
+declare const themeVariants: {
+    theme: {
+        primary: string;
+        danger: string;
+        info: string;
+        success: string;
+        secondary: string;
+        warn: string;
+        neutral: string;
+    };
+};
+export type AlertProps<T extends React.ElementType = "div"> = PolymorphicProps<CvaVariants<typeof themeVariants> & Partial<{
     open?: boolean;
+    container: string;
+    Icon: React.ReactElement;
     onClose: (nextState: boolean) => void;
 }>, T>;
 export declare const Alert: <T extends React.ElementType = "div">(props: AlertProps<T>) => any;

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

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/components/display/alert.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,eAAe,EAAU,MAAM,cAAc,CAAC;AAEvD,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAahE,KAAK,aAAa,GAAG,eAAe,CAAC,SAAS,CAAC,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AAEpE,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,aAAa,CAAC,4CAiB/D,CAAC;AAEF,QAAA,MAAM,aAAa;;mFAajB,CAAC;AAEH,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CAC1E,YAAY,CAAC,OAAO,aAAa,CAAC,GAC9B,OAAO,CAAC;IACJ,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,GA2CxE,CAAC"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/components/display/alert.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAU,MAAM,cAAc,CAAC;AAEvD,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAahE,KAAK,aAAa,GAAG,eAAe,CAAC,SAAS,CAAC,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AAEpE,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,aAAa,CAAC,4CAiB/D,CAAC;AAEF,QAAA,MAAM,aAAa;;;;;;;;;;CAUlB,CAAC;AAOF,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CAC1E,WAAW,CAAC,OAAO,aAAa,CAAC,GAC7B,OAAO,CAAC;IACJ,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,GA2CxE,CAAC"}

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

@@ -16,18 +16,19 @@ const transition = {
     ease: [0.04, 0.62, 0.23, 0.98],
 };
 export const Collapse = (props) => (_jsx(motion.div, { ...props, layout: true, layoutRoot: true, layoutScroll: true, initial: false, variants: variants, exit: variants.false, transition: transition, "aria-hidden": !props.open, "data-component": "collapse", animate: props.open.toString(), className: css("aria-hidden:pointer-events-none", props.className), children: props.children }));
-const alertVariants = cva("p-4 w-full block border relative rounded-lg text-sm", {
-    variants: {
-        theme: {
-            primary: "bg-alert-primary-bg text-alert-primary-text border-alert-primary-border",
-            danger: "bg-alert-danger-bg text-alert-danger-text border-alert-danger-border",
-            info: "bg-alert-info-bg text-alert-info-text border-alert-info-border",
-            success: "bg-alert-success-bg text-alert-success-text border-alert-success-border",
-            secondary: "bg-alert-secondary-bg text-alert-secondary-text border-alert-secondary-border",
-            warn: "bg-alert-warn-bg text-alert-warn-text border-alert-warn-border",
-            neutral: "bg-transparent border border-card-border text-alert-primary-text",
-        },
+const themeVariants = {
+    theme: {
+        primary: "bg-alert-primary-bg text-alert-primary-text border-alert-primary-border",
+        danger: "bg-alert-danger-bg text-alert-danger-text border-alert-danger-border",
+        info: "bg-alert-info-bg text-alert-info-text border-alert-info-border",
+        success: "bg-alert-success-bg text-alert-success-text border-alert-success-border",
+        secondary: "bg-alert-secondary-bg text-alert-secondary-text border-alert-secondary-border",
+        warn: "bg-alert-warn-bg text-alert-warn-text border-alert-warn-border",
+        neutral: "bg-transparent border border-card-border text-alert-primary-text",
     },
+};
+const alertVariants = cva("p-4 w-full block border relative rounded-lg text-sm", {
+    variants: themeVariants,
     defaultVariants: { theme: "neutral" },
 });
 export const Alert = forwardRef(function Alert({ className, theme, Icon, onClose, open = true, ...props }, ref) {

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

@@ -0,0 +1,4 @@
+export declare const Shortcut: (props: {
+    value: string;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=shortcut.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"shortcut.d.ts","sourceRoot":"","sources":["../../../../src/components/display/shortcut.tsx"],"names":[],"mappings":"AAWA,eAAO,MAAM,QAAQ,GAAI,OAAO;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,4CAehD,CAAC"}

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

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CommandIcon } from "lucide-react";
+import { Fragment } from "react";
+import { isMac } from "../../lib/combi-keys";
+const remap = (x) => {
+    if (x === "Mod") {
+        return isMac() ? _jsx(CommandIcon, { "aria-label": "Command", size: 14 }) : "Ctrl";
+    }
+    return x;
+};
+export const Shortcut = (props) => {
+    const p = props.value.trim().split("+");
+    return (_jsx("span", { className: "flex items-center gap-1", children: p.map((x, i) => {
+            const isLast = p.length - 1 === i;
+            return (_jsxs(Fragment, { children: [_jsx("kbd", { "aria-label": x, children: remap(x) }), isLast ? null : _jsx("span", { children: "+" })] }, `${props.value}-${x}-key-${i}`));
+        }) }));
+};

package/dist/src/components/floating/command-palette.d.ts

@@ -0,0 +1,36 @@
+import React from "react";
+import { Label } from "../../types";
+type ViewProps = {
+    text: string;
+};
+type CommandItem<T extends string, P extends object> = {
+    type: T;
+    hint?: string;
+    enabled?: (props: ViewProps) => boolean;
+} & P;
+type View = Label | React.FC<ViewProps>;
+type CommandShortcutItem = CommandItem<"shortcut", {
+    title: View;
+    shortcut?: string;
+    action: (args: {
+        text: string;
+        setOpen: (state: boolean) => void;
+        event: KeyboardEvent | React.MouseEvent | React.KeyboardEvent;
+    }) => void;
+}>;
+type CommandGroupItem = CommandItem<"group", {
+    title: View;
+    items: CommandItemTypes[];
+}>;
+export type CommandItemTypes = CommandGroupItem | CommandShortcutItem;
+export type CommandPaletteProps = {
+    open: boolean;
+    bind?: string;
+    emptyMessage?: Label;
+    footer?: React.ReactElement;
+    commands: CommandItemTypes[];
+    onChange: (next: boolean) => void;
+};
+export declare const CommandPalette: (props: CommandPaletteProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=command-palette.d.ts.map

package/dist/src/components/floating/command-palette.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-palette.d.ts","sourceRoot":"","sources":["../../../../src/components/floating/command-palette.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAMxF,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAIpC,KAAK,SAAS,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AAElC,KAAK,WAAW,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,MAAM,IAAI;IACnD,IAAI,EAAE,CAAC,CAAC;IACR,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,OAAO,CAAC;CAC3C,GAAG,CAAC,CAAC;AAEN,KAAK,IAAI,GAAG,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC;AAExC,KAAK,mBAAmB,GAAG,WAAW,CAClC,UAAU,EACV;IACI,KAAK,EAAE,IAAI,CAAC;IACZ,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,CAAC,IAAI,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;QAAC,KAAK,EAAE,aAAa,GAAG,KAAK,CAAC,UAAU,GAAG,KAAK,CAAC,aAAa,CAAA;KAAE,KAAK,IAAI,CAAC;CAC9I,CACJ,CAAC;AAEF,KAAK,gBAAgB,GAAG,WAAW,CAC/B,OAAO,EACP;IACI,KAAK,EAAE,IAAI,CAAC;IACZ,KAAK,EAAE,gBAAgB,EAAE,CAAC;CAC7B,CACJ,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,gBAAgB,GAAG,mBAAmB,CAAC;AAkDtE,MAAM,MAAM,mBAAmB,GAAG;IAC9B,IAAI,EAAE,OAAO,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC5B,QAAQ,EAAE,gBAAgB,EAAE,CAAC;IAC7B,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACrC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,mBAAmB,4CA0KxD,CAAC"}

package/dist/src/components/floating/command-palette.js

@@ -0,0 +1,139 @@
+"use client";
+import { createElement as _createElement } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { autoUpdate, useFloating, useInteractions, useListNavigation, useRole } from "@floating-ui/react";
+import { AnimatePresence, motion } from "motion/react";
+import { forwardRef, Fragment, useEffect, useId, useRef, useState } from "react";
+import { useStableRef } from "../../hooks/use-stable-ref";
+import { useTranslations } from "../../hooks/use-translations";
+import { CombiKeys } from "../../lib/combi-keys";
+import { css, isReactFC } from "../../lib/dom";
+import { fzf } from "../../lib/fzf";
+import { Shortcut } from "../display/shortcut";
+import { Modal } from "./modal";
+const Group = (props) => (_jsx("span", { className: "flex h-full items-center text-left text-sm font-medium text-secondary", children: isReactFC(props.item.title) ? _jsx(props.item.title, { text: props.text }) : props.item.title }));
+const Item = forwardRef((props, ref) => {
+    const id = useId();
+    const active = props.active;
+    const classNameBase = "h-10";
+    const item = props.item;
+    if (item.type === "group") {
+        return (_jsx(motion.div, { id: id, className: "h-10 px-2 pb-1 pt-2", children: _jsx(Group, { text: props.text, item: item }) }));
+    }
+    if (item.type === "shortcut") {
+        return (_jsxs(motion.button, { id: id, ref: ref, role: "option", "aria-selected": active, "data-component": "command-palette-item", onClick: (event) => item.action({ event, setOpen: props.onChange, text: props.text }), className: css(classNameBase, "flex items-center justify-between rounded-lg p-2 hover:bg-primary hover:text-primary-foreground", active ? "bg-primary text-primary-foreground" : ""), children: [_jsx("span", { children: isReactFC(item.title) ? _jsx(item.title, { text: props.text }) : item.title }), item.shortcut ? _jsx(Shortcut, { value: item.shortcut }) : null] }));
+    }
+    return _jsx(Fragment, {});
+});
+export const CommandPalette = (props) => {
+    const translations = useTranslations();
+    const [value, setValue] = useState("");
+    const valueRef = useStableRef(value);
+    const bindKey = props.bind ?? "Mod + k";
+    const [combi] = useState(new CombiKeys());
+    const id = useId();
+    const ref = useRef(null);
+    const [activeIndex, setActiveIndex] = useState(null);
+    const floating = useFloating({
+        open: props.open,
+        onOpenChange: props.onChange,
+        whileElementsMounted: autoUpdate,
+    });
+    const listRef = useRef([]);
+    const listNav = useListNavigation(floating.context, {
+        listRef,
+        loop: true,
+        activeIndex,
+        virtual: true,
+        allowEscape: true,
+        onNavigate: setActiveIndex,
+        scrollItemIntoView: true,
+    });
+    const role = useRole(floating.context, { role: "listbox" });
+    const { getItemProps } = useInteractions([role, listNav]);
+    const commands = props.commands.flatMap((x) => x.type !== "group"
+        ? x.enabled
+            ? x.enabled({ text: value })
+                ? [x]
+                : []
+            : [x]
+        : [x, ...x.items].filter((x) => (x.enabled === undefined ? true : x.enabled({ text: value }))));
+    const fuzzy = commands.length === 0
+        ? commands
+        : fzf(commands, "title", [
+            { key: "title", value },
+            { key: "shortcut", value },
+            { key: "hint", value },
+            ...commands.reduce((acc, el) => {
+                if (!el.hint)
+                    return acc;
+                return [...acc, { key: "hint", value: el.hint }];
+            }, []),
+        ]);
+    const displayItems = value === ""
+        ? commands
+        : [
+            {
+                type: "group",
+                title: "Results",
+                items: [],
+            },
+            ...fuzzy.filter((x) => x.type !== "group"),
+        ];
+    useEffect(() => {
+        combi.add(bindKey, () => props.onChange?.(true));
+        commands.forEach((cmd) => {
+            if (cmd.type === "group")
+                return;
+            if (cmd.type === "shortcut" && cmd.shortcut !== undefined)
+                combi.add(cmd.shortcut, (event) => cmd.action({
+                    event,
+                    text: valueRef.current,
+                    setOpen: props.onChange,
+                }));
+        });
+        return combi.register();
+    }, [combi, bindKey]);
+    return (_jsx(Fragment, { children: _jsxs(Modal, { ref: ref, closable: false, open: props.open, overlayClickClose: true, interactions: [listNav], onChange: props.onChange, ariaTitle: "Command palette", bodyClassName: "px-0 py-0 pt-2", className: "container relative py-0 md:max-w-screen-sm lg:max-w-screen-md", children: [_jsx("header", { className: "h-12 isolate z-floating bg-floating-background w-full sticky top-0 border-b border-floating-border px-4", children: _jsx("input", { autoFocus: true, value: value, "data-combikeysbypass": "true", placeholder: "Search for...", onChange: (e) => setValue(e.target.value), className: "h-12 w-full bg-transparent pb-2 outline-none", onKeyDown: (e) => {
+                            if (e.key === "ArrowDown" || e.key === "ArrowUp") {
+                                if (activeIndex !== null)
+                                    listRef.current[activeIndex]?.scrollIntoView({
+                                        block: "start",
+                                        inline: "start",
+                                    });
+                            }
+                            if (e.key === "Enter") {
+                                if (activeIndex !== null && displayItems[activeIndex]) {
+                                    e.preventDefault();
+                                    const x = displayItems[activeIndex];
+                                    const text = e.currentTarget.value;
+                                    if (x.type === "shortcut")
+                                        return x.action({
+                                            event: e,
+                                            setOpen: props.onChange,
+                                            text,
+                                        });
+                                }
+                                if (displayItems.length === 1) {
+                                    e.preventDefault();
+                                    const x = displayItems[0];
+                                    const text = e.currentTarget.value;
+                                    if (x.type === "shortcut")
+                                        return x.action({
+                                            event: e,
+                                            setOpen: props.onChange,
+                                            text,
+                                        });
+                                }
+                            }
+                        } }) }), _jsx(motion.ul, { initial: { transform: "scaleY(0)", opacity: 0.3 }, animate: { transform: "scaleY(1)", opacity: 1 }, className: "my-2 flex h-fit max-h-96 origin-[top_center] flex-col gap-1 px-2", children: _jsxs(AnimatePresence, { children: [displayItems.map((item, index) => (_createElement(Item, { ...getItemProps({
+                                    ref(node) {
+                                        listRef.current[index] = node;
+                                    },
+                                    onClick(e) {
+                                        e.preventDefault();
+                                        props.onChange(false);
+                                        floating.refs.domReference.current?.focus();
+                                    },
+                                }), item: item, text: value, onChange: props.onChange, active: activeIndex === index, key: `${id}-${item.type}-${index}` }))), displayItems.length === 1 ? (_jsx(motion.div, { className: css("flex items-center justify-between rounded-lg p-2 text-secondary"), children: translations.commandPaletteEmpty ?? props.emptyMessage })) : null] }) }), props.footer ? _jsx("footer", { className: "flex h-8 items-center rounded-b-lg bg-background p-2", children: props.footer }) : null] }) }));
+};