v-nuxt-ui 0.1.30 → 0.1.32

package/dist/module.json

@@ -7,7 +7,7 @@
   "dependencies": [
     "@nuxt/ui"
   ],
-  "version": "0.1.30",
+  "version": "0.1.32",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/components/form/field/AsyncSelect.d.vue.ts

@@ -1,11 +1,11 @@
-import type { Component } from 'vue';
+import { type Component as VueComponent } from 'vue';
 import type { VFormFieldAsyncSelectProps } from '#v/types';
 declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: import("vue").PublicProps & __VLS_PrettifyLocal<(VFormFieldAsyncSelectProps<T> & {
         icon?: string;
         disabled?: boolean;
         canCreate?: boolean;
-        createModalComponent?: Component;
+        createModalComponent?: VueComponent;
         createModalOpenProps?: Record<string, any>;
     } & {
         modelValue: string[] | number[] | number | string | null | undefined;

package/dist/runtime/components/form/field/AsyncSelect.vue

@@ -1,9 +1,10 @@
 <script setup>
-import { ref, computed } from "vue";
-import { useFetching } from "#v/composables/useBoolean";
+import { computed, ref } from "vue";
+import { defu } from "defu";
+import { useFetching } from "#v/composables";
 import { isEmptyString } from "#v/utils";
+import { useOverlay } from "@nuxt/ui/runtime/composables/useOverlay.js";
 import { useDebounceFn } from "@vueuse/core";
-import { defu } from "defu";
 import { useApp } from "#v/composables/useApp";
 const props = defineProps({
   listApi: { type: Function, required: true },
@@ -103,6 +104,26 @@ const onFetchItems = async () => {
   }
 };
 const onDebounceFetchItems = useDebounceFn(onFetchItems, 512);
+const onCreateNew = async () => {
+  if (!props.createModalComponent) return;
+  open.value = false;
+  const modal = useOverlay().create(props.createModalComponent);
+  modal.open({
+    model: { id: 0 },
+    ...props.createModalOpenProps,
+    onSave: (newModel) => {
+      searchedData.value.push(newModel);
+      const newValue = newModel[props.valueField];
+      if (props.multiple) {
+        const currentValues = Array.isArray(modelValue.value) ? [...modelValue.value] : [];
+        currentValues.push(newValue);
+        onSelect(currentValues);
+      } else {
+        onSelect(newValue);
+      }
+    }
+  });
+};
 </script>
 
 <template>
@@ -111,6 +132,10 @@ const onDebounceFetchItems = useDebounceFn(onFetchItems, 512);
     :model-value="modelValue"
     :search-term="searchTerm"
     :items="items"
+    :create-item="canCreate && createModalComponent && {
+  position: 'top',
+  when: 'always'
+}"
     value-key="value"
     ignore-filter
     :multiple="multiple"
@@ -139,5 +164,6 @@ const onDebounceFetchItems = useDebounceFn(onFetchItems, 512);
   onDebounceFetchItems();
 }"
     @update:model-value="onSelect"
+    @create="onCreateNew"
   />
 </template>

package/dist/runtime/components/form/field/AsyncSelect.vue.d.ts

@@ -1,11 +1,11 @@
-import type { Component } from 'vue';
+import { type Component as VueComponent } from 'vue';
 import type { VFormFieldAsyncSelectProps } from '#v/types';
 declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: import("vue").PublicProps & __VLS_PrettifyLocal<(VFormFieldAsyncSelectProps<T> & {
         icon?: string;
         disabled?: boolean;
         canCreate?: boolean;
-        createModalComponent?: Component;
+        createModalComponent?: VueComponent;
         createModalOpenProps?: Record<string, any>;
     } & {
         modelValue: string[] | number[] | number | string | null | undefined;

package/dist/runtime/components/sys/user/Table.vue

@@ -98,7 +98,12 @@ const columns = [
     header: "\u662F\u5426\u9700\u8981\u586B\u5199\u5DE5\u65F6",
     filterOption: {
       type: "select",
-      items: booleanOptions
+      items: booleanOptions,
+      empty: {
+        label: "\u5426",
+        variant: "outline",
+        color: "neutral"
+      }
     }
   },
   {
@@ -106,7 +111,12 @@ const columns = [
     header: "\u6027\u522B",
     filterOption: {
       type: "select",
-      items: genderOptions
+      items: genderOptions,
+      empty: {
+        label: "\u672A\u77E5",
+        variant: "outline",
+        color: "neutral"
+      }
     },
     meta: {
       class: {

package/dist/runtime/composables/table/useTableColumns.js

@@ -88,7 +88,7 @@ export function useTableColumns(props) {
                 color: item?.color ?? "neutral",
                 variant: selectOption.variant ?? "outline",
                 icon: item?.icon
-              }, () => item?.label ?? "\u672A\u77E5\u503C") : h(UBadge, { ...selectOption.empty });
+              }, () => item?.label ?? "\u672A\u77E5\u503C") : selectOption.empty ? h(UBadge, { ...selectOption.empty }) : null;
             }
           };
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "v-nuxt-ui",
-  "version": "0.1.30",
+  "version": "0.1.32",
   "description": "Veken UI Component Library - Reusable Nuxt UI components, composables, and utilities for enterprise applications",
   "type": "module",
   "style": "./dist/runtime/index.css",