@mieweb/ui 0.2.4 → 0.3.0-dev.100

package/dist/brands/index.js

@@ -1,11 +1,11 @@
-export { brands } from '../chunk-RYQ5NEKH.js';
-export { ozwellBrand } from '../chunk-4DJNHPHB.js';
-export { defaultBrand } from '../chunk-4LTN2LEN.js';
+export { brands } from '../chunk-JV7UJGBM.js';
+export { webchartBrand } from '../chunk-JW5GWKV7.js';
+export { createBrandPreset, generateBrandCSS, generateTailwindTheme } from '../chunk-WOYUQ4AT.js';
+export { bluehiveBrand } from '../chunk-XB7QCKK7.js';
+export { ozwellBrand } from '../chunk-IGWABMSM.js';
+export { defaultBrand } from '../chunk-PSTGFXQG.js';
 export { enterpriseHealthBrand } from '../chunk-MTZPVOP6.js';
-export { miewebBrand } from '../chunk-UHSPAFY6.js';
-export { wagglelineBrand } from '../chunk-OWPWP46L.js';
-export { webchartBrand } from '../chunk-C6MDPPPL.js';
-export { createBrandPreset, generateBrandCSS, generateTailwindTheme } from '../chunk-SOFX4T7M.js';
-export { bluehiveBrand } from '../chunk-ULOA7WBW.js';
+export { miewebBrand } from '../chunk-GFZNSSSN.js';
+export { wagglelineBrand } from '../chunk-2NTYAALC.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/brands/mieweb.css

@@ -34,16 +34,16 @@
   --mieweb-card: #ffffff;
   --mieweb-card-foreground: #171717;
   --mieweb-muted: #f5f5f5;
-  --mieweb-muted-foreground: #737373;
+  --mieweb-muted-foreground: #494949;
   --mieweb-border: #e5e7eb;
   --mieweb-input: #e5e7eb;
   --mieweb-ring: #27ae60;
-  --mieweb-destructive: #ef4444;
+  --mieweb-destructive: #dc2626;
   --mieweb-destructive-foreground: #ffffff;
-  --mieweb-success: #22c55e;
+  --mieweb-success: #15803d;
   --mieweb-success-foreground: #ffffff;
   --mieweb-warning: #f59e0b;
-  --mieweb-warning-foreground: #ffffff;
+  --mieweb-warning-foreground: #451a03;
   --mieweb-info: #0ea5e9;
   --mieweb-info-foreground: #ffffff;
   --mieweb-secondary-foreground: #ffffff;
@@ -94,7 +94,7 @@
   --mieweb-success: #16a34a;
   --mieweb-success-foreground: #fafafa;
   --mieweb-warning: #d97706;
-  --mieweb-warning-foreground: #fafafa;
+  --mieweb-warning-foreground: #451a03;
   --mieweb-info: #0284c7;
   --mieweb-info-foreground: #fafafa;
   --mieweb-secondary-foreground: #fafafa;

package/dist/brands/ozwell.cjs

@@ -1,12 +1,12 @@
 'use strict';
 
-var chunkKEIA2G6O_cjs = require('../chunk-KEIA2G6O.cjs');
+var chunkQO6U5VOT_cjs = require('../chunk-QO6U5VOT.cjs');
 
 
 
 Object.defineProperty(exports, "ozwellBrand", {
   enumerable: true,
-  get: function () { return chunkKEIA2G6O_cjs.ozwellBrand; }
+  get: function () { return chunkQO6U5VOT_cjs.ozwellBrand; }
 });
 //# sourceMappingURL=ozwell.cjs.map
 //# sourceMappingURL=ozwell.cjs.map

package/dist/brands/ozwell.css

@@ -43,16 +43,16 @@
   --mieweb-card: #ffffff;
   --mieweb-card-foreground: #171717;
   --mieweb-muted: #f5f5f5;
-  --mieweb-muted-foreground: #737373;
+  --mieweb-muted-foreground: #494949;
   --mieweb-border: #e5e7eb;
   --mieweb-input: #e5e7eb;
   --mieweb-ring: #27aae1;
-  --mieweb-destructive: #ef4444;
+  --mieweb-destructive: #dc2626;
   --mieweb-destructive-foreground: #ffffff;
-  --mieweb-success: #22c55e;
+  --mieweb-success: #15803d;
   --mieweb-success-foreground: #ffffff;
   --mieweb-warning: #f59e0b;
-  --mieweb-warning-foreground: #ffffff;
+  --mieweb-warning-foreground: #451a03;
   --mieweb-info: #0ea5e9;
   --mieweb-info-foreground: #ffffff;
   --mieweb-secondary-foreground: #ffffff;
@@ -103,7 +103,7 @@
   --mieweb-success: #16a34a;
   --mieweb-success-foreground: #fafafa;
   --mieweb-warning: #d97706;
-  --mieweb-warning-foreground: #fafafa;
+  --mieweb-warning-foreground: #451a03;
   --mieweb-info: #0284c7;
   --mieweb-info-foreground: #fafafa;
   --mieweb-secondary-foreground: #fafafa;

package/dist/brands/ozwell.js

@@ -1,3 +1,3 @@
-export { ozwellBrand } from '../chunk-4DJNHPHB.js';
+export { ozwellBrand } from '../chunk-IGWABMSM.js';
 //# sourceMappingURL=ozwell.js.map
 //# sourceMappingURL=ozwell.js.map

package/dist/brands/types.cjs

@@ -1,20 +1,20 @@
 'use strict';
 
-var chunkFFJVCQ5R_cjs = require('../chunk-FFJVCQ5R.cjs');
+var chunkJ644FU54_cjs = require('../chunk-J644FU54.cjs');
 
 
 
 Object.defineProperty(exports, "createBrandPreset", {
   enumerable: true,
-  get: function () { return chunkFFJVCQ5R_cjs.createBrandPreset; }
+  get: function () { return chunkJ644FU54_cjs.createBrandPreset; }
 });
 Object.defineProperty(exports, "generateBrandCSS", {
   enumerable: true,
-  get: function () { return chunkFFJVCQ5R_cjs.generateBrandCSS; }
+  get: function () { return chunkJ644FU54_cjs.generateBrandCSS; }
 });
 Object.defineProperty(exports, "generateTailwindTheme", {
   enumerable: true,
-  get: function () { return chunkFFJVCQ5R_cjs.generateTailwindTheme; }
+  get: function () { return chunkJ644FU54_cjs.generateTailwindTheme; }
 });
 //# sourceMappingURL=types.cjs.map
 //# sourceMappingURL=types.cjs.map

package/dist/brands/types.d.cts

@@ -62,6 +62,18 @@ interface SemanticColors {
 interface BrandColors {
     /** Primary brand color scale */
     primary: ColorScale;
+    /** Secondary color scale (optional — falls back to library defaults) */
+    secondary?: ColorScale;
+    /** Neutral / gray color scale (optional — falls back to library defaults) */
+    neutral?: ColorScale;
+    /** Destructive / error color scale (optional — falls back to library defaults) */
+    destructive?: ColorScale;
+    /** Success color scale (optional — falls back to library defaults) */
+    success?: ColorScale;
+    /** Warning color scale (optional — falls back to library defaults) */
+    warning?: ColorScale;
+    /** Info color scale (optional — falls back to library defaults) */
+    info?: ColorScale;
     /** Light mode semantic colors */
     light: SemanticColors;
     /** Dark mode semantic colors */
@@ -128,10 +140,7 @@ declare function generateBrandCSS(brand: BrandConfig): string;
  * Use this in your tailwind.config.js to apply the brand.
  */
 declare function generateTailwindTheme(brand: BrandConfig): {
-    colors: {
-        [brand.name]: ColorScale;
-        primary: ColorScale;
-    };
+    colors: Record<string, ColorScale>;
     fontFamily: {
         mono?: string[] | undefined;
         sans: string[];
@@ -159,10 +168,7 @@ declare function createBrandPreset(brand: BrandConfig): {
     darkMode: readonly ["class", "[data-theme=\"dark\"]"];
     theme: {
         extend: {
-            colors: {
-                [brand.name]: ColorScale;
-                primary: ColorScale;
-            };
+            colors: Record<string, ColorScale>;
             fontFamily: {
                 mono?: string[] | undefined;
                 sans: string[];

package/dist/brands/types.d.ts

@@ -62,6 +62,18 @@ interface SemanticColors {
 interface BrandColors {
     /** Primary brand color scale */
     primary: ColorScale;
+    /** Secondary color scale (optional — falls back to library defaults) */
+    secondary?: ColorScale;
+    /** Neutral / gray color scale (optional — falls back to library defaults) */
+    neutral?: ColorScale;
+    /** Destructive / error color scale (optional — falls back to library defaults) */
+    destructive?: ColorScale;
+    /** Success color scale (optional — falls back to library defaults) */
+    success?: ColorScale;
+    /** Warning color scale (optional — falls back to library defaults) */
+    warning?: ColorScale;
+    /** Info color scale (optional — falls back to library defaults) */
+    info?: ColorScale;
     /** Light mode semantic colors */
     light: SemanticColors;
     /** Dark mode semantic colors */
@@ -128,10 +140,7 @@ declare function generateBrandCSS(brand: BrandConfig): string;
  * Use this in your tailwind.config.js to apply the brand.
  */
 declare function generateTailwindTheme(brand: BrandConfig): {
-    colors: {
-        [brand.name]: ColorScale;
-        primary: ColorScale;
-    };
+    colors: Record<string, ColorScale>;
     fontFamily: {
         mono?: string[] | undefined;
         sans: string[];
@@ -159,10 +168,7 @@ declare function createBrandPreset(brand: BrandConfig): {
     darkMode: readonly ["class", "[data-theme=\"dark\"]"];
     theme: {
         extend: {
-            colors: {
-                [brand.name]: ColorScale;
-                primary: ColorScale;
-            };
+            colors: Record<string, ColorScale>;
             fontFamily: {
                 mono?: string[] | undefined;
                 sans: string[];

package/dist/brands/types.js

@@ -1,3 +1,3 @@
-export { createBrandPreset, generateBrandCSS, generateTailwindTheme } from '../chunk-SOFX4T7M.js';
+export { createBrandPreset, generateBrandCSS, generateTailwindTheme } from '../chunk-WOYUQ4AT.js';
 //# sourceMappingURL=types.js.map
 //# sourceMappingURL=types.js.map

package/dist/brands/waggleline.css

@@ -45,7 +45,7 @@
   --mieweb-border: #e5e7eb;
   --mieweb-input: #e5e7eb;
   --mieweb-ring: #17aeed;
-  --mieweb-destructive: #ef4444;
+  --mieweb-destructive: #dc2626;
   --mieweb-destructive-foreground: #ffffff;
   --mieweb-success: #009c4e;
   --mieweb-success-foreground: #ffffff;

package/dist/brands/webchart.css

@@ -34,16 +34,16 @@
   --mieweb-card: #ffffff;
   --mieweb-card-foreground: #171717;
   --mieweb-muted: #f5f5f5;
-  --mieweb-muted-foreground: #737373;
+  --mieweb-muted-foreground: #494949;
   --mieweb-border: #e5e7eb;
   --mieweb-input: #e5e7eb;
   --mieweb-ring: #f5841f;
-  --mieweb-destructive: #ef4444;
+  --mieweb-destructive: #dc2626;
   --mieweb-destructive-foreground: #ffffff;
-  --mieweb-success: #22c55e;
+  --mieweb-success: #15803d;
   --mieweb-success-foreground: #ffffff;
   --mieweb-warning: #f59e0b;
-  --mieweb-warning-foreground: #ffffff;
+  --mieweb-warning-foreground: #451a03;
   --mieweb-info: #0ea5e9;
   --mieweb-info-foreground: #ffffff;
   --mieweb-secondary-foreground: #ffffff;
@@ -94,7 +94,7 @@
   --mieweb-success: #16a34a;
   --mieweb-success-foreground: #fafafa;
   --mieweb-warning: #d97706;
-  --mieweb-warning-foreground: #fafafa;
+  --mieweb-warning-foreground: #451a03;
   --mieweb-info: #0284c7;
   --mieweb-info-foreground: #fafafa;
   --mieweb-secondary-foreground: #fafafa;

package/dist/{chunk-QDGZBDBI.cjs → chunk-2LF7PSSX.cjs}

@@ -30,7 +30,7 @@ var textVariants = classVarianceAuthority.cva("", {
     variant: {
       default: "text-foreground",
       muted: "text-muted-foreground",
-      primary: "text-primary-600 dark:text-primary-400",
+      primary: "text-primary-800 dark:text-primary-400",
       destructive: "text-destructive",
       success: "text-success",
       warning: "text-warning"
@@ -95,5 +95,5 @@ SmallMuted.displayName = "SmallMuted";
 exports.SmallMuted = SmallMuted;
 exports.Text = Text;
 exports.textVariants = textVariants;
-//# sourceMappingURL=chunk-QDGZBDBI.cjs.map
-//# sourceMappingURL=chunk-QDGZBDBI.cjs.map
+//# sourceMappingURL=chunk-2LF7PSSX.cjs.map
+//# sourceMappingURL=chunk-2LF7PSSX.cjs.map

package/dist/{chunk-QDGZBDBI.cjs.map → chunk-2LF7PSSX.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Text/Text.tsx"],"names":["cva","React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,IAAM,YAAA,GAAeA,2BAAI,EAAA,EAAI;AAAA,EAC3B,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,OAAA,EAAS,iBAAA;AAAA,MACT,KAAA,EAAO,uBAAA;AAAA,MACP,OAAA,EAAS,wCAAA;AAAA,MACT,WAAA,EAAa,kBAAA;AAAA,MACb,OAAA,EAAS,cAAA;AAAA,MACT,OAAA,EAAS;AAAA,KACX;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,IAAA,EAAM,WAAA;AAAA,MACN,EAAA,EAAI,SAAA;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,KAAA,EAAO,UAAA;AAAA,MACP,KAAA,EAAO;AAAA,KACT;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,MAAA,EAAQ,aAAA;AAAA,MACR,MAAA,EAAQ,aAAA;AAAA,MACR,QAAA,EAAU,eAAA;AAAA,MACV,IAAA,EAAM;AAAA,KACR;AAAA,IACA,KAAA,EAAO;AAAA,MACL,IAAA,EAAM,WAAA;AAAA,MACN,MAAA,EAAQ,aAAA;AAAA,MACR,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,OAAA,EAAS,SAAA;AAAA,IACT,IAAA,EAAM,MAAA;AAAA,IACN,MAAA,EAAQ,QAAA;AAAA,IACR,KAAA,EAAO;AAAA;AAEX,CAAC;AAgCD,IAAM,IAAA,GAAaC,gBAAA,CAAA,UAAA;AAAA,EACjB,CACE;AAAA,IACE,SAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAI,SAAA,GAAY,GAAA;AAAA,IAChB,QAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,uBACEC,cAAA;AAAA,MAAC,SAAA;AAAA,MAAA;AAAA,QAEC,GAAA;AAAA,QACA,SAAA,EAAWC,oBAAA;AAAA,UACT,aAAa,EAAE,OAAA,EAAS,IAAA,EAAM,MAAA,EAAQ,OAAO,CAAA;AAAA,UAC7C,QAAA,IAAY,UAAA;AAAA,UACZ;AAAA,SACF;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,IAAA,CAAK,WAAA,GAAc,MAAA;AAMnB,IAAM,aAAmBF,gBAAA,CAAA,UAAA,CAGvB,CAAC,EAAE,SAAA,EAAW,GAAG,OAAM,EAAG,GAAA,oCACzB,IAAA,EAAA,EAAK,GAAA,EAAU,SAAQ,OAAA,EAAQ,IAAA,EAAK,MAAK,SAAA,EAAuB,GAAG,OAAO,CAC5E;AAED,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-QDGZBDBI.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst textVariants = cva('', {\n  variants: {\n    variant: {\n      default: 'text-foreground',\n      muted: 'text-muted-foreground',\n      primary: 'text-primary-600 dark:text-primary-400',\n      destructive: 'text-destructive',\n      success: 'text-success',\n      warning: 'text-warning',\n    },\n    size: {\n      xs: 'text-xs',\n      sm: 'text-sm',\n      base: 'text-base',\n      lg: 'text-lg',\n      xl: 'text-xl',\n      '2xl': 'text-2xl',\n      '3xl': 'text-3xl',\n    },\n    weight: {\n      normal: 'font-normal',\n      medium: 'font-medium',\n      semibold: 'font-semibold',\n      bold: 'font-bold',\n    },\n    align: {\n      left: 'text-left',\n      center: 'text-center',\n      right: 'text-right',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    size: 'base',\n    weight: 'normal',\n    align: 'left',\n  },\n});\n\ntype TextElement =\n  | 'p'\n  | 'span'\n  | 'div'\n  | 'label'\n  | 'h1'\n  | 'h2'\n  | 'h3'\n  | 'h4'\n  | 'h5'\n  | 'h6';\n\nexport interface TextProps\n  extends React.HTMLAttributes<HTMLElement>, VariantProps<typeof textVariants> {\n  /** HTML element to render as */\n  as?: TextElement;\n  /** Truncate text with ellipsis */\n  truncate?: boolean;\n}\n\n/**\n * A flexible text component for consistent typography.\n *\n * @example\n * ```tsx\n * <Text variant=\"muted\" size=\"sm\">Helper text</Text>\n * <Text as=\"h1\" size=\"3xl\" weight=\"bold\">Page Title</Text>\n * <Text variant=\"destructive\">Error message</Text>\n * ```\n */\nconst Text = React.forwardRef<HTMLElement, TextProps>(\n  (\n    {\n      className,\n      variant,\n      size,\n      weight,\n      align,\n      as: Component = 'p',\n      truncate,\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <Component\n        // @ts-expect-error - ref type is complex due to polymorphic component\n        ref={ref}\n        className={cn(\n          textVariants({ variant, size, weight, align }),\n          truncate && 'truncate',\n          className\n        )}\n        {...props}\n      />\n    );\n  }\n);\n\nText.displayName = 'Text';\n\n/**\n * Small muted text, useful for helper text and descriptions.\n * This is a convenience component equivalent to <Text variant=\"muted\" size=\"sm\">\n */\nconst SmallMuted = React.forwardRef<\n  HTMLElement,\n  Omit<TextProps, 'variant' | 'size'>\n>(({ className, ...props }, ref) => (\n  <Text ref={ref} variant=\"muted\" size=\"sm\" className={className} {...props} />\n));\n\nSmallMuted.displayName = 'SmallMuted';\n\nexport { Text, SmallMuted, textVariants };\n"]}
+{"version":3,"sources":["../src/components/Text/Text.tsx"],"names":["cva","React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,IAAM,YAAA,GAAeA,2BAAI,EAAA,EAAI;AAAA,EAC3B,QAAA,EAAU;AAAA,IACR,OAAA,EAAS;AAAA,MACP,OAAA,EAAS,iBAAA;AAAA,MACT,KAAA,EAAO,uBAAA;AAAA,MACP,OAAA,EAAS,wCAAA;AAAA,MACT,WAAA,EAAa,kBAAA;AAAA,MACb,OAAA,EAAS,cAAA;AAAA,MACT,OAAA,EAAS;AAAA,KACX;AAAA,IACA,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,IAAA,EAAM,WAAA;AAAA,MACN,EAAA,EAAI,SAAA;AAAA,MACJ,EAAA,EAAI,SAAA;AAAA,MACJ,KAAA,EAAO,UAAA;AAAA,MACP,KAAA,EAAO;AAAA,KACT;AAAA,IACA,MAAA,EAAQ;AAAA,MACN,MAAA,EAAQ,aAAA;AAAA,MACR,MAAA,EAAQ,aAAA;AAAA,MACR,QAAA,EAAU,eAAA;AAAA,MACV,IAAA,EAAM;AAAA,KACR;AAAA,IACA,KAAA,EAAO;AAAA,MACL,IAAA,EAAM,WAAA;AAAA,MACN,MAAA,EAAQ,aAAA;AAAA,MACR,KAAA,EAAO;AAAA;AACT,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,OAAA,EAAS,SAAA;AAAA,IACT,IAAA,EAAM,MAAA;AAAA,IACN,MAAA,EAAQ,QAAA;AAAA,IACR,KAAA,EAAO;AAAA;AAEX,CAAC;AAgCD,IAAM,IAAA,GAAaC,gBAAA,CAAA,UAAA;AAAA,EACjB,CACE;AAAA,IACE,SAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAI,SAAA,GAAY,GAAA;AAAA,IAChB,QAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,uBACEC,cAAA;AAAA,MAAC,SAAA;AAAA,MAAA;AAAA,QAEC,GAAA;AAAA,QACA,SAAA,EAAWC,oBAAA;AAAA,UACT,aAAa,EAAE,OAAA,EAAS,IAAA,EAAM,MAAA,EAAQ,OAAO,CAAA;AAAA,UAC7C,QAAA,IAAY,UAAA;AAAA,UACZ;AAAA,SACF;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AAEA,IAAA,CAAK,WAAA,GAAc,MAAA;AAMnB,IAAM,aAAmBF,gBAAA,CAAA,UAAA,CAGvB,CAAC,EAAE,SAAA,EAAW,GAAG,OAAM,EAAG,GAAA,oCACzB,IAAA,EAAA,EAAK,GAAA,EAAU,SAAQ,OAAA,EAAQ,IAAA,EAAK,MAAK,SAAA,EAAuB,GAAG,OAAO,CAC5E;AAED,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-2LF7PSSX.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst textVariants = cva('', {\n  variants: {\n    variant: {\n      default: 'text-foreground',\n      muted: 'text-muted-foreground',\n      primary: 'text-primary-800 dark:text-primary-400',\n      destructive: 'text-destructive',\n      success: 'text-success',\n      warning: 'text-warning',\n    },\n    size: {\n      xs: 'text-xs',\n      sm: 'text-sm',\n      base: 'text-base',\n      lg: 'text-lg',\n      xl: 'text-xl',\n      '2xl': 'text-2xl',\n      '3xl': 'text-3xl',\n    },\n    weight: {\n      normal: 'font-normal',\n      medium: 'font-medium',\n      semibold: 'font-semibold',\n      bold: 'font-bold',\n    },\n    align: {\n      left: 'text-left',\n      center: 'text-center',\n      right: 'text-right',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    size: 'base',\n    weight: 'normal',\n    align: 'left',\n  },\n});\n\ntype TextElement =\n  | 'p'\n  | 'span'\n  | 'div'\n  | 'label'\n  | 'h1'\n  | 'h2'\n  | 'h3'\n  | 'h4'\n  | 'h5'\n  | 'h6';\n\nexport interface TextProps\n  extends React.HTMLAttributes<HTMLElement>, VariantProps<typeof textVariants> {\n  /** HTML element to render as */\n  as?: TextElement;\n  /** Truncate text with ellipsis */\n  truncate?: boolean;\n}\n\n/**\n * A flexible text component for consistent typography.\n *\n * @example\n * ```tsx\n * <Text variant=\"muted\" size=\"sm\">Helper text</Text>\n * <Text as=\"h1\" size=\"3xl\" weight=\"bold\">Page Title</Text>\n * <Text variant=\"destructive\">Error message</Text>\n * ```\n */\nconst Text = React.forwardRef<HTMLElement, TextProps>(\n  (\n    {\n      className,\n      variant,\n      size,\n      weight,\n      align,\n      as: Component = 'p',\n      truncate,\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <Component\n        // @ts-expect-error - ref type is complex due to polymorphic component\n        ref={ref}\n        className={cn(\n          textVariants({ variant, size, weight, align }),\n          truncate && 'truncate',\n          className\n        )}\n        {...props}\n      />\n    );\n  }\n);\n\nText.displayName = 'Text';\n\n/**\n * Small muted text, useful for helper text and descriptions.\n * This is a convenience component equivalent to <Text variant=\"muted\" size=\"sm\">\n */\nconst SmallMuted = React.forwardRef<\n  HTMLElement,\n  Omit<TextProps, 'variant' | 'size'>\n>(({ className, ...props }, ref) => (\n  <Text ref={ref} variant=\"muted\" size=\"sm\" className={className} {...props} />\n));\n\nSmallMuted.displayName = 'SmallMuted';\n\nexport { Text, SmallMuted, textVariants };\n"]}

package/dist/{chunk-OWPWP46L.js → chunk-2NTYAALC.js}

@@ -30,7 +30,7 @@ var wagglelineBrand = {
       border: "#e5e7eb",
       input: "#e5e7eb",
       ring: "#17AEED",
-      destructive: "#ef4444",
+      destructive: "#dc2626",
       destructiveForeground: "#ffffff",
       success: "#009C4E",
       // Brand green
@@ -88,5 +88,5 @@ var wagglelineBrand = {
 };
 
 export { wagglelineBrand };
-//# sourceMappingURL=chunk-OWPWP46L.js.map
-//# sourceMappingURL=chunk-OWPWP46L.js.map
+//# sourceMappingURL=chunk-2NTYAALC.js.map
+//# sourceMappingURL=chunk-2NTYAALC.js.map

package/dist/{chunk-OWPWP46L.js.map → chunk-2NTYAALC.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/brands/waggleline.ts"],"names":[],"mappings":";AA2BO,IAAM,eAAA,GAA+B;AAAA,EAC1C,IAAA,EAAM,YAAA;AAAA,EACN,WAAA,EAAa,YAAA;AAAA,EACb,WAAA,EACE,2EAAA;AAAA,EAEF,MAAA,EAAQ;AAAA;AAAA,IAEN,OAAA,EAAS;AAAA,MACP,EAAA,EAAI,SAAA;AAAA,MACJ,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK;AAAA,KACP;AAAA;AAAA,IAGA,KAAA,EAAO;AAAA,MACL,UAAA,EAAY,SAAA;AAAA;AAAA,MACZ,UAAA,EAAY,SAAA;AAAA,MACZ,IAAA,EAAM,SAAA;AAAA,MACN,cAAA,EAAgB,SAAA;AAAA,MAChB,KAAA,EAAO,SAAA;AAAA,MACP,eAAA,EAAiB,SAAA;AAAA,MACjB,MAAA,EAAQ,SAAA;AAAA,MACR,KAAA,EAAO,SAAA;AAAA,MACP,IAAA,EAAM,SAAA;AAAA,MACN,WAAA,EAAa,SAAA;AAAA,MACb,qBAAA,EAAuB,SAAA;AAAA,MACvB,OAAA,EAAS,SAAA;AAAA;AAAA,MACT,iBAAA,EAAmB,SAAA;AAAA,MACnB,OAAA,EAAS,SAAA;AAAA;AAAA,MACT,iBAAA,EAAmB;AAAA,KACrB;AAAA;AAAA,IAGA,IAAA,EAAM;AAAA,MACJ,UAAA,EAAY,SAAA;AAAA;AAAA,MACZ,UAAA,EAAY,SAAA;AAAA,MACZ,IAAA,EAAM,SAAA;AAAA;AAAA,MACN,cAAA,EAAgB,SAAA;AAAA,MAChB,KAAA,EAAO,SAAA;AAAA;AAAA,MACP,eAAA,EAAiB,SAAA;AAAA,MACjB,MAAA,EAAQ,SAAA;AAAA,MACR,KAAA,EAAO,SAAA;AAAA,MACP,IAAA,EAAM,SAAA;AAAA,MACN,WAAA,EAAa,SAAA;AAAA,MACb,qBAAA,EAAuB,SAAA;AAAA,MACvB,OAAA,EAAS,SAAA;AAAA;AAAA,MACT,iBAAA,EAAmB,SAAA;AAAA,MACnB,OAAA,EAAS,SAAA;AAAA;AAAA,MACT,iBAAA,EAAmB;AAAA;AACrB,GACF;AAAA,EAEA,UAAA,EAAY;AAAA,IACV,UAAA,EAAY;AAAA,MACV,IAAA,EAAM,CAAC,OAAA,EAAS,eAAA,EAAiB,aAAa,YAAY,CAAA;AAAA,MAC1D,IAAA,EAAM,CAAC,cAAA,EAAgB,gBAAA,EAAkB,SAAS,WAAW;AAAA;AAC/D,GACF;AAAA,EAEA,YAAA,EAAc;AAAA,IACZ,IAAA,EAAM,GAAA;AAAA,IACN,EAAA,EAAI,SAAA;AAAA,IACJ,EAAA,EAAI,QAAA;AAAA,IACJ,EAAA,EAAI,SAAA;AAAA,IACJ,EAAA,EAAI,MAAA;AAAA,IACJ,KAAA,EAAO,QAAA;AAAA,IACP,IAAA,EAAM;AAAA,GACR;AAAA,EAEA,SAAA,EAAW;AAAA,IACT,IAAA,EAAM,uEAAA;AAAA;AAAA,IACN,QAAA,EACE,kEAAA;AAAA,IACF,KAAA,EACE;AAAA;AAAA;AAEN","file":"chunk-OWPWP46L.js","sourcesContent":["/**\n * Waggleline Brand Configuration\n *\n * The official brand theme for Waggleline.\n * Primary color: #17AEED (Waggleline Blue)\n *\n * Waggleline is an experience visualization and orchestration platform\n * that maps relationships, signals, handoffs, dependencies, and momentum\n * across the customer journey.\n *\n * Brand colors from MIE Brand Guide:\n * - Blue (#17AEED): Primary actions, momentum\n * - Green (#009C4E): MIE core platform, success, completions\n * - Orange (#E04501): WebChart workflow, urgency\n * - Yellow (#FFD200): Enterprise Health, readiness, highlights\n * - Purple (#8B5CF6): Ozwell AI, intelligence\n */\n\nimport type { BrandConfig } from './types';\n\n/**\n * Waggleline brand configuration.\n * This defines all the design tokens used in Waggleline applications.\n *\n * Note: Dark mode uses charcoal tones (gray-900 based), not pure black,\n * following Waggleline's design philosophy.\n */\nexport const wagglelineBrand: BrandConfig = {\n  name: 'waggleline',\n  displayName: 'Waggleline',\n  description:\n    'Experience visualization and orchestration platform for customer journeys',\n\n  colors: {\n    // Primary color scale - Waggleline Blue (#17AEED)\n    primary: {\n      50: '#E6F7FF',\n      100: '#BAE7FF',\n      200: '#91D5FF',\n      300: '#69C0FF',\n      400: '#40A9FF',\n      500: '#17AEED',\n      600: '#00A4EB',\n      700: '#0084C8',\n      800: '#006AA5',\n      900: '#004D7A',\n      950: '#003355',\n    },\n\n    // Light mode semantic colors\n    light: {\n      background: '#fafafa', // gray-50 equivalent\n      foreground: '#1a1a1a',\n      card: '#ffffff',\n      cardForeground: '#1a1a1a',\n      muted: '#f5f5f5',\n      mutedForeground: '#6b7280',\n      border: '#e5e7eb',\n      input: '#e5e7eb',\n      ring: '#17AEED',\n      destructive: '#ef4444',\n      destructiveForeground: '#ffffff',\n      success: '#009C4E', // Brand green\n      successForeground: '#ffffff',\n      warning: '#FFD200', // Brand yellow\n      warningForeground: '#1a1a1a',\n    },\n\n    // Dark mode semantic colors (charcoal-based, not pure black)\n    dark: {\n      background: '#1F2937', // panel.DEFAULT - charcoal\n      foreground: '#f9fafb',\n      card: '#2D3748', // panel.card\n      cardForeground: '#f9fafb',\n      muted: '#374151', // panel.elevated\n      mutedForeground: '#9ca3af',\n      border: '#374151',\n      input: '#374151',\n      ring: '#17AEED',\n      destructive: '#dc2626',\n      destructiveForeground: '#f9fafb',\n      success: '#009C4E', // Brand green\n      successForeground: '#f9fafb',\n      warning: '#FFD200', // Brand yellow\n      warningForeground: '#1a1a1a',\n    },\n  },\n\n  typography: {\n    fontFamily: {\n      sans: ['Inter', 'ui-sans-serif', 'system-ui', 'sans-serif'],\n      mono: ['ui-monospace', 'SFMono-Regular', 'Menlo', 'monospace'],\n    },\n  },\n\n  borderRadius: {\n    none: '0',\n    sm: '0.25rem',\n    md: '0.5rem',\n    lg: '0.75rem',\n    xl: '1rem',\n    '2xl': '1.5rem',\n    full: '9999px',\n  },\n\n  boxShadow: {\n    card: '0 2px 8px -2px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.06)', // soft\n    dropdown:\n      '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)',\n    modal:\n      '0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.08)', // soft-lg\n  },\n};\n\nexport { wagglelineBrand as default };\n"]}
+{"version":3,"sources":["../src/brands/waggleline.ts"],"names":[],"mappings":";AA2BO,IAAM,eAAA,GAA+B;AAAA,EAC1C,IAAA,EAAM,YAAA;AAAA,EACN,WAAA,EAAa,YAAA;AAAA,EACb,WAAA,EACE,2EAAA;AAAA,EAEF,MAAA,EAAQ;AAAA;AAAA,IAEN,OAAA,EAAS;AAAA,MACP,EAAA,EAAI,SAAA;AAAA,MACJ,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK,SAAA;AAAA,MACL,GAAA,EAAK;AAAA,KACP;AAAA;AAAA,IAGA,KAAA,EAAO;AAAA,MACL,UAAA,EAAY,SAAA;AAAA;AAAA,MACZ,UAAA,EAAY,SAAA;AAAA,MACZ,IAAA,EAAM,SAAA;AAAA,MACN,cAAA,EAAgB,SAAA;AAAA,MAChB,KAAA,EAAO,SAAA;AAAA,MACP,eAAA,EAAiB,SAAA;AAAA,MACjB,MAAA,EAAQ,SAAA;AAAA,MACR,KAAA,EAAO,SAAA;AAAA,MACP,IAAA,EAAM,SAAA;AAAA,MACN,WAAA,EAAa,SAAA;AAAA,MACb,qBAAA,EAAuB,SAAA;AAAA,MACvB,OAAA,EAAS,SAAA;AAAA;AAAA,MACT,iBAAA,EAAmB,SAAA;AAAA,MACnB,OAAA,EAAS,SAAA;AAAA;AAAA,MACT,iBAAA,EAAmB;AAAA,KACrB;AAAA;AAAA,IAGA,IAAA,EAAM;AAAA,MACJ,UAAA,EAAY,SAAA;AAAA;AAAA,MACZ,UAAA,EAAY,SAAA;AAAA,MACZ,IAAA,EAAM,SAAA;AAAA;AAAA,MACN,cAAA,EAAgB,SAAA;AAAA,MAChB,KAAA,EAAO,SAAA;AAAA;AAAA,MACP,eAAA,EAAiB,SAAA;AAAA,MACjB,MAAA,EAAQ,SAAA;AAAA,MACR,KAAA,EAAO,SAAA;AAAA,MACP,IAAA,EAAM,SAAA;AAAA,MACN,WAAA,EAAa,SAAA;AAAA,MACb,qBAAA,EAAuB,SAAA;AAAA,MACvB,OAAA,EAAS,SAAA;AAAA;AAAA,MACT,iBAAA,EAAmB,SAAA;AAAA,MACnB,OAAA,EAAS,SAAA;AAAA;AAAA,MACT,iBAAA,EAAmB;AAAA;AACrB,GACF;AAAA,EAEA,UAAA,EAAY;AAAA,IACV,UAAA,EAAY;AAAA,MACV,IAAA,EAAM,CAAC,OAAA,EAAS,eAAA,EAAiB,aAAa,YAAY,CAAA;AAAA,MAC1D,IAAA,EAAM,CAAC,cAAA,EAAgB,gBAAA,EAAkB,SAAS,WAAW;AAAA;AAC/D,GACF;AAAA,EAEA,YAAA,EAAc;AAAA,IACZ,IAAA,EAAM,GAAA;AAAA,IACN,EAAA,EAAI,SAAA;AAAA,IACJ,EAAA,EAAI,QAAA;AAAA,IACJ,EAAA,EAAI,SAAA;AAAA,IACJ,EAAA,EAAI,MAAA;AAAA,IACJ,KAAA,EAAO,QAAA;AAAA,IACP,IAAA,EAAM;AAAA,GACR;AAAA,EAEA,SAAA,EAAW;AAAA,IACT,IAAA,EAAM,uEAAA;AAAA;AAAA,IACN,QAAA,EACE,kEAAA;AAAA,IACF,KAAA,EACE;AAAA;AAAA;AAEN","file":"chunk-2NTYAALC.js","sourcesContent":["/**\n * Waggleline Brand Configuration\n *\n * The official brand theme for Waggleline.\n * Primary color: #17AEED (Waggleline Blue)\n *\n * Waggleline is an experience visualization and orchestration platform\n * that maps relationships, signals, handoffs, dependencies, and momentum\n * across the customer journey.\n *\n * Brand colors from MIE Brand Guide:\n * - Blue (#17AEED): Primary actions, momentum\n * - Green (#009C4E): MIE core platform, success, completions\n * - Orange (#E04501): WebChart workflow, urgency\n * - Yellow (#FFD200): Enterprise Health, readiness, highlights\n * - Purple (#8B5CF6): Ozwell AI, intelligence\n */\n\nimport type { BrandConfig } from './types';\n\n/**\n * Waggleline brand configuration.\n * This defines all the design tokens used in Waggleline applications.\n *\n * Note: Dark mode uses charcoal tones (gray-900 based), not pure black,\n * following Waggleline's design philosophy.\n */\nexport const wagglelineBrand: BrandConfig = {\n  name: 'waggleline',\n  displayName: 'Waggleline',\n  description:\n    'Experience visualization and orchestration platform for customer journeys',\n\n  colors: {\n    // Primary color scale - Waggleline Blue (#17AEED)\n    primary: {\n      50: '#E6F7FF',\n      100: '#BAE7FF',\n      200: '#91D5FF',\n      300: '#69C0FF',\n      400: '#40A9FF',\n      500: '#17AEED',\n      600: '#00A4EB',\n      700: '#0084C8',\n      800: '#006AA5',\n      900: '#004D7A',\n      950: '#003355',\n    },\n\n    // Light mode semantic colors\n    light: {\n      background: '#fafafa', // gray-50 equivalent\n      foreground: '#1a1a1a',\n      card: '#ffffff',\n      cardForeground: '#1a1a1a',\n      muted: '#f5f5f5',\n      mutedForeground: '#6b7280',\n      border: '#e5e7eb',\n      input: '#e5e7eb',\n      ring: '#17AEED',\n      destructive: '#dc2626',\n      destructiveForeground: '#ffffff',\n      success: '#009C4E', // Brand green\n      successForeground: '#ffffff',\n      warning: '#FFD200', // Brand yellow\n      warningForeground: '#1a1a1a',\n    },\n\n    // Dark mode semantic colors (charcoal-based, not pure black)\n    dark: {\n      background: '#1F2937', // panel.DEFAULT - charcoal\n      foreground: '#f9fafb',\n      card: '#2D3748', // panel.card\n      cardForeground: '#f9fafb',\n      muted: '#374151', // panel.elevated\n      mutedForeground: '#9ca3af',\n      border: '#374151',\n      input: '#374151',\n      ring: '#17AEED',\n      destructive: '#dc2626',\n      destructiveForeground: '#f9fafb',\n      success: '#009C4E', // Brand green\n      successForeground: '#f9fafb',\n      warning: '#FFD200', // Brand yellow\n      warningForeground: '#1a1a1a',\n    },\n  },\n\n  typography: {\n    fontFamily: {\n      sans: ['Inter', 'ui-sans-serif', 'system-ui', 'sans-serif'],\n      mono: ['ui-monospace', 'SFMono-Regular', 'Menlo', 'monospace'],\n    },\n  },\n\n  borderRadius: {\n    none: '0',\n    sm: '0.25rem',\n    md: '0.5rem',\n    lg: '0.75rem',\n    xl: '1rem',\n    '2xl': '1.5rem',\n    full: '9999px',\n  },\n\n  boxShadow: {\n    card: '0 2px 8px -2px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.06)', // soft\n    dropdown:\n      '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)',\n    modal:\n      '0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.08)', // soft-lg\n  },\n};\n\nexport { wagglelineBrand as default };\n"]}

package/dist/{chunk-NAATBUHR.cjs → chunk-2VCAWAPC.cjs}

@@ -46,7 +46,7 @@ var progressBarFillVariants = classVarianceAuthority.cva(
   {
     variants: {
       variant: {
-        default: "bg-primary-500",
+        default: "bg-primary-800",
         success: "bg-green-500",
         warning: "bg-yellow-500",
         danger: "bg-red-500"
@@ -88,21 +88,37 @@ function Progress({
   const percentage = Math.min(Math.max(value / max * 100, 0), 100);
   const progressId = React__namespace.useId();
   const displayValue = formatValue ? formatValue(value, max) : `${Math.round(percentage)}%`;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkOR5DRJCW_cjs.cn("w-full", className), children: [
-    (label || showValue) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-1.5 flex items-center justify-between", children: [
-      label && /* @__PURE__ */ jsxRuntime.jsx(
-        "label",
-        {
-          id: `${progressId}-label`,
-          className: "text-foreground text-sm font-medium",
-          children: label
-        }
-      ),
-      showValue && !indeterminate && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-sm", children: displayValue })
-    ] }),
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-slot": "progress", className: chunkOR5DRJCW_cjs.cn("w-full", className), children: [
+    (label || showValue) && /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        "data-slot": "progress-label-row",
+        className: "mb-1.5 flex items-center justify-between",
+        children: [
+          label && /* @__PURE__ */ jsxRuntime.jsx(
+            "label",
+            {
+              "data-slot": "progress-label",
+              id: `${progressId}-label`,
+              className: "text-foreground text-sm font-medium",
+              children: label
+            }
+          ),
+          showValue && !indeterminate && /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              "data-slot": "progress-value",
+              className: "text-sm text-neutral-600 dark:text-neutral-400",
+              children: displayValue
+            }
+          )
+        ]
+      }
+    ),
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
+        "data-slot": "progress-track",
         role: "progressbar",
         "aria-valuenow": indeterminate ? void 0 : value,
         "aria-valuemin": 0,
@@ -113,10 +129,11 @@ function Progress({
         children: /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
+            "data-slot": "progress-fill",
             className: chunkOR5DRJCW_cjs.cn(
               progressBarFillVariants({ variant, animated, striped }),
               indeterminate && "w-1/3 animate-[indeterminate_1.5s_ease-in-out_infinite]",
-              !striped && variant === "default" && "bg-primary-500",
+              !striped && variant === "default" && "bg-primary-800",
               !striped && variant === "success" && "bg-green-500",
               !striped && variant === "warning" && "bg-yellow-500",
               !striped && variant === "danger" && "bg-red-500"
@@ -167,6 +184,7 @@ function CircularProgress({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
+      "data-slot": "circular-progress",
       role: "progressbar",
       "aria-valuenow": indeterminate ? void 0 : value,
       "aria-valuemin": 0,
@@ -212,10 +230,17 @@ function CircularProgress({
             ]
           }
         ),
-        showValue && !indeterminate && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-foreground absolute inset-0 flex items-center justify-center text-xs font-medium", children: [
-          Math.round(percentage),
-          "%"
-        ] })
+        showValue && !indeterminate && /* @__PURE__ */ jsxRuntime.jsxs(
+          "span",
+          {
+            "data-slot": "circular-progress-value",
+            className: "text-foreground absolute inset-0 flex items-center justify-center text-xs font-medium",
+            children: [
+              Math.round(percentage),
+              "%"
+            ]
+          }
+        )
       ]
     }
   );
@@ -227,5 +252,5 @@ exports.Progress = Progress;
 exports.circularProgressVariants = circularProgressVariants;
 exports.progressBarFillVariants = progressBarFillVariants;
 exports.progressBarTrackVariants = progressBarTrackVariants;
-//# sourceMappingURL=chunk-NAATBUHR.cjs.map
-//# sourceMappingURL=chunk-NAATBUHR.cjs.map
+//# sourceMappingURL=chunk-2VCAWAPC.cjs.map
+//# sourceMappingURL=chunk-2VCAWAPC.cjs.map

package/dist/chunk-2VCAWAPC.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Progress/Progress.tsx"],"names":["cva","React","jsxs","cn","jsx"],"mappings":"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","file":"chunk-2VCAWAPC.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\n// ============================================================================\n// Progress Bar Variants\n// ============================================================================\n\nconst progressBarTrackVariants = cva(\n  ['w-full overflow-hidden rounded-full bg-neutral-200 dark:bg-neutral-700'],\n  {\n    variants: {\n      size: {\n        sm: 'h-1',\n        md: 'h-2',\n        lg: 'h-3',\n        xl: 'h-4',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nconst progressBarFillVariants = cva(\n  ['h-full rounded-full transition-all duration-300 ease-out'],\n  {\n    variants: {\n      variant: {\n        default: 'bg-primary-800',\n        success: 'bg-green-500',\n        warning: 'bg-yellow-500',\n        danger: 'bg-red-500',\n      },\n      animated: {\n        true: 'animate-pulse',\n        false: '',\n      },\n      striped: {\n        true: [\n          'bg-gradient-to-r',\n          'from-transparent via-white/20 to-transparent',\n          'bg-[length:1rem_100%]',\n          'animate-[progress-stripes_1s_linear_infinite]',\n        ],\n        false: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      animated: false,\n      striped: false,\n    },\n  }\n);\n\n// ============================================================================\n// Progress Bar Component\n// ============================================================================\n\nexport interface ProgressProps\n  extends\n    VariantProps<typeof progressBarTrackVariants>,\n    VariantProps<typeof progressBarFillVariants> {\n  /** Current progress value (0-100) */\n  value: number;\n  /** Maximum value (default: 100) */\n  max?: number;\n  /** Label for the progress bar */\n  label?: string;\n  /** Show the percentage value */\n  showValue?: boolean;\n  /** Format the displayed value */\n  formatValue?: (value: number, max: number) => string;\n  /** Additional class name */\n  className?: string;\n  /** Whether the progress is indeterminate */\n  indeterminate?: boolean;\n}\n\n/**\n * A progress bar component for showing completion status.\n *\n * @example\n * ```tsx\n * <Progress value={60} />\n * <Progress value={75} showValue label=\"Upload progress\" />\n * <Progress value={30} variant=\"success\" striped />\n * ```\n */\nfunction Progress({\n  value,\n  max = 100,\n  label,\n  showValue = false,\n  formatValue,\n  size,\n  variant,\n  animated,\n  striped,\n  className,\n  indeterminate = false,\n}: ProgressProps) {\n  const percentage = Math.min(Math.max((value / max) * 100, 0), 100);\n  const progressId = React.useId();\n\n  const displayValue = formatValue\n    ? formatValue(value, max)\n    : `${Math.round(percentage)}%`;\n\n  return (\n    <div data-slot=\"progress\" className={cn('w-full', className)}>\n      {(label || showValue) && (\n        <div\n          data-slot=\"progress-label-row\"\n          className=\"mb-1.5 flex items-center justify-between\"\n        >\n          {label && (\n            <label\n              data-slot=\"progress-label\"\n              id={`${progressId}-label`}\n              className=\"text-foreground text-sm font-medium\"\n            >\n              {label}\n            </label>\n          )}\n          {showValue && !indeterminate && (\n            <span\n              data-slot=\"progress-value\"\n              className=\"text-sm text-neutral-600 dark:text-neutral-400\"\n            >\n              {displayValue}\n            </span>\n          )}\n        </div>\n      )}\n      <div\n        data-slot=\"progress-track\"\n        role=\"progressbar\"\n        aria-valuenow={indeterminate ? undefined : value}\n        aria-valuemin={0}\n        aria-valuemax={max}\n        aria-labelledby={label ? `${progressId}-label` : undefined}\n        aria-label={!label ? 'Progress' : undefined}\n        className={cn(progressBarTrackVariants({ size }))}\n      >\n        <div\n          data-slot=\"progress-fill\"\n          className={cn(\n            progressBarFillVariants({ variant, animated, striped }),\n            indeterminate &&\n              'w-1/3 animate-[indeterminate_1.5s_ease-in-out_infinite]',\n            !striped && variant === 'default' && 'bg-primary-800',\n            !striped && variant === 'success' && 'bg-green-500',\n            !striped && variant === 'warning' && 'bg-yellow-500',\n            !striped && variant === 'danger' && 'bg-red-500'\n          )}\n          style={indeterminate ? undefined : { width: `${percentage}%` }}\n        />\n      </div>\n    </div>\n  );\n}\n\nProgress.displayName = 'Progress';\n\n// ============================================================================\n// Circular Progress Variants\n// ============================================================================\n\nconst circularProgressVariants = cva(['relative inline-flex'], {\n  variants: {\n    size: {\n      sm: 'h-8 w-8',\n      md: 'h-12 w-12',\n      lg: 'h-16 w-16',\n      xl: 'h-24 w-24',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\n// ============================================================================\n// Circular Progress Component\n// ============================================================================\n\nexport interface CircularProgressProps extends VariantProps<\n  typeof circularProgressVariants\n> {\n  /** Current progress value (0-100) */\n  value: number;\n  /** Maximum value (default: 100) */\n  max?: number;\n  /** Color variant */\n  variant?: 'default' | 'success' | 'warning' | 'danger';\n  /** Stroke width */\n  strokeWidth?: number;\n  /** Show the percentage value in the center */\n  showValue?: boolean;\n  /** Whether the progress is indeterminate */\n  indeterminate?: boolean;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * A circular progress indicator component.\n *\n * @example\n * ```tsx\n * <CircularProgress value={75} showValue />\n * <CircularProgress value={50} variant=\"success\" size=\"lg\" />\n * ```\n */\nfunction CircularProgress({\n  value,\n  max = 100,\n  variant = 'default',\n  size,\n  strokeWidth = 4,\n  showValue = false,\n  indeterminate = false,\n  className,\n}: CircularProgressProps) {\n  const percentage = Math.min(Math.max((value / max) * 100, 0), 100);\n\n  // SVG calculations\n  const sizeMap = { sm: 32, md: 48, lg: 64, xl: 96 };\n  const svgSize = sizeMap[size || 'md'];\n  const radius = (svgSize - strokeWidth) / 2;\n  const circumference = 2 * Math.PI * radius;\n  const offset = circumference - (percentage / 100) * circumference;\n\n  const variantColors = {\n    default: 'stroke-primary-500',\n    success: 'stroke-green-500',\n    warning: 'stroke-yellow-500',\n    danger: 'stroke-red-500',\n  };\n\n  return (\n    <div\n      data-slot=\"circular-progress\"\n      role=\"progressbar\"\n      aria-valuenow={indeterminate ? undefined : value}\n      aria-valuemin={0}\n      aria-valuemax={max}\n      aria-label=\"Progress\"\n      className={cn(circularProgressVariants({ size }), className)}\n    >\n      <svg\n        className={cn('-rotate-90 transform', indeterminate && 'animate-spin')}\n        width={svgSize}\n        height={svgSize}\n      >\n        {/* Background track */}\n        <circle\n          className=\"stroke-neutral-200 dark:stroke-neutral-700\"\n          fill=\"none\"\n          strokeWidth={strokeWidth}\n          cx={svgSize / 2}\n          cy={svgSize / 2}\n          r={radius}\n        />\n        {/* Progress fill */}\n        <circle\n          className={cn(\n            variantColors[variant],\n            'transition-all duration-300 ease-out'\n          )}\n          fill=\"none\"\n          strokeWidth={strokeWidth}\n          strokeLinecap=\"round\"\n          cx={svgSize / 2}\n          cy={svgSize / 2}\n          r={radius}\n          strokeDasharray={circumference}\n          strokeDashoffset={indeterminate ? circumference * 0.75 : offset}\n        />\n      </svg>\n      {showValue && !indeterminate && (\n        <span\n          data-slot=\"circular-progress-value\"\n          className=\"text-foreground absolute inset-0 flex items-center justify-center text-xs font-medium\"\n        >\n          {Math.round(percentage)}%\n        </span>\n      )}\n    </div>\n  );\n}\n\nCircularProgress.displayName = 'CircularProgress';\n\nexport {\n  Progress,\n  CircularProgress,\n  progressBarTrackVariants,\n  progressBarFillVariants,\n  circularProgressVariants,\n};\n"]}

package/dist/{chunk-N3QTYHRZ.cjs → chunk-3GGET5LK.cjs}

@@ -35,6 +35,7 @@ function Skeleton({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
+      "data-slot": "skeleton",
       className: chunkOR5DRJCW_cjs.cn(
         skeletonVariants({ variant }),
         circle && "rounded-full",
@@ -62,16 +63,24 @@ function SkeletonText({
     md: "space-y-3",
     lg: "space-y-4"
   };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkOR5DRJCW_cjs.cn(gapClasses[gap], className), "aria-hidden": "true", children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
-    Skeleton,
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
     {
-      variant: "text",
-      style: {
-        width: index === lines - 1 ? lastLineWidth : "100%"
-      }
-    },
-    index
-  )) });
+      "data-slot": "skeleton-text",
+      className: chunkOR5DRJCW_cjs.cn(gapClasses[gap], className),
+      "aria-hidden": "true",
+      children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
+        Skeleton,
+        {
+          variant: "text",
+          style: {
+            width: index === lines - 1 ? lastLineWidth : "100%"
+          }
+        },
+        index
+      ))
+    }
+  );
 }
 SkeletonText.displayName = "SkeletonText";
 function SkeletonCard({
@@ -83,6 +92,7 @@ function SkeletonCard({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
+      "data-slot": "skeleton-card",
       className: chunkOR5DRJCW_cjs.cn(
         "border-border bg-card space-y-4 rounded-xl border p-4",
         className
@@ -111,17 +121,25 @@ function SkeletonTable({
   columns = 4,
   className
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkOR5DRJCW_cjs.cn("space-y-3", className), "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: Array.from({ length: columns }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "text", className: "h-5 flex-1" }, `header-${i}`)) }),
-    Array.from({ length: rows }).map((_, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: Array.from({ length: columns }).map((_2, colIndex) => /* @__PURE__ */ jsxRuntime.jsx(
-      Skeleton,
-      {
-        variant: "text",
-        className: "flex-1"
-      },
-      `cell-${rowIndex}-${colIndex}`
-    )) }, `row-${rowIndex}`))
-  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-slot": "skeleton-table",
+      className: chunkOR5DRJCW_cjs.cn("space-y-3", className),
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: Array.from({ length: columns }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "text", className: "h-5 flex-1" }, `header-${i}`)) }),
+        Array.from({ length: rows }).map((_, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: Array.from({ length: columns }).map((_2, colIndex) => /* @__PURE__ */ jsxRuntime.jsx(
+          Skeleton,
+          {
+            variant: "text",
+            className: "flex-1"
+          },
+          `cell-${rowIndex}-${colIndex}`
+        )) }, `row-${rowIndex}`))
+      ]
+    }
+  );
 }
 SkeletonTable.displayName = "SkeletonTable";
 
@@ -130,5 +148,5 @@ exports.SkeletonCard = SkeletonCard;
 exports.SkeletonTable = SkeletonTable;
 exports.SkeletonText = SkeletonText;
 exports.skeletonVariants = skeletonVariants;
-//# sourceMappingURL=chunk-N3QTYHRZ.cjs.map
-//# sourceMappingURL=chunk-N3QTYHRZ.cjs.map
+//# sourceMappingURL=chunk-3GGET5LK.cjs.map
+//# sourceMappingURL=chunk-3GGET5LK.cjs.map

package/dist/chunk-3GGET5LK.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"names":["cva","jsx","cn","jsxs","_"],"mappings":"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","file":"chunk-3GGET5LK.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst skeletonVariants = cva(\n  ['animate-pulse rounded-md bg-neutral-200 dark:bg-neutral-700'],\n  {\n    variants: {\n      variant: {\n        default: '',\n        text: 'h-4',\n        title: 'h-6',\n        avatar: 'rounded-full',\n        button: 'h-10 w-24',\n        card: 'h-40',\n        image: 'aspect-video',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  }\n);\n\nexport interface SkeletonProps\n  extends\n    React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof skeletonVariants> {\n  /** Width of the skeleton */\n  width?: string | number;\n  /** Height of the skeleton */\n  height?: string | number;\n  /** Whether to render as a circle */\n  circle?: boolean;\n}\n\n/**\n * A skeleton loading placeholder component.\n *\n * @example\n * ```tsx\n * <Skeleton variant=\"text\" width=\"60%\" />\n * <Skeleton variant=\"avatar\" width={40} height={40} />\n * <Skeleton variant=\"card\" />\n * ```\n */\nfunction Skeleton({\n  className,\n  variant,\n  width,\n  height,\n  circle,\n  style,\n  ...props\n}: SkeletonProps) {\n  return (\n    <div\n      data-slot=\"skeleton\"\n      className={cn(\n        skeletonVariants({ variant }),\n        circle && 'rounded-full',\n        className\n      )}\n      style={{\n        width: typeof width === 'number' ? `${width}px` : width,\n        height: typeof height === 'number' ? `${height}px` : height,\n        ...style,\n      }}\n      aria-hidden=\"true\"\n      {...props}\n    />\n  );\n}\n\nSkeleton.displayName = 'Skeleton';\n\n// ============================================================================\n// Skeleton Text\n// ============================================================================\n\nexport interface SkeletonTextProps {\n  /** Number of lines to display */\n  lines?: number;\n  /** Width of the last line (for varying line lengths) */\n  lastLineWidth?: string;\n  /** Gap between lines */\n  gap?: 'sm' | 'md' | 'lg';\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * A skeleton for text content with multiple lines.\n *\n * @example\n * ```tsx\n * <SkeletonText lines={3} lastLineWidth=\"60%\" />\n * ```\n */\nfunction SkeletonText({\n  lines = 3,\n  lastLineWidth = '60%',\n  gap = 'sm',\n  className,\n}: SkeletonTextProps) {\n  const gapClasses = {\n    sm: 'space-y-2',\n    md: 'space-y-3',\n    lg: 'space-y-4',\n  };\n\n  return (\n    <div\n      data-slot=\"skeleton-text\"\n      className={cn(gapClasses[gap], className)}\n      aria-hidden=\"true\"\n    >\n      {Array.from({ length: lines }).map((_, index) => (\n        <Skeleton\n          key={index}\n          variant=\"text\"\n          style={{\n            width: index === lines - 1 ? lastLineWidth : '100%',\n          }}\n        />\n      ))}\n    </div>\n  );\n}\n\nSkeletonText.displayName = 'SkeletonText';\n\n// ============================================================================\n// Skeleton Card\n// ============================================================================\n\nexport interface SkeletonCardProps {\n  /** Show image placeholder */\n  showImage?: boolean;\n  /** Show avatar placeholder */\n  showAvatar?: boolean;\n  /** Number of text lines */\n  textLines?: number;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * A skeleton for card-like content.\n *\n * @example\n * ```tsx\n * <SkeletonCard showImage showAvatar textLines={2} />\n * ```\n */\nfunction SkeletonCard({\n  showImage = true,\n  showAvatar = false,\n  textLines = 2,\n  className,\n}: SkeletonCardProps) {\n  return (\n    <div\n      data-slot=\"skeleton-card\"\n      className={cn(\n        'border-border bg-card space-y-4 rounded-xl border p-4',\n        className\n      )}\n      aria-hidden=\"true\"\n    >\n      {showImage && <Skeleton variant=\"image\" className=\"rounded-lg\" />}\n      <div className=\"space-y-3\">\n        {showAvatar && (\n          <div className=\"flex items-center gap-3\">\n            <Skeleton circle width={40} height={40} />\n            <div className=\"flex-1 space-y-2\">\n              <Skeleton variant=\"text\" width=\"50%\" />\n              <Skeleton variant=\"text\" width=\"30%\" />\n            </div>\n          </div>\n        )}\n        <Skeleton variant=\"title\" width=\"80%\" />\n        <SkeletonText lines={textLines} />\n      </div>\n    </div>\n  );\n}\n\nSkeletonCard.displayName = 'SkeletonCard';\n\n// ============================================================================\n// Skeleton Table Row\n// ============================================================================\n\nexport interface SkeletonTableProps {\n  /** Number of rows */\n  rows?: number;\n  /** Number of columns */\n  columns?: number;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * A skeleton for table content.\n *\n * @example\n * ```tsx\n * <SkeletonTable rows={5} columns={4} />\n * ```\n */\nfunction SkeletonTable({\n  rows = 5,\n  columns = 4,\n  className,\n}: SkeletonTableProps) {\n  return (\n    <div\n      data-slot=\"skeleton-table\"\n      className={cn('space-y-3', className)}\n      aria-hidden=\"true\"\n    >\n      {/* Header */}\n      <div className=\"flex gap-4\">\n        {Array.from({ length: columns }).map((_, i) => (\n          <Skeleton key={`header-${i}`} variant=\"text\" className=\"h-5 flex-1\" />\n        ))}\n      </div>\n      {/* Rows */}\n      {Array.from({ length: rows }).map((_, rowIndex) => (\n        <div key={`row-${rowIndex}`} className=\"flex gap-4\">\n          {Array.from({ length: columns }).map((_, colIndex) => (\n            <Skeleton\n              key={`cell-${rowIndex}-${colIndex}`}\n              variant=\"text\"\n              className=\"flex-1\"\n            />\n          ))}\n        </div>\n      ))}\n    </div>\n  );\n}\n\nSkeletonTable.displayName = 'SkeletonTable';\n\nexport {\n  Skeleton,\n  SkeletonText,\n  SkeletonCard,\n  SkeletonTable,\n  skeletonVariants,\n};\n"]}