@scalar/api-client/dist/components/IconSelector.vue.js

the open source API testing client

import { defineComponent as g, computed as V, createBlock as n, openBlock as s, unref as e, withCtx as o, renderSlot as u, createVNode as a, createElementVNode as d, createTextVNode as p, createElementBlock as k, Fragment as y, renderList as _, toDisplayString as w } from "vue";
import { RadioGroup as S, RadioGroupLabel as m, RadioGroupOption as C } from "@headlessui/vue";
import { ScalarPopover as I } from "@scalar/components";
import { libraryIcons as h, LibraryIcon as B } from "@scalar/icons/library";
const G = { class: "flex text-sm" }, L = { class: "bg-b-1 custom-scroll grid w-dvw max-w-[420px] auto-rows-[32px] grid-cols-[repeat(auto-fill,minmax(32px,1fr))] content-between justify-between rounded border p-1" }, $ = /* @__PURE__ */ g({
  __name: "IconSelector",
  props: {
    modelValue: {},
    placement: {}
  },
  emits: ["update:modelValue"],
  setup(i, { emit: f }) {
    const b = i, x = f, c = V({
      get: () => b.modelValue,
      set: (l) => x("update:modelValue", l)
    });
    return (l, r) => (s(), n(e(I), {
      class: "bg-b-2 rounded",
      focus: "",
      placement: l.placement ?? "bottom"
    }, {
      popover: o(({ close: v }) => [
        a(e(S), {
          modelValue: c.value,
          "onUpdate:modelValue": r[0] || (r[0] = (t) => c.value = t),
          class: "flex flex-col"
        }, {
          default: o(() => [
            d("div", G, [
              a(e(m), { class: "text-c-2 px-1 py-1" }, {
                default: o(() => [
                  u(l.$slots, "title", {}, () => [
                    r[1] || (r[1] = p("Select an icon", -1))
                  ])
                ]),
                _: 3
              })
            ]),
            d("ul", L, [
              (s(!0), k(y, null, _(e(h), (t) => (s(), n(e(C), {
                key: t.src,
                as: "li",
                class: "text-c-3 hover:text-c-2 hover:bg-b-2 ui-checked:bg-b-3 ui-active:bg-b-2 flex cursor-pointer items-center justify-center rounded p-2",
                value: t.src,
                onClick: v
              }, {
                default: o(() => [
                  a(e(m), { class: "sr-only" }, {
                    default: o(() => [
                      p(w(t.src.replaceAll("-", " ")) + " Icon ", 1)
                    ]),
                    _: 2
                  }, 1024),
                  a(e(B), {
                    class: "stroke-[1.5]",
                    src: t.src
                  }, null, 8, ["src"])
                ]),
                _: 2
              }, 1032, ["value", "onClick"]))), 128))
            ])
          ]),
          _: 2
        }, 1032, ["modelValue"])
      ]),
      default: o(() => [
        u(l.$slots, "default")
      ]),
      _: 3
    }, 8, ["placement"]));
  }
});
export {
  $ as default
};