@shwfed/nuxt 0.11.16 → 0.11.18

package/dist/module.json

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

package/dist/module.mjs

@@ -73,6 +73,10 @@ const module$1 = defineNuxtModule({
       name: "ShwfedButton",
       filePath: resolver.resolve("runtime/components/button.vue")
     });
+    addComponent({
+      name: "ShwfedButtonAction",
+      filePath: resolver.resolve("runtime/components/button-action.vue")
+    });
     addComponent({
       name: "ShwfedFields",
       filePath: resolver.resolve("runtime/components/fields.vue")

package/dist/runtime/components/button-action.d.vue.ts

@@ -0,0 +1,18 @@
+import type { ButtonActionEffect, ButtonActionEffectFactory } from '../composables/useButtonAction.js';
+import type { OverlayBodyRender } from '../composables/useOverlay.js';
+type __VLS_Props = {
+    actionId: string;
+    effect?: ButtonActionEffect | ButtonActionEffectFactory;
+};
+type __VLS_Slots = {
+    default?: OverlayBodyRender;
+};
+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/button-action.vue

@@ -0,0 +1,57 @@
+<script setup>
+import { inject, onBeforeUnmount, onMounted, onUpdated } from "vue";
+import { buttonActionRegistryKey } from "./ui/buttons/action-registry";
+defineOptions({
+  inheritAttrs: false
+});
+const props = defineProps({
+  actionId: { type: String, required: true },
+  effect: { type: Function, required: false, skipCheck: true }
+});
+const slots = defineSlots();
+const registry = inject(buttonActionRegistryKey, void 0);
+const ownerId = crypto.randomUUID();
+const isDevelopment = process.env.NODE_ENV !== "production";
+let registeredActionId;
+let hasWarnedMissingRegistry = false;
+function warnMissingRegistry() {
+  if (!isDevelopment || hasWarnedMissingRegistry) {
+    return;
+  }
+  hasWarnedMissingRegistry = true;
+  console.warn("[shwfed-button-action] must be used inside <shwfed-button>.");
+}
+function syncAction() {
+  if (!registry) {
+    warnMissingRegistry();
+    return;
+  }
+  if (registeredActionId && registeredActionId !== props.actionId) {
+    registry.unregisterAction(registeredActionId, ownerId);
+  }
+  registry.registerAction({
+    ownerId,
+    actionId: props.actionId,
+    effect: props.effect,
+    render: slots.default
+  });
+  registeredActionId = props.actionId;
+}
+syncAction();
+onMounted(() => {
+  syncAction();
+});
+onUpdated(() => {
+  syncAction();
+});
+onBeforeUnmount(() => {
+  if (!registry || !registeredActionId) {
+    return;
+  }
+  registry.unregisterAction(registeredActionId, ownerId);
+});
+</script>
+
+<template>
+  <span v-if="false" />
+</template>

package/dist/runtime/components/button-action.vue.d.ts

@@ -0,0 +1,18 @@
+import type { ButtonActionEffect, ButtonActionEffectFactory } from '../composables/useButtonAction.js';
+import type { OverlayBodyRender } from '../composables/useOverlay.js';
+type __VLS_Props = {
+    actionId: string;
+    effect?: ButtonActionEffect | ButtonActionEffectFactory;
+};
+type __VLS_Slots = {
+    default?: OverlayBodyRender;
+};
+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/button.d.vue.ts

@@ -1,5 +1,4 @@
 import { Effect } from 'effect';
-import type { OverlayBodyRender } from '../composables/useOverlay.js';
 import type { ButtonConfigInput } from './ui/buttons/schema.js';
 export { ButtonActionC, ButtonBodyC, ButtonBodyInputC, ButtonConfigC, ButtonConfigInputC, ButtonDropdownC, ButtonGroupC, ButtonModalC, ButtonsStyleC, CURRENT_COMPATIBILITY_DATE, KIND, SUPPORTED_COMPATIBILITY_DATES, createButtonConfig, } from './ui/buttons/schema.js';
 export type { ButtonAction, ButtonBody, ButtonBodyInput, ButtonConfig, ButtonConfigInput, ButtonDropdown, ButtonDropdownAction, ButtonGroup, ButtonGroupItem, ButtonModal, ButtonSize, ButtonVariant, } from './ui/buttons/schema.js';
@@ -158,7 +157,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
         style?: string | undefined;
     }>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    [name: string]: OverlayBodyRender;
+    default?: (props: {}) => any;
 }>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/runtime/components/button.vue

@@ -9,7 +9,6 @@ const props = defineProps({
   config: { type: null, required: false }
 });
 const emit = defineEmits(["update:config"]);
-const slots = defineSlots();
 const defaultConfig = createButtonConfig({
   gap: 12,
   groups: []
@@ -53,14 +52,6 @@ export { ButtonActionService, currentButtonAction } from "../composables/useButt
     :config="resolveConfig()"
     @update:config="handleConfigUpdate"
   >
-    <template
-      v-for="(_, slotName) in slots"
-      #[slotName]="slotProps"
-    >
-      <slot
-        :name="slotName"
-        v-bind="slotProps ?? {}"
-      />
-    </template>
+    <slot />
   </UiButtons>
 </template>

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

@@ -1,5 +1,4 @@
 import { Effect } from 'effect';
-import type { OverlayBodyRender } from '../composables/useOverlay.js';
 import type { ButtonConfigInput } from './ui/buttons/schema.js';
 export { ButtonActionC, ButtonBodyC, ButtonBodyInputC, ButtonConfigC, ButtonConfigInputC, ButtonDropdownC, ButtonGroupC, ButtonModalC, ButtonsStyleC, CURRENT_COMPATIBILITY_DATE, KIND, SUPPORTED_COMPATIBILITY_DATES, createButtonConfig, } from './ui/buttons/schema.js';
 export type { ButtonAction, ButtonBody, ButtonBodyInput, ButtonConfig, ButtonConfigInput, ButtonDropdown, ButtonDropdownAction, ButtonGroup, ButtonGroupItem, ButtonModal, ButtonSize, ButtonVariant, } from './ui/buttons/schema.js';
@@ -158,7 +157,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
         style?: string | undefined;
     }>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    [name: string]: OverlayBodyRender;
+    default?: (props: {}) => any;
 }>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1,5 +1,4 @@
 import { Effect } from 'effect';
-import { type OverlayBodyRender } from '../../../composables/useOverlay.js';
 import { type ButtonConfigInput } from './schema.js';
 export { ButtonActionC, ButtonConfigC, ButtonConfigInputC, ButtonDropdownC, ButtonGroupC, ButtonModalC, ButtonsStyleC } from './schema.js';
 export { ButtonBodyC, ButtonBodyInputC, CURRENT_COMPATIBILITY_DATE, KIND, SUPPORTED_COMPATIBILITY_DATES, createButtonConfig, } from './schema.js';
@@ -159,7 +158,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
         style?: string | undefined;
     }>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    [name: string]: OverlayBodyRender;
+    default?: (props: {}) => any;
 }>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1,6 +1,6 @@
 <script setup>
 import { useNuxtApp } from "#app";
-import { useAttrs, computed, onBeforeUnmount, ref, watch } from "vue";
+import { useAttrs, computed, onBeforeUnmount, provide, reactive, ref, watch } from "vue";
 import { computedAsync } from "@vueuse/core";
 import { Icon } from "@iconify/vue";
 import { Effect } from "effect";
@@ -25,6 +25,7 @@ import {
   ButtonConfigC,
   createButtonConfig
 } from "./schema";
+import { buttonActionRegistryKey } from "./action-registry";
 defineOptions({
   inheritAttrs: false
 });
@@ -37,8 +38,10 @@ const defaultConfig = createButtonConfig({
   groups: []
 });
 const uuidPattern = /^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/iu;
+const isDevelopment = process.env.NODE_ENV !== "production";
+const duplicateActionWarnings = /* @__PURE__ */ new Set();
+const unknownActionWarnings = /* @__PURE__ */ new Set();
 const attrs = useAttrs();
-const slots = defineSlots();
 const { locale, t } = useI18n();
 const { $dsl } = useNuxtApp();
 const overlay = useOverlay();
@@ -46,6 +49,7 @@ const isCheating = useCheating();
 const isConfiguratorOpen = ref(false);
 const pendingIds = ref([]);
 const overlayOwnerId = crypto.randomUUID();
+const declaredActions = reactive({});
 const currentConfig = computedAsync(
   async () => ButtonConfigC.parse(await props.config.pipe(Effect.runPromise) ?? defaultConfig)
 );
@@ -55,13 +59,69 @@ watch(currentConfig, (value) => {
     displayConfig.value = value;
   }
 }, { immediate: true });
+const actionIds = computed(() => displayConfig.value.groups.flatMap((group) => group.items.flatMap((item) => {
+  if (isDropdownItem(item)) {
+    return item.items.map((child) => child.id);
+  }
+  return [item.id];
+})));
+const actionIdSet = computed(() => new Set(actionIds.value));
+function warnDuplicateAction(actionId) {
+  if (!isDevelopment || duplicateActionWarnings.has(actionId)) {
+    return;
+  }
+  duplicateActionWarnings.add(actionId);
+  console.warn(`[shwfed-button] duplicate action declaration for "${actionId}". The latest declaration wins.`);
+}
+function warnUnknownAction(actionId) {
+  if (!isDevelopment || unknownActionWarnings.has(actionId)) {
+    return;
+  }
+  unknownActionWarnings.add(actionId);
+  console.warn(`[shwfed-button] action "${actionId}" is not present in the current button config.`);
+}
+function registerAction(definition) {
+  const existing = declaredActions[definition.actionId];
+  if (existing && existing.ownerId !== definition.ownerId) {
+    warnDuplicateAction(definition.actionId);
+  }
+  declaredActions[definition.actionId] = definition;
+}
+function unregisterAction(actionId, ownerId) {
+  const existing = declaredActions[actionId];
+  if (!existing) {
+    return;
+  }
+  if (ownerId !== void 0 && existing.ownerId !== ownerId) {
+    return;
+  }
+  Reflect.deleteProperty(declaredActions, actionId);
+}
+provide(buttonActionRegistryKey, {
+  registerAction,
+  unregisterAction,
+  hasAction: (actionId) => actionIdSet.value.has(actionId)
+});
+function validateDeclaredActions() {
+  if (currentConfig.value === void 0) {
+    return;
+  }
+  for (const actionId of Object.keys(declaredActions)) {
+    if (!actionIdSet.value.has(actionId)) {
+      warnUnknownAction(actionId);
+    }
+  }
+}
+watch(actionIdSet, () => {
+  validateDeclaredActions();
+}, { immediate: true });
 const modalDefinitions = computed(() => {
   const nextDefinitions = [];
   for (const group of displayConfig.value.groups) {
     for (const item of group.items) {
       if (isDropdownItem(item)) {
         for (const child of item.items) {
-          const render2 = slots[child.id];
+          const render2 = declaredActions[child.id]?.render;
           if (render2) {
             nextDefinitions.push({
               definitionId: child.id,
@@ -73,7 +133,7 @@ const modalDefinitions = computed(() => {
         }
         continue;
       }
-      const render = slots[item.id];
+      const render = declaredActions[item.id]?.render;
       if (render) {
         nextDefinitions.push({
           definitionId: item.id,
@@ -92,14 +152,8 @@ watch(modalDefinitions, (definitions) => {
 onBeforeUnmount(() => {
   overlay.syncDefinitions(overlayOwnerId, []);
 });
-const actionIds = computed(() => displayConfig.value.groups.flatMap((group) => group.items.flatMap((item) => {
-  if ("items" in item) {
-    return item.items.map((child) => child.id);
-  }
-  return [item.id];
-})));
 const rootAttrs = computed(() => {
-  const ignoredKeys = new Set(actionIds.value);
+  const ignoredKeys = actionIdSet.value;
   const nextAttrs = {};
   for (const [key, value] of Object.entries(attrs)) {
     if (ignoredKeys.has(key) || key === "class" || uuidPattern.test(key)) {
@@ -155,7 +209,7 @@ function getModalShell(modal) {
   };
 }
 function getButtonEffect(buttonId) {
-  return Reflect.get(attrs, buttonId);
+  return declaredActions[buttonId]?.effect;
 }
 function isEffectValue(value) {
   return typeof value === "object" && value !== null && "_op" in value;
@@ -456,6 +510,8 @@ export { ButtonActionService, currentButtonAction } from "../../../composables/u
         </DropdownMenu>
       </template>
     </ButtonGroup>
+
+    <slot />
   </div>
 </template>
 

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

@@ -1,5 +1,4 @@
 import { Effect } from 'effect';
-import { type OverlayBodyRender } from '../../../composables/useOverlay.js';
 import { type ButtonConfigInput } from './schema.js';
 export { ButtonActionC, ButtonConfigC, ButtonConfigInputC, ButtonDropdownC, ButtonGroupC, ButtonModalC, ButtonsStyleC } from './schema.js';
 export { ButtonBodyC, ButtonBodyInputC, CURRENT_COMPATIBILITY_DATE, KIND, SUPPORTED_COMPATIBILITY_DATES, createButtonConfig, } from './schema.js';
@@ -159,7 +158,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
         style?: string | undefined;
     }>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    [name: string]: OverlayBodyRender;
+    default?: (props: {}) => any;
 }>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/runtime/components/ui/buttons/action-registry.d.ts

@@ -0,0 +1,15 @@
+import type { InjectionKey } from 'vue';
+import type { ButtonActionEffect, ButtonActionEffectFactory } from '../../../composables/useButtonAction.js';
+import type { OverlayBodyRender } from '../../../composables/useOverlay.js';
+export type DeclaredButtonAction = Readonly<{
+    ownerId: string;
+    actionId: string;
+    effect?: ButtonActionEffect | ButtonActionEffectFactory;
+    render?: OverlayBodyRender;
+}>;
+export interface ButtonActionRegistry {
+    registerAction: (definition: DeclaredButtonAction) => void;
+    unregisterAction: (actionId: string, ownerId?: string) => void;
+    hasAction: (actionId: string) => boolean;
+}
+export declare const buttonActionRegistryKey: InjectionKey<ButtonActionRegistry>;

package/dist/runtime/components/ui/buttons/action-registry.js

@@ -0,0 +1 @@
+export const buttonActionRegistryKey = Symbol("shwfed/button-action-registry");

package/dist/runtime/components/ui/buttons/button-action.types.d.ts

@@ -0,0 +1,6 @@
+import { type ButtonActionEffect, type ButtonActionEffectFactory } from '../../../composables/useButtonAction.js';
+export declare const overlayFactoryEffect: ButtonActionEffectFactory;
+export declare const submitFactoryEffect: ButtonActionEffectFactory;
+export declare const promiseEffect: ButtonActionEffect;
+export declare const syncEffect: ButtonActionEffect;
+export declare const overlayContextEffect: ButtonActionEffectFactory;

package/dist/runtime/components/ui/buttons/button-action.types.js

@@ -0,0 +1,26 @@
+import { Effect, Option } from "effect";
+import { openOverlay } from "../../../composables/useOverlay.js";
+import { currentButtonAction } from "../../../composables/useButtonAction.js";
+export const overlayFactoryEffect = ({ id }) => Effect.gen(function* () {
+  const handle = yield* openOverlay(id);
+  return handle;
+});
+export const submitFactoryEffect = ({ title }) => Effect.gen(function* () {
+  if (title.length === 0) {
+    return yield* Effect.fail(new Error("missing title"));
+  }
+  return {
+    submitted: true,
+    title
+  };
+});
+export const promiseEffect = Effect.promise(async () => ({
+  status: "ok"
+}));
+export const syncEffect = Effect.sync(() => 1);
+export const overlayContextEffect = () => Effect.gen(function* () {
+  const action = yield* currentButtonAction();
+  const handle = yield* openOverlay(action.id);
+  const result = yield* handle.result;
+  return Option.isSome(result);
+});

package/dist/runtime/components/ui/buttons/schema.js

@@ -24,7 +24,7 @@ export const ButtonActionC = z.strictObject({
   variant: buttonVariantC,
   size: buttonSizeC,
   hideTitle: z.boolean().optional().describe("\u4EC5\u5BF9\u975E\u4E0B\u62C9\u6309\u94AE\u751F\u6548\uFF1B\u4E3A true \u65F6\u9690\u85CF\u6309\u94AE\u6587\u5B57\uFF0C\u4EC5\u663E\u793A\u56FE\u6807"),
-  modal: ButtonModalC.optional().describe("\u4E0E\u5F53\u524D\u6309\u94AE UUID \u540C\u540D slot \u6253\u5F00\u65F6\u4F7F\u7528\u7684\u9ED8\u8BA4 Modal \u58F3\u914D\u7F6E")
+  modal: ButtonModalC.optional().describe("\u4F9B\u5F53\u524D action \u7684 overlay \u58F0\u660E\u4F7F\u7528\u7684\u9ED8\u8BA4 Modal \u58F3\u914D\u7F6E")
 }).readonly();
 const DropdownButtonActionC = z.strictObject({
   id: buttonIdC,
@@ -32,7 +32,7 @@ const DropdownButtonActionC = z.strictObject({
   tooltip: localeC.optional().describe("\u4E0B\u62C9\u9879\u6309\u94AE\u63D0\u793A\u7684\u672C\u5730\u5316\u663E\u793A\u6587\u672C"),
   icon: z.string().optional().describe("Iconify \u56FE\u6807\u6807\u8BC6\u7B26"),
   variant: buttonVariantC,
-  modal: ButtonModalC.optional().describe("\u4E0E\u5F53\u524D\u4E0B\u62C9\u6309\u94AE UUID \u540C\u540D slot \u6253\u5F00\u65F6\u4F7F\u7528\u7684\u9ED8\u8BA4 Modal \u58F3\u914D\u7F6E")
+  modal: ButtonModalC.optional().describe("\u4F9B\u5F53\u524D action \u7684 overlay \u58F0\u660E\u4F7F\u7528\u7684\u9ED8\u8BA4 Modal \u58F3\u914D\u7F6E")
 }).readonly();
 export const ButtonDropdownC = z.strictObject({
   id: buttonIdC,

package/dist/runtime/composables/useButtonAction.d.ts

@@ -1,4 +1,5 @@
 import { Context, Effect, type Scope } from 'effect';
+import type { OverlayService } from './useOverlay.js';
 export type ButtonActionRuntime = Readonly<{
     id: string;
     locale: string;
@@ -15,7 +16,7 @@ declare const ButtonActionService_base: Context.TagClass<ButtonActionService, "s
 }>>;
 export declare class ButtonActionService extends ButtonActionService_base {
 }
-export type ButtonActionEffect = Effect.Effect<void, never, ButtonActionService | Scope.Scope> | Effect.Effect<void, never, ButtonActionService> | Effect.Effect<void, never, Scope.Scope> | Effect.Effect<void, never, never>;
+export type ButtonActionEffect = Effect.Effect<unknown, unknown, ButtonActionService | OverlayService | Scope.Scope> | Effect.Effect<unknown, unknown, ButtonActionService | OverlayService> | Effect.Effect<unknown, unknown, ButtonActionService | Scope.Scope> | Effect.Effect<unknown, unknown, OverlayService | Scope.Scope> | Effect.Effect<unknown, unknown, ButtonActionService> | Effect.Effect<unknown, unknown, OverlayService> | Effect.Effect<unknown, unknown, Scope.Scope> | Effect.Effect<unknown, unknown, never>;
 export type ButtonActionEffectFactory = (context: ButtonActionRuntime) => ButtonActionEffect;
 export declare function currentButtonAction(): Effect.Effect<ButtonActionRuntime, never, ButtonActionService>;
 export {};

package/dist/runtime/plugins/toast/index.d.ts

@@ -7,9 +7,9 @@ declare const _default: import("#app").Plugin<{
         custom: (component: import("vue").Component, data?: import("vue-sonner").ExternalToast) => string | number;
         message: (message: string | (() => string | import("vue").Component) | import("vue").Component, data?: import("vue-sonner").ExternalToast) => string | number;
         promise: <ToastData>(promise: Promise<ToastData> | (() => Promise<ToastData>), data?: ({
+            dismissible?: boolean | undefined;
             id?: number | string | undefined;
             icon?: import("vue").Component | undefined;
-            dismissible?: boolean | undefined;
             duration?: number | undefined;
             class?: string | undefined;
             style?: import("vue").CSSProperties | undefined;
@@ -60,9 +60,9 @@ declare const _default: import("#app").Plugin<{
         custom: (component: import("vue").Component, data?: import("vue-sonner").ExternalToast) => string | number;
         message: (message: string | (() => string | import("vue").Component) | import("vue").Component, data?: import("vue-sonner").ExternalToast) => string | number;
         promise: <ToastData>(promise: Promise<ToastData> | (() => Promise<ToastData>), data?: ({
+            dismissible?: boolean | undefined;
             id?: number | string | undefined;
             icon?: import("vue").Component | undefined;
-            dismissible?: boolean | undefined;
             duration?: number | undefined;
             class?: string | undefined;
             style?: import("vue").CSSProperties | undefined;

package/package.json

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