import { defineComponent as C, useAttrs as S, useCssModule as w, computed as u, openBlock as o, createBlock as T, normalizeClass as l, unref as V, withCtx as i, createElementVNode as a, createVNode as m, normalizeStyle as f, toDisplayString as n, createElementBlock as p } from "vue";
import { getContrastingTextColor as $ } from "@leaflink/stash-utils/getContrastingTextColor";
import y from "./Icon.js";
import E from "./Select.js";
import { _ as N } from "./_plugin-vue_export-helper-CHgC5LLL.js";
const O = { class: "mr-6 truncate" }, z = {
  key: 1,
  class: "flex items-center",
  "data-test": "select-status|value"
}, M = { class: "ml-1.5 mr-6 truncate" }, D = { class: "flex min-w-0" }, I = /* @__PURE__ */ C({
  name: "ll-select-status",
  __name: "SelectStatus",
  props: {
    disabled: { type: Boolean, default: !1 },
    displayBy: { default: "name" },
    secondary: { type: Boolean, default: !1 },
    noTruncate: { type: Boolean, default: !1 },
    placeholder: { default: "Select Status" },
    statusOptions: {},
    trackBy: { default: "id" },
    modelValue: { type: [Number, String, Boolean] },
    value: { type: [Number, String, Boolean, null], default: null },
    label: { default: void 0 }
  },
  emits: ["update:model-value"],
  setup(h, { emit: _ }) {
    const v = S(), x = w(), t = h;
    if (t.value)
      throw new Error("ll-select-status: use :model-value or v-model instead of :value.");
    if (v.onInput)
      throw new Error("ll-select-status: use the @update:model-value event instead of @input");
    const b = _, r = u(() => t.statusOptions.find((e) => e[t.trackBy] === t.modelValue)), B = u(() => {
      var c;
      const e = (c = r.value) == null ? void 0 : c.color;
      return e ? $({ stashToken: e }).token === "ice-900" : !1;
    });
    function k(e) {
      return e != null && e.includes("-") ? `bg-${e}` : `bg-${e}-500`;
    }
    function d(e) {
      return e != null && e.includes("-") ? `text-${e}` : `text-${e}-500`;
    }
    function g(e) {
      b("update:model-value", (e == null ? void 0 : e[t.trackBy]) ?? "");
    }
    return (e, c) => (o(), T(E, {
      ref: "select",
      "hide-search": "",
      single: "",
      class: l([[
        V(x).select,
        {
          "stash-select-status--filled": t.secondary,
          "stash-select-status--filled-dark": t.secondary && B.value
        }
      ], "stash-select-status"]),
      disabled: t.disabled,
      icon: !t.disabled && "caret-down",
      options: t.statusOptions,
      placeholder: t.placeholder,
      "track-by": t.trackBy,
      "model-value": r.value,
      label: t.label,
      "data-test": "stash-select-status",
      "onUpdate:modelValue": g
    }, {
      selected: i(({ option: s }) => [
        t.secondary ? (o(), p("div", {
          key: 0,
          class: l(["stash-select-status--selected absolute inset-0 flex size-full items-center rounded pl-3", [k(s.color)]]),
          "data-test": "select-status|value"
        }, [
          a("span", O, n(s[t.displayBy]), 1)
        ], 2)) : (o(), p("div", z, [
          m(y, {
            "data-test": "select-status|value-icon",
            name: s.icon || "circle-status",
            class: l([
              { [d(s.color)]: s.color },
              { "text-ice-700": !s.color && !s.hexCode }
            ]),
            style: f({ color: s.hexCode })
          }, null, 8, ["name", "class", "style"]),
          a("span", M, n(s[t.displayBy]), 1)
        ]))
      ]),
      option: i(({ option: s }) => [
        a("div", D, [
          m(y, {
            "data-test": "svg|status-color",
            name: s.icon || "circle-status",
            class: l([[
              { [d(s.color)]: s.color },
              { "text-ice-700": !s.color && !s.hexCode }
            ], "!shrink-0"]),
            style: f({ color: s.hexCode })
          }, null, 8, ["name", "class", "style"]),
          a("span", {
            "data-test": "span|option-text",
            class: l(["ml-1.5", !t.noTruncate && "truncate"])
          }, n(s[t.displayBy]), 3)
        ])
      ]),
      _: 1
    }, 8, ["class", "disabled", "icon", "options", "placeholder", "track-by", "model-value", "label"]));
  }
}), A = "_select__3cYb", F = {
  select: A
}, U = {
  $style: F
}, J = /* @__PURE__ */ N(I, [["__cssModules", U]]);
export {
  J as default
};
//# sourceMappingURL=SelectStatus.js.map
