import { defineComponent as v, computed as u, openBlock as d, createElementBlock as f, unref as b, createCommentVNode as C } from "vue";
import { replaceVariables as k } from "@scalar/api-client";
import { useClipboard as T } from "../../../hooks/useClipboard.js";
const _ = ["title", "innerHTML"], y = /* @__PURE__ */ v({
  __name: "ServerItem",
  props: {
    value: {},
    variables: {}
  },
  setup(p) {
    const n = p, { copyToClipboard: i } = T(), o = u(() => {
      var l;
      const r = (((l = n.value) == null ? void 0 : l.url) ?? "").replace(/(<([^>]+)>)/gi, "");
      return k(r, (a) => {
        var s;
        const e = (s = n.variables) == null ? void 0 : s.find(
          (m) => m.name === a
        );
        return `<span class="base-url-variable">${((e == null ? void 0 : e.value) ?? "") !== "" ? e == null ? void 0 : e.value : `{${a}}`}</span>`;
      });
    }), c = u(
      () => o.value.replace(/(<([^>]+)>)/gi, "")
    );
    return (t, r) => t.value ? (d(), f("a", {
      key: 0,
      class: "base-url",
      title: t.value.description,
      onClick: r[0] || (r[0] = (l) => b(i)(c.value)),
      innerHTML: o.value
    }, null, 8, _)) : C("", !0);
  }
});
export {
  y as default
};
