@indielayer/ui 1.11.0 → 1.12.0

package/lib/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "1.11.0";
+declare const _default: "1.12.0";
 export default _default;

package/lib/version.js

@@ -1,4 +1,4 @@
-const e = "1.11.0";
+const e = "1.12.0";
 export {
   e as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@indielayer/ui",
-  "version": "1.11.0",
+  "version": "1.12.0",
   "description": "Indielayer UI Components with Tailwind CSS build for Vue 3",
   "author": {
     "name": "João Teixeira",

package/src/components/select/Select.vue

@@ -16,7 +16,6 @@ const selectProps = {
     type: String,
     default: 'Filter by...',
   },
-  filterInputProps: Object,
   virtualList: Boolean,
   virtualListOffsetTop: Number,
   virtualListOffsetBottom: Number,
@@ -248,12 +247,13 @@ function handleOptionClick(value: string | number) {
         if (index !== -1) selected.value.splice(index, 1)
         else {
           selected.value.push(value)
-          emit('update:modelValue', selected.value)
         }
       } else {
         selected.value = [value]
       }
 
+      emit('update:modelValue', selected.value)
+
       if (props.filterable)
         setTimeout(() => {
           filterRef.value?.focus()
@@ -511,7 +511,12 @@ defineExpose({ focus, blur, reset, validate, setError, filterRef })
                     :outlined="!(isDisabled || options?.find((i) => i.value === value)?.disabled)"
                     :disabled="isDisabled || options?.find((i) => i.value === value)?.disabled"
                     @remove="(e: Event) => { handleRemove(e, value) }"
-                  >{{ getLabel(value) }}</x-tag>
+                  >
+                    <template #prefix>
+                      <slot name="tag-prefix" :item="options?.find((i) => i.value === value)"></slot>
+                    </template>
+                    {{ getLabel(value) }}
+                  </x-tag>
 
                   <div
                     v-if="showCountTag"
@@ -549,7 +554,6 @@ defineExpose({ focus, blur, reset, validate, setError, filterRef })
                     skip-form-registry
                     data-1p-ignore
                     size="sm"
-                    v-bind="filterInputProps"
                   />
                 </div>
               </slot>
@@ -599,7 +603,12 @@ defineExpose({ focus, blur, reset, validate, setError, filterRef })
                 :outlined="!(isDisabled || options?.find((i) => i.value === value)?.disabled)"
                 :disabled="isDisabled || options?.find((i) => i.value === value)?.disabled"
                 @remove="(e: Event) => { handleRemove(e, value) }"
-              >{{ getLabel(value) }}</x-tag>
+              >
+                <template #prefix>
+                  <slot name="tag-prefix" :item="options?.find((i) => i.value === value)"></slot>
+                </template>
+                {{ getLabel(value) }}
+              </x-tag>
             </x-popover-container>
           </template>
         </x-popover>

package/src/components/tag/Tag.vue

@@ -67,11 +67,18 @@ const { styles, classes, className } = useTheme('Tag', {}, props)
       ]"
   >
     <span
-      v-if="removable"
-      class="max-w-full truncate pr-4"
+      class="max-w-full"
+      :class="{'pr-4': removable }"
     >
-      <slot></slot>
-      <div class="absolute right-1.5 top-0 h-full flex items-center">
+      <div class="flex items-center gap-2">
+        <slot name="prefix"></slot>
+
+        <div class="truncate">
+          <slot></slot>
+        </div>
+      </div>
+
+      <div v-if="removable" class="absolute right-1.5 top-0 h-full flex items-center">
         <x-icon
           :size="closeIconSize"
           :icon="closeIcon"
@@ -81,7 +88,5 @@ const { styles, classes, className } = useTheme('Tag', {}, props)
         />
       </div>
     </span>
-
-    <slot v-else></slot>
   </component>
 </template>

package/src/version.ts

@@ -1 +1 @@
-export default '1.11.0'
+export default '1.12.0'