@shwfed/nuxt 0.10.9 → 0.10.11

package/dist/module.json

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

package/dist/runtime/components/menu-tabs.d.vue.ts

@@ -0,0 +1,29 @@
+import { Effect } from 'effect';
+import type { MenuTabsConfigInput } from './ui/menu-tabs/schema.js';
+export { MenuTabsConfigC, MenuTabsConfigInputC, MenuTabsItemC, MenuTabsItemToC } from './ui/menu-tabs/schema.js';
+export type { MenuTabsConfig, MenuTabsConfigInput, MenuTabsItem } from './ui/menu-tabs/schema.js';
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{
+    config?: MenuTabsConfigInput | Effect.Effect<MenuTabsConfigInput | undefined>;
+    context?: Record<string, unknown>;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:config": (args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: import("../utils/coders.js").LocaleValue;
+            to: string;
+        }>[];
+    }>) => any;
+}, string, import("vue").PublicProps, Readonly<{
+    config?: MenuTabsConfigInput | Effect.Effect<MenuTabsConfigInput | undefined>;
+    context?: Record<string, unknown>;
+}> & Readonly<{
+    "onUpdate:config"?: ((args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: import("../utils/coders.js").LocaleValue;
+            to: string;
+        }>[];
+    }>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/menu-tabs.vue

@@ -0,0 +1,40 @@
+<script setup>
+import { Effect } from "effect";
+import UiMenuTabs from "./ui/menu-tabs/MenuTabs.vue";
+defineOptions({
+  inheritAttrs: false
+});
+const props = defineProps({
+  config: { type: null, required: false },
+  context: { type: Object, required: false }
+});
+const emit = defineEmits(["update:config"]);
+const defaultConfig = {
+  menus: []
+};
+function isEffectConfig(value) {
+  return typeof value === "object" && value !== null && "pipe" in value && typeof Reflect.get(value, "pipe") === "function";
+}
+function resolveConfig() {
+  if (isEffectConfig(props.config)) {
+    return props.config.pipe(Effect.map((value) => value ?? defaultConfig));
+  }
+  return Effect.succeed(props.config ?? defaultConfig);
+}
+function handleConfigUpdate(config) {
+  emit("update:config", config);
+}
+</script>
+
+<script>
+export { MenuTabsConfigC, MenuTabsConfigInputC, MenuTabsItemC, MenuTabsItemToC } from "./ui/menu-tabs/schema";
+</script>
+
+<template>
+  <UiMenuTabs
+    v-bind="$attrs"
+    :config="resolveConfig()"
+    :context="props.context"
+    @update:config="handleConfigUpdate"
+  />
+</template>

package/dist/runtime/components/menu-tabs.vue.d.ts

@@ -0,0 +1,29 @@
+import { Effect } from 'effect';
+import type { MenuTabsConfigInput } from './ui/menu-tabs/schema.js';
+export { MenuTabsConfigC, MenuTabsConfigInputC, MenuTabsItemC, MenuTabsItemToC } from './ui/menu-tabs/schema.js';
+export type { MenuTabsConfig, MenuTabsConfigInput, MenuTabsItem } from './ui/menu-tabs/schema.js';
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{
+    config?: MenuTabsConfigInput | Effect.Effect<MenuTabsConfigInput | undefined>;
+    context?: Record<string, unknown>;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:config": (args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: import("../utils/coders.js").LocaleValue;
+            to: string;
+        }>[];
+    }>) => any;
+}, string, import("vue").PublicProps, Readonly<{
+    config?: MenuTabsConfigInput | Effect.Effect<MenuTabsConfigInput | undefined>;
+    context?: Record<string, unknown>;
+}> & Readonly<{
+    "onUpdate:config"?: ((args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: import("../utils/coders.js").LocaleValue;
+            to: string;
+        }>[];
+    }>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/ui/buttons/Buttons.vue

@@ -132,6 +132,17 @@ function handleConfiguratorConfirm(nextConfig) {
 function isDropdownItem(item) {
   return "items" in item;
 }
+function hasLeadingPrimaryGap(items, itemIndex) {
+  if (itemIndex === 0) {
+    return false;
+  }
+  const item = items[itemIndex];
+  const previousItem = items[itemIndex - 1];
+  if (!item || !previousItem || isDropdownItem(item) || isDropdownItem(previousItem)) {
+    return false;
+  }
+  return item.variant === "primary" && previousItem.variant === "primary";
+}
 </script>
 
 <script>
@@ -177,7 +188,7 @@ export { ButtonActionC, ButtonConfigC, ButtonConfigInputC, ButtonDropdownC, Butt
       orientation="horizontal"
     >
       <template
-        v-for="item in group.items"
+        v-for="(item, itemIndex) in group.items"
         :key="item.id"
       >
         <Button
@@ -185,6 +196,7 @@ export { ButtonActionC, ButtonConfigC, ButtonConfigInputC, ButtonDropdownC, Butt
           data-slot="buttons-item"
           :variant="item.variant"
           :disabled="isButtonDisabled(item.id)"
+          :class="hasLeadingPrimaryGap(group.items, itemIndex) ? 'ml-px' : void 0"
           :title="item.hideTitle ? getButtonLabel(item) : void 0"
           @click="void runButton(item.id)"
         >
@@ -208,6 +220,7 @@ export { ButtonActionC, ButtonConfigC, ButtonConfigInputC, ButtonDropdownC, Butt
               data-slot="buttons-item"
               :variant="item.variant"
               :disabled="isButtonDisabled(item.id)"
+              :class="hasLeadingPrimaryGap(group.items, itemIndex) ? 'ml-px' : void 0"
               :title="item.hideTitle ? getButtonLabel(item) : void 0"
               @click="void runButton(item.id)"
             >

package/dist/runtime/components/ui/icon-picker/IconPicker.vue

@@ -2,14 +2,15 @@
 import { icons } from "@iconify-json/fluent";
 import { Icon } from "@iconify/vue";
 import { useVirtualizer } from "@tanstack/vue-virtual";
-import { computed, shallowRef, ref, watch } from "vue";
+import { computed, onBeforeUnmount, onMounted, shallowRef, ref, watch } from "vue";
 import { cn } from "../../../utils/cn";
 import { InputGroup, InputGroupAddon, InputGroupInput } from "../input-group";
 defineOptions({
   inheritAttrs: false
 });
-const ICON_COLUMNS = 6;
-const ICON_ROW_HEIGHT = 60;
+const ICON_BUTTON_SIZE = 40;
+const ICON_GRID_GAP = 8;
+const ICON_GRID_MIN_COLUMN_WIDTH = 52;
 const props = defineProps({
   modelValue: { type: String, required: false },
   placeholder: { type: String, required: false },
@@ -25,6 +26,8 @@ const availableIcons = Object.entries(icons.icons).filter(([name]) => name.endsW
 const availableIconIds = new Set(availableIcons.map((icon) => icon.id));
 const searchQuery = ref("");
 const galleryElement = shallowRef(null);
+const galleryWidth = ref(0);
+let galleryResizeObserver;
 const selectedIcon = computed(() => props.modelValue && availableIconIds.has(props.modelValue) ? availableIcons.find((icon) => icon.id === props.modelValue) : void 0);
 const filteredIcons = computed(() => {
   const term = searchQuery.value.trim().toLowerCase();
@@ -33,11 +36,21 @@ const filteredIcons = computed(() => {
   }
   return availableIcons.filter((icon) => icon.id.includes(term));
 });
-const rowCount = computed(() => Math.ceil(filteredIcons.value.length / ICON_COLUMNS));
+const iconColumns = computed(() => {
+  if (galleryWidth.value <= 0) {
+    return 8;
+  }
+  return Math.max(
+    1,
+    Math.floor((galleryWidth.value + ICON_GRID_GAP) / (ICON_GRID_MIN_COLUMN_WIDTH + ICON_GRID_GAP))
+  );
+});
+const iconRowHeight = computed(() => ICON_BUTTON_SIZE + ICON_GRID_GAP);
+const rowCount = computed(() => Math.ceil(filteredIcons.value.length / iconColumns.value));
 const rowVirtualizer = useVirtualizer(computed(() => ({
   count: rowCount.value,
   getScrollElement: () => galleryElement.value,
-  estimateSize: () => ICON_ROW_HEIGHT,
+  estimateSize: () => iconRowHeight.value,
   overscan: 4
 })));
 watch(() => props.modelValue, (value) => {
@@ -45,9 +58,39 @@ watch(() => props.modelValue, (value) => {
     searchQuery.value = "";
   }
 });
+watch(galleryElement, (element) => {
+  if (galleryResizeObserver) {
+    galleryResizeObserver.disconnect();
+    galleryResizeObserver = void 0;
+  }
+  if (!element || typeof ResizeObserver === "undefined") {
+    galleryWidth.value = 0;
+    return;
+  }
+  galleryWidth.value = element.clientWidth;
+  galleryResizeObserver = new ResizeObserver((entries) => {
+    const entry = entries[0];
+    if (!entry) {
+      return;
+    }
+    galleryWidth.value = entry.contentRect.width;
+  });
+  galleryResizeObserver.observe(element);
+}, {
+  flush: "post"
+});
+onMounted(() => {
+  if (!galleryElement.value) {
+    return;
+  }
+  galleryWidth.value = galleryElement.value.clientWidth;
+});
+onBeforeUnmount(() => {
+  galleryResizeObserver?.disconnect();
+});
 function iconsForRow(index) {
-  const start = index * ICON_COLUMNS;
-  return filteredIcons.value.slice(start, start + ICON_COLUMNS);
+  const start = index * iconColumns.value;
+  return filteredIcons.value.slice(start, start + iconColumns.value);
 }
 function selectIcon(iconId) {
   if (props.disabled) {
@@ -88,26 +131,28 @@ function handleSearchUpdate(value) {
       <div
         data-slot="icon-picker-hero"
         :data-icon-id="selectedIcon.id"
-        class="relative flex size-40 items-center justify-center rounded-3xl border border-zinc-200 bg-zinc-50 text-zinc-700 shadow-xs"
+        class="relative flex size-28 items-center justify-center rounded-2xl border border-zinc-200 text-zinc-700 shadow-xs"
       >
         <button
           type="button"
           data-slot="icon-picker-clear"
-          class="absolute right-3 top-3 flex size-8 items-center justify-center rounded-full border border-zinc-200 bg-white text-zinc-500 transition-colors hover:border-red-200 hover:bg-red-50 hover:text-red-600 disabled:pointer-events-none disabled:opacity-60"
+          class="absolute right-2 top-2 flex size-7 items-center justify-center rounded-full border border-zinc-200 bg-white text-zinc-500 shadow-xs transition-colors hover:border-red-200 hover:bg-red-50 hover:text-red-600 disabled:pointer-events-none disabled:opacity-60"
           :disabled="props.disabled"
           @click="clearIcon"
         >
-          <Icon icon="fluent:dismiss-20-regular" />
+          <Icon
+            icon="fluent:dismiss-20-regular"
+            class="size-4"
+          />
         </button>
         <Icon
           :icon="selectedIcon.icon"
-          class="size-16"
+          class="size-14 shrink-0"
         />
       </div>
-
       <p
         data-slot="icon-picker-name"
-        class="font-mono text-sm text-zinc-500"
+        class="max-w-full break-all font-mono text-sm text-zinc-500"
       >
         {{ selectedIcon.id }}
       </p>
@@ -144,9 +189,10 @@ function handleSearchUpdate(value) {
           <div
             v-for="row in rowVirtualizer.getVirtualItems()"
             :key="String(row.key)"
-            class="absolute left-0 top-0 grid w-full grid-cols-6 gap-2"
+            class="absolute left-0 top-0 grid w-full gap-2"
             :style="{
   height: `${row.size}px`,
+  gridTemplateColumns: `repeat(${iconColumns}, minmax(0, 1fr))`,
   transform: `translateY(${row.start}px)`
 }"
           >
@@ -156,7 +202,7 @@ function handleSearchUpdate(value) {
               type="button"
               data-slot="icon-picker-item"
               :data-icon-id="item.id"
-              class="flex h-12 items-center justify-center rounded-lg border border-transparent bg-zinc-50 text-zinc-600 transition-colors hover:border-zinc-200 hover:bg-zinc-100 hover:text-zinc-800 disabled:pointer-events-none disabled:opacity-60"
+              class="mx-auto flex size-10 items-center justify-center rounded-md text-zinc-600 transition-colors hover:bg-zinc-100 hover:text-zinc-800 disabled:pointer-events-none disabled:opacity-60"
               :disabled="props.disabled"
               @click="selectIcon(item.id)"
             >

package/dist/runtime/components/ui/menu-tabs/MenuTabs.d.vue.ts

@@ -0,0 +1,29 @@
+import { Effect } from 'effect';
+import { type MenuTabsConfigInput } from './schema.js';
+export { MenuTabsConfigC, MenuTabsConfigInputC, MenuTabsItemC, MenuTabsItemToC } from './schema.js';
+export type { MenuTabsConfig, MenuTabsConfigInput, MenuTabsItem } from './schema.js';
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{
+    config: Effect.Effect<MenuTabsConfigInput | undefined>;
+    context?: Record<string, unknown>;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:config": (args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: import("../../../utils/coders.js").LocaleValue;
+            to: string;
+        }>[];
+    }>) => any;
+}, string, import("vue").PublicProps, Readonly<{
+    config: Effect.Effect<MenuTabsConfigInput | undefined>;
+    context?: Record<string, unknown>;
+}> & Readonly<{
+    "onUpdate:config"?: ((args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: import("../../../utils/coders.js").LocaleValue;
+            to: string;
+        }>[];
+    }>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/ui/menu-tabs/MenuTabs.vue

@@ -0,0 +1,275 @@
+<script setup>
+import { useNuxtApp, useRoute, useRouter } from "#app";
+import { useCheating } from "#imports";
+import { Icon } from "@iconify/vue";
+import { computedAsync } from "@vueuse/core";
+import { Effect } from "effect";
+import { computed, nextTick, onMounted, onUnmounted, ref, watch } from "vue";
+import { useI18n } from "vue-i18n";
+import { getLocalizedText } from "../../../utils/coders";
+import { Button } from "../button";
+import MenuTabsConfiguratorDialog from "../menu-tabs-configurator/MenuTabsConfiguratorDialog.vue";
+import { Skeleton } from "../skeleton";
+import { MenuTabsConfigC, normalizeMenuTabsConfigInput } from "./schema";
+defineOptions({
+  inheritAttrs: false
+});
+const defaultConfig = {
+  menus: []
+};
+const props = defineProps({
+  config: { type: null, required: true },
+  context: { type: Object, required: false }
+});
+const emit = defineEmits(["update:config"]);
+const { $dsl } = useNuxtApp();
+const route = useRoute();
+const router = useRouter();
+const { locale, t } = useI18n();
+const isCheating = useCheating();
+const resolvedConfig = computedAsync(
+  async () => MenuTabsConfigC.parse(normalizeMenuTabsConfigInput(await props.config.pipe(Effect.runPromise)))
+);
+const displayConfig = ref(defaultConfig);
+const isConfiguratorOpen = ref(false);
+const listRef = ref(null);
+const buttonElements = /* @__PURE__ */ new Map();
+const indicatorMetrics = ref();
+let resizeObserver;
+let observedElements = /* @__PURE__ */ new Set();
+let frameId = 0;
+function cleanPath(path) {
+  const normalizedPath = path.trim().replace(/\/+$/g, "");
+  return normalizedPath.length > 0 ? normalizedPath : "/";
+}
+function getEvaluationContext() {
+  return {
+    ...props.context ?? {},
+    context: props.context ?? {}
+  };
+}
+const resolvedMenus = computed(
+  () => displayConfig.value.menus.map((menu) => {
+    let path;
+    try {
+      const result = $dsl.evaluate`${menu.to}`(getEvaluationContext());
+      if (typeof result === "string" && result.trim().length > 0) {
+        path = cleanPath(result);
+      }
+    } catch {
+      path = void 0;
+    }
+    return {
+      id: menu.id,
+      path,
+      title: getLocalizedText(menu.title, locale.value) ?? t("untitled-menu")
+    };
+  })
+);
+const activeMenuId = computed(() => {
+  const currentPath = cleanPath(route.path);
+  return resolvedMenus.value.find((menu) => menu.path === currentPath)?.id;
+});
+const indicatorStyle = computed(() => {
+  if (!indicatorMetrics.value) {
+    return {
+      opacity: 0,
+      transform: "translateX(0px)",
+      width: "0px"
+    };
+  }
+  return {
+    opacity: 1,
+    transform: `translateX(${indicatorMetrics.value.left}px)`,
+    width: `${indicatorMetrics.value.width}px`
+  };
+});
+function setMenuButtonRef(id, value) {
+  if (value instanceof HTMLButtonElement) {
+    if (buttonElements.get(id) === value) {
+      return;
+    }
+    buttonElements.set(id, value);
+  } else {
+    if (!buttonElements.has(id)) {
+      return;
+    }
+    buttonElements.delete(id);
+  }
+  syncObservedElements();
+  void scheduleIndicator();
+}
+function updateIndicator() {
+  const activeId = activeMenuId.value;
+  const activeButton = activeId ? buttonElements.get(activeId) : void 0;
+  if (!activeButton) {
+    indicatorMetrics.value = void 0;
+    return;
+  }
+  indicatorMetrics.value = {
+    left: activeButton.offsetLeft,
+    width: activeButton.offsetWidth
+  };
+}
+async function scheduleIndicator() {
+  if (typeof window !== "undefined") {
+    cancelAnimationFrame(frameId);
+    frameId = window.requestAnimationFrame(() => {
+      updateIndicator();
+    });
+    return;
+  }
+  await nextTick();
+  updateIndicator();
+}
+function syncObservedElements() {
+  if (!resizeObserver) {
+    return;
+  }
+  const nextObservedElements = /* @__PURE__ */ new Set();
+  if (listRef.value) {
+    nextObservedElements.add(listRef.value);
+  }
+  for (const button of buttonElements.values()) {
+    nextObservedElements.add(button);
+  }
+  for (const element of observedElements) {
+    if (!nextObservedElements.has(element)) {
+      resizeObserver.unobserve(element);
+    }
+  }
+  for (const element of nextObservedElements) {
+    if (!observedElements.has(element)) {
+      resizeObserver.observe(element);
+    }
+  }
+  observedElements = nextObservedElements;
+}
+function handleConfiguratorConfirm(nextConfig) {
+  displayConfig.value = nextConfig;
+  emit("update:config", nextConfig);
+}
+function handleMenuClick(menu) {
+  if (!menu.path) {
+    return;
+  }
+  void router.replace(menu.path);
+}
+watch(resolvedConfig, (value) => {
+  if (!value) {
+    return;
+  }
+  displayConfig.value = value;
+}, { immediate: true });
+watch(() => `${route.path}|${resolvedMenus.value.map((menu) => `${menu.id}:${menu.path ?? ""}`).join("|")}`, () => {
+  void scheduleIndicator();
+}, { immediate: true });
+onMounted(() => {
+  if (typeof ResizeObserver !== "undefined") {
+    resizeObserver = new ResizeObserver(() => {
+      void scheduleIndicator();
+    });
+    syncObservedElements();
+  }
+  void scheduleIndicator();
+});
+onUnmounted(() => {
+  cancelAnimationFrame(frameId);
+  resizeObserver?.disconnect();
+  observedElements = /* @__PURE__ */ new Set();
+});
+</script>
+
+<script>
+export { MenuTabsConfigC, MenuTabsConfigInputC, MenuTabsItemC, MenuTabsItemToC } from "./schema";
+</script>
+
+<template>
+  <div
+    v-bind="$attrs"
+    data-slot="menu-tabs-root"
+    class="relative"
+  >
+    <Button
+      v-if="isCheating"
+      data-slot="menu-tabs-configurator-trigger"
+      variant="ghost"
+      size="sm"
+      type="button"
+      class="absolute right-2 top-2 z-20 bg-white/90 shadow-xs backdrop-blur-sm hover:bg-white"
+      :aria-label="t('menu-tabs-open-configurator')"
+      :title="t('menu-tabs-open-configurator')"
+      @click="isConfiguratorOpen = true"
+    >
+      <Icon icon="fluent:settings-20-regular" />
+    </Button>
+
+    <MenuTabsConfiguratorDialog
+      v-if="resolvedConfig !== void 0"
+      v-model:open="isConfiguratorOpen"
+      :config="displayConfig"
+      @confirm="handleConfiguratorConfirm"
+    />
+
+    <Skeleton
+      v-if="resolvedConfig === void 0"
+      data-slot="menu-tabs-skeleton"
+      class="absolute inset-0 z-10 h-full w-full"
+    />
+
+    <div
+      data-slot="menu-tabs-container"
+      class="overflow-x-auto"
+    >
+      <div
+        ref="listRef"
+        data-slot="menu-tabs-list"
+        class="relative flex min-w-full w-max items-stretch gap-6 border-b-2 border-zinc-200 bg-white"
+      >
+        <button
+          v-for="menu in resolvedMenus"
+          :ref="(value) => setMenuButtonRef(menu.id, value)"
+          :key="menu.id"
+          type="button"
+          data-slot="menu-tabs-item"
+          :data-menu-id="menu.id"
+          :data-active="activeMenuId === menu.id ? 'true' : void 0"
+          :data-navigable="menu.path ? 'true' : 'false'"
+          :aria-current="activeMenuId === menu.id ? 'page' : void 0"
+          :aria-disabled="menu.path ? void 0 : 'true'"
+          :class="[
+  'text-sm relative shrink-0 border-b-2 border-transparent py-2 font-semibold transition-colors duration-180',
+  activeMenuId === menu.id ? 'text-(--primary)' : 'text-zinc-700',
+  menu.path ? 'cursor-pointer hover:text-(--primary)' : 'cursor-default opacity-60'
+]"
+          @click="handleMenuClick(menu)"
+        >
+          {{ menu.title }}
+        </button>
+
+        <div
+          data-slot="menu-tabs-indicator"
+          class="pointer-events-none absolute -bottom-0.5 left-0 h-0.5 rounded bg-(--primary) transition-[transform,width,opacity] duration-200 ease-out"
+          :style="indicatorStyle"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<i18n lang="json">
+{
+  "zh": {
+    "menu-tabs-open-configurator": "打开菜单标签配置",
+    "untitled-menu": "未命名菜单"
+  },
+  "ja": {
+    "menu-tabs-open-configurator": "メニュータブ設定を開く",
+    "untitled-menu": "名称未設定メニュー"
+  },
+  "en": {
+    "menu-tabs-open-configurator": "Open menu tabs configurator",
+    "untitled-menu": "Untitled menu"
+  }
+}
+</i18n>

package/dist/runtime/components/ui/menu-tabs/MenuTabs.vue.d.ts

@@ -0,0 +1,29 @@
+import { Effect } from 'effect';
+import { type MenuTabsConfigInput } from './schema.js';
+export { MenuTabsConfigC, MenuTabsConfigInputC, MenuTabsItemC, MenuTabsItemToC } from './schema.js';
+export type { MenuTabsConfig, MenuTabsConfigInput, MenuTabsItem } from './schema.js';
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{
+    config: Effect.Effect<MenuTabsConfigInput | undefined>;
+    context?: Record<string, unknown>;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:config": (args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: import("../../../utils/coders.js").LocaleValue;
+            to: string;
+        }>[];
+    }>) => any;
+}, string, import("vue").PublicProps, Readonly<{
+    config: Effect.Effect<MenuTabsConfigInput | undefined>;
+    context?: Record<string, unknown>;
+}> & Readonly<{
+    "onUpdate:config"?: ((args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: import("../../../utils/coders.js").LocaleValue;
+            to: string;
+        }>[];
+    }>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/ui/menu-tabs/schema.d.ts

@@ -0,0 +1,58 @@
+import z from 'zod';
+import type { LocaleValue } from '../../../utils/coders.js';
+export declare const MenuTabsItemToC: z.ZodString;
+export declare const MenuTabsItemC: z.ZodReadonly<z.ZodObject<{
+    id: z.ZodUUID;
+    title: z.ZodReadonly<z.ZodArray<z.ZodObject<{
+        locale: z.ZodEnum<{
+            zh: "zh";
+            ja: "ja";
+            en: "en";
+            ko: "ko";
+        }>;
+        message: z.ZodString;
+    }, z.core.$strip>>>;
+    to: z.ZodString;
+}, z.core.$strict>>;
+export declare const MenuTabsConfigC: z.ZodReadonly<z.ZodObject<{
+    menus: z.ZodReadonly<z.ZodArray<z.ZodReadonly<z.ZodObject<{
+        id: z.ZodUUID;
+        title: z.ZodReadonly<z.ZodArray<z.ZodObject<{
+            locale: z.ZodEnum<{
+                zh: "zh";
+                ja: "ja";
+                en: "en";
+                ko: "ko";
+            }>;
+            message: z.ZodString;
+        }, z.core.$strip>>>;
+        to: z.ZodString;
+    }, z.core.$strict>>>>;
+}, z.core.$strict>>;
+export declare const MenuTabsConfigInputC: z.ZodReadonly<z.ZodObject<{
+    menus: z.ZodReadonly<z.ZodArray<z.ZodReadonly<z.ZodObject<{
+        id: z.ZodUUID;
+        title: z.ZodReadonly<z.ZodArray<z.ZodObject<{
+            locale: z.ZodEnum<{
+                zh: "zh";
+                ja: "ja";
+                en: "en";
+                ko: "ko";
+            }>;
+            message: z.ZodString;
+        }, z.core.$strip>>>;
+        to: z.ZodString;
+    }, z.core.$strict>>>>;
+}, z.core.$strict>>;
+export type MenuTabsItem = Readonly<{
+    id: string;
+    title: LocaleValue;
+    to: string;
+}>;
+export type MenuTabsConfig = Readonly<{
+    menus: ReadonlyArray<MenuTabsItem>;
+}>;
+export type MenuTabsConfigInput = Readonly<{
+    menus?: ReadonlyArray<MenuTabsItem>;
+}>;
+export declare function normalizeMenuTabsConfigInput(value: unknown): unknown;

package/dist/runtime/components/ui/menu-tabs/schema.js

@@ -0,0 +1,24 @@
+import z from "zod";
+import { expressionC, localeC } from "../../../utils/coders.js";
+const menuTabsItemIdC = z.uuid().describe("\u83DC\u5355\u9879\u552F\u4E00\u6807\u8BC6\uFF0C\u5FC5\u987B\u662F UUID");
+export const MenuTabsItemToC = expressionC("string", { context: "dyn" }).describe("\u8FD4\u56DE\u76EE\u6807\u8DEF\u5F84\u7684 CEL \u8868\u8FBE\u5F0F\u3002\u53EF\u7528\u53D8\u91CF\uFF1Acontext\u3002\u5FC5\u987B\u8FD4\u56DE string\u3002");
+export const MenuTabsItemC = z.strictObject({
+  id: menuTabsItemIdC,
+  title: localeC.describe("\u83DC\u5355\u540D\u79F0\u7684\u672C\u5730\u5316\u663E\u793A\u6587\u672C"),
+  to: MenuTabsItemToC
+}).readonly();
+export const MenuTabsConfigC = z.strictObject({
+  menus: z.array(MenuTabsItemC).readonly().describe("\u9876\u90E8\u83DC\u5355\u5217\u8868")
+}).readonly();
+export const MenuTabsConfigInputC = MenuTabsConfigC;
+export function normalizeMenuTabsConfigInput(value) {
+  if (typeof value !== "object" || value === null) {
+    return {
+      menus: []
+    };
+  }
+  const menus = Reflect.get(value, "menus");
+  return {
+    menus: Array.isArray(menus) ? menus : []
+  };
+}

package/dist/runtime/components/ui/menu-tabs-configurator/MenuTabsConfiguratorDialog.d.vue.ts

@@ -0,0 +1,30 @@
+import type { LocaleValue } from '../../../utils/coders.js';
+import { type MenuTabsConfig } from '../menu-tabs/schema.js';
+type __VLS_Props = {
+    config: MenuTabsConfig;
+};
+type __VLS_ModelProps = {
+    'open'?: boolean;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+    confirm: (args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: LocaleValue;
+            to: string;
+        }>[];
+    }>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+    onConfirm?: ((args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: LocaleValue;
+            to: string;
+        }>[];
+    }>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/menu-tabs-configurator/MenuTabsConfiguratorDialog.vue

@@ -0,0 +1,482 @@
+<script setup>
+import { useSortable } from "@vueuse/integrations/useSortable";
+import { Icon } from "@iconify/vue";
+import { computed, nextTick, ref, watch } from "vue";
+import { useI18n } from "vue-i18n";
+import { cn } from "../../../utils/cn";
+import { Button } from "../button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle
+} from "../dialog";
+import { ExpressionEditor } from "../expression-editor";
+import { Input } from "../input";
+import Locale from "../locale/Locale.vue";
+import { MenuTabsConfigC, MenuTabsItemToC } from "../menu-tabs/schema";
+defineOptions({
+  inheritAttrs: false
+});
+const props = defineProps({
+  config: { type: Object, required: true }
+});
+const emit = defineEmits(["confirm"]);
+const open = defineModel("open", { type: Boolean, ...{
+  default: false
+} });
+const { t } = useI18n();
+const search = ref("");
+const selectedItemId = ref("");
+const draftMenus = ref([]);
+const sortableListRef = ref(null);
+const sortableItemIds = ref([]);
+const toEditor = ref(null);
+function createDraftId() {
+  return crypto.randomUUID();
+}
+function cloneLocaleValue(value) {
+  return value.map((item) => ({
+    locale: item.locale,
+    message: item.message
+  }));
+}
+function cloneMenu(menu) {
+  return {
+    id: menu.id,
+    title: cloneLocaleValue(menu.title),
+    to: menu.to
+  };
+}
+function createDraftMenu(menu) {
+  return {
+    draftId: createDraftId(),
+    menu: cloneMenu(menu)
+  };
+}
+function cloneMenus(menus) {
+  return menus.map(createDraftMenu);
+}
+function createDefaultMenu() {
+  return {
+    id: crypto.randomUUID(),
+    title: [{ locale: "zh", message: "" }],
+    to: '"/"'
+  };
+}
+function getMenuChineseTitle(menu) {
+  const zhTitle = menu.title.find((item) => item.locale === "zh");
+  if (!zhTitle) {
+    return void 0;
+  }
+  const message = zhTitle.message.trim();
+  return message.length > 0 ? message : void 0;
+}
+function getMenuListLabel(menu) {
+  return getMenuChineseTitle(menu) ?? t("menu-tabs-configurator-untitled");
+}
+function applyDraftConfig(config) {
+  search.value = "";
+  draftMenus.value = cloneMenus(config.menus);
+  selectedItemId.value = draftMenus.value[0]?.draftId ?? "";
+}
+function resetDraftConfig() {
+  applyDraftConfig(props.config);
+}
+const normalizedSearch = computed(() => search.value.trim().toLocaleLowerCase());
+const menuItems = computed(() => draftMenus.value.map((item) => ({
+  itemId: item.draftId,
+  label: getMenuListLabel(item.menu),
+  id: item.menu.id
+})));
+const filteredMenuItems = computed(() => {
+  if (!normalizedSearch.value) {
+    return menuItems.value;
+  }
+  return menuItems.value.filter((item) => {
+    const haystack = [item.label, item.id].join(" ").toLocaleLowerCase();
+    return haystack.includes(normalizedSearch.value);
+  });
+});
+const selectedMenu = computed(() => draftMenus.value.find((item) => item.draftId === selectedItemId.value));
+function syncSortableItemIds() {
+  sortableItemIds.value = draftMenus.value.map((item) => item.draftId);
+}
+function moveDraftMenus(menus, oldIndex, newIndex) {
+  if (oldIndex < 0 || newIndex < 0 || oldIndex >= menus.length || newIndex >= menus.length) {
+    return menus.slice();
+  }
+  const nextMenus = menus.slice();
+  const movedMenu = nextMenus[oldIndex];
+  if (!movedMenu) {
+    return menus.slice();
+  }
+  nextMenus.splice(oldIndex, 1);
+  nextMenus.splice(newIndex, 0, movedMenu);
+  return nextMenus;
+}
+function handleSortableUpdate(event) {
+  const oldIndex = event.oldIndex;
+  const newIndex = event.newIndex;
+  if (oldIndex === void 0 || newIndex === void 0 || oldIndex === newIndex) {
+    return;
+  }
+  draftMenus.value = moveDraftMenus(draftMenus.value, oldIndex, newIndex);
+}
+const sortable = useSortable(sortableListRef, sortableItemIds);
+function configureSortable() {
+  sortable.option("animation", 150);
+  sortable.option("handle", '[data-slot="menu-tabs-configurator-drag-handle"]');
+  sortable.option("onUpdate", handleSortableUpdate);
+}
+async function refreshSortable() {
+  sortable.stop();
+  if (!open.value || draftMenus.value.length === 0 || normalizedSearch.value.length > 0) {
+    return;
+  }
+  await nextTick();
+  sortable.start();
+  configureSortable();
+}
+function selectItem(itemId) {
+  selectedItemId.value = itemId;
+}
+function updateMenu(draftId, update) {
+  draftMenus.value = draftMenus.value.map((item) => item.draftId === draftId ? {
+    draftId: item.draftId,
+    menu: update(item.menu)
+  } : item);
+}
+function updateSelectedTitle(value) {
+  if (!selectedMenu.value) {
+    return;
+  }
+  updateMenu(selectedMenu.value.draftId, (menu) => ({
+    id: menu.id,
+    title: cloneLocaleValue(value),
+    to: menu.to
+  }));
+}
+function updateSelectedTo(value) {
+  if (!selectedMenu.value) {
+    return;
+  }
+  updateMenu(selectedMenu.value.draftId, (menu) => ({
+    id: menu.id,
+    title: cloneLocaleValue(menu.title),
+    to: value ?? ""
+  }));
+}
+async function addMenu() {
+  const nextMenu = {
+    draftId: createDraftId(),
+    menu: createDefaultMenu()
+  };
+  draftMenus.value = [...draftMenus.value, nextMenu];
+  selectedItemId.value = nextMenu.draftId;
+  await refreshSortable();
+}
+function deleteMenu(draftId) {
+  const removedIndex = draftMenus.value.findIndex((item) => item.draftId === draftId);
+  draftMenus.value = draftMenus.value.filter((item) => item.draftId !== draftId);
+  if (selectedItemId.value !== draftId) {
+    return;
+  }
+  const fallbackMenu = draftMenus.value[removedIndex] ?? draftMenus.value[removedIndex - 1];
+  selectedItemId.value = fallbackMenu?.draftId ?? "";
+}
+function buildDraftConfig() {
+  const result = MenuTabsConfigC.safeParse({
+    menus: draftMenus.value.map((item) => item.menu)
+  });
+  if (!result.success) {
+    return void 0;
+  }
+  return result.data;
+}
+function handleConfirm() {
+  if (selectedMenu.value && !(toEditor.value?.validate() ?? true)) {
+    return;
+  }
+  const nextConfig = buildDraftConfig();
+  if (!nextConfig) {
+    return;
+  }
+  emit("confirm", nextConfig);
+  open.value = false;
+}
+watch(() => props.config, () => {
+  if (!open.value) {
+    resetDraftConfig();
+  }
+}, { immediate: true });
+watch(draftMenus, () => {
+  syncSortableItemIds();
+}, { immediate: true });
+watch(open, async (value) => {
+  if (value) {
+    resetDraftConfig();
+    await refreshSortable();
+    return;
+  }
+  sortable.stop();
+}, { immediate: true });
+watch(menuItems, async (items) => {
+  if (!items.some((item) => item.itemId === selectedItemId.value)) {
+    selectedItemId.value = items[0]?.itemId ?? "";
+  }
+  if (open.value) {
+    await refreshSortable();
+  }
+}, { immediate: true });
+watch(filteredMenuItems, async (items) => {
+  if (!normalizedSearch.value) {
+    return;
+  }
+  if (items.some((item) => item.itemId === selectedItemId.value)) {
+    return;
+  }
+  selectedItemId.value = items[0]?.itemId ?? "";
+  await refreshSortable();
+}, { immediate: true });
+watch(normalizedSearch, async () => {
+  if (!open.value) {
+    return;
+  }
+  await refreshSortable();
+});
+</script>
+
+<template>
+  <Dialog
+    :open="open"
+    @update:open="open = $event"
+  >
+    <DialogContent
+      data-slot="menu-tabs-configurator-dialog"
+      class="flex h-[min(42rem,calc(100vh-4rem))] w-[calc(100%-2rem)] max-h-[calc(100vh-4rem)] max-w-[calc(100%-2rem)] flex-col overflow-hidden p-0 sm:w-[80vw] sm:max-w-[80vw]"
+    >
+      <DialogHeader class="gap-1 border-b border-zinc-200 px-6 py-5">
+        <DialogTitle class="text-xl font-semibold text-zinc-800">
+          {{ t("menu-tabs-configurator-title") }}
+        </DialogTitle>
+        <DialogDescription class="text-sm text-zinc-500">
+          {{ t("menu-tabs-configurator-description") }}
+        </DialogDescription>
+      </DialogHeader>
+
+      <div class="grid min-h-0 flex-1 grid-cols-[20rem_minmax(0,1fr)]">
+        <section class="flex min-h-0 flex-col border-r border-zinc-200 px-4 py-4">
+          <Input
+            v-model="search"
+            data-slot="menu-tabs-configurator-search"
+            :placeholder="t('menu-tabs-configurator-search-placeholder')"
+          />
+
+          <Button
+            data-slot="menu-tabs-configurator-add"
+            type="button"
+            class="mt-3 w-full justify-center"
+            @click="void addMenu()"
+          >
+            <Icon icon="fluent:add-20-regular" />
+            {{ t("menu-tabs-configurator-add-menu") }}
+          </Button>
+
+          <div class="mt-4 flex min-h-0 flex-1 flex-col overflow-hidden">
+            <div class="flex min-h-0 flex-1 flex-col gap-1 overflow-y-auto pr-1">
+              <div
+                v-if="filteredMenuItems.length > 0"
+                ref="sortableListRef"
+                data-slot="menu-tabs-configurator-list"
+                class="flex flex-col gap-1"
+              >
+                <div
+                  v-for="item in filteredMenuItems"
+                  :key="item.itemId"
+                  data-slot="menu-tabs-configurator-item"
+                  :data-item-id="item.itemId"
+                  :data-menu-id="item.id"
+                  :data-selected="selectedItemId === item.itemId ? 'true' : 'false'"
+                  :class="cn(
+  'flex w-full items-center gap-2 rounded-md border p-1 transition-colors',
+  selectedItemId === item.itemId ? 'border-(--primary)/25 bg-[color-mix(in_srgb,var(--primary)_10%,white)]' : 'border-transparent hover:border-zinc-200 hover:bg-zinc-50'
+)"
+                >
+                  <button
+                    type="button"
+                    data-slot="menu-tabs-configurator-drag-handle"
+                    class="flex size-8 shrink-0 cursor-grab items-center justify-center rounded-sm text-zinc-400 active:cursor-grabbing"
+                    :aria-label="t('menu-tabs-configurator-drag-menu', { menu: item.label })"
+                    @click.stop
+                  >
+                    <Icon icon="fluent:re-order-dots-vertical-20-regular" />
+                  </button>
+
+                  <button
+                    type="button"
+                    data-slot="menu-tabs-configurator-item-select"
+                    class="min-w-0 flex-1 px-2 py-2 text-left"
+                    @click="selectItem(item.itemId)"
+                  >
+                    <span class="block truncate text-sm font-medium text-zinc-800">
+                      {{ item.label }}
+                    </span>
+                  </button>
+
+                  <button
+                    type="button"
+                    data-slot="menu-tabs-configurator-delete"
+                    class="flex size-8 shrink-0 cursor-pointer items-center justify-center rounded-sm text-zinc-400 transition-colors hover:bg-red-50 hover:text-red-600"
+                    :aria-label="t('menu-tabs-configurator-delete-menu', { menu: item.label })"
+                    @click.stop="deleteMenu(item.itemId)"
+                  >
+                    <Icon icon="fluent:delete-20-regular" />
+                  </button>
+                </div>
+              </div>
+
+              <p
+                v-else-if="normalizedSearch"
+                data-slot="menu-tabs-configurator-empty"
+                class="px-1 pt-2 text-xs text-zinc-400"
+              >
+                {{ t("menu-tabs-configurator-no-matches") }}
+              </p>
+
+              <p
+                v-else
+                data-slot="menu-tabs-configurator-empty"
+                class="px-1 pt-2 text-xs text-zinc-400"
+              >
+                {{ t("menu-tabs-configurator-empty") }}
+              </p>
+            </div>
+          </div>
+        </section>
+
+        <section class="flex min-h-0 min-w-0 flex-col overflow-y-auto px-6 py-6">
+          <div
+            v-if="selectedMenu"
+            class="flex min-h-0 flex-1 flex-col gap-5"
+          >
+            <div>
+              <h3 class="text-lg font-semibold text-zinc-800">
+                {{ t("menu-tabs-configurator-menu-detail") }}
+              </h3>
+            </div>
+
+            <div class="flex flex-col gap-5">
+              <Locale
+                data-slot="menu-tabs-configurator-title"
+                :model-value="selectedMenu.menu.title"
+                @update:model-value="updateSelectedTitle"
+              />
+
+              <ExpressionEditor
+                ref="toEditor"
+                data-slot="menu-tabs-configurator-to"
+                :model-value="selectedMenu.menu.to"
+                :label="t('menu-tabs-configurator-to-label')"
+                :description="t('menu-tabs-configurator-to-description')"
+                :placeholder="t('menu-tabs-configurator-to-placeholder')"
+                :schema="MenuTabsItemToC"
+                @update:model-value="updateSelectedTo"
+              />
+            </div>
+          </div>
+
+          <div
+            v-else
+            data-slot="menu-tabs-configurator-detail-empty"
+            class="flex min-h-0 flex-1 items-center justify-center text-sm text-zinc-400"
+          >
+            {{ t("menu-tabs-configurator-select-menu") }}
+          </div>
+        </section>
+      </div>
+
+      <DialogFooter class="border-t border-zinc-200 px-6 py-4">
+        <Button
+          data-slot="menu-tabs-configurator-cancel"
+          type="button"
+          variant="ghost"
+          @click="open = false"
+        >
+          {{ t("cancel") }}
+        </Button>
+        <Button
+          data-slot="menu-tabs-configurator-confirm"
+          type="button"
+          @click="handleConfirm"
+        >
+          {{ t("confirm") }}
+        </Button>
+      </DialogFooter>
+    </DialogContent>
+  </Dialog>
+</template>
+
+<i18n lang="json">
+{
+  "zh": {
+    "menu-tabs-configurator-title": "菜单标签配置",
+    "menu-tabs-configurator-description": "配置顶部菜单标签，并使用拖拽调整顺序。",
+    "menu-tabs-configurator-menus": "菜单",
+    "menu-tabs-configurator-add-menu": "新增菜单",
+    "menu-tabs-configurator-search-placeholder": "搜索菜单名称、路径或 ID",
+    "menu-tabs-configurator-empty": "暂无菜单",
+    "menu-tabs-configurator-no-matches": "没有匹配的菜单",
+    "menu-tabs-configurator-select-menu": "请选择左侧菜单以编辑详情",
+    "menu-tabs-configurator-menu-detail": "菜单详情",
+    "menu-tabs-configurator-untitled": "未命名菜单",
+    "menu-tabs-configurator-drag-menu": "拖拽菜单 {menu}",
+    "menu-tabs-configurator-delete-menu": "删除菜单 {menu}",
+    "menu-tabs-configurator-to-label": "目标路径表达式",
+    "menu-tabs-configurator-to-description": "填写返回路径字符串的 CEL 表达式。",
+    "menu-tabs-configurator-to-placeholder": "\"/locale\"",
+    "cancel": "取消",
+    "confirm": "确认"
+  },
+  "ja": {
+    "menu-tabs-configurator-title": "メニュータブ設定",
+    "menu-tabs-configurator-description": "上部メニュータブを設定し、ドラッグで並び順を変更します。",
+    "menu-tabs-configurator-menus": "メニュー",
+    "menu-tabs-configurator-add-menu": "メニューを追加",
+    "menu-tabs-configurator-search-placeholder": "メニュー名、パス、ID を検索",
+    "menu-tabs-configurator-empty": "メニューがありません",
+    "menu-tabs-configurator-no-matches": "一致するメニューがありません",
+    "menu-tabs-configurator-select-menu": "左側のメニューを選択して詳細を編集してください",
+    "menu-tabs-configurator-menu-detail": "メニュー詳細",
+    "menu-tabs-configurator-untitled": "名称未設定メニュー",
+    "menu-tabs-configurator-drag-menu": "{menu} をドラッグ",
+    "menu-tabs-configurator-delete-menu": "{menu} を削除",
+    "menu-tabs-configurator-to-label": "遷移先パス式",
+    "menu-tabs-configurator-to-description": "パス文字列を返す CEL 式を入力してください。",
+    "menu-tabs-configurator-to-placeholder": "\"/locale\"",
+    "cancel": "キャンセル",
+    "confirm": "確認"
+  },
+  "en": {
+    "menu-tabs-configurator-title": "Menu tabs configurator",
+    "menu-tabs-configurator-description": "Configure the top menu tabs and drag to reorder them.",
+    "menu-tabs-configurator-menus": "Menus",
+    "menu-tabs-configurator-add-menu": "Add menu",
+    "menu-tabs-configurator-search-placeholder": "Search menu name, path, or ID",
+    "menu-tabs-configurator-empty": "No menus yet",
+    "menu-tabs-configurator-no-matches": "No matching menus",
+    "menu-tabs-configurator-select-menu": "Select a menu on the left to edit its details",
+    "menu-tabs-configurator-menu-detail": "Menu details",
+    "menu-tabs-configurator-untitled": "Untitled menu",
+    "menu-tabs-configurator-drag-menu": "Drag menu {menu}",
+    "menu-tabs-configurator-delete-menu": "Delete menu {menu}",
+    "menu-tabs-configurator-to-label": "Target path expression",
+    "menu-tabs-configurator-to-description": "Enter a CEL expression that returns a path string.",
+    "menu-tabs-configurator-to-placeholder": "\"/locale\"",
+    "cancel": "Cancel",
+    "confirm": "Confirm"
+  }
+}
+</i18n>

package/dist/runtime/components/ui/menu-tabs-configurator/MenuTabsConfiguratorDialog.vue.d.ts

@@ -0,0 +1,30 @@
+import type { LocaleValue } from '../../../utils/coders.js';
+import { type MenuTabsConfig } from '../menu-tabs/schema.js';
+type __VLS_Props = {
+    config: MenuTabsConfig;
+};
+type __VLS_ModelProps = {
+    'open'?: boolean;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+    confirm: (args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: LocaleValue;
+            to: string;
+        }>[];
+    }>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+    onConfirm?: ((args_0: Readonly<{
+        menus: readonly Readonly<{
+            id: string;
+            title: LocaleValue;
+            to: string;
+        }>[];
+    }>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shwfed/nuxt",
-  "version": "0.10.9",
+  "version": "0.10.11",
   "description": "",
   "license": "MIT",
   "type": "module",