import { defineComponent as x, useAttrs as v, useSlots as g, computed as c, openBlock as i, createElementBlock as d, unref as o, normalizeClass as s, createElementVNode as a, mergeProps as y, withDirectives as A, vModelCheckbox as C, toDisplayString as b, createCommentVNode as p, renderSlot as S, createTextVNode as V } from "vue";
import B from "@leaflink/snitch";
import { uniqueId as T } from "es-toolkit/compat";
const E = ["data-test"], N = ["for"], z = { class: "relative inline-block h-5 w-[34px] min-w-[34px]" }, D = ["id", "disabled", "name", "value"], P = /* @__PURE__ */ x({
  name: "ll-switch",
  inheritAttrs: !1,
  __name: "Switch",
  props: {
    checked: { type: [Boolean, Array], default: !1 },
    disabled: { type: Boolean, default: !1 },
    hintText: { default: "" },
    id: { default: void 0 },
    label: { default: "" },
    name: { default: "" },
    value: { default: "" }
  },
  emits: ["update:checked"],
  setup(n, { emit: w }) {
    const e = n, l = v(), _ = g(), f = w;
    if (typeof e.value == "boolean" && B.warn("Switch: use `checked` to toggle the state; `value` is what will be set if `checked` is true"), l.onChange)
      throw new Error("ll-switch: use the @update:checked event instead of @change.");
    const k = c(() => {
      const t = { ...l };
      return delete t["data-test"], delete t.class, t;
    }), h = c({
      get() {
        return e.checked;
      },
      set(t) {
        f("update:checked", t);
      }
    }), r = c(() => e.id || T("switch-"));
    return (t, u) => (i(), d("div", {
      class: s(["stash-switch", o(l).class]),
      "data-test": o(l)["data-test"] || "stash-switch"
    }, [
      a("label", y({
        for: r.value,
        class: [{ "pointer-events-none": e.disabled }, "flex cursor-pointer"],
        "data-test": "stash-switch|label"
      }, k.value), [
        a("span", z, [
          a("span", {
            class: s(["stash-switch__track absolute top-0.5 h-4 w-full rounded-[10px]", {
              "bg-blue-500": e.checked && !e.disabled,
              "bg-ice-700": !e.checked && !e.disabled,
              "stash-switch__track--disabled bg-ice-500": e.disabled,
              "stash-switch__track--on": e.checked,
              "stash-switch__track--off": !e.checked
            }]),
            "data-test": "stash-switch|track"
          }, null, 2),
          a("span", {
            class: s(["stash-switch__control absolute left-0 size-5 rounded-[10px] border border-solid border-ice-500 bg-white shadow transition-transform duration-200 ease-in-out", [
              {
                "translate-x-[14px]": e.checked,
                "translate-x-0": !e.checked,
                "stash-switch__control--on": e.checked,
                "stash-switch__control--off": !e.checked,
                "stash-switch__control--disabled": e.disabled
              }
            ]]),
            "data-test": "stash-switch|control"
          }, null, 2)
        ]),
        A(a("input", {
          id: r.value,
          "onUpdate:modelValue": u[0] || (u[0] = (m) => h.value = m),
          type: "checkbox",
          disabled: e.disabled,
          name: e.name,
          tabindex: "0",
          value: n.value,
          class: "sr-only"
        }, null, 8, D), [
          [C, h.value]
        ]),
        e.label ? (i(), d("span", {
          key: 0,
          class: s([{
            "text-ice-900": e.checked && !e.disabled,
            "text-ice-700": !e.checked && !e.disabled,
            "stash-switch__label-text--on": e.checked,
            "stash-switch__label-text--off": !e.checked,
            "stash-switch__label-text--disabled text-ice-500": e.disabled
          }, "stash-switch__label-text relative top-px ml-1.5"]),
          "data-test": "stash-switch|label-text"
        }, b(e.label), 3)) : p("", !0)
      ], 16, N),
      e.hintText || o(_).hint ? (i(), d("span", {
        key: 0,
        class: s(["stash-switch__hint ml-[40px] mt-1.5 block whitespace-pre-line text-xs", { "stash-switch__hint--disabled text-ice-500": e.disabled }]),
        "data-test": "stash-switch|hint"
      }, [
        S(t.$slots, "hint", {}, () => [
          V(b(e.hintText), 1)
        ])
      ], 2)) : p("", !0)
    ], 10, E));
  }
});
export {
  P as _
};
//# sourceMappingURL=Switch.vue_vue_type_script_setup_true_lang-BxrNfyoU.js.map
