impact-nova 1.8.2 → 1.9.0-alpha.0

package/dist/components/ui/empty-container.js

@@ -1,8 +1,13 @@
 import { jsx as r } from "react/jsx-runtime";
-import * as m from "react";
+import * as i from "react";
 import { Slot as p } from "@radix-ui/react-slot";
 import { cn as s } from "../../lib/utils.js";
-import { EmptyState1 as E, EmptyState2 as w, EmptyState3 as b, EmptyState4 as N, EmptyState5 as S, EmptyState6 as I } from "../../icons/index.js";
+import { EmptyState1 as E } from "../../icons/generated/webp-empty-state-1.js";
+import { EmptyState2 as w } from "../../icons/generated/webp-empty-state-2.js";
+import { EmptyState3 as b } from "../../icons/generated/webp-empty-state-3.js";
+import { EmptyState4 as N } from "../../icons/generated/webp-empty-state-4.js";
+import { EmptyState5 as S } from "../../icons/generated/webp-empty-state-5.js";
+import { EmptyState6 as I } from "../../icons/generated/webp-empty-state-6.js";
 const c = [
   { Component: E, width: 225, height: 150 },
   { Component: w, width: 200, height: 200 },
@@ -10,7 +15,7 @@ const c = [
   { Component: N, width: 250, height: 180 },
   { Component: S, width: 225, height: 150 },
   { Component: I, width: 225, height: 150 }
-], v = m.forwardRef(
+], v = i.forwardRef(
   ({ className: o, children: t, asChild: e = !1, ...n }, a) => /* @__PURE__ */ r(
     e ? p : "div",
     {
@@ -26,8 +31,8 @@ const c = [
   )
 );
 v.displayName = "EmptyContainer";
-const R = m.forwardRef(({ className: o, children: t, width: e, height: n, asChild: a = !1, ...i }, f) => {
-  const [l, M] = m.useState(() => t ? null : Math.floor(Math.random() * c.length)), h = () => {
+const R = i.forwardRef(({ className: o, children: t, width: e, height: n, asChild: a = !1, ...m }, d) => {
+  const [l, M] = i.useState(() => t ? null : Math.floor(Math.random() * c.length)), h = () => {
     if (t) return t;
     if (l !== null) {
       const {
@@ -47,11 +52,11 @@ const R = m.forwardRef(({ className: o, children: t, width: e, height: n, asChil
       );
     }
     return null;
-  }, d = l !== null ? c[l] : null, u = e || (t ? "auto" : d?.width || 225), y = n || (t ? "auto" : d?.height || 150);
+  }, f = l !== null ? c[l] : null, u = e || (t ? "auto" : f?.width || 225), y = n || (t ? "auto" : f?.height || 150);
   return /* @__PURE__ */ r(
     a ? p : "div",
     {
-      ref: f,
+      ref: d,
       className: s(
         "mb-4 flex items-center justify-center relative",
         "after:absolute after:inset-0 after:bg-brand/5 after:blur-3xl after:-z-10 after:rounded-full",
@@ -60,16 +65,16 @@ const R = m.forwardRef(({ className: o, children: t, width: e, height: n, asChil
       style: {
         width: u,
         height: y,
-        ...i.style
+        ...m.style
       },
       "data-component": "empty-container-image",
-      ...i,
+      ...m,
       children: h()
     }
   );
 });
 R.displayName = "EmptyContainerImage";
-const T = m.forwardRef(({ className: o, children: t, asChild: e = !1, ...n }, a) => /* @__PURE__ */ r(
+const T = i.forwardRef(({ className: o, children: t, asChild: e = !1, ...n }, a) => /* @__PURE__ */ r(
   e ? p : "h3",
   {
     ref: a,
@@ -83,7 +88,7 @@ const T = m.forwardRef(({ className: o, children: t, asChild: e = !1, ...n }, a)
   }
 ));
 T.displayName = "EmptyContainerTitle";
-const j = m.forwardRef(({ className: o, children: t, asChild: e = !1, ...n }, a) => /* @__PURE__ */ r(
+const j = i.forwardRef(({ className: o, children: t, asChild: e = !1, ...n }, a) => /* @__PURE__ */ r(
   e ? p : "p",
   {
     ref: a,
@@ -97,7 +102,7 @@ const j = m.forwardRef(({ className: o, children: t, asChild: e = !1, ...n }, a)
   }
 ));
 j.displayName = "EmptyContainerDescription";
-const A = m.forwardRef(({ className: o, children: t, asChild: e = !1, ...n }, a) => /* @__PURE__ */ r(
+const A = i.forwardRef(({ className: o, children: t, asChild: e = !1, ...n }, a) => /* @__PURE__ */ r(
   e ? p : "div",
   {
     ref: a,
@@ -118,3 +123,4 @@ export {
   R as EmptyContainerImage,
   T as EmptyContainerTitle
 };
+//# sourceMappingURL=empty-container.js.map

package/dist/components/ui/empty-container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty-container.js","sources":["impact-nova/src/components/ui/empty-container.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cn } from \"@/lib/utils\";\nimport type {\n  EmptyContainerProps,\n  EmptyContainerImageProps,\n  EmptyContainerTitleProps,\n  EmptyContainerDescriptionProps,\n  EmptyContainerActionProps,\n} from \"./types/empty-container.types\";\nimport {\n  EmptyState1,\n} from \"@/icons/generated/webp-empty-state-1\";\nimport {\n  EmptyState2,\n} from \"@/icons/generated/webp-empty-state-2\";\nimport {\n  EmptyState3,\n} from \"@/icons/generated/webp-empty-state-3\";\nimport {\n  EmptyState4,\n} from \"@/icons/generated/webp-empty-state-4\";\nimport {\n  EmptyState5,\n} from \"@/icons/generated/webp-empty-state-5\";\nimport {\n  EmptyState6,\n} from \"@/icons/generated/webp-empty-state-6\";\n\nconst EMPTY_STATE_IMAGES = [\n  { Component: EmptyState1, width: 225, height: 150 },\n  { Component: EmptyState2, width: 200, height: 200 },\n  { Component: EmptyState3, width: 225, height: 150 },\n  { Component: EmptyState4, width: 250, height: 180 },\n  { Component: EmptyState5, width: 225, height: 150 },\n  { Component: EmptyState6, width: 225, height: 150 },\n];\n\nconst EmptyContainer = React.forwardRef<HTMLDivElement, EmptyContainerProps>(\n  ({ className, children, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : \"div\";\n    return (\n      <Comp\n        ref={ref}\n        className={cn(\n          \"flex flex-col items-center justify-center py-16 px-5 text-center animate-in fade-in zoom-in duration-300 border border-stroke-subtle rounded-xl bg-canvas-elevated w-[884px] min-w-[884px] h-auto\",\n          className,\n        )}\n        data-component=\"empty-container\"\n        {...props}\n      >\n        <div className=\"flex flex-col items-center max-w-[650px]\">\n          {children}\n        </div>\n      </Comp>\n    );\n  },\n);\nEmptyContainer.displayName = \"EmptyContainer\";\n\nconst EmptyContainerImage = React.forwardRef<\n  HTMLDivElement,\n  EmptyContainerImageProps\n>(({ className, children, width, height, asChild = false, ...props }, ref) => {\n  const [currentImageIndex, setCurrentImageIndex] = React.useState<\n    number | null\n  >(() => {\n    // Initialize with random index if no children provided to avoid empty initial render\n    if (!children) {\n      return Math.floor(Math.random() * EMPTY_STATE_IMAGES.length);\n    }\n    return null;\n  });\n\n  const renderContent = () => {\n    if (children) return children;\n    if (currentImageIndex !== null) {\n      const {\n        Component,\n        width: defWidth,\n        height: defHeight,\n      } = EMPTY_STATE_IMAGES[currentImageIndex];\n      return (\n        <Component\n          size=\"100%\"\n          style={{\n            width: width || defWidth,\n            height: height || defHeight,\n          }}\n        />\n      );\n    }\n    return null;\n  };\n\n  const currentImageData =\n    currentImageIndex !== null ? EMPTY_STATE_IMAGES[currentImageIndex] : null;\n  const finalWidth =\n    width || (children ? \"auto\" : currentImageData?.width || 225);\n  const finalHeight =\n    height || (children ? \"auto\" : currentImageData?.height || 150);\n\n  const Comp = asChild ? Slot : \"div\";\n\n  return (\n    <Comp\n      ref={ref}\n      className={cn(\n        \"mb-4 flex items-center justify-center relative\",\n        \"after:absolute after:inset-0 after:bg-brand/5 after:blur-3xl after:-z-10 after:rounded-full\",\n        className,\n      )}\n      style={{\n        width: finalWidth,\n        height: finalHeight,\n        ...props.style,\n      }}\n      data-component=\"empty-container-image\"\n      {...props}\n    >\n      {renderContent()}\n    </Comp>\n  );\n});\nEmptyContainerImage.displayName = \"EmptyContainerImage\";\n\nconst EmptyContainerTitle = React.forwardRef<\n  HTMLHeadingElement,\n  EmptyContainerTitleProps\n>(({ className, children, asChild = false, ...props }, ref) => {\n  const Comp = asChild ? Slot : \"h3\";\n  return (\n    <Comp\n      ref={ref}\n      className={cn(\n        \"text-xl font-bold tracking-tight leading-[30px] text-content\",\n        className,\n      )}\n      data-component=\"empty-container-title\"\n      {...props}\n    >\n      {children}\n    </Comp>\n  );\n});\nEmptyContainerTitle.displayName = \"EmptyContainerTitle\";\n\nconst EmptyContainerDescription = React.forwardRef<\n  HTMLParagraphElement,\n  EmptyContainerDescriptionProps\n>(({ className, children, asChild = false, ...props }, ref) => {\n  const Comp = asChild ? Slot : \"p\";\n  return (\n    <Comp\n      ref={ref}\n      className={cn(\n        \"text-base leading-[21px] mt-1 font-medium text-secondary-foreground\",\n        className,\n      )}\n      data-component=\"empty-container-description\"\n      {...props}\n    >\n      {children}\n    </Comp>\n  );\n});\nEmptyContainerDescription.displayName = \"EmptyContainerDescription\";\n\nconst EmptyContainerAction = React.forwardRef<\n  HTMLDivElement,\n  EmptyContainerActionProps\n>(({ className, children, asChild = false, ...props }, ref) => {\n  const Comp = asChild ? Slot : \"div\";\n  return (\n    <Comp\n      ref={ref}\n      className={cn(\n        \"mt-6 flex flex-wrap items-center justify-center gap-3\",\n        className,\n      )}\n      data-component=\"empty-container-action\"\n      {...props}\n    >\n      {children}\n    </Comp>\n  );\n});\nEmptyContainerAction.displayName = \"EmptyContainerAction\";\n\nexport {\n  EmptyContainer,\n  EmptyContainerImage,\n  EmptyContainerTitle,\n  EmptyContainerDescription,\n  EmptyContainerAction,\n};\n"],"names":["EMPTY_STATE_IMAGES","EmptyState1","EmptyState2","EmptyState3","EmptyState4","EmptyState5","EmptyState6","EmptyContainer","React","className","children","asChild","props","ref","jsx","Slot","cn","EmptyContainerImage","width","height","currentImageIndex","setCurrentImageIndex","renderContent","Component","defWidth","defHeight","currentImageData","finalWidth","finalHeight","EmptyContainerTitle","EmptyContainerDescription","EmptyContainerAction"],"mappings":"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"}

package/dist/components/ui/expandable-sku/expandable-sku.js

@@ -1,8 +1,8 @@
 import { jsx as e, jsxs as t } from "react/jsx-runtime";
 import * as B from "react";
 import { ChevronDown as E } from "lucide-react";
-import { Accordion as P, AccordionItem as V, AccordionTrigger as _, AccordionContent as R } from "../accordion.js";
-import { Badge as I } from "../badge.js";
+import { Accordion as P, AccordionItem as V, AccordionTrigger as R, AccordionContent as I } from "../accordion.js";
+import { Badge as _ } from "../badge.js";
 import { Checkbox as z } from "../checkbox.js";
 import { FilterPopoverContent as D } from "../filter-strip/filter-tag-list.js";
 import { Popover as M, PopoverTrigger as j } from "../popover.js";
@@ -28,7 +28,7 @@ function X({ section: a }) {
     /* @__PURE__ */ e("p", { className: "text-xs font-semibold leading-5 text-content-heading", children: a.title ?? "Attributes" }),
     /* @__PURE__ */ t("div", { className: "mt-2 flex flex-wrap gap-1.5", children: [
       s.map((c, u) => /* @__PURE__ */ e(
-        I,
+        _,
         {
           variant: "subtle",
           color: "neutral",
@@ -107,7 +107,7 @@ const H = B.forwardRef(
     collapseAriaLabel: T = "Collapse details",
     ...b
   }, g) => {
-    const w = d !== void 0, S = w ? d ? h : "" : void 0, m = !!(o || n?.checked), $ = f != null && f.length > 0 || v != null, N = (r) => /* @__PURE__ */ t(
+    const N = d !== void 0, S = N ? d ? h : "" : void 0, m = !!(o || n?.checked), $ = f != null && f.length > 0 || v != null, w = (r) => /* @__PURE__ */ t(
       "div",
       {
         className: p(
@@ -172,7 +172,7 @@ const H = B.forwardRef(
             type: "single",
             collapsible: !0,
             disabled: x,
-            ...w ? { value: S } : {
+            ...N ? { value: S } : {
               defaultValue: c ? h : void 0
             },
             onValueChange: (r) => u?.(r === h),
@@ -185,7 +185,7 @@ const H = B.forwardRef(
                   /* @__PURE__ */ t("div", { className: "flex items-start gap-3 px-3 py-3", children: [
                     C,
                     /* @__PURE__ */ t(
-                      _,
+                      R,
                       {
                         variant: "plain",
                         className: p(
@@ -193,11 +193,11 @@ const H = B.forwardRef(
                           x && "pointer-events-none opacity-50"
                         ),
                         children: [
-                          N(!1),
+                          w(!1),
                           /* @__PURE__ */ e(
                             "span",
                             {
-                              className: "expandable-sku-row__chev mt-0.5 inline-flex shrink-0 text-content-muted transition-transform duration-200 group-data-[state=open]:rotate-180",
+                              className: "mt-0.5 inline-flex shrink-0 text-content-muted transition-transform duration-200 group-data-[state=open]:rotate-180",
                               "aria-hidden": !0,
                               children: /* @__PURE__ */ e(E, { className: "size-4" })
                             }
@@ -211,7 +211,7 @@ const H = B.forwardRef(
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ e(R, { className: "border-0 bg-transparent p-0 pb-[0.01rem]", children: /* @__PURE__ */ t("div", { className: "mx-2 mb-2 overflow-hidden  bg-[#f8f9fb] pt-2 rounded-lg", children: [
+                  /* @__PURE__ */ e(I, { className: "border-0 bg-transparent p-0 pb-[0.01rem]", children: /* @__PURE__ */ t("div", { className: "mx-2 mb-2 overflow-hidden  bg-[#f8f9fb] pt-2 rounded-lg", children: [
                     f?.map((r) => G(r)),
                     v ? /* @__PURE__ */ e("div", { className: "px-4 py-3 sm:px-5", children: v }) : null
                   ] }) })
@@ -233,7 +233,7 @@ const H = B.forwardRef(
         ...b,
         children: /* @__PURE__ */ t("div", { className: "flex items-start gap-3 px-3 py-3", children: [
           C,
-          N(!!x)
+          w(!!x)
         ] })
       }
     );
@@ -243,3 +243,4 @@ H.displayName = "ExpandableSku";
 export {
   H as ExpandableSku
 };
+//# sourceMappingURL=expandable-sku.js.map

package/dist/components/ui/expandable-sku/expandable-sku.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"expandable-sku.js","sources":["impact-nova/src/components/ui/expandable-sku/expandable-sku.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ChevronDown } from \"lucide-react\";\n\nimport {\n  Accordion,\n  AccordionContent,\n  AccordionItem,\n  AccordionTrigger,\n} from \"@/components/ui/accordion\";\nimport { Badge } from \"@/components/ui/badge\";\nimport { Checkbox } from \"@/components/ui/checkbox\";\nimport { FilterPopoverContent } from \"@/components/ui/filter-strip/filter-tag-list\";\nimport { Popover, PopoverTrigger } from \"@/components/ui/popover\";\nimport { Tag } from \"@/components/ui/tag\";\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipTrigger,\n} from \"@/components/ui/tooltip\";\nimport { cn } from \"@/lib/utils\";\nimport type {\n  SkuRowAttributesSection,\n  SkuRowCustomSection,\n  SkuRowMetricsSection,\n  SkuRowSelection,\n  SkuRowSection,\n} from \"./expandable-sku.types\";\n\nexport type {\n  SkuRowAttributesSection,\n  SkuRowCustomSection,\n  SkuRowMetricColumn,\n  SkuRowMetricsSection,\n  SkuRowSelection,\n  SkuRowSection,\n} from \"./expandable-sku.types\";\n\nfunction MetricsBlock({ section }: { section: SkuRowMetricsSection }) {\n  const n = section.columns.length;\n  if (n === 0) return null;\n  return (\n    <div className=\"min-w-0 bg-transparent\">\n      <div className=\"scrollbar-hide overflow-x-auto overscroll-x-contain [-webkit-overflow-scrolling:touch]\">\n        <div className=\"flex min-w-0 flex-nowrap divide-x divide-stroke-hairline px-4 py-4 sm:px-5\">\n          {section.columns.map((col, i) => (\n            <div\n              key={`${section.id}-metric-${i}`}\n              className=\"flex min-w-[7.5rem] flex-1 basis-0 flex-col gap-1 overflow-hidden px-3 first:pl-0 last:pr-0 sm:min-w-[8rem] sm:px-4\"\n            >\n              <p className=\"truncate text-xs font-semibold leading-5 text-content-heading\" title={col.label}>\n                {col.label}\n              </p>\n              <p className=\"truncate text-sm font-semibold leading-5 text-content\" title={String(col.value)}>\n                {col.value}\n              </p>\n            </div>\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n}\n\nfunction AttributesBlock({ section }: { section: SkuRowAttributesSection }) {\n  const max = section.maxVisibleTags ?? 4;\n  const tags = section.tags;\n  const visible = tags.slice(0, max);\n  const hiddenTags = tags.slice(max);\n  const hidden = hiddenTags.length;\n  const overflow =\n    section.formatOverflow?.(hidden) ?? (hidden > 0 ? `+${hidden}` : null);\n\n  return (\n    <div className=\"px-4 py-4 pt-0 sm:px-5\">\n      <p className=\"text-xs font-semibold leading-5 text-content-heading\">\n        {section.title ?? \"Attributes\"}\n      </p>\n      <div className=\"mt-2 flex flex-wrap gap-1.5\">\n        {visible.map((t, i) => (\n          <Badge\n            key={`${i}-${t}`}\n            variant=\"subtle\"\n            color=\"neutral\"\n            size=\"sm\"\n            shape=\"circle\"\n            className=\"max-w-full\"\n          >\n            {t}\n          </Badge>\n        ))}\n        {hiddenTags.length > 0 ? (\n          <Popover>\n            <Tooltip>\n              <TooltipTrigger asChild>\n                <PopoverTrigger asChild>\n                  <Tag\n                    variant=\"secondary\"\n                    size=\"md\"\n                    shape=\"rounded\"\n                    className=\"whitespace-nowrap border-0 bg-[#eceefd] px-2 font-['Manrope'] text-xs font-medium text-[#4259ee] hover:bg-[#dce1fc] h-6 cursor-pointer\"\n                    tabIndex={0}\n                    role=\"button\"\n                    aria-label={`${hiddenTags.length} more attributes for ${section.title ?? \"Attributes\"}`}\n                  >\n                    {overflow}\n                  </Tag>\n                </PopoverTrigger>\n              </TooltipTrigger>\n              <TooltipContent variant=\"tertiary\" side=\"top\">\n                {hiddenTags.length} more\n              </TooltipContent>\n            </Tooltip>\n            <FilterPopoverContent\n              remainingValues={hiddenTags}\n              onItemRemove={() => {}}\n              isRemovable={false}\n              isCopyable={true}\n            />\n          </Popover>\n        ) : null}\n      </div>\n    </div>\n  );\n}\n\nfunction CustomBlock({ section }: { section: SkuRowCustomSection }) {\n  return <div className=\"px-4 py-4 sm:px-5\">{section.content}</div>;\n}\n\n/** Radix `type=\"single\"` item value (one expandable row per instance). */\nconst EXPANDABLE_SKU_ROW_ITEM_VALUE = \"expandable-sku-row-item\";\n\nfunction renderSection(section: SkuRowSection) {\n  switch (section.type) {\n    case \"metrics\":\n      return <MetricsBlock key={section.id} section={section} />;\n    case \"attributes\":\n      return <AttributesBlock key={section.id} section={section} />;\n    case \"custom\":\n      return <CustomBlock key={section.id} section={section} />;\n    default:\n      return null;\n  }\n}\n\nexport interface ExpandableSkuProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, \"children\" | \"onChange\"> {\n  /** Primary line (e.g. SKU code). */\n  sku: string;\n  /** Secondary line (e.g. product title). */\n  subtitle?: React.ReactNode;\n  /** Optional slot next to the SKU (e.g. Mapped badge). */\n  badge?: React.ReactNode;\n  /**\n   * When set, a checkbox is shown. Omit entirely to hide selection (read-only / detail rows).\n   */\n  selection?: SkuRowSelection;\n  /**\n   * Row highlight (lavender shell + white detail card). Also applied when `selection.checked` is true\n   * so checkbox-only usage picks up the same UI without passing `selected`.\n   */\n  selected?: boolean;\n  /** Controlled expanded state. */\n  expanded?: boolean;\n  /** Uncontrolled default. Ignored when `expanded` is passed. */\n  defaultExpanded?: boolean;\n  onExpandedChange?: (open: boolean) => void;\n  /** Disable expand/collapse interaction. */\n  disabled?: boolean;\n  /** Ordered blocks inside the expanded panel. */\n  sections?: ReadonlyArray<SkuRowSection>;\n  /** Extra content after preset `sections` (inside the panel card). */\n  panelFooter?: React.ReactNode;\n  expandAriaLabel?: string;\n  collapseAriaLabel?: string;\n}\n\n/**\n * Expandable SKU : optional checkbox, title stack, chevron when there is panel content,\n * and a collapsible body with metrics, attribute pills, or custom sections.\n */\nexport const ExpandableSku = React.forwardRef<HTMLDivElement, ExpandableSkuProps>(\n  (\n    {\n      className,\n      sku,\n      subtitle,\n      badge,\n      selection,\n      selected,\n      expanded,\n      defaultExpanded = false,\n      onExpandedChange,\n      disabled,\n      sections,\n      panelFooter,\n      expandAriaLabel = \"Expand details\",\n      collapseAriaLabel = \"Collapse details\",\n      ...rest\n    },\n    ref,\n  ) => {\n    const isControlled = expanded !== undefined;\n    const controlledAccordionValue = isControlled\n      ? expanded\n        ? EXPANDABLE_SKU_ROW_ITEM_VALUE\n        : \"\"\n      : undefined;\n\n    const showSelectionChrome = Boolean(selected || selection?.checked);\n\n    const hasPanelContent =\n      (sections != null && sections.length > 0) || panelFooter != null;\n\n    const renderTitleStack = (contentDisabled: boolean) => (\n      <div\n        className={cn(\n          \"min-w-0 flex-1\",\n          contentDisabled && \"pointer-events-none opacity-50\",\n        )}\n      >\n        <div className=\"flex flex-wrap items-center gap-2\">\n          <span\n            className={cn(\n              \"text-sm font-semibold leading-6 text-content\",\n              showSelectionChrome && \"tracking-tight\",\n            )}\n          >\n            {sku}\n          </span>\n          {badge}\n        </div>\n        {subtitle ? (\n          <div className=\"mt-0.5 text-xs font-medium leading-4 text-[#60697d]\">\n            {subtitle}\n          </div>\n        ) : null}\n      </div>\n    );\n\n    const shellClassName = cn(\n      \"rounded-xl transition-[background-color,border-color,box-shadow] duration-200\",\n      showSelectionChrome\n        ? \"border-stroke-accent/40 bg-canvas-accent shadow-sm\"\n        : \"border-stroke bg-canvas-elevated\",\n      className,\n    );\n\n    const checkboxSlot = selection ? (\n      <div\n        className=\"pt-0.5\"\n        onClick={(e) => e.stopPropagation()}\n        onKeyDown={(e) => e.stopPropagation()}\n      >\n        <Checkbox\n          checked={selection.checked}\n          disabled={selection.disabled}\n          onCheckedChange={(state) => {\n            const next = state === true;\n            if (next !== selection.checked) selection.onCheckedChange(next);\n          }}\n          aria-label={selection[\"aria-label\"] ?? `Select ${sku}`}\n        />\n      </div>\n    ) : null;\n\n    if (!hasPanelContent) {\n      return (\n        <div\n          ref={ref}\n          data-component=\"expandable-sku-row\"\n          data-expandable=\"false\"\n          data-selected={selected ? \"\" : undefined}\n          data-selection-chrome={showSelectionChrome ? \"\" : undefined}\n          className={shellClassName}\n          {...rest}\n        >\n          <div className=\"flex items-start gap-3 px-3 py-3\">\n            {checkboxSlot}\n            {renderTitleStack(Boolean(disabled))}\n          </div>\n        </div>\n      );\n    }\n\n    return (\n      <div\n        ref={ref}\n        data-component=\"expandable-sku-row\"\n        data-expandable=\"true\"\n        data-expanded={expanded ?? undefined}\n        data-selected={selected ? \"\" : undefined}\n        data-selection-chrome={showSelectionChrome ? \"\" : undefined}\n        className={shellClassName}\n        {...rest}\n      >\n        <Accordion\n          type=\"single\"\n          collapsible\n          disabled={disabled}\n          {...(isControlled\n            ? { value: controlledAccordionValue }\n            : {\n                defaultValue: defaultExpanded ? EXPANDABLE_SKU_ROW_ITEM_VALUE : undefined,\n              })}\n          onValueChange={(v) => onExpandedChange?.(v === EXPANDABLE_SKU_ROW_ITEM_VALUE)}\n        >\n          <AccordionItem\n            value={EXPANDABLE_SKU_ROW_ITEM_VALUE}\n            className=\"border-0 bg-transparent p-0 shadow-none rounded-none overflow-visible\"\n          >\n            <div className=\"flex items-start gap-3 px-3 py-3\">\n              {checkboxSlot}\n\n              <AccordionTrigger\n                variant=\"plain\"\n                className={cn(\n                  \"min-w-0 gap-2 text-left items-center \",\n                  disabled && \"pointer-events-none opacity-50\",\n                )}\n              >\n                {renderTitleStack(false)}\n                <span\n                  className=\"mt-0.5 inline-flex shrink-0 text-content-muted transition-transform duration-200 group-data-[state=open]:rotate-180\"\n                  aria-hidden\n                >\n                  <ChevronDown className=\"size-4\" />\n                </span>\n                <span className=\"sr-only\">\n                  {expandAriaLabel} / {collapseAriaLabel}\n                </span>\n              </AccordionTrigger>\n            </div>\n\n            <AccordionContent className=\"border-0 bg-transparent p-0 pb-[0.01rem]\">\n              <div className=\"mx-2 mb-2 overflow-hidden  bg-[#f8f9fb] pt-2 rounded-lg\">\n                {sections?.map((s) => renderSection(s))}\n                {panelFooter ? (\n                  <div className=\"px-4 py-3 sm:px-5\">{panelFooter}</div>\n                ) : null}\n              </div>\n            </AccordionContent>\n          </AccordionItem>\n        </Accordion>\n      </div>\n    );\n  },\n);\n\nExpandableSku.displayName = \"ExpandableSku\";\n"],"names":["MetricsBlock","section","jsx","col","i","jsxs","AttributesBlock","max","tags","visible","hiddenTags","hidden","overflow","t","Badge","Popover","Tooltip","TooltipTrigger","PopoverTrigger","Tag","TooltipContent","FilterPopoverContent","CustomBlock","EXPANDABLE_SKU_ROW_ITEM_VALUE","renderSection","ExpandableSku","React","className","sku","subtitle","badge","selection","selected","expanded","defaultExpanded","onExpandedChange","disabled","sections","panelFooter","expandAriaLabel","collapseAriaLabel","rest","ref","isControlled","controlledAccordionValue","showSelectionChrome","hasPanelContent","renderTitleStack","contentDisabled","cn","shellClassName","checkboxSlot","e","Checkbox","state","next","Accordion","v","AccordionItem","AccordionTrigger","ChevronDown","AccordionContent","s"],"mappings":"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"}

package/dist/components/ui/expandable-sku/index.js

@@ -2,3 +2,4 @@ import { ExpandableSku as o } from "./expandable-sku.js";
 export {
   o as ExpandableSku
 };
+//# sourceMappingURL=index.js.map

package/dist/components/ui/expandable-sku/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}