@onereach/ui-components 2.69.7 → 2.69.8-beta.2189.0

package/src/components/or-select-v3/OrSelect.vue

@@ -24,6 +24,7 @@
       v-dropdown-open="toggle"
       v-dropdown-close="close"
       :class="[popoverState === 'open' && 'rounded-b-0']"
+      :variant="disableDefaultStyles ? 'unstyled' : 'styled'"
       :size="size"
       :invalid="invalid"
       :readonly="readonly"
@@ -38,12 +39,12 @@
         @focus="$emit('focus', $event)"
         @blur="$emit('blur', $event)"
       >
-        <template v-if="proxyModelValue && proxyModelValue.length > 0">
-          <template v-if="multiple">
-            <slot
-              name="valueTemplate"
-              :model="proxyModelValue"
-            >
+        <template v-if="multiple">
+          <slot
+            name="valueTemplate"
+            :model="proxyModelValue"
+          >
+            <template v-if="proxyModelValue && proxyModelValue.length > 0">
               <OrTag
                 v-for="option in selection"
                 :key="option.value"
@@ -52,10 +53,16 @@
               >
                 {{ option.label }}
               </OrTag>
-            </slot>
-          </template>
+            </template>
 
-          <template v-else>
+            <template v-else>
+              <span :class="placeholderStyles">{{ placeholder }}</span>
+            </template>
+          </slot>
+        </template>
+
+        <template v-else>
+          <template v-if="proxyModelValue">
             <slot
               name="valueTemplate"
               :model="proxyModelValue"
@@ -63,10 +70,10 @@
               {{ selection.label }}
             </slot>
           </template>
-        </template>
 
-        <template v-else>
-          <span :class="placeholderStyles">{{ placeholder }}</span>
+          <template v-else>
+            <span :class="placeholderStyles">{{ placeholder }}</span>
+          </template>
         </template>
       </div>
 
@@ -265,12 +272,12 @@ export default defineComponent({
     },
 
     modelValue: {
-      type: [String, Array] as PropType<string | string[]>,
+      type: [String, Number, Array] as PropType<string | number | (string | number)[]>,
       default: undefined,
     },
 
     value: { // TODO: Remove Vue 2 fallback
-      type: [String, Array] as PropType<string | string[]>,
+      type: [String, Number, Array] as PropType<string | number | (string | number)[]>,
       default: undefined,
     },
 
@@ -314,6 +321,11 @@ export default defineComponent({
       default: false,
     },
 
+    disableDefaultStyles: {
+      type: Boolean,
+      default: false,
+    },
+
     enableSearch: {
       type: Boolean,
       default: false,

package/src/components/or-select-v3/index.ts

@@ -1,2 +1,3 @@
 export { default as OrSelectV3 } from './OrSelect.vue';
 export * from './props';
+export * from './types';

package/src/components/or-select-v3/types.ts

@@ -1,5 +1,5 @@
 export interface SelectOption {
-  value: string;
+  value: string | number;
   label: string;
 }