@acronis-platform/shadcn-uikit 0.34.0 → 0.36.3

package/dist/components/ui/visually-hidden.js

@@ -1,26 +1,24 @@
 import { jsx as r } from "react/jsx-runtime";
 import * as a from "react";
-const e = a.forwardRef(
-  (i, o) => /* @__PURE__ */ r(
-    "span",
-    {
-      ref: o,
-      style: {
-        position: "absolute",
-        border: 0,
-        width: 1,
-        height: 1,
-        padding: 0,
-        margin: -1,
-        overflow: "hidden",
-        clip: "rect(0, 0, 0, 0)",
-        whiteSpace: "nowrap",
-        wordWrap: "normal"
-      },
-      ...i
-    }
-  )
-);
+const e = a.forwardRef((i, o) => /* @__PURE__ */ r(
+  "span",
+  {
+    ref: o,
+    style: {
+      position: "absolute",
+      border: 0,
+      width: 1,
+      height: 1,
+      padding: 0,
+      margin: -1,
+      overflow: "hidden",
+      clip: "rect(0, 0, 0, 0)",
+      whiteSpace: "nowrap",
+      wordWrap: "normal"
+    },
+    ...i
+  }
+));
 e.displayName = "VisuallyHidden";
 export {
   e as VisuallyHidden

package/dist/components/ui/visually-hidden.js.map

@@ -1 +1 @@
-{"version":3,"file":"visually-hidden.js","sources":["../../../src/components/ui/visually-hidden.tsx"],"sourcesContent":["import * as React from 'react'\n\nconst VisuallyHidden = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<'span'>>(\n  (props, ref) => (\n    <span\n      ref={ref}\n      style={{\n        position: 'absolute',\n        border: 0,\n        width: 1,\n        height: 1,\n        padding: 0,\n        margin: -1,\n        overflow: 'hidden',\n        clip: 'rect(0, 0, 0, 0)',\n        whiteSpace: 'nowrap',\n        wordWrap: 'normal',\n      }}\n      {...props}\n    />\n  )\n)\nVisuallyHidden.displayName = 'VisuallyHidden'\n\nexport { VisuallyHidden }\n"],"names":["VisuallyHidden","React","props","ref","jsx"],"mappings":";;AAEA,MAAMA,IAAiBC,EAAM;AAAA,EAC3B,CAACC,GAAOC,MACN,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,OAAO;AAAA,QACL,UAAU;AAAA,QACV,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,MAAM;AAAA,QACN,YAAY;AAAA,QACZ,UAAU;AAAA,MAAA;AAAA,MAEX,GAAGD;AAAA,IAAA;AAAA,EAAA;AAGV;AACAF,EAAe,cAAc;"}
+{"version":3,"file":"visually-hidden.js","sources":["../../../src/components/ui/visually-hidden.tsx"],"sourcesContent":["import * as React from 'react';\n\nconst VisuallyHidden = React.forwardRef<\n  HTMLSpanElement,\n  React.ComponentPropsWithoutRef<'span'>\n>((props, ref) => (\n  <span\n    ref={ref}\n    style={{\n      position: 'absolute',\n      border: 0,\n      width: 1,\n      height: 1,\n      padding: 0,\n      margin: -1,\n      overflow: 'hidden',\n      clip: 'rect(0, 0, 0, 0)',\n      whiteSpace: 'nowrap',\n      wordWrap: 'normal',\n    }}\n    {...props}\n  />\n));\nVisuallyHidden.displayName = 'VisuallyHidden';\n\nexport { VisuallyHidden };\n"],"names":["VisuallyHidden","React","props","ref","jsx"],"mappings":";;AAEA,MAAMA,IAAiBC,EAAM,WAG3B,CAACC,GAAOC,MACR,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,OAAO;AAAA,MACL,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,UAAU;AAAA,MACV,MAAM;AAAA,MACN,YAAY;AAAA,MACZ,UAAU;AAAA,IAAA;AAAA,IAEX,GAAGD;AAAA,EAAA;AACN,CACD;AACDF,EAAe,cAAc;"}

package/dist/components/ui/widget-alert.js

@@ -72,7 +72,10 @@ const m = i.forwardRef(({ className: a, ...t }, e) => /* @__PURE__ */ r(
   "div",
   {
     ref: e,
-    className: s("text-sm leading-6 text-[var(--av-fixed-primary)]", a),
+    className: s(
+      "text-sm leading-6 text-[var(--av-fixed-primary)]",
+      a
+    ),
     ...t
   }
 ));
@@ -81,7 +84,10 @@ const x = i.forwardRef(({ className: a, ...t }, e) => /* @__PURE__ */ r(
   "p",
   {
     ref: e,
-    className: s("text-sm leading-6 text-[var(--av-fixed-primary)]", a),
+    className: s(
+      "text-sm leading-6 text-[var(--av-fixed-primary)]",
+      a
+    ),
     ...t
   }
 ));

package/dist/components/ui/widget-alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"widget-alert.js","sources":["../../../src/components/ui/widget-alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '@/lib/utils'\n\n/**\n * WidgetAlert — Dashboard alert notification widget.\n * Figma: Charts-anatomy / Alert-Widget (node 201:65481)\n *\n * Variants: info, success, warning, danger\n * Sizes: compact (112px), default (176px), expanded (with description + actions)\n * States: hover, active, focus\n *\n * Anatomy:\n * - WidgetAlert (root)\n *   - WidgetAlertIcon (left icon, 16x16)\n *   - WidgetAlertContent\n *     - WidgetAlertTitle (semibold, 14px)\n *     - WidgetAlertDate (regular, 14px)\n *     - WidgetAlertDescription (regular, 14px)\n *   - WidgetAlertActions (right side, more icon)\n *\n * Spacing: 24px horizontal padding, 16px vertical padding, 8px gap between title and description\n * Colors per variant:\n *   info: bg=fixed-info-accent, border=fixed-info\n *   success: bg=fixed-success-accent, border=fixed-success\n *   warning: bg=fixed-warning-accent, border=fixed-warning\n *   danger: bg=fixed-danger-accent, border=fixed-danger\n */\n\nconst widgetAlertVariants = cva(\n  'relative flex items-start rounded-lg border transition-colors',\n  {\n    variants: {\n      variant: {\n        info: 'bg-[var(--av-fixed-info-accent)] border-[var(--av-fixed-info)]',\n        success: 'bg-[var(--av-fixed-success-accent)] border-[var(--av-fixed-success)]',\n        warning: 'bg-[var(--av-fixed-warning-accent)] border-[var(--av-fixed-warning)]',\n        danger: 'bg-[var(--av-fixed-danger-accent)] border-[var(--av-fixed-danger)]',\n      },\n      interactive: {\n        true: 'cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'info',\n      interactive: false,\n    },\n  }\n)\n\nexport interface WidgetAlertProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof widgetAlertVariants> {}\n\nconst WidgetAlert = React.forwardRef<HTMLDivElement, WidgetAlertProps>(\n  ({ className, variant, interactive, ...props }, ref) => (\n    <div\n      ref={ref}\n      role=\"alert\"\n      tabIndex={interactive ? 0 : undefined}\n      className={cn(widgetAlertVariants({ variant, interactive }), className)}\n      {...props}\n    />\n  )\n)\nWidgetAlert.displayName = 'WidgetAlert'\n\nconst WidgetAlertIcon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-shrink-0 flex items-start pl-6 pt-4 [&>svg]:h-4 [&>svg]:w-4',\n      className\n    )}\n    {...props}\n  />\n))\nWidgetAlertIcon.displayName = 'WidgetAlertIcon'\n\nconst WidgetAlertContent = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-1 flex flex-col gap-2 px-4 py-4 min-w-0 text-[var(--av-fixed-primary)]',\n      className\n    )}\n    {...props}\n  />\n))\nWidgetAlertContent.displayName = 'WidgetAlertContent'\n\nconst WidgetAlertTitle = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('text-sm font-semibold leading-6 truncate', className)}\n    {...props}\n  />\n))\nWidgetAlertTitle.displayName = 'WidgetAlertTitle'\n\nconst WidgetAlertDate = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('text-sm leading-6 text-[var(--av-fixed-primary)]', className)}\n    {...props}\n  />\n))\nWidgetAlertDate.displayName = 'WidgetAlertDate'\n\nconst WidgetAlertDescription = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n  <p\n    ref={ref}\n    className={cn('text-sm leading-6 text-[var(--av-fixed-primary)]', className)}\n    {...props}\n  />\n))\nWidgetAlertDescription.displayName = 'WidgetAlertDescription'\n\nconst WidgetAlertActions = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-shrink-0 flex items-start pr-6 pt-4 text-[var(--av-brand-primary)] [&>svg]:h-4 [&>svg]:w-4',\n      className\n    )}\n    {...props}\n  />\n))\nWidgetAlertActions.displayName = 'WidgetAlertActions'\n\nexport {\n  WidgetAlert,\n  WidgetAlertIcon,\n  WidgetAlertContent,\n  WidgetAlertTitle,\n  WidgetAlertDate,\n  WidgetAlertDescription,\n  WidgetAlertActions,\n  widgetAlertVariants,\n}\n"],"names":["widgetAlertVariants","cva","WidgetAlert","React","className","variant","interactive","props","ref","jsx","cn","WidgetAlertIcon","WidgetAlertContent","WidgetAlertTitle","WidgetAlertDate","WidgetAlertDescription","WidgetAlertActions"],"mappings":";;;;AA8BA,MAAMA,IAAsBC;AAAA,EAC1B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,QACT,SAAS;AAAA,QACT,QAAQ;AAAA,MAAA;AAAA,MAEV,aAAa;AAAA,QACX,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,IACT;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAMMC,IAAcC,EAAM;AAAA,EACxB,CAAC,EAAE,WAAAC,GAAW,SAAAC,GAAS,aAAAC,GAAa,GAAGC,EAAA,GAASC,MAC9C,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,MAAK;AAAA,MACL,UAAUF,IAAc,IAAI;AAAA,MAC5B,WAAWI,EAAGV,EAAoB,EAAE,SAAAK,GAAS,aAAAC,EAAA,CAAa,GAAGF,CAAS;AAAA,MACrE,GAAGG;AAAA,IAAA;AAAA,EAAA;AAGV;AACAL,EAAY,cAAc;AAE1B,MAAMS,IAAkBR,EAAM,WAG5B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDI,EAAgB,cAAc;AAE9B,MAAMC,IAAqBT,EAAM,WAG/B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDK,EAAmB,cAAc;AAEjC,MAAMC,IAAmBV,EAAM,WAG7B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,4CAA4CN,CAAS;AAAA,IAClE,GAAGG;AAAA,EAAA;AACN,CACD;AACDM,EAAiB,cAAc;AAE/B,MAAMC,IAAkBX,EAAM,WAG5B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,oDAAoDN,CAAS;AAAA,IAC1E,GAAGG;AAAA,EAAA;AACN,CACD;AACDO,EAAgB,cAAc;AAE9B,MAAMC,IAAyBZ,EAAM,WAGnC,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,oDAAoDN,CAAS;AAAA,IAC1E,GAAGG;AAAA,EAAA;AACN,CACD;AACDQ,EAAuB,cAAc;AAErC,MAAMC,IAAqBb,EAAM,WAG/B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDS,EAAmB,cAAc;"}
+{"version":3,"file":"widget-alert.js","sources":["../../../src/components/ui/widget-alert.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\n\n/**\n * WidgetAlert — Dashboard alert notification widget.\n * Figma: Charts-anatomy / Alert-Widget (node 201:65481)\n *\n * Variants: info, success, warning, danger\n * Sizes: compact (112px), default (176px), expanded (with description + actions)\n * States: hover, active, focus\n *\n * Anatomy:\n * - WidgetAlert (root)\n *   - WidgetAlertIcon (left icon, 16x16)\n *   - WidgetAlertContent\n *     - WidgetAlertTitle (semibold, 14px)\n *     - WidgetAlertDate (regular, 14px)\n *     - WidgetAlertDescription (regular, 14px)\n *   - WidgetAlertActions (right side, more icon)\n *\n * Spacing: 24px horizontal padding, 16px vertical padding, 8px gap between title and description\n * Colors per variant:\n *   info: bg=fixed-info-accent, border=fixed-info\n *   success: bg=fixed-success-accent, border=fixed-success\n *   warning: bg=fixed-warning-accent, border=fixed-warning\n *   danger: bg=fixed-danger-accent, border=fixed-danger\n */\n\nconst widgetAlertVariants = cva(\n  'relative flex items-start rounded-lg border transition-colors',\n  {\n    variants: {\n      variant: {\n        info: 'bg-[var(--av-fixed-info-accent)] border-[var(--av-fixed-info)]',\n        success:\n          'bg-[var(--av-fixed-success-accent)] border-[var(--av-fixed-success)]',\n        warning:\n          'bg-[var(--av-fixed-warning-accent)] border-[var(--av-fixed-warning)]',\n        danger:\n          'bg-[var(--av-fixed-danger-accent)] border-[var(--av-fixed-danger)]',\n      },\n      interactive: {\n        true: 'cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'info',\n      interactive: false,\n    },\n  }\n);\n\nexport interface WidgetAlertProps\n  extends\n    React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof widgetAlertVariants> {}\n\nconst WidgetAlert = React.forwardRef<HTMLDivElement, WidgetAlertProps>(\n  ({ className, variant, interactive, ...props }, ref) => (\n    <div\n      ref={ref}\n      role=\"alert\"\n      tabIndex={interactive ? 0 : undefined}\n      className={cn(widgetAlertVariants({ variant, interactive }), className)}\n      {...props}\n    />\n  )\n);\nWidgetAlert.displayName = 'WidgetAlert';\n\nconst WidgetAlertIcon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-shrink-0 flex items-start pl-6 pt-4 [&>svg]:h-4 [&>svg]:w-4',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetAlertIcon.displayName = 'WidgetAlertIcon';\n\nconst WidgetAlertContent = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-1 flex flex-col gap-2 px-4 py-4 min-w-0 text-[var(--av-fixed-primary)]',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetAlertContent.displayName = 'WidgetAlertContent';\n\nconst WidgetAlertTitle = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('text-sm font-semibold leading-6 truncate', className)}\n    {...props}\n  />\n));\nWidgetAlertTitle.displayName = 'WidgetAlertTitle';\n\nconst WidgetAlertDate = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'text-sm leading-6 text-[var(--av-fixed-primary)]',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetAlertDate.displayName = 'WidgetAlertDate';\n\nconst WidgetAlertDescription = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => (\n  <p\n    ref={ref}\n    className={cn(\n      'text-sm leading-6 text-[var(--av-fixed-primary)]',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetAlertDescription.displayName = 'WidgetAlertDescription';\n\nconst WidgetAlertActions = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-shrink-0 flex items-start pr-6 pt-4 text-[var(--av-brand-primary)] [&>svg]:h-4 [&>svg]:w-4',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetAlertActions.displayName = 'WidgetAlertActions';\n\nexport {\n  WidgetAlert,\n  WidgetAlertIcon,\n  WidgetAlertContent,\n  WidgetAlertTitle,\n  WidgetAlertDate,\n  WidgetAlertDescription,\n  WidgetAlertActions,\n  widgetAlertVariants,\n};\n"],"names":["widgetAlertVariants","cva","WidgetAlert","React","className","variant","interactive","props","ref","jsx","cn","WidgetAlertIcon","WidgetAlertContent","WidgetAlertTitle","WidgetAlertDate","WidgetAlertDescription","WidgetAlertActions"],"mappings":";;;;AA8BA,MAAMA,IAAsBC;AAAA,EAC1B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,MAAM;AAAA,QACN,SACE;AAAA,QACF,SACE;AAAA,QACF,QACE;AAAA,MAAA;AAAA,MAEJ,aAAa;AAAA,QACX,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,IACT;AAAA,IAEF,iBAAiB;AAAA,MACf,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAOMC,IAAcC,EAAM;AAAA,EACxB,CAAC,EAAE,WAAAC,GAAW,SAAAC,GAAS,aAAAC,GAAa,GAAGC,EAAA,GAASC,MAC9C,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,MAAK;AAAA,MACL,UAAUF,IAAc,IAAI;AAAA,MAC5B,WAAWI,EAAGV,EAAoB,EAAE,SAAAK,GAAS,aAAAC,EAAA,CAAa,GAAGF,CAAS;AAAA,MACrE,GAAGG;AAAA,IAAA;AAAA,EAAA;AAGV;AACAL,EAAY,cAAc;AAE1B,MAAMS,IAAkBR,EAAM,WAG5B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDI,EAAgB,cAAc;AAE9B,MAAMC,IAAqBT,EAAM,WAG/B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDK,EAAmB,cAAc;AAEjC,MAAMC,IAAmBV,EAAM,WAG7B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,4CAA4CN,CAAS;AAAA,IAClE,GAAGG;AAAA,EAAA;AACN,CACD;AACDM,EAAiB,cAAc;AAE/B,MAAMC,IAAkBX,EAAM,WAG5B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDO,EAAgB,cAAc;AAE9B,MAAMC,IAAyBZ,EAAM,WAGnC,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDQ,EAAuB,cAAc;AAErC,MAAMC,IAAqBb,EAAM,WAG/B,CAAC,EAAE,WAAAC,GAAW,GAAGG,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAN;AAAA,IAAA;AAAA,IAED,GAAGG;AAAA,EAAA;AACN,CACD;AACDS,EAAmB,cAAc;"}

package/dist/components/ui/widget-placeholder.js

@@ -1,21 +1,19 @@
 import { jsx as t } from "react/jsx-runtime";
 import * as l from "react";
 import { cn as d } from "../../lib/utils.js";
-const i = l.forwardRef(
-  ({ className: a, interactive: e, ...r }, o) => /* @__PURE__ */ t(
-    "div",
-    {
-      ref: o,
-      tabIndex: e ? 0 : void 0,
-      className: d(
-        "relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors",
-        e && "cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]",
-        a
-      ),
-      ...r
-    }
-  )
-);
+const i = l.forwardRef(({ className: a, interactive: e, ...r }, o) => /* @__PURE__ */ t(
+  "div",
+  {
+    ref: o,
+    tabIndex: e ? 0 : void 0,
+    className: d(
+      "relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors",
+      e && "cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]",
+      a
+    ),
+    ...r
+  }
+));
 i.displayName = "WidgetPlaceholder";
 const s = l.forwardRef(({ className: a, ...e }, r) => /* @__PURE__ */ t(
   "div",
@@ -39,7 +37,10 @@ const n = l.forwardRef(({ className: a, ...e }, r) => /* @__PURE__ */ t(
   "div",
   {
     ref: r,
-    className: d("flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4", a),
+    className: d(
+      "flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4",
+      a
+    ),
     ...e
   }
 ));
@@ -72,7 +73,10 @@ const m = l.forwardRef(({ className: a, ...e }, r) => /* @__PURE__ */ t(
   "div",
   {
     ref: r,
-    className: d("text-sm leading-6 text-[var(--av-fixed-primary)]", a),
+    className: d(
+      "text-sm leading-6 text-[var(--av-fixed-primary)]",
+      a
+    ),
     ...e
   }
 ));

package/dist/components/ui/widget-placeholder.js.map

@@ -1 +1 @@
-{"version":3,"file":"widget-placeholder.js","sources":["../../../src/components/ui/widget-placeholder.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/lib/utils'\n\n/**\n * WidgetPlaceholder — Empty state / placeholder widget for dashboard.\n * Figma: Charts-anatomy / Placeholders (node 229:73962)\n *\n * Shows a placeholder with icon, title, and optional description/action.\n * Two sizes: default (with large icon) and compact (with small icon).\n * Background: inversed-primary, Border: brand-light\n * Icon: brand-light (placeholder icon), fixed-link (action icon)\n *\n * States: hover (el-secondary-hover), active (el-secondary-active), focus (fixed-focus)\n */\n\nexport interface WidgetPlaceholderProps extends React.HTMLAttributes<HTMLDivElement> {\n  interactive?: boolean\n}\n\nconst WidgetPlaceholder = React.forwardRef<HTMLDivElement, WidgetPlaceholderProps>(\n  ({ className, interactive, ...props }, ref) => (\n    <div\n      ref={ref}\n      tabIndex={interactive ? 0 : undefined}\n      className={cn(\n        'relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors',\n        interactive && 'cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]',\n        className\n      )}\n      {...props}\n    />\n  )\n)\nWidgetPlaceholder.displayName = 'WidgetPlaceholder'\n\nconst WidgetPlaceholderHeader = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex items-center gap-2 px-6 pt-4 pb-2', className)}\n    {...props}\n  />\n))\nWidgetPlaceholderHeader.displayName = 'WidgetPlaceholderHeader'\n\nconst WidgetPlaceholderTitle = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex-1 truncate text-sm font-semibold leading-6', className)}\n    {...props}\n  />\n))\nWidgetPlaceholderTitle.displayName = 'WidgetPlaceholderTitle'\n\nconst WidgetPlaceholderIcon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4', className)}\n    {...props}\n  />\n))\nWidgetPlaceholderIcon.displayName = 'WidgetPlaceholderIcon'\n\nconst WidgetPlaceholderContent = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-1 flex flex-col items-center justify-center gap-2 px-6 py-4 text-center',\n      className\n    )}\n    {...props}\n  />\n))\nWidgetPlaceholderContent.displayName = 'WidgetPlaceholderContent'\n\nconst WidgetPlaceholderImage = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex items-center justify-center text-[var(--av-brand-light)] [&>svg]:h-[72px] [&>svg]:w-[72px]',\n      className\n    )}\n    {...props}\n  />\n))\nWidgetPlaceholderImage.displayName = 'WidgetPlaceholderImage'\n\nconst WidgetPlaceholderText = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('text-sm leading-6 text-[var(--av-fixed-primary)]', className)}\n    {...props}\n  />\n))\nWidgetPlaceholderText.displayName = 'WidgetPlaceholderText'\n\nconst WidgetPlaceholderAction = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'text-sm font-semibold text-[var(--av-fixed-link)] cursor-pointer hover:underline',\n      className\n    )}\n    {...props}\n  />\n))\nWidgetPlaceholderAction.displayName = 'WidgetPlaceholderAction'\n\nconst WidgetPlaceholderFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('px-6 pb-4 pt-0 text-xs', className)}\n    {...props}\n  />\n))\nWidgetPlaceholderFooter.displayName = 'WidgetPlaceholderFooter'\n\nexport {\n  WidgetPlaceholder,\n  WidgetPlaceholderHeader,\n  WidgetPlaceholderTitle,\n  WidgetPlaceholderIcon,\n  WidgetPlaceholderContent,\n  WidgetPlaceholderImage,\n  WidgetPlaceholderText,\n  WidgetPlaceholderAction,\n  WidgetPlaceholderFooter,\n}\n"],"names":["WidgetPlaceholder","React","className","interactive","props","ref","jsx","cn","WidgetPlaceholderHeader","WidgetPlaceholderTitle","WidgetPlaceholderIcon","WidgetPlaceholderContent","WidgetPlaceholderImage","WidgetPlaceholderText","WidgetPlaceholderAction","WidgetPlaceholderFooter"],"mappings":";;;AAoBA,MAAMA,IAAoBC,EAAM;AAAA,EAC9B,CAAC,EAAE,WAAAC,GAAW,aAAAC,GAAa,GAAGC,EAAA,GAASC,MACrC,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,UAAUF,IAAc,IAAI;AAAA,MAC5B,WAAWI;AAAA,QACT;AAAA,QACAJ,KAAe;AAAA,QACfD;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;AACAJ,EAAkB,cAAc;AAEhC,MAAMQ,IAA0BP,EAAM,WAGpC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,0CAA0CL,CAAS;AAAA,IAChE,GAAGE;AAAA,EAAA;AACN,CACD;AACDI,EAAwB,cAAc;AAEtC,MAAMC,IAAyBR,EAAM,WAGnC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,mDAAmDL,CAAS;AAAA,IACzE,GAAGE;AAAA,EAAA;AACN,CACD;AACDK,EAAuB,cAAc;AAErC,MAAMC,IAAwBT,EAAM,WAGlC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,qEAAqEL,CAAS;AAAA,IAC3F,GAAGE;AAAA,EAAA;AACN,CACD;AACDM,EAAsB,cAAc;AAEpC,MAAMC,IAA2BV,EAAM,WAGrC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDO,EAAyB,cAAc;AAEvC,MAAMC,IAAyBX,EAAM,WAGnC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDQ,EAAuB,cAAc;AAErC,MAAMC,IAAwBZ,EAAM,WAGlC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,oDAAoDL,CAAS;AAAA,IAC1E,GAAGE;AAAA,EAAA;AACN,CACD;AACDS,EAAsB,cAAc;AAEpC,MAAMC,IAA0Bb,EAAM,WAGpC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDU,EAAwB,cAAc;AAEtC,MAAMC,IAA0Bd,EAAM,WAGpC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,0BAA0BL,CAAS;AAAA,IAChD,GAAGE;AAAA,EAAA;AACN,CACD;AACDW,EAAwB,cAAc;"}
+{"version":3,"file":"widget-placeholder.js","sources":["../../../src/components/ui/widget-placeholder.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\n/**\n * WidgetPlaceholder — Empty state / placeholder widget for dashboard.\n * Figma: Charts-anatomy / Placeholders (node 229:73962)\n *\n * Shows a placeholder with icon, title, and optional description/action.\n * Two sizes: default (with large icon) and compact (with small icon).\n * Background: inversed-primary, Border: brand-light\n * Icon: brand-light (placeholder icon), fixed-link (action icon)\n *\n * States: hover (el-secondary-hover), active (el-secondary-active), focus (fixed-focus)\n */\n\nexport interface WidgetPlaceholderProps extends React.HTMLAttributes<HTMLDivElement> {\n  interactive?: boolean;\n}\n\nconst WidgetPlaceholder = React.forwardRef<\n  HTMLDivElement,\n  WidgetPlaceholderProps\n>(({ className, interactive, ...props }, ref) => (\n  <div\n    ref={ref}\n    tabIndex={interactive ? 0 : undefined}\n    className={cn(\n      'relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors',\n      interactive &&\n        'cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetPlaceholder.displayName = 'WidgetPlaceholder';\n\nconst WidgetPlaceholderHeader = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex items-center gap-2 px-6 pt-4 pb-2', className)}\n    {...props}\n  />\n));\nWidgetPlaceholderHeader.displayName = 'WidgetPlaceholderHeader';\n\nconst WidgetPlaceholderTitle = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex-1 truncate text-sm font-semibold leading-6', className)}\n    {...props}\n  />\n));\nWidgetPlaceholderTitle.displayName = 'WidgetPlaceholderTitle';\n\nconst WidgetPlaceholderIcon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetPlaceholderIcon.displayName = 'WidgetPlaceholderIcon';\n\nconst WidgetPlaceholderContent = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-1 flex flex-col items-center justify-center gap-2 px-6 py-4 text-center',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetPlaceholderContent.displayName = 'WidgetPlaceholderContent';\n\nconst WidgetPlaceholderImage = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex items-center justify-center text-[var(--av-brand-light)] [&>svg]:h-[72px] [&>svg]:w-[72px]',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetPlaceholderImage.displayName = 'WidgetPlaceholderImage';\n\nconst WidgetPlaceholderText = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'text-sm leading-6 text-[var(--av-fixed-primary)]',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetPlaceholderText.displayName = 'WidgetPlaceholderText';\n\nconst WidgetPlaceholderAction = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'text-sm font-semibold text-[var(--av-fixed-link)] cursor-pointer hover:underline',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetPlaceholderAction.displayName = 'WidgetPlaceholderAction';\n\nconst WidgetPlaceholderFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('px-6 pb-4 pt-0 text-xs', className)}\n    {...props}\n  />\n));\nWidgetPlaceholderFooter.displayName = 'WidgetPlaceholderFooter';\n\nexport {\n  WidgetPlaceholder,\n  WidgetPlaceholderHeader,\n  WidgetPlaceholderTitle,\n  WidgetPlaceholderIcon,\n  WidgetPlaceholderContent,\n  WidgetPlaceholderImage,\n  WidgetPlaceholderText,\n  WidgetPlaceholderAction,\n  WidgetPlaceholderFooter,\n};\n"],"names":["WidgetPlaceholder","React","className","interactive","props","ref","jsx","cn","WidgetPlaceholderHeader","WidgetPlaceholderTitle","WidgetPlaceholderIcon","WidgetPlaceholderContent","WidgetPlaceholderImage","WidgetPlaceholderText","WidgetPlaceholderAction","WidgetPlaceholderFooter"],"mappings":";;;AAoBA,MAAMA,IAAoBC,EAAM,WAG9B,CAAC,EAAE,WAAAC,GAAW,aAAAC,GAAa,GAAGC,KAASC,MACvC,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,UAAUF,IAAc,IAAI;AAAA,IAC5B,WAAWI;AAAA,MACT;AAAA,MACAJ,KACE;AAAA,MACFD;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDJ,EAAkB,cAAc;AAEhC,MAAMQ,IAA0BP,EAAM,WAGpC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,0CAA0CL,CAAS;AAAA,IAChE,GAAGE;AAAA,EAAA;AACN,CACD;AACDI,EAAwB,cAAc;AAEtC,MAAMC,IAAyBR,EAAM,WAGnC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,mDAAmDL,CAAS;AAAA,IACzE,GAAGE;AAAA,EAAA;AACN,CACD;AACDK,EAAuB,cAAc;AAErC,MAAMC,IAAwBT,EAAM,WAGlC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDM,EAAsB,cAAc;AAEpC,MAAMC,IAA2BV,EAAM,WAGrC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDO,EAAyB,cAAc;AAEvC,MAAMC,IAAyBX,EAAM,WAGnC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDQ,EAAuB,cAAc;AAErC,MAAMC,IAAwBZ,EAAM,WAGlC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDS,EAAsB,cAAc;AAEpC,MAAMC,IAA0Bb,EAAM,WAGpC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDU,EAAwB,cAAc;AAEtC,MAAMC,IAA0Bd,EAAM,WAGpC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,0BAA0BL,CAAS;AAAA,IAChD,GAAGE;AAAA,EAAA;AACN,CACD;AACDW,EAAwB,cAAc;"}

package/dist/components/ui/widget-progress-chunks.js

@@ -1,21 +1,19 @@
 import { jsx as a, jsxs as t } from "react/jsx-runtime";
 import * as i from "react";
 import { cn as o } from "../../lib/utils.js";
-const h = i.forwardRef(
-  ({ className: r, interactive: s, ...e }, d) => /* @__PURE__ */ a(
-    "div",
-    {
-      ref: d,
-      tabIndex: s ? 0 : void 0,
-      className: o(
-        "relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors",
-        s && "cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]",
-        r
-      ),
-      ...e
-    }
-  )
-);
+const h = i.forwardRef(({ className: r, interactive: s, ...e }, d) => /* @__PURE__ */ a(
+  "div",
+  {
+    ref: d,
+    tabIndex: s ? 0 : void 0,
+    className: o(
+      "relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors",
+      s && "cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]",
+      r
+    ),
+    ...e
+  }
+));
 h.displayName = "WidgetProgressChunks";
 const p = i.forwardRef(({ className: r, ...s }, e) => /* @__PURE__ */ a(
   "div",
@@ -39,7 +37,10 @@ const b = i.forwardRef(({ className: r, ...s }, e) => /* @__PURE__ */ a(
   "div",
   {
     ref: e,
-    className: o("flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4", r),
+    className: o(
+      "flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4",
+      r
+    ),
     ...s
   }
 ));
@@ -54,28 +55,45 @@ const y = i.forwardRef(({ className: r, ...s }, e) => /* @__PURE__ */ a(
 ));
 y.displayName = "WidgetProgressChunksBody";
 const N = i.forwardRef(
-  ({ className: r, label: s, value: e, total: d, color: c, formatValue: n, formatTotal: l, ...g }, f) => {
+  ({
+    className: r,
+    label: s,
+    value: e,
+    total: d,
+    color: c,
+    formatValue: n,
+    formatTotal: l,
+    ...g
+  }, f) => {
     const v = d > 0 ? e / d * 100 : 0, m = n ? n(e) : String(e), u = l ? l(d) : String(d);
-    return /* @__PURE__ */ t("div", { ref: f, className: o("flex flex-col gap-1", r), ...g, children: [
-      /* @__PURE__ */ t("div", { className: "flex items-center justify-between text-xs", children: [
-        /* @__PURE__ */ a("span", { className: "text-[var(--av-fixed-primary)]", children: s }),
-        /* @__PURE__ */ t("span", { className: "font-semibold tabular-nums", children: [
-          m,
-          " / ",
-          u
-        ] })
-      ] }),
-      /* @__PURE__ */ a("div", { className: "h-2 w-full overflow-hidden rounded bg-[var(--av-brand-light)]", children: /* @__PURE__ */ a(
-        "div",
-        {
-          className: "h-full rounded transition-all",
-          style: {
-            width: `${Math.min(v, 100)}%`,
-            backgroundColor: c
-          }
-        }
-      ) })
-    ] });
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ref: f,
+        className: o("flex flex-col gap-1", r),
+        ...g,
+        children: [
+          /* @__PURE__ */ t("div", { className: "flex items-center justify-between text-xs", children: [
+            /* @__PURE__ */ a("span", { className: "text-[var(--av-fixed-primary)]", children: s }),
+            /* @__PURE__ */ t("span", { className: "font-semibold tabular-nums", children: [
+              m,
+              " / ",
+              u
+            ] })
+          ] }),
+          /* @__PURE__ */ a("div", { className: "h-2 w-full overflow-hidden rounded bg-[var(--av-brand-light)]", children: /* @__PURE__ */ a(
+            "div",
+            {
+              className: "h-full rounded transition-all",
+              style: {
+                width: `${Math.min(v, 100)}%`,
+                backgroundColor: c
+              }
+            }
+          ) })
+        ]
+      }
+    );
   }
 );
 N.displayName = "WidgetProgressChunkRow";

package/dist/components/ui/widget-progress-chunks.js.map

@@ -1 +1 @@
-{"version":3,"file":"widget-progress-chunks.js","sources":["../../../src/components/ui/widget-progress-chunks.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/lib/utils'\n\n/**\n * WidgetProgressChunks — Chunked progress visualization widget.\n * Figma: Charts-anatomy / Progress-Chunks (node 237:74702)\n *\n * Shows progress as discrete colored chunks/segments with labels and values.\n * Colors: chart-success, chart-warning, chart-critical, chart-danger\n * Background: inversed-primary, Border: brand-light\n * Divider: brand-accent\n *\n * Anatomy:\n * - WidgetProgressChunks (root)\n *   - Header: title + icon\n *   - Chunks: rows of labeled progress segments\n *   - Footer: optional summary\n *\n * States: hover, active, focus, focus-data\n */\n\nexport interface ProgressChunk {\n  label: string\n  value: number\n  total: number\n  color: string\n}\n\nexport interface WidgetProgressChunksProps extends React.HTMLAttributes<HTMLDivElement> {\n  interactive?: boolean\n}\n\nconst WidgetProgressChunks = React.forwardRef<HTMLDivElement, WidgetProgressChunksProps>(\n  ({ className, interactive, ...props }, ref) => (\n    <div\n      ref={ref}\n      tabIndex={interactive ? 0 : undefined}\n      className={cn(\n        'relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors',\n        interactive && 'cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]',\n        className\n      )}\n      {...props}\n    />\n  )\n)\nWidgetProgressChunks.displayName = 'WidgetProgressChunks'\n\nconst WidgetProgressChunksHeader = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex items-center gap-2 px-6 pt-4 pb-2', className)}\n    {...props}\n  />\n))\nWidgetProgressChunksHeader.displayName = 'WidgetProgressChunksHeader'\n\nconst WidgetProgressChunksTitle = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex-1 truncate text-sm font-semibold leading-6', className)}\n    {...props}\n  />\n))\nWidgetProgressChunksTitle.displayName = 'WidgetProgressChunksTitle'\n\nconst WidgetProgressChunksIcon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4', className)}\n    {...props}\n  />\n))\nWidgetProgressChunksIcon.displayName = 'WidgetProgressChunksIcon'\n\nconst WidgetProgressChunksBody = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex flex-col gap-2 px-6 py-2', className)}\n    {...props}\n  />\n))\nWidgetProgressChunksBody.displayName = 'WidgetProgressChunksBody'\n\nexport interface WidgetProgressChunkRowProps extends React.HTMLAttributes<HTMLDivElement> {\n  label: string\n  value: number\n  total: number\n  color: string\n  formatValue?: (value: number) => string\n  formatTotal?: (total: number) => string\n}\n\nconst WidgetProgressChunkRow = React.forwardRef<HTMLDivElement, WidgetProgressChunkRowProps>(\n  ({ className, label, value, total, color, formatValue, formatTotal, ...props }, ref) => {\n    const pct = total > 0 ? (value / total) * 100 : 0\n    const displayValue = formatValue ? formatValue(value) : String(value)\n    const displayTotal = formatTotal ? formatTotal(total) : String(total)\n\n    return (\n      <div ref={ref} className={cn('flex flex-col gap-1', className)} {...props}>\n        <div className=\"flex items-center justify-between text-xs\">\n          <span className=\"text-[var(--av-fixed-primary)]\">{label}</span>\n          <span className=\"font-semibold tabular-nums\">\n            {displayValue} / {displayTotal}\n          </span>\n        </div>\n        <div className=\"h-2 w-full overflow-hidden rounded bg-[var(--av-brand-light)]\">\n          <div\n            className=\"h-full rounded transition-all\"\n            style={{\n              width: `${Math.min(pct, 100)}%`,\n              backgroundColor: color,\n            }}\n          />\n        </div>\n      </div>\n    )\n  }\n)\nWidgetProgressChunkRow.displayName = 'WidgetProgressChunkRow'\n\nconst WidgetProgressChunksFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'border-t border-[var(--av-brand-accent)] px-6 py-2 text-xs',\n      className\n    )}\n    {...props}\n  />\n))\nWidgetProgressChunksFooter.displayName = 'WidgetProgressChunksFooter'\n\nexport {\n  WidgetProgressChunks,\n  WidgetProgressChunksHeader,\n  WidgetProgressChunksTitle,\n  WidgetProgressChunksIcon,\n  WidgetProgressChunksBody,\n  WidgetProgressChunkRow,\n  WidgetProgressChunksFooter,\n}\n"],"names":["WidgetProgressChunks","React","className","interactive","props","ref","jsx","cn","WidgetProgressChunksHeader","WidgetProgressChunksTitle","WidgetProgressChunksIcon","WidgetProgressChunksBody","WidgetProgressChunkRow","label","value","total","color","formatValue","formatTotal","pct","displayValue","displayTotal","jsxs","WidgetProgressChunksFooter"],"mappings":"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"}
+{"version":3,"file":"widget-progress-chunks.js","sources":["../../../src/components/ui/widget-progress-chunks.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\n/**\n * WidgetProgressChunks — Chunked progress visualization widget.\n * Figma: Charts-anatomy / Progress-Chunks (node 237:74702)\n *\n * Shows progress as discrete colored chunks/segments with labels and values.\n * Colors: chart-success, chart-warning, chart-critical, chart-danger\n * Background: inversed-primary, Border: brand-light\n * Divider: brand-accent\n *\n * Anatomy:\n * - WidgetProgressChunks (root)\n *   - Header: title + icon\n *   - Chunks: rows of labeled progress segments\n *   - Footer: optional summary\n *\n * States: hover, active, focus, focus-data\n */\n\nexport interface ProgressChunk {\n  label: string;\n  value: number;\n  total: number;\n  color: string;\n}\n\nexport interface WidgetProgressChunksProps extends React.HTMLAttributes<HTMLDivElement> {\n  interactive?: boolean;\n}\n\nconst WidgetProgressChunks = React.forwardRef<\n  HTMLDivElement,\n  WidgetProgressChunksProps\n>(({ className, interactive, ...props }, ref) => (\n  <div\n    ref={ref}\n    tabIndex={interactive ? 0 : undefined}\n    className={cn(\n      'relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors',\n      interactive &&\n        'cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetProgressChunks.displayName = 'WidgetProgressChunks';\n\nconst WidgetProgressChunksHeader = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex items-center gap-2 px-6 pt-4 pb-2', className)}\n    {...props}\n  />\n));\nWidgetProgressChunksHeader.displayName = 'WidgetProgressChunksHeader';\n\nconst WidgetProgressChunksTitle = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex-1 truncate text-sm font-semibold leading-6', className)}\n    {...props}\n  />\n));\nWidgetProgressChunksTitle.displayName = 'WidgetProgressChunksTitle';\n\nconst WidgetProgressChunksIcon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetProgressChunksIcon.displayName = 'WidgetProgressChunksIcon';\n\nconst WidgetProgressChunksBody = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex flex-col gap-2 px-6 py-2', className)}\n    {...props}\n  />\n));\nWidgetProgressChunksBody.displayName = 'WidgetProgressChunksBody';\n\nexport interface WidgetProgressChunkRowProps extends React.HTMLAttributes<HTMLDivElement> {\n  label: string;\n  value: number;\n  total: number;\n  color: string;\n  formatValue?: (value: number) => string;\n  formatTotal?: (total: number) => string;\n}\n\nconst WidgetProgressChunkRow = React.forwardRef<\n  HTMLDivElement,\n  WidgetProgressChunkRowProps\n>(\n  (\n    {\n      className,\n      label,\n      value,\n      total,\n      color,\n      formatValue,\n      formatTotal,\n      ...props\n    },\n    ref\n  ) => {\n    const pct = total > 0 ? (value / total) * 100 : 0;\n    const displayValue = formatValue ? formatValue(value) : String(value);\n    const displayTotal = formatTotal ? formatTotal(total) : String(total);\n\n    return (\n      <div\n        ref={ref}\n        className={cn('flex flex-col gap-1', className)}\n        {...props}\n      >\n        <div className=\"flex items-center justify-between text-xs\">\n          <span className=\"text-[var(--av-fixed-primary)]\">{label}</span>\n          <span className=\"font-semibold tabular-nums\">\n            {displayValue} / {displayTotal}\n          </span>\n        </div>\n        <div className=\"h-2 w-full overflow-hidden rounded bg-[var(--av-brand-light)]\">\n          <div\n            className=\"h-full rounded transition-all\"\n            style={{\n              width: `${Math.min(pct, 100)}%`,\n              backgroundColor: color,\n            }}\n          />\n        </div>\n      </div>\n    );\n  }\n);\nWidgetProgressChunkRow.displayName = 'WidgetProgressChunkRow';\n\nconst WidgetProgressChunksFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'border-t border-[var(--av-brand-accent)] px-6 py-2 text-xs',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetProgressChunksFooter.displayName = 'WidgetProgressChunksFooter';\n\nexport {\n  WidgetProgressChunks,\n  WidgetProgressChunksHeader,\n  WidgetProgressChunksTitle,\n  WidgetProgressChunksIcon,\n  WidgetProgressChunksBody,\n  WidgetProgressChunkRow,\n  WidgetProgressChunksFooter,\n};\n"],"names":["WidgetProgressChunks","React","className","interactive","props","ref","jsx","cn","WidgetProgressChunksHeader","WidgetProgressChunksTitle","WidgetProgressChunksIcon","WidgetProgressChunksBody","WidgetProgressChunkRow","label","value","total","color","formatValue","formatTotal","pct","displayValue","displayTotal","jsxs","WidgetProgressChunksFooter"],"mappings":";;;AAiCA,MAAMA,IAAuBC,EAAM,WAGjC,CAAC,EAAE,WAAAC,GAAW,aAAAC,GAAa,GAAGC,KAASC,MACvC,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,UAAUF,IAAc,IAAI;AAAA,IAC5B,WAAWI;AAAA,MACT;AAAA,MACAJ,KACE;AAAA,MACFD;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDJ,EAAqB,cAAc;AAEnC,MAAMQ,IAA6BP,EAAM,WAGvC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,0CAA0CL,CAAS;AAAA,IAChE,GAAGE;AAAA,EAAA;AACN,CACD;AACDI,EAA2B,cAAc;AAEzC,MAAMC,IAA4BR,EAAM,WAGtC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,mDAAmDL,CAAS;AAAA,IACzE,GAAGE;AAAA,EAAA;AACN,CACD;AACDK,EAA0B,cAAc;AAExC,MAAMC,IAA2BT,EAAM,WAGrC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDM,EAAyB,cAAc;AAEvC,MAAMC,IAA2BV,EAAM,WAGrC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE,EAAG,iCAAiCL,CAAS;AAAA,IACvD,GAAGE;AAAA,EAAA;AACN,CACD;AACDO,EAAyB,cAAc;AAWvC,MAAMC,IAAyBX,EAAM;AAAA,EAInC,CACE;AAAA,IACE,WAAAC;AAAA,IACA,OAAAW;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,GAAGd;AAAA,EAAA,GAELC,MACG;AACH,UAAMc,IAAMJ,IAAQ,IAAKD,IAAQC,IAAS,MAAM,GAC1CK,IAAeH,IAAcA,EAAYH,CAAK,IAAI,OAAOA,CAAK,GAC9DO,IAAeH,IAAcA,EAAYH,CAAK,IAAI,OAAOA,CAAK;AAEpE,WACE,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAjB;AAAA,QACA,WAAWE,EAAG,uBAAuBL,CAAS;AAAA,QAC7C,GAAGE;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAkB,EAAC,OAAA,EAAI,WAAU,6CACb,UAAA;AAAA,YAAA,gBAAAhB,EAAC,QAAA,EAAK,WAAU,kCAAkC,UAAAO,GAAM;AAAA,YACxD,gBAAAS,EAAC,QAAA,EAAK,WAAU,8BACb,UAAA;AAAA,cAAAF;AAAA,cAAa;AAAA,cAAIC;AAAA,YAAA,EAAA,CACpB;AAAA,UAAA,GACF;AAAA,UACA,gBAAAf,EAAC,OAAA,EAAI,WAAU,iEACb,UAAA,gBAAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO;AAAA,gBACL,OAAO,GAAG,KAAK,IAAIa,GAAK,GAAG,CAAC;AAAA,gBAC5B,iBAAiBH;AAAA,cAAA;AAAA,YACnB;AAAA,UAAA,EACF,CACF;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AACAJ,EAAuB,cAAc;AAErC,MAAMW,IAA6BtB,EAAM,WAGvC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAA,GAASC,MAC1B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAL;AAAA,IAAA;AAAA,IAED,GAAGE;AAAA,EAAA;AACN,CACD;AACDmB,EAA2B,cAAc;"}

package/dist/components/ui/widget-progress-tiers.js

@@ -1,21 +1,19 @@
 import { jsx as a, jsxs as f } from "react/jsx-runtime";
 import * as i from "react";
 import { cn as o } from "../../lib/utils.js";
-const v = i.forwardRef(
-  ({ className: r, interactive: e, ...s }, d) => /* @__PURE__ */ a(
-    "div",
-    {
-      ref: d,
-      tabIndex: e ? 0 : void 0,
-      className: o(
-        "relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors",
-        e && "cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]",
-        r
-      ),
-      ...s
-    }
-  )
-);
+const v = i.forwardRef(({ className: r, interactive: e, ...s }, d) => /* @__PURE__ */ a(
+  "div",
+  {
+    ref: d,
+    tabIndex: e ? 0 : void 0,
+    className: o(
+      "relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors",
+      e && "cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]",
+      r
+    ),
+    ...s
+  }
+));
 v.displayName = "WidgetProgressTiers";
 const m = i.forwardRef(({ className: r, ...e }, s) => /* @__PURE__ */ a(
   "div",
@@ -39,39 +37,40 @@ const x = i.forwardRef(({ className: r, ...e }, s) => /* @__PURE__ */ a(
   "div",
   {
     ref: s,
-    className: o("flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4", r),
+    className: o(
+      "flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4",
+      r
+    ),
     ...e
   }
 ));
 x.displayName = "WidgetProgressTiersIcon";
-const u = i.forwardRef(
-  ({ className: r, tiers: e, total: s, ...d }, n) => {
-    const t = s ?? e.reduce((l, c) => l + c.value, 0);
-    return /* @__PURE__ */ a(
-      "div",
-      {
-        ref: n,
-        className: o("flex h-6 w-full overflow-hidden rounded px-6", r),
-        ...d,
-        children: /* @__PURE__ */ a("div", { className: "flex h-full w-full overflow-hidden rounded border border-[var(--av-fixed-invisible)]", children: e.map((l, c) => {
-          const g = t > 0 ? l.value / t * 100 : 0;
-          return /* @__PURE__ */ a(
-            "div",
-            {
-              className: "h-full transition-all",
-              style: {
-                width: `${g}%`,
-                backgroundColor: l.color
-              },
-              title: `${l.label}: ${l.value}`
+const u = i.forwardRef(({ className: r, tiers: e, total: s, ...d }, n) => {
+  const t = s ?? e.reduce((l, c) => l + c.value, 0);
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      ref: n,
+      className: o("flex h-6 w-full overflow-hidden rounded px-6", r),
+      ...d,
+      children: /* @__PURE__ */ a("div", { className: "flex h-full w-full overflow-hidden rounded border border-[var(--av-fixed-invisible)]", children: e.map((l, c) => {
+        const g = t > 0 ? l.value / t * 100 : 0;
+        return /* @__PURE__ */ a(
+          "div",
+          {
+            className: "h-full transition-all",
+            style: {
+              width: `${g}%`,
+              backgroundColor: l.color
             },
-            c
-          );
-        }) })
-      }
-    );
-  }
-);
+            title: `${l.label}: ${l.value}`
+          },
+          c
+        );
+      }) })
+    }
+  );
+});
 u.displayName = "WidgetProgressTiersBar";
 const b = i.forwardRef(({ className: r, ...e }, s) => /* @__PURE__ */ a(
   "div",
@@ -82,27 +81,25 @@ const b = i.forwardRef(({ className: r, ...e }, s) => /* @__PURE__ */ a(
   }
 ));
 b.displayName = "WidgetProgressTiersLegend";
-const N = i.forwardRef(
-  ({ className: r, color: e, label: s, value: d, ...n }, t) => /* @__PURE__ */ f(
-    "div",
-    {
-      ref: t,
-      className: o("flex items-center gap-1.5 text-xs", r),
-      ...n,
-      children: [
-        /* @__PURE__ */ a(
-          "div",
-          {
-            className: "h-2 w-2 rounded-sm flex-shrink-0",
-            style: { backgroundColor: e }
-          }
-        ),
-        /* @__PURE__ */ a("span", { className: "text-[var(--av-fixed-primary)]", children: s }),
-        d !== void 0 && /* @__PURE__ */ a("span", { className: "font-semibold tabular-nums", children: d })
-      ]
-    }
-  )
-);
+const N = i.forwardRef(({ className: r, color: e, label: s, value: d, ...n }, t) => /* @__PURE__ */ f(
+  "div",
+  {
+    ref: t,
+    className: o("flex items-center gap-1.5 text-xs", r),
+    ...n,
+    children: [
+      /* @__PURE__ */ a(
+        "div",
+        {
+          className: "h-2 w-2 rounded-sm flex-shrink-0",
+          style: { backgroundColor: e }
+        }
+      ),
+      /* @__PURE__ */ a("span", { className: "text-[var(--av-fixed-primary)]", children: s }),
+      d !== void 0 && /* @__PURE__ */ a("span", { className: "font-semibold tabular-nums", children: d })
+    ]
+  }
+));
 N.displayName = "WidgetProgressTiersLegendItem";
 const h = i.forwardRef(({ className: r, ...e }, s) => /* @__PURE__ */ a(
   "div",

package/dist/components/ui/widget-progress-tiers.js.map

@@ -1 +1 @@
-{"version":3,"file":"widget-progress-tiers.js","sources":["../../../src/components/ui/widget-progress-tiers.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '@/lib/utils'\n\n/**\n * WidgetProgressTiers — Tiered progress bar widget for dashboard.\n * Figma: Charts-anatomy / Progress-Tiers (node 229:70578)\n *\n * Shows a horizontal stacked bar with colored tiers and labels.\n * Colors: chart-success, chart-warning, chart-critical, chart-danger, chart-neutral\n * Background: inversed-primary, Border: brand-light\n * Divider: brand-accent\n *\n * Anatomy:\n * - WidgetProgressTiers (root)\n *   - Header: title + icon + dropdown\n *   - Bar: stacked horizontal segments\n *   - Legend: tier labels with values\n *   - Footer: optional summary\n *\n * States: hover (el-secondary-hover), active (el-secondary-active), focus (fixed-focus), focus-data (fixed-focus on tier)\n */\n\nexport interface ProgressTier {\n  label: string\n  value: number\n  color: string\n}\n\nexport interface WidgetProgressTiersProps extends React.HTMLAttributes<HTMLDivElement> {\n  interactive?: boolean\n}\n\nconst WidgetProgressTiers = React.forwardRef<HTMLDivElement, WidgetProgressTiersProps>(\n  ({ className, interactive, ...props }, ref) => (\n    <div\n      ref={ref}\n      tabIndex={interactive ? 0 : undefined}\n      className={cn(\n        'relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors',\n        interactive && 'cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]',\n        className\n      )}\n      {...props}\n    />\n  )\n)\nWidgetProgressTiers.displayName = 'WidgetProgressTiers'\n\nconst WidgetProgressTiersHeader = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex items-center gap-2 px-6 pt-4 pb-2', className)}\n    {...props}\n  />\n))\nWidgetProgressTiersHeader.displayName = 'WidgetProgressTiersHeader'\n\nconst WidgetProgressTiersTitle = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex-1 truncate text-sm font-semibold leading-6', className)}\n    {...props}\n  />\n))\nWidgetProgressTiersTitle.displayName = 'WidgetProgressTiersTitle'\n\nconst WidgetProgressTiersIcon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4', className)}\n    {...props}\n  />\n))\nWidgetProgressTiersIcon.displayName = 'WidgetProgressTiersIcon'\n\nexport interface WidgetProgressTiersBarProps extends React.HTMLAttributes<HTMLDivElement> {\n  tiers: ProgressTier[]\n  total?: number\n}\n\nconst WidgetProgressTiersBar = React.forwardRef<HTMLDivElement, WidgetProgressTiersBarProps>(\n  ({ className, tiers, total, ...props }, ref) => {\n    const sum = total ?? tiers.reduce((acc, t) => acc + t.value, 0)\n\n    return (\n      <div\n        ref={ref}\n        className={cn('flex h-6 w-full overflow-hidden rounded px-6', className)}\n        {...props}\n      >\n        <div className=\"flex h-full w-full overflow-hidden rounded border border-[var(--av-fixed-invisible)]\">\n          {tiers.map((tier, index) => {\n            const pct = sum > 0 ? (tier.value / sum) * 100 : 0\n            return (\n              <div\n                key={index}\n                className=\"h-full transition-all\"\n                style={{\n                  width: `${pct}%`,\n                  backgroundColor: tier.color,\n                }}\n                title={`${tier.label}: ${tier.value}`}\n              />\n            )\n          })}\n        </div>\n      </div>\n    )\n  }\n)\nWidgetProgressTiersBar.displayName = 'WidgetProgressTiersBar'\n\nconst WidgetProgressTiersLegend = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex flex-wrap gap-x-4 gap-y-1 px-6 py-2', className)}\n    {...props}\n  />\n))\nWidgetProgressTiersLegend.displayName = 'WidgetProgressTiersLegend'\n\nexport interface WidgetProgressTiersLegendItemProps extends React.HTMLAttributes<HTMLDivElement> {\n  color: string\n  label: string\n  value?: string | number\n}\n\nconst WidgetProgressTiersLegendItem = React.forwardRef<HTMLDivElement, WidgetProgressTiersLegendItemProps>(\n  ({ className, color, label, value, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={cn('flex items-center gap-1.5 text-xs', className)}\n      {...props}\n    >\n      <div\n        className=\"h-2 w-2 rounded-sm flex-shrink-0\"\n        style={{ backgroundColor: color }}\n      />\n      <span className=\"text-[var(--av-fixed-primary)]\">{label}</span>\n      {value !== undefined && (\n        <span className=\"font-semibold tabular-nums\">{value}</span>\n      )}\n    </div>\n  )\n)\nWidgetProgressTiersLegendItem.displayName = 'WidgetProgressTiersLegendItem'\n\nconst WidgetProgressTiersFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'border-t border-[var(--av-brand-accent)] px-6 py-2 text-xs',\n      className\n    )}\n    {...props}\n  />\n))\nWidgetProgressTiersFooter.displayName = 'WidgetProgressTiersFooter'\n\nexport {\n  WidgetProgressTiers,\n  WidgetProgressTiersHeader,\n  WidgetProgressTiersTitle,\n  WidgetProgressTiersIcon,\n  WidgetProgressTiersBar,\n  WidgetProgressTiersLegend,\n  WidgetProgressTiersLegendItem,\n  WidgetProgressTiersFooter,\n}\n"],"names":["WidgetProgressTiers","React","className","interactive","props","ref","jsx","cn","WidgetProgressTiersHeader","WidgetProgressTiersTitle","WidgetProgressTiersIcon","WidgetProgressTiersBar","tiers","total","sum","acc","t","tier","index","pct","WidgetProgressTiersLegend","WidgetProgressTiersLegendItem","color","label","value","jsxs","WidgetProgressTiersFooter"],"mappings":"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"}
+{"version":3,"file":"widget-progress-tiers.js","sources":["../../../src/components/ui/widget-progress-tiers.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\n/**\n * WidgetProgressTiers — Tiered progress bar widget for dashboard.\n * Figma: Charts-anatomy / Progress-Tiers (node 229:70578)\n *\n * Shows a horizontal stacked bar with colored tiers and labels.\n * Colors: chart-success, chart-warning, chart-critical, chart-danger, chart-neutral\n * Background: inversed-primary, Border: brand-light\n * Divider: brand-accent\n *\n * Anatomy:\n * - WidgetProgressTiers (root)\n *   - Header: title + icon + dropdown\n *   - Bar: stacked horizontal segments\n *   - Legend: tier labels with values\n *   - Footer: optional summary\n *\n * States: hover (el-secondary-hover), active (el-secondary-active), focus (fixed-focus), focus-data (fixed-focus on tier)\n */\n\nexport interface ProgressTier {\n  label: string;\n  value: number;\n  color: string;\n}\n\nexport interface WidgetProgressTiersProps extends React.HTMLAttributes<HTMLDivElement> {\n  interactive?: boolean;\n}\n\nconst WidgetProgressTiers = React.forwardRef<\n  HTMLDivElement,\n  WidgetProgressTiersProps\n>(({ className, interactive, ...props }, ref) => (\n  <div\n    ref={ref}\n    tabIndex={interactive ? 0 : undefined}\n    className={cn(\n      'relative flex flex-col rounded-lg border border-[var(--av-brand-light)] bg-[var(--av-inversed-primary)] text-[var(--av-fixed-primary)] transition-colors',\n      interactive &&\n        'cursor-pointer hover:bg-[var(--av-el-secondary-hover)] active:bg-[var(--av-el-secondary-active)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--av-fixed-focus)]',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetProgressTiers.displayName = 'WidgetProgressTiers';\n\nconst WidgetProgressTiersHeader = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex items-center gap-2 px-6 pt-4 pb-2', className)}\n    {...props}\n  />\n));\nWidgetProgressTiersHeader.displayName = 'WidgetProgressTiersHeader';\n\nconst WidgetProgressTiersTitle = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex-1 truncate text-sm font-semibold leading-6', className)}\n    {...props}\n  />\n));\nWidgetProgressTiersTitle.displayName = 'WidgetProgressTiersTitle';\n\nconst WidgetProgressTiersIcon = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'flex-shrink-0 text-[var(--av-fixed-link)] [&>svg]:h-4 [&>svg]:w-4',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetProgressTiersIcon.displayName = 'WidgetProgressTiersIcon';\n\nexport interface WidgetProgressTiersBarProps extends React.HTMLAttributes<HTMLDivElement> {\n  tiers: ProgressTier[];\n  total?: number;\n}\n\nconst WidgetProgressTiersBar = React.forwardRef<\n  HTMLDivElement,\n  WidgetProgressTiersBarProps\n>(({ className, tiers, total, ...props }, ref) => {\n  const sum = total ?? tiers.reduce((acc, t) => acc + t.value, 0);\n\n  return (\n    <div\n      ref={ref}\n      className={cn('flex h-6 w-full overflow-hidden rounded px-6', className)}\n      {...props}\n    >\n      <div className=\"flex h-full w-full overflow-hidden rounded border border-[var(--av-fixed-invisible)]\">\n        {tiers.map((tier, index) => {\n          const pct = sum > 0 ? (tier.value / sum) * 100 : 0;\n          return (\n            <div\n              key={index}\n              className=\"h-full transition-all\"\n              style={{\n                width: `${pct}%`,\n                backgroundColor: tier.color,\n              }}\n              title={`${tier.label}: ${tier.value}`}\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n});\nWidgetProgressTiersBar.displayName = 'WidgetProgressTiersBar';\n\nconst WidgetProgressTiersLegend = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex flex-wrap gap-x-4 gap-y-1 px-6 py-2', className)}\n    {...props}\n  />\n));\nWidgetProgressTiersLegend.displayName = 'WidgetProgressTiersLegend';\n\nexport interface WidgetProgressTiersLegendItemProps extends React.HTMLAttributes<HTMLDivElement> {\n  color: string;\n  label: string;\n  value?: string | number;\n}\n\nconst WidgetProgressTiersLegendItem = React.forwardRef<\n  HTMLDivElement,\n  WidgetProgressTiersLegendItemProps\n>(({ className, color, label, value, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn('flex items-center gap-1.5 text-xs', className)}\n    {...props}\n  >\n    <div\n      className=\"h-2 w-2 rounded-sm flex-shrink-0\"\n      style={{ backgroundColor: color }}\n    />\n    <span className=\"text-[var(--av-fixed-primary)]\">{label}</span>\n    {value !== undefined && (\n      <span className=\"font-semibold tabular-nums\">{value}</span>\n    )}\n  </div>\n));\nWidgetProgressTiersLegendItem.displayName = 'WidgetProgressTiersLegendItem';\n\nconst WidgetProgressTiersFooter = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      'border-t border-[var(--av-brand-accent)] px-6 py-2 text-xs',\n      className\n    )}\n    {...props}\n  />\n));\nWidgetProgressTiersFooter.displayName = 'WidgetProgressTiersFooter';\n\nexport {\n  WidgetProgressTiers,\n  WidgetProgressTiersHeader,\n  WidgetProgressTiersTitle,\n  WidgetProgressTiersIcon,\n  WidgetProgressTiersBar,\n  WidgetProgressTiersLegend,\n  WidgetProgressTiersLegendItem,\n  WidgetProgressTiersFooter,\n};\n"],"names":["WidgetProgressTiers","React","className","interactive","props","ref","jsx","cn","WidgetProgressTiersHeader","WidgetProgressTiersTitle","WidgetProgressTiersIcon","WidgetProgressTiersBar","tiers","total","sum","acc","t","tier","index","pct","WidgetProgressTiersLegend","WidgetProgressTiersLegendItem","color","label","value","jsxs","WidgetProgressTiersFooter"],"mappings":"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"}