import { o as z } from "./rolldown-runtime.js";
import { i as E, n as T, t as v } from "./vendor/react.js";
import { t as A } from "./check.js";
import { t as L } from "./copy.js";
import { t as S } from "./Button.js";
import { t as _ } from "./dist.js";
import { t as i } from "./utils.js";
import { t as V } from "./lib.js";
var s = /* @__PURE__ */ z(E(), 1), n = v(), O = _("overflow-hidden rounded-xl bg-background", {
  variants: { size: {
    sm: "text-xs",
    md: "text-base",
    lg: "text-lg"
  } },
  defaultVariants: { size: "md" }
}), P = _("select-none font-mono font-bold leading-normal text-quaternary-foreground", {
  variants: { size: {
    sm: "text-xs",
    md: "text-base",
    lg: "text-lg"
  } },
  defaultVariants: { size: "md" }
});
function q({ count: e, startLine: t, size: r }) {
  return /* @__PURE__ */ (0, n.jsx)("div", {
    "aria-hidden": "true",
    className: i(P({ size: r })),
    children: Array.from({ length: e }, (l, o) => /* @__PURE__ */ (0, n.jsx)("span", {
      className: "block mb-px last:mb-0",
      children: t + o
    }, o))
  });
}
var b = s.forwardRef(({ code: e, language: t, showLineNumbers: r = !0, startLineNumber: l = 1, showCopyButton: o = !1, size: p, className: x, breakpoint: m = "desktop" }, y) => {
  const C = s.useMemo(() => V(e), [e]), N = s.useMemo(() => e.split(`
`).length, [e]), [u, h] = s.useState(!1), d = s.useRef(null);
  s.useImperativeHandle(y, () => d.current);
  const j = s.useCallback(async () => {
    try {
      const c = d.current?.ownerDocument.defaultView;
      if (!c) return;
      await c.navigator.clipboard.writeText(e), h(!0), setTimeout(() => h(!1), 2e3);
    } catch (c) {
      console.error("Failed to copy code:", c);
    }
  }, [e]), w = m === "mobile" ? "p-4" : "p-6", k = m === "mobile" ? "py-4 px-4 pb-6" : "py-6 px-6 pb-8";
  return /* @__PURE__ */ (0, n.jsxs)("div", {
    ref: d,
    "data-slot": "code-snippet",
    role: "region",
    "aria-label": "Code snippet",
    className: i(O({ size: p }), "relative flex items-start justify-center", x),
    children: [
      (t || o) && /* @__PURE__ */ (0, n.jsxs)("div", {
        className: "absolute top-2 end-2 flex items-center gap-2 z-10",
        children: [t && /* @__PURE__ */ (0, n.jsx)("span", {
          className: "text-xs font-medium text-quaternary-foreground uppercase select-none",
          children: t
        }), o && /* @__PURE__ */ (0, n.jsx)(S, {
          appearance: "ghost",
          variant: "secondary",
          size: "sm",
          onClick: j,
          "aria-label": u ? "Copied to clipboard" : "Copy code to clipboard",
          className: "h-7 px-2 text-quaternary-foreground hover:text-secondary-foreground transition-colors duration-150 ease-out",
          children: u ? /* @__PURE__ */ (0, n.jsx)(A, { className: "size-3.5 text-success" }) : /* @__PURE__ */ (0, n.jsx)(L, { className: "size-3.5" })
        })]
      }),
      r && /* @__PURE__ */ (0, n.jsx)("div", {
        className: i("shrink-0 self-stretch bg-muted border-e border-border", w),
        children: /* @__PURE__ */ (0, n.jsx)(q, {
          count: N,
          startLine: l,
          size: p
        })
      }),
      /* @__PURE__ */ (0, n.jsx)("div", {
        className: i("grow min-w-0 overflow-x-auto", k),
        tabIndex: 0,
        children: /* @__PURE__ */ (0, n.jsx)("pre", {
          className: i("font-mono font-medium leading-normal !bg-transparent !p-0 !m-0 !border-0 !rounded-none", "[&_.sh__line]:block [&_.sh__line]:leading-normal [&_.sh__line]:mb-px [&_.sh__line:last-child]:mb-0"),
          dangerouslySetInnerHTML: { __html: C }
        })
      })
    ]
  });
});
b.displayName = "CodeSnippet";
var M = T(), a = {
  variant: "string",
  size: "string",
  code: "string",
  language: "string",
  showLineNumbers: "boolean",
  startLineNumber: "number",
  showCopyButton: "boolean",
  className: "string",
  breakpoint: "string"
};
function f(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 g = 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, M.createRoot)(t), this._render();
  }
  disconnectedCallback() {
    this._root?.unmount(), this._root = null;
  }
  attributeChangedCallback(e, t, r) {
    this._render();
  }
  static get observedAttributes() {
    return Object.keys(a).map((e) => e.replace(/([A-Z])/g, "-$1").toLowerCase());
  }
  _setProp(e, t) {
    const r = a[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 = a[e] || "string";
    return f(this.getAttribute(t), r);
  }
  _render() {
    if (!this._root) return;
    const e = {};
    for (const [r, l] of Object.entries(a)) if (r in this._props) e[r] = this._props[r];
    else {
      const o = r.replace(/([A-Z])/g, "-$1").toLowerCase();
      e[r] = f(this.getAttribute(o), l);
    }
    const t = s.createElement(b, {
      ...e,
      _hostElement: this
    });
    this._root.render(t);
  }
};
for (const e of Object.keys(a)) Object.defineProperty(g.prototype, e, {
  get() {
    return this._getProp(e);
  },
  set(t) {
    this._setProp(e, t);
  },
  enumerable: !0,
  configurable: !0
});
typeof customElements < "u" && !customElements.get("hf-code-snippet") && customElements.define("hf-code-snippet", g);
export {
  g as CodeSnippetWC,
  g as default
};

//# sourceMappingURL=hf-code-snippet.js.map