quasar-ui-sellmate-ui-kit 3.14.4 → 3.14.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar-ui-sellmate-ui-kit",
-  "version": "3.14.4",
+  "version": "3.14.6",
   "author": "Sellmate Dev Team <dev@sellmate.co.kr>",
   "description": "Sellmate UI Kit",
   "license": "MIT",

package/src/components/SButton.vue

@@ -60,6 +60,7 @@
 
   // TODO: hover 색 맞추기
   .s-button {
+    font-weight: $font-weight-md;
     &.q-btn {
       min-height: 0;
       height: fit-content;
@@ -114,16 +115,11 @@
         }
       }
     }
-    &.bg-primary,
-    &.bg-Blue_B_Darken-3 {
-      font-weight: $font-weight-md !important;
-    }
   }
   .s-button-xs {
     &.q-btn {
       height: 24px;
       padding: $button-padding-xs;
-      font-weight: $default-font-weight;
       font-size: $default-font;
       line-height: $default-content-height;
       min-width: 60px;
@@ -153,7 +149,6 @@
     &.q-btn {
       height: 28px;
       padding: $button-padding-sm;
-      font-weight: $default-font-weight;
       font-size: $default-font;
       line-height: $default-content-height;
       min-width: 70px;
@@ -181,7 +176,6 @@
   }
   .s-button-md {
     padding: $button-padding-md;
-    font-weight: $default-font-weight;
     font-size: $font-md;
     line-height: $line-height-md;
     min-width: 100px;
@@ -206,7 +200,9 @@
       max-height: $line-height-md;
     }
   }
-
+  .s-button.q-btn--outline {
+    font-weight: $default-font-weight;
+  }
   .s-button.q-btn--outline.disabled,
   .s-button.disabled {
     background: $Grey_Lighten-3 !important;
@@ -218,6 +214,7 @@
     }
   }
   .s-button.text-only {
+    font-weight: $default-font-weight;
     background: none !important;
     padding: 0 !important;
     min-width: 0;

package/src/components/SSelectSearch.vue

@@ -51,7 +51,10 @@
         </q-item-section>
       </q-item>
     </template>
-    <template v-if="(options.length && !model) || (noSelected && !options.length)" #selected>
+    <template
+      v-if="(options && options.length && !model) || (noSelected && options && !options.length)"
+      #selected
+    >
       <div v-if="noSelected && !options.length">{{ noSelected }}</div>
       <div v-else>
         {{ placeholder }}
@@ -130,7 +133,7 @@
     setup(props, { emit }) {
       const id = useId();
       const model = ref(props.modelValue);
-      const filteredOptions = ref(props.options);
+      const filteredOptions = ref(props.options || []);
       const findLabel = () =>
         props.options.find(opt => opt[props.optionValue] === props.modelValue)[props.optionLabel] ||
         '';
@@ -145,29 +148,32 @@
       }
 
       function handleInput(val) {
+        if (!sSelectRef.value) return;
+
         search.value = val;
         sSelectRef.value.setOptionIndex(-1);
 
-        if (!val) {
+        if (!val && props.options) {
           filteredOptions.value = props.options;
           sSelectRef.value.setOptionIndex(-1);
         }
       }
 
       function handleDelete() {
+        if (!sSelectRef.value) return;
         sSelectRef.value.setOptionIndex(-1);
         search.value = '';
         emit('onSearch', '');
       }
 
       const onSearch = debounce(val => {
-        if (!val) {
+        if (!val && props.options) {
           filteredOptions.value = props.options;
           return;
         }
 
         // 옵션을 선택 했을 때
-        if (sSelectRef.value.getOptionIndex() !== -1) {
+        if (sSelectRef.value && sSelectRef.value.getOptionIndex() !== -1) {
           model.value = filteredOptions.value[sSelectRef.value.getOptionIndex()][props.optionValue];
           handleDelete();
           sSelectRef.value.setOptionIndex(-1);
@@ -179,7 +185,7 @@
           v => (v[props.optionLabel] || v).toLowerCase().indexOf(val.toLowerCase()) > -1,
         );
 
-        if (!filtered.length) {
+        if (!filtered.length && sSelectRef.value) {
           emit('onSearch', val);
           sSelectRef.value.setOptionIndex(-1);
           return;
@@ -192,7 +198,7 @@
         () => props.modelValue,
         val => {
           model.value = val;
-          sSelectRef.value.setOptionIndex(-1);
+          if (sSelectRef.value) sSelectRef.value.setOptionIndex(-1);
         },
       );
 
@@ -206,8 +212,10 @@
           // const existingValues = new Set(filteredOptions.value.map((option) => option.value));
           // const nonDuplicateOptions = val.filter((option) => !existingValues.has(option.value));
           // filteredOptions.value.push(...nonDuplicateOptions);
-          filteredOptions.value = val;
-          sSelectRef.value.setOptionIndex(-1);
+          if (val) {
+            filteredOptions.value = val;
+            if (sSelectRef.value) sSelectRef.value.setOptionIndex(-1);
+          }
         },
         { deep: true },
       );