@cfx-dev/ui-components 4.2.16 → 4.2.18

package/dist/components/Accordion/Accordion.js

@@ -6,38 +6,38 @@ import { ui as I } from "../ui.js";
 import { clsx as w } from "../../utils/clsx.js";
 import { debounce as R } from "../../utils/execution.js";
 import { minmax as y } from "../../utils/math.js";
-const T = "cfxui__Accordion__triggerContainer__b92c1", k = "cfxui__Accordion__iconFlip__367de", D = "cfxui__Accordion__iconUp__28d27", E = "cfxui__Accordion__iconDown__b9e95", N = "cfxui__Accordion__text__03dc4", U = "cfxui__Accordion__iconLeft__e348b", $ = "cfxui__Accordion__iconRight__bbf0c", F = "cfxui__Accordion__content__5ecaf", L = "cfxui__Accordion__open__ed604", S = "cfxui__Accordion__contentText__1384b", W = "cfxui__Accordion__closed__be897", o = {
+const T = "cfxui__Accordion__triggerContainer__b92c1", k = "cfxui__Accordion__iconFlip__367de", D = "cfxui__Accordion__iconUp__28d27", E = "cfxui__Accordion__iconDown__b9e95", N = "cfxui__Accordion__text__03dc4", U = "cfxui__Accordion__iconLeft__e348b", F = "cfxui__Accordion__iconRight__bbf0c", $ = "cfxui__Accordion__content__5ecaf", L = "cfxui__Accordion__open__ed604", S = "cfxui__Accordion__contentText__1384b", W = "cfxui__Accordion__closed__be897", o = {
   triggerContainer: T,
   iconFlip: k,
   iconUp: D,
   iconDown: E,
   text: N,
   iconLeft: U,
-  iconRight: $,
-  content: F,
+  iconRight: F,
+  content: $,
   open: L,
   contentText: S,
   closed: W,
   "content-text-closing": "cfxui__Accordion__content-text-closing__163e4"
-}, g = e.createContext(void 0), q = function(i) {
+}, p = e.createContext(void 0), q = function(i) {
   const {
     children: t,
     className: s
-  } = i, [n, r] = e.useState({}), [d, l] = e.useState(null), a = e.useRef(null), u = e.useCallback((p) => {
+  } = i, [n, r] = e.useState({}), [d, l] = e.useState(null), u = e.useRef(null), a = e.useCallback((g) => {
     r((m) => ({
       ...m,
-      [p]: !m[p]
+      [g]: !m[g]
     }));
   }, []), _ = e.useMemo(() => ({
     openItems: n,
-    toggleItem: u,
+    toggleItem: a,
     rootWidth: d
-  }), [n, u, d]), f = e.useCallback(() => {
-    a.current && l(a.current.getBoundingClientRect().width);
+  }), [n, a, d]), f = e.useCallback(() => {
+    u.current && l(u.current.getBoundingClientRect().width);
   }, []), x = e.useMemo(() => R(f, 250), [f]);
   return e.useEffect(() => (window.addEventListener("resize", x), () => {
     window.removeEventListener("resize", x);
-  }), [x]), /* @__PURE__ */ c(g.Provider, { value: _, children: /* @__PURE__ */ c("div", { ref: a, className: s, role: "presentation", children: t }) });
+  }), [x]), /* @__PURE__ */ c(p.Provider, { value: _, children: /* @__PURE__ */ c("div", { ref: u, className: s, role: "presentation", children: t }) });
 }, C = e.createContext(""), V = function({
   children: i
 }) {
@@ -51,28 +51,28 @@ const T = "cfxui__Accordion__triggerContainer__b92c1", k = "cfxui__Accordion__ic
   text: i,
   iconLeft: t
 }) {
-  const s = e.useContext(g), n = e.useContext(C);
+  const s = e.useContext(p), n = e.useContext(C);
   if (!s)
     throw new Error("AccordionTrigger must be used within an Accordion");
   const {
     toggleItem: r,
     openItems: d
-  } = s, l = d[n], [a, u] = e.useState(!1), [_, f] = e.useState(l ? "UpChevron" : "DownChevron"), x = e.useCallback(() => {
+  } = s, l = d[n], [u, a] = e.useState(!1), [_, f] = e.useState(l ? "UpChevron" : "DownChevron"), x = e.useCallback(() => {
     r(n);
-  }, [n, r]), p = e.useCallback((m) => {
+  }, [n, r]), g = e.useCallback((m) => {
     (m.key === "Enter" || m.key === " ") && r(n);
   }, [n, r]);
   return e.useEffect(() => {
     const m = setTimeout(() => {
-      f(l ? "UpChevron" : "DownChevron"), u(!1);
+      f(l ? "UpChevron" : "DownChevron"), a(!1);
     }, 300);
-    return u(!0), () => clearTimeout(m);
+    return a(!0), () => clearTimeout(m);
   }, [l]), /* @__PURE__ */ v(
     "div",
     {
       className: o.triggerContainer,
       onClick: x,
-      onKeyDown: p,
+      onKeyDown: g,
       role: "button",
       tabIndex: 0,
       "aria-expanded": l,
@@ -85,7 +85,7 @@ const T = "cfxui__Accordion__triggerContainer__b92c1", k = "cfxui__Accordion__ic
           A,
           {
             className: w(o.iconRight, {
-              [o.iconFlip]: a,
+              [o.iconFlip]: u,
               [o.iconUp]: _ === "UpChevron",
               [o.iconDown]: _ === "DownChevron"
             }),
@@ -98,16 +98,16 @@ const T = "cfxui__Accordion__triggerContainer__b92c1", k = "cfxui__Accordion__ic
 }, Q = function({
   children: i
 }) {
-  const t = e.useContext(g), s = e.useContext(C), [n, r] = e.useState(null), d = e.useRef(null);
+  const t = e.useContext(p), s = e.useContext(C), [n, r] = e.useState(null), d = e.useRef(null);
   if (!t)
     throw new Error("AccordionContent must be used within an Accordion");
   const {
     openItems: l,
-    rootWidth: a
-  } = t, u = l[s], _ = e.useMemo(() => n === null ? 250 : y(n / 150 * 250, 250, 500), [n]);
+    rootWidth: u
+  } = t, a = l[s], _ = e.useMemo(() => n === null ? 250 : y(n / 150 * 250, 350, 500), [n]);
   return e.useEffect(() => {
     r(null);
-  }, [a]), e.useEffect(() => {
+  }, [u]), e.useEffect(() => {
     if (n === null && d.current) {
       const f = d.current.getBoundingClientRect().height;
       r(f);
@@ -119,12 +119,12 @@ const T = "cfxui__Accordion__triggerContainer__b92c1", k = "cfxui__Accordion__ic
       role: "region",
       "aria-labelledby": `${s}-header`,
       className: w(o.content, {
-        [o.open]: u,
-        [o.closed]: !u
+        [o.open]: a,
+        [o.closed]: !a
       }),
       style: {
-        "--content-display": n === null ? "inline-block" : "none",
-        "--content-height": n === null ? I.q(30) : `${n}px`,
+        "--content-display": "inline-block",
+        "--content-height": I.q(100),
         "--content-animation-time": `${_}ms`
       },
       children: /* @__PURE__ */ c(