import { o as C } from "./rolldown-runtime.js";
import { i as b, n as x, t as y } from "./vendor/react.js";
import { t as i } from "./utils.js";
var s = y();
function o({ className: t, size: e = "default", ...r }) {
  return /* @__PURE__ */ (0, s.jsx)("div", {
    "data-slot": "card",
    "data-size": e,
    className: i("ring-foreground/10 bg-card text-card-foreground gap-6 overflow-hidden rounded-xl py-6 text-sm shadow-xs ring-1 has-[>img:first-child]:pt-0 data-[size=sm]:gap-4 data-[size=sm]:py-4 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl group/card flex flex-col", t),
    ...r
  });
}
o.displayName = "Card";
function c({ className: t, ...e }) {
  return /* @__PURE__ */ (0, s.jsx)("div", {
    "data-slot": "card-header",
    className: i("gap-1 rounded-t-xl px-6 group-data-[size=sm]/card:px-4 [.border-b]:pb-6 group-data-[size=sm]/card:[.border-b]:pb-4 group/card-header @container/card-header grid auto-rows-min items-start has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto]", t),
    ...e
  });
}
c.displayName = "Card.Header";
function l({ className: t, ...e }) {
  return /* @__PURE__ */ (0, s.jsx)("div", {
    "data-slot": "card-title",
    className: i("text-base leading-normal font-medium group-data-[size=sm]/card:text-sm", t),
    ...e
  });
}
l.displayName = "Card.Title";
function p({ className: t, ...e }) {
  return /* @__PURE__ */ (0, s.jsx)("div", {
    "data-slot": "card-description",
    className: i("text-muted-foreground text-sm", t),
    ...e
  });
}
p.displayName = "Card.Description";
function u({ className: t, ...e }) {
  return /* @__PURE__ */ (0, s.jsx)("div", {
    "data-slot": "card-action",
    className: i("col-start-2 row-span-2 row-start-1 self-start justify-self-end", t),
    ...e
  });
}
u.displayName = "Card.Action";
function m({ className: t, ...e }) {
  return /* @__PURE__ */ (0, s.jsx)("div", {
    "data-slot": "card-content",
    className: i("px-6 group-data-[size=sm]/card:px-4", t),
    ...e
  });
}
m.displayName = "Card.Content";
function h({ className: t, ...e }) {
  return /* @__PURE__ */ (0, s.jsx)("div", {
    "data-slot": "card-footer",
    className: i("rounded-b-xl px-6 group-data-[size=sm]/card:px-4 [.border-t]:pt-6 group-data-[size=sm]/card:[.border-t]:pt-4 flex items-center", t),
    ...e
  });
}
h.displayName = "Card.Footer";
var N = Object.assign(o, {
  Root: o,
  Header: c,
  Title: l,
  Description: p,
  Action: u,
  Content: m,
  Footer: h
}), n = /* @__PURE__ */ C(b(), 1), j = x(), a = {};
function d(t, e) {
  if (t !== null)
    switch (e) {
      case "number":
        return Number(t);
      case "boolean":
        return t !== "false" && t !== "0";
      case "json":
        try {
          return JSON.parse(t);
        } catch {
          return t;
        }
      default:
        return t;
    }
}
var f = class extends HTMLElement {
  _root = null;
  _childrenContainer = null;
  _props = {};
  _initialized = !1;
  connectedCallback() {
    setTimeout(() => this._initialize(), 0);
  }
  _initialize() {
    if (this._initialized) return;
    this._initialized = !0;
    const t = [];
    for (const r of Array.from(this.childNodes))
      r.nodeType === Node.TEXT_NODE && !r.textContent?.trim() || t.push(r);
    const e = document.createElement("div");
    for (e.style.display = "contents", this._childrenContainer = document.createElement("div"), this._childrenContainer.style.display = "contents", t.forEach((r) => this._childrenContainer.appendChild(r)); this.firstChild; ) this.removeChild(this.firstChild);
    this.appendChild(e), this._root = (0, j.createRoot)(e), this._render();
  }
  disconnectedCallback() {
    this._root?.unmount(), this._root = null;
  }
  attributeChangedCallback(t, e, r) {
    this._render();
  }
  static get observedAttributes() {
    return Object.keys(a).map((t) => t.replace(/([A-Z])/g, "-$1").toLowerCase());
  }
  _setProp(t, e) {
    const r = a[t] || "string";
    this._props[t] = this._parseValue(e, r), this._render();
  }
  _parseValue(t, e) {
    if (e === "boolean" && typeof t == "boolean" || e === "number" && typeof t == "number" || e === "string" && typeof t == "string") return t;
    if (typeof t == "string") switch (e) {
      case "boolean":
        return t !== "false" && t !== "0" && t !== "";
      case "number":
        return Number(t);
      case "json":
        try {
          return JSON.parse(t);
        } catch {
          return t;
        }
      default:
        return t;
    }
    return t;
  }
  _getProp(t) {
    if (t in this._props) return this._props[t];
    const e = t.replace(/([A-Z])/g, "-$1").toLowerCase(), r = a[t] || "string";
    return d(this.getAttribute(e), r);
  }
  _render() {
    if (!this._root || !this._childrenContainer) return;
    const t = {};
    for (const [r, _] of Object.entries(a)) if (r in this._props) t[r] = this._props[r];
    else {
      const g = r.replace(/([A-Z])/g, "-$1").toLowerCase();
      t[r] = d(this.getAttribute(g), _);
    }
    const e = n.createElement(N, {
      ...t,
      _hostElement: this
    }, n.createElement("span", {
      ref: (r) => {
        r && this._childrenContainer && r.replaceWith(this._childrenContainer);
      },
      style: { display: "contents" }
    }));
    this._root.render(e);
  }
};
for (const t of Object.keys(a)) Object.defineProperty(f.prototype, t, {
  get() {
    return this._getProp(t);
  },
  set(e) {
    this._setProp(t, e);
  },
  enumerable: !0,
  configurable: !0
});
typeof customElements < "u" && !customElements.get("hf-card") && customElements.define("hf-card", f);
export {
  f as CardWC,
  f as default
};

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