@bagelink/vue 0.0.566 → 0.0.568

package/dist/components/form/inputs/SelectInput.vue.d.ts

@@ -19,6 +19,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_TypePropsToRu
     multiselect?: boolean;
     icon?: MaterialIcons;
     hideLabel?: boolean;
+    defaultValue?: Option;
 }>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (...args: any[]) => void;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
@@ -33,6 +34,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_TypePropsToRu
     multiselect?: boolean;
     icon?: MaterialIcons;
     hideLabel?: boolean;
+    defaultValue?: Option;
 }>>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {}, {}>;

package/dist/components/form/inputs/SelectInput.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/SelectInput.vue"],"names":[],"mappings":"AAIA,OAAO,wBAAwB,CAAA;AAC/B,OAAO,EAGN,KAAK,aAAa,EAElB,MAAM,eAAe,CAAA;AAItB,KAAK,MAAM,GACR,MAAM,GACN,MAAM,GACN,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GACnB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,CAAA;AA4J5C,iBAAS,cAAc;kBAyQI,GAAG;EAG7B;AAqCD,QAAA,MAAM,eAAe;aAMX,MAAM,EAAE;kBACH,MAAM;eACT,OAAO;iBACL,MAAM;iBACN,OAAO;eACT,OAAO;YACV,MAAM;gBACF,OAAO;kBACL,OAAO;WACd,aAAa;gBACR,OAAO;;;;aAVV,MAAM,EAAE;kBACH,MAAM;eACT,OAAO;iBACL,MAAM;iBACN,OAAO;eACT,OAAO;YACV,MAAM;gBACF,OAAO;kBACL,OAAO;WACd,aAAa;gBACR,OAAO;;;UAGlB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAAvG,wBAAwG;AACxG,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAAE,QAAO;QAClD,MAAM,EAAE,CAAC,CAAC;KACT,CAAA;CAAE,CAAC"}
+{"version":3,"file":"SelectInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/SelectInput.vue"],"names":[],"mappings":"AAIA,OAAO,wBAAwB,CAAA;AAC/B,OAAO,EAGN,KAAK,aAAa,EAElB,MAAM,eAAe,CAAA;AAItB,KAAK,MAAM,GACR,MAAM,GACN,MAAM,GACN,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GACnB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,CAAA;AAsK5C,iBAAS,cAAc;kBAyQI,GAAG;EAG7B;AAsCD,QAAA,MAAM,eAAe;aAMX,MAAM,EAAE;kBACH,MAAM;eACT,OAAO;iBACL,MAAM;iBACN,OAAO;eACT,OAAO;YACV,MAAM;gBACF,OAAO;kBACL,OAAO;WACd,aAAa;gBACR,OAAO;mBACJ,MAAM;;;;aAXZ,MAAM,EAAE;kBACH,MAAM;eACT,OAAO;iBACL,MAAM;iBACN,OAAO;eACT,OAAO;YACV,MAAM;gBACF,OAAO;kBACL,OAAO;WACd,aAAa;gBACR,OAAO;mBACJ,MAAM;;;UAGpB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAAvG,wBAAwG;AACxG,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAAE,QAAO;QAClD,MAAM,EAAE,CAAC,CAAC;KACT,CAAA;CAAE,CAAC"}

package/dist/index.cjs

@@ -25624,7 +25624,8 @@ const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
     fullWidth: { type: Boolean },
     multiselect: { type: Boolean },
     icon: {},
-    hideLabel: { type: Boolean }
+    hideLabel: { type: Boolean },
+    defaultValue: {}
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
@@ -25673,7 +25674,7 @@ const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
       if (typeof option2 === "number") return option2;
       return option2.value;
     }
-    const isSelected = (option2) => !!selectedItems.value.find((item) => getValue(option2) === getValue(item));
+    const isSelected = (option2) => selectedItems.value.find((item) => getValue(option2) === getValue(item)) !== void 0;
     const filteredOptions = vue.computed(() => props2.options.filter((option2) => {
       const searchTerm = search.value.split(/\s+/).filter(Boolean).map((t) => new RegExp(t, "gi"));
       return Boolean(option2) && searchTerm.every((s2) => getLabel(option2).match(s2));
@@ -25713,7 +25714,7 @@ const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
       () => props2.modelValue,
       (newVal) => {
         if (!props2.multiselect) {
-          const newOption = props2.options.find((o2) => getValue(o2) === newVal) || newVal;
+          const newOption = props2.options.find((o2) => getValue(o2) === newVal) ?? newVal;
           if (newOption && !isSelected(newOption)) selectedItems.value = [newOption];
         } else {
           const isSame = compareArrays([newVal].flat(), selectedItems.value);
@@ -25731,12 +25732,21 @@ const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
           const exists = props2.options.find(
             (o2) => getValue(o2) === getValue(option2)
           );
-          if (!exists) selectedItems.value.splice(i2, 1);
+          if (exists === void 0) selectedItems.value.splice(i2, 1);
           else selectedItems.value.splice(i2, 1, exists);
         });
       },
       { deep: true, immediate: true }
     );
+    vue.onMounted(() => {
+      if (props2.defaultValue !== void 0) {
+        const defaultOption = props2.options.find(
+          (o2) => getValue(o2) === getValue(props2.defaultValue)
+        );
+        if (defaultOption === void 0) return;
+        selectedItems.value = [defaultOption];
+      }
+    });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(vue.unref(kt$1), {
         ref_key: "dropdown",
@@ -25821,7 +25831,7 @@ const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const SelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-761f89bf"]]);
+const SelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-4e1d2142"]]);
 /*!
   * vue-draggable-next v2.2.0
   * (c) 2023 Anish George

package/dist/index.mjs

@@ -25622,7 +25622,8 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     fullWidth: { type: Boolean },
     multiselect: { type: Boolean },
     icon: {},
-    hideLabel: { type: Boolean }
+    hideLabel: { type: Boolean },
+    defaultValue: {}
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
@@ -25671,7 +25672,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
       if (typeof option2 === "number") return option2;
       return option2.value;
     }
-    const isSelected = (option2) => !!selectedItems.value.find((item) => getValue(option2) === getValue(item));
+    const isSelected = (option2) => selectedItems.value.find((item) => getValue(option2) === getValue(item)) !== void 0;
     const filteredOptions = computed(() => props2.options.filter((option2) => {
       const searchTerm = search.value.split(/\s+/).filter(Boolean).map((t) => new RegExp(t, "gi"));
       return Boolean(option2) && searchTerm.every((s2) => getLabel(option2).match(s2));
@@ -25711,7 +25712,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
       () => props2.modelValue,
       (newVal) => {
         if (!props2.multiselect) {
-          const newOption = props2.options.find((o2) => getValue(o2) === newVal) || newVal;
+          const newOption = props2.options.find((o2) => getValue(o2) === newVal) ?? newVal;
           if (newOption && !isSelected(newOption)) selectedItems.value = [newOption];
         } else {
           const isSame = compareArrays([newVal].flat(), selectedItems.value);
@@ -25729,12 +25730,21 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
           const exists = props2.options.find(
             (o2) => getValue(o2) === getValue(option2)
           );
-          if (!exists) selectedItems.value.splice(i2, 1);
+          if (exists === void 0) selectedItems.value.splice(i2, 1);
           else selectedItems.value.splice(i2, 1, exists);
         });
       },
       { deep: true, immediate: true }
     );
+    onMounted(() => {
+      if (props2.defaultValue !== void 0) {
+        const defaultOption = props2.options.find(
+          (o2) => getValue(o2) === getValue(props2.defaultValue)
+        );
+        if (defaultOption === void 0) return;
+        selectedItems.value = [defaultOption];
+      }
+    });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(kt$1), {
         ref_key: "dropdown",
@@ -25819,7 +25829,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-761f89bf"]]);
+const SelectInput = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-4e1d2142"]]);
 /*!
   * vue-draggable-next v2.2.0
   * (c) 2023 Anish George

package/dist/style.css

@@ -1909,10 +1909,10 @@ svg.leaflet-image-layer.leaflet-interactive path {
 }
 .resize-observer[data-v-b329ee4c]{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;border:none;background-color:transparent;pointer-events:none;display:block;overflow:hidden;opacity:0}.resize-observer[data-v-b329ee4c] object{display:block;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}.v-popper__popper{z-index:10000;top:0;left:0;outline:none}.v-popper__popper.v-popper__popper--hidden{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s;pointer-events:none}.v-popper__popper.v-popper__popper--shown{visibility:visible;opacity:1;transition:opacity .15s}.v-popper__popper.v-popper__popper--skip-transition,.v-popper__popper.v-popper__popper--skip-transition>.v-popper__wrapper{transition:none!important}.v-popper__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;display:none}.v-popper__inner{position:relative;box-sizing:border-box;overflow-y:auto}.v-popper__inner>div{position:relative;z-index:1;max-width:inherit;max-height:inherit}.v-popper__arrow-container{position:absolute;width:10px;height:10px}.v-popper__popper--arrow-overflow .v-popper__arrow-container,.v-popper__popper--no-positioning .v-popper__arrow-container{display:none}.v-popper__arrow-inner,.v-popper__arrow-outer{border-style:solid;position:absolute;top:0;left:0;width:0;height:0}.v-popper__arrow-inner{visibility:hidden;border-width:7px}.v-popper__arrow-outer{border-width:6px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{left:-2px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{left:-1px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer{border-bottom-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container{top:0}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{border-top-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{top:-4px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{top:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{top:-1px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{border-left-width:0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{left:-4px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{left:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container{right:-10px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer{border-right-width:0;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner{left:-2px}.v-popper--theme-tooltip .v-popper__inner{background:rgba(0,0,0,.8);color:#fff;border-radius:6px;padding:7px 12px 6px}.v-popper--theme-tooltip .v-popper__arrow-outer{border-color:#000c}.v-popper--theme-dropdown .v-popper__inner{background:#fff;color:#000;border-radius:6px;border:1px solid #ddd;box-shadow:0 6px 30px #0000001a}.v-popper--theme-dropdown .v-popper__arrow-inner{visibility:visible;border-color:#fff}.v-popper--theme-dropdown .v-popper__arrow-outer{border-color:#ddd}
 
-.selectinput[data-v-761f89bf] {
+.selectinput[data-v-4e1d2142] {
 	width: 100%;
 }
-.selectinput-option[data-v-761f89bf] {
+.selectinput-option[data-v-4e1d2142] {
 	padding: 6px 12px;
 	cursor: pointer;
 	border-radius: 5px;
@@ -1923,14 +1923,14 @@ svg.leaflet-image-layer.leaflet-interactive path {
 	width: 100%;
 	font-size: var(--input-font-size);
 }
-.selectinput-options[data-v-761f89bf] {
+.selectinput-options[data-v-4e1d2142] {
 	max-height: 300px;
 	overflow-y: auto;
 }
-.selectinput-option[data-v-761f89bf]:hover {
+.selectinput-option[data-v-4e1d2142]:hover {
 	background: var(--bgl-gray-20);
 }
-.isEmpty p[data-v-761f89bf] {
+.isEmpty p[data-v-4e1d2142] {
 	opacity: 0.3;
 }
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bagelink/vue",
   "type": "module",
-  "version": "0.0.566",
+  "version": "0.0.568",
   "description": "Bagel core sdk packages",
   "author": {
     "name": "Neveh Allon",

package/src/components/form/inputs/SelectInput.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { watch } from 'vue'
+import { onMounted, watch } from 'vue'
 import { Dropdown } from 'floating-vue'
 import 'floating-vue/style.css'
 import {
@@ -27,6 +27,7 @@ const props = defineProps<{
 	multiselect?: boolean
 	icon?: MaterialIcons
 	hideLabel?: boolean
+	defaultValue?: Option
 }>()
 
 const emit = defineEmits(['update:modelValue'])
@@ -47,8 +48,7 @@ function openOptions() {
 
 function updateOpen(visible: boolean) {
 	open = visible
-	if (!open) { search = ''
-	}
+	if (!open) { search = '' }
 	else {
 		setTimeout(
 			() => (searchInput as any)?.$el?.querySelector('input')?.focus(),
@@ -83,7 +83,7 @@ function getValue(option?: Option) {
 	return option.value
 }
 
-const isSelected = (option: Option) => !!selectedItems.find(item => getValue(option) === getValue(item))
+const isSelected = (option: Option) => selectedItems.find(item => getValue(option) === getValue(item)) !== undefined
 
 const filteredOptions = $computed(() =>	props.options.filter((option) => {
 	const searchTerm = search
@@ -136,8 +136,7 @@ watch(
 	() => props.modelValue,
 	(newVal: Option | Option[]) => {
 		if (!props.multiselect) {
-			const newOption
-				= props.options.find(o => getValue(o) === newVal) || newVal
+			const newOption = props.options.find(o => getValue(o) === newVal) ?? newVal
 			if (newOption && !isSelected(newOption)) selectedItems = [newOption]
 		} else {
 			const isSame = compareArrays([newVal].flat(), selectedItems)
@@ -156,7 +155,7 @@ watch(
 			const exists = props.options.find(
 				o => getValue(o) === getValue(option),
 			)
-			if (!exists) selectedItems.splice(i, 1)
+			if (exists === undefined) selectedItems.splice(i, 1)
 			else selectedItems.splice(i, 1, exists)
 		})
 		// const original = JSON.stringify(props.options.map(getValue));
@@ -165,6 +164,17 @@ watch(
 	},
 	{ deep: true, immediate: true },
 )
+
+onMounted(() => {
+	if (props.defaultValue !== undefined) {
+		const defaultOption = props.options.find(
+			o => getValue(o) === getValue(props.defaultValue),
+		)
+		if (defaultOption === undefined) return
+
+		selectedItems = [defaultOption]
+	}
+})
 </script>
 
 <template>