mortise-tenon-design 0.5.0 → 0.6.0

package/dist/lib/src/component-neo/src/component-neo.vue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"component-neo.vue.js","sources":["../../../../../src/component-neo/src/component-neo.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ComponentNeoProps } from './component-neo';\nimport { Comment, computed, h, nextTick, unref, useAttrs, watch } from 'vue';\nimport { useComponentState } from './hooks/use-component-state';\n\ndefineOptions({ name: 'MtComponentNeo', inheritAttrs: false });\n\nconst props = withDefaults(\n  defineProps<ComponentNeoProps>(),\n  { uniqueId: '', onToggle: () => { } },\n);\n\nconst emit = defineEmits<{\n  (e: 'toggleComponent', name?: string, ref?: any): void\n}>();\n\nconst { initComponent } = useComponentState();\nconst { componentRef, componentNeo, componentAttrs, componentSlots } = initComponent(props.uniqueId);\nconst compRef = (el: Element) => componentRef.value = el;\n\nconst commonAttrs: Record<string, unknown> = useAttrs();\n/** 结合注入的属性和公共属性 */\nconst compAttrs = computed(() => {\n  const newAttrs: Record<string, unknown> = {};\n  // 仅传入有值的属性\n  for (const key in componentAttrs.value) {\n    if (typeof componentAttrs.value[key] !== 'undefined') {\n      newAttrs[key] = unref(componentAttrs.value[key]); // 支持ref数据转入\n    }\n  }\n  return Object.assign(newAttrs, commonAttrs);\n});\n\nconst compInstance = computed(() => componentNeo.value || props.is);\n\nconst compVNode = computed(() => {\n  return !compInstance.value ? h(Comment, 'ComponentNeo is empty') : h(compInstance.value, compAttrs.value, componentSlots.value);\n});\n\nconst compName = computed(() => {\n  return typeof compInstance.value === 'object' && 'name' in compInstance.value ? compInstance.value.name : undefined;\n});\n\n// 监听组件切换，触发回调\nwatch(compInstance, async () => {\n  await nextTick();\n  emit('toggleComponent', compName.value, componentRef.value);\n});\n\ndefineExpose({ componentRef });\n</script>\n\n<template>\n  <!-- eslint-disable-next-line vue/attribute-hyphenation -->\n  <slot :Component=\"compVNode\" :compRef=\"compRef\" :attrs=\"compAttrs\" :compName=\"compName\">\n    <component :is=\"compVNode\" :ref=\"compRef\" />\n  </slot>\n</template>\n"],"names":["props","__props","emit","__emit","initComponent","useComponentState","componentRef","componentNeo","componentAttrs","componentSlots","compRef","el","commonAttrs","useAttrs","compAttrs","computed","newAttrs","key","unref","compInstance","compVNode","h","Comment","compName","watch","nextTick","__expose"],"mappings":"0VAOA,MAAMA,EAAQC,EAKRC,EAAOC,EAIP,CAAE,cAAAC,CAAc,EAAIC,oBAAkB,EACtC,CAAE,aAAAC,EAAc,aAAAC,EAAc,eAAAC,EAAgB,eAAAC,GAAmBL,EAAcJ,EAAM,QAAQ,EAC7FU,EAAWC,GAAgBL,EAAa,MAAQK,EAEhDC,EAAuCC,EAAAA,SAAS,EAEhDC,EAAYC,EAAAA,SAAS,IAAM,CAC/B,MAAMC,EAAoC,CAAC,EAEhC,UAAAC,KAAOT,EAAe,MAC3B,OAAOA,EAAe,MAAMS,CAAG,EAAM,MACvCD,EAASC,CAAG,EAAIC,EAAAA,MAAMV,EAAe,MAAMS,CAAG,CAAC,GAG5C,OAAA,OAAO,OAAOD,EAAUJ,CAAW,CAAA,CAC3C,EAEKO,EAAeJ,EAAAA,SAAS,IAAMR,EAAa,OAASP,EAAM,EAAE,EAE5DoB,EAAYL,EAAAA,SAAS,IACjBI,EAAa,MAA8CE,IAAEF,EAAa,MAAOL,EAAU,MAAOL,EAAe,KAAK,EAAjGY,EAAAA,EAAEC,EAAAA,QAAS,uBAAuB,CAChE,EAEKC,EAAWR,EAAAA,SAAS,IACjB,OAAOI,EAAa,OAAU,UAAY,SAAUA,EAAa,MAAQA,EAAa,MAAM,KAAO,MAC3G,EAGDK,OAAAA,EAAA,MAAML,EAAc,SAAY,CAC9B,MAAMM,WAAS,EACfvB,EAAK,kBAAmBqB,EAAS,MAAOjB,EAAa,KAAK,CAAA,CAC3D,EAEYoB,EAAA,CAAE,aAAApB,EAAc"}

package/dist/lib/src/component-neo/src/component-neo.vue2.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./component-neo.vue.js");exports.default=e.default;
-//# sourceMappingURL=component-neo.vue2.js.map

package/dist/lib/src/component-neo/src/component-neo.vue2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"component-neo.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/lib/src/component-neo/src/hooks/use-component-neo.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("vue"),d=require("./use-component-state.js");function C(r=""){const{setComponent:i,getComponent:a}=d.useComponentState();async function p(t,l,f){var c;try{const s=typeof t=="function"?(await t()).default:t,o={};for(let e in l){const n=l[e];e.startsWith("vModel:")||e==="vModel"?(e=e.replace(/^(vModel):?/,"")||"modelValue",o[e]=n,u.isRef(n)&&(o[`onUpdate:${e}`]=m=>n.value=m)):o[e]=n}return i(r,{comp:s,attrs:o,slots:f||{}}),await u.nextTick(),(c=a(r))==null?void 0:c.Instance.value}catch(s){console.error(s)}}return{getComponentRef:()=>{var t;return(t=a(r))==null?void 0:t.Instance.value},toggleComponent:p}}exports.useComponentNeo=C;
-//# sourceMappingURL=use-component-neo.js.map

package/dist/lib/src/component-neo/src/hooks/use-component-neo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-component-neo.js","sources":["../../../../../../src/component-neo/src/hooks/use-component-neo.ts"],"sourcesContent":["import type { VNode } from 'vue';\nimport type { ComponentSlots, InstanceComponent } from '../component-neo';\nimport { isRef, nextTick } from 'vue';\nimport { useComponentState } from './use-component-state';\n\nexport type ImportComponentFn = () => Promise<Record<string, any>>;\nexport type DynamicComponent = InstanceComponent | ImportComponentFn | VNode;\n\nexport function useComponentNeo(uniqueId = '') {\n  const { setComponent, getComponent } = useComponentState();\n\n  /**\n   * 切换渲染的组件\n   * @param comp 组件，支持传入，1.import动态导入 2.组件类型 3.VNode\n   * @param attrs 组件属性，可使用`on事件`方式添加事件方法，属性支持Ref类型进行绑定以实现动态变化, 支持通过{'vModal:value': value}方式双向绑定数据\n   * @param slots 组件插槽\n   */\n  async function toggleComponent(comp?: DynamicComponent, attrs?: Record<string, any>, slots?: ComponentSlots) {\n    try {\n      const renderComp = typeof comp === 'function' ? (await (comp as ImportComponentFn)()).default : comp;\n      const renderAttrs: Record<string, unknown> = {};\n      for (let key in attrs) {\n        const bindValue = attrs[key];\n        // 兼容vModel\n        if (key.startsWith('vModel:') || key === 'vModel') {\n          key = key.replace(/^(vModel):?/, '') || 'modelValue';\n          renderAttrs[key] = bindValue;\n          if (isRef(bindValue)) {\n            renderAttrs[`onUpdate:${key}`] = (value: unknown) => bindValue.value = value;\n          }\n        }\n        else {\n          renderAttrs[key] = bindValue;\n        }\n      }\n      setComponent(uniqueId, { comp: renderComp, attrs: renderAttrs, slots: slots || {} });\n      await nextTick();\n      return getComponent(uniqueId)?.Instance.value;\n    }\n    catch (e) {\n      console.error(e);\n    }\n  }\n  return {\n    getComponentRef: () => getComponent(uniqueId)?.Instance.value,\n    toggleComponent,\n  };\n};\n"],"names":["useComponentNeo","uniqueId","setComponent","getComponent","useComponentState","toggleComponent","comp","attrs","slots","renderComp","renderAttrs","key","bindValue","isRef","value","nextTick","_a","e"],"mappings":"6IAQgB,SAAAA,EAAgBC,EAAW,GAAI,CAC7C,KAAM,CAAE,aAAAC,EAAc,aAAAC,CAAa,EAAIC,oBAAkB,EAQ1C,eAAAC,EAAgBC,EAAyBC,EAA6BC,EAAwB,OACvG,GAAA,CACF,MAAMC,EAAa,OAAOH,GAAS,YAAc,MAAOA,EAAA,GAA8B,QAAUA,EAC1FI,EAAuC,CAAC,EAC9C,QAASC,KAAOJ,EAAO,CACf,MAAAK,EAAYL,EAAMI,CAAG,EAEvBA,EAAI,WAAW,SAAS,GAAKA,IAAQ,UACvCA,EAAMA,EAAI,QAAQ,cAAe,EAAE,GAAK,aACxCD,EAAYC,CAAG,EAAIC,EACfC,EAAAA,MAAMD,CAAS,IACjBF,EAAY,YAAYC,CAAG,EAAE,EAAKG,GAAmBF,EAAU,MAAQE,IAIzEJ,EAAYC,CAAG,EAAIC,CACrB,CAEW,OAAAV,EAAAD,EAAU,CAAE,KAAMQ,EAAY,MAAOC,EAAa,MAAOF,GAAS,CAAA,EAAI,EACnF,MAAMO,WAAS,GACRC,EAAAb,EAAaF,CAAQ,IAArB,YAAAe,EAAwB,SAAS,YAEnCC,EAAG,CACR,QAAQ,MAAMA,CAAC,CAAA,CACjB,CAEK,MAAA,CACL,gBAAiB,IAAA,OAAM,OAAAD,EAAAb,EAAaF,CAAQ,IAArB,YAAAe,EAAwB,SAAS,OACxD,gBAAAX,CACF,CACF"}

package/dist/lib/src/component-neo/src/hooks/use-component-state.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("@vueuse/core"),n=require("vue"),v=i.createGlobalState(()=>{const a=new Map,s=new Map;function f(t=""){let e=s.get(t);e||(e={Instance:n.ref(),comp:n.shallowRef(),attrs:n.ref({}),slots:n.ref({})},s.set(t,e),n.onBeforeUnmount(()=>p(t)));const o=a.get(t);return o&&(e.comp.value=o.comp,e.attrs.value=o.attrs,e.slots.value=o.slots),{componentRef:e.Instance,componentNeo:e.comp,componentAttrs:e.attrs,componentSlots:e.slots}}function r(t=""){return s.get(t)}function p(t=""){a.delete(t),s.delete(t)}function u(t="",e){const{comp:o,attrs:l,slots:m}=e,c=r(t);c&&(c.comp.value=o,c.attrs.value=l,c.slots.value=m),a.set(t,{comp:o,attrs:l,slots:m})}return{initComponent:f,setComponent:u,getComponent:r,removeComponent:p}});exports.useComponentState=v;
-//# sourceMappingURL=use-component-state.js.map

package/dist/lib/src/component-neo/src/hooks/use-component-state.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-component-state.js","sources":["../../../../../../src/component-neo/src/hooks/use-component-state.ts"],"sourcesContent":["import type { Ref, ShallowRef, VNode } from 'vue';\nimport type { ComponentSlots, InstanceComponent } from '../component-neo';\nimport { createGlobalState } from '@vueuse/core';\nimport { onBeforeUnmount, ref, shallowRef } from 'vue';\n\ninterface ComponentRefsType {\n  /** 引用实例 */\n  Instance: Ref<any>\n  /** 组件 */\n  comp: ShallowRef<InstanceComponent | VNode | undefined>\n  /** 属性 */\n  attrs: Ref<Record<string, unknown>>\n  /** 插槽 */\n  slots: Ref<ComponentSlots>\n}\n\ninterface ComponentData {\n  comp?: InstanceComponent | VNode\n  attrs: Record<string, unknown>\n  slots: ComponentSlots\n}\n\n/** 组件状态 */\nexport const useComponentState = createGlobalState(() => {\n  /** 缓存组件数据，组件未实例化时，可先缓存后赋值 */\n  const dataBufferMap = new Map<string, ComponentData>();\n  /** 实例化后的组件 */\n  const componentRefsMap = new Map<string, ComponentRefsType>();\n  /** 初始化组件 */\n  function initComponent(uniqueId = '') {\n    let componentRefs = componentRefsMap.get(uniqueId);\n    if (!componentRefs) {\n      componentRefs = {\n        Instance: ref(),\n        comp: shallowRef<InstanceComponent | VNode>(),\n        attrs: ref<Record<string, unknown>>({}),\n        slots: ref<ComponentSlots>({}),\n      };\n      componentRefsMap.set(uniqueId, componentRefs);\n      onBeforeUnmount(() => removeComponent(uniqueId));\n    }\n    // 使用缓存数据初始化数据\n    const bufferData = dataBufferMap.get(uniqueId);\n    if (bufferData) {\n      componentRefs.comp.value = bufferData.comp;\n      componentRefs.attrs.value = bufferData.attrs;\n      componentRefs.slots.value = bufferData.slots;\n    }\n\n    return {\n      componentRef: componentRefs.Instance,\n      componentNeo: componentRefs.comp,\n      componentAttrs: componentRefs.attrs,\n      componentSlots: componentRefs.slots,\n    };\n  }\n\n  /** 获取实例 */\n  function getComponent(uniqueId = '') {\n    return componentRefsMap.get(uniqueId);\n  }\n\n  /** 移除实例 */\n  function removeComponent(uniqueId = '') {\n    dataBufferMap.delete(uniqueId);\n    componentRefsMap.delete(uniqueId);\n  }\n\n  /** 设置组件数据 */\n  function setComponent(uniqueId = '', args: ComponentData) {\n    const { comp, attrs, slots } = args;\n    const componentRefs = getComponent(uniqueId);\n    if (componentRefs) {\n      componentRefs.comp.value = comp;\n      componentRefs.attrs.value = attrs;\n      componentRefs.slots.value = slots;\n    }\n    dataBufferMap.set(uniqueId, { comp, attrs, slots });\n  }\n\n  return { initComponent, setComponent, getComponent, removeComponent };\n});\n"],"names":["useComponentState","createGlobalState","dataBufferMap","componentRefsMap","initComponent","uniqueId","componentRefs","ref","shallowRef","onBeforeUnmount","removeComponent","bufferData","getComponent","setComponent","args","comp","attrs","slots"],"mappings":"iIAuBaA,EAAoBC,oBAAkB,IAAM,CAEjD,MAAAC,MAAoB,IAEpBC,MAAuB,IAEpB,SAAAC,EAAcC,EAAW,GAAI,CAChC,IAAAC,EAAgBH,EAAiB,IAAIE,CAAQ,EAC5CC,IACaA,EAAA,CACd,SAAUC,EAAAA,IAAI,EACd,KAAMC,EAAAA,WAAsC,EAC5C,MAAOD,EAA6B,IAAA,EAAE,EACtC,MAAOA,EAAoB,IAAA,CAAE,CAAA,CAC/B,EACiBJ,EAAA,IAAIE,EAAUC,CAAa,EAC5BG,kBAAA,IAAMC,EAAgBL,CAAQ,CAAC,GAG3C,MAAAM,EAAaT,EAAc,IAAIG,CAAQ,EAC7C,OAAIM,IACYL,EAAA,KAAK,MAAQK,EAAW,KACxBL,EAAA,MAAM,MAAQK,EAAW,MACzBL,EAAA,MAAM,MAAQK,EAAW,OAGlC,CACL,aAAcL,EAAc,SAC5B,aAAcA,EAAc,KAC5B,eAAgBA,EAAc,MAC9B,eAAgBA,EAAc,KAChC,CAAA,CAIO,SAAAM,EAAaP,EAAW,GAAI,CAC5B,OAAAF,EAAiB,IAAIE,CAAQ,CAAA,CAI7B,SAAAK,EAAgBL,EAAW,GAAI,CACtCH,EAAc,OAAOG,CAAQ,EAC7BF,EAAiB,OAAOE,CAAQ,CAAA,CAIzB,SAAAQ,EAAaR,EAAW,GAAIS,EAAqB,CACxD,KAAM,CAAE,KAAAC,EAAM,MAAAC,EAAO,MAAAC,CAAU,EAAAH,EACzBR,EAAgBM,EAAaP,CAAQ,EACvCC,IACFA,EAAc,KAAK,MAAQS,EAC3BT,EAAc,MAAM,MAAQU,EAC5BV,EAAc,MAAM,MAAQW,GAE9Bf,EAAc,IAAIG,EAAU,CAAE,KAAAU,EAAM,MAAAC,EAAO,MAAAC,EAAO,CAAA,CAGpD,MAAO,CAAE,cAAAb,EAAe,aAAAS,EAAc,aAAAD,EAAc,gBAAAF,CAAgB,CACtE,CAAC"}

package/dist/types/component-neo/index.d.ts

@@ -1,48 +0,0 @@
-export declare const MtComponentNeo: {
-    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('.').ComponentNeoProps> & Readonly<{
-        onToggleComponent?: ((name?: string | undefined, ref?: any) => any) | undefined;
-    }>, {
-        componentRef: import('vue').Ref<any, any>;
-    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-        toggleComponent: (name?: string | undefined, ref?: any) => any;
-    }, import('vue').PublicProps, {
-        uniqueId: string;
-    }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
-        P: {};
-        B: {};
-        D: {};
-        C: {};
-        M: {};
-        Defaults: {};
-    }, Readonly<import('.').ComponentNeoProps> & Readonly<{
-        onToggleComponent?: ((name?: string | undefined, ref?: any) => any) | undefined;
-    }>, {
-        componentRef: import('vue').Ref<any, any>;
-    }, {}, {}, {}, {
-        uniqueId: string;
-    }>;
-    __isFragment?: never;
-    __isTeleport?: never;
-    __isSuspense?: never;
-} & import('vue').ComponentOptionsBase<Readonly<import('.').ComponentNeoProps> & Readonly<{
-    onToggleComponent?: ((name?: string | undefined, ref?: any) => any) | undefined;
-}>, {
-    componentRef: import('vue').Ref<any, any>;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    toggleComponent: (name?: string | undefined, ref?: any) => any;
-}, string, {
-    uniqueId: string;
-}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
-    $slots: {
-        default?(_: {
-            Component: import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
-                [key: string]: any;
-            }>;
-            compRef: (el: Element) => Element;
-            attrs: Record<string, unknown>;
-            compName: any;
-        }): any;
-    };
-});
-export * from './src/component-neo';
-export * from './src/hooks/use-component-neo';

package/dist/types/component-neo/src/component-neo.d.ts

@@ -1,9 +0,0 @@
-import { Component, DefineComponent, VNode } from 'vue';
-export interface ComponentNeoProps {
-    /** 唯一标识 */
-    uniqueId?: string;
-    /** 渲染的组件 */
-    is?: string | Component;
-}
-export type InstanceComponent = DefineComponent<any, any, any, any, any, any, any, any, any, any>;
-export type ComponentSlots = Record<string, (arg: any) => VNode> | VNode;

package/dist/types/component-neo/src/component-neo.vue.d.ts

@@ -1,33 +0,0 @@
-import { ComponentNeoProps } from './component-neo';
-declare function __VLS_template(): {
-    attrs: Partial<{}>;
-    slots: {
-        default?(_: {
-            Component: import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
-                [key: string]: any;
-            }>;
-            compRef: (el: Element) => Element;
-            attrs: Record<string, unknown>;
-            compName: any;
-        }): any;
-    };
-    refs: {};
-    rootEl: any;
-};
-type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<ComponentNeoProps, {
-    componentRef: import('vue').Ref<any, any>;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    toggleComponent: (name?: string | undefined, ref?: any) => any;
-}, string, import('vue').PublicProps, Readonly<ComponentNeoProps> & Readonly<{
-    onToggleComponent?: ((name?: string | undefined, ref?: any) => any) | undefined;
-}>, {
-    uniqueId: string;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/types/component-neo/src/hooks/use-component-neo.d.ts

@@ -1,8 +0,0 @@
-import { VNode } from 'vue';
-import { ComponentSlots, InstanceComponent } from '../component-neo';
-export type ImportComponentFn = () => Promise<Record<string, any>>;
-export type DynamicComponent = InstanceComponent | ImportComponentFn | VNode;
-export declare function useComponentNeo(uniqueId?: string): {
-    getComponentRef: () => any;
-    toggleComponent: (comp?: DynamicComponent, attrs?: Record<string, any>, slots?: ComponentSlots) => Promise<any>;
-};

package/dist/types/component-neo/src/hooks/use-component-state.d.ts

@@ -1,30 +0,0 @@
-import { Ref, ShallowRef, VNode } from 'vue';
-import { ComponentSlots, InstanceComponent } from '../component-neo';
-interface ComponentRefsType {
-    /** 引用实例 */
-    Instance: Ref<any>;
-    /** 组件 */
-    comp: ShallowRef<InstanceComponent | VNode | undefined>;
-    /** 属性 */
-    attrs: Ref<Record<string, unknown>>;
-    /** 插槽 */
-    slots: Ref<ComponentSlots>;
-}
-interface ComponentData {
-    comp?: InstanceComponent | VNode;
-    attrs: Record<string, unknown>;
-    slots: ComponentSlots;
-}
-/** 组件状态 */
-export declare const useComponentState: () => {
-    initComponent: (uniqueId?: string) => {
-        componentRef: Ref<any, any>;
-        componentNeo: ShallowRef<any>;
-        componentAttrs: Ref<Record<string, unknown>, Record<string, unknown>>;
-        componentSlots: Ref<ComponentSlots, ComponentSlots>;
-    };
-    setComponent: (uniqueId: string | undefined, args: ComponentData) => void;
-    getComponent: (uniqueId?: string) => ComponentRefsType | undefined;
-    removeComponent: (uniqueId?: string) => void;
-};
-export {};