astralis-ui 0.1.0

package/dist/components/data-entry/slider/components/slider.js

@@ -0,0 +1,395 @@
+"use client";
+import { jsx as d, jsxs as G, Fragment as ie } from "react/jsx-runtime";
+import { useState as q, useRef as D, useEffect as S, useCallback as Z, useMemo as ee } from "react";
+import { useFieldContext as te } from "../../field/field.context.js";
+import { CENTER_XY as se, sliderThumbSize as oe, sliderTrackH as ae } from "../slider.styles.js";
+import { astralisMerge as k } from "../../../../utils/astralis-merge.js";
+import { accentClass as re } from "../../../../const/color-schemes.js";
+function z(t, e, a) {
+  return (t - e) / (a - e) * 100;
+}
+function Q(t, e, a, f, r) {
+  const { left: c, width: g } = e.getBoundingClientRect(), A = Math.max(0, Math.min(1, (t - c) / g)), E = a + A * (f - a), M = Math.round(E / r) * r, X = String(r).includes(".") ? String(r).split(".")[1].length : 0;
+  return parseFloat(Math.max(a, Math.min(f, M)).toFixed(X));
+}
+function ne(t, e, a, f) {
+  if (!t) return [];
+  if (t === !0) {
+    const r = Math.round((a - e) / f);
+    return r > 20 ? [{ value: e }, { value: a }] : Array.from({ length: r + 1 }, (c, g) => ({ value: e + g * f }));
+  }
+  return t;
+}
+function ce({ value: t, visible: e }) {
+  return e ? /* @__PURE__ */ d(
+    "div",
+    {
+      "aria-hidden": "true",
+      style: { bottom: "100%", left: "50%", transform: "translateX(-50%)" },
+      className: "astralis:absolute astralis:mb-2 astralis:pointer-events-none",
+      children: /* @__PURE__ */ G("div", { className: "astralis:relative astralis:rounded-sm astralis:bg-surface-inverted astralis:px-1.5 astralis:py-0.5 astralis:text-xs astralis:font-medium astralis:text-label-inverted astralis:whitespace-nowrap astralis:shadow-sm", children: [
+        t,
+        /* @__PURE__ */ d(
+          "div",
+          {
+            "aria-hidden": "true",
+            style: { top: "100%", left: "50%", transform: "translateX(-50%) rotate(45deg)", marginTop: "-3px" },
+            className: "astralis:absolute astralis:h-2 astralis:w-2 astralis:bg-surface-inverted"
+          }
+        )
+      ] })
+    }
+  ) : null;
+}
+function W({
+  percent: t,
+  value: e,
+  size: a,
+  isInvalid: f,
+  isDisabled: r,
+  isReadOnly: c,
+  showTooltip: g,
+  onMouseDown: A,
+  onKeyDown: E,
+  ariaMin: M,
+  ariaMax: X,
+  label: V
+}) {
+  const [B, T] = q(!1), [H, L] = q(!1), u = (b) => {
+    if (r || c) return;
+    L(!0), A(b);
+    const v = () => L(!1);
+    document.addEventListener("mouseup", v, { once: !0 });
+  }, h = g && (B || H);
+  return /* @__PURE__ */ d(
+    "div",
+    {
+      role: "slider",
+      tabIndex: r ? -1 : 0,
+      "aria-valuemin": M,
+      "aria-valuemax": X,
+      "aria-valuenow": e,
+      "aria-label": V,
+      "aria-disabled": r,
+      "aria-readonly": c,
+      style: { left: `${t}%`, ...se },
+      className: k(
+        "astralis:absolute astralis:rounded-full astralis:border-moderate astralis:bg-surface-base astralis:shadow-md astralis:transition-shadow",
+        "astralis:outline-none astralis:focus-visible:ring-2 astralis:focus-visible:ring-offset-1 astralis:focus-visible:ring-offset-surface-base",
+        oe[a],
+        f ? "astralis:border-red-solid astralis:focus-visible:ring-red-muted" : "astralis:border-accent-solid astralis:focus-visible:ring-accent-ring",
+        r ? "astralis:cursor-not-allowed astralis:border-stroke-emphasized" : c ? "astralis:cursor-default" : "astralis:cursor-grab astralis:active:cursor-grabbing astralis:hover:shadow-lg"
+      ),
+      onMouseDown: u,
+      onKeyDown: E,
+      onMouseEnter: () => T(!0),
+      onMouseLeave: () => T(!1),
+      children: /* @__PURE__ */ d(ce, { value: e, visible: h })
+    }
+  );
+}
+function le({ marksArr: t, min: e, max: a, isActive: f }) {
+  return /* @__PURE__ */ d(ie, { children: t.map((r) => {
+    const c = z(r.value, e, a);
+    return /* @__PURE__ */ G("div", { "aria-hidden": "true", style: { left: `${c}%`, ...se }, className: "astralis:absolute", children: [
+      /* @__PURE__ */ d(
+        "div",
+        {
+          className: k(
+            "astralis:h-1.5 astralis:w-1.5 astralis:rounded-full astralis:border-normal",
+            f(r.value) ? "astralis:bg-accent-solid astralis:border-accent-solid" : "astralis:bg-surface-base astralis:border-stroke-emphasized"
+          )
+        }
+      ),
+      r.label && /* @__PURE__ */ d(
+        "span",
+        {
+          style: { left: "50%", transform: "translateX(-50%)" },
+          className: "astralis:absolute astralis:top-3 astralis:text-xs astralis:text-label-muted astralis:whitespace-nowrap",
+          children: r.label
+        }
+      )
+    ] }, r.value);
+  }) });
+}
+function ue({
+  min: t = 0,
+  max: e = 100,
+  step: a = 1,
+  value: f,
+  defaultValue: r = 0,
+  onChange: c,
+  size: g = "md",
+  colorScheme: A = "brand",
+  showTooltip: E = !0,
+  marks: M,
+  disabled: X,
+  invalid: V,
+  readOnly: B,
+  className: T = "",
+  id: H,
+  ref: L
+}) {
+  const u = te(), h = X ?? u?.disabled, b = V ?? u?.invalid, v = B ?? u?.readOnly, J = H ?? u?.id, C = f !== void 0, [i, R] = q(r), w = C ? f : i, x = D(null), I = D(!1), y = D({ min: t, max: e, step: a, isControlled: C, isDisabled: h, isReadOnly: v });
+  S(() => {
+    y.current = { min: t, max: e, step: a, isControlled: C, isDisabled: h, isReadOnly: v };
+  });
+  const $ = D(c);
+  S(() => {
+    $.current = c;
+  });
+  const F = D(R), O = Z((s) => {
+    if (!x.current || y.current.isDisabled || y.current.isReadOnly) return;
+    const { min: l, max: m, step: N, isControlled: p } = y.current, U = Q(s, x.current, l, m, N);
+    p || F.current(U), $.current?.(U);
+  }, []);
+  S(() => {
+    const s = (m) => {
+      if (!I.current) return;
+      const N = "touches" in m ? m.touches[0].clientX : m.clientX;
+      O(N);
+    }, l = () => {
+      I.current = !1;
+    };
+    return document.addEventListener("mousemove", s), document.addEventListener("mouseup", l), document.addEventListener("touchmove", s, { passive: !0 }), document.addEventListener("touchend", l), () => {
+      document.removeEventListener("mousemove", s), document.removeEventListener("mouseup", l), document.removeEventListener("touchmove", s), document.removeEventListener("touchend", l);
+    };
+  }, [O]);
+  const K = (s) => {
+    h || v || (I.current = !0, O(s.clientX));
+  }, j = (s) => {
+    s.stopPropagation(), !(h || v) && (I.current = !0);
+  }, P = (s) => {
+    if (h || v) return;
+    const { min: l, max: m, step: N } = y.current;
+    let p = w;
+    switch (s.key) {
+      case "ArrowLeft":
+      case "ArrowDown":
+        p = Math.max(l, w - N);
+        break;
+      case "ArrowRight":
+      case "ArrowUp":
+        p = Math.min(m, w + N);
+        break;
+      case "Home":
+        p = l;
+        break;
+      case "End":
+        p = m;
+        break;
+      default:
+        return;
+    }
+    s.preventDefault(), C || R(p), c?.(p);
+  }, _ = z(w, t, e), n = ee(() => ne(M, t, e, a), [M, t, e, a]), o = n.some((s) => s.label);
+  return /* @__PURE__ */ d(
+    "div",
+    {
+      ref: L,
+      id: J,
+      className: k(
+        "astralis:relative astralis:w-full astralis:select-none",
+        re(A),
+        o && "astralis:mb-6",
+        h && "astralis:opacity-moderate",
+        v && "astralis:opacity-high",
+        T
+      ),
+      children: /* @__PURE__ */ G(
+        "div",
+        {
+          ref: x,
+          onMouseDown: K,
+          className: k(
+            "astralis:relative astralis:w-full astralis:rounded-full astralis:bg-surface-muted",
+            ae[g],
+            h ? "astralis:cursor-not-allowed" : v ? "astralis:cursor-default" : "astralis:cursor-pointer"
+          ),
+          children: [
+            /* @__PURE__ */ d(
+              "div",
+              {
+                "aria-hidden": "true",
+                style: { top: 0, bottom: 0, left: 0, width: `${_}%` },
+                className: k("astralis:absolute astralis:rounded-full", b ? "astralis:bg-red-solid" : "astralis:bg-accent-solid")
+              }
+            ),
+            /* @__PURE__ */ d(
+              W,
+              {
+                percent: _,
+                value: w,
+                size: g,
+                isInvalid: !!b,
+                isDisabled: !!h,
+                isReadOnly: !!v,
+                showTooltip: E,
+                onMouseDown: j,
+                onKeyDown: P,
+                ariaMin: t,
+                ariaMax: e
+              }
+            ),
+            /* @__PURE__ */ d(le, { marksArr: n, min: t, max: e, isActive: (s) => s <= w })
+          ]
+        }
+      )
+    }
+  );
+}
+ue.displayName = "Slider";
+function de({
+  min: t = 0,
+  max: e = 100,
+  step: a = 1,
+  value: f,
+  defaultValue: r = [20, 80],
+  onChange: c,
+  size: g = "md",
+  colorScheme: A = "brand",
+  showTooltip: E = !0,
+  marks: M,
+  disabled: X,
+  invalid: V,
+  readOnly: B,
+  className: T = "",
+  ref: H
+}) {
+  const L = te(), u = X ?? L?.disabled, h = V ?? L?.invalid, b = B ?? L?.readOnly, v = f !== void 0, [J, C] = q(r), i = v ? f : J, R = D(null), w = D(-1), x = D({ min: t, max: e, step: a, isControlled: v, isDisabled: u, isReadOnly: b, value: i });
+  S(() => {
+    x.current = { min: t, max: e, step: a, isControlled: v, isDisabled: u, isReadOnly: b, value: i };
+  });
+  const I = D(c);
+  S(() => {
+    I.current = c;
+  });
+  const y = Z((n) => {
+    if (!R.current || x.current.isDisabled || x.current.isReadOnly) return;
+    const o = w.current;
+    if (o === -1) return;
+    const { min: s, max: l, step: m, isControlled: N, value: p } = x.current, U = Q(n, R.current, s, l, m);
+    let Y;
+    o === 0 ? Y = [Math.min(U, p[1] - m), p[1]] : Y = [p[0], Math.max(U, p[0] + m)], N || C(Y), I.current?.(Y);
+  }, []);
+  S(() => {
+    const n = (s) => {
+      if (w.current === -1) return;
+      const l = "touches" in s ? s.touches[0].clientX : s.clientX;
+      y(l);
+    }, o = () => {
+      w.current = -1;
+    };
+    return document.addEventListener("mousemove", n), document.addEventListener("mouseup", o), document.addEventListener("touchmove", n, { passive: !0 }), document.addEventListener("touchend", o), () => {
+      document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", o), document.removeEventListener("touchmove", n), document.removeEventListener("touchend", o);
+    };
+  }, [y]);
+  const $ = (n) => {
+    if (u || b || !R.current) return;
+    const o = Q(n.clientX, R.current, t, e, a), s = Math.abs(o - i[0]), l = Math.abs(o - i[1]);
+    w.current = s <= l ? 0 : 1, y(n.clientX);
+  }, F = (n) => (o) => {
+    o.stopPropagation(), !(u || b) && (w.current = n);
+  }, O = (n) => (o) => {
+    if (u || b) return;
+    const s = i[n];
+    let l = s;
+    switch (o.key) {
+      case "ArrowLeft":
+      case "ArrowDown":
+        l = Math.max(t, s - a);
+        break;
+      case "ArrowRight":
+      case "ArrowUp":
+        l = Math.min(e, s + a);
+        break;
+      case "Home":
+        l = t;
+        break;
+      case "End":
+        l = e;
+        break;
+      default:
+        return;
+    }
+    o.preventDefault();
+    const m = n === 0 ? [Math.min(l, i[1] - a), i[1]] : [i[0], Math.max(l, i[0] + a)];
+    v || C(m), c?.(m);
+  }, K = z(i[0], t, e), j = z(i[1], t, e), P = ee(() => ne(M, t, e, a), [M, t, e, a]), _ = P.some((n) => n.label);
+  return /* @__PURE__ */ d(
+    "div",
+    {
+      ref: H,
+      className: k(
+        "astralis:relative astralis:w-full astralis:select-none",
+        re(A),
+        _ && "astralis:mb-6",
+        u && "astralis:opacity-moderate",
+        b && "astralis:opacity-high",
+        T
+      ),
+      children: /* @__PURE__ */ G(
+        "div",
+        {
+          ref: R,
+          onMouseDown: $,
+          className: k(
+            "astralis:relative astralis:w-full astralis:rounded-full astralis:bg-surface-muted",
+            ae[g],
+            u ? "astralis:cursor-not-allowed" : b ? "astralis:cursor-default" : "astralis:cursor-pointer"
+          ),
+          children: [
+            /* @__PURE__ */ d(
+              "div",
+              {
+                "aria-hidden": "true",
+                style: { top: 0, bottom: 0, left: `${K}%`, width: `${j - K}%` },
+                className: k("astralis:absolute astralis:rounded-full", h ? "astralis:bg-red-solid" : "astralis:bg-accent-solid")
+              }
+            ),
+            /* @__PURE__ */ d(
+              W,
+              {
+                percent: K,
+                value: i[0],
+                size: g,
+                isInvalid: !!h,
+                isDisabled: !!u,
+                isReadOnly: !!b,
+                showTooltip: E,
+                onMouseDown: F(0),
+                onKeyDown: O(0),
+                ariaMin: t,
+                ariaMax: i[1],
+                label: "Start value"
+              }
+            ),
+            /* @__PURE__ */ d(
+              W,
+              {
+                percent: j,
+                value: i[1],
+                size: g,
+                isInvalid: !!h,
+                isDisabled: !!u,
+                isReadOnly: !!b,
+                showTooltip: E,
+                onMouseDown: F(1),
+                onKeyDown: O(1),
+                ariaMin: i[0],
+                ariaMax: e,
+                label: "End value"
+              }
+            ),
+            /* @__PURE__ */ d(le, { marksArr: P, min: t, max: e, isActive: (n) => n >= i[0] && n <= i[1] })
+          ]
+        }
+      )
+    }
+  );
+}
+de.displayName = "RangeSlider";
+export {
+  de as RangeSliderBase,
+  ue as SliderBase
+};

package/dist/components/data-entry/slider/slider.styles.js

@@ -0,0 +1,15 @@
+"use client";
+const s = {
+  sm: "astralis:h-1",
+  md: "astralis:h-1.5",
+  lg: "astralis:h-2"
+}, a = {
+  sm: "astralis:h-3.5 astralis:w-3.5",
+  md: "astralis:h-5 astralis:w-5",
+  lg: "astralis:h-6 astralis:w-6"
+}, t = { top: "50%", transform: "translate(-50%, -50%)" };
+export {
+  t as CENTER_XY,
+  a as sliderThumbSize,
+  s as sliderTrackH
+};

package/dist/components/data-entry/switch/components/switch.js

@@ -0,0 +1,86 @@
+"use client";
+import { jsxs as j, jsx as l } from "react/jsx-runtime";
+import { useState as z, useEffect as B } from "react";
+import { useFieldContext as D } from "../../field/field.context.js";
+import { switchSizes as T, switchTrackColor as E, switchTrack as F } from "../switch.styles.js";
+import { astralisMerge as n } from "../../../../utils/astralis-merge.js";
+import { accentClass as I } from "../../../../const/color-schemes.js";
+function L({
+  size: f = "md",
+  children: d,
+  colorScheme: u = "brand",
+  invalid: b,
+  disabled: p,
+  checked: s,
+  defaultChecked: y = !1,
+  onChange: C,
+  readOnly: w,
+  className: k = "",
+  id: v,
+  ref: x,
+  ...g
+}) {
+  const a = D(), [N, c] = z(y), e = s !== void 0, i = e ? s : N, m = p ?? a?.disabled, h = b ?? a?.invalid, t = w ?? a?.readOnly, O = v ?? a?.id, S = (o) => {
+    if (t) {
+      o.preventDefault();
+      return;
+    }
+    e || c(o.target.checked), C?.(o);
+  };
+  B(() => {
+    e && c(s);
+  }, [e, s]);
+  const r = T[f];
+  return /* @__PURE__ */ j(
+    "label",
+    {
+      className: n(
+        "astralis:inline-flex astralis:items-center astralis:gap-2.5",
+        I(u),
+        m ? "astralis:cursor-not-allowed astralis:opacity-moderate" : t ? "astralis:cursor-default" : "astralis:cursor-pointer",
+        k
+      ),
+      children: [
+        /* @__PURE__ */ l(
+          "input",
+          {
+            ref: x,
+            type: "checkbox",
+            role: "switch",
+            id: O,
+            checked: i,
+            disabled: m,
+            readOnly: t,
+            "aria-invalid": h || void 0,
+            "aria-describedby": a?.describedBy,
+            "aria-readonly": t || void 0,
+            "aria-checked": i,
+            onChange: S,
+            className: "astralis:sr-only astralis:peer",
+            ...g
+          }
+        ),
+        /* @__PURE__ */ l("span", { "aria-hidden": "true", className: n(r.track, F, E(i, !!h)), children: /* @__PURE__ */ l(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: n(
+              r.thumb,
+              // Deliberately white in BOTH themes (Chakra/Material convention):
+              // a theme-following thumb would go dark on the dark off-track and
+              // vanish. `bg-white` resolves var(--astralis-color-white), so it
+              // stays themable at the primitive layer.
+              "astralis:rounded-full astralis:bg-white astralis:shadow-sm astralis:transition-transform",
+              i ? r.on : "astralis:translate-x-0"
+            )
+          }
+        ) }),
+        d && /* @__PURE__ */ l("span", { className: n(r.label, "astralis:text-label-base astralis:select-none"), children: d })
+      ]
+    }
+  );
+}
+L.displayName = "Switch";
+export {
+  L as SwitchBase
+};

package/dist/components/data-entry/switch/switch.styles.js

@@ -0,0 +1,14 @@
+"use client";
+const r = {
+  sm: { track: "astralis:h-4 astralis:w-7", thumb: "astralis:h-3 astralis:w-3", on: "astralis:translate-x-3", label: "astralis:text-xs" },
+  md: { track: "astralis:h-5 astralis:w-9", thumb: "astralis:h-4 astralis:w-4", on: "astralis:translate-x-4", label: "astralis:text-sm" },
+  lg: { track: "astralis:h-6 astralis:w-11", thumb: "astralis:h-5 astralis:w-5", on: "astralis:translate-x-5", label: "astralis:text-base" }
+}, t = "astralis:inline-flex astralis:shrink-0 astralis:items-center astralis:px-0.5 astralis:rounded-full astralis:transition-colors astralis:peer-focus-visible:ring-2 astralis:peer-focus-visible:ring-accent-ring astralis:peer-focus-visible:ring-offset-2 astralis:peer-focus-visible:ring-offset-surface-base";
+function i(s, a) {
+  return a ? s ? "astralis:bg-red-solid" : "astralis:bg-surface-muted astralis:border-normal astralis:border-red-solid" : s ? "astralis:bg-accent-solid" : "astralis:bg-surface-muted astralis:border-normal astralis:border-stroke-emphasized";
+}
+export {
+  r as switchSizes,
+  t as switchTrack,
+  i as switchTrackColor
+};

package/dist/components/disclosure/accordion/accordion.context.js

@@ -0,0 +1,20 @@
+"use client";
+import { useContext as n, createContext as t } from "react";
+const c = t(null);
+function i() {
+  const o = n(c);
+  if (!o) throw new Error("Accordion sub-components must be used within <Accordion>");
+  return o;
+}
+const r = t(null);
+function u() {
+  const o = n(r);
+  if (!o) throw new Error("Accordion.Trigger / Accordion.Content must be used within <Accordion.Item>");
+  return o;
+}
+export {
+  c as AccordionContext,
+  r as AccordionItemContext,
+  i as useAccordion,
+  u as useAccordionItem
+};

package/dist/components/disclosure/accordion/accordion.styles.js

@@ -0,0 +1,84 @@
+"use client";
+import { cva as a } from "class-variance-authority";
+const t = a("astralis:w-full", {
+  variants: {
+    variant: {
+      // Shared outer border + rounded; items divided by inner borders.
+      enclosed: "astralis:border-normal astralis:border-stroke-base astralis:rounded-lg astralis:overflow-hidden",
+      // Divider lines only, no outer frame.
+      outline: "",
+      // Each item is its own card.
+      separated: "astralis:flex astralis:flex-col astralis:gap-3",
+      // Filled cards.
+      subtle: "astralis:flex astralis:flex-col astralis:gap-2",
+      // No chrome at all.
+      plain: ""
+    }
+  },
+  defaultVariants: { variant: "enclosed" }
+}), r = a("astralis:transition-colors", {
+  variants: {
+    variant: {
+      enclosed: "astralis:border-b astralis:border-stroke-base astralis:last:border-b-0",
+      outline: "astralis:border-b astralis:border-stroke-base astralis:last:border-b-0",
+      separated: "astralis:border-normal astralis:border-stroke-base astralis:rounded-lg astralis:overflow-hidden astralis:bg-surface-base",
+      subtle: "astralis:rounded-lg astralis:overflow-hidden astralis:bg-surface-subtle",
+      plain: ""
+    },
+    disabled: {
+      true: "astralis:opacity-moderate astralis:pointer-events-none",
+      false: ""
+    }
+  },
+  defaultVariants: { variant: "enclosed", disabled: !1 }
+}), l = a(
+  "astralis:w-full astralis:flex astralis:items-center astralis:gap-3 astralis:text-left astralis:font-medium astralis:text-label-base astralis:cursor-pointer astralis:transition-colors astralis:outline-none astralis:focus-visible:outline-2 astralis:focus-visible:outline-offset-[-2px] astralis:focus-visible:outline-accent-ring astralis:disabled:cursor-not-allowed astralis:disabled:opacity-moderate",
+  {
+    variants: {
+      size: {
+        sm: "astralis:px-3 astralis:py-2 astralis:text-sm",
+        md: "astralis:px-4 astralis:py-3 astralis:text-base",
+        lg: "astralis:px-5 astralis:py-4 astralis:text-lg"
+      },
+      variant: {
+        enclosed: "astralis:hover:bg-surface-subtle",
+        outline: "astralis:hover:bg-surface-subtle",
+        separated: "astralis:hover:bg-surface-subtle",
+        subtle: "astralis:hover:bg-accent-subtle",
+        plain: ""
+      },
+      open: { true: "", false: "" }
+    },
+    compoundVariants: [
+      // Only the `subtle` variant tints its open header with the accent hue.
+      { variant: "subtle", open: !0, class: "astralis:bg-accent-subtle astralis:text-accent-label" }
+    ],
+    defaultVariants: { size: "md", variant: "enclosed", open: !1 }
+  }
+), e = a("astralis:text-label-muted", {
+  variants: {
+    size: {
+      // pt is set so (trigger pad-bottom + content pad-top) === content pad-bottom,
+      // making the gap above the body equal the gap below it.
+      sm: "astralis:px-3 astralis:pb-3 astralis:pt-2 astralis:text-sm",
+      md: "astralis:px-4 astralis:pb-4 astralis:pt-2 astralis:text-sm",
+      lg: "astralis:px-5 astralis:pb-5 astralis:pt-2 astralis:text-base"
+    }
+  },
+  defaultVariants: { size: "md" }
+}), i = a(
+  "astralis:shrink-0 astralis:text-label-muted astralis:transition-transform astralis:duration-moderate",
+  {
+    variants: {
+      open: { true: "astralis:rotate-180", false: "astralis:rotate-0" }
+    },
+    defaultVariants: { open: !1 }
+  }
+);
+export {
+  e as accordionContentVariants,
+  i as accordionIndicatorVariants,
+  r as accordionItemVariants,
+  t as accordionRootVariants,
+  l as accordionTriggerVariants
+};

package/dist/components/disclosure/accordion/components/accordion-content.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsx as r } from "react/jsx-runtime";
+import { useRef as c } from "react";
+import { useAccordion as m, useAccordionItem as u } from "../accordion.context.js";
+import { accordionContentVariants as f } from "../accordion.styles.js";
+import { astralisMerge as p } from "../../../../utils/astralis-merge.js";
+function N({ children: o, className: i = "" }) {
+  const { size: n, keepMounted: s } = m(), { open: e, triggerId: a, contentId: l } = u(), t = c(!1);
+  e && (t.current = !0);
+  const d = e || t.current || s;
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      id: l,
+      role: "region",
+      "aria-labelledby": a,
+      "data-state": e ? "open" : "closed",
+      className: "astralis:grid astralis:transition-all astralis:duration-moderate",
+      style: { gridTemplateRows: e ? "1fr" : "0fr" },
+      children: /* @__PURE__ */ r("div", { className: "astralis:overflow-hidden astralis:min-h-0", inert: !e, children: /* @__PURE__ */ r("div", { className: p(f({ size: n }), i), children: d ? o : null }) })
+    }
+  );
+}
+export {
+  N as AccordionContent
+};

package/dist/components/disclosure/accordion/components/accordion-item.js

@@ -0,0 +1,30 @@
+"use client";
+import { jsx as i } from "react/jsx-runtime";
+import { useMemo as p } from "react";
+import { useAccordion as f, AccordionItemContext as b } from "../accordion.context.js";
+import { accordionItemVariants as I } from "../accordion.styles.js";
+import { astralisMerge as g } from "../../../../utils/astralis-merge.js";
+function M({ children: d, value: o, disabled: n = !1, className: s = "" }) {
+  const { rootId: e, variant: c, isOpen: a, disabled: m } = f(), t = n || m, r = a(o), l = p(
+    () => ({
+      value: o,
+      open: r,
+      disabled: t,
+      triggerId: `${e}-trigger-${o}`,
+      contentId: `${e}-content-${o}`
+    }),
+    [o, r, t, e]
+  );
+  return /* @__PURE__ */ i(b.Provider, { value: l, children: /* @__PURE__ */ i(
+    "div",
+    {
+      "data-state": r ? "open" : "closed",
+      "data-disabled": t ? "" : void 0,
+      className: g(I({ variant: c, disabled: t }), s),
+      children: d
+    }
+  ) });
+}
+export {
+  M as AccordionItem
+};