@shwfed/nuxt 0.1.25 → 0.1.27

package/dist/module.json

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

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

@@ -1,11 +1,32 @@
-declare var __VLS_53: {};
-type __VLS_Slots = {} & {
-    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>;
+import type { Scope } from 'effect';
+import { Effect } from 'effect';
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    commands?: ReadonlyArray<Readonly<{
+        id: string;
+        title: string;
+        children: ReadonlyArray<Readonly<{
+            id: string;
+            title: string;
+            icon?: string;
+            effect: Effect.Effect<void, never, Scope.Scope>;
+        }>>;
+    }>>;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    commands?: ReadonlyArray<Readonly<{
+        id: string;
+        title: string;
+        children: ReadonlyArray<Readonly<{
+            id: string;
+            title: string;
+            icon?: string;
+            effect: Effect.Effect<void, never, Scope.Scope>;
+        }>>;
+    }>>;
+}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/runtime/components/app.vue

@@ -1,12 +1,19 @@
-<script setup>
+<script>
 import { useHead } from "#app";
 import { ref } from "vue";
-import { CommandDialog, CommandInput, CommandList, CommandGroup, CommandEmpty } from "./ui/command";
+import { CommandDialog, CommandInput, CommandList, CommandGroup, CommandEmpty, CommandItem, CommandSeparator } 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";
+import { Effect } from "effect";
+</script>
+
+<script setup>
+defineProps({
+  commands: { type: Array, required: false }
+});
 const { t } = useI18n();
 useHead({
   bodyAttrs: {
@@ -43,18 +50,29 @@ whenever(() => meta_k?.value, () => {
               </p>
             </section>
           </CommandEmpty>
-          <CommandGroup>
-            <!-- <CommandItem
-              v-for="command in commands"
-              :key="command.title"
-              :value="command.title"
+
+          <CommandGroup
+            v-for="(group, i) in commands"
+            :key="group.id"
+            :heading="group.title"
+          >
+            <CommandItem
+              v-for="child in group.children"
+              :key="child.id"
+              :value="child.id"
+              @select="
+  child.effect.pipe(Effect.scoped).pipe(Effect.tap(() => {
+    isCommandOpen = false;
+  })).pipe(Effect.runPromise)
+"
             >
               <Icon
-                v-if="command.icon"
-                :icon="command.icon"
+                v-if="child.icon"
+                :icon="child.icon"
               />
-              <span>{{ command.title }}</span>
-            </CommandItem> -->
+              <span>{{ child.title }}</span>
+            </CommandItem>
+            <CommandSeparator v-if="i !== Object.keys(commands ?? {}).length - 1" />
           </CommandGroup>
         </CommandList>
       </CommandDialog>

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

@@ -1,11 +1,32 @@
-declare var __VLS_53: {};
-type __VLS_Slots = {} & {
-    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>;
+import type { Scope } from 'effect';
+import { Effect } from 'effect';
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    commands?: ReadonlyArray<Readonly<{
+        id: string;
+        title: string;
+        children: ReadonlyArray<Readonly<{
+            id: string;
+            title: string;
+            icon?: string;
+            effect: Effect.Effect<void, never, Scope.Scope>;
+        }>>;
+    }>>;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    commands?: ReadonlyArray<Readonly<{
+        id: string;
+        title: string;
+        children: ReadonlyArray<Readonly<{
+            id: string;
+            title: string;
+            icon?: string;
+            effect: Effect.Effect<void, never, Scope.Scope>;
+        }>>;
+    }>>;
+}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -29,13 +29,13 @@ onUnmounted(() => {
     v-bind="delegatedProps"
     :id="id"
     data-slot="command-group"
-    :class="cn('text-zinc-700 overflow-hidden p-1', props.class)"
+    :class="cn('text-zinc-700 p-1 pt-0 outline-none', props.class)"
     :hidden="isRender ? void 0 : true"
   >
     <ListboxGroupLabel
       v-if="heading"
       data-slot="command-group-heading"
-      class="px-2 py-1.5 text-xs font-medium text-zinc-700"
+      class="sticky top-0 z-10 bg-white px-2 py-2 text-xs font-medium text-zinc-700 select-none"
     >
       {{ heading }}
     </ListboxGroupLabel>

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

@@ -55,7 +55,7 @@ onUnmounted(() => {
     :id="id"
     ref="itemRef"
     data-slot="command-item"
-    :class="cn('data-highlighted:bg-zinc-100 data-highlighted:text-zinc-700 [&_svg:not([class*=\'text-\'])]:text-zinc-700 relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4', props.class)"
+    :class="cn('data-highlighted:bg-zinc-100 data-highlighted:text-zinc-700 [&_svg:not([class*=\'text-\'])]:text-zinc-700 cursor-pointer relative flex items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4', props.class)"
     @select="() => {
   filterState.search = '';
 }"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shwfed/nuxt",
-  "version": "0.1.25",
+  "version": "0.1.27",
   "description": "",
   "license": "MIT",
   "type": "module",
@@ -51,6 +51,7 @@
     "date-fns": "^4.1.0",
     "defu": "^6.1.4",
     "dot-prop": "^10.1.0",
+    "effect": "^3.19.15",
     "markdown-it": "^14.1.0",
     "reka-ui": "^2.7.0",
     "tailwind-merge": "^3.4.0",