import { jsx as g } from "react/jsx-runtime";
import { a as Q } from "../index-BmAFn37q.mjs";
import { a as X } from "../Slot-C98rL4yy.mjs";
import * as u from "react";
import { i as U, c as Y, j as P, k as Z, a as R, l as ee } from "../useOpenChangeComplete-RUbg6RBw.mjs";
import { c as ne, u as te, C as oe, a as V, t as le, w as se, b as ae } from "../useCollapsiblePanel-kbMNl4Z4.mjs";
const I = {
  ...ne,
  ...U
}, _ = /* @__PURE__ */ u.forwardRef(function(e, t) {
  const {
    render: l,
    className: s,
    defaultOpen: a = !1,
    disabled: h = !1,
    onOpenChange: r,
    open: C,
    ...p
  } = e, c = Y(r), o = te({
    open: C,
    defaultOpen: a,
    onOpenChange: c,
    disabled: h
  }), i = u.useMemo(() => ({
    open: o.open,
    disabled: o.disabled,
    transitionStatus: o.transitionStatus
  }), [o.open, o.disabled, o.transitionStatus]), b = u.useMemo(() => ({
    ...o,
    onOpenChange: c,
    state: i
  }), [o, c, i]), d = P("div", e, {
    state: i,
    ref: t,
    props: p,
    stateAttributesMapping: I
  });
  return /* @__PURE__ */ g(oe.Provider, {
    value: b,
    children: d
  });
});
process.env.NODE_ENV !== "production" && (_.displayName = "CollapsibleRoot");
const ie = {
  ...le,
  ...U
}, j = /* @__PURE__ */ u.forwardRef(function(e, t) {
  const {
    panelId: l,
    open: s,
    handleTrigger: a,
    state: h,
    disabled: r
  } = V(), {
    className: C,
    disabled: p = r,
    id: c,
    render: o,
    nativeButton: i = !0,
    ...b
  } = e, {
    getButtonProps: d,
    buttonRef: v
  } = Z({
    disabled: p,
    focusableWhenDisabled: !0,
    native: i
  }), f = u.useMemo(() => ({
    "aria-controls": s ? l : void 0,
    "aria-expanded": s,
    disabled: p,
    onClick: a
  }), [l, p, s, a]);
  return P("button", e, {
    state: h,
    ref: [t, v],
    props: [f, b, d],
    stateAttributesMapping: ie
  });
});
process.env.NODE_ENV !== "production" && (j.displayName = "CollapsibleTrigger");
let A = /* @__PURE__ */ (function(n) {
  return n.collapsiblePanelHeight = "--collapsible-panel-height", n.collapsiblePanelWidth = "--collapsible-panel-width", n;
})({});
const B = /* @__PURE__ */ u.forwardRef(function(e, t) {
  const {
    className: l,
    hiddenUntilFound: s,
    keepMounted: a,
    render: h,
    id: r,
    ...C
  } = e;
  process.env.NODE_ENV !== "production" && R(() => {
    s && a === !1 && se("The `keepMounted={false}` prop on a Collapsible will be ignored when using `hiddenUntilFound` since it requires the Panel to remain mounted even when closed.");
  }, [s, a]);
  const {
    abortControllerRef: p,
    animationTypeRef: c,
    height: o,
    mounted: i,
    onOpenChange: b,
    open: d,
    panelId: v,
    panelRef: f,
    runOnceAnimationsFinish: k,
    setDimensions: E,
    setHiddenUntilFound: T,
    setKeepMounted: D,
    setMounted: W,
    setPanelIdState: M,
    setOpen: $,
    setVisible: q,
    state: F,
    transitionDimensionRef: K,
    visible: L,
    width: S,
    transitionStatus: O
  } = V(), N = s ?? !1, m = a ?? !1;
  R(() => {
    if (r)
      return M(r), () => {
        M(void 0);
      };
  }, [r, M]), R(() => {
    T(N);
  }, [T, N]), R(() => {
    D(m);
  }, [D, m]);
  const {
    props: z
  } = ae({
    abortControllerRef: p,
    animationTypeRef: c,
    externalRef: t,
    height: o,
    hiddenUntilFound: N,
    id: v,
    keepMounted: m,
    mounted: i,
    onOpenChange: b,
    open: d,
    panelRef: f,
    runOnceAnimationsFinish: k,
    setDimensions: E,
    setMounted: W,
    setOpen: $,
    setVisible: q,
    transitionDimensionRef: K,
    visible: L,
    width: S
  });
  ee({
    open: d && O === "idle",
    ref: f,
    onComplete() {
      d && E({
        height: void 0,
        width: void 0
      });
    }
  });
  const G = u.useMemo(() => ({
    ...F,
    transitionStatus: O
  }), [F, O]), J = P("div", e, {
    state: G,
    ref: [t, f],
    props: [z, {
      style: {
        [A.collapsiblePanelHeight]: o === void 0 ? "auto" : `${o}px`,
        [A.collapsiblePanelWidth]: S === void 0 ? "auto" : `${S}px`
      }
    }, C],
    stateAttributesMapping: I
  });
  return m || N || !m && i ? J : null;
});
process.env.NODE_ENV !== "production" && (B.displayName = "CollapsiblePanel");
function y(n, e) {
  const t = n ? X : e;
  return n ? ({ ...l }) => /* @__PURE__ */ g(t, { ...l }) : void 0;
}
const w = ({
  asChild: n = !1,
  className: e,
  children: t,
  hiddenUntilFound: l = !0,
  ...s
}) => {
  const a = y(n, "div");
  return /* @__PURE__ */ g(
    B,
    {
      "data-spark-component": "collapsible-content",
      className: Q(
        "overflow-hidden",
        "h-[var(--collapsible-panel-height)]",
        "transition-all duration-200",
        "motion-reduce:transition-none",
        "data-[starting-style]:h-0",
        "data-[ending-style]:h-0",
        e
      ),
      render: a,
      hiddenUntilFound: l,
      ...s,
      children: t
    }
  );
};
w.displayName = "Collapsible.Content";
const H = ({ asChild: n = !1, children: e, ...t }) => {
  const l = y(n, "div");
  return /* @__PURE__ */ g(_, { "data-spark-component": "collapsible", render: l, ...t, children: e });
};
H.displayName = "Collapsible";
const x = ({ asChild: n = !1, children: e, ...t }) => {
  const l = y(n, "button");
  return /* @__PURE__ */ g(j, { "data-spark-component": "collapsible-trigger", render: l, ...t, children: e });
};
x.displayName = "Collapsible.Trigger";
const re = Object.assign(H, {
  Trigger: x,
  Content: w
});
re.displayName = "Collapsible";
x.displayName = "Collapsible.Trigger";
w.displayName = "Collapsible.Content";
export {
  re as Collapsible
};
//# sourceMappingURL=index.mjs.map
