bitboss-ui 2.0.5 → 2.0.8

package/dist/index42.js

@@ -1,222 +1,135 @@
-import { defineComponent as Z, ref as r, computed as k, toRef as B, openBlock as f, createBlock as C, normalizeClass as x, withCtx as a, renderSlot as u, createVNode as O, unref as v, createElementVNode as I, createElementBlock as ee, Fragment as oe, createCommentVNode as te, withDirectives as ne, mergeProps as le, isRef as ae, withModifiers as s, withKeys as y, vModelDynamic as ie, nextTick as re } from "vue";
-/* empty css       */
-import ue from "./index122.js";
+import { defineComponent as $, ref as p, toRef as l, openBlock as w, createBlock as B, unref as f, withCtx as i, renderSlot as s, normalizeProps as b, guardReactiveProps as h, createVNode as O, mergeProps as v, createSlots as z } from "vue";
+import { useOptions as F } from "./index232.js";
+import M from "./index40.js";
+/* empty css        */
+import S from "./index233.js";
 /* empty css         */
-import { isNotNil as se } from "./index129.js";
-import { last as de } from "./index206.js";
-import { useOptions as pe } from "./index221.js";
-import ce from "./index236.js";
-/* empty css         */
-import me from "./index238.js";
-/* empty css         */
-import fe from "./index218.js";
-/* empty css         */
-import ve from "./index220.js";
-const ye = { class: "bb-base-tag__input-container" }, be = ["id", "aria-describedby", "autocomplete", "autofocus", "disabled", "placeholder", "readonly", "required", "onKeydown"], Ke = /* @__PURE__ */ Z({
-  __name: "BaseTag",
+const I = /* @__PURE__ */ $({
+  __name: "BaseSwitchGroup",
   props: {
-    "append:icon": {},
     ariaDescribedby: {},
-    autocomplete: {},
     autofocus: {},
-    comma: { type: Boolean },
+    color: {},
+    dependencies: {},
+    depsDebounceTime: { default: 0 },
+    direction: { default: "horizontal" },
     disabled: { type: Boolean },
-    divider: { default: "Enter" },
+    enforceCoherence: { type: Boolean },
     hasErrors: { type: Boolean },
+    hideLabel: { type: Boolean },
     id: {},
-    loading: { type: Boolean },
+    items: { type: [Array, Function], default: () => [] },
+    itemText: {},
+    itemValue: {},
+    loadingText: { default: "Caricamento..." },
     modelValue: {},
-    multiple: { type: Boolean, default: !0 },
+    modelValueDebounceTime: { default: 0 },
     name: {},
-    placeholder: {},
-    "prepend:icon": {},
-    readonly: {},
-    required: { type: Boolean }
+    noDataText: { default: "Nessun elemento da visualizzare" },
+    readonly: {}
   },
-  emits: ["blur", "change", "click", "duplicate", "focus", "inactive", "input", "keydown", "keyup", "update:modelValue"],
-  setup($, { emit: D }) {
-    const o = $, l = D;
-    if (o.multiple && !Array.isArray(o.modelValue))
-      throw new Error('Multiple is set to "true" but modelValue is not an array.');
-    const b = r(null), T = r(null), L = k(() => o.placeholder), V = r(null), w = r(null), i = k(
-      () => o.comma ? V.value : w.value
-    ), d = r(null), E = () => {
-      d.value instanceof HTMLInputElement && d.value.focus();
-    }, K = !o.multiple && se(o.modelValue) || o.multiple && !!o.modelValue.length, N = r([]), {
-      query: t,
-      alignQueryToState: q,
-      addCurrentQueryToManualItems: M,
-      selectedOptions: p,
-      selectOption: P,
-      unselectOption: _,
-      valueIsSelected: A,
-      manualItems: S
-    } = pe({
-      emit: l,
-      itemText: void 0,
-      itemValue: void 0,
-      modelValue: B(o, "modelValue"),
-      multiple: o.multiple,
-      resetQueryOnOptionSelected: !0,
-      stash: !1,
-      items: B(o, "modelValue"),
-      enforceCoherence: !1,
-      prefill: K,
-      modelValueDebounceTime: 0,
-      dependencies: N,
-      depsDebounceTime: 0,
+  emits: ["blur", "change", "click", "focus", "inactive", "input", "keydown", "mousedown", "mouseup", "update:modelValue"],
+  setup(g, { emit: y }) {
+    const a = g, o = y, m = p(), r = p(!1), {
+      innerLoading: T,
+      options: k,
+      selectOption: D,
+      unselectOption: L
+    } = F({
+      dependencies: l(a, "dependencies"),
+      depsDebounceTime: a.depsDebounceTime,
+      disabled: l(a, "disabled"),
+      emit: o,
+      enforceCoherence: a.enforceCoherence,
+      items: l(a, "items"),
+      itemText: a.itemText,
+      itemValue: a.itemValue,
+      modelValue: l(a, "modelValue"),
+      modelValueDebounceTime: a.modelValueDebounceTime,
+      multiple: !0,
+      prefill: !0,
       queryDebounceTime: 0,
-      disabled: B(o, "disabled")
-    }), g = r(!1), F = () => {
-      g.value = !0;
-    }, H = () => {
-      g.value = !1, l("inactive");
-    }, h = k(() => !(o.readonly || o.disabled || !i.value && o.multiple)), Q = (e) => {
-      var n;
-      h.value && (!o.multiple || t.value || (e.preventDefault(), p.value.length && ((n = i.value) == null || n.focusPrevious())));
-    }, R = (e) => {
-      var n;
-      h.value && (!o.multiple || t.value || (e.preventDefault(), p.value.length && ((n = i.value) == null || n.focusNext())));
-    }, U = async () => {
-      var e, n;
-      !h.value || t.value || !p.value.length || ((e = i.value) != null && e.getHighlighted() && i.value.confirmOption(), await re(), (n = i.value) == null || n.focusPrevious());
-    }, z = () => {
-      var e;
-      (e = i.value) == null || e.blur();
-    }, j = async (e) => {
-      var n;
-      if (l("keyup", e), o.readonly || o.disabled) {
-        e.preventDefault();
-        return;
-      }
-      if ((n = i.value) == null || n.blur(), e.key === o.divider || e.key === "Unidentified" && t.value.includes(o.divider)) {
-        if (o.divider.length === 1 && t.value.includes(o.divider)) {
-          const m = t.value.split(o.divider)[0];
-          if (m)
-            t.value = m;
-          else {
-            t.value = "";
-            return;
-          }
-        }
-        if (!t.value) return;
-        A(t.value) ? (l("duplicate", t.value), t.value = "") : (M(), G(de(S.value)));
-      }
-    }, G = (e) => {
-      P(e), E(), o.multiple || close();
-    }, J = (e) => {
-      _(e), E();
-    }, W = (e) => {
-      l("focus", e), F(), document.addEventListener("click", c), document.addEventListener("focusin", c);
-    }, X = (e) => {
-      l("click", e), !(o.disabled || o.readonly) && d.value instanceof HTMLElement && d.value.focus();
-    }, c = async (e) => {
-      if (e.target instanceof Node && b.value && !b.value.$el.contains(e.target)) {
-        close(), H(), document.removeEventListener("click", c), document.removeEventListener("focusin", c), q();
-        return;
-      }
-    }, Y = {
-      onBlur: (e) => l("blur", e),
-      onChange: (e) => l("change", e),
-      onKeydown: (e) => l("keydown", e),
-      onInput: (e) => l("input", e)
+      resetQueryOnOptionSelected: !1,
+      stash: !1
+    }), C = (e, t) => {
+      o("change", e), t.selected ? L(t) : D(t);
+    }, E = {
+      onBlur: (e) => o("blur", e),
+      onClick: (e) => o("click", e),
+      onFocus: (e) => {
+        o("focus", e), r.value || (document.addEventListener("focusin", d, { passive: !0 }), document.addEventListener("click", u, { passive: !0 }), r.value = !0);
+      },
+      onInput: (e) => o("input", e),
+      onKeydown: (e) => o("keydown", e),
+      onMousedown: (e) => o("mousedown", e),
+      onMouseup: (e) => o("mouseup", e)
+    }, d = (e) => {
+      var t;
+      e.target instanceof HTMLElement && ((t = m.value) != null && t.contains(e.target) || (o("inactive"), r.value = !1, document.removeEventListener("focusin", d), document.removeEventListener("click", u)));
+    }, u = (e) => {
+      var t;
+      e.target instanceof HTMLElement && ((t = m.value) != null && t.contains(e.target) || (o("inactive"), r.value = !1, document.removeEventListener("focusin", d), document.removeEventListener("click", u)));
     };
-    return (e, n) => (f(), C(ve, {
-      ref_key: "outerContainer",
-      ref: b,
-      class: x({
-        "bb-base-tag": !0,
-        "bb-base-tag--active": g.value,
-        "bb-base-tag--disabled": e.disabled,
-        "bb-base-tag--loading": e.loading,
-        "bb-base-tag--errors": e.hasErrors,
-        "bb-base-tag--readonly": e.readonly
-      }),
-      onClick: X
+    return (e, t) => (w(), B(S, {
+      class: "bb-base-switch-group",
+      direction: e.direction,
+      "has-errors": e.hasErrors,
+      "hide-label": e.hideLabel,
+      loading: !!f(T),
+      "loading-text": e.loadingText,
+      "no-data-text": e.noDataText,
+      options: f(k)
     }, {
-      "prepend-outer": a(() => [
-        u(e.$slots, "prepend-outer")
+      prepend: i(() => [
+        s(e.$slots, "prepend")
+      ]),
+      loading: i(() => [
+        s(e.$slots, "loading")
+      ]),
+      "no-data": i(() => [
+        s(e.$slots, "no-data")
+      ]),
+      "option:prepend": i((n) => [
+        s(e.$slots, "option:prepend", b(h(n)))
+      ]),
+      input: i(({ option: n, index: V }) => [
+        O(M, v({
+          id: n.valueHash,
+          "aria-describedby": e.ariaDescribedby,
+          autofocus: e.autofocus && !V,
+          checked: n.selected,
+          color: e.color,
+          disabled: n.disabled,
+          "has-errors": e.hasErrors,
+          name: e.name,
+          readonly: e.readonly,
+          "true-value": n.value
+        }, E, {
+          onChange: (c) => C(c, n)
+        }), z({ _: 2 }, [
+          e.$slots.icon ? {
+            name: "icon",
+            fn: i((c) => [
+              s(e.$slots, "icon", v({
+                item: n.item,
+                text: n.text
+              }, c))
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1040, ["id", "aria-describedby", "autofocus", "checked", "color", "disabled", "has-errors", "name", "readonly", "true-value", "onChange"])
       ]),
-      "append-outer": a(() => [
-        u(e.$slots, "append-outer")
+      "option:append": i((n) => [
+        s(e.$slots, "option:prepend", b(h(n)))
       ]),
-      default: a(() => [
-        O(fe, {
-          ref_key: "innerContainer",
-          ref: T,
-          "append:icon": o["append:icon"],
-          "prepend:icon": o["prepend:icon"]
-        }, {
-          prepend: a(() => [
-            u(e.$slots, "prepend")
-          ]),
-          prefix: a(() => [
-            u(e.$slots, "prefix")
-          ]),
-          append: a(() => [
-            u(e.$slots, "append")
-          ]),
-          suffix: a(() => [
-            u(e.$slots, "suffix")
-          ]),
-          default: a(() => [
-            O(v(ue), { tag: "span" }, {
-              default: a(() => [
-                I("span", ye, [
-                  e.multiple ? (f(), ee(oe, { key: 0 }, [
-                    e.comma ? (f(), C(me, {
-                      key: 0,
-                      ref_key: "commaBox",
-                      ref: V,
-                      options: v(p)
-                    }, null, 8, ["options"])) : (f(), C(ce, {
-                      key: 1,
-                      ref_key: "chipsBox",
-                      ref: w,
-                      options: v(p),
-                      "onOption:unselected": J
-                    }, null, 8, ["options"]))
-                  ], 64)) : te("", !0),
-                  ne(I("input", le({
-                    id: e.id,
-                    ref_key: "input",
-                    ref: d
-                  }, Y, {
-                    "onUpdate:modelValue": n[0] || (n[0] = (m) => ae(t) ? t.value = m : null),
-                    "aria-describedby": e.ariaDescribedby,
-                    autocomplete: e.autocomplete,
-                    autofocus: e.autofocus,
-                    class: "bb-base-tag__text-input",
-                    disabled: e.disabled,
-                    "enter-key-hint": "next",
-                    placeholder: L.value,
-                    readonly: e.readonly,
-                    required: e.required && !e.multiple || e.multiple && !e.modelValue.length,
-                    type: "text",
-                    onFocus: s(W, ["stop"]),
-                    onKeydown: [
-                      y(s(U, ["stop"]), ["delete"]),
-                      y(s(Q, ["stop"]), ["left"]),
-                      y(s(z, ["stop", "prevent"]), ["esc"]),
-                      y(s(R, ["stop"]), ["right"])
-                    ],
-                    onKeyup: s(j, ["stop"])
-                  }), null, 16, be), [
-                    [ie, v(t)]
-                  ])
-                ])
-              ]),
-              _: 1
-            })
-          ]),
-          _: 3
-        }, 8, ["append:icon", "prepend:icon"])
+      append: i(() => [
+        s(e.$slots, "prepend")
       ]),
       _: 3
-    }, 8, ["class"]));
+    }, 8, ["direction", "has-errors", "hide-label", "loading", "loading-text", "no-data-text", "options"]));
   }
 });
 export {
-  Ke as default
+  I as default
 };
 //# sourceMappingURL=index42.js.map

package/dist/index42.js.map

@@ -1 +1 @@
-{"version":3,"file":"index42.js","sources":["../src/components/BaseTag/BaseTag.vue"],"sourcesContent":["<template>\n\t<CommonInputOuterContainer\n\t\tref=\"outerContainer\"\n\t\t:class=\"{\n\t\t\t'bb-base-tag': true,\n\t\t\t'bb-base-tag--active': active,\n\t\t\t'bb-base-tag--disabled': disabled,\n\t\t\t'bb-base-tag--loading': loading,\n\t\t\t'bb-base-tag--errors': hasErrors,\n\t\t\t'bb-base-tag--readonly': readonly,\n\t\t}\"\n\t\t@click=\"onOuterContainerClick\"\n\t>\n\t\t<template #prepend-outer><slot name=\"prepend-outer\"></slot></template>\n\t\t<CommonInputInnerContainer\n\t\t\tref=\"innerContainer\"\n\t\t\t:append:icon=\"props['append:icon']\"\n\t\t\t:prepend:icon=\"props['prepend:icon']\"\n\t\t>\n\t\t\t<template #prepend><slot name=\"prepend\" /></template>\n\t\t\t<template #prefix><slot name=\"prefix\" /></template>\n\t\t\t<BbSmoothHeight tag=\"span\">\n\t\t\t\t<span class=\"bb-base-tag__input-container\">\n\t\t\t\t\t<template v-if=\"multiple\">\n\t\t\t\t\t\t<template v-if=\"comma\">\n\t\t\t\t\t\t\t<CommaBox ref=\"commaBox\" :options=\"selectedOptions\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template v-else>\n\t\t\t\t\t\t\t<ChipsBox\n\t\t\t\t\t\t\t\tref=\"chipsBox\"\n\t\t\t\t\t\t\t\t:options=\"selectedOptions\"\n\t\t\t\t\t\t\t\t@option:unselected=\"onOptionUnselected\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</template>\n\n\t\t\t\t\t<input\n\t\t\t\t\t\t:id=\"id\"\n\t\t\t\t\t\tref=\"input\"\n\t\t\t\t\t\tv-bind=\"eventListeners\"\n\t\t\t\t\t\tv-model=\"query\"\n\t\t\t\t\t\t:aria-describedby=\"ariaDescribedby\"\n\t\t\t\t\t\t:autocomplete=\"autocomplete\"\n\t\t\t\t\t\t:autofocus=\"autofocus\"\n\t\t\t\t\t\t:class=\"'bb-base-tag__text-input'\"\n\t\t\t\t\t\t:disabled=\"disabled\"\n\t\t\t\t\t\tenter-key-hint=\"next\"\n\t\t\t\t\t\t:placeholder=\"computedPlaceholder\"\n\t\t\t\t\t\t:readonly=\"readonly\"\n\t\t\t\t\t\t:required=\"\n\t\t\t\t\t\t\t(required && !multiple) || (multiple && !modelValue.length)\n\t\t\t\t\t\t\"\n\t\t\t\t\t\t:type=\"'text'\"\n\t\t\t\t\t\t@focus.stop=\"onInputFocus\"\n\t\t\t\t\t\t@keydown.stop.delete=\"onBackspace\"\n\t\t\t\t\t\t@keydown.stop.left=\"onArrowLeft\"\n\t\t\t\t\t\t@keydown.stop.prevent.esc=\"onEscape\"\n\t\t\t\t\t\t@keydown.stop.right=\"onArrowRight\"\n\t\t\t\t\t\t@keyup.stop=\"onInputKeyup\"\n\t\t\t\t\t/>\n\t\t\t\t</span>\n\t\t\t</BbSmoothHeight>\n\t\t\t<template #append><slot name=\"append\" /></template>\n\t\t\t<template #suffix><slot name=\"suffix\" /></template>\n\t\t</CommonInputInnerContainer>\n\n\t\t<template #append-outer><slot name=\"append-outer\"></slot></template>\n\t</CommonInputOuterContainer>\n</template>\n\n<script setup lang=\"ts\">\nimport { BbSmoothHeight } from '@/index';\nimport { computed, ref } from 'vue';\nimport { isNotNil } from '@/utilities/functions/isNotNil';\nimport { last } from '@/utilities/functions/last';\nimport { nextTick } from 'vue';\nimport { toRef } from 'vue';\nimport { useOptions } from '@/composables/useOptions';\nimport ChipsBox from '../ChipsBox.vue';\nimport CommaBox from '../CommaBox.vue';\nimport CommonInputInnerContainer from '../CommonInputInnerContainer.vue';\nimport CommonInputOuterContainer from '../CommonInputOuterContainer.vue';\nimport type { InputHTMLAttributes, HTMLAttributes } from 'vue';\nimport type { Option as BaseOption } from '@/types/Option';\n\nexport type BaseTagProps = {\n\t/**\n\t * Name of the icon to be added at the end of the input.\n\t */\n\t// eslint-disable-next-line vue/prop-name-casing\n\t'append:icon'?: string;\n\n\t/**\n\t * Guides to the browser as to the type of information expected in the field.\n\t */\n\tariaDescribedby?: InputHTMLAttributes['aria-describedby'];\n\n\t/**\n\t * Guides to the browser as to the type of information expected in the field.\n\t */\n\tautocomplete?: InputHTMLAttributes['autocomplete'];\n\n\t/**\n\t * Sets autofocus on page load.\n\t */\n\tautofocus?: InputHTMLAttributes['autofocus'];\n\n\t/**\n\t * Sets the display model for selected values to a list\n\t * of comma separated string. In this mode the user\n\t * cannot deselect an option by pressing the close button.\n\t */\n\tcomma?: boolean;\n\n\t/**\n\t * Disables the component\n\t */\n\tdisabled?: boolean;\n\n\t/**\n\t * The divider key used to separate values from one another. By default it is \"Enter\"\n\t */\n\tdivider?: KeyboardEvent['key'];\n\n\t/**\n\t * Define if the component should be in an error state.\n\t * It usually attaches a CSS class for styling purposes.\n\t */\n\thasErrors?: boolean;\n\n\t/**\n\t * The identifier of the component.\n\t */\n\tid?: HTMLAttributes['id'];\n\n\t/**\n\t * Sets the component in a loading state, usually triggering some visual styles.\n\t */\n\tloading?: boolean;\n\n\t/**\n\t * Used by v-model. Can be any serializable type.\n\t */\n\tmodelValue: any;\n\n\t/**\n\t * Allows the selection of multiple items.\n\t */\n\tmultiple?: boolean;\n\n\t/**\n\t * Defines the name of the input.\n\t */\n\tname?: InputHTMLAttributes['name'];\n\n\t/**\n\t * String displayed when there's no data.\n\t */\n\tplaceholder?: InputHTMLAttributes['placeholder'];\n\n\t/**\n\t * Name of the icon to be added at the start of the input.\n\t */\n\t// eslint-disable-next-line vue/prop-name-casing\n\t'prepend:icon'?: string;\n\n\t/**\n\t * Sets the input in a readonly state.\n\t */\n\treadonly?: InputHTMLAttributes['readonly'];\n\n\t/**\n\t * Sets the input as required.\n\t */\n\trequired?: boolean;\n};\n\nconst props = withDefaults(defineProps<BaseTagProps>(), {\n\tdivider: 'Enter',\n\tmultiple: true,\n});\n\nexport type BaseTagEvents = {\n\t(e: 'blur', event: FocusEvent): void;\n\t(e: 'change', event: Event): void;\n\t(e: 'click', event: MouseEvent): void;\n\t(e: 'duplicate', string: string): void;\n\t(e: 'focus', event: FocusEvent): void;\n\t(e: 'inactive'): void;\n\t(e: 'input', event: Event): void;\n\t(e: 'keydown', event: KeyboardEvent): void;\n\t(e: 'keyup', event: KeyboardEvent): void;\n\t(e: 'update:modelValue', value: any): void;\n};\n\nconst emit = defineEmits<BaseTagEvents>();\n\nexport type BaseTagSlots = {\n\tappend?: (props: object) => any;\n\t'append-outer'?: (props: object) => any;\n\tprepend?: (props: object) => any;\n\t'prepend-outer'?: (props: object) => any;\n\tprefix?: (props: object) => any;\n\tsuffix?: (props: object) => any;\n};\n\ndefineSlots<BaseTagSlots>();\n\nif (props.multiple && !Array.isArray(props.modelValue)) {\n\tthrow new Error('Multiple is set to \"true\" but modelValue is not an array.');\n}\n\nconst outerContainer = ref<InstanceType<\n\ttypeof CommonInputOuterContainer\n> | null>(null);\nconst innerContainer = ref<InstanceType<\n\ttypeof CommonInputInnerContainer\n> | null>(null);\nconst computedPlaceholder = computed(() => {\n\treturn props.placeholder;\n});\nconst commaBox = ref<InstanceType<typeof CommaBox> | null>(null);\nconst chipsBox = ref<InstanceType<typeof ChipsBox> | null>(null);\nconst selectedBox = computed(() =>\n\tprops.comma ? commaBox.value : chipsBox.value\n);\n\nconst input = ref<HTMLElement | null>(null);\nconst focusInput = () => {\n\tif (input.value instanceof HTMLInputElement) {\n\t\tinput.value.focus();\n\t}\n};\n/**\n * It should prefill if asked, or\n * when single if modelValue is not null\n * when multiple if modelValue is not empty\n */\nconst shouldPrefill =\n\t(!props.multiple && isNotNil(props.modelValue)) ||\n\t(props.multiple && !!props.modelValue.length);\n\nconst dependencies = ref([]);\n\nconst {\n\tquery,\n\talignQueryToState,\n\taddCurrentQueryToManualItems,\n\tselectedOptions,\n\tselectOption,\n\tunselectOption,\n\tvalueIsSelected,\n\tmanualItems,\n} = useOptions({\n\temit,\n\titemText: undefined,\n\titemValue: undefined,\n\tmodelValue: toRef(props, 'modelValue'),\n\tmultiple: props.multiple,\n\tresetQueryOnOptionSelected: true,\n\tstash: false,\n\titems: toRef(props, 'modelValue'),\n\tenforceCoherence: false,\n\tprefill: shouldPrefill,\n\tmodelValueDebounceTime: 0,\n\tdependencies,\n\tdepsDebounceTime: 0,\n\tqueryDebounceTime: 0,\n\tdisabled: toRef(props, 'disabled'),\n});\n\n/**\n * Applies a class when the user is inside this whole component.\n * We cannot use focus within as it doesn't work for elements that are teleported.\n * Also we cannot use the <input/> if we physically move focus to the options so\n * we track it manually.\n */\nconst active = ref(false);\n\nconst setActive = () => {\n\tactive.value = true;\n};\nconst setInactive = () => {\n\tactive.value = false;\n\temit('inactive');\n};\n\nconst canProcessKeyboardBindings = computed(() => {\n\tif (props.readonly) return false;\n\tif (props.disabled) return false;\n\tif (!selectedBox.value && props.multiple) return false;\n\treturn true;\n});\n\nconst onArrowLeft = (event: KeyboardEvent) => {\n\tif (!canProcessKeyboardBindings.value) {\n\t\treturn;\n\t}\n\tif (!props.multiple || query.value) {\n\t\treturn;\n\t}\n\tevent.preventDefault();\n\tif (!selectedOptions.value.length) return;\n\tselectedBox.value?.focusPrevious();\n};\nconst onArrowRight = (event: KeyboardEvent) => {\n\tif (!canProcessKeyboardBindings.value) {\n\t\treturn;\n\t}\n\tif (!props.multiple || query.value) {\n\t\treturn;\n\t}\n\tevent.preventDefault();\n\tif (!selectedOptions.value.length) return;\n\tselectedBox.value?.focusNext();\n};\n\nconst onBackspace = async () => {\n\tif (\n\t\t!canProcessKeyboardBindings.value ||\n\t\tquery.value ||\n\t\t!selectedOptions.value.length\n\t) {\n\t\treturn;\n\t}\n\tif (selectedBox.value?.getHighlighted()) {\n\t\tselectedBox.value.confirmOption();\n\t}\n\tawait nextTick();\n\tselectedBox.value?.focusPrevious();\n};\n\nconst onEscape = () => {\n\tselectedBox.value?.blur();\n};\n\nconst onInputKeyup = async (event: KeyboardEvent) => {\n\temit('keyup', event);\n\tif (props.readonly || props.disabled) {\n\t\tevent.preventDefault();\n\t\treturn;\n\t}\n\tselectedBox.value?.blur();\n\tif (\n\t\tevent.key === props.divider ||\n\t\t(event.key === 'Unidentified' && query.value.includes(props.divider))\n\t) {\n\t\tif (props.divider.length === 1 && query.value.includes(props.divider)) {\n\t\t\tconst found = query.value.split(props.divider)[0];\n\t\t\tif (found) {\n\t\t\t\tquery.value = found;\n\t\t\t} else {\n\t\t\t\tquery.value = '';\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\t\tif (!query.value) return;\n\t\tif (valueIsSelected(query.value)) {\n\t\t\temit('duplicate', query.value);\n\t\t\tquery.value = '';\n\t\t} else {\n\t\t\taddCurrentQueryToManualItems();\n\t\t\tonOptionSelected(last(manualItems.value)!);\n\t\t}\n\t}\n};\n\nconst onOptionSelected = (option: BaseOption) => {\n\tselectOption(option);\n\tfocusInput();\n\tif (!props.multiple) {\n\t\tclose();\n\t}\n};\n\nconst onOptionUnselected = (option: BaseOption) => {\n\tunselectOption(option);\n\tfocusInput();\n};\n\nconst onInputFocus = (event: FocusEvent) => {\n\temit('focus', event);\n\tsetActive();\n\tdocument.addEventListener('click', onOutsideInteraction);\n\tdocument.addEventListener('focusin', onOutsideInteraction);\n};\n\n/**\n * When clicking on the outside container seamlessly move focus to the input and open the panel\n */\nconst onOuterContainerClick = (event: MouseEvent) => {\n\temit('click', event);\n\tif (props.disabled || props.readonly) return;\n\tif (input.value instanceof HTMLElement) {\n\t\tinput.value.focus();\n\t}\n};\n\n/**\n * On click outside of the container close the panel, remove active state.\n * In multiple selection clear query after a timeout\n */\nconst onOutsideInteraction = async (event: Event) => {\n\tif (event.target instanceof Node) {\n\t\tif (outerContainer.value) {\n\t\t\tif (!outerContainer.value.$el.contains(event.target)) {\n\t\t\t\tclose();\n\t\t\t\tsetInactive();\n\t\t\t\tdocument.removeEventListener('click', onOutsideInteraction);\n\t\t\t\tdocument.removeEventListener('focusin', onOutsideInteraction);\n\t\t\t\talignQueryToState();\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\t}\n};\nconst eventListeners = {\n\tonBlur: (event: FocusEvent) => emit('blur', event),\n\tonChange: (event: Event) => emit('change', event),\n\tonKeydown: (event: KeyboardEvent) => emit('keydown', event),\n\tonInput: (event: Event) => emit('input', event),\n};\n</script>\n<style lang=\"postcss\">\n@import '@/assets/css/BaseTag';\n</style>\n"],"names":["props","__props","emit","__emit","outerContainer","ref","innerContainer","computedPlaceholder","computed","commaBox","chipsBox","selectedBox","input","focusInput","shouldPrefill","isNotNil","dependencies","query","alignQueryToState","addCurrentQueryToManualItems","selectedOptions","selectOption","unselectOption","valueIsSelected","manualItems","useOptions","toRef","active","setActive","setInactive","canProcessKeyboardBindings","onArrowLeft","event","_a","onArrowRight","onBackspace","nextTick","_b","onEscape","onInputKeyup","found","onOptionSelected","last","option","onOptionUnselected","onInputFocus","onOutsideInteraction","onOuterContainerClick","eventListeners"],"mappings":"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"}
+{"version":3,"file":"index42.js","sources":["../src/components/BaseSwitchGroup/BaseSwitchGroup.vue"],"sourcesContent":["<template>\n\t<OptionsContainer\n\t\tclass=\"bb-base-switch-group\"\n\t\t:direction=\"direction\"\n\t\t:has-errors=\"hasErrors\"\n\t\t:hide-label=\"hideLabel\"\n\t\t:loading=\"!!loading\"\n\t\t:loading-text=\"loadingText\"\n\t\t:no-data-text=\"noDataText\"\n\t\t:options=\"options\"\n\t>\n\t\t<template #prepend><slot name=\"prepend\"></slot></template>\n\t\t<template #loading><slot name=\"loading\"></slot></template>\n\t\t<template #no-data><slot name=\"no-data\"></slot></template>\n\t\t<template #option:prepend=\"data\"\n\t\t\t><slot name=\"option:prepend\" v-bind=\"data\"></slot\n\t\t></template>\n\t\t<template #input=\"{ option, index }\">\n\t\t\t<BaseSwitch\n\t\t\t\t:id=\"option.valueHash\"\n\t\t\t\t:aria-describedby=\"ariaDescribedby\"\n\t\t\t\t:autofocus=\"autofocus && !index\"\n\t\t\t\t:checked=\"option.selected\"\n\t\t\t\t:color=\"color\"\n\t\t\t\t:disabled=\"option.disabled\"\n\t\t\t\t:has-errors=\"hasErrors\"\n\t\t\t\t:name=\"name\"\n\t\t\t\t:readonly=\"readonly\"\n\t\t\t\t:true-value=\"option.value\"\n\t\t\t\tv-bind=\"eventListeners\"\n\t\t\t\t@change=\"(event: Event) => onChange(event, option)\"\n\t\t\t>\n\t\t\t\t<template v-if=\"$slots.icon\" #icon=\"data\">\n\t\t\t\t\t<slot\n\t\t\t\t\t\t:item=\"option.item\"\n\t\t\t\t\t\tname=\"icon\"\n\t\t\t\t\t\t:text=\"option.text\"\n\t\t\t\t\t\tv-bind=\"data\"\n\t\t\t\t\t/>\n\t\t\t\t</template>\n\t\t\t</BaseSwitch>\n\t\t</template>\n\t\t<template #option:append=\"data\"\n\t\t\t><slot name=\"option:prepend\" v-bind=\"data\"></slot\n\t\t></template>\n\t\t<template #append><slot name=\"prepend\"></slot></template>\n\t</OptionsContainer>\n</template>\n\n<script setup lang=\"ts\" generic=\"T = any\">\nimport { ref, toRef } from 'vue';\nimport { useOptions } from '@/composables/useOptions';\nimport BaseSwitch from '../BaseSwitch/BaseSwitch.vue';\nimport type { Option } from '@/types/Option';\nimport type { SlotAttributes } from '../BaseCheckbox/BaseCheckbox.vue';\nimport type {\n\tBaseCheckboxGroupEvents,\n\tBaseCheckboxGroupProps,\n} from '../BaseCheckboxGroup/BaseCheckboxGroup.vue';\nimport OptionsContainer from '../OptionsContainer.vue';\n\nexport type BaseSwitchGroupEvents = BaseCheckboxGroupEvents;\n\nexport type BaseSwitchGroupProps<T> = BaseCheckboxGroupProps<T>;\n\nconst props = withDefaults(defineProps<BaseSwitchGroupProps<T>>(), {\n\tdepsDebounceTime: 0,\n\tdirection: 'horizontal',\n\titems: () => [],\n\tloadingText: 'Caricamento...',\n\tmodelValueDebounceTime: 0,\n\tnoDataText: 'Nessun elemento da visualizzare',\n});\n\nconst emit = defineEmits<BaseSwitchGroupEvents>();\n\ndefineSlots<{\n\tprepend?: (props: object) => any;\n\tloading?: (props: object) => any;\n\t'no-data'?: (props: object) => any;\n\t'option:prepend'?: (props: {\n\t\tchecked: boolean;\n\t\tdisabled: boolean;\n\t\tid?: string;\n\t\titem: T;\n\t\ttext: string;\n\t}) => any;\n\ticon?: (\n\t\tprops: SlotAttributes & {\n\t\t\titem: T;\n\t\t\ttext: string;\n\t\t}\n\t) => any;\n\tlabel?: (props: { item: T; text: string; checked: boolean }) => any;\n\t'option:append'?: (props: {\n\t\tchecked: boolean;\n\t\tdisabled: boolean;\n\t\tid?: string;\n\t\titem: T;\n\t\ttext: string;\n\t}) => any;\n\tappend?: (props: object) => any;\n}>();\n\nconst container = ref<HTMLElement>();\nconst active = ref(false);\n\nconst {\n\tinnerLoading: loading,\n\toptions,\n\tselectOption,\n\tunselectOption,\n} = useOptions({\n\tdependencies: toRef(props, 'dependencies'),\n\tdepsDebounceTime: props.depsDebounceTime,\n\tdisabled: toRef(props, 'disabled'),\n\temit,\n\tenforceCoherence: props.enforceCoherence,\n\titems: toRef(props, 'items'),\n\titemText: props.itemText,\n\titemValue: props.itemValue,\n\tmodelValue: toRef(props, 'modelValue'),\n\tmodelValueDebounceTime: props.modelValueDebounceTime,\n\tmultiple: true,\n\tprefill: true,\n\tqueryDebounceTime: 0,\n\tresetQueryOnOptionSelected: false,\n\tstash: false,\n});\n\nconst onChange = (event: Event, option: Option) => {\n\temit('change', event);\n\tif (!option.selected) {\n\t\tselectOption(option);\n\t} else {\n\t\tunselectOption(option);\n\t}\n};\n\nconst onFocus = (event: FocusEvent) => {\n\temit('focus', event);\n\tif (!active.value) {\n\t\tdocument.addEventListener('focusin', onDocumentFocus, { passive: true });\n\t\tdocument.addEventListener('click', onDocumentClick, { passive: true });\n\t\tactive.value = true;\n\t}\n};\n\nconst eventListeners = {\n\tonBlur: (event: FocusEvent) => emit('blur', event),\n\tonClick: (event: MouseEvent) => emit('click', event),\n\tonFocus,\n\tonInput: (event: Event) => emit('input', event),\n\tonKeydown: (event: KeyboardEvent) => emit('keydown', event),\n\tonMousedown: (event: MouseEvent) => emit('mousedown', event),\n\tonMouseup: (event: MouseEvent) => emit('mouseup', event),\n};\n\nconst onDocumentFocus = (event: FocusEvent) => {\n\tif (event.target instanceof HTMLElement) {\n\t\tif (!container.value?.contains(event.target)) {\n\t\t\temit('inactive');\n\t\t\tactive.value = false;\n\t\t\tdocument.removeEventListener('focusin', onDocumentFocus);\n\t\t\tdocument.removeEventListener('click', onDocumentClick);\n\t\t}\n\t}\n};\n\nconst onDocumentClick = (event: MouseEvent) => {\n\tif (event.target instanceof HTMLElement) {\n\t\tif (!container.value?.contains(event.target)) {\n\t\t\temit('inactive');\n\t\t\tactive.value = false;\n\t\t\tdocument.removeEventListener('focusin', onDocumentFocus);\n\t\t\tdocument.removeEventListener('click', onDocumentClick);\n\t\t}\n\t}\n};\n</script>\n\n<style lang=\"postcss\">\n@import '@/assets/css/BaseSwitchGroup';\n</style>\n"],"names":["props","__props","emit","__emit","container","ref","active","loading","options","selectOption","unselectOption","useOptions","toRef","onChange","event","option","eventListeners","onDocumentFocus","onDocumentClick","_a"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEA,UAAMA,IAAQC,GASRC,IAAOC,GA8BPC,IAAYC,KACZC,IAASD,EAAI,EAAK,GAElB;AAAA,MACL,cAAcE;AAAA,MACd,SAAAC;AAAA,MACA,cAAAC;AAAA,MACA,gBAAAC;AAAA,QACGC,EAAW;AAAA,MACd,cAAcC,EAAMZ,GAAO,cAAc;AAAA,MACzC,kBAAkBA,EAAM;AAAA,MACxB,UAAUY,EAAMZ,GAAO,UAAU;AAAA,MACjC,MAAAE;AAAA,MACA,kBAAkBF,EAAM;AAAA,MACxB,OAAOY,EAAMZ,GAAO,OAAO;AAAA,MAC3B,UAAUA,EAAM;AAAA,MAChB,WAAWA,EAAM;AAAA,MACjB,YAAYY,EAAMZ,GAAO,YAAY;AAAA,MACrC,wBAAwBA,EAAM;AAAA,MAC9B,UAAU;AAAA,MACV,SAAS;AAAA,MACT,mBAAmB;AAAA,MACnB,4BAA4B;AAAA,MAC5B,OAAO;AAAA,IAAA,CACP,GAEKa,IAAW,CAACC,GAAcC,MAAmB;AAClD,MAAAb,EAAK,UAAUY,CAAK,GACfC,EAAO,WAGXL,EAAeK,CAAM,IAFrBN,EAAaM,CAAM;AAAA,IAGpB,GAYKC,IAAiB;AAAA,MACtB,QAAQ,CAACF,MAAsBZ,EAAK,QAAQY,CAAK;AAAA,MACjD,SAAS,CAACA,MAAsBZ,EAAK,SAASY,CAAK;AAAA,MACnD,SAZe,CAACA,MAAsB;AACtC,QAAAZ,EAAK,SAASY,CAAK,GACdR,EAAO,UACX,SAAS,iBAAiB,WAAWW,GAAiB,EAAE,SAAS,IAAM,GACvE,SAAS,iBAAiB,SAASC,GAAiB,EAAE,SAAS,IAAM,GACrEZ,EAAO,QAAQ;AAAA,MAChB;AAAA,MAOA,SAAS,CAACQ,MAAiBZ,EAAK,SAASY,CAAK;AAAA,MAC9C,WAAW,CAACA,MAAyBZ,EAAK,WAAWY,CAAK;AAAA,MAC1D,aAAa,CAACA,MAAsBZ,EAAK,aAAaY,CAAK;AAAA,MAC3D,WAAW,CAACA,MAAsBZ,EAAK,WAAWY,CAAK;AAAA,IAAA,GAGlDG,IAAkB,CAACH,MAAsB;;AAC1C,MAAAA,EAAM,kBAAkB,iBACtBK,IAAAf,EAAU,UAAV,QAAAe,EAAiB,SAASL,EAAM,YACpCZ,EAAK,UAAU,GACfI,EAAO,QAAQ,IACN,SAAA,oBAAoB,WAAWW,CAAe,GAC9C,SAAA,oBAAoB,SAASC,CAAe;AAAA,IAEvD,GAGKA,IAAkB,CAACJ,MAAsB;;AAC1C,MAAAA,EAAM,kBAAkB,iBACtBK,IAAAf,EAAU,UAAV,QAAAe,EAAiB,SAASL,EAAM,YACpCZ,EAAK,UAAU,GACfI,EAAO,QAAQ,IACN,SAAA,oBAAoB,WAAWW,CAAe,GAC9C,SAAA,oBAAoB,SAASC,CAAe;AAAA,IAEvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}