@g4rcez/components 4.0.2 → 4.1.2

package/dist/components/core/button.js

@@ -1,7 +1,7 @@
 import { jsxs as u } from "react/jsx-runtime";
-import { c as g } from "../../index-DJSMaZR4.js";
+import { c as g } from "../../index-DlJ_2RBL.js";
 import { forwardRef as c } from "react";
-import { c as p } from "../../dom-Dl8XH0CK.js";
+import { c as p } from "../../dom-CyQHY7ID.js";
 import { P as l } from "../../polymorph-B5n9fs_K.js";
 const m = {
   size: {
@@ -41,13 +41,13 @@ const m = {
     "ghost-neutral": "bg-transparent border-0 border-card-border"
   }
 }, x = g(
-  "relative overflow-hidden inline-flex duration-300 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-linear disabled:cursor-not-allowed disabled:bg-opacity-40 disabled:text-opacity-80 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring",
+  "relative inline-flex cursor-pointer items-center justify-center gap-1.5 overflow-hidden whitespace-nowrap align-middle font-medium transition-colors duration-300 ease-linear focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring enabled:hover:bg-opacity-70 enabled:focus:bg-opacity-70 disabled:cursor-not-allowed disabled:bg-opacity-40 disabled:text-opacity-80 data-[loading=true]:animate-pulse data-[loading=true]:opacity-30",
   {
     variants: m,
     defaultVariants: { theme: "main", size: "default", rounded: "default" }
   }
-), k = c(function({ className: a, icon: o, loading: r, theme: n, type: s = "button", size: d, rounded: b, ...t }, i) {
-  const e = r || t.disabled;
+), k = c(function({ className: a, icon: o, loading: e, theme: n, type: s = "button", size: d, rounded: b, ...t }, i) {
+  const r = e || t.disabled;
   return /* @__PURE__ */ u(
     l,
     {
@@ -55,13 +55,13 @@ const m = {
       ref: i,
       type: s,
       "data-theme": n,
-      disabled: e,
-      "data-loading": r,
+      disabled: r,
+      "data-loading": e,
       "data-component": "button",
-      "aria-disabled": e,
+      "aria-disabled": r,
       as: t.as ?? "button",
-      "aria-busy": e || r,
-      onClick: e ? void 0 : t.onClick,
+      "aria-busy": e,
+      onClick: r ? void 0 : t.onClick,
       className: p(x({ size: d, rounded: b, theme: n }), a),
       children: [
         o,

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

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":["../../../src/components/core/button.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport React, { forwardRef, PropsWithChildren } from \"react\";\nimport { css } from \"../../lib/dom\";\nimport { CvaVariants, type Label } from \"../../types\";\nimport { Polymorph, PolymorphicProps } from \"./polymorph\";\n\nconst variants = {\n    size: {\n        icon: \"p-1\",\n        big: \"h-12 px-6 py-4\",\n        default: \"h-10 px-4 py-2\",\n        min: \"h-7 px-3 py-1 text-sm\",\n        small: \"h-8 px-4 py-2 text-sm\",\n        tiny: \"h-6 px-2 py-1 text-sm\",\n    },\n    rounded: {\n        rough: \"rounded-sm\",\n        squared: \"rounded-none\",\n        default: \"rounded-button\",\n        circle: \"rounded-full aspect-square\",\n    },\n    theme: {\n        raw: \"\",\n        disabled: \"bg-disabled opacity-70\",\n        loading: \"animate-pulse bg-disabled\",\n        main: \"bg-button-primary-bg text-button-primary-text\",\n        info: \"bg-button-info-bg text-button-info-text\",\n        warn: \"bg-button-warn-bg text-button-warn-text\",\n        muted: \"bg-button-muted-bg text-button-muted-text\",\n        danger: \"bg-button-danger-bg text-button-danger-text\",\n        neutral: \"bg-transparent border-1 border-card-border\",\n        primary: \"bg-button-primary-bg text-button-primary-text\",\n        success: \"bg-button-success-bg text-button-success-text\",\n        secondary: \"bg-button-secondary-bg text-button-secondary-text\",\n\n        \"ghost-info\": \"bg-transparent hover:bg-info/20 border-0 border-transparent text-info\",\n        \"ghost-warn\": \"bg-transparent hover:bg-warn/20 border-0 border-transparent text-warn\",\n        \"ghost-danger\": \"bg-transparent hover:bg-danger/20 border-0 border-transparent text-danger\",\n        \"ghost-primary\": \"bg-transparent hover:bg-primary/20 border-0 border-transparent text-primary\",\n        \"ghost-success\": \"bg-transparent hover:bg-success/20 border-0 border-transparent text-success\",\n        \"ghost-secondary\": \"bg-transparent hover:bg-secondary/20 border-0 border-transparent text-secondary\",\n        \"ghost-muted\": \"bg-transparent hover:bg-muted/20 border-0 border-transparent text-muted-foreground\",\n        \"ghost-neutral\": \"bg-transparent border-0 border-card-border\",\n    },\n};\n\nconst buttonVariants = cva(\n    \"relative overflow-hidden inline-flex duration-300 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-linear disabled:cursor-not-allowed disabled:bg-opacity-40 disabled:text-opacity-80 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring\",\n    {\n        variants,\n        defaultVariants: { theme: \"main\", size: \"default\", rounded: \"default\" },\n    }\n);\n\ntype Variants = CvaVariants<typeof variants>;\n\nexport type ButtonProps<T extends React.ElementType = \"button\"> = PropsWithChildren<\n    PolymorphicProps<\n        Variants &\n            Partial<{\n                /** Icon to display in the button */\n                icon: Label;\n                /** Whether the button is in a loading state */\n                loading: boolean;\n            }>,\n        T\n    >\n>;\n\n/**\n * A versatile button component with multiple variants, sizes, and states.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <Button>Click me</Button>\n *\n * // With variants\n * <Button theme=\"primary\" size=\"big\">Primary Button</Button>\n *\n * // Loading state\n * <Button loading>Saving...</Button>\n *\n * // With icon\n * <Button icon={<Icon name=\"plus\" />}>Add Item</Button>\n *\n * // As different element\n * <Button as=\"a\" href=\"/link\">Link Button</Button>\n * ```\n *\n * @template T - The HTML element type to render as\n * @param props - Button props including theme, size, loading state, etc.\n * @param ref - Forwarded ref to the button element\n * @returns A styled button component\n */\nexport const Button: <T extends React.ElementType = \"button\">(_: ButtonProps<T>) => React.ReactNode = forwardRef(function Button(\n    { className, icon, loading, theme, type = \"button\", size, rounded, ...props }: ButtonProps,\n    ref: React.Ref<\"button\">\n) {\n    const disabled = loading || props.disabled;\n    return (\n        <Polymorph\n            {...props}\n            ref={ref}\n            type={type}\n            data-theme={theme}\n            disabled={disabled}\n            data-loading={loading}\n            data-component=\"button\"\n            aria-disabled={disabled}\n            as={props.as ?? \"button\"}\n            aria-busy={disabled || loading}\n            onClick={disabled ? undefined : props.onClick}\n            className={css(buttonVariants({ size, rounded, theme }), className)}\n        >\n            {icon}\n            {props.children}\n        </Polymorph>\n    );\n}) as any;\n"],"names":["variants","buttonVariants","cva","Button","forwardRef","className","icon","loading","theme","type","size","rounded","props","ref","disabled","jsxs","Polymorph","css"],"mappings":";;;;;AAMA,MAAMA,IAAW;AAAA,EACb,MAAM;AAAA,IACF,MAAM;AAAA,IACN,KAAK;AAAA,IACL,SAAS;AAAA,IACT,KAAK;AAAA,IACL,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAAA,EAEV,SAAS;AAAA,IACL,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,QAAQ;AAAA,EAAA;AAAA,EAEZ,OAAO;AAAA,IACH,KAAK;AAAA,IACL,UAAU;AAAA,IACV,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,SAAS;AAAA,IACT,SAAS;AAAA,IACT,WAAW;AAAA,IAEX,cAAc;AAAA,IACd,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,eAAe;AAAA,IACf,iBAAiB;AAAA,EAAA;AAEzB,GAEMC,IAAiBC;AAAA,EACnB;AAAA,EACA;AAAA,IACI,UAAAF;AAAA,IACA,iBAAiB,EAAE,OAAO,QAAQ,MAAM,WAAW,SAAS,UAAA;AAAA,EAAU;AAE9E,GA2CaG,IAAyFC,EAAW,SAC7G,EAAE,WAAAC,GAAW,MAAAC,GAAM,SAAAC,GAAS,OAAAC,GAAO,MAAAC,IAAO,UAAU,MAAAC,GAAM,SAAAC,GAAS,GAAGC,EAAA,GACtEC,GACF;AACE,QAAMC,IAAWP,KAAWK,EAAM;AAClC,SACI,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACI,GAAGJ;AAAA,MACJ,KAAAC;AAAA,MACA,MAAAJ;AAAA,MACA,cAAYD;AAAA,MACZ,UAAAM;AAAA,MACA,gBAAcP;AAAA,MACd,kBAAe;AAAA,MACf,iBAAeO;AAAA,MACf,IAAIF,EAAM,MAAM;AAAA,MAChB,aAAWE,KAAYP;AAAA,MACvB,SAASO,IAAW,SAAYF,EAAM;AAAA,MACtC,WAAWK,EAAIhB,EAAe,EAAE,MAAAS,GAAM,SAAAC,GAAS,OAAAH,EAAA,CAAO,GAAGH,CAAS;AAAA,MAEjE,UAAA;AAAA,QAAAC;AAAA,QACAM,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGnB,CAAC;"}
+{"version":3,"file":"button.js","sources":["../../../src/components/core/button.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport React, { forwardRef, PropsWithChildren } from \"react\";\nimport { css } from \"../../lib/dom\";\nimport { CvaVariants, type Label } from \"../../types\";\nimport { Polymorph, PolymorphicProps } from \"./polymorph\";\n\nconst variants = {\n    size: {\n        icon: \"p-1\",\n        big: \"h-12 px-6 py-4\",\n        default: \"h-10 px-4 py-2\",\n        min: \"h-7 px-3 py-1 text-sm\",\n        small: \"h-8 px-4 py-2 text-sm\",\n        tiny: \"h-6 px-2 py-1 text-sm\",\n    },\n    rounded: {\n        rough: \"rounded-sm\",\n        squared: \"rounded-none\",\n        default: \"rounded-button\",\n        circle: \"rounded-full aspect-square\",\n    },\n    theme: {\n        raw: \"\",\n        disabled: \"bg-disabled opacity-70\",\n        loading: \"animate-pulse bg-disabled\",\n        main: \"bg-button-primary-bg text-button-primary-text\",\n        info: \"bg-button-info-bg text-button-info-text\",\n        warn: \"bg-button-warn-bg text-button-warn-text\",\n        muted: \"bg-button-muted-bg text-button-muted-text\",\n        danger: \"bg-button-danger-bg text-button-danger-text\",\n        neutral: \"bg-transparent border-1 border-card-border\",\n        primary: \"bg-button-primary-bg text-button-primary-text\",\n        success: \"bg-button-success-bg text-button-success-text\",\n        secondary: \"bg-button-secondary-bg text-button-secondary-text\",\n\n        \"ghost-info\": \"bg-transparent hover:bg-info/20 border-0 border-transparent text-info\",\n        \"ghost-warn\": \"bg-transparent hover:bg-warn/20 border-0 border-transparent text-warn\",\n        \"ghost-danger\": \"bg-transparent hover:bg-danger/20 border-0 border-transparent text-danger\",\n        \"ghost-primary\": \"bg-transparent hover:bg-primary/20 border-0 border-transparent text-primary\",\n        \"ghost-success\": \"bg-transparent hover:bg-success/20 border-0 border-transparent text-success\",\n        \"ghost-secondary\": \"bg-transparent hover:bg-secondary/20 border-0 border-transparent text-secondary\",\n        \"ghost-muted\": \"bg-transparent hover:bg-muted/20 border-0 border-transparent text-muted-foreground\",\n        \"ghost-neutral\": \"bg-transparent border-0 border-card-border\",\n    },\n};\n\nconst buttonVariants = cva(\n    \"relative inline-flex cursor-pointer items-center justify-center gap-1.5 overflow-hidden whitespace-nowrap align-middle font-medium transition-colors duration-300 ease-linear focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring enabled:hover:bg-opacity-70 enabled:focus:bg-opacity-70 disabled:cursor-not-allowed disabled:bg-opacity-40 disabled:text-opacity-80 data-[loading=true]:animate-pulse data-[loading=true]:opacity-30\",\n    {\n        variants,\n        defaultVariants: { theme: \"main\", size: \"default\", rounded: \"default\" },\n    }\n);\n\ntype Variants = CvaVariants<typeof variants>;\n\nexport type ButtonProps<T extends React.ElementType = \"button\"> = PropsWithChildren<\n    PolymorphicProps<\n        Variants &\n            Partial<{\n                /** Icon to display in the button */\n                icon: Label;\n                /** Whether the button is in a loading state */\n                loading: boolean;\n            }>,\n        T\n    >\n>;\n\n/**\n * A versatile button component with multiple variants, sizes, and states.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <Button>Click me</Button>\n *\n * // With variants\n * <Button theme=\"primary\" size=\"big\">Primary Button</Button>\n *\n * // Loading state\n * <Button loading>Saving...</Button>\n *\n * // With icon\n * <Button icon={<Icon name=\"plus\" />}>Add Item</Button>\n *\n * // As different element\n * <Button as=\"a\" href=\"/link\">Link Button</Button>\n * ```\n *\n * @template T - The HTML element type to render as\n * @param props - Button props including theme, size, loading state, etc.\n * @param ref - Forwarded ref to the button element\n * @returns A styled button component\n */\nexport const Button: <T extends React.ElementType = \"button\">(_: ButtonProps<T>) => React.ReactNode = forwardRef(function Button(\n    { className, icon, loading, theme, type = \"button\", size, rounded, ...props }: ButtonProps,\n    ref: React.Ref<\"button\">\n) {\n    const disabled = loading || props.disabled;\n    return (\n        <Polymorph\n            {...props}\n            ref={ref}\n            type={type}\n            data-theme={theme}\n            disabled={disabled}\n            data-loading={loading}\n            data-component=\"button\"\n            aria-disabled={disabled}\n            as={props.as ?? \"button\"}\n            aria-busy={loading}\n            onClick={disabled ? undefined : props.onClick}\n            className={css(buttonVariants({ size, rounded, theme }), className)}\n        >\n            {icon}\n            {props.children}\n        </Polymorph>\n    );\n}) as unknown as <T extends React.ElementType = \"button\">(_: ButtonProps<T>) => React.ReactNode;\n"],"names":["variants","buttonVariants","cva","Button","forwardRef","className","icon","loading","theme","type","size","rounded","props","ref","disabled","jsxs","Polymorph","css"],"mappings":";;;;;AAMA,MAAMA,IAAW;AAAA,EACb,MAAM;AAAA,IACF,MAAM;AAAA,IACN,KAAK;AAAA,IACL,SAAS;AAAA,IACT,KAAK;AAAA,IACL,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAAA,EAEV,SAAS;AAAA,IACL,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,QAAQ;AAAA,EAAA;AAAA,EAEZ,OAAO;AAAA,IACH,KAAK;AAAA,IACL,UAAU;AAAA,IACV,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,SAAS;AAAA,IACT,SAAS;AAAA,IACT,WAAW;AAAA,IAEX,cAAc;AAAA,IACd,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,eAAe;AAAA,IACf,iBAAiB;AAAA,EAAA;AAEzB,GAEMC,IAAiBC;AAAA,EACnB;AAAA,EACA;AAAA,IACI,UAAAF;AAAA,IACA,iBAAiB,EAAE,OAAO,QAAQ,MAAM,WAAW,SAAS,UAAA;AAAA,EAAU;AAE9E,GA2CaG,IAAyFC,EAAW,SAC7G,EAAE,WAAAC,GAAW,MAAAC,GAAM,SAAAC,GAAS,OAAAC,GAAO,MAAAC,IAAO,UAAU,MAAAC,GAAM,SAAAC,GAAS,GAAGC,EAAA,GACtEC,GACF;AACE,QAAMC,IAAWP,KAAWK,EAAM;AAClC,SACI,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACI,GAAGJ;AAAA,MACJ,KAAAC;AAAA,MACA,MAAAJ;AAAA,MACA,cAAYD;AAAA,MACZ,UAAAM;AAAA,MACA,gBAAcP;AAAA,MACd,kBAAe;AAAA,MACf,iBAAeO;AAAA,MACf,IAAIF,EAAM,MAAM;AAAA,MAChB,aAAWL;AAAA,MACX,SAASO,IAAW,SAAYF,EAAM;AAAA,MACtC,WAAWK,EAAIhB,EAAe,EAAE,MAAAS,GAAM,SAAAC,GAAS,OAAAH,EAAA,CAAO,GAAGH,CAAS;AAAA,MAEjE,UAAA;AAAA,QAAAC;AAAA,QACAM,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGnB,CAAC;"}

package/dist/components/core/button.jsx

@@ -0,0 +1,79 @@
+import { cva } from "class-variance-authority";
+import React, { forwardRef } from "react";
+import { css } from "../../lib/dom";
+import { Polymorph } from "./polymorph";
+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",
+        tiny: "h-6 px-2 py-1 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-button-primary-bg text-button-primary-text",
+        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-1 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-0 border-transparent text-info",
+        "ghost-warn": "bg-transparent hover:bg-warn/20 border-0 border-transparent text-warn",
+        "ghost-danger": "bg-transparent hover:bg-danger/20 border-0 border-transparent text-danger",
+        "ghost-primary": "bg-transparent hover:bg-primary/20 border-0 border-transparent text-primary",
+        "ghost-success": "bg-transparent hover:bg-success/20 border-0 border-transparent text-success",
+        "ghost-secondary": "bg-transparent hover:bg-secondary/20 border-0 border-transparent text-secondary",
+        "ghost-muted": "bg-transparent hover:bg-muted/20 border-0 border-transparent text-muted-foreground",
+        "ghost-neutral": "bg-transparent border-0 border-card-border",
+    },
+};
+const buttonVariants = cva("relative inline-flex cursor-pointer items-center justify-center gap-1.5 overflow-hidden whitespace-nowrap align-middle font-medium transition-colors duration-300 ease-linear focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring enabled:hover:bg-opacity-70 enabled:focus:bg-opacity-70 disabled:cursor-not-allowed disabled:bg-opacity-40 disabled:text-opacity-80 data-[loading=true]:animate-pulse data-[loading=true]:opacity-30", {
+    variants,
+    defaultVariants: { theme: "main", size: "default", rounded: "default" },
+});
+/**
+ * A versatile button component with multiple variants, sizes, and states.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <Button>Click me</Button>
+ *
+ * // With variants
+ * <Button theme="primary" size="big">Primary Button</Button>
+ *
+ * // Loading state
+ * <Button loading>Saving...</Button>
+ *
+ * // With icon
+ * <Button icon={<Icon name="plus" />}>Add Item</Button>
+ *
+ * // As different element
+ * <Button as="a" href="/link">Link Button</Button>
+ * ```
+ *
+ * @template T - The HTML element type to render as
+ * @param props - Button props including theme, size, loading state, etc.
+ * @param ref - Forwarded ref to the button element
+ * @returns A styled button component
+ */
+export const Button = forwardRef(function Button({ className, icon, loading, theme, type = "button", size, rounded, ...props }, ref) {
+    const disabled = loading || props.disabled;
+    return (<Polymorph {...props} ref={ref} type={type} data-theme={theme} disabled={disabled} data-loading={loading} data-component="button" aria-disabled={disabled} as={props.as ?? "button"} aria-busy={loading} onClick={disabled ? undefined : props.onClick} className={css(buttonVariants({ size, rounded, theme }), className)}>
+            {icon}
+            {props.children}
+        </Polymorph>);
+});

package/dist/components/core/heading.jsx

@@ -0,0 +1,4 @@
+import { Polymorph } from "./polymorph";
+export const Heading = (props) => {
+    return <Polymorph as="h2">{props.children}</Polymorph>;
+};

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

@@ -5,6 +5,6 @@ export type PolymorphicProps<Props, T extends React.ElementType> = Props & {
 } & Omit<PropsOf<T>, keyof Props | "as" | "ref"> & {
     ref?: React.ComponentProps<T>["ref"];
 };
-export declare const Polymorph: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<unknown>>;
+export declare const Polymorph: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<React.ElementType<any, keyof React.JSX.IntrinsicElements>>>;
 export {};
 //# sourceMappingURL=polymorph.d.ts.map

package/dist/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;AAG/B,KAAK,OAAO,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC;AAE9E,MAAM,MAAM,gBAAgB,CAAC,KAAK,EAAE,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,GAAG;IACvE,EAAE,CAAC,EAAE,CAAC,CAAC;CACV,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,MAAM,KAAK,GAAG,IAAI,GAAG,KAAK,CAAC,GAAG;IAC3C,GAAG,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;CACxC,CAAC;AAEN,eAAO,MAAM,SAAS,kFAGpB,CAAC"}
+{"version":3,"file":"polymorph.d.ts","sourceRoot":"","sources":["../../../src/components/core/polymorph.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,KAAK,OAAO,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC;AAE9E,MAAM,MAAM,gBAAgB,CAAC,KAAK,EAAE,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,GAAG;IACvE,EAAE,CAAC,EAAE,CAAC,CAAC;CACV,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,MAAM,KAAK,GAAG,IAAI,GAAG,KAAK,CAAC,GAAG;IAC3C,GAAG,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;CACxC,CAAC;AAEN,eAAO,MAAM,SAAS,oIAGpB,CAAC"}

package/dist/components/core/polymorph.jsx

@@ -0,0 +1,5 @@
+import { forwardRef } from "react";
+export const Polymorph = forwardRef(function InnerPolymorph(props, ref) {
+    const Element = props.as || "span";
+    return <Element ref={ref} {...props} as={undefined}/>;
+});

package/dist/components/core/render-on-view.jsx

@@ -0,0 +1,31 @@
+"use client";
+import React, { useLayoutEffect, useRef, useState } from "react";
+import { useStableRef } from "../../hooks/use-stable-ref";
+function isInViewport(el) {
+    const rect = el.getBoundingClientRect();
+    return (rect.top >= 0 &&
+        rect.left >= 0 &&
+        rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
+        rect.right <= (window.innerWidth || document.documentElement.clientWidth) /* or $(window).width() */);
+}
+export const RenderOnView = ({ children, ...props }) => {
+    const onIntersect = useStableRef(props.onIntersection);
+    const ref = useRef(null);
+    const [shouldRender, setShouldRender] = useState(() => (ref.current === null ? false : isInViewport(ref.current)));
+    useLayoutEffect(() => {
+        const div = ref.current;
+        if (div === null)
+            return;
+        const observer = new IntersectionObserver((args) => {
+            const first = args[0];
+            if (first.isIntersecting)
+                onIntersect.current?.();
+            return setShouldRender((prev) => (first.isIntersecting ? true : prev));
+        });
+        observer.observe(div);
+        return () => observer.disconnect();
+    }, []);
+    return (<div {...props} ref={ref}>
+            {shouldRender ? children : null}
+        </div>);
+};

package/dist/components/core/resizable.jsx

@@ -0,0 +1,51 @@
+"use client";
+import { motion, useMotionValue } from "motion/react";
+import React, { useEffect, useMemo, useState } from "react";
+import { isSsr } from "../../lib/fns";
+const defaultState = {
+    x: 0,
+    y: 0,
+    width: 0,
+    height: 0,
+    top: 0,
+    left: 0,
+    bottom: 0,
+    right: 0,
+};
+const useElementRect = () => {
+    const [element, ref] = useState(null);
+    const motion = useMotionValue(defaultState);
+    const observer = useMemo(() => isSsr()
+        ? null
+        : new window.ResizeObserver((entries) => {
+            if (entries[0]) {
+                const rect = entries[0].contentRect;
+                motion.set({
+                    x: rect.x,
+                    y: rect.y,
+                    width: rect.width,
+                    height: rect.height,
+                    top: rect.top,
+                    left: rect.left,
+                    bottom: rect.bottom,
+                    right: rect.right,
+                });
+            }
+        }), []);
+    useEffect(() => {
+        if (!element)
+            return;
+        if (observer === null)
+            return;
+        observer.observe(element);
+        return () => observer.disconnect();
+    }, [element]);
+    return [ref, motion];
+};
+export const Resizable = ({ children }) => {
+    const [ref, bounds] = useElementRect();
+    const h = bounds.get().height;
+    return (<motion.div animate={{ height: h > 0 ? h : "auto" }}>
+            <div ref={ref}>{children}</div>
+        </motion.div>);
+};

package/dist/components/core/slot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"slot.d.ts","sourceRoot":"","sources":["../../../src/components/core/slot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgD/B,MAAM,MAAM,MAAM,CAAC,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;AAI1D,UAAU,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACzD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AAiBD,wBAAgB,UAAU,CAAC,SAAS,EAAE,MAAM,iFAyC3C;AAED,eAAO,MAAM,IAAI,+EAAqB,CAAC;AAgCvC,UAAU,cAAc;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,UAAU,kBAAmB,SAAQ,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC;IACzD,SAAS,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,sBAOhD"}
+{"version":3,"file":"slot.d.ts","sourceRoot":"","sources":["../../../src/components/core/slot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA4C/B,MAAM,MAAM,MAAM,CAAC,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;AAI1D,UAAU,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACzD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AAiBD,wBAAgB,UAAU,CAAC,SAAS,EAAE,MAAM,iFAyC3C;AAED,eAAO,MAAM,IAAI,+EAAqB,CAAC;AAgCvC,UAAU,cAAc;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,UAAU,kBAAmB,SAAQ,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC;IACzD,SAAS,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,sBAOhD"}

package/dist/components/core/slot.jsx

@@ -0,0 +1,156 @@
+import * as React from "react";
+const REACT_LAZY_TYPE = Symbol.for("react.lazy");
+function setRef(ref, value) {
+    if (typeof ref === "function") {
+        return ref(value);
+    }
+    else if (ref !== null && ref !== undefined) {
+        ref.current = value;
+    }
+}
+function composeRefs(...refs) {
+    return (node) => {
+        let hasCleanup = false;
+        const cleanups = refs.map((ref) => {
+            const cleanup = setRef(ref, node);
+            if (!hasCleanup && typeof cleanup == "function") {
+                hasCleanup = true;
+            }
+            return cleanup;
+        });
+        if (hasCleanup) {
+            return () => {
+                for (let i = 0; i < cleanups.length; i++) {
+                    const cleanup = cleanups[i];
+                    if (typeof cleanup == "function") {
+                        cleanup();
+                    }
+                    else {
+                        setRef(refs[i], null);
+                    }
+                }
+            };
+        }
+    };
+}
+const use = React[" use ".trim().toString()];
+function isPromiseLike(value) {
+    return typeof value === "object" && value !== null && "then" in value;
+}
+function isLazyComponent(element) {
+    return (element != null &&
+        typeof element === "object" &&
+        "$$typeof" in element &&
+        element.$$typeof === REACT_LAZY_TYPE &&
+        "_payload" in element &&
+        isPromiseLike(element._payload));
+}
+export function createSlot(ownerName) {
+    const SlotClone = createSlotClone(ownerName);
+    const Slot = React.forwardRef((props, forwardedRef) => {
+        let { children, ...slotProps } = props;
+        if (isLazyComponent(children) && typeof use === "function") {
+            children = use(children._payload);
+        }
+        const childrenArray = React.Children.toArray(children);
+        const slottable = childrenArray.find(isSlottable);
+        if (slottable) {
+            // the new element to render is the one passed as a child of `Slottable`
+            const newElement = slottable.props.children;
+            const newChildren = childrenArray.map((child) => {
+                if (child === slottable) {
+                    // because the new element will be the one rendered, we are only interested
+                    // in grabbing its children (`newElement.props.children`)
+                    if (React.Children.count(newElement) > 1)
+                        return React.Children.only(null);
+                    return React.isValidElement(newElement) ? newElement.props.children : null;
+                }
+                else {
+                    return child;
+                }
+            });
+            return (<SlotClone {...slotProps} ref={forwardedRef}>
+                    {React.isValidElement(newElement) ? React.cloneElement(newElement, undefined, newChildren) : null}
+                </SlotClone>);
+        }
+        return (<SlotClone {...slotProps} ref={forwardedRef}>
+                {children}
+            </SlotClone>);
+    });
+    Slot.displayName = `${ownerName}.Slot`;
+    return Slot;
+}
+export const Slot = createSlot("Slot");
+function createSlotClone(ownerName) {
+    const SlotClone = React.forwardRef((props, forwardedRef) => {
+        let { children, ...slotProps } = props;
+        if (isLazyComponent(children) && typeof use === "function") {
+            children = use(children._payload);
+        }
+        if (React.isValidElement(children)) {
+            const childrenRef = getElementRef(children);
+            const props = mergeProps(slotProps, children.props);
+            // do not pass ref to React.Fragment for React 19 compatibility
+            if (children.type !== React.Fragment) {
+                props.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;
+            }
+            return React.cloneElement(children, props);
+        }
+        return React.Children.count(children) > 1 ? React.Children.only(null) : null;
+    });
+    SlotClone.displayName = `${ownerName}.SlotClone`;
+    return SlotClone;
+}
+const SLOTTABLE_IDENTIFIER = Symbol("radix.slottable");
+export function createSlottable(ownerName) {
+    const Slottable = ({ children }) => {
+        return <>{children}</>;
+    };
+    Slottable.displayName = `${ownerName}.Slottable`;
+    Slottable.__radixId = SLOTTABLE_IDENTIFIER;
+    return Slottable;
+}
+const Slottable = createSlottable("Slottable");
+function isSlottable(child) {
+    return (React.isValidElement(child) && typeof child.type === "function" && "__radixId" in child.type && child.type.__radixId === SLOTTABLE_IDENTIFIER);
+}
+function mergeProps(slotProps, childProps) {
+    const overrideProps = { ...childProps };
+    for (const propName in childProps) {
+        const slotPropValue = slotProps[propName];
+        const childPropValue = childProps[propName];
+        const isHandler = /^on[A-Z]/.test(propName);
+        if (isHandler) {
+            if (slotPropValue && childPropValue) {
+                overrideProps[propName] = (...args) => {
+                    const result = childPropValue(...args);
+                    slotPropValue(...args);
+                    return result;
+                };
+            }
+            else if (slotPropValue) {
+                overrideProps[propName] = slotPropValue;
+            }
+        }
+        else if (propName === "style") {
+            overrideProps[propName] = { ...slotPropValue, ...childPropValue };
+        }
+        else if (propName === "className") {
+            overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(" ");
+        }
+    }
+    return { ...slotProps, ...overrideProps };
+}
+function getElementRef(element) {
+    let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get;
+    let mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
+    if (mayWarn) {
+        return element.ref;
+    }
+    getter = Object.getOwnPropertyDescriptor(element, "ref")?.get;
+    mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
+    if (mayWarn) {
+        return element.props.ref;
+    }
+    return element.props.ref || element.ref;
+}

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

@@ -30,6 +30,6 @@ export type TagProps<T extends React.ElementType = "span"> = PolymorphicProps<Cv
     loading: boolean;
     indicator: Themes | true;
 }>, T>;
-export declare const Tag: <T extends React.ElementType = "span">(_: TagProps<T>) => any;
+export declare const Tag: <T extends React.ElementType = "span">(_: TagProps<T>) => React.ReactNode;
 export {};
 //# sourceMappingURL=tag.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../src/components/core/tag.tsx"],"names":[],"mappings":"AACA,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,QAAQ;;;;;;;;;;;;;;;;;;;;;CAqBb,CAAC;AAEF,KAAK,QAAQ,GAAG,WAAW,CAAC,OAAO,QAAQ,CAAC,CAAC;AAE7C,KAAK,MAAM,GAAG,WAAW,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;AAyB7C,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,WAAW,CAAC,OAAO,QAAQ,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAC;IAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,CAAC,EACnG,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,EAAE,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,GAkBnE,CAAC"}
+{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../src/components/core/tag.tsx"],"names":[],"mappings":"AACA,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,QAAQ;;;;;;;;;;;;;;;;;;;;;CAqBb,CAAC;AAEF,KAAK,QAAQ,GAAG,WAAW,CAAC,OAAO,QAAQ,CAAC,CAAC;AAE7C,KAAK,MAAM,GAAG,WAAW,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;AAyB7C,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,WAAW,CAAC,OAAO,QAAQ,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAC;IAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,CAAC,EACnG,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,EAAE,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAiBQ,CAAC"}

package/dist/components/core/tag.js

@@ -1,7 +1,7 @@
 import { jsxs as o, jsx as c } from "react/jsx-runtime";
-import { c as r } from "../../index-DJSMaZR4.js";
+import { c as r } from "../../index-DlJ_2RBL.js";
 import { forwardRef as m } from "react";
-import { c as b } from "../../dom-Dl8XH0CK.js";
+import { c as b } from "../../dom-CyQHY7ID.js";
 import { P as l } from "../../polymorph-B5n9fs_K.js";
 const u = {
   size: {
@@ -24,7 +24,7 @@ const u = {
     secondary: "bg-tag-secondary-bg text-tag-secondary-text",
     loading: "animate-pulse bg-disabled duration-700 opacity-70"
   }
-}, p = r("size-2 aspect-square rounded-full border-0", {
+}, p = r("aspect-square size-2 rounded-full border-0", {
   variants: {
     theme: {
       info: "bg-info",
@@ -38,7 +38,7 @@ const u = {
     }
   }
 }), x = r(
-  "inline-flex rounded-pill gap-1.5 border-0 items-center justify-center align-middle whitespace-nowrap ease-linear duration-300 transition-all",
+  "inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-pill border-0 align-middle transition-all duration-300 ease-linear",
   {
     variants: u,
     defaultVariants: { theme: "primary", size: "default" }

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

@@ -1 +1 @@
-{"version":3,"file":"tag.js","sources":["../../../src/components/core/tag.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport React, { forwardRef } from \"react\";\nimport { css } from \"../../lib/dom\";\nimport { CvaVariants, Label } from \"../../types\";\nimport { Polymorph, PolymorphicProps } from \"./polymorph\";\n\nconst variants = {\n    size: {\n        icon: \"p-1\",\n        big: \"h-12 px-6 py-4\",\n        default: \"h-8 px-4 py-2\",\n        tiny: \"h-5 p-1 px-2 text-xs\",\n        small: \"h-6 p-2 px-3 text-sm\",\n    },\n    theme: {\n        custom: \"\",\n        info: \"bg-tag-info-bg text-tag-info-text\",\n        warn: \"bg-tag-warn-bg text-tag-warn-text\",\n        muted: \"bg-tag-muted-bg text-tag-muted-text\",\n        danger: \"bg-tag-danger-bg text-tag-danger-text\",\n        disabled: \"bg-disabled duration-700 opacity-70\",\n        primary: \"bg-tag-primary-bg text-tag-primary-text\",\n        success: \"bg-tag-success-bg text-tag-success-text\",\n        neutral: \"bg-transparent border border-card-border\",\n        secondary: \"bg-tag-secondary-bg text-tag-secondary-text\",\n        loading: \"animate-pulse bg-disabled duration-700 opacity-70\",\n    },\n};\n\ntype Variants = CvaVariants<typeof variants>;\n\ntype Themes = NonNullable<Variants[\"theme\"]>;\n\nconst indicatorVariant = cva(\"size-2 aspect-square rounded-full border-0\", {\n    variants: {\n        theme: {\n            info: \"bg-info\",\n            warn: \"bg-warn\",\n            muted: \"bg-muted\",\n            danger: \"bg-danger\",\n            neutral: \"bg-muted\",\n            primary: \"bg-primary\",\n            success: \"bg-success\",\n            secondary: \"bg-secondary\",\n        } as Record<Themes, string>,\n    },\n});\n\nconst tagVariants = cva(\n    \"inline-flex rounded-pill gap-1.5 border-0 items-center justify-center align-middle whitespace-nowrap ease-linear duration-300 transition-all\",\n    {\n        variants,\n        defaultVariants: { theme: \"primary\", size: \"default\" },\n    }\n);\n\nexport type TagProps<T extends React.ElementType = \"span\"> = PolymorphicProps<\n    CvaVariants<typeof variants> & Partial<{ icon: Label; loading: boolean; indicator: Themes | true }>,\n    T\n>;\n\nexport const Tag: <T extends React.ElementType = \"span\">(_: TagProps<T>) => any = forwardRef(function Tag(\n    { className, indicator = undefined, icon, loading, theme, size, ...props }: TagProps,\n    ref: React.Ref<any>\n) {\n    return (\n        <Polymorph\n            {...props}\n            ref={ref}\n            data-theme={theme}\n            data-component=\"tag\"\n            as={props.as ?? \"span\"}\n            className={css(tagVariants({ size, theme: loading ? \"loading\" : theme }), className)}\n        >\n            {indicator ? <span aria-hidden=\"true\" className={indicatorVariant({ theme: indicator === true ? theme : indicator })} /> : null}\n            {icon}\n            {props.children}\n        </Polymorph>\n    );\n}) as any;\n"],"names":["variants","indicatorVariant","cva","tagVariants","Tag","forwardRef","className","indicator","icon","loading","theme","size","props","ref","jsxs","Polymorph","css","jsx"],"mappings":";;;;;AAMA,MAAMA,IAAW;AAAA,EACb,MAAM;AAAA,IACF,MAAM;AAAA,IACN,KAAK;AAAA,IACL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAEX,OAAO;AAAA,IACH,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,SAAS;AAAA,IACT,SAAS;AAAA,IACT,SAAS;AAAA,IACT,WAAW;AAAA,IACX,SAAS;AAAA,EAAA;AAEjB,GAMMC,IAAmBC,EAAI,8CAA8C;AAAA,EACvE,UAAU;AAAA,IACN,OAAO;AAAA,MACH,MAAM;AAAA,MACN,MAAM;AAAA,MACN,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,WAAW;AAAA,IAAA;AAAA,EACf;AAER,CAAC,GAEKC,IAAcD;AAAA,EAChB;AAAA,EACA;AAAA,IACI,UAAAF;AAAA,IACA,iBAAiB,EAAE,OAAO,WAAW,MAAM,UAAA;AAAA,EAAU;AAE7D,GAOaI,IAAqEC,EAAW,SACzF,EAAE,WAAAC,GAAW,WAAAC,IAAY,QAAW,MAAAC,GAAM,SAAAC,GAAS,OAAAC,GAAO,MAAAC,GAAM,GAAGC,EAAA,GACnEC,GACF;AACE,SACI,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACI,GAAGH;AAAA,MACJ,KAAAC;AAAA,MACA,cAAYH;AAAA,MACZ,kBAAe;AAAA,MACf,IAAIE,EAAM,MAAM;AAAA,MAChB,WAAWI,EAAIb,EAAY,EAAE,MAAAQ,GAAM,OAAOF,IAAU,YAAYC,GAAO,GAAGJ,CAAS;AAAA,MAElF,UAAA;AAAA,QAAAC,IAAY,gBAAAU,EAAC,QAAA,EAAK,eAAY,QAAO,WAAWhB,EAAiB,EAAE,OAAOM,MAAc,KAAOG,IAAQH,EAAA,CAAW,GAAG,IAAK;AAAA,QAC1HC;AAAA,QACAI,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGnB,CAAC;"}
+{"version":3,"file":"tag.js","sources":["../../../src/components/core/tag.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport React, { forwardRef } from \"react\";\nimport { css } from \"../../lib/dom\";\nimport { CvaVariants, Label } from \"../../types\";\nimport { Polymorph, PolymorphicProps } from \"./polymorph\";\n\nconst variants = {\n    size: {\n        icon: \"p-1\",\n        big: \"h-12 px-6 py-4\",\n        default: \"h-8 px-4 py-2\",\n        tiny: \"h-5 p-1 px-2 text-xs\",\n        small: \"h-6 p-2 px-3 text-sm\",\n    },\n    theme: {\n        custom: \"\",\n        info: \"bg-tag-info-bg text-tag-info-text\",\n        warn: \"bg-tag-warn-bg text-tag-warn-text\",\n        muted: \"bg-tag-muted-bg text-tag-muted-text\",\n        danger: \"bg-tag-danger-bg text-tag-danger-text\",\n        disabled: \"bg-disabled duration-700 opacity-70\",\n        primary: \"bg-tag-primary-bg text-tag-primary-text\",\n        success: \"bg-tag-success-bg text-tag-success-text\",\n        neutral: \"bg-transparent border border-card-border\",\n        secondary: \"bg-tag-secondary-bg text-tag-secondary-text\",\n        loading: \"animate-pulse bg-disabled duration-700 opacity-70\",\n    },\n};\n\ntype Variants = CvaVariants<typeof variants>;\n\ntype Themes = NonNullable<Variants[\"theme\"]>;\n\nconst indicatorVariant = cva(\"aspect-square size-2 rounded-full border-0\", {\n    variants: {\n        theme: {\n            info: \"bg-info\",\n            warn: \"bg-warn\",\n            muted: \"bg-muted\",\n            danger: \"bg-danger\",\n            neutral: \"bg-muted\",\n            primary: \"bg-primary\",\n            success: \"bg-success\",\n            secondary: \"bg-secondary\",\n        } as Record<Themes, string>,\n    },\n});\n\nconst tagVariants = cva(\n    \"inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-pill border-0 align-middle transition-all duration-300 ease-linear\",\n    {\n        variants,\n        defaultVariants: { theme: \"primary\", size: \"default\" },\n    }\n);\n\nexport type TagProps<T extends React.ElementType = \"span\"> = PolymorphicProps<\n    CvaVariants<typeof variants> & Partial<{ icon: Label; loading: boolean; indicator: Themes | true }>,\n    T\n>;\n\nexport const Tag: <T extends React.ElementType = \"span\">(_: TagProps<T>) => React.ReactNode = forwardRef(function Tag<\n    T extends React.ElementType = \"span\",\n>({ className, indicator = undefined, icon, loading, theme, size, ...props }: TagProps<T>, ref: React.Ref<HTMLElement>) {\n    return (\n        <Polymorph\n            {...props}\n            ref={ref}\n            data-theme={theme}\n            data-component=\"tag\"\n            as={props.as ?? \"span\"}\n            className={css(tagVariants({ size, theme: loading ? \"loading\" : theme }), className)}\n        >\n            {indicator ? <span aria-hidden=\"true\" className={indicatorVariant({ theme: indicator === true ? theme : indicator })} /> : null}\n            {icon}\n            {props.children}\n        </Polymorph>\n    );\n}) as unknown as <T extends React.ElementType = \"span\">(_: TagProps<T>) => React.ReactNode;\n"],"names":["variants","indicatorVariant","cva","tagVariants","Tag","forwardRef","className","indicator","icon","loading","theme","size","props","ref","jsxs","Polymorph","css","jsx"],"mappings":";;;;;AAMA,MAAMA,IAAW;AAAA,EACb,MAAM;AAAA,IACF,MAAM;AAAA,IACN,KAAK;AAAA,IACL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,OAAO;AAAA,EAAA;AAAA,EAEX,OAAO;AAAA,IACH,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,SAAS;AAAA,IACT,SAAS;AAAA,IACT,SAAS;AAAA,IACT,WAAW;AAAA,IACX,SAAS;AAAA,EAAA;AAEjB,GAMMC,IAAmBC,EAAI,8CAA8C;AAAA,EACvE,UAAU;AAAA,IACN,OAAO;AAAA,MACH,MAAM;AAAA,MACN,MAAM;AAAA,MACN,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,WAAW;AAAA,IAAA;AAAA,EACf;AAER,CAAC,GAEKC,IAAcD;AAAA,EAChB;AAAA,EACA;AAAA,IACI,UAAAF;AAAA,IACA,iBAAiB,EAAE,OAAO,WAAW,MAAM,UAAA;AAAA,EAAU;AAE7D,GAOaI,IAAiFC,EAAW,SAEvG,EAAE,WAAAC,GAAW,WAAAC,IAAY,QAAW,MAAAC,GAAM,SAAAC,GAAS,OAAAC,GAAO,MAAAC,GAAM,GAAGC,EAAA,GAAsBC,GAA6B;AACpH,SACI,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACI,GAAGH;AAAA,MACJ,KAAAC;AAAA,MACA,cAAYH;AAAA,MACZ,kBAAe;AAAA,MACf,IAAIE,EAAM,MAAM;AAAA,MAChB,WAAWI,EAAIb,EAAY,EAAE,MAAAQ,GAAM,OAAOF,IAAU,YAAYC,GAAO,GAAGJ,CAAS;AAAA,MAElF,UAAA;AAAA,QAAAC,IAAY,gBAAAU,EAAC,QAAA,EAAK,eAAY,QAAO,WAAWhB,EAAiB,EAAE,OAAOM,MAAc,KAAOG,IAAQH,EAAA,CAAW,GAAG,IAAK;AAAA,QAC1HC;AAAA,QACAI,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGnB,CAAC;"}

package/dist/components/core/tag.jsx

@@ -0,0 +1,51 @@
+import { cva } from "class-variance-authority";
+import React, { forwardRef } from "react";
+import { css } from "../../lib/dom";
+import { Polymorph } from "./polymorph";
+const variants = {
+    size: {
+        icon: "p-1",
+        big: "h-12 px-6 py-4",
+        default: "h-8 px-4 py-2",
+        tiny: "h-5 p-1 px-2 text-xs",
+        small: "h-6 p-2 px-3 text-sm",
+    },
+    theme: {
+        custom: "",
+        info: "bg-tag-info-bg text-tag-info-text",
+        warn: "bg-tag-warn-bg text-tag-warn-text",
+        muted: "bg-tag-muted-bg text-tag-muted-text",
+        danger: "bg-tag-danger-bg text-tag-danger-text",
+        disabled: "bg-disabled duration-700 opacity-70",
+        primary: "bg-tag-primary-bg text-tag-primary-text",
+        success: "bg-tag-success-bg text-tag-success-text",
+        neutral: "bg-transparent border border-card-border",
+        secondary: "bg-tag-secondary-bg text-tag-secondary-text",
+        loading: "animate-pulse bg-disabled duration-700 opacity-70",
+    },
+};
+const indicatorVariant = cva("aspect-square size-2 rounded-full border-0", {
+    variants: {
+        theme: {
+            info: "bg-info",
+            warn: "bg-warn",
+            muted: "bg-muted",
+            danger: "bg-danger",
+            neutral: "bg-muted",
+            primary: "bg-primary",
+            success: "bg-success",
+            secondary: "bg-secondary",
+        },
+    },
+});
+const tagVariants = cva("inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-pill border-0 align-middle transition-all duration-300 ease-linear", {
+    variants,
+    defaultVariants: { theme: "primary", size: "default" },
+});
+export const Tag = forwardRef(function Tag({ className, indicator = undefined, icon, loading, theme, size, ...props }, ref) {
+    return (<Polymorph {...props} ref={ref} data-theme={theme} data-component="tag" as={props.as ?? "span"} className={css(tagVariants({ size, theme: loading ? "loading" : theme }), className)}>
+            {indicator ? <span aria-hidden="true" className={indicatorVariant({ theme: indicator === true ? theme : indicator })}/> : null}
+            {icon}
+            {props.children}
+        </Polymorph>);
+});

package/dist/components/core/typography.jsx

@@ -0,0 +1,18 @@
+import React from "react";
+import { css } from "../../lib/dom";
+export const Paragraph = (props) => <p {...props} className={css("text-base leading-snug", props.className)}/>;
+export const Description = (props) => <p {...props} className={css("mb-kilo text-sm text-secondary", props.className)}/>;
+export const Info = (props) => (<div className={css(`flex ${props.row ? "flex-row items-center" : "flex-col"} gap-1`, props.className)}>
+        <span className="text-sm font-medium tracking-wide">{props.row ? `${props.label}:` : props.label}</span>
+        <span className={css(props.disabled ? "text-disabled" : "", props.row ? "w-fit text-base" : "w-full text-lg")}>{props.children}</span>
+    </div>);
+export const PageTitle = (props) => (<div>
+        <h2 className="typography text-3xl font-bold tracking-wide">{props.title}</h2>
+        <p className="typography text-secondary">{props.children}</p>
+    </div>);
+export const PageHeader = (props) => {
+    return (<header {...props.containerProps} className={css("gap-mega flex min-w-full flex-row flex-wrap items-center justify-between", props.containerProps?.className)}>
+            <PageTitle title={props.title}>{props.description}</PageTitle>
+            <div className="gap-kilo flex flex-wrap items-center">{props.children}</div>
+        </header>);
+};

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

@@ -23,6 +23,6 @@ export type AlertProps<T extends React.ElementType = "div"> = PolymorphicProps<C
     Icon: React.ReactElement;
     onClose: (nextState: boolean) => void;
 }>, T>;
-export declare const Alert: <T extends React.ElementType = "div">(props: AlertProps<T>) => any;
+export declare const Alert: <T extends React.ElementType = "div">(props: AlertProps<T>) => React.ReactNode;
 export {};
 //# sourceMappingURL=alert.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/display/alert.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAmB,eAAe,EAAU,MAAM,cAAc,CAAC;AAExE,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,sBAiB/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,GAiDxE,CAAC"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/display/alert.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAmB,eAAe,EAA0C,MAAM,cAAc,CAAC;AAExG,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG7D,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,sBAiB/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,KAAK,CAAC,SAoD9E,CAAC"}