fiboui 2.4.4 → 2.6.0

package/dist/index-MeDbhMEg.js

@@ -1,1031 +0,0 @@
-"use client";
-var le = Object.defineProperty;
-var ce = (n, t, e) => t in n ? le(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e;
-var i = (n, t, e) => ce(n, typeof t != "symbol" ? t + "" : t, e);
-import s, { useState as X, useRef as L, useLayoutEffect as Z, useEffect as de } from "react";
-import { D as w, E as I, Q as T, T as q } from "./builder-B5cebEWZ.js";
-import { B as $ } from "./index-orKQGpHl.js";
-import { t as me } from "./bundle-mjs-wppB-TKB.js";
-import { T as he } from "./index-DbaNIwWW.js";
-const ue = s.memo((n) => {
-  const { text: t, subtitle: e, number: r, color: d, className: p, style: c, children: u, ...g } = n;
-  return s.createElement(
-    "div",
-    {
-      className: `rounded-[24px] shadow-[0_8px_30px_rgb(0,0,0,0.04)] hover:shadow-[0_8px_30px_rgb(0,0,0,0.08)] transition-shadow duration-300 border-none p-4 ${p || ""}`,
-      style: { backgroundColor: "#ffffff", ...c },
-      ...g
-    },
-    s.createElement(
-      "div",
-      { className: "flex flex-col gap-2" },
-      t && s.createElement(
-        "h3",
-        {
-          className: "font-semibold text-[var(--fibo-on-surface-variant)] text-sm uppercase tracking-wide"
-        },
-        t
-      ),
-      r && s.createElement(
-        "p",
-        {
-          className: "font-bold text-[var(--fibo-on-surface)] text-3xl"
-        },
-        r
-      ),
-      e && s.createElement(
-        "p",
-        {
-          className: "text-[var(--fibo-on-surface-variant)] text-xs"
-        },
-        e
-      ),
-      ...u
-    )
-  );
-});
-class pe extends I {
-  constructor() {
-    super(...arguments);
-    i(this, "_text", "");
-    i(this, "_subtitle");
-    i(this, "_number");
-    i(this, "_color");
-  }
-  text(e) {
-    return this._text = e, this;
-  }
-  subtitle(e) {
-    return this._subtitle = e, this;
-  }
-  number(e) {
-    return this._number = e, this;
-  }
-  color(e) {
-    return this._color = e, this;
-  }
-  build() {
-    const e = {
-      green: "border-l-green-500",
-      orange: "border-l-orange-500",
-      red: "border-l-red-500",
-      blue: "border-l-blue-500",
-      purple: "border-l-purple-500"
-    }, r = [
-      "fibo-card",
-      this._color ? `border-l-4 ${e[this._color]}` : "",
-      ...this._classNames
-    ].filter(Boolean).join(" "), d = {
-      text: this._text,
-      subtitle: this._subtitle,
-      number: this._number,
-      color: this._color,
-      className: r,
-      style: this.getStyle(),
-      children: this.processChildren(),
-      ...this._props
-    };
-    return s.createElement(ue, d);
-  }
-}
-const Me = w(pe);
-class V {
-  constructor() {
-    i(this, "styles", /* @__PURE__ */ new Map());
-  }
-  bg(t) {
-    return this.styles.set("background-color", t), this;
-  }
-  color(t) {
-    return this.styles.set("color", t), this;
-  }
-  opacity(t) {
-    return this.styles.set("opacity", String(t)), this;
-  }
-  borderColor(t) {
-    return this.styles.set("border-color", t), this;
-  }
-  transform(t) {
-    return this.styles.set("transform", t), this;
-  }
-  scale(t) {
-    return this.styles.set("transform", `scale(${t})`), this;
-  }
-  translateX(t) {
-    const e = typeof t == "number" ? `${t}px` : t;
-    return this.styles.set("transform", `translateX(${e})`), this;
-  }
-  translateY(t) {
-    const e = typeof t == "number" ? `${t}px` : t;
-    return this.styles.set("transform", `translateY(${e})`), this;
-  }
-  shadow(t) {
-    return this.styles.set("box-shadow", t), this;
-  }
-  css(t, e) {
-    return this.styles.set(t, e), this;
-  }
-  toCSSString() {
-    const t = [];
-    return this.styles.forEach((e, r) => {
-      t.push(`${r}: ${e}`);
-    }), t.join("; ") + ";";
-  }
-}
-const fe = 100, J = 60, ee = 5;
-function D(n) {
-  return n.split(";").map((t) => t.trim()).filter(Boolean).map((t) => /\s!important\s*$/i.test(t) ? t : `${t} !important`).join("; ");
-}
-const ge = s.memo((n) => {
-  const {
-    items: t,
-    renderItem: e,
-    variant: r,
-    separator: d,
-    loading: p,
-    threshold: c,
-    onEndReached: u,
-    className: g,
-    style: x,
-    containerHeight: v = 500,
-    resetItemStyles: m = !1,
-    direction: a = "vertical",
-    customItemHover: o,
-    customItemActive: _,
-    customItemFocus: y
-  } = n, [H, te] = X(0), [se, re] = X(0), ie = L(null), R = L(/* @__PURE__ */ new Map()), O = L(/* @__PURE__ */ new Map()), F = L(null), b = a === "horizontal", C = t.length, B = C > fe, A = (h) => O.current.get(h) ?? J, j = (h) => {
-    let l = 0;
-    for (let f = 0; f < h; f++)
-      l += A(f);
-    return l;
-  }, ne = () => {
-    let h = 0;
-    for (let l = 0; l < C; l++)
-      h += A(l);
-    return h;
-  }, ae = (h) => {
-    let l = 0, f = C - 1;
-    for (; l < f; ) {
-      const N = Math.floor((l + f) / 2);
-      j(N) < h ? l = N + 1 : f = N;
-    }
-    return Math.max(0, l - 1);
-  };
-  let S = 0, Y = C, G = 0, M = 0;
-  if (B) {
-    S = Math.max(0, ae(H) - ee);
-    let h = j(S), l = S;
-    for (; h < H + v + ee * J && l < C; )
-      h += A(l), l++;
-    Y = Math.min(C, l), G = j(S), M = ne();
-  }
-  const P = t.slice(S, Y);
-  Z(() => {
-    if (!B) return;
-    let h = !1;
-    P.forEach((l, f) => {
-      const N = S + f, k = R.current.get(N);
-      if (k) {
-        const Q = k.getBoundingClientRect(), z = b ? Q.width : Q.height;
-        z > 0 && O.current.get(N) !== z && (O.current.set(N, z), h = !0);
-      }
-    }), h && re((l) => l + 1);
-  }, [P, S, B, b, se]), Z(() => {
-    if (!u || p) return;
-    const h = new IntersectionObserver(
-      (l) => {
-        l[0].isIntersecting && (u == null || u());
-      },
-      { threshold: c }
-    );
-    return F.current && h.observe(F.current), () => h.disconnect();
-  }, [p, t.length, u, c]);
-  const oe = (h) => {
-    B && te(b ? h.currentTarget.scrollLeft : h.currentTarget.scrollTop);
-  };
-  de(() => {
-    if (typeof document > "u" || !o && !_ && !y) return;
-    const h = "fibo-list-custom-styles";
-    let l = document.getElementById(h);
-    l || (l = document.createElement("style"), l.id = h, document.head.appendChild(l));
-    let f = "";
-    return o && (f += `.fibo-list-item-custom-hover:hover { ${D(o)} }
-`), _ && (f += `.fibo-list-item-custom-active:active { ${D(_)} }
-`), y && (f += `.fibo-list-item-custom-focus:focus { ${D(y)} }
-`), l.textContent = f, () => {
-    };
-  }, [o, _, y]);
-  const W = {
-    default: { gap: "0px" },
-    card: { gap: "12px" },
-    floating: { gap: "8px" }
-  }, U = m ? {
-    default: {},
-    card: {},
-    floating: {}
-  } : {
-    default: {
-      padding: "12px 16px",
-      borderBottom: d ? "1px solid #F3F4F6" : "none",
-      // Transparent via class, not inline — so Tailwind / itemHover bg can win.
-      transition: "background-color 0.2s ease-out"
-    },
-    card: {
-      padding: "16px",
-      backgroundColor: "#fff",
-      borderRadius: "16px",
-      boxShadow: "0 2px 8px -2px rgba(0,0,0,0.05)",
-      border: "1px solid #F3F4F6",
-      transform: "translate3d(0, 0, 0)",
-      transition: "transform 0.2s ease-out, box-shadow 0.2s ease-out"
-    },
-    floating: {
-      padding: "8px 12px",
-      borderRadius: "12px",
-      transition: "background-color 0.2s ease-out, box-shadow 0.2s ease-out"
-    }
-  }, E = [];
-  o && E.push("fibo-list-item-custom-hover"), _ && E.push("fibo-list-item-custom-active"), y && E.push("fibo-list-item-custom-focus");
-  const K = m ? {
-    default: [...E],
-    card: [...E],
-    floating: [...E]
-  } : {
-    default: ["hover:bg-gray-50", "first:rounded-t-xl", "last:rounded-b-xl", ...E],
-    card: ["hover:-translate-y-0.5", "hover:shadow-md", ...E],
-    floating: ["hover:bg-white", "hover:shadow-sm", ...E]
-  };
-  return B ? s.createElement(
-    "div",
-    {
-      ref: ie,
-      className: `fibo-list fibo-list-virtualized ${g || ""}`,
-      style: {
-        height: b ? void 0 : `${v}px`,
-        width: b ? `${v}px` : void 0,
-        overflowY: b ? "hidden" : "auto",
-        overflowX: b ? "auto" : "hidden",
-        position: "relative",
-        display: "flex",
-        flexDirection: b ? "row" : "column",
-        ...W[r],
-        ...x
-      },
-      onScroll: oe
-    },
-    s.createElement("div", {
-      style: {
-        height: b ? "1px" : `${M}px`,
-        width: b ? `${M}px` : "1px",
-        position: "absolute",
-        top: 0,
-        left: 0,
-        visibility: "hidden",
-        pointerEvents: "none"
-      }
-    }),
-    s.createElement(
-      "div",
-      {
-        style: {
-          transform: b ? `translateX(${G}px)` : `translateY(${G}px)`,
-          width: b ? "auto" : "100%",
-          height: b ? "100%" : void 0,
-          display: b ? "flex" : void 0,
-          flexDirection: b ? "row" : void 0
-        }
-      },
-      P.map((h, l) => {
-        const f = S + l, N = e ? e(h, f) : null;
-        return s.cloneElement(
-          $().style(U[r]).classNames(K[r]).children(N).build(),
-          {
-            key: `item-${f}`,
-            ref: (k) => {
-              k ? R.current.set(f, k) : R.current.delete(f);
-            }
-          }
-        );
-      })
-    ),
-    u && s.createElement("div", {
-      ref: F,
-      className: "py-4 flex justify-center w-full"
-    }, p ? s.createElement("div", { className: "animate-spin rounded-full h-5 w-5 border-2 border-gray-300 border-b-blue-600" }) : s.createElement("div", { style: { height: "20px" } }))
-  ) : $().className(g).classNames(["flex", a === "horizontal" ? "flex-row" : "flex-col", "w-full"]).style({
-    ...W[r],
-    ...x
-  }).children(
-    s.createElement(s.Fragment, {}, [
-      ...t.map(
-        (h, l) => s.cloneElement(
-          $().style(U[r]).classNames(K[r]).children(
-            e ? e(h, l) : null
-          ).build(),
-          { key: `item-${l}` }
-        )
-      ),
-      u && s.createElement("div", {
-        ref: F,
-        className: "py-4 flex justify-center w-full"
-      }, p ? s.createElement("div", { className: "animate-spin rounded-full h-5 w-5 border-2 border-gray-300 border-b-blue-600" }) : s.createElement("div", { style: { height: "20px" } }))
-    ])
-  ).build();
-});
-class _e extends I {
-  constructor() {
-    super(...arguments);
-    i(this, "_items", []);
-    i(this, "_renderItem");
-    i(this, "_variant", "default");
-    i(this, "_separator", !1);
-    i(this, "_onEndReached");
-    i(this, "_loading", !1);
-    i(this, "_threshold", 0.5);
-    i(this, "_containerHeight", 500);
-    i(this, "_resetItemStyles", !1);
-    i(this, "_direction", "vertical");
-    i(this, "_customItemHover");
-    i(this, "_customItemActive");
-    i(this, "_customItemFocus");
-  }
-  items(e) {
-    return this._items = e, this;
-  }
-  renderItem(e) {
-    return this._renderItem = e, this;
-  }
-  variant(e) {
-    return this._variant = e, this;
-  }
-  separator(e = !0) {
-    return this._separator = e, this;
-  }
-  onEndReached(e) {
-    return this._onEndReached = e, this;
-  }
-  loading(e) {
-    return this._loading = e, this;
-  }
-  threshold(e) {
-    return this._threshold = e, this;
-  }
-  containerHeight(e) {
-    return this._containerHeight = e, this;
-  }
-  resetItemStyles(e = !0) {
-    return this._resetItemStyles = e, this;
-  }
-  direction(e) {
-    return this._direction = e, this;
-  }
-  reset() {
-    return this._resetItemStyles = !0, this;
-  }
-  itemHover(e) {
-    if (typeof e == "function") {
-      const r = new V();
-      e(r), this._customItemHover = r.toCSSString();
-    } else
-      this._customItemHover = e;
-    return this;
-  }
-  itemActive(e) {
-    if (typeof e == "function") {
-      const r = new V();
-      e(r), this._customItemActive = r.toCSSString();
-    } else
-      this._customItemActive = e;
-    return this;
-  }
-  itemFocus(e) {
-    if (typeof e == "function") {
-      const r = new V();
-      e(r), this._customItemFocus = r.toCSSString();
-    } else
-      this._customItemFocus = e;
-    return this;
-  }
-  build() {
-    const e = {
-      items: this._items,
-      renderItem: this._renderItem,
-      variant: this._variant,
-      separator: this._separator,
-      loading: this._loading,
-      threshold: this._threshold,
-      onEndReached: this._onEndReached,
-      containerHeight: this._containerHeight,
-      resetItemStyles: this._resetItemStyles,
-      direction: this._direction,
-      customItemHover: this._customItemHover,
-      customItemActive: this._customItemActive,
-      customItemFocus: this._customItemFocus,
-      className: this.getClassName(),
-      style: this.getStyle()
-    };
-    return s.createElement(ge, e);
-  }
-}
-const Pe = w(_e), be = () => s.createElement(
-  "svg",
-  {
-    width: 12,
-    height: 12,
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: 2,
-    "aria-hidden": !0
-  },
-  s.createElement("path", { d: "M9 5l7 7-7 7" })
-), ye = s.memo((n) => {
-  const {
-    leading: t,
-    title: e,
-    subtitle: r,
-    trailing: d,
-    chevron: p,
-    divider: c,
-    dividerColor: u,
-    onPress: g,
-    className: x,
-    style: v,
-    ...m
-  } = n, a = v || {}, o = a.padding ?? "14px 0", _ = typeof e == "string" ? s.createElement(
-    "span",
-    {
-      className: "fibo-list-tile-title",
-      style: { fontSize: 11, letterSpacing: "0.06em", lineHeight: 1.3, margin: 0 }
-    },
-    e
-  ) : e, y = typeof r == "string" ? s.createElement(
-    "span",
-    {
-      className: "fibo-list-tile-subtitle",
-      style: {
-        fontSize: 8,
-        letterSpacing: "0.06em",
-        lineHeight: 1.3,
-        margin: 0,
-        color: "#9a9a9a"
-      }
-    },
-    r
-  ) : r;
-  return s.createElement(
-    "div",
-    {
-      className: me("fibo-list-tile flex flex-row items-center w-full", x),
-      style: {
-        padding: o,
-        borderBottom: c ? `1px solid ${u || "#3b3b3b"}` : "none",
-        cursor: g ? "pointer" : void 0,
-        ...a
-      },
-      onClick: g,
-      role: g ? "button" : void 0,
-      ...m
-    },
-    t ? s.createElement(
-      "div",
-      {
-        key: "leading",
-        className: "fibo-list-tile-leading shrink-0 flex items-center",
-        style: { color: "#9a9a9a", marginRight: 12 }
-      },
-      t
-    ) : null,
-    s.createElement(
-      "div",
-      {
-        key: "body",
-        className: "fibo-list-tile-body flex-1 min-w-0 flex flex-col justify-center"
-      },
-      _,
-      y
-    ),
-    d ? s.createElement(
-      "div",
-      {
-        key: "trailing",
-        className: "fibo-list-tile-trailing shrink-0 flex items-center",
-        style: { color: "#9a9a9a", marginLeft: 12 }
-      },
-      d
-    ) : null,
-    p ? s.createElement(
-      "div",
-      {
-        key: "chevron",
-        className: "fibo-list-tile-chevron shrink-0 flex items-center",
-        style: { color: "#9a9a9a", marginLeft: d ? 8 : 0 }
-      },
-      s.createElement(be)
-    ) : null
-  );
-});
-class xe extends I {
-  constructor() {
-    super(...arguments);
-    i(this, "_leading");
-    i(this, "_title");
-    i(this, "_subtitle");
-    i(this, "_trailing");
-    i(this, "_chevron", !1);
-    i(this, "_divider", !1);
-    i(this, "_dividerColor");
-    i(this, "_onPress");
-  }
-  leading(e) {
-    return this._leading = T(e), this;
-  }
-  icon(e) {
-    return this.leading(e);
-  }
-  title(e) {
-    return this._title = typeof e == "string" ? e : T(e), this;
-  }
-  subtitle(e) {
-    return this._subtitle = typeof e == "string" ? e : T(e), this;
-  }
-  trailing(e) {
-    return this._trailing = T(e), this;
-  }
-  chevron(e = !0) {
-    return this._chevron = e, this;
-  }
-  divider(e = !0, r) {
-    return this._divider = e, r && (this._dividerColor = r), this;
-  }
-  onPress(e) {
-    return this._onPress = e, this;
-  }
-  build() {
-    return s.createElement(ye, {
-      leading: this._leading,
-      title: this._title,
-      subtitle: this._subtitle,
-      trailing: this._trailing,
-      chevron: this._chevron,
-      divider: this._divider,
-      dividerColor: this._dividerColor,
-      onPress: this._onPress,
-      className: this.getClassName(),
-      style: this.getStyle(),
-      ...this._props
-    });
-  }
-}
-const ze = w(xe), ve = s.memo((n) => {
-  const {
-    data: t,
-    columns: e,
-    variant: r,
-    density: d,
-    striped: p,
-    width: c,
-    className: u,
-    style: g
-  } = n, x = {
-    width: "100%",
-    borderCollapse: "separate",
-    borderSpacing: "0",
-    ...g
-  };
-  c && (x.width = typeof c == "number" ? `${c}px` : c);
-  const v = r === "clean" ? ["bg-white", "rounded-2xl", "border", "border-gray-100", "overflow-hidden", "shadow-sm"] : [], a = {
-    compact: "10px 16px",
-    standard: "16px 24px",
-    relaxed: "24px 32px"
-  }[d];
-  return $().className(u).classNames(v).children(
-    s.createElement("table", { style: x }, [
-      s.createElement(
-        "thead",
-        { key: "thead", className: "bg-gray-50/50" },
-        s.createElement(
-          "tr",
-          {},
-          e.map(
-            (o, _) => s.createElement("th", {
-              key: String(o.accessor ?? o.header ?? _),
-              scope: "col",
-              style: {
-                textAlign: o.align || "left",
-                padding: a,
-                width: o.width
-              },
-              className: "text-xs font-bold text-gray-400 uppercase tracking-widest"
-            }, o.header)
-          )
-        )
-      ),
-      s.createElement(
-        "tbody",
-        { key: "tbody" },
-        t.map(
-          (o, _) => s.createElement(
-            "tr",
-            {
-              key: (o == null ? void 0 : o.id) ?? (o == null ? void 0 : o.key) ?? _,
-              className: `group transition-all duration-200 border-b border-gray-50 last:border-b-0 ${p && _ % 2 !== 0 ? "bg-gray-50/30" : "bg-transparent"} ${r === "clean" ? "hover:bg-white hover:shadow-md hover:scale-[1.002] hover:z-10 relative" : "hover:bg-gray-50/50"}`
-            },
-            e.map(
-              (y, H) => s.createElement(
-                "td",
-                {
-                  key: H,
-                  style: {
-                    textAlign: y.align || "left",
-                    padding: a,
-                    borderTop: r === "default" ? "1px solid #F3F4F6" : "none"
-                  },
-                  className: "text-sm text-gray-900 font-medium"
-                },
-                y.render ? y.render(o) : y.accessor ? o[y.accessor] : null
-              )
-            )
-          )
-        )
-      )
-    ])
-  ).build();
-});
-class Ee extends I {
-  constructor() {
-    super(...arguments);
-    i(this, "_data", []);
-    i(this, "_columns", []);
-    i(this, "_variant", "clean");
-    i(this, "_density", "standard");
-    i(this, "_striped", !1);
-    i(this, "_width");
-  }
-  data(e) {
-    return this._data = e, this;
-  }
-  columns(e) {
-    return this._columns = e, this;
-  }
-  variant(e) {
-    return this._variant = e, this;
-  }
-  density(e) {
-    return this._density = e, this;
-  }
-  striped(e = !0) {
-    return this._striped = e, this;
-  }
-  width(e) {
-    return this._width = e, this;
-  }
-  build() {
-    const e = {
-      data: this._data,
-      columns: this._columns,
-      variant: this._variant,
-      density: this._density,
-      striped: this._striped,
-      width: this._width,
-      className: this.getClassName(),
-      style: this.getStyle()
-    };
-    return s.createElement(ve, e);
-  }
-}
-const Ve = w(Ee), Ne = s.memo((n) => {
-  const { items: t, className: e, style: r, ...d } = n, p = t.map(
-    (c, u) => s.createElement(
-      "span",
-      {
-        key: c.title ? `${c.title}-${u}` : `tag-${u}`,
-        className: "fibo-tag"
-      },
-      c.title
-    )
-  );
-  return s.createElement(
-    "div",
-    {
-      className: e,
-      style: r,
-      ...d
-    },
-    ...p
-  );
-});
-class we extends I {
-  constructor(e = []) {
-    super();
-    i(this, "_items", []);
-    this._items = e;
-  }
-  items(e) {
-    return this._items = e, this;
-  }
-  build() {
-    const e = ["fibo-tags", "flex", "gap-2", "flex-wrap", ...this._classNames].filter(Boolean).join(" "), r = {
-      items: this._items,
-      className: e,
-      style: this.getStyle(),
-      ...this._props
-    };
-    return s.createElement(Ne, r);
-  }
-}
-const De = w(we), Ie = s.memo((n) => {
-  const { status: t, title: e, subtitle: r, className: d, style: p, ...c } = n;
-  return s.createElement(
-    "div",
-    {
-      className: d,
-      style: p,
-      ...c
-    },
-    s.createElement(
-      "div",
-      { className: "flex flex-col gap-1" },
-      e && s.createElement(
-        "h4",
-        {
-          className: "font-semibold text-sm uppercase tracking-wide opacity-90"
-        },
-        e
-      ),
-      r && s.createElement(
-        "p",
-        {
-          className: "opacity-80 text-sm"
-        },
-        r
-      )
-    )
-  );
-});
-class Se extends I {
-  constructor(e = "") {
-    super();
-    i(this, "_status", "info");
-    i(this, "_title", "");
-    i(this, "_subtitle");
-    this._title = e;
-  }
-  status(e) {
-    return this._status = e, this;
-  }
-  title(e) {
-    return this._title = e, this;
-  }
-  subtitle(e) {
-    return this._subtitle = e, this;
-  }
-  build() {
-    const r = [
-      "fibo-banner",
-      `fibo-banner-${this._status}`,
-      ...this._classNames
-    ].filter(Boolean).join(" "), d = {
-      status: this._status,
-      title: this._title,
-      subtitle: this._subtitle,
-      className: r,
-      style: this.getStyle(),
-      ...this._props
-    };
-    return s.createElement(Ie, d);
-  }
-}
-const Xe = w(Se);
-class $e extends I {
-  constructor() {
-    super(...arguments);
-    i(this, "_title", "");
-    i(this, "_content", null);
-    i(this, "_defaultExpanded", !1);
-    i(this, "_expanded");
-    i(this, "_onToggle");
-  }
-  title(e) {
-    return this._title = e, this;
-  }
-  content(e) {
-    return this._content = T(e), this;
-  }
-  isOpen(e) {
-    return this._expanded = e, this;
-  }
-  defaultOpen(e) {
-    return this._defaultExpanded = e, this;
-  }
-  onToggle(e) {
-    return this._onToggle = e, this;
-  }
-  build() {
-    return s.createElement(Ce, {
-      builder: this,
-      ...this._props
-    });
-  }
-}
-const Ce = s.memo(({ builder: n }) => {
-  const t = s.useId(), e = `${t}-content`, r = n._expanded !== void 0, [d, p] = X(n._defaultExpanded), c = r ? n._expanded : d, u = () => {
-    r || p(!c), n._onToggle && n._onToggle(!c);
-  };
-  return $().classNames(["w-full", "border", "border-gray-200", "rounded-xl", "overflow-hidden", "bg-white", "transition-all", "duration-300"]).className(n.getClassName()).style(n.getStyle()).children([
-    s.createElement("button", {
-      key: "header",
-      type: "button",
-      id: t,
-      "aria-expanded": c,
-      "aria-controls": e,
-      className: "w-full flex items-center justify-between p-4 cursor-pointer hover:bg-gray-50 transition-colors select-none text-left bg-transparent border-0",
-      onClick: u
-    }, [
-      s.createElement(
-        s.Fragment,
-        { key: "title" },
-        typeof n._title == "string" ? he(n._title).fontWeight(600).fontSize(15).color("#1F2937").build() : n._title
-      ),
-      s.createElement("span", {
-        key: "chevron",
-        className: "transition-transform duration-300",
-        style: { transform: c ? "rotate(180deg)" : "rotate(0deg)" },
-        "aria-hidden": !0
-      }, s.createElement("svg", {
-        width: "20",
-        height: "20",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "2",
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        className: "text-gray-400"
-      }, s.createElement("polyline", { points: "6 9 12 15 18 9" })))
-    ]),
-    $().props({
-      id: e,
-      role: "region",
-      "aria-labelledby": t,
-      hidden: !c || void 0
-    }).classNames(["transition-all", "duration-300", "ease-in-out", "overflow-hidden"]).style({
-      maxHeight: c ? "500px" : "0px",
-      opacity: c ? 1 : 0
-    }).children(
-      $().classNames(["p-4", "pt-0", "text-gray-600", "text-sm"]).children(n._content).build()
-    ).build()
-  ]).build();
-}), Ye = w($e), ke = s.memo((n) => {
-  const {
-    children: t,
-    variant: e = "standard",
-    columns: r = 1,
-    gap: d = "md",
-    className: p,
-    style: c,
-    ...u
-  } = n, g = (m) => typeof m == "number" ? "" : {
-    none: "gap-0",
-    sm: "gap-2",
-    md: "gap-4",
-    lg: "gap-6",
-    xl: "gap-8"
-  }[m] || "gap-4", x = (m) => {
-    if (typeof m == "number") return m + "px";
-  }, v = (m) => {
-    if (typeof m == "number") return `grid-cols-${m}`;
-    let a = [];
-    return m.sm && a.push(`sm:grid-cols-${m.sm}`), m.md && a.push(`md:grid-cols-${m.md}`), m.lg && a.push(`lg:grid-cols-${m.lg}`), m.xl && a.push(`xl:grid-cols-${m.xl}`), a.join(" ") || "grid-cols-1";
-  };
-  if (e === "bento") {
-    const m = [
-      { col: 2, row: 2 },
-      { col: 1, row: 1 },
-      { col: 1, row: 1 },
-      { col: 1, row: 2 },
-      { col: 2, row: 1 }
-    ];
-    return s.createElement("div", {
-      className: `grid ${v(r)} ${g(d)} ${p}`,
-      style: {
-        gap: x(d),
-        gridAutoFlow: "dense",
-        ...c
-      },
-      ...u
-    }, s.Children.map(t, (a, o) => {
-      if (s.isValidElement(a) && typeof a.props.className == "string" && a.props.className.includes("col-span"))
-        return a;
-      const _ = m[o % m.length];
-      return s.createElement("div", {
-        key: q(a, o),
-        style: { gridColumn: `span ${_.col}`, gridRow: `span ${_.row}` }
-      }, a);
-    }));
-  }
-  if (e === "masonry") {
-    const m = (a) => {
-      if (typeof a == "number") return `columns-${a}`;
-      let o = [];
-      return a.sm && o.push(`sm:columns-${a.sm}`), a.md && o.push(`md:columns-${a.md}`), a.lg && o.push(`lg:columns-${a.lg}`), a.xl && o.push(`xl:columns-${a.xl}`), o.join(" ") || "columns-1";
-    };
-    return s.createElement("div", {
-      className: `${m(r)} ${g(d)} space-y-4 ${p}`,
-      style: {
-        columnGap: x(d),
-        ...c
-      },
-      ...u
-    }, s.Children.map(
-      t,
-      (a, o) => s.createElement("div", {
-        key: q(a, o),
-        className: "break-inside-avoid mb-4"
-      }, a)
-    ));
-  }
-  return s.createElement("div", {
-    className: `grid ${v(r)} ${g(d)} ${p}`,
-    style: {
-      gap: x(d),
-      ...c
-    },
-    ...u
-  }, t);
-}), Be = s.memo((n) => {
-  const { children: t, colSpan: e, rowSpan: r, className: d, style: p, ...c } = n, u = () => {
-    let g = [];
-    return e && g.push(`col-span-${e}`), r && g.push(`row-span-${r}`), g.join(" ");
-  };
-  return s.createElement("div", {
-    className: `${u()} ${d}`,
-    style: p,
-    ...c
-  }, t);
-});
-class Te extends I {
-  constructor() {
-    super(...arguments);
-    i(this, "_variant", "standard");
-    i(this, "_columns", 1);
-    i(this, "_gap", "md");
-  }
-  variant(e) {
-    return this._variant = e, this;
-  }
-  columns(e) {
-    return this._columns = e, this;
-  }
-  gap(e) {
-    return this._gap = e, this;
-  }
-  build() {
-    const e = {
-      variant: this._variant,
-      columns: this._columns,
-      gap: this._gap,
-      children: this.processChildren(),
-      className: this.getClassName(),
-      style: this.getStyle(),
-      ...this._props
-    };
-    return s.createElement(ke, e);
-  }
-}
-class He extends I {
-  constructor() {
-    super(...arguments);
-    i(this, "_colSpan");
-    i(this, "_rowSpan");
-  }
-  colSpan(e) {
-    return this._colSpan = e, this;
-  }
-  rowSpan(e) {
-    return this._rowSpan = e, this;
-  }
-  build() {
-    const e = {
-      colSpan: this._colSpan,
-      rowSpan: this._rowSpan,
-      children: this.processChildren(),
-      className: this.getClassName(),
-      style: this.getStyle(),
-      ...this._props
-    };
-    return s.createElement(Be, e);
-  }
-}
-const We = w(Te), Ue = w(He);
-export {
-  Xe as B,
-  Me as C,
-  We as G,
-  Pe as L,
-  Ve as T,
-  ze as a,
-  De as b,
-  Ye as c,
-  Ue as d
-};