@solibo/solibo-ui 1.0.15 → 1.0.17

package/dist/components/card/index.js

@@ -1,55 +1,55 @@
-import { jsxs as d, jsx as n } from "react/jsx-runtime";
-import { t as s } from "../../classix-DG18itHa.js";
-import { Badge as v } from "../badge/index.js";
-import { Checkbox as N } from "../checkbox/index.js";
+import { jsxs as d, jsx as t } from "react/jsx-runtime";
+import { t as p } from "../../classix-DG18itHa.js";
+import { Badge as w } from "../badge/index.js";
+import { Checkbox as v } from "../checkbox/index.js";
 import { Figure as f } from "../figure/index.js";
-import { Icon as h } from "../icon/index.js";
-import '../../assets/index30.css';const y = "_card_1nm90_1", j = "_head_1nm90_28", D = "_center_1nm90_40", E = "_content_1nm90_52", I = "_preview_1nm90_58", T = "_margin_1nm90_98", $ = "_clickable_1nm90_143", k = "_muted_1nm90_158", z = "_selected_1nm90_163", e = {
-  card: y,
-  head: j,
-  center: D,
-  content: E,
-  preview: I,
-  "preview-leading": "_preview-leading_1nm90_69",
-  "preview-trailing": "_preview-trailing_1nm90_70",
-  "preview-content": "_preview-content_1nm90_90",
-  margin: T,
-  clickable: $,
-  muted: k,
-  selected: z,
-  "image-top": "_image-top_1nm90_168",
-  "image-left": "_image-left_1nm90_179"
+import { Icon as N } from "../icon/index.js";
+import '../../assets/index30.css';const h = "_card_133qp_1", y = "_head_133qp_28", j = "_center_133qp_40", D = "_content_133qp_52", E = "_preview_133qp_58", I = "_margin_133qp_98", T = "_clickable_133qp_143", $ = "_muted_133qp_158", k = "_selected_133qp_163", e = {
+  card: h,
+  head: y,
+  center: j,
+  content: D,
+  preview: E,
+  "preview-leading": "_preview-leading_133qp_69",
+  "preview-trailing": "_preview-trailing_133qp_70",
+  "preview-content": "_preview-content_133qp_90",
+  margin: I,
+  clickable: T,
+  muted: $,
+  selected: k,
+  "image-top": "_image-top_133qp_168",
+  "image-left": "_image-left_133qp_179"
 }, G = ({
-  actions: w,
-  badge: o,
-  checkbox: r,
-  children: p,
+  actions: q,
+  badge: _,
+  checkbox: a,
+  children: o,
   emphasis: g = "default",
-  header: _,
+  header: s,
   icon: u,
-  image: a,
-  imagePosition: i = "top",
-  onClick: c,
-  preview: l,
-  variant: m = "default"
-}) => /* @__PURE__ */ d("article", { className: s(e.card, g === "muted" && e.muted, c && e.clickable, (r == null ? void 0 : r.checked) && e.selected), "data-emphasis": g, "data-minimal": m === "minimal", onClick: c, onKeyDown: (t) => {
-  c && t.currentTarget === document.activeElement && (t.key === "Enter" || t.key === " ") && (t.preventDefault(), t.currentTarget.click());
-}, tabIndex: c ? 0 : -1, "data-component": "card", children: [
-  a && m !== "minimal" && i === "top" && /* @__PURE__ */ n(f, { className: e[`image-${i}`], children: a }),
+  image: i,
+  imagePosition: c = "top",
+  onClick: l,
+  preview: m,
+  variant: r = "default"
+}) => /* @__PURE__ */ d("article", { className: p(e.card, g === "muted" && e.muted, l && e.clickable, (a == null ? void 0 : a.checked) && e.selected), "data-emphasis": g, "data-minimal": r === "minimal", onClick: l, onKeyDown: (n) => {
+  l && n.currentTarget === document.activeElement && (n.key === "Enter" || n.key === " ") && (n.preventDefault(), n.currentTarget.click());
+}, tabIndex: l ? 0 : -1, "data-component": "card", children: [
+  i && r !== "minimal" && c === "top" && /* @__PURE__ */ t(f, { className: e[`image-${c}`], children: i }),
   /* @__PURE__ */ d("section", { children: [
-    /* @__PURE__ */ d("div", { className: s(e.head, m === "minimal" && e.center), children: [
-      r && /* @__PURE__ */ n("span", { onClick: (t) => t.stopPropagation(), children: /* @__PURE__ */ n(N, { ...r }) }),
-      a && m !== "minimal" && i === "left" && /* @__PURE__ */ n(f, { className: e[`image-${i}`], children: a }),
-      _,
-      o && /* @__PURE__ */ n(v, { ...o }),
-      u && /* @__PURE__ */ n(h, { name: u, size: "medium" }),
-      w
+    /* @__PURE__ */ d("div", { className: p(e.head, r === "minimal" && e.center), children: [
+      a && /* @__PURE__ */ t("span", { onClick: (n) => n.stopPropagation(), children: /* @__PURE__ */ t(v, { ...a }) }),
+      i && r !== "minimal" && c === "left" && /* @__PURE__ */ t(f, { className: e[`image-${c}`], children: i }),
+      s,
+      _ && /* @__PURE__ */ t(w, { ..._ }),
+      u && /* @__PURE__ */ t(N, { name: u, size: "medium" }),
+      q
     ] }),
-    p && m !== "minimal" && /* @__PURE__ */ n("div", { className: s(e.content, !!_ && e.margin), children: p }),
-    l && m !== "minimal" && /* @__PURE__ */ d("div", { className: s(e.preview, !!_ && e.margin), children: [
-      /* @__PURE__ */ n("span", { className: e["preview-leading"], children: l.leading }),
-      /* @__PURE__ */ n("span", { className: e["preview-content"], children: l.children }),
-      /* @__PURE__ */ n("span", { className: e["preview-trailing"], children: l.trailing })
+    o && r !== "minimal" && /* @__PURE__ */ t("div", { className: p(e.content, !!s && e.margin), children: o }),
+    m && r !== "minimal" && /* @__PURE__ */ d("div", { className: p(e.preview, !!s && e.margin), children: [
+      /* @__PURE__ */ t("span", { className: e["preview-leading"], children: m.leading }),
+      /* @__PURE__ */ t("span", { className: e["preview-content"], children: m.children }),
+      /* @__PURE__ */ t("span", { className: e["preview-trailing"], children: m.trailing })
     ] })
   ] })
 ] });

package/dist/components/checkbox/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index31.css');const e=require("react/jsx-runtime"),x=require("../../icons-DaZGJzI0.cjs"),b=require("../loading/index.cjs"),h="_checkbox_1glqu_3",u={checkbox:h},k=({checked:s,disabled:t,isLoading:c,label:o,onChange:n,...i})=>{const r={"--icon-svg":x.iconSVG("check")};return e.jsxs("label",{className:u.checkbox,"data-component":"checkbox",children:[e.jsx("input",{checked:s,disabled:t||c,onChange:n,type:"checkbox",style:r,...i}),c&&e.jsx(b.Loading,{size:16,sticky:!0}),o&&o]})};exports.Checkbox=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index31.css');const e=require("react/jsx-runtime"),x=require("../../icons-Lq3pr85X.cjs"),b=require("../loading/index.cjs"),h="_checkbox_fv4yk_3",k={checkbox:h},u=({checked:s,disabled:t,isLoading:c,label:o,onChange:n,...i})=>{const r={"--icon-svg":x.iconSVG("check")};return e.jsxs("label",{className:k.checkbox,"data-component":"checkbox",children:[e.jsx("input",{checked:s,disabled:t||c,onChange:n,type:"checkbox",style:r,...i}),c&&e.jsx(b.Loading,{size:16,sticky:!0}),o&&o]})};exports.Checkbox=u;
 //# sourceMappingURL=index.cjs.map

package/dist/components/checkbox/index.js

@@ -1,9 +1,9 @@
 import { jsxs as h, jsx as e } from "react/jsx-runtime";
-import { i as x } from "../../icons-Dj0vEOCB.js";
-import { Loading as k } from "../loading/index.js";
-import '../../assets/index31.css';const b = "_checkbox_1glqu_3", m = {
+import { i as k } from "../../icons-BkaMeh-J.js";
+import { Loading as x } from "../loading/index.js";
+import '../../assets/index31.css';const b = "_checkbox_fv4yk_3", m = {
   checkbox: b
-}, d = ({
+}, y = ({
   checked: t,
   disabled: s,
   isLoading: c,
@@ -12,15 +12,15 @@ import '../../assets/index31.css';const b = "_checkbox_1glqu_3", m = {
   ...i
 }) => {
   const n = {
-    "--icon-svg": x("check")
+    "--icon-svg": k("check")
   };
   return /* @__PURE__ */ h("label", { className: m.checkbox, "data-component": "checkbox", children: [
     /* @__PURE__ */ e("input", { checked: t, disabled: s || c, onChange: r, type: "checkbox", style: n, ...i }),
-    c && /* @__PURE__ */ e(k, { size: 16, sticky: !0 }),
+    c && /* @__PURE__ */ e(x, { size: 16, sticky: !0 }),
     o && o
   ] });
 };
 export {
-  d as Checkbox
+  y as Checkbox
 };
 //# sourceMappingURL=index.js.map

package/dist/components/collapsible/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index33.css');const t=require("react/jsx-runtime"),p=require("../icon/index.cjs"),u="_collapsible_471bm_6",b="_content_471bm_17",y="_indicator_471bm_21",s={collapsible:u,content:b,indicator:y};let e;const _=({children:c,disabled:i,open:r,summary:d})=>{const m=l=>{const n=l.currentTarget.closest("details");if(!n||!document.startViewTransition)return;l.preventDefault(),e==null||e.details.style.removeProperty("view-transition-name"),n.style.viewTransitionName="details-expand";const o=document.startViewTransition(()=>n.open=!n.open);e={details:n,transition:o},o.ready.catch(()=>{});const a=()=>{(e==null?void 0:e.transition)===o&&(n.style.removeProperty("view-transition-name"),e=void 0)};o.finished.then(a,a)};return t.jsxs("details",{className:s.collapsible,open:i||r||void 0,"data-component":"collapsible",children:[t.jsxs("summary",{onClick:m,children:[t.jsx("span",{className:s.content,"data-content":"collapsible-summary",children:d}),!i&&t.jsx("span",{className:s.indicator,"data-content":"collapsible-indicator",children:t.jsx(p.Icon,{name:"chevron",size:"small"})})]}),c]})};exports.Collapsible=_;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index33.css');const e=require("react/jsx-runtime"),t=require("../icon/index.cjs"),i="_collapsible_vloyq_6",a="_content_vloyq_17",r="_indicator_vloyq_21",n={collapsible:i,content:a,indicator:r},d=({children:l,disabled:o,open:s,summary:c})=>e.jsxs("details",{className:n.collapsible,open:o||s||void 0,"data-component":"collapsible",children:[e.jsxs("summary",{children:[e.jsx("span",{className:n.content,"data-content":"collapsible-summary",children:c}),!o&&e.jsx("span",{className:n.indicator,"data-content":"collapsible-indicator",children:e.jsx(t.Icon,{name:"chevron",size:"medium"})})]}),l]});exports.Collapsible=d;
 //# sourceMappingURL=index.cjs.map

package/dist/components/collapsible/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/collapsible/index.tsx"],"sourcesContent":["import type { MouseEventHandler, ReactNode } from 'react';\n\nimport { Icon } from '@/components/icon';\n\nimport styles from './styles.module.css';\n\nexport type CollapsibleProps = {\n  children: ReactNode;\n  disabled?: boolean;\n  open?: boolean;\n  summary: ReactNode;\n};\n\nlet activeTransition:\n  | { details: HTMLDetailsElement; transition: ViewTransition }\n  | undefined;\n\nexport const Collapsible = ({ children, disabled, open, summary }: CollapsibleProps) => {\n  const handleSummaryClick: MouseEventHandler<HTMLElement> = (event) => {\n    const details = event.currentTarget.closest('details') as HTMLDetailsElement | null;\n    if (!details || !document.startViewTransition) return;\n\n    event.preventDefault();\n\n    activeTransition?.details.style.removeProperty('view-transition-name');\n    details.style.viewTransitionName = 'details-expand';\n\n    const transition = document.startViewTransition(() => (details.open = !details.open));\n    activeTransition = { details, transition };\n\n    void transition.ready.catch(() => undefined);\n    const cleanupTransition = () => {\n      if (activeTransition?.transition !== transition) return;\n\n      details.style.removeProperty('view-transition-name');\n      activeTransition = undefined;\n    };\n    void transition.finished.then(cleanupTransition, cleanupTransition);\n  };\n\n  return (\n    <details\n      className={styles.collapsible}\n      open={disabled || open || undefined}\n    >\n      <summary onClick={handleSummaryClick}>\n        <span\n          className={styles.content}\n          data-content='collapsible-summary'\n        >\n          {summary}\n        </span>\n        {!disabled && (\n          <span\n            className={styles.indicator}\n            data-content='collapsible-indicator'\n          >\n            <Icon\n              name='chevron'\n              size='small'\n            />\n          </span>\n        )}\n      </summary>\n\n      {children}\n    </details>\n  );\n};\n"],"names":["activeTransition","Collapsible","children","disabled","open","summary","handleSummaryClick","event","details","currentTarget","closest","document","startViewTransition","preventDefault","style","removeProperty","viewTransitionName","transition","ready","catch","cleanupTransition","undefined","finished","then","jsxs","styles","collapsible","jsx","content","indicator","Icon"],"mappings":"mQAaA,IAAIA,EAIG,MAAMC,EAAcA,CAAC,CAAEC,SAAAA,EAAUC,SAAAA,EAAUC,KAAAA,EAAMC,QAAAA,CAA0B,IAAM,CACtF,MAAMC,EAAsDC,GAAU,CACpE,MAAMC,EAAUD,EAAME,cAAcC,QAAQ,SAAS,EACrD,GAAI,CAACF,GAAW,CAACG,SAASC,oBAAqB,OAE/CL,EAAMM,eAAAA,EAENb,GAAAA,MAAAA,EAAkBQ,QAAQM,MAAMC,eAAe,wBAC/CP,EAAQM,MAAME,mBAAqB,iBAEnC,MAAMC,EAAaN,SAASC,oBAAoB,IAAOJ,EAAQJ,KAAO,CAACI,EAAQJ,IAAK,EACpFJ,EAAmB,CAAEQ,QAAAA,EAASS,WAAAA,CAAAA,EAEzBA,EAAWC,MAAMC,MAAM,IAAA,EAAe,EAC3C,MAAMC,EAAoBA,IAAM,EAC1BpB,GAAAA,YAAAA,EAAkBiB,cAAeA,IAErCT,EAAQM,MAAMC,eAAe,sBAAsB,EACnDf,EAAmBqB,OACrB,EACKJ,EAAWK,SAASC,KAAKH,EAAmBA,CAAiB,CACpE,EAEA,OACEI,EAAAA,KAAC,UAAA,CACC,UAAWC,EAAOC,YAClB,KAAMvB,GAAYC,GAAQiB,OAAU,iBAAA,cAEpC,SAAA,CAAAG,EAAAA,KAAC,UAAA,CAAQ,QAASlB,EAChB,SAAA,CAAAqB,MAAC,QACC,UAAWF,EAAOG,QAClB,eAAa,sBAEZvB,SAAAA,EACH,EACC,CAACF,GACAwB,EAAAA,IAAC,OAAA,CACC,UAAWF,EAAOI,UAClB,eAAa,wBAEb,eAACC,EAAAA,KAAA,CACC,KAAK,UACL,KAAK,QAAO,CAAA,CAEhB,CAAA,EAEJ,EAEC5B,CAAAA,EACH,CAEJ"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/collapsible/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Icon } from '@/components/icon';\n\nimport styles from './styles.module.css';\n\nexport type CollapsibleProps = {\n  children: ReactNode;\n  disabled?: boolean;\n  open?: boolean;\n  summary: ReactNode;\n};\n\nexport const Collapsible = ({ children, disabled, open, summary }: CollapsibleProps) => {\n  return (\n    <details\n      className={styles.collapsible}\n      open={disabled || open || undefined}\n    >\n      <summary>\n        <span\n          className={styles.content}\n          data-content='collapsible-summary'\n        >\n          {summary}\n        </span>\n        {!disabled && (\n          <span\n            className={styles.indicator}\n            data-content='collapsible-indicator'\n          >\n            <Icon\n              name='chevron'\n              size='medium'\n            />\n          </span>\n        )}\n      </summary>\n\n      {children}\n    </details>\n  );\n};\n"],"names":["Collapsible","children","disabled","open","summary","jsxs","styles","collapsible","undefined","jsx","content","indicator","Icon"],"mappings":"mQAaaA,EAAcA,CAAC,CAAEC,SAAAA,EAAUC,SAAAA,EAAUC,KAAAA,EAAMC,QAAAA,CAA0B,IAE9EC,EAAAA,KAAC,UAAA,CACC,UAAWC,EAAOC,YAClB,KAAML,GAAYC,GAAQK,OAAU,iBAAA,cAEpC,SAAA,CAAAH,OAAC,UAAA,CACC,SAAA,CAAAI,MAAC,QACC,UAAWH,EAAOI,QAClB,eAAa,sBAEZN,SAAAA,EACH,EACC,CAACF,GACAO,EAAAA,IAAC,OAAA,CACC,UAAWH,EAAOK,UAClB,eAAa,wBAEb,eAACC,EAAAA,KAAA,CACC,KAAK,UACL,KAAK,SAAQ,CAAA,CAEjB,CAAA,EAEJ,EAECX,CAAAA,EACH"}

package/dist/components/collapsible/index.js

@@ -1,41 +1,22 @@
 import { jsxs as c, jsx as o } from "react/jsx-runtime";
-import { Icon as u } from "../icon/index.js";
-import '../../assets/index33.css';const b = "_collapsible_471bm_6", y = "_content_471bm_17", h = "_indicator_471bm_21", i = {
-  collapsible: b,
-  content: y,
-  indicator: h
-};
-let t;
-const f = ({
-  children: r,
-  disabled: s,
-  open: d,
-  summary: m
-}) => {
-  const p = (a) => {
-    const e = a.currentTarget.closest("details");
-    if (!e || !document.startViewTransition) return;
-    a.preventDefault(), t == null || t.details.style.removeProperty("view-transition-name"), e.style.viewTransitionName = "details-expand";
-    const n = document.startViewTransition(() => e.open = !e.open);
-    t = {
-      details: e,
-      transition: n
-    }, n.ready.catch(() => {
-    });
-    const l = () => {
-      (t == null ? void 0 : t.transition) === n && (e.style.removeProperty("view-transition-name"), t = void 0);
-    };
-    n.finished.then(l, l);
-  };
-  return /* @__PURE__ */ c("details", { className: i.collapsible, open: s || d || void 0, "data-component": "collapsible", children: [
-    /* @__PURE__ */ c("summary", { onClick: p, children: [
-      /* @__PURE__ */ o("span", { className: i.content, "data-content": "collapsible-summary", children: m }),
-      !s && /* @__PURE__ */ o("span", { className: i.indicator, "data-content": "collapsible-indicator", children: /* @__PURE__ */ o(u, { name: "chevron", size: "small" }) })
-    ] }),
-    r
-  ] });
-};
+import { Icon as s } from "../icon/index.js";
+import '../../assets/index33.css';const i = "_collapsible_vloyq_6", r = "_content_vloyq_17", m = "_indicator_vloyq_21", l = {
+  collapsible: i,
+  content: r,
+  indicator: m
+}, _ = ({
+  children: t,
+  disabled: n,
+  open: a,
+  summary: e
+}) => /* @__PURE__ */ c("details", { className: l.collapsible, open: n || a || void 0, "data-component": "collapsible", children: [
+  /* @__PURE__ */ c("summary", { children: [
+    /* @__PURE__ */ o("span", { className: l.content, "data-content": "collapsible-summary", children: e }),
+    !n && /* @__PURE__ */ o("span", { className: l.indicator, "data-content": "collapsible-indicator", children: /* @__PURE__ */ o(s, { name: "chevron", size: "medium" }) })
+  ] }),
+  t
+] });
 export {
-  f as Collapsible
+  _ as Collapsible
 };
 //# sourceMappingURL=index.js.map

package/dist/components/collapsible/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/collapsible/index.tsx"],"sourcesContent":["import type { MouseEventHandler, ReactNode } from 'react';\n\nimport { Icon } from '@/components/icon';\n\nimport styles from './styles.module.css';\n\nexport type CollapsibleProps = {\n  children: ReactNode;\n  disabled?: boolean;\n  open?: boolean;\n  summary: ReactNode;\n};\n\nlet activeTransition:\n  | { details: HTMLDetailsElement; transition: ViewTransition }\n  | undefined;\n\nexport const Collapsible = ({ children, disabled, open, summary }: CollapsibleProps) => {\n  const handleSummaryClick: MouseEventHandler<HTMLElement> = (event) => {\n    const details = event.currentTarget.closest('details') as HTMLDetailsElement | null;\n    if (!details || !document.startViewTransition) return;\n\n    event.preventDefault();\n\n    activeTransition?.details.style.removeProperty('view-transition-name');\n    details.style.viewTransitionName = 'details-expand';\n\n    const transition = document.startViewTransition(() => (details.open = !details.open));\n    activeTransition = { details, transition };\n\n    void transition.ready.catch(() => undefined);\n    const cleanupTransition = () => {\n      if (activeTransition?.transition !== transition) return;\n\n      details.style.removeProperty('view-transition-name');\n      activeTransition = undefined;\n    };\n    void transition.finished.then(cleanupTransition, cleanupTransition);\n  };\n\n  return (\n    <details\n      className={styles.collapsible}\n      open={disabled || open || undefined}\n    >\n      <summary onClick={handleSummaryClick}>\n        <span\n          className={styles.content}\n          data-content='collapsible-summary'\n        >\n          {summary}\n        </span>\n        {!disabled && (\n          <span\n            className={styles.indicator}\n            data-content='collapsible-indicator'\n          >\n            <Icon\n              name='chevron'\n              size='small'\n            />\n          </span>\n        )}\n      </summary>\n\n      {children}\n    </details>\n  );\n};\n"],"names":["activeTransition","Collapsible","children","disabled","open","summary","handleSummaryClick","event","details","currentTarget","closest","document","startViewTransition","preventDefault","style","removeProperty","viewTransitionName","transition","ready","catch","cleanupTransition","undefined","finished","then","jsxs","styles","collapsible","jsx","content","indicator","Icon"],"mappings":";;;;;;;AAaA,IAAIA;AAIG,MAAMC,IAAcA,CAAC;AAAA,EAAEC,UAAAA;AAAAA,EAAUC,UAAAA;AAAAA,EAAUC,MAAAA;AAAAA,EAAMC,SAAAA;AAA0B,MAAM;AACtF,QAAMC,IAAsDC,CAAAA,MAAU;AACpE,UAAMC,IAAUD,EAAME,cAAcC,QAAQ,SAAS;AACrD,QAAI,CAACF,KAAW,CAACG,SAASC,oBAAqB;AAE/CL,IAAAA,EAAMM,eAAAA,GAENb,KAAAA,QAAAA,EAAkBQ,QAAQM,MAAMC,eAAe,yBAC/CP,EAAQM,MAAME,qBAAqB;AAEnC,UAAMC,IAAaN,SAASC,oBAAoB,MAAOJ,EAAQJ,OAAO,CAACI,EAAQJ,IAAK;AACpFJ,IAAAA,IAAmB;AAAA,MAAEQ,SAAAA;AAAAA,MAASS,YAAAA;AAAAA,IAAAA,GAEzBA,EAAWC,MAAMC,MAAM,MAAA;AAAA,KAAe;AAC3C,UAAMC,IAAoBA,MAAM;AAC9B,OAAIpB,KAAAA,gBAAAA,EAAkBiB,gBAAeA,MAErCT,EAAQM,MAAMC,eAAe,sBAAsB,GACnDf,IAAmBqB;AAAAA,IACrB;AACA,IAAKJ,EAAWK,SAASC,KAAKH,GAAmBA,CAAiB;AAAA,EACpE;AAEA,SACE,gBAAAI,EAAC,WAAA,EACC,WAAWC,EAAOC,aAClB,MAAMvB,KAAYC,KAAQiB,QAAU,kBAAA,eAEpC,UAAA;AAAA,IAAA,gBAAAG,EAAC,WAAA,EAAQ,SAASlB,GAChB,UAAA;AAAA,MAAA,gBAAAqB,EAAC,UACC,WAAWF,EAAOG,SAClB,gBAAa,uBAEZvB,UAAAA,GACH;AAAA,MACC,CAACF,KACA,gBAAAwB,EAAC,QAAA,EACC,WAAWF,EAAOI,WAClB,gBAAa,yBAEb,4BAACC,GAAA,EACC,MAAK,WACL,MAAK,SAAO,EAAA,CAEhB;AAAA,IAAA,GAEJ;AAAA,IAEC5B;AAAAA,EAAAA,GACH;AAEJ;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/collapsible/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Icon } from '@/components/icon';\n\nimport styles from './styles.module.css';\n\nexport type CollapsibleProps = {\n  children: ReactNode;\n  disabled?: boolean;\n  open?: boolean;\n  summary: ReactNode;\n};\n\nexport const Collapsible = ({ children, disabled, open, summary }: CollapsibleProps) => {\n  return (\n    <details\n      className={styles.collapsible}\n      open={disabled || open || undefined}\n    >\n      <summary>\n        <span\n          className={styles.content}\n          data-content='collapsible-summary'\n        >\n          {summary}\n        </span>\n        {!disabled && (\n          <span\n            className={styles.indicator}\n            data-content='collapsible-indicator'\n          >\n            <Icon\n              name='chevron'\n              size='medium'\n            />\n          </span>\n        )}\n      </summary>\n\n      {children}\n    </details>\n  );\n};\n"],"names":["Collapsible","children","disabled","open","summary","jsxs","styles","collapsible","undefined","jsx","content","indicator","Icon"],"mappings":";;;;;;GAaaA,IAAcA,CAAC;AAAA,EAAEC,UAAAA;AAAAA,EAAUC,UAAAA;AAAAA,EAAUC,MAAAA;AAAAA,EAAMC,SAAAA;AAA0B,MAE9E,gBAAAC,EAAC,WAAA,EACC,WAAWC,EAAOC,aAClB,MAAML,KAAYC,KAAQK,QAAU,kBAAA,eAEpC,UAAA;AAAA,EAAA,gBAAAH,EAAC,WAAA,EACC,UAAA;AAAA,IAAA,gBAAAI,EAAC,UACC,WAAWH,EAAOI,SAClB,gBAAa,uBAEZN,UAAAA,GACH;AAAA,IACC,CAACF,KACA,gBAAAO,EAAC,QAAA,EACC,WAAWH,EAAOK,WAClB,gBAAa,yBAEb,4BAACC,GAAA,EACC,MAAK,WACL,MAAK,UAAQ,EAAA,CAEjB;AAAA,EAAA,GAEJ;AAAA,EAECX;AAAAA,GACH;"}

package/dist/components/controls/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index34.css');const l=require("react/jsx-runtime"),G=require("../../classix-5H4IWnMA.cjs"),i=require("react"),H=require("../button/index.cjs"),W=require("../../menu-popover-jTTxzTGZ.cjs"),J="_controls_awevz_13",K="_inline_awevz_43",Q="_fixed_awevz_48",U="_measurement_awevz_68",X="_adaptive_awevz_93",d={controls:J,default:"_default_awevz_28",inline:K,fixed:Q,measurement:U,"non-button-content":"_non-button-content_awevz_79",adaptive:X,"overflow-trigger":"_overflow-trigger_awevz_114"},Y={primary:3,danger:2,secondary:1,tertiary:0,simple:0},Z={default:d.default,fixed:d.fixed,inline:d.inline},ee=o=>Y[o.props.variant??"secondary"];function te({buttons:o,menuAccessibleLabel:p,triggerAccessibleLabel:m}){const v=o.map(r=>({button:r,isDanger:r.props.variant==="danger",value:r}));return l.jsx(W.MenuPopover,{triggerAccessibleLabel:m,"data-component":"overflowmenu",children:({close:r,initialFocus:y})=>l.jsx(W.MenuActionList,{actions:v,initialFocus:y,menuAccessibleLabel:p,onSelect:()=>r(),usesMenuSemantics:!0})})}const _=(o,p)=>{const m=Number.parseFloat(String(o[p]));return Number.isFinite(m)?m:0},ne=({children:o,className:p,overflow:m,overflowAccessibleLabel:v="More actions",variant:r="default",...y})=>{const B=i.Children.toArray(o),E=[],b=[];B.forEach(e=>{i.isValidElement(e)&&e.type===H.Button?E.push(e):b.push(e)});const s=E.map((e,n)=>({button:e,index:n,rank:ee(e)})).sort((e,n)=>e.rank-n.rank||e.index-n.index).map(({button:e,index:n})=>i.cloneElement(e,{key:e.key??n})),a=r==="fixed"&&m==="menu",f=i.useRef(null),k=i.useRef(null),x=i.useRef(null),[j,R]=i.useState(0),c=i.useCallback(()=>{var V,A,F;if(!a){R(0);return}const e=f.current,n=k.current;if(!e||!n)return;const h=Array.from(n.querySelectorAll('[data-component="button"]')),g=h.at(-1);if(!g)return;const u=h.slice(0,s.length).map(t=>t.getBoundingClientRect().width);if(u.length!==s.length)return;const w=getComputedStyle(e),O=_(w,"paddingLeft")+_(w,"paddingRight")+_(w,"borderLeftWidth")+_(w,"borderRightWidth"),P=Number.parseFloat(w.maxWidth),D=((V=e.parentElement)==null?void 0:V.clientWidth)??0,I=((A=window.visualViewport)==null?void 0:A.width)??document.documentElement.clientWidth,M=Math.min(...[P,D,I].filter(t=>Number.isFinite(t)&&t>0));if(!Number.isFinite(M))return;const S=Math.max(0,M-O),L=((F=x.current)==null?void 0:F.getBoundingClientRect().width)??0,T=u.reduce((t,$)=>t+$,0);if(L+T<=S){R(t=>t===0?t:0);return}let N=L+g.getBoundingClientRect().width,z=s.length;for(let t=u.length-1;t>=0&&!(N+u[t]>S);t-=1)N+=u[t],z=t;R(t=>t===z?t:z)},[a,s.length]);if(i.useLayoutEffect(()=>{var n,h,g;if(c(),!a)return;const e=typeof ResizeObserver>"u"?void 0:new ResizeObserver(c);return f.current&&(e==null||e.observe(f.current)),(n=f.current)!=null&&n.parentElement&&(e==null||e.observe(f.current.parentElement)),x.current&&(e==null||e.observe(x.current)),window.addEventListener("resize",c),(h=window.visualViewport)==null||h.addEventListener("resize",c),(g=document.fonts)==null||g.ready.then(c),()=>{var u;e==null||e.disconnect(),window.removeEventListener("resize",c),(u=window.visualViewport)==null||u.removeEventListener("resize",c)}},[a,o,c]),B.length===0)return null;const C=a?s.slice(0,j):[],q=a?s.slice(j):s;return l.jsxs("div",{"data-dynamic-position":r==="fixed"?!0:void 0,className:G.t(d.controls,Z[r],a&&d.adaptive,p),ref:f,...y,"data-component":"controls",children:[a&&l.jsxs("div",{"aria-hidden":"true",className:d.measurement,ref:k,children:[s.map((e,n)=>i.cloneElement(e,{"aria-hidden":!0,id:void 0,key:`measure-${String(e.key??n)}`,onClick:void 0,ref:void 0,tabIndex:-1})),l.jsx(W.MenuPopover,{triggerAccessibleLabel:v,children:null})]}),b.length>0&&l.jsx("span",{className:d["non-button-content"],ref:x,children:b}),q,C.length>0&&l.jsx("span",{className:d["overflow-trigger"],children:l.jsx(te,{buttons:C,menuAccessibleLabel:v,triggerAccessibleLabel:v})})]})};exports.Controls=ne;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index34.css');const b=require("react/jsx-runtime"),U=require("../../classix-5H4IWnMA.cjs"),m=require("react"),X=require("../button/index.cjs"),S=require("../../menu-popover-D1ALaiV5.cjs"),Y="_controls_1bkuq_13",Z="_inline_1bkuq_43",ee="_embedded_1bkuq_48",te="_fixed_1bkuq_49",ne="_adaptive_1bkuq_60",ie="_measurement_1bkuq_65",h={controls:Y,default:"_default_1bkuq_28",inline:Z,embedded:ee,fixed:te,adaptive:ne,measurement:ie,"non-button-content":"_non-button-content_1bkuq_99","overflow-trigger":"_overflow-trigger_1bkuq_128"},re={primary:3,danger:2,secondary:1,tertiary:0,simple:0},oe={default:h.default,embedded:h.embedded,fixed:h.fixed,inline:h.inline},se=s=>re[s.props.variant??"secondary"];function de({buttons:s,menuAccessibleLabel:i,triggerAccessibleLabel:n}){const x=s.map(o=>({button:o,isDanger:o.props.variant==="danger",value:o}));return b.jsx(S.MenuPopover,{triggerAccessibleLabel:n,"data-component":"overflowmenu",children:({close:o,initialFocus:r})=>b.jsx(S.MenuActionList,{actions:x,initialFocus:r,menuAccessibleLabel:i,onSelect:()=>o(),usesMenuSemantics:!0})})}const g=(s,i)=>{const n=Number.parseFloat(String(s[i]));return Number.isFinite(n)?n:0},ce=s=>{if(!s.trim().endsWith("px"))return;const i=Number.parseFloat(s);return Number.isFinite(i)?i:void 0},le=(s,i)=>{const n=s.parentElement;if(!n)return;const x=n.getBoundingClientRect(),o=getComputedStyle(n),r=x.width||n.clientWidth,B=x.left+g(o,"borderLeftWidth")+g(o,"paddingLeft"),E=x.left+r-g(o,"borderRightWidth")-g(o,"paddingRight"),_=Array.from(n.children).slice(0,Array.from(n.children).indexOf(s)),R=_.reduce((f,a)=>Math.max(f,a.getBoundingClientRect().right),B),c=_.length>0?g(o,"columnGap"):0,l=Math.max(0,E-R-c),W=(i==null?void 0:i.parent)===n?Math.max(0,r-i.parentWidth):0;return{availableWidth:W>0?Math.max(l,((i==null?void 0:i.availableWidth)??0)+W):l,parent:n,parentWidth:r}},ae=({children:s,className:i,maxVisibleButtons:n,overflow:x,overflowAccessibleLabel:o="More actions",variant:r="default",...B})=>{const E=m.Children.toArray(s),_=[],R=[];E.forEach(e=>{m.isValidElement(e)&&e.type===X.Button?_.push(e):R.push(e)});const c=_.map((e,d)=>({button:e,index:d,rank:se(e)})).sort((e,d)=>e.rank-d.rank||e.index-d.index).map(({button:e,index:d})=>m.cloneElement(e,{key:e.key??d})),l=r==="embedded"||r==="fixed"&&x==="menu",W=typeof n=="number"&&Number.isFinite(n)?Math.floor(n):0,f=r==="embedded"&&W>0?Math.min(c.length,W):c.length,a=m.useRef(null),A=m.useRef(void 0),N=m.useRef(null),M=m.useRef(null),[j,C]=m.useState(f),p=m.useCallback(()=>{var L,I,T;if(!l){C(f);return}const e=a.current,d=N.current;if(!e||!d)return;const w=Array.from(d.querySelectorAll('[data-component="button"]')),y=w.at(-1);if(!y)return;const v=w.slice(0,c.length).map(t=>t.getBoundingClientRect().width);if(v.length!==c.length)return;const u=getComputedStyle(e),G=g(u,"paddingLeft")+g(u,"paddingRight")+g(u,"borderLeftWidth")+g(u,"borderRightWidth"),$=ce(u.maxWidth),k=r==="embedded"?le(e,A.current):void 0;k&&(A.current=k);const H=(k==null?void 0:k.availableWidth)??((L=e.parentElement)==null?void 0:L.clientWidth)??0,J=((I=window.visualViewport)==null?void 0:I.width)??document.documentElement.clientWidth,F=Math.min(...[$,H,J].filter(t=>typeof t=="number"&&Number.isFinite(t)&&t>0));if(!Number.isFinite(F))return;const O=Math.max(0,F-G),V=((T=M.current)==null?void 0:T.getBoundingClientRect().width)??0,K=v.reduce((t,Q)=>t+Q,0);if(f===c.length&&V+K<=O){C(t=>t===f?t:f);return}let P=V+y.getBoundingClientRect().width,q=0;for(let t=0;t<f&&!(P+v[t]>O);t+=1)P+=v[t],q=t+1;C(t=>t===q?t:q)},[l,c.length,r,f]);if(m.useLayoutEffect(()=>{var d,w,y,v;if(p(),!l)return;const e=typeof ResizeObserver>"u"?void 0:new ResizeObserver(p);return a.current&&(e==null||e.observe(a.current)),(d=a.current)!=null&&d.parentElement&&(e==null||e.observe(a.current.parentElement)),r==="embedded"&&((w=a.current)!=null&&w.parentElement)&&Array.from(a.current.parentElement.children).forEach(u=>{u!==a.current&&(e==null||e.observe(u))}),M.current&&(e==null||e.observe(M.current)),window.addEventListener("resize",p),(y=window.visualViewport)==null||y.addEventListener("resize",p),(v=document.fonts)==null||v.ready.then(p),()=>{var u;e==null||e.disconnect(),window.removeEventListener("resize",p),(u=window.visualViewport)==null||u.removeEventListener("resize",p)}},[l,s,p,r]),E.length===0)return null;const D=l?c.slice(0,j):c,z=l?c.slice(j):[];return b.jsxs("div",{"data-component":"controls","data-dynamic-position":r==="fixed"?!0:void 0,className:U.t(h.controls,oe[r],l&&h.adaptive,i),ref:a,...B,children:[l&&b.jsxs("div",{"aria-hidden":"true",className:h.measurement,ref:N,children:[c.map((e,d)=>m.cloneElement(e,{"aria-hidden":!0,id:void 0,key:`measure-${String(e.key??d)}`,onClick:void 0,ref:void 0,tabIndex:-1})),b.jsx(S.MenuPopover,{triggerAccessibleLabel:o,children:null})]}),r!=="embedded"&&R.length>0&&b.jsx("span",{className:h["non-button-content"],ref:M,children:R}),D,z.length>0&&b.jsx("span",{className:h["overflow-trigger"],children:b.jsx(de,{buttons:z,menuAccessibleLabel:o,triggerAccessibleLabel:o})})]})};exports.Controls=ae;
 //# sourceMappingURL=index.cjs.map

package/dist/components/controls/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  Children,\n  cloneElement,\n  isValidElement,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport { type MenuAction, MenuActionList } from '../menu/action-list';\nimport { MenuPopover } from '../menu/menu-popover';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n  primary: 3,\n  danger: 2,\n  secondary: 1,\n  tertiary: 0,\n  simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n  default: styles.default,\n  fixed: styles.fixed,\n  inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n  children?: React.ReactNode;\n  overflow?: 'menu';\n  overflowAccessibleLabel?: string;\n  variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n  buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nfunction OverflowMenu({\n  buttons,\n  menuAccessibleLabel,\n  triggerAccessibleLabel,\n}: {\n  buttons: React.ReactElement<ButtonProps>[];\n  menuAccessibleLabel: string;\n  triggerAccessibleLabel: string;\n}) {\n  const actions: MenuAction<React.ReactElement<ButtonProps>>[] = buttons.map((button) => ({\n    button,\n    isDanger: button.props.variant === 'danger',\n    value: button,\n  }));\n\n  return (\n    <MenuPopover triggerAccessibleLabel={triggerAccessibleLabel}>\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={() => close()}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n}\n\nconst numericStyle = (style: CSSStyleDeclaration, property: keyof CSSStyleDeclaration) => {\n  const value = Number.parseFloat(String(style[property]));\n  return Number.isFinite(value) ? value : 0;\n};\n\nexport const Controls = ({\n  children,\n  className,\n  overflow,\n  overflowAccessibleLabel = 'More actions',\n  variant = 'default',\n  ...props\n}: ControlsProps) => {\n  const childArray = Children.toArray(children);\n  const buttons: React.ReactElement<ButtonProps>[] = [];\n  const nonButtons: React.ReactNode[] = [];\n\n  childArray.forEach((child) => {\n    if (isValidElement<ButtonProps>(child) && child.type === Button) {\n      buttons.push(child);\n    } else {\n      nonButtons.push(child);\n    }\n  });\n\n  const sortedButtons = buttons\n    .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n    .sort((a, b) => a.rank - b.rank || a.index - b.index)\n    .map(({ button, index }) =>\n      cloneElement(button, {\n        key: button.key ?? index,\n      })\n    );\n\n  const adaptive = variant === 'fixed' && overflow === 'menu';\n  const controlsRef = useRef<HTMLDivElement>(null);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const nonButtonsRef = useRef<HTMLSpanElement>(null);\n  const [firstVisibleButton, setFirstVisibleButton] = useState(0);\n\n  const updateOverflow = useCallback(() => {\n    if (!adaptive) {\n      setFirstVisibleButton(0);\n      return;\n    }\n\n    const controls = controlsRef.current;\n    const measurement = measurementRef.current;\n    if (!controls || !measurement) return;\n\n    const measurementButtons = Array.from(\n      measurement.querySelectorAll<HTMLElement>('[data-component=\"button\"]')\n    );\n    const trigger = measurementButtons.at(-1);\n    if (!trigger) return;\n\n    const buttonWidths = measurementButtons\n      .slice(0, sortedButtons.length)\n      .map((button) => button.getBoundingClientRect().width);\n    if (buttonWidths.length !== sortedButtons.length) return;\n\n    const style = getComputedStyle(controls);\n    const horizontalChrome =\n      numericStyle(style, 'paddingLeft') +\n      numericStyle(style, 'paddingRight') +\n      numericStyle(style, 'borderLeftWidth') +\n      numericStyle(style, 'borderRightWidth');\n    const configuredMaxWidth = Number.parseFloat(style.maxWidth);\n    const parentWidth = controls.parentElement?.clientWidth ?? 0;\n    const viewportWidth = window.visualViewport?.width ?? document.documentElement.clientWidth;\n    const outerAvailableWidth = Math.min(\n      ...[configuredMaxWidth, parentWidth, viewportWidth].filter(\n        (width) => Number.isFinite(width) && width > 0\n      )\n    );\n    if (!Number.isFinite(outerAvailableWidth)) return;\n\n    const availableWidth = Math.max(0, outerAvailableWidth - horizontalChrome);\n    const prefixWidth = nonButtonsRef.current?.getBoundingClientRect().width ?? 0;\n    const actionWidth = buttonWidths.reduce((total, width) => total + width, 0);\n\n    if (prefixWidth + actionWidth <= availableWidth) {\n      setFirstVisibleButton((current) => (current === 0 ? current : 0));\n      return;\n    }\n\n    let usedWidth = prefixWidth + trigger.getBoundingClientRect().width;\n    let nextFirstVisible = sortedButtons.length;\n    for (let index = buttonWidths.length - 1; index >= 0; index -= 1) {\n      if (usedWidth + buttonWidths[index] > availableWidth) break;\n      usedWidth += buttonWidths[index];\n      nextFirstVisible = index;\n    }\n\n    setFirstVisibleButton((current) =>\n      current === nextFirstVisible ? current : nextFirstVisible\n    );\n  }, [adaptive, sortedButtons.length]);\n\n  useLayoutEffect(() => {\n    updateOverflow();\n\n    if (!adaptive) return undefined;\n\n    const observer =\n      typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(updateOverflow);\n    if (controlsRef.current) observer?.observe(controlsRef.current);\n    if (controlsRef.current?.parentElement) observer?.observe(controlsRef.current.parentElement);\n    if (nonButtonsRef.current) observer?.observe(nonButtonsRef.current);\n\n    window.addEventListener('resize', updateOverflow);\n    window.visualViewport?.addEventListener('resize', updateOverflow);\n    void document.fonts?.ready.then(updateOverflow);\n\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener('resize', updateOverflow);\n      window.visualViewport?.removeEventListener('resize', updateOverflow);\n    };\n  }, [adaptive, children, updateOverflow]);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  const overflowedButtons = adaptive ? sortedButtons.slice(0, firstVisibleButton) : [];\n  const visibleButtons = adaptive ? sortedButtons.slice(firstVisibleButton) : sortedButtons;\n\n  return (\n    <div\n      data-dynamic-position={variant === 'fixed' ? true : undefined}\n      className={cx(styles.controls, variants[variant], adaptive && styles.adaptive, className)}\n      ref={controlsRef}\n      {...props}\n    >\n      {adaptive && (\n        <div\n          aria-hidden='true'\n          className={styles.measurement}\n          ref={measurementRef}\n        >\n          {sortedButtons.map((button, index) =>\n            cloneElement(button, {\n              'aria-hidden': true,\n              id: undefined,\n              key: `measure-${String(button.key ?? index)}`,\n              onClick: undefined,\n              ref: undefined,\n              tabIndex: -1,\n            })\n          )}\n          <MenuPopover triggerAccessibleLabel={overflowAccessibleLabel}>{null}</MenuPopover>\n        </div>\n      )}\n      {nonButtons.length > 0 && (\n        <span\n          className={styles['non-button-content']}\n          ref={nonButtonsRef}\n        >\n          {nonButtons}\n        </span>\n      )}\n      {visibleButtons}\n      {overflowedButtons.length > 0 && (\n        <span className={styles['overflow-trigger']}>\n          <OverflowMenu\n            buttons={overflowedButtons}\n            menuAccessibleLabel={overflowAccessibleLabel}\n            triggerAccessibleLabel={overflowAccessibleLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n};\n"],"names":["buttonVariantOrder","primary","danger","secondary","tertiary","simple","variants","default","styles","fixed","inline","getButtonRank","button","props","variant","OverflowMenu","buttons","menuAccessibleLabel","triggerAccessibleLabel","actions","map","isDanger","value","jsx","MenuPopover","close","initialFocus","MenuActionList","numericStyle","style","property","Number","parseFloat","String","isFinite","Controls","children","className","overflow","overflowAccessibleLabel","childArray","Children","toArray","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","index","rank","sort","a","b","cloneElement","key","adaptive","controlsRef","useRef","measurementRef","nonButtonsRef","firstVisibleButton","setFirstVisibleButton","useState","updateOverflow","useCallback","controls","current","measurement","measurementButtons","Array","from","querySelectorAll","trigger","at","buttonWidths","slice","length","getBoundingClientRect","width","getComputedStyle","horizontalChrome","configuredMaxWidth","maxWidth","parentWidth","parentElement","clientWidth","viewportWidth","window","visualViewport","document","documentElement","outerAvailableWidth","Math","min","filter","availableWidth","max","prefixWidth","actionWidth","reduce","total","usedWidth","nextFirstVisible","useLayoutEffect","observer","ResizeObserver","undefined","observe","addEventListener","fonts","ready","then","disconnect","removeEventListener","overflowedButtons","visibleButtons","jsxs","cx","id","onClick","ref","tabIndex"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  Children,\n  cloneElement,\n  isValidElement,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport { type MenuAction, MenuActionList } from '../menu/action-list';\nimport { MenuPopover } from '../menu/menu-popover';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n  primary: 3,\n  danger: 2,\n  secondary: 1,\n  tertiary: 0,\n  simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n  default: styles.default,\n  embedded: styles.embedded,\n  fixed: styles.fixed,\n  inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n  children?: React.ReactNode;\n  maxVisibleButtons?: number;\n  overflow?: 'menu';\n  overflowAccessibleLabel?: string;\n  variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n  buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nfunction OverflowMenu({\n  buttons,\n  menuAccessibleLabel,\n  triggerAccessibleLabel,\n}: {\n  buttons: React.ReactElement<ButtonProps>[];\n  menuAccessibleLabel: string;\n  triggerAccessibleLabel: string;\n}) {\n  const actions: MenuAction<React.ReactElement<ButtonProps>>[] = buttons.map((button) => ({\n    button,\n    isDanger: button.props.variant === 'danger',\n    value: button,\n  }));\n\n  return (\n    <MenuPopover triggerAccessibleLabel={triggerAccessibleLabel}>\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={() => close()}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n}\n\nconst numericStyle = (style: CSSStyleDeclaration, property: keyof CSSStyleDeclaration) => {\n  const value = Number.parseFloat(String(style[property]));\n  return Number.isFinite(value) ? value : 0;\n};\n\nconst pixelStyle = (value: string) => {\n  if (!value.trim().endsWith('px')) return undefined;\n  const parsedValue = Number.parseFloat(value);\n  return Number.isFinite(parsedValue) ? parsedValue : undefined;\n};\n\ntype EmbeddedLayout = {\n  availableWidth: number;\n  parent: HTMLElement;\n  parentWidth: number;\n};\n\nconst availableWidthToRight = (\n  controls: HTMLDivElement,\n  previousLayout?: EmbeddedLayout\n): EmbeddedLayout | undefined => {\n  const parent = controls.parentElement;\n  if (!parent) return undefined;\n\n  const parentRect = parent.getBoundingClientRect();\n  const parentStyle = getComputedStyle(parent);\n  const parentWidth = parentRect.width || parent.clientWidth;\n  const contentLeft =\n    parentRect.left +\n    numericStyle(parentStyle, 'borderLeftWidth') +\n    numericStyle(parentStyle, 'paddingLeft');\n  const contentRight =\n    parentRect.left +\n    parentWidth -\n    numericStyle(parentStyle, 'borderRightWidth') -\n    numericStyle(parentStyle, 'paddingRight');\n  const precedingSiblings = Array.from(parent.children).slice(\n    0,\n    Array.from(parent.children).indexOf(controls)\n  );\n  const occupiedRight = precedingSiblings.reduce(\n    (right, sibling) => Math.max(right, sibling.getBoundingClientRect().right),\n    contentLeft\n  );\n  const gap = precedingSiblings.length > 0 ? numericStyle(parentStyle, 'columnGap') : 0;\n\n  const measuredAvailableWidth = Math.max(0, contentRight - occupiedRight - gap);\n  const parentWidthIncrease =\n    previousLayout?.parent === parent ? Math.max(0, parentWidth - previousLayout.parentWidth) : 0;\n\n  return {\n    availableWidth:\n      parentWidthIncrease > 0\n        ? Math.max(\n            measuredAvailableWidth,\n            (previousLayout?.availableWidth ?? 0) + parentWidthIncrease\n          )\n        : measuredAvailableWidth,\n    parent,\n    parentWidth,\n  };\n};\n\nexport const Controls = ({\n  children,\n  className,\n  maxVisibleButtons,\n  overflow,\n  overflowAccessibleLabel = 'More actions',\n  variant = 'default',\n  ...props\n}: ControlsProps) => {\n  const childArray = Children.toArray(children);\n  const buttons: React.ReactElement<ButtonProps>[] = [];\n  const nonButtons: React.ReactNode[] = [];\n\n  childArray.forEach((child) => {\n    if (isValidElement<ButtonProps>(child) && child.type === Button) {\n      buttons.push(child);\n    } else {\n      nonButtons.push(child);\n    }\n  });\n\n  const sortedButtons = buttons\n    .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n    .sort((a, b) => a.rank - b.rank || a.index - b.index)\n    .map(({ button, index }) =>\n      cloneElement(button, {\n        key: button.key ?? index,\n      })\n    );\n\n  const adaptive = variant === 'embedded' || (variant === 'fixed' && overflow === 'menu');\n  const normalizedMaxVisibleButtons =\n    typeof maxVisibleButtons === 'number' && Number.isFinite(maxVisibleButtons)\n      ? Math.floor(maxVisibleButtons)\n      : 0;\n  const visibleButtonLimit =\n    variant === 'embedded' && normalizedMaxVisibleButtons > 0\n      ? Math.min(sortedButtons.length, normalizedMaxVisibleButtons)\n      : sortedButtons.length;\n  const controlsRef = useRef<HTMLDivElement>(null);\n  const embeddedLayoutRef = useRef<EmbeddedLayout>(undefined);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const nonButtonsRef = useRef<HTMLSpanElement>(null);\n  const [visibleButtonCount, setVisibleButtonCount] = useState(visibleButtonLimit);\n\n  const updateOverflow = useCallback(() => {\n    if (!adaptive) {\n      setVisibleButtonCount(visibleButtonLimit);\n      return;\n    }\n\n    const controls = controlsRef.current;\n    const measurement = measurementRef.current;\n    if (!controls || !measurement) return;\n\n    const measurementButtons = Array.from(\n      measurement.querySelectorAll<HTMLElement>('[data-component=\"button\"]')\n    );\n    const trigger = measurementButtons.at(-1);\n    if (!trigger) return;\n\n    const buttonWidths = measurementButtons\n      .slice(0, sortedButtons.length)\n      .map((button) => button.getBoundingClientRect().width);\n    if (buttonWidths.length !== sortedButtons.length) return;\n\n    const style = getComputedStyle(controls);\n    const horizontalChrome =\n      numericStyle(style, 'paddingLeft') +\n      numericStyle(style, 'paddingRight') +\n      numericStyle(style, 'borderLeftWidth') +\n      numericStyle(style, 'borderRightWidth');\n    const configuredMaxWidth = pixelStyle(style.maxWidth);\n    const embeddedLayout =\n      variant === 'embedded'\n        ? availableWidthToRight(controls, embeddedLayoutRef.current)\n        : undefined;\n    if (embeddedLayout) embeddedLayoutRef.current = embeddedLayout;\n    const layoutWidth = embeddedLayout?.availableWidth ?? controls.parentElement?.clientWidth ?? 0;\n    const viewportWidth = window.visualViewport?.width ?? document.documentElement.clientWidth;\n    const outerAvailableWidth = Math.min(\n      ...[configuredMaxWidth, layoutWidth, viewportWidth].filter(\n        (width): width is number => typeof width === 'number' && Number.isFinite(width) && width > 0\n      )\n    );\n    if (!Number.isFinite(outerAvailableWidth)) return;\n\n    const availableWidth = Math.max(0, outerAvailableWidth - horizontalChrome);\n    const prefixWidth = nonButtonsRef.current?.getBoundingClientRect().width ?? 0;\n    const actionWidth = buttonWidths.reduce((total, width) => total + width, 0);\n\n    if (\n      visibleButtonLimit === sortedButtons.length &&\n      prefixWidth + actionWidth <= availableWidth\n    ) {\n      setVisibleButtonCount((current) =>\n        current === visibleButtonLimit ? current : visibleButtonLimit\n      );\n      return;\n    }\n\n    let usedWidth = prefixWidth + trigger.getBoundingClientRect().width;\n    let nextVisibleButtonCount = 0;\n    for (let index = 0; index < visibleButtonLimit; index += 1) {\n      if (usedWidth + buttonWidths[index] > availableWidth) break;\n      usedWidth += buttonWidths[index];\n      nextVisibleButtonCount = index + 1;\n    }\n\n    setVisibleButtonCount((current) =>\n      current === nextVisibleButtonCount ? current : nextVisibleButtonCount\n    );\n  }, [adaptive, sortedButtons.length, variant, visibleButtonLimit]);\n\n  useLayoutEffect(() => {\n    updateOverflow();\n\n    if (!adaptive) return undefined;\n\n    const observer =\n      typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(updateOverflow);\n    if (controlsRef.current) observer?.observe(controlsRef.current);\n    if (controlsRef.current?.parentElement) observer?.observe(controlsRef.current.parentElement);\n    if (variant === 'embedded' && controlsRef.current?.parentElement) {\n      Array.from(controlsRef.current.parentElement.children).forEach((sibling) => {\n        if (sibling !== controlsRef.current) observer?.observe(sibling);\n      });\n    }\n    if (nonButtonsRef.current) observer?.observe(nonButtonsRef.current);\n\n    window.addEventListener('resize', updateOverflow);\n    window.visualViewport?.addEventListener('resize', updateOverflow);\n    void document.fonts?.ready.then(updateOverflow);\n\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener('resize', updateOverflow);\n      window.visualViewport?.removeEventListener('resize', updateOverflow);\n    };\n  }, [adaptive, children, updateOverflow, variant]);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  const visibleButtons = adaptive ? sortedButtons.slice(0, visibleButtonCount) : sortedButtons;\n  const overflowedButtons = adaptive ? sortedButtons.slice(visibleButtonCount) : [];\n\n  return (\n    <div\n      data-component='controls'\n      data-dynamic-position={variant === 'fixed' ? true : undefined}\n      className={cx(styles.controls, variants[variant], adaptive && styles.adaptive, className)}\n      ref={controlsRef}\n      {...props}\n    >\n      {adaptive && (\n        <div\n          aria-hidden='true'\n          className={styles.measurement}\n          ref={measurementRef}\n        >\n          {sortedButtons.map((button, index) =>\n            cloneElement(button, {\n              'aria-hidden': true,\n              id: undefined,\n              key: `measure-${String(button.key ?? index)}`,\n              onClick: undefined,\n              ref: undefined,\n              tabIndex: -1,\n            })\n          )}\n          <MenuPopover triggerAccessibleLabel={overflowAccessibleLabel}>{null}</MenuPopover>\n        </div>\n      )}\n      {variant !== 'embedded' && nonButtons.length > 0 && (\n        <span\n          className={styles['non-button-content']}\n          ref={nonButtonsRef}\n        >\n          {nonButtons}\n        </span>\n      )}\n      {visibleButtons}\n      {overflowedButtons.length > 0 && (\n        <span className={styles['overflow-trigger']}>\n          <OverflowMenu\n            buttons={overflowedButtons}\n            menuAccessibleLabel={overflowAccessibleLabel}\n            triggerAccessibleLabel={overflowAccessibleLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n};\n"],"names":["buttonVariantOrder","primary","danger","secondary","tertiary","simple","variants","default","styles","embedded","fixed","inline","getButtonRank","button","props","variant","OverflowMenu","buttons","menuAccessibleLabel","triggerAccessibleLabel","actions","map","isDanger","value","jsx","MenuPopover","close","initialFocus","MenuActionList","numericStyle","style","property","Number","parseFloat","String","isFinite","pixelStyle","trim","endsWith","parsedValue","undefined","availableWidthToRight","controls","previousLayout","parent","parentElement","parentRect","getBoundingClientRect","parentStyle","getComputedStyle","parentWidth","width","clientWidth","contentLeft","left","contentRight","precedingSiblings","Array","from","children","slice","indexOf","occupiedRight","reduce","right","sibling","Math","max","gap","length","measuredAvailableWidth","parentWidthIncrease","availableWidth","Controls","className","maxVisibleButtons","overflow","overflowAccessibleLabel","childArray","Children","toArray","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","index","rank","sort","a","b","cloneElement","key","adaptive","normalizedMaxVisibleButtons","floor","visibleButtonLimit","min","controlsRef","useRef","embeddedLayoutRef","measurementRef","nonButtonsRef","visibleButtonCount","setVisibleButtonCount","useState","updateOverflow","useCallback","current","measurement","measurementButtons","querySelectorAll","trigger","at","buttonWidths","horizontalChrome","configuredMaxWidth","maxWidth","embeddedLayout","layoutWidth","viewportWidth","window","visualViewport","document","documentElement","outerAvailableWidth","filter","prefixWidth","actionWidth","total","usedWidth","nextVisibleButtonCount","useLayoutEffect","observer","ResizeObserver","observe","addEventListener","fonts","ready","then","disconnect","removeEventListener","visibleButtons","overflowedButtons","jsxs","cx","id","onClick","ref","tabIndex"],"mappings":"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"}