@enadhq/enad-react-sdk 0.0.6 → 1.0.2

package/dist/client/storefront/primitives/pagination.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/primitives/pagination.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Pagination,\n  PaginationContent,\n  PaginationEllipsis,\n  PaginationItem,\n  PaginationLink,\n  PaginationNext,\n  PaginationPrevious,\n} from \"../../ui-resolver/pagination\";\n\ninterface StorefrontPaginationProps {\n  currentPage: number;\n  totalPages: number;\n  onPageChange: (page: number) => void;\n  className?: string;\n}\n\nfunction getPageNumbers(current: number, total: number): (number | \"ellipsis\")[] {\n  if (total <= 7) {\n    return Array.from({ length: total }, (_, i) => i + 1);\n  }\n\n  const pages: (number | \"ellipsis\")[] = [1];\n\n  if (current > 3) {\n    pages.push(\"ellipsis\");\n  }\n\n  const start = Math.max(2, current - 1);\n  const end = Math.min(total - 1, current + 1);\n\n  for (let i = start; i <= end; i++) {\n    pages.push(i);\n  }\n\n  if (current < total - 2) {\n    pages.push(\"ellipsis\");\n  }\n\n  pages.push(total);\n  return pages;\n}\n\nfunction StorefrontPagination({\n  currentPage,\n  totalPages,\n  onPageChange,\n  className,\n}: StorefrontPaginationProps) {\n  if (totalPages <= 1) return null;\n\n  const pages = getPageNumbers(currentPage, totalPages);\n\n  return (\n    <Pagination className={className}>\n      <PaginationContent>\n        <PaginationItem>\n          <PaginationPrevious\n            href=\"#\"\n            size=\"default\"\n            onClick={(e) => {\n              e.preventDefault();\n              if (currentPage > 1) onPageChange(currentPage - 1);\n            }}\n            aria-disabled={currentPage <= 1}\n            className={currentPage <= 1 ? \"pointer-events-none opacity-50\" : undefined}\n          />\n        </PaginationItem>\n\n        {pages.map((page, i) =>\n          page === \"ellipsis\" ? (\n            <PaginationItem key={`ellipsis-${i}`}>\n              <PaginationEllipsis />\n            </PaginationItem>\n          ) : (\n            <PaginationItem key={page}>\n              <PaginationLink\n                href=\"#\"\n                size=\"icon\"\n                isActive={page === currentPage}\n                onClick={(e) => {\n                  e.preventDefault();\n                  onPageChange(page);\n                }}\n              >\n                {page}\n              </PaginationLink>\n            </PaginationItem>\n          ),\n        )}\n\n        <PaginationItem>\n          <PaginationNext\n            href=\"#\"\n            size=\"default\"\n            onClick={(e) => {\n              e.preventDefault();\n              if (currentPage < totalPages) onPageChange(currentPage + 1);\n            }}\n            aria-disabled={currentPage >= totalPages}\n            className={currentPage >= totalPages ? \"pointer-events-none opacity-50\" : undefined}\n          />\n        </PaginationItem>\n      </PaginationContent>\n    </Pagination>\n  );\n}\n\nexport { StorefrontPagination, type StorefrontPaginationProps };\n"],"mappings":";AA0DM,SAEI,KAFJ;AAvDN;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AASP,SAAS,eAAe,SAAiB,OAAwC;AAC/E,MAAI,SAAS,GAAG;AACd,WAAO,MAAM,KAAK,EAAE,QAAQ,MAAM,GAAG,CAAC,GAAG,MAAM,IAAI,CAAC;AAAA,EACtD;AAEA,QAAM,QAAiC,CAAC,CAAC;AAEzC,MAAI,UAAU,GAAG;AACf,UAAM,KAAK,UAAU;AAAA,EACvB;AAEA,QAAM,QAAQ,KAAK,IAAI,GAAG,UAAU,CAAC;AACrC,QAAM,MAAM,KAAK,IAAI,QAAQ,GAAG,UAAU,CAAC;AAE3C,WAAS,IAAI,OAAO,KAAK,KAAK,KAAK;AACjC,UAAM,KAAK,CAAC;AAAA,EACd;AAEA,MAAI,UAAU,QAAQ,GAAG;AACvB,UAAM,KAAK,UAAU;AAAA,EACvB;AAEA,QAAM,KAAK,KAAK;AAChB,SAAO;AACT;AAEA,SAAS,qBAAqB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,MAAI,cAAc,EAAG,QAAO;AAE5B,QAAM,QAAQ,eAAe,aAAa,UAAU;AAEpD,SACE,oBAAC,cAAW,WACV,+BAAC,qBACC;AAAA,wBAAC,kBACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,MAAK;AAAA,QACL,SAAS,CAAC,MAAM;AACd,YAAE,eAAe;AACjB,cAAI,cAAc,EAAG,cAAa,cAAc,CAAC;AAAA,QACnD;AAAA,QACA,iBAAe,eAAe;AAAA,QAC9B,WAAW,eAAe,IAAI,mCAAmC;AAAA;AAAA,IACnE,GACF;AAAA,IAEC,MAAM;AAAA,MAAI,CAAC,MAAM,MAChB,SAAS,aACP,oBAAC,kBACC,8BAAC,sBAAmB,KADD,YAAY,CAAC,EAElC,IAEA,oBAAC,kBACC;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,MAAK;AAAA,UACL,UAAU,SAAS;AAAA,UACnB,SAAS,CAAC,MAAM;AACd,cAAE,eAAe;AACjB,yBAAa,IAAI;AAAA,UACnB;AAAA,UAEC;AAAA;AAAA,MACH,KAXmB,IAYrB;AAAA,IAEJ;AAAA,IAEA,oBAAC,kBACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,MAAK;AAAA,QACL,SAAS,CAAC,MAAM;AACd,YAAE,eAAe;AACjB,cAAI,cAAc,WAAY,cAAa,cAAc,CAAC;AAAA,QAC5D;AAAA,QACA,iBAAe,eAAe;AAAA,QAC9B,WAAW,eAAe,aAAa,mCAAmC;AAAA;AAAA,IAC5E,GACF;AAAA,KACF,GACF;AAEJ;","names":[]}

package/dist/client/storefront/primitives/quick-links.d.ts

@@ -0,0 +1,11 @@
+interface QuickLink {
+    label: string;
+    href: string;
+}
+interface QuickLinksProps {
+    links: QuickLink[];
+    className?: string;
+}
+declare function QuickLinks({ links, className }: QuickLinksProps): import("react/jsx-runtime").JSX.Element | null;
+export { QuickLinks, type QuickLink, type QuickLinksProps };
+//# sourceMappingURL=quick-links.d.ts.map

package/dist/client/storefront/primitives/quick-links.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"quick-links.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/primitives/quick-links.tsx"],"names":[],"mappings":"AAEA,UAAU,SAAS;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;CACb;AAED,UAAU,eAAe;IACvB,KAAK,EAAE,SAAS,EAAE,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,UAAU,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,eAAe,kDAmBxD;AAED,OAAO,EAAE,UAAU,EAAE,KAAK,SAAS,EAAE,KAAK,eAAe,EAAE,CAAA"}

package/dist/client/storefront/primitives/quick-links.mjs

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../ui/utils";
+function QuickLinks({ links, className }) {
+  if (links.length === 0) return null;
+  return /* @__PURE__ */ jsx("nav", { "aria-label": "Quick links", className: cn("overflow-x-auto", className), children: /* @__PURE__ */ jsx("ul", { className: "flex gap-2", children: links.map((link) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: link.href,
+      className: "inline-flex whitespace-nowrap rounded-[var(--enad-button-radius)] border border-border px-4 py-2 text-sm transition-colors hover:bg-primary hover:text-primary-foreground",
+      children: link.label
+    }
+  ) }, link.label + link.href)) }) });
+}
+export {
+  QuickLinks
+};
+//# sourceMappingURL=quick-links.mjs.map

package/dist/client/storefront/primitives/quick-links.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/primitives/quick-links.tsx"],"sourcesContent":["import { cn } from \"../../ui/utils\"\n\ninterface QuickLink {\n  label: string\n  href: string\n}\n\ninterface QuickLinksProps {\n  links: QuickLink[]\n  className?: string\n}\n\nfunction QuickLinks({ links, className }: QuickLinksProps) {\n  if (links.length === 0) return null\n\n  return (\n    <nav aria-label=\"Quick links\" className={cn(\"overflow-x-auto\", className)}>\n      <ul className=\"flex gap-2\">\n        {links.map((link) => (\n          <li key={link.label+link.href}>\n            <a\n              href={link.href}\n              className=\"inline-flex whitespace-nowrap rounded-[var(--enad-button-radius)] border border-border px-4 py-2 text-sm transition-colors hover:bg-primary hover:text-primary-foreground\"\n            >\n              {link.label}\n            </a>\n          </li>\n        ))}\n      </ul>\n    </nav>\n  )\n}\n\nexport { QuickLinks, type QuickLink, type QuickLinksProps }\n\n"],"mappings":"AAoBY;AApBZ,SAAS,UAAU;AAYnB,SAAS,WAAW,EAAE,OAAO,UAAU,GAAoB;AACzD,MAAI,MAAM,WAAW,EAAG,QAAO;AAE/B,SACE,oBAAC,SAAI,cAAW,eAAc,WAAW,GAAG,mBAAmB,SAAS,GACtE,8BAAC,QAAG,WAAU,cACX,gBAAM,IAAI,CAAC,SACV,oBAAC,QACC;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,KAAK;AAAA,MACX,WAAU;AAAA,MAET,eAAK;AAAA;AAAA,EACR,KANO,KAAK,QAAM,KAAK,IAOzB,CACD,GACH,GACF;AAEJ;","names":[]}

package/dist/client/storefront/primitives/select.d.ts

@@ -0,0 +1,16 @@
+interface SelectOption {
+    value: string;
+    label: string;
+}
+interface StorefrontSelectProps {
+    options: SelectOption[];
+    value?: string;
+    onValueChange?: (value: string) => void;
+    label?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    className?: string;
+}
+declare function StorefrontSelect({ options, value, onValueChange, label, placeholder, disabled, className, }: StorefrontSelectProps): import("react/jsx-runtime").JSX.Element;
+export { StorefrontSelect, type StorefrontSelectProps, type SelectOption };
+//# sourceMappingURL=select.d.ts.map

package/dist/client/storefront/primitives/select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/primitives/select.tsx"],"names":[],"mappings":"AAcA,UAAU,YAAY;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,qBAAqB;IAC7B,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,iBAAS,gBAAgB,CAAC,EACxB,OAAO,EACP,KAAK,EACL,aAAa,EACb,KAAK,EACL,WAAyB,EACzB,QAAQ,EACR,SAAS,GACV,EAAE,qBAAqB,2CA0BvB;AAED,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,KAAK,YAAY,EAAE,CAAC"}

package/dist/client/storefront/primitives/select.mjs

@@ -0,0 +1,35 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import {
+  Select,
+  SelectContent,
+  SelectGroup,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "../../ui-resolver/select";
+import { Label } from "../../ui-resolver/label";
+import { cn } from "../../ui/utils";
+function StorefrontSelect({
+  options,
+  value,
+  onValueChange,
+  label,
+  placeholder = "Select...",
+  disabled,
+  className
+}) {
+  const id = React.useId();
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-1.5", className), children: [
+    label && /* @__PURE__ */ jsx(Label, { htmlFor: id, className: "text-xs font-medium uppercase tracking-wide", children: label }),
+    /* @__PURE__ */ jsxs(Select, { value, onValueChange, disabled, children: [
+      /* @__PURE__ */ jsx(SelectTrigger, { id, className: "w-full", children: /* @__PURE__ */ jsx(SelectValue, { placeholder }) }),
+      /* @__PURE__ */ jsx(SelectContent, { children: /* @__PURE__ */ jsx(SelectGroup, { children: options.map((option) => /* @__PURE__ */ jsx(SelectItem, { value: option.value, children: option.label }, option.value)) }) })
+    ] })
+  ] });
+}
+export {
+  StorefrontSelect
+};
+//# sourceMappingURL=select.mjs.map

package/dist/client/storefront/primitives/select.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/primitives/select.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Select,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from \"../../ui-resolver/select\";\nimport { Label } from \"../../ui-resolver/label\";\nimport { cn } from \"../../ui/utils\";\n\ninterface SelectOption {\n  value: string;\n  label: string;\n}\n\ninterface StorefrontSelectProps {\n  options: SelectOption[];\n  value?: string;\n  onValueChange?: (value: string) => void;\n  label?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  className?: string;\n}\n\nfunction StorefrontSelect({\n  options,\n  value,\n  onValueChange,\n  label,\n  placeholder = \"Select...\",\n  disabled,\n  className,\n}: StorefrontSelectProps) {\n  const id = React.useId();\n\n  return (\n    <div className={cn(\"flex flex-col gap-1.5\", className)}>\n      {label && (\n        <Label htmlFor={id} className=\"text-xs font-medium uppercase tracking-wide\">\n          {label}\n        </Label>\n      )}\n      <Select value={value} onValueChange={onValueChange} disabled={disabled}>\n        <SelectTrigger id={id} className=\"w-full\">\n          <SelectValue placeholder={placeholder} />\n        </SelectTrigger>\n        <SelectContent>\n          <SelectGroup>\n            {options.map((option) => (\n              <SelectItem key={option.value} value={option.value}>\n                {option.label}\n              </SelectItem>\n            ))}\n          </SelectGroup>\n        </SelectContent>\n      </Select>\n    </div>\n  );\n}\n\nexport { StorefrontSelect, type StorefrontSelectProps, type SelectOption };\n"],"mappings":";AA2CQ,cAIF,YAJE;AAzCR,YAAY,WAAW;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,aAAa;AACtB,SAAS,UAAU;AAiBnB,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AACF,GAA0B;AACxB,QAAM,KAAK,MAAM,MAAM;AAEvB,SACE,qBAAC,SAAI,WAAW,GAAG,yBAAyB,SAAS,GAClD;AAAA,aACC,oBAAC,SAAM,SAAS,IAAI,WAAU,+CAC3B,iBACH;AAAA,IAEF,qBAAC,UAAO,OAAc,eAA8B,UAClD;AAAA,0BAAC,iBAAc,IAAQ,WAAU,UAC/B,8BAAC,eAAY,aAA0B,GACzC;AAAA,MACA,oBAAC,iBACC,8BAAC,eACE,kBAAQ,IAAI,CAAC,WACZ,oBAAC,cAA8B,OAAO,OAAO,OAC1C,iBAAO,SADO,OAAO,KAExB,CACD,GACH,GACF;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/client/storefront/primitives/text-link.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+interface StorefrontTextLinkProps extends React.ComponentProps<"a"> {
+    serif?: boolean;
+}
+declare function StorefrontTextLink({ className, serif, children, ...props }: StorefrontTextLinkProps): import("react/jsx-runtime").JSX.Element;
+export { StorefrontTextLink, type StorefrontTextLinkProps };
+//# sourceMappingURL=text-link.d.ts.map

package/dist/client/storefront/primitives/text-link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-link.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/primitives/text-link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,UAAU,uBAAwB,SAAQ,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC;IACjE,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,iBAAS,kBAAkB,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,uBAAuB,2CAM5F;AAED,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,CAAC"}

package/dist/client/storefront/primitives/text-link.mjs

@@ -0,0 +1,10 @@
+import { jsx } from "react/jsx-runtime";
+import { Button } from "../../ui-resolver/button";
+import { cn } from "../../ui/utils";
+function StorefrontTextLink({ className, serif, children, ...props }) {
+  return /* @__PURE__ */ jsx(Button, { variant: "link", asChild: true, className: cn(serif && "font-serif text-2xl", className), children: /* @__PURE__ */ jsx("a", { ...props, children }) });
+}
+export {
+  StorefrontTextLink
+};
+//# sourceMappingURL=text-link.mjs.map

package/dist/client/storefront/primitives/text-link.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/primitives/text-link.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Button } from \"../../ui-resolver/button\";\nimport { cn } from \"../../ui/utils\";\n\ninterface StorefrontTextLinkProps extends React.ComponentProps<\"a\"> {\n  serif?: boolean;\n}\n\nfunction StorefrontTextLink({ className, serif, children, ...props }: StorefrontTextLinkProps) {\n  return (\n    <Button variant=\"link\" asChild className={cn(serif && \"font-serif text-2xl\", className)}>\n      <a {...props}>{children}</a>\n    </Button>\n  );\n}\n\nexport { StorefrontTextLink, type StorefrontTextLinkProps };\n"],"mappings":"AAWM;AAVN,SAAS,cAAc;AACvB,SAAS,UAAU;AAMnB,SAAS,mBAAmB,EAAE,WAAW,OAAO,UAAU,GAAG,MAAM,GAA4B;AAC7F,SACE,oBAAC,UAAO,SAAQ,QAAO,SAAO,MAAC,WAAW,GAAG,SAAS,uBAAuB,SAAS,GACpF,8BAAC,OAAG,GAAG,OAAQ,UAAS,GAC1B;AAEJ;","names":[]}

package/dist/client/storefront/product/color-swatch.d.ts

@@ -0,0 +1,10 @@
+interface ColorSwatchProps {
+    color: string;
+    selected: boolean;
+    onClick: () => void;
+    label: string;
+    className?: string;
+}
+declare function ColorSwatch({ color, selected, onClick, label, className }: ColorSwatchProps): import("react/jsx-runtime").JSX.Element;
+export { ColorSwatch, type ColorSwatchProps };
+//# sourceMappingURL=color-swatch.d.ts.map

package/dist/client/storefront/product/color-swatch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-swatch.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/product/color-swatch.tsx"],"names":[],"mappings":"AAKA,UAAU,gBAAgB;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,OAAO,CAAA;IACjB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,WAAW,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAuBpF;AAED,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,CAAA"}

package/dist/client/storefront/product/color-swatch.mjs

@@ -0,0 +1,32 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../ui/utils";
+function ColorSwatch({ color, selected, onClick, label, className }) {
+  const bgStyle = React.useMemo(() => ({ backgroundColor: color }), [color]);
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick,
+      className: cn(
+        "enad-interactive relative flex size-8 items-center justify-center rounded-full border-2 transition-all hit-area-2",
+        selected ? "border-primary ring-2 ring-primary/30" : "border-transparent hover:border-muted-foreground/30",
+        className
+      ),
+      "aria-label": label,
+      "aria-pressed": selected,
+      children: /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "size-6 rounded-full border border-border",
+          style: bgStyle
+        }
+      )
+    }
+  );
+}
+export {
+  ColorSwatch
+};
+//# sourceMappingURL=color-swatch.mjs.map

package/dist/client/storefront/product/color-swatch.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/product/color-swatch.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\n\ninterface ColorSwatchProps {\n  color: string\n  selected: boolean\n  onClick: () => void\n  label: string\n  className?: string\n}\n\nfunction ColorSwatch({ color, selected, onClick, label, className }: ColorSwatchProps) {\n  const bgStyle = React.useMemo(() => ({ backgroundColor: color }), [color])\n\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      className={cn(\n        \"enad-interactive relative flex size-8 items-center justify-center rounded-full border-2 transition-all hit-area-2\",\n        selected\n          ? \"border-primary ring-2 ring-primary/30\"\n          : \"border-transparent hover:border-muted-foreground/30\",\n        className\n      )}\n      aria-label={label}\n      aria-pressed={selected}\n    >\n      <span\n        className=\"size-6 rounded-full border border-border\"\n        style={bgStyle}\n      />\n    </button>\n  )\n}\n\nexport { ColorSwatch, type ColorSwatchProps }\n"],"mappings":";AA8BM;AA5BN,YAAY,WAAW;AACvB,SAAS,UAAU;AAUnB,SAAS,YAAY,EAAE,OAAO,UAAU,SAAS,OAAO,UAAU,GAAqB;AACrF,QAAM,UAAU,MAAM,QAAQ,OAAO,EAAE,iBAAiB,MAAM,IAAI,CAAC,KAAK,CAAC;AAEzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA,WACI,0CACA;AAAA,QACJ;AAAA,MACF;AAAA,MACA,cAAY;AAAA,MACZ,gBAAc;AAAA,MAEd;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,OAAO;AAAA;AAAA,MACT;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/client/storefront/product/index.d.ts

@@ -0,0 +1,5 @@
+export { ColorSwatch, type ColorSwatchProps } from "./color-swatch";
+export { MaterialSelector, type MaterialSelectorProps, type MaterialOption } from "./material-selector";
+export { QuantityPicker, type QuantityPickerProps } from "./quantity-picker";
+export { ProductUSP, type ProductUSPProps } from "./product-usp";
+//# sourceMappingURL=index.d.ts.map

package/dist/client/storefront/product/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/product/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACnE,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAA;AACvG,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AAC5E,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAA"}

package/dist/client/storefront/product/index.mjs

@@ -0,0 +1,11 @@
+import { ColorSwatch } from "./color-swatch";
+import { MaterialSelector } from "./material-selector";
+import { QuantityPicker } from "./quantity-picker";
+import { ProductUSP } from "./product-usp";
+export {
+  ColorSwatch,
+  MaterialSelector,
+  ProductUSP,
+  QuantityPicker
+};
+//# sourceMappingURL=index.mjs.map

package/dist/client/storefront/product/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/product/index.ts"],"sourcesContent":["export { ColorSwatch, type ColorSwatchProps } from \"./color-swatch\"\nexport { MaterialSelector, type MaterialSelectorProps, type MaterialOption } from \"./material-selector\"\nexport { QuantityPicker, type QuantityPickerProps } from \"./quantity-picker\"\nexport { ProductUSP, type ProductUSPProps } from \"./product-usp\"\n"],"mappings":"AAAA,SAAS,mBAA0C;AACnD,SAAS,wBAAyE;AAClF,SAAS,sBAAgD;AACzD,SAAS,kBAAwC;","names":[]}

package/dist/client/storefront/product/material-selector.d.ts

@@ -0,0 +1,15 @@
+interface MaterialOption {
+    value: string;
+    label: string;
+    image?: string;
+    color?: string;
+}
+interface MaterialSelectorProps {
+    options: MaterialOption[];
+    selected: string;
+    onChange: (value: string) => void;
+    className?: string;
+}
+declare function MaterialSelector({ options, selected, onChange, className }: MaterialSelectorProps): import("react/jsx-runtime").JSX.Element;
+export { MaterialSelector, type MaterialSelectorProps, type MaterialOption };
+//# sourceMappingURL=material-selector.d.ts.map

package/dist/client/storefront/product/material-selector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"material-selector.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/product/material-selector.tsx"],"names":[],"mappings":"AAKA,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,UAAU,qBAAqB;IAC7B,OAAO,EAAE,cAAc,EAAE,CAAA;IACzB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,gBAAgB,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,qBAAqB,2CAmC1F;AAED,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,KAAK,cAAc,EAAE,CAAA"}

package/dist/client/storefront/product/material-selector.mjs

@@ -0,0 +1,35 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../ui/utils";
+function MaterialSelector({ options, selected, onChange, className }) {
+  return /* @__PURE__ */ jsx("div", { role: "radiogroup", "aria-label": "Select material", className: cn("flex flex-wrap gap-3", className), children: options.map((option) => {
+    const isSelected = option.value === selected;
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        role: "radio",
+        "aria-checked": isSelected,
+        "aria-label": option.label,
+        onClick: () => onChange(option.value),
+        className: cn(
+          "enad-interactive flex size-12 items-center justify-center overflow-hidden rounded-full border-2 transition-all",
+          isSelected ? "border-primary ring-2 ring-primary/30" : "border-transparent hover:border-muted-foreground/30"
+        ),
+        children: option.image ? /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: option.image,
+            alt: option.label,
+            className: "size-full rounded-full object-cover"
+          }
+        ) : /* @__PURE__ */ jsx("span", { className: "size-full rounded-full", style: { backgroundColor: option.color ?? "#ccc" } })
+      },
+      option.value
+    );
+  }) });
+}
+export {
+  MaterialSelector
+};
+//# sourceMappingURL=material-selector.mjs.map

package/dist/client/storefront/product/material-selector.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/product/material-selector.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\n\ninterface MaterialOption {\n  value: string\n  label: string\n  image?: string\n  color?: string\n}\n\ninterface MaterialSelectorProps {\n  options: MaterialOption[]\n  selected: string\n  onChange: (value: string) => void\n  className?: string\n}\n\nfunction MaterialSelector({ options, selected, onChange, className }: MaterialSelectorProps) {\n  return (\n    <div role=\"radiogroup\" aria-label=\"Select material\" className={cn(\"flex flex-wrap gap-3\", className)}>\n      {options.map((option) => {\n        const isSelected = option.value === selected\n\n        return (\n          <button\n            key={option.value}\n            type=\"button\"\n            role=\"radio\"\n            aria-checked={isSelected}\n            aria-label={option.label}\n            onClick={() => onChange(option.value)}\n            className={cn(\n              \"enad-interactive flex size-12 items-center justify-center overflow-hidden rounded-full border-2 transition-all\",\n              isSelected\n                ? \"border-primary ring-2 ring-primary/30\"\n                : \"border-transparent hover:border-muted-foreground/30\"\n            )}\n          >\n            {option.image ? (\n              <img\n                src={option.image}\n                alt={option.label}\n                className=\"size-full rounded-full object-cover\"\n              />\n            ) : (\n              <span className=\"size-full rounded-full\" style={{ backgroundColor: option.color ?? \"#ccc\" }} />\n            )}\n          </button>\n        )\n      })}\n    </div>\n  )\n}\n\nexport { MaterialSelector, type MaterialSelectorProps, type MaterialOption }\n"],"mappings":";AAyCc;AAtCd,SAAS,UAAU;AAgBnB,SAAS,iBAAiB,EAAE,SAAS,UAAU,UAAU,UAAU,GAA0B;AAC3F,SACE,oBAAC,SAAI,MAAK,cAAa,cAAW,mBAAkB,WAAW,GAAG,wBAAwB,SAAS,GAChG,kBAAQ,IAAI,CAAC,WAAW;AACvB,UAAM,aAAa,OAAO,UAAU;AAEpC,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,MAAK;AAAA,QACL,MAAK;AAAA,QACL,gBAAc;AAAA,QACd,cAAY,OAAO;AAAA,QACnB,SAAS,MAAM,SAAS,OAAO,KAAK;AAAA,QACpC,WAAW;AAAA,UACT;AAAA,UACA,aACI,0CACA;AAAA,QACN;AAAA,QAEC,iBAAO,QACN;AAAA,UAAC;AAAA;AAAA,YACC,KAAK,OAAO;AAAA,YACZ,KAAK,OAAO;AAAA,YACZ,WAAU;AAAA;AAAA,QACZ,IAEA,oBAAC,UAAK,WAAU,0BAAyB,OAAO,EAAE,iBAAiB,OAAO,SAAS,OAAO,GAAG;AAAA;AAAA,MApB1F,OAAO;AAAA,IAsBd;AAAA,EAEJ,CAAC,GACH;AAEJ;","names":[]}

package/dist/client/storefront/product/product-usp.d.ts

@@ -0,0 +1,7 @@
+interface ProductUSPProps {
+    text: string;
+    className?: string;
+}
+declare function ProductUSP({ text, className }: ProductUSPProps): import("react/jsx-runtime").JSX.Element;
+export { ProductUSP, type ProductUSPProps };
+//# sourceMappingURL=product-usp.d.ts.map

package/dist/client/storefront/product/product-usp.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-usp.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/product/product-usp.tsx"],"names":[],"mappings":"AAIA,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,UAAU,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,eAAe,2CAQvD;AAED,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,CAAA"}

package/dist/client/storefront/product/product-usp.mjs

@@ -0,0 +1,14 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useIcon } from "../../icons/icon-context";
+import { cn } from "../../ui/utils";
+function ProductUSP({ text, className }) {
+  const CheckIcon = useIcon("check");
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-2", className), children: [
+    /* @__PURE__ */ jsx(CheckIcon, { className: "size-4 shrink-0 text-green-500" }),
+    /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: text })
+  ] });
+}
+export {
+  ProductUSP
+};
+//# sourceMappingURL=product-usp.mjs.map

package/dist/client/storefront/product/product-usp.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/product/product-usp.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { useIcon } from \"../../icons/icon-context\"\nimport { cn } from \"../../ui/utils\"\n\ninterface ProductUSPProps {\n  text: string\n  className?: string\n}\n\nfunction ProductUSP({ text, className }: ProductUSPProps) {\n  const CheckIcon = useIcon(\"check\")\n  return (\n    <div className={cn(\"flex items-center gap-2\", className)}>\n      <CheckIcon className=\"size-4 shrink-0 text-green-500\" />\n      <span className=\"text-sm text-muted-foreground\">{text}</span>\n    </div>\n  )\n}\n\nexport { ProductUSP, type ProductUSPProps }\n"],"mappings":"AAYI,SACE,KADF;AAXJ,SAAS,eAAe;AACxB,SAAS,UAAU;AAOnB,SAAS,WAAW,EAAE,MAAM,UAAU,GAAoB;AACxD,QAAM,YAAY,QAAQ,OAAO;AACjC,SACE,qBAAC,SAAI,WAAW,GAAG,2BAA2B,SAAS,GACrD;AAAA,wBAAC,aAAU,WAAU,kCAAiC;AAAA,IACtD,oBAAC,UAAK,WAAU,iCAAiC,gBAAK;AAAA,KACxD;AAEJ;","names":[]}

package/dist/client/storefront/product/quantity-picker.d.ts

@@ -0,0 +1,10 @@
+interface QuantityPickerProps {
+    value: number;
+    onChange: (value: number) => void;
+    min?: number;
+    max?: number;
+    className?: string;
+}
+declare function QuantityPicker({ value, onChange, min, max, className, }: QuantityPickerProps): import("react/jsx-runtime").JSX.Element;
+export { QuantityPicker, type QuantityPickerProps };
+//# sourceMappingURL=quantity-picker.d.ts.map

package/dist/client/storefront/product/quantity-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"quantity-picker.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/product/quantity-picker.tsx"],"names":[],"mappings":"AAOA,UAAU,mBAAmB;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,cAAc,CAAC,EACtB,KAAK,EACL,QAAQ,EACR,GAAO,EACP,GAAQ,EACR,SAAS,GACV,EAAE,mBAAmB,2CAuCrB;AAED,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,CAAA"}

package/dist/client/storefront/product/quantity-picker.mjs

@@ -0,0 +1,56 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useIcon } from "../../icons/icon-context";
+import { Button } from "../../ui/button";
+import { cn } from "../../ui/utils";
+function QuantityPicker({
+  value,
+  onChange,
+  min = 1,
+  max = 99,
+  className
+}) {
+  const MinusIcon = useIcon("minus");
+  const PlusIcon = useIcon("plus");
+  const atMin = value <= min;
+  const atMax = value >= max;
+  return /* @__PURE__ */ jsxs("div", { className: cn("inline-flex items-center gap-0 rounded-[var(--enad-input-radius)] border border-input", className), children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "ghost",
+        size: "icon",
+        onClick: () => onChange(Math.max(min, value - 1)),
+        disabled: atMin,
+        "aria-label": "Decrease quantity",
+        className: "rounded-none rounded-l-[var(--enad-input-radius)] hit-area-y-1",
+        children: /* @__PURE__ */ jsx(MinusIcon, { className: "size-4" })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: "flex size-9 items-center justify-center text-sm font-medium tabular-nums",
+        "aria-live": "polite",
+        "aria-label": `Quantity: ${value}`,
+        children: value
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "ghost",
+        size: "icon",
+        onClick: () => onChange(Math.min(max, value + 1)),
+        disabled: atMax,
+        "aria-label": "Increase quantity",
+        className: "rounded-none rounded-r-[var(--enad-input-radius)] hit-area-y-1",
+        children: /* @__PURE__ */ jsx(PlusIcon, { className: "size-4" })
+      }
+    )
+  ] });
+}
+export {
+  QuantityPicker
+};
+//# sourceMappingURL=quantity-picker.mjs.map

package/dist/client/storefront/product/quantity-picker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/product/quantity-picker.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { useIcon } from \"../../icons/icon-context\"\nimport { Button } from \"../../ui/button\"\nimport { cn } from \"../../ui/utils\"\n\ninterface QuantityPickerProps {\n  value: number\n  onChange: (value: number) => void\n  min?: number\n  max?: number\n  className?: string\n}\n\nfunction QuantityPicker({\n  value,\n  onChange,\n  min = 1,\n  max = 99,\n  className,\n}: QuantityPickerProps) {\n  const MinusIcon = useIcon(\"minus\")\n  const PlusIcon = useIcon(\"plus\")\n  const atMin = value <= min\n  const atMax = value >= max\n\n  return (\n    <div className={cn(\"inline-flex items-center gap-0 rounded-[var(--enad-input-radius)] border border-input\", className)}>\n      <Button\n        variant=\"ghost\"\n        size=\"icon\"\n        onClick={() => onChange(Math.max(min, value - 1))}\n        disabled={atMin}\n        aria-label=\"Decrease quantity\"\n        className=\"rounded-none rounded-l-[var(--enad-input-radius)] hit-area-y-1\"\n      >\n        <MinusIcon className=\"size-4\" />\n      </Button>\n\n      <span\n        className=\"flex size-9 items-center justify-center text-sm font-medium tabular-nums\"\n        aria-live=\"polite\"\n        aria-label={`Quantity: ${value}`}\n      >\n        {value}\n      </span>\n\n      <Button\n        variant=\"ghost\"\n        size=\"icon\"\n        onClick={() => onChange(Math.min(max, value + 1))}\n        disabled={atMax}\n        aria-label=\"Increase quantity\"\n        className=\"rounded-none rounded-r-[var(--enad-input-radius)] hit-area-y-1\"\n      >\n        <PlusIcon className=\"size-4\" />\n      </Button>\n    </div>\n  )\n}\n\nexport { QuantityPicker, type QuantityPickerProps }\n"],"mappings":";AA4BI,SASI,KATJ;AAzBJ,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,SAAS,UAAU;AAUnB,SAAS,eAAe;AAAA,EACtB;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN,MAAM;AAAA,EACN;AACF,GAAwB;AACtB,QAAM,YAAY,QAAQ,OAAO;AACjC,QAAM,WAAW,QAAQ,MAAM;AAC/B,QAAM,QAAQ,SAAS;AACvB,QAAM,QAAQ,SAAS;AAEvB,SACE,qBAAC,SAAI,WAAW,GAAG,yFAAyF,SAAS,GACnH;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,SAAS,MAAM,SAAS,KAAK,IAAI,KAAK,QAAQ,CAAC,CAAC;AAAA,QAChD,UAAU;AAAA,QACV,cAAW;AAAA,QACX,WAAU;AAAA,QAEV,8BAAC,aAAU,WAAU,UAAS;AAAA;AAAA,IAChC;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,aAAU;AAAA,QACV,cAAY,aAAa,KAAK;AAAA,QAE7B;AAAA;AAAA,IACH;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,SAAS,MAAM,SAAS,KAAK,IAAI,KAAK,QAAQ,CAAC,CAAC;AAAA,QAChD,UAAU;AAAA,QACV,cAAW;AAAA,QACX,WAAU;AAAA,QAEV,8BAAC,YAAS,WAAU,UAAS;AAAA;AAAA,IAC/B;AAAA,KACF;AAEJ;","names":[]}