import { o as z } from "./rolldown-runtime.js";
import { i as k, n as O, t as P } from "./vendor/react.js";
import { t as R } from "./chevron-down.js";
import { t as S } from "./pencil.js";
import { t as s } from "./utils.js";
import { t as V } from "./create-safe-context.js";
import { n as H, r as L, t as q } from "./CollapsiblePanel.js";
var i = /* @__PURE__ */ z(k(), 1), n = P(), [M, C] = V("AccordionCard"), Z = i.forwardRef(({ open: e, defaultOpen: t = !1, onOpenChange: r, disabled: o = !1, size: a = "default", className: d, children: l, ...p }, f) => {
  const [w, E] = i.useState(t), m = e !== void 0, u = m ? e : w, h = i.useCallback((b) => {
    o || (m || E(b), r?.(b));
  }, [
    o,
    m,
    r
  ]), T = i.useMemo(() => ({
    open: u,
    setOpen: h,
    disabled: o
  }), [
    u,
    h,
    o
  ]);
  return /* @__PURE__ */ (0, n.jsx)(M.Provider, {
    value: T,
    children: /* @__PURE__ */ (0, n.jsx)(L, {
      open: u,
      onOpenChange: h,
      disabled: o,
      children: /* @__PURE__ */ (0, n.jsx)("div", {
        ref: f,
        "data-slot": "accordion-card",
        "data-size": a,
        "data-state": u ? "open" : "closed",
        className: s("bg-card text-card-foreground rounded-xl border border-transparent shadow-xs overflow-hidden transition-[shadow,border-color] duration-200 hover:shadow-sm data-[state=open]:border-border", "data-[size=sm]:text-sm", d),
        ...p,
        children: l
      })
    })
  });
}), _ = i.forwardRef(({ showDivider: e = !0, className: t, children: r, ...o }, a) => {
  const { open: d } = C();
  return /* @__PURE__ */ (0, n.jsx)("div", {
    ref: a,
    "data-slot": "accordion-card-header",
    className: s("flex items-center gap-2 py-5 px-6 border-b transition-colors duration-300", e && d ? "border-border" : "border-transparent", t),
    ...o,
    children: r
  });
}), x = i.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ (0, n.jsx)("h3", {
  ref: r,
  "data-slot": "accordion-card-title",
  className: s("text-lg font-semibold text-foreground", e),
  ...t
})), y = i.forwardRef(({ onClick: e, icon: t, className: r, ...o }, a) => {
  const { setOpen: d, disabled: l } = C();
  function p(f) {
    l || e?.(f) !== !1 && d(!0);
  }
  return /* @__PURE__ */ (0, n.jsx)("button", {
    ref: a,
    type: "button",
    "aria-label": o["aria-label"] ?? "Edit",
    "data-slot": "accordion-card-edit",
    onClick: p,
    disabled: l,
    className: s("group inline-flex items-center justify-center shrink-0 size-9 rounded-md text-muted-foreground hover:text-foreground hover:bg-muted transition-colors duration-200 motion-reduce:transition-none", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", "disabled:pointer-events-none disabled:opacity-50", r),
    ...o,
    children: t ?? /* @__PURE__ */ (0, n.jsx)(S, { className: "size-5 transition-transform duration-200 group-hover:-rotate-12 motion-reduce:transition-none" })
  });
}), N = i.forwardRef(({ className: e, children: t, ...r }, o) => /* @__PURE__ */ (0, n.jsx)(H, {
  ref: o,
  "aria-label": "Toggle section",
  "data-slot": "accordion-card-trigger",
  className: s("ml-auto inline-flex items-center justify-center shrink-0 size-9 rounded-md text-muted-foreground hover:text-foreground hover:bg-muted transition-colors duration-200 motion-reduce:transition-none", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", "disabled:pointer-events-none disabled:opacity-50", e),
  ...r,
  children: t ?? /* @__PURE__ */ (0, n.jsx)(R, { className: "size-5 transition-transform duration-300 ease-decelerate motion-reduce:transition-none [[data-state=open]_&]:rotate-180" })
})), A = i.forwardRef(({ className: e, children: t, ...r }, o) => /* @__PURE__ */ (0, n.jsx)(q, {
  ref: o,
  "data-slot": "accordion-card-content",
  className: "grid overflow-hidden transition-[grid-template-rows] duration-300 ease-decelerate motion-reduce:transition-none data-[state=closed]:grid-rows-[0fr] data-[state=open]:grid-rows-[1fr]",
  ...r,
  children: /* @__PURE__ */ (0, n.jsx)("div", {
    className: "min-h-0",
    children: /* @__PURE__ */ (0, n.jsx)("div", {
      className: s("p-6", e),
      children: t
    })
  })
}));
_.displayName = "AccordionCard.Header";
x.displayName = "AccordionCard.Title";
y.displayName = "AccordionCard.Edit";
N.displayName = "AccordionCard.Trigger";
A.displayName = "AccordionCard.Content";
var j = Object.assign(Z, {
  Header: _,
  Title: x,
  Edit: y,
  Trigger: N,
  Content: A
});
j.displayName = "AccordionCard";
var $ = O(), c = {};
function g(e, t) {
  if (e !== null)
    switch (t) {
      case "number":
        return Number(e);
      case "boolean":
        return e !== "false" && e !== "0";
      case "json":
        try {
          return JSON.parse(e);
        } catch {
          return e;
        }
      default:
        return e;
    }
}
var v = class extends HTMLElement {
  _root = null;
  _childrenContainer = null;
  _props = {};
  _initialized = !1;
  connectedCallback() {
    setTimeout(() => this._initialize(), 0);
  }
  _initialize() {
    if (this._initialized) return;
    this._initialized = !0;
    const e = [];
    for (const r of Array.from(this.childNodes))
      r.nodeType === Node.TEXT_NODE && !r.textContent?.trim() || e.push(r);
    const t = document.createElement("div");
    for (t.style.display = "contents", this._childrenContainer = document.createElement("div"), this._childrenContainer.style.display = "contents", e.forEach((r) => this._childrenContainer.appendChild(r)); this.firstChild; ) this.removeChild(this.firstChild);
    this.appendChild(t), this._root = (0, $.createRoot)(t), this._render();
  }
  disconnectedCallback() {
    this._root?.unmount(), this._root = null;
  }
  attributeChangedCallback(e, t, r) {
    this._render();
  }
  static get observedAttributes() {
    return Object.keys(c).map((e) => e.replace(/([A-Z])/g, "-$1").toLowerCase());
  }
  _setProp(e, t) {
    const r = c[e] || "string";
    this._props[e] = this._parseValue(t, r), this._render();
  }
  _parseValue(e, t) {
    if (t === "boolean" && typeof e == "boolean" || t === "number" && typeof e == "number" || t === "string" && typeof e == "string") return e;
    if (typeof e == "string") switch (t) {
      case "boolean":
        return e !== "false" && e !== "0" && e !== "";
      case "number":
        return Number(e);
      case "json":
        try {
          return JSON.parse(e);
        } catch {
          return e;
        }
      default:
        return e;
    }
    return e;
  }
  _getProp(e) {
    if (e in this._props) return this._props[e];
    const t = e.replace(/([A-Z])/g, "-$1").toLowerCase(), r = c[e] || "string";
    return g(this.getAttribute(t), r);
  }
  _render() {
    if (!this._root || !this._childrenContainer) return;
    const e = {};
    for (const [r, o] of Object.entries(c)) if (r in this._props) e[r] = this._props[r];
    else {
      const a = r.replace(/([A-Z])/g, "-$1").toLowerCase();
      e[r] = g(this.getAttribute(a), o);
    }
    const t = i.createElement(j, {
      ...e,
      _hostElement: this
    }, i.createElement("span", {
      ref: (r) => {
        r && this._childrenContainer && r.replaceWith(this._childrenContainer);
      },
      style: { display: "contents" }
    }));
    this._root.render(t);
  }
};
for (const e of Object.keys(c)) Object.defineProperty(v.prototype, e, {
  get() {
    return this._getProp(e);
  },
  set(t) {
    this._setProp(e, t);
  },
  enumerable: !0,
  configurable: !0
});
typeof customElements < "u" && !customElements.get("hf-accordion-card") && customElements.define("hf-accordion-card", v);
export {
  v as AccordionCardWC,
  v as default
};

//# sourceMappingURL=hf-accordion-card.js.map