se-design 1.0.72 → 1.0.73-dev2

package/dist/index30.js

@@ -1,58 +1,73 @@
-import o from "react";
-import { Icon as h } from "./index5.js";
+import n from "react";
+import { Icon as f } from "./index5.js";
 const c = {
-  pageNavigation: "px-[6px] flex items-center justify-center disabled:opacity-50 hover:cursor-pointer",
-  pageItem: "px-[6px] text-sm flex items-center justify-center rounded border hover:cursor-pointer"
-}, E = ({
-  currentPage: t,
+  pageNavigation: "px-[6px] py-[6px] flex items-center justify-center",
+  pageItem: "px-[7px] py-[1px] min-w-[24px] text-sm flex items-center justify-center rounded border hover:cursor-pointer appearance-none focus-outline"
+}, k = ({
+  currentPage: a,
   itemsPerPage: l,
-  totalItems: r,
+  totalItems: i,
   onPageChange: p,
-  mobileView: m = !1
+  mobileView: m = !1,
+  ariaLabel: x = "Pagination Controls"
 }) => {
-  const n = Math.ceil(r / l), d = 1, f = n, x = (t - 1) * l + 1, u = Math.min(t * l, r), v = u < r, g = t > 1, b = () => {
-    const e = [], a = (s) => /* @__PURE__ */ o.createElement("span", {
-      key: s,
-      onClick: () => p(s),
-      className: `${c.pageItem} ${t === s ? "bg-[var(--color-gray-100)] border-[var(--color-gray-300)]" : "border-[var(--color-gray-200)] hover:bg-[var(--color-gray-50)]"}`,
-      "data-automation-id": `page-number-${s}`
-    }, s), i = (s) => /* @__PURE__ */ o.createElement("span", {
+  const o = Math.ceil(i / l), d = 1, b = o, g = (a - 1) * l + 1, u = Math.min(a * l, i), v = u < i, y = a > 1, E = () => {
+    const e = [], t = (s) => {
+      const h = a === s;
+      return /* @__PURE__ */ n.createElement("li", {
+        key: s
+      }, /* @__PURE__ */ n.createElement("button", {
+        type: "button",
+        onClick: () => p(s),
+        className: `${c.pageItem} ${h ? "bg-[var(--color-gray-100)] border-[var(--color-gray-300)]" : "border-[var(--color-gray-200)] hover:bg-[var(--color-gray-50)]"}`,
+        "aria-label": `Page ${s}`,
+        "aria-current": h ? "page" : void 0,
+        "data-automation-id": `page-number-${s}`
+      }, s));
+    }, r = (s) => /* @__PURE__ */ n.createElement("li", {
       key: s,
+      "aria-hidden": "true"
+    }, /* @__PURE__ */ n.createElement("span", {
       className: "w-5 h-5 text-sm rounded border border-[var(--color-gray-200)] flex items-end justify-center"
-    }, "...");
+    }, "..."));
     if (m)
-      return e.push(a(t)), e;
-    if (t <= 3) {
-      for (let s = 1; s <= Math.min(3, n); s++)
-        e.push(a(s));
-      n > 3 && (e.push(i("ellipsis-end")), e.push(a(n)));
-    } else t >= n - 2 ? (e.push(a(d)), e.push(i("ellipsis-start")), e.push(a(n - 2)), e.push(a(n - 1)), e.push(a(n))) : (e.push(a(d)), e.push(i("ellipsis-start")), e.push(a(t - 1)), e.push(a(t)), e.push(a(t + 1)), e.push(i("ellipsis-end")), e.push(a(f)));
+      return e.push(t(a)), e;
+    if (a <= 3) {
+      for (let s = 1; s <= Math.min(3, o); s++)
+        e.push(t(s));
+      o > 3 && (e.push(r("ellipsis-end")), e.push(t(o)));
+    } else a >= o - 2 ? (e.push(t(d)), e.push(r("ellipsis-start")), e.push(t(o - 2)), e.push(t(o - 1)), e.push(t(o))) : (e.push(t(d)), e.push(r("ellipsis-start")), e.push(t(a - 1)), e.push(t(a)), e.push(t(a + 1)), e.push(r("ellipsis-end")), e.push(t(b)));
     return e;
   };
-  return /* @__PURE__ */ o.createElement("div", {
-    className: "flex items-center gap-1 font-normal",
-    "data-automation-id": "pagination-container"
-  }, /* @__PURE__ */ o.createElement("span", {
+  return /* @__PURE__ */ n.createElement("nav", {
+    "aria-label": x,
+    "data-automation-id": "pagination-container",
+    className: "flex items-center gap-1 font-normal"
+  }, /* @__PURE__ */ n.createElement("span", {
     className: "text-sm text-[var(--color-gray-700)] mr-1",
     "data-automation-id": "pagination-items-info"
-  }, `${m ? "" : "Showing "}${x}-${u} of ${r}`), /* @__PURE__ */ o.createElement("span", {
-    onClick: () => g && p(t - 1),
-    className: `${c.pageNavigation}`,
-    "data-automation-id": "pagination-previous-button"
-  }, /* @__PURE__ */ o.createElement(h, {
+  }, `${m ? "" : "Showing "}${g}-${u} of ${i}`), /* @__PURE__ */ n.createElement(f, {
     name: "next",
-    className: "rotate-180 transition-transform stroke-[var(--color-gray-600)]"
-  })), /* @__PURE__ */ o.createElement("div", {
+    size: 12,
+    ariaLabel: "Previous page",
+    rotation: "180",
+    disabled: !y,
+    onClick: () => p(a - 1),
+    className: `stroke-[var(--color-gray-600)] ${c.pageNavigation}`,
+    automationId: "pagination-previous-button"
+  }), /* @__PURE__ */ n.createElement("ul", {
     className: "flex items-center gap-1"
-  }, b()), /* @__PURE__ */ o.createElement("span", {
-    onClick: () => v && p(t + 1),
-    className: `${c.pageNavigation}`,
-    "data-automation-id": "pagination-next-button"
-  }, /* @__PURE__ */ o.createElement(h, {
-    name: "next"
-  })));
+  }, E()), /* @__PURE__ */ n.createElement(f, {
+    name: "next",
+    size: 12,
+    ariaLabel: "Next page",
+    disabled: !v,
+    onClick: () => p(a + 1),
+    className: c.pageNavigation,
+    automationId: "pagination-next-button"
+  }));
 };
 export {
-  E as Pagination
+  k as Pagination
 };
 //# sourceMappingURL=index30.js.map

package/dist/index30.js.map

@@ -1 +1 @@
-{"version":3,"file":"index30.js","sources":["../src/components/Pagination/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Icon } from 'components/Icon';\n\ninterface PaginationProps {\n  currentPage: number;\n  itemsPerPage: number;\n  totalItems: number;\n  onPageChange: (page: number) => void;\n  mobileView?: boolean;\n}\n\nconst paginationClassNames = {\n  pageNavigation: \"px-[6px] flex items-center justify-center disabled:opacity-50 hover:cursor-pointer\",\n  pageItem: \"px-[6px] text-sm flex items-center justify-center rounded border hover:cursor-pointer\"\n}\n\nexport const Pagination: React.FC<PaginationProps> = ({ currentPage, itemsPerPage, totalItems, onPageChange, mobileView = false }) => {\n  const totalPages = Math.ceil(totalItems / itemsPerPage);\n  const firstPage = 1;\n  const lastPage = totalPages;\n  const startItem = (currentPage - 1) * itemsPerPage + 1;\n  const endItem = Math.min(currentPage * itemsPerPage, totalItems);\n  const hasNextPage = endItem < totalItems;\n  const hasPrevPage = currentPage > 1;\n\n  const renderPageNumbers = () => {\n    const pages = [];\n\n    const renderPageNumber = (pageNum: number) => {\n      return (\n        <span\n          key={pageNum}\n          onClick={() => onPageChange(pageNum)}\n          className={`${paginationClassNames.pageItem} ${currentPage === pageNum ? 'bg-[var(--color-gray-100)] border-[var(--color-gray-300)]' : 'border-[var(--color-gray-200)] hover:bg-[var(--color-gray-50)]'}`}\n          data-automation-id={`page-number-${pageNum}`}\n        >\n          {pageNum}\n        </span>\n      );\n    };\n\n    const renderEllipsis = (key: string) => {\n      return (\n        <span key={key} className=\"w-5 h-5 text-sm rounded border border-[var(--color-gray-200)] flex items-end justify-center\">\n          ...\n        </span>\n      );\n    };\n    if(mobileView) {\n      pages.push(renderPageNumber(currentPage));\n\n      return pages;\n    }\n    if (currentPage <= 3) {\n      for (let i = 1; i <= Math.min(3, totalPages); i++) {\n        pages.push(renderPageNumber(i));\n      }\n\n      if (totalPages > 3) {\n        pages.push(renderEllipsis(\"ellipsis-end\"));\n        pages.push(renderPageNumber(totalPages));\n      }\n    } else if (currentPage >= totalPages - 2) {\n      pages.push(renderPageNumber(firstPage));\n      pages.push(renderEllipsis(\"ellipsis-start\"));\n      pages.push(renderPageNumber(totalPages - 2));\n      pages.push(renderPageNumber(totalPages - 1));\n      pages.push(renderPageNumber(totalPages));\n    } else {\n      pages.push(renderPageNumber(firstPage));\n      pages.push(renderEllipsis(\"ellipsis-start\"));\n      pages.push(renderPageNumber(currentPage - 1));\n      pages.push(renderPageNumber(currentPage));\n      pages.push(renderPageNumber(currentPage + 1));\n      pages.push(renderEllipsis(\"ellipsis-end\"));\n      pages.push(renderPageNumber(lastPage));\n    }\n\n    return pages;\n  };\n\n  return (\n    <div className=\"flex items-center gap-1 font-normal\" data-automation-id=\"pagination-container\">\n      <span className=\"text-sm text-[var(--color-gray-700)] mr-1\" data-automation-id=\"pagination-items-info\">\n        {`${mobileView ? \"\" : \"Showing \"}${startItem}-${endItem} of ${totalItems}`}\n      </span>\n      <span\n        onClick={() => hasPrevPage && onPageChange(currentPage - 1)}\n        className={`${paginationClassNames.pageNavigation}`}\n        data-automation-id=\"pagination-previous-button\"\n      >\n        <Icon name=\"next\" className=\"rotate-180 transition-transform stroke-[var(--color-gray-600)]\" />\n      </span>\n      {/* Render page numbers */}\n      <div className=\"flex items-center gap-1\">{renderPageNumbers()}</div>\n      <span\n        onClick={() => hasNextPage && onPageChange(currentPage + 1)}\n        className={`${paginationClassNames.pageNavigation}`}\n        data-automation-id=\"pagination-next-button\"\n      >\n        <Icon name=\"next\" />\n      </span>\n    </div>\n  );\n};\n"],"names":["React__default","Icon","paginationClassNames","pageNavigation","pageItem","Pagination","currentPage","itemsPerPage","totalItems","onPageChange","mobileView","totalPages","Math","ceil","firstPage","lastPage","startItem","endItem","min","hasNextPage","hasPrevPage","renderPageNumbers","pages","renderPageNumber","pageNum","React","createElement","key","onClick","className","renderEllipsis","push","i","name"],"mappings":"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"}
+{"version":3,"file":"index30.js","sources":["../src/components/Pagination/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Icon } from 'components/Icon';\n\ninterface PaginationProps {\n  currentPage: number;\n  itemsPerPage: number;\n  totalItems: number;\n  onPageChange: (page: number) => void;\n  mobileView?: boolean;\n  ariaLabel?: string;\n}\n\nconst paginationClassNames = {\n  pageNavigation: \"px-[6px] py-[6px] flex items-center justify-center\",\n  pageItem: \"px-[7px] py-[1px] min-w-[24px] text-sm flex items-center justify-center rounded border hover:cursor-pointer appearance-none focus-outline\"\n}\n\nexport const Pagination: React.FC<PaginationProps> = ({ currentPage, itemsPerPage, totalItems, onPageChange, mobileView = false, ariaLabel = 'Pagination Controls' }) => {\n  const totalPages = Math.ceil(totalItems / itemsPerPage);\n  const firstPage = 1;\n  const lastPage = totalPages;\n  const startItem = (currentPage - 1) * itemsPerPage + 1;\n  const endItem = Math.min(currentPage * itemsPerPage, totalItems);\n  const hasNextPage = endItem < totalItems;\n  const hasPrevPage = currentPage > 1;\n\n  const renderPageNumbers = () => {\n    const pages: React.ReactNode[] = [];\n\n    const renderPageNumber = (pageNum: number) => {\n      const isActive = currentPage === pageNum;\n      return (\n        <li key={pageNum}>\n          <button\n            type=\"button\"\n            onClick={() => onPageChange(pageNum)}\n            className={`${paginationClassNames.pageItem} ${isActive ? 'bg-[var(--color-gray-100)] border-[var(--color-gray-300)]' : 'border-[var(--color-gray-200)] hover:bg-[var(--color-gray-50)]'}`}\n            aria-label={`Page ${pageNum}`}\n            aria-current={isActive ? 'page' : undefined}\n            data-automation-id={`page-number-${pageNum}`}\n          >\n            {pageNum}\n          </button>\n        </li>\n      );\n    };\n\n    const renderEllipsis = (key: string) => {\n      return (\n        <li key={key} aria-hidden=\"true\">\n          <span className=\"w-5 h-5 text-sm rounded border border-[var(--color-gray-200)] flex items-end justify-center\">\n            ...\n          </span>\n        </li>\n      );\n    };\n\n    if (mobileView) {\n      pages.push(renderPageNumber(currentPage));\n      return pages;\n    }\n    if (currentPage <= 3) {\n      for (let i = 1; i <= Math.min(3, totalPages); i++) {\n        pages.push(renderPageNumber(i));\n      }\n\n      if (totalPages > 3) {\n        pages.push(renderEllipsis(\"ellipsis-end\"));\n        pages.push(renderPageNumber(totalPages));\n      }\n    } else if (currentPage >= totalPages - 2) {\n      pages.push(renderPageNumber(firstPage));\n      pages.push(renderEllipsis(\"ellipsis-start\"));\n      pages.push(renderPageNumber(totalPages - 2));\n      pages.push(renderPageNumber(totalPages - 1));\n      pages.push(renderPageNumber(totalPages));\n    } else {\n      pages.push(renderPageNumber(firstPage));\n      pages.push(renderEllipsis(\"ellipsis-start\"));\n      pages.push(renderPageNumber(currentPage - 1));\n      pages.push(renderPageNumber(currentPage));\n      pages.push(renderPageNumber(currentPage + 1));\n      pages.push(renderEllipsis(\"ellipsis-end\"));\n      pages.push(renderPageNumber(lastPage));\n    }\n\n    return pages;\n  };\n\n  return (\n    <nav aria-label={ariaLabel} data-automation-id=\"pagination-container\" className=\"flex items-center gap-1 font-normal\">\n      <span\n        className=\"text-sm text-[var(--color-gray-700)] mr-1\"\n        data-automation-id=\"pagination-items-info\"\n      >\n        {`${mobileView ? \"\" : \"Showing \"}${startItem}-${endItem} of ${totalItems}`}\n      </span>\n      <Icon\n        name=\"next\"\n        size={12}\n        ariaLabel=\"Previous page\"\n        rotation=\"180\"\n        disabled={!hasPrevPage}\n        onClick={() => onPageChange(currentPage - 1)}\n        className={`stroke-[var(--color-gray-600)] ${paginationClassNames.pageNavigation}`}\n        automationId=\"pagination-previous-button\"\n      />\n      <ul className=\"flex items-center gap-1\">\n        {renderPageNumbers()}\n      </ul>\n      <Icon\n        name=\"next\"\n        size={12}\n        ariaLabel=\"Next page\"\n        disabled={!hasNextPage}\n        onClick={() => onPageChange(currentPage + 1)}\n        className={paginationClassNames.pageNavigation}\n        automationId=\"pagination-next-button\"\n      />\n    </nav>\n  );\n};\n"],"names":["React__default","Icon","paginationClassNames","pageNavigation","pageItem","Pagination","currentPage","itemsPerPage","totalItems","onPageChange","mobileView","ariaLabel","totalPages","Math","ceil","firstPage","lastPage","startItem","endItem","min","hasNextPage","hasPrevPage","renderPageNumbers","pages","renderPageNumber","pageNum","isActive","React","createElement","key","type","onClick","className","undefined","renderEllipsis","push","i","name","size","rotation","disabled","automationId"],"mappings":"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"}

package/dist/index31.js

@@ -1,7 +1,7 @@
 import e from "react";
 import { Button as N } from "./index3.js";
 import { Badge as I } from "./index9.js";
-import { Icon as g } from "./index5.js";
+import { Icon as d } from "./index5.js";
 /* empty css         */
 const t = {
   widgetCtn: "flex flex-col gap-[2px] align-center border border-[var(--color-gray-200)] rounded-[12px] w-[385px]",
@@ -21,16 +21,16 @@ const t = {
   requestFeatureImageCtn: "w-[48px] h-[48px] border border-[var(--color-gray-200)] rounded-[50%] flex items-center flex-shrink-0 bg-[var(--color-red-50)]",
   requestFeatureDescriptionCtn: "flex flex-col"
 }, B = ({
-  widgetClassName: d = "",
+  widgetClassName: g = "",
   widgetType: a = "general",
   widgetTitle: r = "",
   widgetDescription: l = "",
   widgetImage: p,
-  hasImage: x = !1,
+  hasImage: f = !1,
   hasButtonCta: n = !1,
   hasLinkCta: i = !1,
   ctaText: o = "",
-  hasBadge: f = !1,
+  hasBadge: x = !1,
   badgeText: w = "",
   buttonBgColor: u = "secondary",
   onCtaClick: b,
@@ -38,7 +38,7 @@ const t = {
   webinarDateInfo: c,
   webinarSpeaker: s
 }) => {
-  const E = f && /* @__PURE__ */ e.createElement(I, {
+  const E = x && /* @__PURE__ */ e.createElement(I, {
     label: w,
     className: t.widgetBadge,
     bgColor: "var(--color-yellow-50)",
@@ -52,14 +52,14 @@ const t = {
     label: o,
     className: `${t.widgetButtonCta} mt-[4px]`,
     onClick: b
-  })), C = x && /* @__PURE__ */ e.createElement("div", {
+  })), C = f && /* @__PURE__ */ e.createElement("div", {
     className: `${t.widgetImageCtn} widget-image-ctn`
   }, /* @__PURE__ */ e.createElement("img", {
     src: p,
     alt: "widget-image"
   }));
   return /* @__PURE__ */ e.createElement("div", {
-    className: `${t.widgetCtn} ${d} widget-ctn`,
+    className: `${t.widgetCtn} ${g} widget-ctn`,
     onClick: v
   }, a !== "general" && C, /* @__PURE__ */ e.createElement("div", {
     className: t.descriptionCtn
@@ -71,14 +71,14 @@ const t = {
     className: t.webinarInfoCtn
   }, s && /* @__PURE__ */ e.createElement("div", {
     className: `${t.webinarDescriptionInfo} align-baseline`
-  }, /* @__PURE__ */ e.createElement(g, {
+  }, /* @__PURE__ */ e.createElement(d, {
     name: "people",
     className: "relative top-[2px]"
   }), /* @__PURE__ */ e.createElement("span", {
     className: t.webinarSpeaker
   }, s)), c && /* @__PURE__ */ e.createElement("div", {
     className: `${t.webinarTimeInfo} align-baseline mb-[4px]`
-  }, /* @__PURE__ */ e.createElement(g, {
+  }, /* @__PURE__ */ e.createElement(d, {
     name: "clock",
     className: "relative top-[2px]"
   }), /* @__PURE__ */ e.createElement("span", {
@@ -96,6 +96,7 @@ const t = {
   }, l), m)) : m));
 };
 export {
-  B as Widget
+  B as Widget,
+  B as default
 };
 //# sourceMappingURL=index31.js.map

package/dist/index32.js

@@ -1,64 +1,79 @@
-import a, { useRef as h } from "react";
-function w(e) {
+import t, { useRef as $ } from "react";
+import { useStableId as y } from "./index190.js";
+function L(e) {
   const {
-    label: c,
-    value: o,
+    label: u,
+    value: n,
     checked: r,
-    disabled: t,
-    name: d,
-    onChange: l,
-    width: s,
-    radioLabelClassName: m = "",
-    radioContainerClassName: u = "",
-    automationId: x = "",
-    bgColor: f = "var(--color-white)",
-    withBorder: b = !0,
-    content: i
-  } = e, n = h(null);
-  return /* @__PURE__ */ a.createElement("div", {
-    className: `se-design-radio-container flex flex-col justify-center items-start gap-2 ${t ? "cursor-not-allowed" : "cursor-pointer"} ${b ? `border ${r ? "border-[var(--color-blue-500)]" : "border-[var(--color-gray-400)]"} p-4` : ""} rounded-[6px] transition-colors duration-300 ${t ? "opacity-50" : ""} ${u}`,
-    onClick: () => n.current?.click(),
+    disabled: a,
+    name: c,
+    onChange: i,
+    width: m,
+    radioLabelClassName: f = "",
+    radioContainerClassName: h = "",
+    automationId: p = "",
+    bgColor: b = "var(--color-white)",
+    withBorder: x = !0,
+    content: d
+  } = e, o = $(null), s = y(void 0, `${c}-${n}`);
+  t.useLayoutEffect(() => {
+    o.current && (o.current.checked = r);
+  }, [r]);
+  const C = () => {
+    a || (o.current?.focus(), o.current?.click());
+  }, g = (l) => {
+    l.preventDefault(), l.stopPropagation(), a || (o.current?.focus(), i?.({
+      ...e,
+      checked: !0
+    }));
+  }, k = (l) => {
+    l.stopPropagation();
+  }, v = () => {
+    i?.({
+      ...e,
+      checked: !0
+    });
+  }, w = r ? "border-[var(--color-blue-500)]" : "border-[var(--color-gray-400)]";
+  return /* @__PURE__ */ t.createElement("div", {
+    className: `se-design-radio-container flex flex-col justify-center items-start gap-2 ${a ? "cursor-not-allowed" : "cursor-pointer"} ${x ? `border ${w} p-4` : ""} rounded-[6px] transition-colors duration-300 ${a ? "opacity-50" : ""} ${h}`,
+    onClick: C,
     style: {
-      width: s || "auto",
-      backgroundColor: f
+      width: m || "auto",
+      backgroundColor: b
     },
-    "data-automation-id": x
-  }, /* @__PURE__ */ a.createElement("div", {
+    "data-automation-id": p
+  }, /* @__PURE__ */ t.createElement("div", {
     className: "flex items-center gap-[0.625rem]",
     "data-automation-id": "radio-field-content"
-  }, /* @__PURE__ */ a.createElement("input", {
-    ref: n,
+  }, /* @__PURE__ */ t.createElement("input", {
+    ref: o,
     type: "radio",
-    id: o,
-    name: d,
-    value: o,
-    checked: r,
-    disabled: t,
+    id: s,
+    name: c,
+    value: n,
+    disabled: a,
     className: "radio-field-input cursor-pointer accent-[var(--color-blue-500)] disabled:cursor-not-allowed disabled:opacity-50 text-[var(--color-blue-500)] w-[14px] h-[14px] p-[3px]",
-    onChange: () => {
-      l && l({
-        ...e,
-        checked: !0
-      });
-    }
-  }), /* @__PURE__ */ a.createElement("label", {
-    htmlFor: o,
-    className: `${e.helperLabel ? "flex flex-col gap-[6px]" : ""} ${t ? "cursor-not-allowed" : "cursor-pointer"}`,
-    "data-automation-id": "radio-field-label"
-  }, /* @__PURE__ */ a.createElement("span", {
-    className: `text-sm text-[var(--color-gray-800)] ${m} `,
+    onClick: k,
+    onChange: v
+  }), /* @__PURE__ */ t.createElement("label", {
+    htmlFor: s,
+    className: `${e.helperLabel ? "flex flex-col gap-[6px] " : ""}${a ? "cursor-not-allowed" : "cursor-pointer"}`,
+    "data-automation-id": "radio-field-label",
+    onClick: g
+  }, /* @__PURE__ */ t.createElement("span", {
+    className: `text-sm text-[var(--color-gray-800)] ${f} `,
     style: {
       fontSize: "16px",
       fontWeight: "400"
     }
-  }, c))), r && i && /* @__PURE__ */ a.createElement("div", {
+  }, u))), r && d && /* @__PURE__ */ t.createElement("div", {
     className: "radio-child-content pl-[1.5rem] w-full"
-  }, i()), e.helperLabel && /* @__PURE__ */ a.createElement("span", {
+  }, d()), e.helperLabel && /* @__PURE__ */ t.createElement("span", {
     className: `text-sm font-normal text-[var(--color-gray-600)] ${e.maxWidth ? `max-w-[${e.maxWidth}]` : "max-w-full"} break-words whitespace-normal`,
     "data-automation-id": "radio-field-helper-text"
   }, e.helperLabel));
 }
 export {
-  w as Radio
+  L as Radio
 };
 //# sourceMappingURL=index32.js.map

package/dist/index32.js.map

@@ -1 +1 @@
-{"version":3,"file":"index32.js","sources":["../src/components/Radio/index.tsx"],"sourcesContent":["import React, { useRef } from 'react';\n\nexport interface RadioProps {\n  label: string;\n  value: string;\n  checked: boolean;\n  disabled: boolean;\n  name: string;\n  onChange?: (props: RadioProps) => void;\n  helperLabel?: string;\n  maxWidth?: string;\n  width?: string;\n  radioLabelClassName?: string;\n  radioContainerClassName?: string;\n  automationId?: string;\n  withBorder?: boolean;\n  bgColor?: string;\n  content?: () => React.ReactNode;\n}\n\nexport function Radio(props: RadioProps) {\n  const {\n    label,\n    value,\n    checked,\n    disabled,\n    name,\n    onChange,\n    width,\n    radioLabelClassName = '',\n    radioContainerClassName = '',\n    automationId = '',\n    bgColor = 'var(--color-white)',\n    withBorder = true,\n    content\n  } = props;\n  const radioRef = useRef<HTMLInputElement>(null);\n\n  return (\n    <div\n      className={`se-design-radio-container flex flex-col justify-center items-start gap-2 ${\n        disabled ? 'cursor-not-allowed' : 'cursor-pointer'\n      } ${\n        withBorder ? `border ${checked ? 'border-[var(--color-blue-500)]' : 'border-[var(--color-gray-400)]'} p-4` : ''\n      } rounded-[6px] transition-colors duration-300 ${disabled ? 'opacity-50' : ''} ${radioContainerClassName}`}\n      onClick={() => radioRef.current?.click()}\n      style={{ width: width || 'auto', backgroundColor: bgColor }}\n      data-automation-id={automationId}\n    >\n      <div className=\"flex items-center gap-[0.625rem]\" data-automation-id=\"radio-field-content\">\n        <input\n          ref={radioRef}\n          type=\"radio\"\n          id={value}\n          name={name}\n          value={value}\n          checked={checked}\n          disabled={disabled}\n          className=\"radio-field-input cursor-pointer accent-[var(--color-blue-500)] disabled:cursor-not-allowed disabled:opacity-50 text-[var(--color-blue-500)] w-[14px] h-[14px] p-[3px]\"\n          onChange={() => {\n            onChange && onChange({ ...props, checked: true });\n          }}\n        />\n        <label\n          htmlFor={value}\n          className={`${props.helperLabel ? 'flex flex-col gap-[6px]' : ''} ${\n            disabled ? 'cursor-not-allowed' : 'cursor-pointer'\n          }`}\n          data-automation-id=\"radio-field-label\"\n        >\n          <span\n            className={`text-sm text-[var(--color-gray-800)] ${radioLabelClassName} `}\n            style={{ fontSize: '16px', fontWeight: '400' }}\n          >\n            {label}\n          </span>\n        </label>\n      </div>\n      {checked && content && <div className=\"radio-child-content pl-[1.5rem] w-full\">{content()}</div>}\n      {props.helperLabel && (\n        <span\n          className={`text-sm font-normal text-[var(--color-gray-600)] ${\n            props.maxWidth ? `max-w-[${props.maxWidth}]` : 'max-w-full'\n          } break-words whitespace-normal`}\n          data-automation-id=\"radio-field-helper-text\"\n        >\n          {props.helperLabel}\n        </span>\n      )}\n    </div>\n  );\n}\n"],"names":["Radio","props","label","value","checked","disabled","name","onChange","width","radioLabelClassName","radioContainerClassName","automationId","bgColor","withBorder","content","radioRef","useRef","React","createElement","className","onClick","current","click","style","backgroundColor","ref","type","id","htmlFor","helperLabel","fontSize","fontWeight","maxWidth"],"mappings":";AAoBO,SAASA,EAAMC,GAAmB;AACvC,QAAM;AAAA,IACJC,OAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,SAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,MAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,qBAAAA,IAAsB;AAAA,IACtBC,yBAAAA,IAA0B;AAAA,IAC1BC,cAAAA,IAAe;AAAA,IACfC,SAAAA,IAAU;AAAA,IACVC,YAAAA,IAAa;AAAA,IACbC,SAAAA;AAAAA,EAAAA,IACEb,GACEc,IAAWC,EAAyB,IAAI;AAE9C,SACEC,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEC,WAAW,4EACTd,IAAW,uBAAuB,gBAAgB,IAElDQ,IAAa,UAAUT,IAAU,mCAAmC,gCAAgC,SAAS,EAAE,iDAChEC,IAAW,eAAe,EAAE,IAAIK,CAAuB;AAAA,IACxGU,SAASA,MAAML,EAASM,SAASC,MAAAA;AAAAA,IACjCC,OAAO;AAAA,MAAEf,OAAOA,KAAS;AAAA,MAAQgB,iBAAiBZ;AAAAA,IAAAA;AAAAA,IAClD,sBAAoBD;AAAAA,EAAAA,GAEpBM,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,WAAU;AAAA,IAAmC,sBAAmB;AAAA,EAAA,GACnEF,gBAAAA,EAAAC,cAAA,SAAA;AAAA,IACEO,KAAKV;AAAAA,IACLW,MAAK;AAAA,IACLC,IAAIxB;AAAAA,IACJG,MAAAA;AAAAA,IACAH,OAAAA;AAAAA,IACAC,SAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAc,WAAU;AAAA,IACVZ,UAAUA,MAAM;AACdA,MAAAA,KAAYA,EAAS;AAAA,QAAE,GAAGN;AAAAA,QAAOG,SAAS;AAAA,MAAA,CAAM;AAAA,IAClD;AAAA,EAAA,CACD,GACDa,gBAAAA,EAAAC,cAAA,SAAA;AAAA,IACEU,SAASzB;AAAAA,IACTgB,WAAW,GAAGlB,EAAM4B,cAAc,4BAA4B,EAAE,IAC9DxB,IAAW,uBAAuB,gBAAgB;AAAA,IAEpD,sBAAmB;AAAA,EAAA,GAEnBY,gBAAAA,EAAAC,cAAA,QAAA;AAAA,IACEC,WAAW,wCAAwCV,CAAmB;AAAA,IACtEc,OAAO;AAAA,MAAEO,UAAU;AAAA,MAAQC,YAAY;AAAA,IAAA;AAAA,EAAM,GAE5C7B,CACG,CACD,CACJ,GACJE,KAAWU,KAAWG,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,WAAU;AAAA,EAAA,GAA0CL,GAAe,GAC9Fb,EAAM4B,eACLZ,gBAAAA,EAAAC,cAAA,QAAA;AAAA,IACEC,WAAW,oDACTlB,EAAM+B,WAAW,UAAU/B,EAAM+B,QAAQ,MAAM,YAAY;AAAA,IAE7D,sBAAmB;AAAA,EAAA,GAElB/B,EAAM4B,WACH,CAEL;AAET;"}
+{"version":3,"file":"index32.js","sources":["../src/components/Radio/index.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { useStableId } from '../../utils/useStableId';\n\nexport interface RadioProps {\n  label: string;\n  value: string;\n  checked: boolean;\n  disabled: boolean;\n  name: string;\n  onChange?: (props: RadioProps) => void;\n  helperLabel?: string;\n  maxWidth?: string;\n  width?: string;\n  radioLabelClassName?: string;\n  radioContainerClassName?: string;\n  automationId?: string;\n  withBorder?: boolean;\n  bgColor?: string;\n  content?: () => React.ReactNode;\n}\n\nexport function Radio(props: RadioProps) {\n  const {\n    label,\n    value,\n    checked,\n    disabled,\n    name,\n    onChange,\n    width,\n    radioLabelClassName = '',\n    radioContainerClassName = '',\n    automationId = '',\n    bgColor = 'var(--color-white)',\n    withBorder = true,\n    content\n  } = props;\n  const radioRef = useRef<HTMLInputElement>(null);\n  const inputId = useStableId(undefined, `${name}-${value}`);\n\n  // Sync DOM checked state with prop — bypasses React's controlled-input restore mechanism\n  // which resets DOM.checked=false after the first click on an unselected radio.\n  React.useLayoutEffect(() => {\n    if (radioRef.current) {\n      radioRef.current.checked = checked;\n    }\n  }, [checked]);\n\n  const handleContainerClick = () => {\n    if (!disabled) {\n      radioRef.current?.focus();\n      radioRef.current?.click();\n    }\n  };\n\n  const handleLabelClick = (e: React.MouseEvent<HTMLLabelElement>) => {\n    // Prevent native htmlFor redirect (avoids double-firing onChange) while keeping htmlFor for SR association\n    e.preventDefault();\n    e.stopPropagation();\n    if (!disabled) {\n      radioRef.current?.focus();\n      onChange?.({ ...props, checked: true });\n    }\n  };\n\n  const handleInputClick = (e: React.MouseEvent<HTMLInputElement>) => {\n    e.stopPropagation();\n  };\n\n  const handleInputChange = () => {\n    onChange?.({ ...props, checked: true });\n  };\n\n  const borderColor = checked ? 'border-[var(--color-blue-500)]' : 'border-[var(--color-gray-400)]';\n\n  return (\n    <div\n      className={`se-design-radio-container flex flex-col justify-center items-start gap-2 ${\n        disabled ? 'cursor-not-allowed' : 'cursor-pointer'\n      } ${\n        withBorder ? `border ${borderColor} p-4` : ''\n      } rounded-[6px] transition-colors duration-300 ${disabled ? 'opacity-50' : ''} ${radioContainerClassName}`}\n      onClick={handleContainerClick}\n      style={{ width: width || 'auto', backgroundColor: bgColor }}\n      data-automation-id={automationId}\n    >\n      <div className=\"flex items-center gap-[0.625rem]\" data-automation-id=\"radio-field-content\">\n        <input\n          ref={radioRef}\n          type=\"radio\"\n          id={inputId}\n          name={name}\n          value={value}\n          disabled={disabled}\n          className=\"radio-field-input cursor-pointer accent-[var(--color-blue-500)] disabled:cursor-not-allowed disabled:opacity-50 text-[var(--color-blue-500)] w-[14px] h-[14px] p-[3px]\"\n          onClick={handleInputClick}\n          onChange={handleInputChange}\n        />\n        <label\n          htmlFor={inputId}\n          className={`${props.helperLabel ? 'flex flex-col gap-[6px] ' : ''}${\n            disabled ? 'cursor-not-allowed' : 'cursor-pointer'\n          }`}\n          data-automation-id=\"radio-field-label\"\n          onClick={handleLabelClick}\n        >\n          <span\n            className={`text-sm text-[var(--color-gray-800)] ${radioLabelClassName} `}\n            style={{ fontSize: '16px', fontWeight: '400' }}\n          >\n            {label}\n          </span>\n        </label>\n      </div>\n      {checked && content && <div className=\"radio-child-content pl-[1.5rem] w-full\">{content()}</div>}\n      {props.helperLabel && (\n        <span\n          className={`text-sm font-normal text-[var(--color-gray-600)] ${\n            props.maxWidth ? `max-w-[${props.maxWidth}]` : 'max-w-full'\n          } break-words whitespace-normal`}\n          data-automation-id=\"radio-field-helper-text\"\n        >\n          {props.helperLabel}\n        </span>\n      )}\n    </div>\n  );\n}\n"],"names":["Radio","props","label","value","checked","disabled","name","onChange","width","radioLabelClassName","radioContainerClassName","automationId","bgColor","withBorder","content","radioRef","useRef","inputId","useStableId","undefined","React","useLayoutEffect","current","handleContainerClick","focus","click","handleLabelClick","e","preventDefault","stopPropagation","handleInputClick","handleInputChange","borderColor","createElement","className","onClick","style","backgroundColor","ref","type","id","htmlFor","helperLabel","fontSize","fontWeight","maxWidth"],"mappings":"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"}

package/dist/index34.js

@@ -1,6 +1,6 @@
 import e, { useState as h, useEffect as E } from "react";
 import { Icon as N } from "./index5.js";
-import { useStableId as $ } from "./index189.js";
+import { useStableId as $ } from "./index190.js";
 import { getRegionAttributes as I } from "./index65.js";
 import { useAccessiblePress as _ } from "./index66.js";
 function r() {

package/dist/index35.js

@@ -1,85 +1,92 @@
-import e, { useState as I, useEffect as h } from "react";
-import { Icon as d } from "./index5.js";
-import { useStableId as y } from "./index189.js";
-import { getA11yNameAttributes as _ } from "./index70.js";
-import { getRegionAttributes as O } from "./index65.js";
-import { useAccessiblePress as C } from "./index66.js";
+import e, { useState as R, useEffect as S } from "react";
+import { Icon as p } from "./index5.js";
+import { useStableId as j } from "./index190.js";
+import { getA11yNameAttributes as k } from "./index71.js";
+import { getRegionAttributes as w } from "./index65.js";
+import { useAccessiblePress as F } from "./index66.js";
 function a() {
   return a = Object.assign ? Object.assign.bind() : function(r) {
-    for (var s = 1; s < arguments.length; s++) {
-      var n = arguments[s];
-      for (var o in n) ({}).hasOwnProperty.call(n, o) && (r[o] = n[o]);
+    for (var n = 1; n < arguments.length; n++) {
+      var o = arguments[n];
+      for (var s in o) ({}).hasOwnProperty.call(o, s) && (r[s] = o[s]);
     }
     return r;
   }, a.apply(null, arguments);
 }
-const P = ({
+const D = ({
   renderAccordionContents: r,
-  renderAccordionSrcElement: s,
-  defaultOpen: n,
-  className: o = "",
+  renderAccordionSrcElement: n,
+  renderControls: o,
+  defaultOpen: s,
+  expanded: m,
+  onChange: v,
+  className: E = "",
   arrowPosition: c = "left",
-  contentClassName: g = "",
+  contentClassName: b = "",
   disabled: i = !1,
-  automationId: p = "",
-  id: v,
-  ariaLabel: b
+  automationId: N = "",
+  id: x,
+  ariaLabel: $
 }) => {
-  const [t, m] = I(!1);
-  h(() => {
-    m(n || !1);
-  }, [n]);
-  const l = y(v, "custom-accordion"), f = `${l}-content`, {
-    pressProps: E,
-    role: x,
-    tabIndex: N
-  } = C({
-    onClick: () => m(!t),
+  const [h, f] = R(!1);
+  S(() => {
+    f(s || !1);
+  }, [s]);
+  const u = m !== void 0, t = u ? m : h, A = () => {
+    u ? v?.(!t) : f(!t);
+  }, l = j(x, "custom-accordion"), d = `${l}-content`, {
+    pressProps: I,
+    role: O,
+    tabIndex: y
+  } = F({
+    onClick: A,
     isNative: !1,
     disabled: i
-  }), $ = O({
+  }), _ = w({
     titleId: l,
     isFocusable: !1
-  }), A = "group-focus-visible:[outline:var(--focus-width)_solid_var(--focus-color)] group-focus-visible:[outline-offset:var(--focus-offset)] group-focus-visible:p-[2px]", u = () => i ? "" : c === "left" ? t ? "rotate-90" : "" : t ? "rotate-180" : "";
+  }), C = "group-focus-visible:[outline:var(--focus-width)_solid_var(--focus-color)] group-focus-visible:[outline-offset:var(--focus-offset)] group-focus-visible:p-[2px]", g = () => i ? "" : c === "left" ? t ? "rotate-90" : "" : t ? "rotate-180" : "";
   return /* @__PURE__ */ e.createElement("div", {
-    className: `se-design-accordion ${o}`,
-    "data-automation-id": p
+    className: `se-design-accordion ${E}`,
+    "data-automation-id": N
   }, /* @__PURE__ */ e.createElement("div", {
     className: "flex flex-col"
-  }, /* @__PURE__ */ e.createElement("div", a({}, E, _({
-    ariaLabel: b
+  }, /* @__PURE__ */ e.createElement("div", {
+    className: "se-design-accordion-src flex items-center"
+  }, /* @__PURE__ */ e.createElement("div", a({}, I, k({
+    ariaLabel: $
   }), {
-    role: x,
-    tabIndex: N,
+    role: O,
+    tabIndex: y,
     "aria-expanded": t,
-    "aria-controls": f,
-    className: "se-design-accordion-src flex items-center cursor-pointer group focus-visible:outline-none"
+    "aria-controls": d,
+    className: "flex items-center flex-1 cursor-pointer group focus-visible:outline-none"
   }), /* @__PURE__ */ e.createElement("div", {
-    className: `flex items-center flex-1 rounded ${A}`
+    className: `flex items-center rounded ${C}`
   }, c === "left" && /* @__PURE__ */ e.createElement("div", {
-    className: `se-design-accordion-icon transform transition-transform duration-300 ${u()} ${i ? "opacity-30 pointer-events-none" : ""}`
-  }, /* @__PURE__ */ e.createElement(d, {
+    className: `se-design-accordion-icon transform transition-transform duration-300 ${g()} ${i ? "opacity-30 pointer-events-none" : ""}`
+  }, /* @__PURE__ */ e.createElement(p, {
     name: "rightSide"
   })), /* @__PURE__ */ e.createElement("div", {
-    className: "se-design-accordion-elements flex-1"
+    className: "se-design-accordion-elements"
   }, /* @__PURE__ */ e.createElement("div", {
     id: l,
     className: "se-design-accordion-src-element title"
-  }, s({
+  }, n({
     isOpen: t
   }))), c === "right" && /* @__PURE__ */ e.createElement("div", {
-    className: `se-design-accordion-icon transform transition-transform duration-300 ${u()} ${i ? "opacity-30 pointer-events-none" : ""}`
-  }, /* @__PURE__ */ e.createElement(d, {
+    className: `se-design-accordion-icon transform transition-transform duration-300 ${g()} ${i ? "opacity-30 pointer-events-none" : ""}`
+  }, /* @__PURE__ */ e.createElement(p, {
     name: "chevron"
-  })))), t && /* @__PURE__ */ e.createElement("div", a({
-    id: f
-  }, $, {
-    className: `se-design-accordion-content transition-all duration-300 mt-1 ${g}`
+  })))), o?.()), t && /* @__PURE__ */ e.createElement("div", a({
+    id: d
+  }, _, {
+    className: `se-design-accordion-content transition-all duration-300 mt-1 ${b}`
   }), r({
     isOpen: t
   }))));
 };
 export {
-  P as CustomAccordion
+  D as CustomAccordion
 };
 //# sourceMappingURL=index35.js.map

package/dist/index35.js.map

@@ -1 +1 @@
-{"version":3,"file":"index35.js","sources":["../src/components/CustomAccordion/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useState } from 'react';\nimport { Icon } from '../Icon';\nimport { useStableId } from '../../utils/useStableId';\nimport { useAccessiblePress, getA11yNameAttributes } from '../../utils/a11y';\nimport { getRegionAttributes } from '../../utils/a11y/regionAttributes';\n\nexport interface CustomAccordionProps {\n  renderAccordionContents: (props: { isOpen: boolean }) => React.ReactNode;\n  renderAccordionSrcElement: (props: { isOpen: boolean }) => React.ReactNode;\n  defaultOpen?: boolean;\n  className?: string;\n  arrowPosition?: 'left' | 'right';\n  contentClassName?: string;\n  disabled?: boolean;\n  automationId?: string;\n  id?: string;\n  ariaLabel?: string;\n}\n\nexport const CustomAccordion: FC<CustomAccordionProps> = ({\n  renderAccordionContents,\n  renderAccordionSrcElement,\n  defaultOpen,\n  className = '',\n  arrowPosition = 'left',\n  contentClassName = '',\n  disabled = false,\n  automationId = '',\n  id,\n  ariaLabel\n}) => {\n  const [isOpen, setIsOpen] = useState(false);\n  useEffect(() => {\n    setIsOpen(defaultOpen || false);\n  }, [defaultOpen]);\n\n  // Generate stable IDs for ARIA relationships\n  const triggerId = useStableId(id, 'custom-accordion');\n  const contentId = `${triggerId}-content`;\n\n  // Use accessible press hook for keyboard + mouse handling\n  const { pressProps, role, tabIndex } = useAccessiblePress({\n    onClick: () => setIsOpen(!isOpen),\n    isNative: false,\n    disabled\n  });\n\n  // Get region attributes for content panel\n  const regionAttributes = getRegionAttributes({\n    titleId: triggerId,\n    isFocusable: false\n  });\n\n  const focusVisibleClasses = 'group-focus-visible:[outline:var(--focus-width)_solid_var(--focus-color)] group-focus-visible:[outline-offset:var(--focus-offset)] group-focus-visible:p-[2px]';\n\n  const getArrowRotation = () => {\n    if (disabled) {\n      return '';\n    }\n    if (arrowPosition === 'left') {\n      return isOpen ? 'rotate-90' : '';\n    }\n    return isOpen ? 'rotate-180' : '';\n  };\n\n  return (\n    <div className={`se-design-accordion ${className}`} data-automation-id={automationId}>\n      <div className=\"flex flex-col\">\n        <div\n          {...pressProps}\n          {...getA11yNameAttributes({ ariaLabel })}\n          role={role}\n          tabIndex={tabIndex}\n          aria-expanded={isOpen}\n          aria-controls={contentId}\n          className=\"se-design-accordion-src flex items-center cursor-pointer group focus-visible:outline-none\"\n        >\n          <div className={`flex items-center flex-1 rounded ${focusVisibleClasses}`}>\n            {arrowPosition === 'left' && (\n              <div\n                className={`se-design-accordion-icon transform transition-transform duration-300 ${getArrowRotation()} ${\n                  disabled ? 'opacity-30 pointer-events-none' : ''\n                }`}\n              >\n                <Icon name=\"rightSide\" />\n              </div>\n            )}\n            <div className=\"se-design-accordion-elements flex-1\">\n              <div id={triggerId} className=\"se-design-accordion-src-element title\">{renderAccordionSrcElement({ isOpen })}</div>\n            </div>\n            {arrowPosition === 'right' && (\n              <div\n                className={`se-design-accordion-icon transform transition-transform duration-300 ${getArrowRotation()} ${\n                  disabled ? 'opacity-30 pointer-events-none' : ''\n                }`}\n              >\n                <Icon name=\"chevron\" />\n              </div>\n            )}\n          </div>\n        </div>\n        {isOpen && (\n          <div id={contentId} {...regionAttributes} className={`se-design-accordion-content transition-all duration-300 mt-1 ${contentClassName}`}>\n            {renderAccordionContents({ isOpen })}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["CustomAccordion","renderAccordionContents","renderAccordionSrcElement","defaultOpen","className","arrowPosition","contentClassName","disabled","automationId","id","ariaLabel","isOpen","setIsOpen","useState","useEffect","triggerId","useStableId","contentId","pressProps","role","tabIndex","useAccessiblePress","onClick","isNative","regionAttributes","getRegionAttributes","titleId","isFocusable","focusVisibleClasses","getArrowRotation","React","createElement","_extends","getA11yNameAttributes","Icon","name"],"mappings":";;;;;;;;;;;;;;;AAmBO,MAAMA,IAA4CA,CAAC;AAAA,EACxDC,yBAAAA;AAAAA,EACAC,2BAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,eAAAA,IAAgB;AAAA,EAChBC,kBAAAA,IAAmB;AAAA,EACnBC,UAAAA,IAAW;AAAA,EACXC,cAAAA,IAAe;AAAA,EACfC,IAAAA;AAAAA,EACAC,WAAAA;AACF,MAAM;AACJ,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK;AAC1CC,EAAAA,EAAU,MAAM;AACdF,IAAAA,EAAUT,KAAe,EAAK;AAAA,EAChC,GAAG,CAACA,CAAW,CAAC;AAGhB,QAAMY,IAAYC,EAAYP,GAAI,kBAAkB,GAC9CQ,IAAY,GAAGF,CAAS,YAGxB;AAAA,IAAEG,YAAAA;AAAAA,IAAYC,MAAAA;AAAAA,IAAMC,UAAAA;AAAAA,EAAAA,IAAaC,EAAmB;AAAA,IACxDC,SAASA,MAAMV,EAAU,CAACD,CAAM;AAAA,IAChCY,UAAU;AAAA,IACVhB,UAAAA;AAAAA,EAAAA,CACD,GAGKiB,IAAmBC,EAAoB;AAAA,IAC3CC,SAASX;AAAAA,IACTY,aAAa;AAAA,EAAA,CACd,GAEKC,IAAsB,kKAEtBC,IAAmBA,MACnBtB,IACK,KAELF,MAAkB,SACbM,IAAS,cAAc,KAEzBA,IAAS,eAAe;AAGjC,SACEmB,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAK3B,WAAW,uBAAuBA,CAAS;AAAA,IAAI,sBAAoBI;AAAAA,EAAAA,GACtEsB,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAK3B,WAAU;AAAA,EAAA,qBACb2B,cAAA,OAAAC,EAAA,CAAA,GACMd,GACAe,EAAsB;AAAA,IAAEvB,WAAAA;AAAAA,EAAAA,CAAW,GAAC;AAAA,IACxCS,MAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACA,iBAAeT;AAAAA,IACf,iBAAeM;AAAAA,IACfb,WAAU;AAAA,EAAA,CAA2F,GAErG0B,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAK3B,WAAW,oCAAoCwB,CAAmB;AAAA,EAAA,GACpEvB,MAAkB,UACjByB,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACE3B,WAAW,wEAAwEyB,EAAAA,CAAkB,IACnGtB,IAAW,mCAAmC,EAAE;AAAA,EAAA,GAGlDuB,gBAAAA,EAAAC,cAACG,GAAI;AAAA,IAACC,MAAK;AAAA,EAAA,CAAa,CACrB,GAEPL,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAK3B,WAAU;AAAA,EAAA,GACb0B,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKtB,IAAIM;AAAAA,IAAWX,WAAU;AAAA,EAAA,GAAyCF,EAA0B;AAAA,IAAES,QAAAA;AAAAA,EAAAA,CAAQ,CAAO,CAC/G,GACJN,MAAkB,WACjByB,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACE3B,WAAW,wEAAwEyB,EAAAA,CAAkB,IACnGtB,IAAW,mCAAmC,EAAE;AAAA,EAAA,GAGlDuB,gBAAAA,EAAAC,cAACG,GAAI;AAAA,IAACC,MAAK;AAAA,EAAA,CAAW,CACnB,CAEJ,CACF,GACJxB,KACCmB,gBAAAA,EAAAC,cAAA,OAAAC,EAAA;AAAA,IAAKvB,IAAIQ;AAAAA,EAAAA,GAAeO,GAAgB;AAAA,IAAEpB,WAAW,gEAAgEE,CAAgB;AAAA,EAAA,CAAG,GACrIL,EAAwB;AAAA,IAAEU,QAAAA;AAAAA,EAAAA,CAAQ,CAChC,CAEJ,CACF;AAET;"}
+{"version":3,"file":"index35.js","sources":["../src/components/CustomAccordion/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useState } from 'react';\nimport { Icon } from '../Icon';\nimport { useStableId } from '../../utils/useStableId';\nimport { useAccessiblePress, getA11yNameAttributes } from '../../utils/a11y';\nimport { getRegionAttributes } from '../../utils/a11y/regionAttributes';\n\nexport interface CustomAccordionProps {\n  renderAccordionContents: (props: { isOpen: boolean }) => React.ReactNode;\n  renderAccordionSrcElement: (props: { isOpen: boolean }) => React.ReactNode;\n  renderControls?: () => React.ReactNode;\n  defaultOpen?: boolean;\n  expanded?: boolean;\n  onChange?: (isOpen: boolean) => void;\n  className?: string;\n  arrowPosition?: 'left' | 'right';\n  contentClassName?: string;\n  disabled?: boolean;\n  automationId?: string;\n  id?: string;\n  ariaLabel?: string;\n}\n\nexport const CustomAccordion: FC<CustomAccordionProps> = ({\n  renderAccordionContents,\n  renderAccordionSrcElement,\n  renderControls,\n  defaultOpen,\n  expanded,\n  onChange,\n  className = '',\n  arrowPosition = 'left',\n  contentClassName = '',\n  disabled = false,\n  automationId = '',\n  id,\n  ariaLabel\n}) => {\n  const [isOpen, setIsOpen] = useState(false);\n  useEffect(() => {\n    setIsOpen(defaultOpen || false);\n  }, [defaultOpen]);\n\n  const isControlled = expanded !== undefined;\n  const open = isControlled ? expanded : isOpen;\n\n  const handleToggle = () => {\n    if (isControlled) {\n      onChange?.(!open);\n    } else {\n      setIsOpen(!open);\n    }\n  };\n\n  // Generate stable IDs for ARIA relationships\n  const triggerId = useStableId(id, 'custom-accordion');\n  const contentId = `${triggerId}-content`;\n\n  // Use accessible press hook for keyboard + mouse handling\n  const { pressProps, role, tabIndex } = useAccessiblePress({\n    onClick: handleToggle,\n    isNative: false,\n    disabled\n  });\n\n  // Get region attributes for content panel\n  const regionAttributes = getRegionAttributes({\n    titleId: triggerId,\n    isFocusable: false\n  });\n\n  const focusVisibleClasses = 'group-focus-visible:[outline:var(--focus-width)_solid_var(--focus-color)] group-focus-visible:[outline-offset:var(--focus-offset)] group-focus-visible:p-[2px]';\n\n  const getArrowRotation = () => {\n    if (disabled) {\n      return '';\n    }\n    if (arrowPosition === 'left') {\n      return open ? 'rotate-90' : '';\n    }\n    return open ? 'rotate-180' : '';\n  };\n\n  return (\n    <div className={`se-design-accordion ${className}`} data-automation-id={automationId}>\n      <div className=\"flex flex-col\">\n        <div className=\"se-design-accordion-src flex items-center\">\n          <div\n            {...pressProps}\n            {...getA11yNameAttributes({ ariaLabel })}\n            role={role}\n            tabIndex={tabIndex}\n            aria-expanded={open}\n            aria-controls={contentId}\n            className=\"flex items-center flex-1 cursor-pointer group focus-visible:outline-none\"\n          >\n            <div className={`flex items-center rounded ${focusVisibleClasses}`}>\n              {arrowPosition === 'left' && (\n                <div className={`se-design-accordion-icon transform transition-transform duration-300 ${getArrowRotation()} ${\n                  disabled ? 'opacity-30 pointer-events-none' : ''\n                }`}>\n                  <Icon name=\"rightSide\" />\n                </div>\n              )}\n              <div className=\"se-design-accordion-elements\">\n                <div id={triggerId} className=\"se-design-accordion-src-element title\">{renderAccordionSrcElement({ isOpen: open })}</div>\n              </div>\n              {arrowPosition === 'right' && (\n                <div className={`se-design-accordion-icon transform transition-transform duration-300 ${getArrowRotation()} ${\n                  disabled ? 'opacity-30 pointer-events-none' : ''\n                }`}>\n                  <Icon name=\"chevron\" />\n                </div>\n              )}\n            </div>\n          </div>\n          {renderControls?.()}\n        </div>\n        {open && (\n          <div id={contentId} {...regionAttributes} className={`se-design-accordion-content transition-all duration-300 mt-1 ${contentClassName}`}>\n            {renderAccordionContents({ isOpen: open })}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["CustomAccordion","renderAccordionContents","renderAccordionSrcElement","renderControls","defaultOpen","expanded","onChange","className","arrowPosition","contentClassName","disabled","automationId","id","ariaLabel","isOpen","setIsOpen","useState","useEffect","isControlled","undefined","open","handleToggle","triggerId","useStableId","contentId","pressProps","role","tabIndex","useAccessiblePress","onClick","isNative","regionAttributes","getRegionAttributes","titleId","isFocusable","focusVisibleClasses","getArrowRotation","React","createElement","_extends","getA11yNameAttributes","Icon","name"],"mappings":"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"}

package/dist/index37.js

@@ -3,8 +3,8 @@ import { Popover as ve } from "./index18.js";
 import { Icon as we } from "./index5.js";
 import { Checkbox as Ee } from "./index22.js";
 import { Button as G } from "./index3.js";
-import { useCombobox as ke } from "./index195.js";
-import { useStableId as be } from "./index189.js";
+import { useCombobox as ke } from "./index196.js";
+import { useStableId as be } from "./index190.js";
 /* empty css         */
 function g() {
   return g = Object.assign ? Object.assign.bind() : function(v) {

package/dist/index38.js

@@ -1,7 +1,7 @@
 import e from "react";
-import { useStableId as A } from "./index189.js";
-import { mergeIds as P } from "./index190.js";
-import { getA11yNameAttributes as _ } from "./index70.js";
+import { useStableId as A } from "./index190.js";
+import { mergeIds as P } from "./index191.js";
+import { getA11yNameAttributes as _ } from "./index71.js";
 /* empty css         */
 function z({
   value: l,