@ouestfrance/sipa-bms-ui 8.9.0 → 8.9.1

package/dist/sipa-bms-ui.umd.js

@@ -68461,9 +68461,7 @@
       disabled: { type: Boolean, default: false },
       small: { type: Boolean }
     }, {
-      "modelValue": {
-        required: true
-      },
+      "modelValue": { default: [] },
       "modelModifiers": {}
     }),
     emits: ["update:modelValue"],
@@ -68475,8 +68473,12 @@
       const openDatalist = () => isDatalistOpen.value = true;
       const searching = vue.ref("");
       const modelValue = vue.useModel(__props, "modelValue");
+      onClickOutside(inputElement, closeDatalist, {
+        ignore: [".datalist-option", ".icon-toggle-button"]
+      });
       const onBackspace = () => {
-        modelValue.value.splice(-1);
+        if (searching.value.length === 0 && modelValue.value && modelValue.value.length > 0)
+          modelValue.value.splice(-1);
       };
       const setFocus = () => {
         if (inputElement.value) {
@@ -68484,38 +68486,50 @@
         }
       };
       const onSelect = (option) => {
-        modelValue.value.push(option);
+        if (typeof option === "string") {
+          modelValue.value = (modelValue.value ?? []).concat(option);
+        } else if (option.value) {
+          modelValue.value = (modelValue.value ?? []).concat(option.value);
+        }
         searching.value = "";
         setFocus();
         closeDatalist();
       };
       const removeOption = (value) => {
-        modelValue.value = modelValue.value.filter((o) => o.value !== value);
+        modelValue.value = (modelValue.value ?? []).filter((o) => o !== value);
       };
       const clearInput = () => {
         modelValue.value = [];
         searching.value = "";
       };
-      const displayedOptions = vue.computed(
-        () => props.options.filter((o) => searchString(o.label, searching.value)).filter(
-          (o) => !modelValue.value.find((option) => option.value === o.value)
-        )
+      const selectedItems = vue.computed(() => {
+        if (!modelValue.value) return [];
+        const items = [];
+        modelValue.value.forEach((selectedValue) => {
+          const item = optionsLabelValue.value.find(
+            (option) => option.value === selectedValue
+          );
+          if (item) items.push(item);
+        });
+        return items;
+      });
+      const optionsLabelValue = vue.computed(
+        () => Array.isArray(props.options) && !!props.options.length && typeof props.options[0] === "string" ? props.options.map((o) => ({ label: o, value: o })) : props.options
       );
-      const displayValues = vue.computed(
-        () => modelValue.value.filter(
-          (o) => props.options.find((option) => option.value === o.value)
-        )
+      const filteredOptions = vue.computed(
+        () => optionsLabelValue.value.filter((o) => searchString(o.label, searching.value))
       );
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createBlock(RawSelect, vue.mergeProps(_ctx.$props, {
-          options: displayedOptions.value,
+          options: filteredOptions.value,
           "model-value": modelValue.value,
           open: isDatalistOpen.value,
-          onSelect
+          onSelect,
+          onClick: setFocus
         }), {
           input: vue.withCtx(() => [
             vue.createElementVNode("div", _hoisted_1$F, [
-              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(displayValues.value, (tag) => {
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(selectedItems.value, (tag) => {
                 return vue.openBlock(), vue.createBlock(BmsTag, {
                   small: _ctx.small,
                   active: "",
@@ -68546,7 +68560,7 @@
               ])
             ]),
             vue.createElementVNode("span", _hoisted_2$r, [
-              modelValue.value.length ? (vue.openBlock(), vue.createBlock(vue.unref(X), {
+              modelValue.value && modelValue.value?.length ? (vue.openBlock(), vue.createBlock(vue.unref(X), {
                 key: 0,
                 class: "icon icon-clear",
                 onClick: vue.withModifiers(clearInput, ["stop"])
@@ -68581,7 +68595,7 @@
     }
   });
 
-  const BmsMultiSelect = /* @__PURE__ */ _export_sfc(_sfc_main$O, [["__scopeId", "data-v-05d9b16f"]]);
+  const BmsMultiSelect = /* @__PURE__ */ _export_sfc(_sfc_main$O, [["__scopeId", "data-v-aece870d"]]);
 
   const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
     __name: "BmsSearch",