@shwfed/nuxt 0.1.21 → 0.1.23

package/dist/module.d.mts

@@ -1,7 +1,7 @@
 import * as _nuxt_schema from '@nuxt/schema';
 
 interface ModuleOptions {
-    clientId: string;
+    features: ReadonlyArray<string>;
 }
 declare module 'nuxt/schema' {
     interface PublicRuntimeConfig {

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@shwfed/nuxt",
   "configKey": "shwfed",
-  "version": "0.1.21",
+  "version": "0.1.23",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -1,16 +1,23 @@
-import { defineNuxtModule, createResolver, addPlugin, addImportsDir, addComponentsDir } from '@nuxt/kit';
+import { defineNuxtModule, createResolver, addVitePlugin, addPlugin, addImportsDir, addComponentsDir } from '@nuxt/kit';
+import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite';
 
 const module$1 = defineNuxtModule({
   meta: {
     name: "@shwfed/nuxt",
     configKey: "shwfed"
   },
-  defaults: {},
+  defaults: {
+    features: []
+  },
   setup(options, nuxt) {
     const resolver = createResolver(import.meta.url);
     nuxt.options.runtimeConfig.public.shwfed = options;
     nuxt.options.css ||= [];
     nuxt.options.css.push("vue-sonner/style.css");
+    addVitePlugin(VueI18nPlugin({
+      ssr: true
+    }));
+    addPlugin(resolver.resolve("runtime/plugins/i18n/index"));
     addPlugin(resolver.resolve("runtime/plugins/cel/index"));
     addPlugin(resolver.resolve("runtime/plugins/markdown/index"));
     addPlugin({

package/dist/runtime/components/app.d.vue.ts

@@ -1,6 +1,6 @@
-declare var __VLS_19: {};
+declare var __VLS_53: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_19) => any;
+    default?: (props: typeof __VLS_53) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/components/app.vue

@@ -1,7 +1,13 @@
 <script setup>
 import { useHead } from "#app";
+import { ref } from "vue";
+import { CommandDialog, CommandInput, CommandList, CommandGroup, CommandEmpty } from "./ui/command";
 import { TooltipProvider } from "./ui/tooltip";
 import { Toaster } from "vue-sonner";
+import { useMagicKeys, whenever } from "@vueuse/core";
+import { useI18n } from "vue-i18n";
+import { Icon } from "@iconify/vue";
+const { t } = useI18n();
 useHead({
   bodyAttrs: {
     style: {
@@ -9,13 +15,59 @@ useHead({
     }
   }
 });
+const isCommandOpen = ref(false);
+const { meta_k } = useMagicKeys();
+whenever(() => meta_k?.value, () => {
+  isCommandOpen.value = !isCommandOpen.value;
+});
 </script>
 
 <template>
   <TooltipProvider>
     <ClientOnly>
       <Toaster />
+      <CommandDialog
+        v-if="$dsl.evaluate`feature('command-palette')`()"
+        v-model:open="isCommandOpen"
+      >
+        <CommandInput />
+        <CommandList>
+          <CommandEmpty as-child>
+            <section class="h-32 flex flex-col text-lg items-center justify-center gap-2 select-none">
+              <Icon
+                icon="fluent:app-recent-20-regular"
+                class="text-zinc-400 text-2xl!"
+              />
+              <p class="text-zinc-500">
+                {{ t("command-palette-empty") }}
+              </p>
+            </section>
+          </CommandEmpty>
+          <CommandGroup>
+            <!-- <CommandItem
+              v-for="command in commands"
+              :key="command.title"
+              :value="command.title"
+            >
+              <Icon
+                v-if="command.icon"
+                :icon="command.icon"
+              />
+              <span>{{ command.title }}</span>
+            </CommandItem> -->
+          </CommandGroup>
+        </CommandList>
+      </CommandDialog>
     </ClientOnly>
     <slot />
   </TooltipProvider>
 </template>
+
+<i18n lang="yaml">
+zh:
+  command-palette-empty: 无搜索结果
+ja:
+  command-palette-empty: 結果はありません
+en:
+  command-palette-empty: No results
+</i18n>

package/dist/runtime/components/app.vue.d.ts

@@ -1,6 +1,6 @@
-declare var __VLS_19: {};
+declare var __VLS_53: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_19) => any;
+    default?: (props: typeof __VLS_53) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/components/table.d.vue.ts

@@ -1,4 +1,4 @@
-import type { RowData, TableOptions } from '@tanstack/vue-table';
+import type { CellContext, RowData, TableOptions } from '@tanstack/vue-table';
 export type Expression = string;
 export type Markdown = string;
 export type Render = string | Readonly<{
@@ -32,7 +32,7 @@ declare module '@tanstack/vue-table' {
 }
 declare const _default: typeof __VLS_export;
 export default _default;
-declare const __VLS_export: import("vue").DefineComponent<Readonly<{
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<Readonly<{
     id: string;
     getRowId?: Expression;
     getSubRows?: Expression;
@@ -63,4 +63,13 @@ declare const __VLS_export: import("vue").DefineComponent<Readonly<{
     readonly enableMultiRowSelection: Expression;
     readonly enableRowSelection: Expression;
     readonly cellStyles: Expression;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    [key: string]: (props: Readonly<{
+        cell: CellContext<unknown, unknown>;
+    }>) => void;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/table.vue

@@ -26,6 +26,7 @@ const props = defineProps({
   paginationLeft: { type: String, required: false },
   paginationRight: { type: String, required: false }
 });
+const slots = defineSlots();
 const { $dsl } = useNuxtApp();
 const isCheating = useCheating();
 const { resolveTableRenderer } = useTableRenderers();
@@ -60,6 +61,9 @@ function translate(column) {
     id: column.id ?? genColumnId(column),
     header: (ctx) => renderer.header?.({ ctx, options }) ?? column.title,
     cell: (ctx) => {
+      if (ctx.column.id in slots) {
+        return slots[ctx.column.id]?.({ cell: ctx });
+      }
       return renderer.cell({ ctx, options });
     },
     accessorFn: (row, index) => {

package/dist/runtime/components/table.vue.d.ts

@@ -1,4 +1,4 @@
-import type { RowData, TableOptions } from '@tanstack/vue-table';
+import type { CellContext, RowData, TableOptions } from '@tanstack/vue-table';
 export type Expression = string;
 export type Markdown = string;
 export type Render = string | Readonly<{
@@ -32,7 +32,7 @@ declare module '@tanstack/vue-table' {
 }
 declare const _default: typeof __VLS_export;
 export default _default;
-declare const __VLS_export: import("vue").DefineComponent<Readonly<{
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<Readonly<{
     id: string;
     getRowId?: Expression;
     getSubRows?: Expression;
@@ -63,4 +63,13 @@ declare const __VLS_export: import("vue").DefineComponent<Readonly<{
     readonly enableMultiRowSelection: Expression;
     readonly enableRowSelection: Expression;
     readonly cellStyles: Expression;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    [key: string]: (props: Readonly<{
+        cell: CellContext<unknown, unknown>;
+    }>) => void;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/button-group/ButtonGroupSeparator.d.vue.ts

@@ -4,7 +4,7 @@ type __VLS_Props = SeparatorProps & {
     class?: HTMLAttributes['class'];
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    orientation: "horizontal" | "vertical";
+    orientation: "vertical" | "horizontal";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/button-group/ButtonGroupSeparator.vue.d.ts

@@ -4,7 +4,7 @@ type __VLS_Props = SeparatorProps & {
     class?: HTMLAttributes['class'];
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    orientation: "horizontal" | "vertical";
+    orientation: "vertical" | "horizontal";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/button-group/index.d.ts

@@ -3,6 +3,6 @@ export { default as ButtonGroup } from './ButtonGroup.vue.js';
 export { default as ButtonGroupSeparator } from './ButtonGroupSeparator.vue.js';
 export { default as ButtonGroupText } from './ButtonGroupText.vue.js';
 export declare const buttonGroupVariants: (props?: ({
-    orientation?: "horizontal" | "vertical" | null | undefined;
+    orientation?: "vertical" | "horizontal" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export type ButtonGroupVariants = VariantProps<typeof buttonGroupVariants>;

package/dist/runtime/components/ui/checkbox/Checkbox.d.vue.ts

@@ -0,0 +1,25 @@
+import type { CheckboxRootProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+type __VLS_Props = CheckboxRootProps & {
+    class?: HTMLAttributes['class'];
+};
+declare var __VLS_14: {
+    modelValue: import("reka-ui").CheckboxCheckedState;
+    state: import("reka-ui").CheckboxCheckedState;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: boolean | "indeterminate") => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: boolean | "indeterminate") => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/checkbox/Checkbox.vue

@@ -0,0 +1,47 @@
+<script setup>
+import { reactiveOmit } from "@vueuse/core";
+import { Icon } from "@iconify/vue";
+import { CheckboxIndicator, CheckboxRoot, useForwardPropsEmits } from "reka-ui";
+import { cn } from "../../../utils/cn";
+const props = defineProps({
+  defaultValue: { type: [Boolean, String], required: false },
+  modelValue: { type: [Boolean, String, null], required: false },
+  disabled: { type: Boolean, required: false },
+  value: { type: null, required: false },
+  id: { type: String, required: false },
+  asChild: { type: Boolean, required: false },
+  as: { type: null, required: false },
+  name: { type: String, required: false },
+  required: { type: Boolean, required: false },
+  class: { type: null, required: false }
+});
+const emits = defineEmits(["update:modelValue"]);
+const delegatedProps = reactiveOmit(props, "class");
+const forwarded = useForwardPropsEmits(delegatedProps, emits);
+</script>
+
+<template>
+  <CheckboxRoot
+    v-slot="slotProps"
+    data-slot="checkbox"
+    v-bind="forwarded"
+    :class="
+  cn(
+    'peer cursor-pointer flex items-center justify-center border-zinc-200 data-[state=checked]:bg-(--primary) data-[state=checked]:text-white data-[state=checked]:border-(--primary) aria-invalid:border-red-400 size-4 shrink-0 rounded border shadow-xs hover:shadow transition-shadow outline-none disabled:cursor-not-allowed disabled:opacity-50',
+    props.class
+  )
+"
+  >
+    <CheckboxIndicator
+      data-slot="checkbox-indicator"
+      class="grid h-full w-full place-content-center transition-none text-xs"
+    >
+      <slot v-bind="slotProps">
+        <Icon
+          v-if="$props.modelValue === true"
+          icon="fluent:checkmark-20-filled"
+        />
+      </slot>
+    </CheckboxIndicator>
+  </CheckboxRoot>
+</template>

package/dist/runtime/components/ui/checkbox/Checkbox.vue.d.ts

@@ -0,0 +1,25 @@
+import type { CheckboxRootProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+type __VLS_Props = CheckboxRootProps & {
+    class?: HTMLAttributes['class'];
+};
+declare var __VLS_14: {
+    modelValue: import("reka-ui").CheckboxCheckedState;
+    state: import("reka-ui").CheckboxCheckedState;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: boolean | "indeterminate") => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: boolean | "indeterminate") => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/checkbox/index.d.ts

@@ -0,0 +1 @@
+export { default as Checkbox } from './Checkbox.vue.js';

package/dist/runtime/components/ui/checkbox/index.js

@@ -0,0 +1 @@
+export { default as Checkbox } from "./Checkbox.vue";

package/dist/runtime/components/ui/command/Command.d.vue.ts

@@ -0,0 +1,36 @@
+import type { ListboxRootProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+type __VLS_Props = ListboxRootProps & {
+    class?: HTMLAttributes['class'];
+};
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: import("reka-ui").AcceptableValue) => any;
+    highlight: (payload: {
+        ref: HTMLElement;
+        value: import("reka-ui").AcceptableValue;
+    } | undefined) => any;
+    entryFocus: (event: CustomEvent<any>) => any;
+    leave: (event: Event) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: import("reka-ui").AcceptableValue) => any) | undefined;
+    onHighlight?: ((payload: {
+        ref: HTMLElement;
+        value: import("reka-ui").AcceptableValue;
+    } | undefined) => any) | undefined;
+    onEntryFocus?: ((event: CustomEvent<any>) => any) | undefined;
+    onLeave?: ((event: Event) => any) | undefined;
+}>, {
+    modelValue: import("reka-ui").AcceptableValue | import("reka-ui").AcceptableValue[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/command/Command.vue

@@ -0,0 +1,81 @@
+<script setup>
+import { reactiveOmit } from "@vueuse/core";
+import { ListboxRoot, useFilter, useForwardPropsEmits } from "reka-ui";
+import { reactive, ref, watch } from "vue";
+import { cn } from "../../../utils/cn";
+import { provideCommandContext } from ".";
+const props = defineProps({
+  modelValue: { type: null, required: false, default: "" },
+  defaultValue: { type: null, required: false },
+  multiple: { type: Boolean, required: false },
+  orientation: { type: String, required: false },
+  dir: { type: String, required: false },
+  disabled: { type: Boolean, required: false },
+  selectionBehavior: { type: String, required: false },
+  highlightOnHover: { type: Boolean, required: false },
+  by: { type: [String, Function], required: false },
+  asChild: { type: Boolean, required: false },
+  as: { type: null, required: false },
+  name: { type: String, required: false },
+  required: { type: Boolean, required: false },
+  class: { type: null, required: false }
+});
+const emits = defineEmits(["update:modelValue", "highlight", "entryFocus", "leave"]);
+const delegatedProps = reactiveOmit(props, "class");
+const forwarded = useForwardPropsEmits(delegatedProps, emits);
+const allItems = ref(/* @__PURE__ */ new Map());
+const allGroups = ref(/* @__PURE__ */ new Map());
+const { contains } = useFilter({ sensitivity: "base" });
+const filterState = reactive({
+  search: "",
+  filtered: {
+    /** The count of all visible items. */
+    count: 0,
+    /** Map from visible item id to its search score. */
+    items: /* @__PURE__ */ new Map(),
+    /** Set of groups with at least one visible item. */
+    groups: /* @__PURE__ */ new Set()
+  }
+});
+function filterItems() {
+  if (!filterState.search) {
+    filterState.filtered.count = allItems.value.size;
+    return;
+  }
+  filterState.filtered.groups = /* @__PURE__ */ new Set();
+  let itemCount = 0;
+  for (const [id, value] of allItems.value) {
+    const score = contains(value, filterState.search);
+    filterState.filtered.items.set(id, score ? 1 : 0);
+    if (score)
+      itemCount++;
+  }
+  for (const [groupId, group] of allGroups.value) {
+    for (const itemId of group) {
+      if (filterState.filtered.items.get(itemId) > 0) {
+        filterState.filtered.groups.add(groupId);
+        break;
+      }
+    }
+  }
+  filterState.filtered.count = itemCount;
+}
+watch(() => filterState.search, () => {
+  filterItems();
+});
+provideCommandContext({
+  allItems,
+  allGroups,
+  filterState
+});
+</script>
+
+<template>
+  <ListboxRoot
+    data-slot="command"
+    v-bind="forwarded"
+    :class="cn('bg-white text-zinc-700 flex h-full w-full flex-col overflow-hidden rounded-md', props.class)"
+  >
+    <slot />
+  </ListboxRoot>
+</template>

package/dist/runtime/components/ui/command/Command.vue.d.ts

@@ -0,0 +1,36 @@
+import type { ListboxRootProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+type __VLS_Props = ListboxRootProps & {
+    class?: HTMLAttributes['class'];
+};
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: import("reka-ui").AcceptableValue) => any;
+    highlight: (payload: {
+        ref: HTMLElement;
+        value: import("reka-ui").AcceptableValue;
+    } | undefined) => any;
+    entryFocus: (event: CustomEvent<any>) => any;
+    leave: (event: Event) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: import("reka-ui").AcceptableValue) => any) | undefined;
+    onHighlight?: ((payload: {
+        ref: HTMLElement;
+        value: import("reka-ui").AcceptableValue;
+    } | undefined) => any) | undefined;
+    onEntryFocus?: ((event: CustomEvent<any>) => any) | undefined;
+    onLeave?: ((event: Event) => any) | undefined;
+}>, {
+    modelValue: import("reka-ui").AcceptableValue | import("reka-ui").AcceptableValue[];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/command/CommandDialog.d.vue.ts

@@ -0,0 +1,28 @@
+import type { DialogRootProps } from 'reka-ui';
+type __VLS_Props = DialogRootProps & {
+    title?: string;
+    description?: string;
+};
+declare var __VLS_38: {
+    open: boolean;
+    close: () => void;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_38) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {
+    title: string;
+    description: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/command/CommandDialog.vue

@@ -0,0 +1,34 @@
+<script setup>
+import { useForwardPropsEmits } from "reka-ui";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "../dialog";
+import Command from "./Command.vue";
+const props = defineProps({
+  open: { type: Boolean, required: false },
+  defaultOpen: { type: Boolean, required: false },
+  modal: { type: Boolean, required: false },
+  title: { type: String, required: false, default: "Command Palette" },
+  description: { type: String, required: false, default: "Search for a command to run..." }
+});
+const emits = defineEmits(["update:open"]);
+const forwarded = useForwardPropsEmits(props, emits);
+</script>
+
+<template>
+  <Dialog
+    v-slot="slotProps"
+    v-bind="forwarded"
+  >
+    <DialogContent
+      :show-close-button="false"
+      class="overflow-hidden p-0"
+    >
+      <DialogHeader class="sr-only">
+        <DialogTitle>{{ title }}</DialogTitle>
+        <DialogDescription>{{ description }}</DialogDescription>
+      </DialogHeader>
+      <Command>
+        <slot v-bind="slotProps" />
+      </Command>
+    </DialogContent>
+  </Dialog>
+</template>

package/dist/runtime/components/ui/command/CommandDialog.vue.d.ts

@@ -0,0 +1,28 @@
+import type { DialogRootProps } from 'reka-ui';
+type __VLS_Props = DialogRootProps & {
+    title?: string;
+    description?: string;
+};
+declare var __VLS_38: {
+    open: boolean;
+    close: () => void;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_38) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {
+    title: string;
+    description: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/command/CommandEmpty.d.vue.ts

@@ -0,0 +1,18 @@
+import type { PrimitiveProps } from 'reka-ui';
+import type { HTMLAttributes } from 'vue';
+type __VLS_Props = PrimitiveProps & {
+    class?: HTMLAttributes['class'];
+};
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/command/CommandEmpty.vue

@@ -0,0 +1,28 @@
+<script setup>
+import { reactiveOmit } from "@vueuse/core";
+import { Primitive } from "reka-ui";
+import { computed } from "vue";
+import { cn } from "../../../utils/cn";
+import { useCommand } from ".";
+const props = defineProps({
+  asChild: { type: Boolean, required: false },
+  as: { type: null, required: false },
+  class: { type: null, required: false }
+});
+const delegatedProps = reactiveOmit(props, "class");
+const { filterState } = useCommand();
+const isRender = computed(
+  () => !!filterState.search && filterState.filtered.count === 0
+);
+</script>
+
+<template>
+  <Primitive
+    v-if="isRender"
+    data-slot="command-empty"
+    v-bind="delegatedProps"
+    :class="cn('py-6 text-center text-sm', props.class)"
+  >
+    <slot />
+  </Primitive>
+</template>