@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.mjs

Nextcloud vue components

import "../assets/index45.css";
import s from "./NcLoadingIcon.mjs";
import { G as n } from "../chunks/GenRandomId-1e1b509a.mjs";
import { l as c } from "../chunks/l10n-05baf7da.mjs";
import h from "vue-material-design-icons/CheckboxBlankOutline.vue";
import d from "vue-material-design-icons/MinusBox.vue";
import l from "vue-material-design-icons/CheckboxMarked.vue";
import u from "vue-material-design-icons/RadioboxMarked.vue";
import p from "vue-material-design-icons/RadioboxBlank.vue";
import m from "vue-material-design-icons/ToggleSwitchOff.vue";
import b from "vue-material-design-icons/ToggleSwitch.vue";
import { n as k } from "../chunks/_plugin-vue2_normalizer-5b4c43a4.mjs";
const a = "checkbox", o = "radio", i = "switch", r = "button", f = { name: "NcCheckboxRadioSwitch", components: { NcLoadingIcon: s }, mixins: [c], props: { id: { type: String, default: () => "checkbox-radio-switch-" + n(), validator: (e) => e.trim() !== "" }, name: { type: String, default: null }, type: { type: String, default: "checkbox", validator: (e) => [a, o, i, r].includes(e) }, buttonVariant: { type: Boolean, default: !1 }, buttonVariantGrouped: { type: String, default: "no", validator: (e) => ["no", "vertical", "horizontal"].includes(e) }, checked: { type: [Boolean, Array, String], default: !1 }, value: { type: String, default: null }, disabled: { type: Boolean, default: !1 }, indeterminate: { type: Boolean, default: !1 }, required: { type: Boolean, default: !1 }, loading: { type: Boolean, default: !1 }, wrapperElement: { type: String, default: "span" } }, emits: ["update:checked"], computed: { inputProps() {
  return this.type === r ? null : { checked: this.isChecked, indeterminate: this.indeterminate, required: this.required, name: this.name };
}, inputListeners() {
  return this.type === r ? { click: this.onToggle } : { change: this.onToggle };
}, size() {
  return this.type === i ? 36 : 24;
}, cssVars() {
  return { "--icon-size": this.size + "px" };
}, inputType() {
  return [a, o, r].includes(this.type) ? this.type : a;
}, isChecked() {
  return this.value !== null ? Array.isArray(this.checked) ? [...this.checked].indexOf(this.value) > -1 : this.checked === this.value : this.checked === !0;
}, checkboxRadioIconElement() {
  return this.type === o ? this.isChecked ? u : p : this.type === i ? this.isChecked ? b : m : this.indeterminate ? d : this.isChecked ? l : h;
} }, mounted() {
  if (this.name && this.type === a && !Array.isArray(this.checked))
    throw new Error("When using groups of checkboxes, the updated value will be an array.");
  if (this.name && this.type === i)
    throw new Error("Switches are not made to be used for data sets. Please use checkboxes instead.");
  if (typeof this.checked != "boolean" && this.type === i)
    throw new Error("Switches can only be used with boolean as checked prop.");
}, methods: { onToggle() {
  if (this.disabled)
    return;
  if (this.type === o) {
    this.$emit("update:checked", this.value);
    return;
  }
  if (this.type === i) {
    this.$emit("update:checked", !this.isChecked);
    return;
  }
  if (typeof this.checked == "boolean") {
    this.$emit("update:checked", !this.isChecked);
    return;
  }
  const e = this.getInputsSet().filter((t) => t.checked).map((t) => t.value);
  this.$emit("update:checked", e);
}, getInputsSet() {
  return [...document.getElementsByName(this.name)];
} } };
var y = function() {
  var e = this, t = e._self._c;
  return t(e.wrapperElement, { tag: "component", staticClass: "checkbox-radio-switch", class: { ["checkbox-radio-switch-" + e.type]: e.type, "checkbox-radio-switch--checked": e.isChecked, "checkbox-radio-switch--disabled": e.disabled, "checkbox-radio-switch--indeterminate": e.indeterminate, "checkbox-radio-switch--button-variant": e.buttonVariant, "checkbox-radio-switch--button-variant-v-grouped": e.buttonVariant && e.buttonVariantGrouped === "vertical", "checkbox-radio-switch--button-variant-h-grouped": e.buttonVariant && e.buttonVariantGrouped === "horizontal" }, style: e.cssVars }, [t("input", e._g(e._b({ staticClass: "checkbox-radio-switch__input", attrs: { id: e.id, disabled: e.disabled, type: e.inputType }, domProps: { value: e.value } }, "input", e.inputProps, !1), e.inputListeners)), t("label", { staticClass: "checkbox-radio-switch__label", attrs: { for: e.id } }, [t("div", { staticClass: "checkbox-radio-switch__icon" }, [e._t("icon", function() {
    return [e.loading ? t("NcLoadingIcon") : e.buttonVariant ? e._e() : t(e.checkboxRadioIconElement, { tag: "component", attrs: { size: e.size } })];
  }, { checked: e.isChecked, loading: e.loading })], 2), t("span", { staticClass: "checkbox-radio-switch__label-text" }, [e._t("default")], 2)])]);
}, g = [], w = k(f, y, g, !1, null, "a6f82e18", null, null);
const T = w.exports;
export {
  T as default
};