import { defineComponent as R, ref as w, watch as m, unref as o, openBlock as i, createElementBlock as p, normalizeStyle as T, normalizeClass as u, createElementVNode as d, withKeys as H, withModifiers as O, withDirectives as U, mergeProps as X, toHandlers as j, vModelCheckbox as J, createBlock as V, renderSlot as C, toDisplayString as Q, createCommentVNode as W } from "vue";
import { useColors as Y } from "../../composables/useColors.js";
import { useCommon as I } from "../../composables/useCommon.js";
import { useInputtable as f } from "../../composables/useInputtable.js";
import { useInteractive as z } from "../../composables/useInteractive.js";
import { useTheme as Z } from "../../composables/useTheme.js";
import x from "../inputFooter/InputFooter.vue.js";
import _ from "../spinner/Spinner.vue.js";
const ee = ["onKeypress"], se = ["id", "name", "aria-checked", "aria-disabled", "disabled", "required"], le = {
  key: 1,
  name: "check-icon",
  class: "w-2/3 h-[2px] bg-white dark:bg-secondary-900"
}, ae = ["textContent"], oe = {
  ...I.props(),
  ...Y.props("primary"),
  ...z.props(),
  ...f.props(),
  value: [String, Number],
  indeterminate: Boolean,
  glow: Boolean
}, re = {
  name: "XCheckbox",
  validators: {
    ...I.validators()
  }
}, fe = /* @__PURE__ */ R({
  ...re,
  props: oe,
  emits: f.emits(!1),
  setup(A, { expose: B, emit: $ }) {
    const l = A, v = $, b = w(null), a = w(!1);
    function y() {
      a.value = !a.value;
    }
    const { focus: h, blur: F } = z(b), {
      errorInternal: G,
      hideFooterInternal: N,
      isInsideForm: S,
      isInsideFormGroup: c,
      isFirstValidation: q,
      formGroup: r,
      reset: E,
      validate: k,
      setError: K
    } = f(l, { focus: h, emit: v, withListeners: !1 });
    c ? (m(() => r.value, () => {
      const e = o(r.value);
      e && Array.isArray(e) && e.includes(l.value) ? a.value = !0 : a.value = !1;
    }, { immediate: !0, deep: !0 }), m(() => a.value, (e) => {
      if (!l.value)
        return;
      const s = o(r.value);
      if (e)
        if (s && Array.isArray(s)) {
          if (!s.includes(l.value)) {
            const n = [...s, l.value];
            r.setValue(n);
          }
        } else
          r.setValue([l.value]);
      else if (s && Array.isArray(s) && s.includes(l.value)) {
        const n = s.findIndex((P) => P === l.value), g = [...s];
        g.splice(n, 1), r.setValue(g);
      }
    })) : (m(() => l.modelValue, (e) => {
      a.value = !!e;
    }, { immediate: !0 }), m(() => a.value, (e) => {
      v("update:modelValue", e);
    }));
    const L = {
      input: () => {
        c || setTimeout(() => {
          l.validateOnInput && !q.value && k(l.modelValue);
        }, 0);
      }
    }, { styles: M, classes: t, className: D } = Z("Checkbox", {}, l, { checked: a, isInsideForm: S, isInsideFormGroup: c });
    return B({ focus: h, blur: F, toggle: y, reset: E, validate: k, setError: K }), (e, s) => (i(), p("label", {
      style: T(o(M)),
      class: u([
        o(D),
        o(t).wrapper
      ])
    }, [
      d("div", {
        ref_key: "elRef",
        ref: b,
        class: u(o(t).content),
        tabindex: "0",
        onKeypress: H(O(y, ["prevent", "stop"]), ["space"])
      }, [
        U(d("input", X({
          id: e.id,
          "onUpdate:modelValue": s[0] || (s[0] = (n) => a.value = n),
          name: e.name,
          "aria-checked": e.indeterminate ? "mixed" : a.value ? "true" : "false",
          "aria-disabled": e.disabled ? "true" : void 0,
          type: "checkbox",
          class: "invisible absolute",
          disabled: e.disabled || e.loading,
          required: e.required
        }, j(L, !0)), null, 16, se), [
          [J, a.value]
        ]),
        d("div", {
          class: u([
            o(t).box,
            [e.glow && !e.disabled && !e.loading ? e.$style["checkbox--glow"] : ""]
          ])
        }, [
          e.loading ? (i(), V(_, {
            key: 0,
            size: e.size,
            class: "absolute"
          }, null, 8, ["size"])) : e.indeterminate ? (i(), p("span", le)) : C(e.$slots, "icon", { key: 2 }, () => [
            (i(), p("svg", {
              viewBox: "0 0 20 20",
              class: u([o(t).icon, { "opacity-0": !a.value }])
            }, s[1] || (s[1] = [
              d("path", { d: "M0 11l2-2 5 5L18 3l2 2L7 18z" }, null, -1)
            ]), 2))
          ])
        ], 2),
        d("div", {
          class: u(o(t).label)
        }, [
          e.label ? (i(), p("span", {
            key: 0,
            textContent: Q(e.label)
          }, null, 8, ae)) : C(e.$slots, "default", { key: 1 })
        ], 2)
      ], 42, ee),
      o(N) ? W("", !0) : (i(), V(x, {
        key: 0,
        error: o(G),
        helper: e.helper
      }, null, 8, ["error", "helper"]))
    ], 6));
  }
});
export {
  fe as default
};
