@silver-formily/element-plus 2.0.1 → 2.2.0

package/esm/form-layout/form-layout.d.ts

@@ -16,7 +16,6 @@ declare const __VLS_component: import('vue').DefineComponent<IFormLayoutProps, {
     layout: "vertical" | "horizontal" | "inline" | ("vertical" | "horizontal" | "inline")[];
     colon: boolean;
     labelWrap: boolean;
-    wrapperWrap: boolean;
     fullness: boolean;
     shallow: boolean;
     statusIcon: boolean;

package/esm/form-layout/form-layout.mjs

@@ -1,80 +1,81 @@
-import { defineComponent as w, ref as l, provide as s, watch as k, createBlock as C, openBlock as v, resolveDynamicComponent as A, mergeProps as B, unref as a, withModifiers as P, withCtx as b, renderSlot as x } from "vue";
-import { isValid as f, isEmpty as F } from "@formily/shared";
-import { useForm as R } from "@silver-formily/vue";
-import { formContextKey as _ } from "element-plus";
-import { useFormDeepLayout as g, useResponsiveFormLayout as q, filterValidFormLayoutProps as o, formLayoutDeepContext as z, formLayoutShallowContext as D } from "./utils.mjs";
-import { useThrottleFn as W } from "../__builtins__/shared/hooks.mjs";
-import { useCleanAttrs as I } from "../__builtins__/shared/utils.mjs";
-import { stylePrefix as M } from "../__builtins__/configs/index.mjs";
-const G = /* @__PURE__ */ w({
+import { defineComponent as A, ref as l, computed as d, provide as e, watch as x, reactive as B, toRef as t, createBlock as P, openBlock as g, resolveDynamicComponent as I, mergeProps as b, unref as F, withModifiers as R, withCtx as _, renderSlot as q } from "vue";
+import { isValid as z, isEmpty as D } from "@formily/shared";
+import { useId as T, formContextKey as M } from "element-plus";
+import { formLayoutIdContext as S, useFormDeepLayout as W, useResponsiveFormLayout as $, filterValidFormLayoutProps as r, formLayoutDeepContext as H, formLayoutShallowContext as V } from "./utils.mjs";
+import { useThrottleFn as E } from "../__builtins__/shared/hooks.mjs";
+import { useCleanAttrs as K } from "../__builtins__/shared/utils.mjs";
+import { stylePrefix as j } from "../__builtins__/configs/index.mjs";
+const Y = /* @__PURE__ */ A({
   name: "FFormLayout",
   inheritAttrs: !1,
   __name: "form-layout",
   props: {
     tag: { default: "form" },
-    colon: { type: Boolean, default: !0 },
-    labelAlign: null,
-    wrapperAlign: null,
-    labelWrap: { type: Boolean, default: !0 },
-    labelWidth: null,
-    wrapperWidth: null,
-    wrapperWrap: { type: Boolean, default: !1 },
-    labelCol: null,
-    wrapperCol: null,
-    fullness: { type: Boolean, default: !1 },
+    colon: { type: Boolean, default: void 0 },
+    labelAlign: {},
+    wrapperAlign: {},
+    labelWrap: { type: Boolean, default: void 0 },
+    labelWidth: {},
+    wrapperWidth: {},
+    labelCol: {},
+    wrapperCol: {},
+    fullness: { type: Boolean, default: void 0 },
     size: { default: "default" },
     layout: { default: "horizontal" },
-    feedbackLayout: null,
-    tooltipLayout: null,
-    breakpoints: null,
+    feedbackLayout: {},
+    tooltipLayout: {},
+    breakpoints: {},
     shallow: { type: Boolean, default: !0 },
     hideRequiredAsterisk: { type: Boolean },
     statusIcon: { type: Boolean, default: !0 },
-    requireAsteriskPosition: null
+    requireAsteriskPosition: {}
   },
-  setup(m) {
-    const e = m, d = `${M}-form`, { props: y } = I(), i = l(), c = g(), { props: t } = q(e, i), h = l({
-      ...c.value,
-      ...e.shallow ? {
-        ...f(e.size) && { size: e.size },
-        ...f(e.colon) && { colon: e.colon }
-      } : o(e)
+  setup(c) {
+    const o = c, y = `${j}-form`, { props: s } = K(), n = l(), u = o.tag === "form", v = T(), p = d(() => s.value.id ?? `formily-${v.value}`), L = d(() => u ? p.value : s.value.id);
+    u && e(S, p);
+    const h = W(), { props: a } = $(o, n), C = l({
+      ...h.value,
+      ...o.shallow ? {
+        size: o.size,
+        ...z(o.colon) && { colon: o.colon }
+      } : r(o)
     });
-    s(z, h);
-    const n = l(e.shallow ? o(e) : {});
-    s(D, n);
-    const L = W(() => {
-      if (!F(t.value)) {
-        const r = o(t.value);
-        n.value = o({ ...e, ...r });
+    e(H, C);
+    const f = l(o.shallow ? r(o) : {});
+    e(V, f);
+    const k = E(() => {
+      if (!D(a.value)) {
+        const i = r(a.value);
+        f.value = r({ ...o, ...i });
       }
     }, 200, !0);
-    k(() => [e, t], L, {
+    x(() => [o, a], k, {
       deep: !0,
       immediate: !0
-    }), s(_, {
-      statusIcon: e.statusIcon,
-      hideRequiredAsterisk: e.hideRequiredAsterisk,
-      requireAsteriskPosition: e.requireAsteriskPosition
     });
-    const u = R();
-    return (r, p) => (v(), C(A(e.tag), B({
-      id: a(u)?.id && `formily-${a(u)?.id}`,
+    const w = B({
+      size: t(o, "size"),
+      statusIcon: t(o, "statusIcon"),
+      hideRequiredAsterisk: t(o, "hideRequiredAsterisk"),
+      requireAsteriskPosition: t(o, "requireAsteriskPosition")
+    });
+    return e(M, w), (i, m) => (g(), P(I(o.tag), b({
+      id: L.value,
       ref_key: "rootHTMLRef",
-      ref: i,
-      class: d
-    }, a(y), {
-      onSubmit: p[0] || (p[0] = P(() => {
+      ref: n,
+      class: y
+    }, F(s), {
+      onSubmit: m[0] || (m[0] = R(() => {
       }, ["prevent", "stop"]))
     }), {
-      default: b(() => [
-        x(r.$slots, "default")
+      default: _(() => [
+        q(i.$slots, "default")
       ]),
       _: 3
     }, 16, ["id"]));
   }
 });
 export {
-  G as _
+  Y as _
 };
 //# sourceMappingURL=form-layout.mjs.map

package/esm/form-layout/form-layout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"form-layout.mjs","sources":["../../src/form-layout/form-layout.vue"],"sourcesContent":["<script lang=\"ts\" setup>\r\nimport type { FormContext } from 'element-plus'\r\nimport type { IFormLayoutProps } from './types'\r\nimport { isEmpty, isValid } from '@formily/shared'\r\nimport { useForm } from '@silver-formily/vue'\r\nimport { formContextKey } from 'element-plus'\r\nimport { provide, ref, watch } from 'vue'\r\nimport { stylePrefix, useCleanAttrs, useThrottleFn } from '../__builtins__'\r\nimport { filterValidFormLayoutProps, formLayoutDeepContext, formLayoutShallowContext, useFormDeepLayout, useResponsiveFormLayout } from './utils'\r\n\r\ndefineOptions({\r\n  name: 'FFormLayout',\r\n  inheritAttrs: false,\r\n})\r\n\r\nconst props = defineProps({\n  tag: { default: 'form' },\n  colon: { type: Boolean, default: true },\n  labelAlign: null,\n  wrapperAlign: null,\n  labelWrap: { type: Boolean, default: true },\n  labelWidth: null,\n  wrapperWidth: null,\n  wrapperWrap: { type: Boolean, default: false },\n  labelCol: null,\n  wrapperCol: null,\n  fullness: { type: Boolean, default: false },\n  size: { default: 'default' },\n  layout: { default: 'horizontal' },\n  feedbackLayout: null,\n  tooltipLayout: null,\n  breakpoints: null,\n  shallow: { type: Boolean, default: true },\n  hideRequiredAsterisk: { type: Boolean },\n  statusIcon: { type: Boolean, default: true },\n  requireAsteriskPosition: null\n})\r\nconst formPrefixCls = `${stylePrefix}-form`\r\nconst { props: attrs } = useCleanAttrs()\r\nconst rootHTMLRef = ref<HTMLElement>()\r\n\r\nconst formLayoutDeepConfig = useFormDeepLayout()\r\nconst { props: responsiveProps } = useResponsiveFormLayout(props, rootHTMLRef)\r\n\r\nconst deepLayout = ref({\r\n  ...formLayoutDeepConfig.value,\r\n  ...(props.shallow\r\n    ? {\r\n        ...(isValid(props.size) && { size: props.size }),\r\n        ...(isValid(props.colon) && { colon: props.colon }),\r\n      }\r\n    : filterValidFormLayoutProps(props)),\r\n})\r\nprovide(formLayoutDeepContext, deepLayout)\r\n\r\nconst shallowLayout = ref(props.shallow ? filterValidFormLayoutProps(props) : {})\r\nprovide(formLayoutShallowContext, shallowLayout)\r\n\r\nconst updateLayout = useThrottleFn(() => {\r\n  if (!isEmpty(responsiveProps.value)) {\r\n    const _responsiveProps = filterValidFormLayoutProps(responsiveProps.value)\r\n    shallowLayout.value = filterValidFormLayoutProps({ ...props, ..._responsiveProps })\r\n  }\r\n}, 200, true)\r\n\r\nwatch(() => [props, responsiveProps], updateLayout, {\r\n  deep: true,\r\n  immediate: true,\r\n})\r\n\r\nprovide(formContextKey, {\r\n  statusIcon: props.statusIcon,\r\n  hideRequiredAsterisk: props.hideRequiredAsterisk,\r\n  requireAsteriskPosition: props.requireAsteriskPosition,\r\n} as FormContext)\r\n\r\nconst formRef = useForm()\r\n</script>\r\n\r\n<template>\r\n  <component\r\n    :is=\"props.tag\"\r\n    :id=\"formRef?.id && `formily-${formRef?.id}`\"\r\n    ref=\"rootHTMLRef\"\r\n    :class=\"formPrefixCls\"\r\n    v-bind=\"attrs\"\r\n    @submit.prevent.stop\r\n  >\r\n    <slot />\r\n  </component>\r\n</template>\r\n"],"names":["props","__props","formPrefixCls","stylePrefix","attrs","useCleanAttrs","rootHTMLRef","ref","formLayoutDeepConfig","useFormDeepLayout","responsiveProps","useResponsiveFormLayout","deepLayout","isValid","filterValidFormLayoutProps","provide","formLayoutDeepContext","shallowLayout","formLayoutShallowContext","updateLayout","useThrottleFn","isEmpty","_responsiveProps","watch","formContextKey","formRef","useForm","_openBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_unref","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,UAAMA,IAAQC,GAsBRC,IAAgB,GAAGC,CAAW,SAC9B,EAAE,OAAOC,EAAA,IAAUC,EAAA,GACnBC,IAAcC,EAAA,GAEdC,IAAuBC,EAAA,GACvB,EAAE,OAAOC,EAAA,IAAoBC,EAAwBX,GAAOM,CAAW,GAEvEM,IAAaL,EAAI;AAAA,MACrB,GAAGC,EAAqB;AAAA,MACxB,GAAIR,EAAM,UACN;AAAA,QACE,GAAIa,EAAQb,EAAM,IAAI,KAAK,EAAE,MAAMA,EAAM,KAAA;AAAA,QACzC,GAAIa,EAAQb,EAAM,KAAK,KAAK,EAAE,OAAOA,EAAM,MAAA;AAAA,MAAM,IAEnDc,EAA2Bd,CAAK;AAAA,IAAA,CACrC;AACD,IAAAe,EAAQC,GAAuBJ,CAAU;AAEzC,UAAMK,IAAgBV,EAAIP,EAAM,UAAUc,EAA2Bd,CAAK,IAAI,EAAE;AAChF,IAAAe,EAAQG,GAA0BD,CAAa;AAE/C,UAAME,IAAeC,EAAc,MAAM;AACvC,UAAI,CAACC,EAAQX,EAAgB,KAAK,GAAG;AACnC,cAAMY,IAAmBR,EAA2BJ,EAAgB,KAAK;AACzE,QAAAO,EAAc,QAAQH,EAA2B,EAAE,GAAGd,GAAO,GAAGsB,GAAkB;AAAA,MACpF;AAAA,IACF,GAAG,KAAK,EAAI;AAEZ,IAAAC,EAAM,MAAM,CAACvB,GAAOU,CAAe,GAAGS,GAAc;AAAA,MAClD,MAAM;AAAA,MACN,WAAW;AAAA,IAAA,CACZ,GAEDJ,EAAQS,GAAgB;AAAA,MACtB,YAAYxB,EAAM;AAAA,MAClB,sBAAsBA,EAAM;AAAA,MAC5B,yBAAyBA,EAAM;AAAA,IAAA,CACjB;AAEhB,UAAMyB,IAAUC,EAAA;sBAIdC,KAAAC,EASYC,EARL7B,EAAM,GAAG,GADhB8B,EASY;AAAA,MAPT,IAAIC,EAAAN,CAAA,GAAS,MAAE,WAAeM,EAAAN,CAAA,GAAS,EAAE;AAAA,eACtC;AAAA,MAAJ,KAAInB;AAAA,MACH,OAAOJ;AAAA,IAAA,GACA6B,EAAA3B,CAAA,GAAK;AAAA,MACZ,4BAAD,MAAA;AAAA,MAAA,GAAoB,CAAA,WAAA,MAAA,CAAA;AAAA,IAAA;iBAEpB,MAAQ;AAAA,QAAR4B,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;"}
+{"version":3,"file":"form-layout.mjs","sources":["../../src/form-layout/form-layout.vue"],"sourcesContent":["<script lang=\"ts\" setup>\r\nimport type { FormContext } from 'element-plus'\r\nimport type { IFormLayoutProps } from './types'\r\nimport { isEmpty, isValid } from '@formily/shared'\r\nimport { formContextKey, useId } from 'element-plus'\r\nimport { computed, provide, reactive, ref, toRef, watch } from 'vue'\r\nimport { stylePrefix, useCleanAttrs, useThrottleFn } from '../__builtins__'\r\nimport { filterValidFormLayoutProps, formLayoutDeepContext, formLayoutIdContext, formLayoutShallowContext, useFormDeepLayout, useResponsiveFormLayout } from './utils'\r\n\r\ndefineOptions({\r\n  name: 'FFormLayout',\r\n  inheritAttrs: false,\r\n})\r\n\r\nconst props = withDefaults(defineProps<IFormLayoutProps>(), {\r\n  tag: 'form',\r\n  colon: undefined,\r\n  labelWrap: undefined,\r\n  fullness: undefined,\r\n  size: 'default',\r\n  layout: 'horizontal',\r\n  shallow: true,\r\n  statusIcon: true,\r\n  asterisk: undefined,\r\n})\r\nconst formPrefixCls = `${stylePrefix}-form`\r\nconst { props: attrs } = useCleanAttrs()\r\nconst rootHTMLRef = ref<HTMLElement>()\r\nconst isFormTag = props.tag === 'form'\r\nconst formLayoutBaseId = useId()\r\nconst formLayoutId = computed(() => attrs.value.id ?? `formily-${formLayoutBaseId.value}`)\r\nconst formLayoutDomId = computed(() => (isFormTag ? formLayoutId.value : attrs.value.id))\r\nif (isFormTag) {\r\n  provide(formLayoutIdContext, formLayoutId)\r\n}\r\n\r\nconst formLayoutDeepConfig = useFormDeepLayout()\r\nconst { props: responsiveProps } = useResponsiveFormLayout(props, rootHTMLRef)\r\n\r\nconst deepLayout = ref({\r\n  ...formLayoutDeepConfig.value,\r\n  ...(props.shallow\r\n    ? {\r\n        size: props.size,\r\n        ...(isValid(props.colon) && { colon: props.colon }),\r\n      }\r\n    : filterValidFormLayoutProps(props)),\r\n})\r\nprovide(formLayoutDeepContext, deepLayout)\r\n\r\nconst shallowLayout = ref(props.shallow ? filterValidFormLayoutProps(props) : {})\r\nprovide(formLayoutShallowContext, shallowLayout)\r\n\r\nconst updateLayout = useThrottleFn(() => {\r\n  if (!isEmpty(responsiveProps.value)) {\r\n    const _responsiveProps = filterValidFormLayoutProps(responsiveProps.value)\r\n    shallowLayout.value = filterValidFormLayoutProps({ ...props, ..._responsiveProps })\r\n  }\r\n}, 200, true)\r\n\r\nwatch(() => [props, responsiveProps], updateLayout, {\r\n  deep: true,\r\n  immediate: true,\r\n})\r\n\r\nconst formContext = reactive({\r\n  size: toRef(props, 'size'),\r\n  statusIcon: toRef(props, 'statusIcon'),\r\n  hideRequiredAsterisk: toRef(props, 'hideRequiredAsterisk'),\r\n  requireAsteriskPosition: toRef(props, 'requireAsteriskPosition'),\r\n})\r\nprovide(formContextKey, formContext as FormContext)\r\n</script>\r\n\r\n<template>\r\n  <component\r\n    :is=\"props.tag\"\r\n    :id=\"formLayoutDomId\"\r\n    ref=\"rootHTMLRef\"\r\n    :class=\"formPrefixCls\"\r\n    v-bind=\"attrs\"\r\n    @submit.prevent.stop\r\n  >\r\n    <slot />\r\n  </component>\r\n</template>\r\n"],"names":["props","__props","formPrefixCls","stylePrefix","attrs","useCleanAttrs","rootHTMLRef","ref","isFormTag","formLayoutBaseId","useId","formLayoutId","computed","formLayoutDomId","provide","formLayoutIdContext","formLayoutDeepConfig","useFormDeepLayout","responsiveProps","useResponsiveFormLayout","deepLayout","isValid","filterValidFormLayoutProps","formLayoutDeepContext","shallowLayout","formLayoutShallowContext","updateLayout","useThrottleFn","isEmpty","_responsiveProps","watch","formContext","reactive","toRef","formContextKey","_openBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_unref","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,UAAMA,IAAQC,GAWRC,IAAgB,GAAGC,CAAW,SAC9B,EAAE,OAAOC,EAAA,IAAUC,EAAA,GACnBC,IAAcC,EAAA,GACdC,IAAYR,EAAM,QAAQ,QAC1BS,IAAmBC,EAAA,GACnBC,IAAeC,EAAS,MAAMR,EAAM,MAAM,MAAM,WAAWK,EAAiB,KAAK,EAAE,GACnFI,IAAkBD,EAAS,MAAOJ,IAAYG,EAAa,QAAQP,EAAM,MAAM,EAAG;AACxF,IAAII,KACFM,EAAQC,GAAqBJ,CAAY;AAG3C,UAAMK,IAAuBC,EAAA,GACvB,EAAE,OAAOC,EAAA,IAAoBC,EAAwBnB,GAAOM,CAAW,GAEvEc,IAAab,EAAI;AAAA,MACrB,GAAGS,EAAqB;AAAA,MACxB,GAAIhB,EAAM,UACN;AAAA,QACE,MAAMA,EAAM;AAAA,QACZ,GAAIqB,EAAQrB,EAAM,KAAK,KAAK,EAAE,OAAOA,EAAM,MAAA;AAAA,MAAM,IAEnDsB,EAA2BtB,CAAK;AAAA,IAAA,CACrC;AACD,IAAAc,EAAQS,GAAuBH,CAAU;AAEzC,UAAMI,IAAgBjB,EAAIP,EAAM,UAAUsB,EAA2BtB,CAAK,IAAI,EAAE;AAChF,IAAAc,EAAQW,GAA0BD,CAAa;AAE/C,UAAME,IAAeC,EAAc,MAAM;AACvC,UAAI,CAACC,EAAQV,EAAgB,KAAK,GAAG;AACnC,cAAMW,IAAmBP,EAA2BJ,EAAgB,KAAK;AACzE,QAAAM,EAAc,QAAQF,EAA2B,EAAE,GAAGtB,GAAO,GAAG6B,GAAkB;AAAA,MACpF;AAAA,IACF,GAAG,KAAK,EAAI;AAEZ,IAAAC,EAAM,MAAM,CAAC9B,GAAOkB,CAAe,GAAGQ,GAAc;AAAA,MAClD,MAAM;AAAA,MACN,WAAW;AAAA,IAAA,CACZ;AAED,UAAMK,IAAcC,EAAS;AAAA,MAC3B,MAAMC,EAAMjC,GAAO,MAAM;AAAA,MACzB,YAAYiC,EAAMjC,GAAO,YAAY;AAAA,MACrC,sBAAsBiC,EAAMjC,GAAO,sBAAsB;AAAA,MACzD,yBAAyBiC,EAAMjC,GAAO,yBAAyB;AAAA,IAAA,CAChE;AACD,WAAAc,EAAQoB,GAAgBH,CAA0B,cAIhDI,KAAAC,EASYC,EARLrC,EAAM,GAAG,GADhBsC,EASY;AAAA,MAPT,IAAIzB,EAAA;AAAA,eACD;AAAA,MAAJ,KAAIP;AAAA,MACH,OAAOJ;AAAA,IAAA,GACAqC,EAAAnC,CAAA,GAAK;AAAA,MACZ,4BAAD,MAAA;AAAA,MAAA,GAAoB,CAAA,WAAA,MAAA,CAAA;AAAA,IAAA;iBAEpB,MAAQ;AAAA,QAARoC,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;"}

package/esm/form-layout/types.d.ts

@@ -6,7 +6,6 @@ export interface IFormLayoutProps {
     labelWrap?: boolean;
     labelWidth?: number;
     wrapperWidth?: number;
-    wrapperWrap?: boolean;
     labelCol?: number | number[];
     wrapperCol?: number | number[];
     fullness?: boolean;
@@ -27,7 +26,6 @@ export interface ICalculatedFormLayoutProps {
     labelWrap?: boolean;
     labelWidth?: number | string;
     wrapperWidth?: number | string;
-    wrapperWrap?: boolean;
     labelCol?: number;
     wrapperCol?: number;
     fullness?: boolean;

package/esm/form-layout/utils.d.ts

@@ -1,4 +1,4 @@
-import { InjectionKey, Ref } from 'vue';
+import { ComputedRef, InjectionKey, Ref } from 'vue';
 import { IFormLayoutProps } from './types';
 export declare function calcBreakpointIndex(breakpoints: number[], width: number): number;
 export declare function calcFactor<T>(value: T | readonly T[], breakpointIndex: number): T;
@@ -13,7 +13,6 @@ export declare function useResponsiveFormLayout(props: IFormLayoutProps, root: R
         labelWrap?: boolean;
         labelWidth?: number;
         wrapperWidth?: number;
-        wrapperWrap?: boolean;
         labelCol?: number | number[];
         wrapperCol?: number | number[];
         fullness?: boolean;
@@ -34,7 +33,6 @@ export declare function useResponsiveFormLayout(props: IFormLayoutProps, root: R
         labelWrap?: boolean;
         labelWidth?: number;
         wrapperWidth?: number;
-        wrapperWrap?: boolean;
         labelCol?: number | number[];
         wrapperCol?: number | number[];
         fullness?: boolean;
@@ -51,7 +49,9 @@ export declare function useResponsiveFormLayout(props: IFormLayoutProps, root: R
 };
 export declare const formLayoutDeepContext: InjectionKey<Ref<IFormLayoutProps>>;
 export declare const formLayoutShallowContext: InjectionKey<Ref<IFormLayoutProps>>;
+export declare const formLayoutIdContext: InjectionKey<ComputedRef<string>>;
 export declare function useFormDeepLayout(): Ref<IFormLayoutProps>;
 export declare function useFormLayout(): Ref<IFormLayoutProps>;
+export declare function useFormLayoutId(): ComputedRef<string>;
 export declare const FORM_LAYOUT_PROPS_KEYS: ReadonlyArray<keyof IFormLayoutProps>;
 export declare function filterValidFormLayoutProps(props: IFormLayoutProps): IFormLayoutProps;

package/esm/form-layout/utils.mjs

@@ -1,77 +1,79 @@
-import { isArr as L, isValid as u } from "@formily/shared";
-import { inject as i, ref as l, computed as d } from "vue";
+import { isArr as d, isValid as u } from "@formily/shared";
+import { inject as l, ref as i, computed as s } from "vue";
 import { useResizeObserver as h } from "../__builtins__/shared/hooks.mjs";
-function w(t, o) {
+function A(t, o) {
   for (const [r, e] of t.entries())
     if (o <= e)
       return r;
   return -1;
 }
-function A(t, o) {
+function C(t, o) {
   if (!Array.isArray(t) || t.length === 0)
     return t;
   const r = Math.max(-1, Math.min(o, t.length - 1));
   return t.at(r);
 }
 function a(t, o) {
-  return u(t) ? A(t, o) : t;
+  return u(t) ? C(t, o) : t;
 }
-function C(t, o) {
+function x(t, o) {
   const { clientWidth: r } = t, {
     breakpoints: e,
     layout: p,
-    labelAlign: c,
-    wrapperAlign: f,
-    labelCol: m,
-    wrapperCol: y,
-    ...b
-  } = o, n = w(
+    labelAlign: f,
+    wrapperAlign: m,
+    labelCol: y,
+    wrapperCol: b,
+    ...L
+  } = o, n = A(
     e,
     r
   );
   return {
     layout: a(p, n),
-    labelAlign: a(c, n),
-    wrapperAlign: a(f, n),
-    labelCol: a(m, n),
-    wrapperCol: a(y, n),
-    ...b
+    labelAlign: a(f, n),
+    wrapperAlign: a(m, n),
+    labelCol: a(y, n),
+    wrapperCol: a(b, n),
+    ...L
   };
 }
-function O(t, o) {
+function P(t, o) {
   const { breakpoints: r } = t;
-  if (!L(r))
+  if (!d(r))
     return {
-      props: l(t)
+      props: i(t)
     };
-  const e = l({});
+  const e = i({});
   return h(o, () => {
-    e.value = C(o.value, t);
+    e.value = x(o.value, t);
   }), {
     props: e
   };
 }
-const s = Symbol(
+const c = Symbol(
   "formLayoutDeepContext"
-), x = Symbol("formLayoutShallowContext");
-function P() {
-  return i(s, l({}));
-}
+), w = Symbol("formLayoutShallowContext"), k = Symbol("formLayoutIdContext");
 function S() {
-  const t = i(x, l({})), o = i(s, l({}));
-  return d(() => ({
+  return l(c, i({}));
+}
+function O() {
+  const t = l(w, i({})), o = l(c, i({}));
+  return s(() => ({
     ...o.value,
     ...t.value
   }));
 }
-const R = [
+function R() {
+  return l(k, s(() => ""));
+}
+const W = [
   "colon",
   "labelAlign",
   "wrapperAlign",
   "labelWrap",
   "labelWidth",
   "wrapperWidth",
-  "wrapperWrap",
   "labelCol",
   "wrapperCol",
   "fullness",
@@ -81,24 +83,27 @@ const R = [
   "tooltipLayout",
   "breakpoints",
   "hideRequiredAsterisk",
-  "statusIcon"
+  "statusIcon",
+  "requireAsteriskPosition"
 ];
-function W(t) {
+function _(t) {
   return Object.fromEntries(
     Object.entries(t).filter(([o, r]) => u(r))
   );
 }
 export {
-  R as FORM_LAYOUT_PROPS_KEYS,
-  w as calcBreakpointIndex,
-  A as calcFactor,
-  C as calculateProps,
+  W as FORM_LAYOUT_PROPS_KEYS,
+  A as calcBreakpointIndex,
+  C as calcFactor,
+  x as calculateProps,
   a as factor,
-  W as filterValidFormLayoutProps,
-  s as formLayoutDeepContext,
-  x as formLayoutShallowContext,
-  P as useFormDeepLayout,
-  S as useFormLayout,
-  O as useResponsiveFormLayout
+  _ as filterValidFormLayoutProps,
+  c as formLayoutDeepContext,
+  k as formLayoutIdContext,
+  w as formLayoutShallowContext,
+  S as useFormDeepLayout,
+  O as useFormLayout,
+  R as useFormLayoutId,
+  P as useResponsiveFormLayout
 };
 //# sourceMappingURL=utils.mjs.map

package/esm/form-layout/utils.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.mjs","sources":["../../src/form-layout/utils.ts"],"sourcesContent":["import type { InjectionKey, Ref } from 'vue'\r\nimport type { IFormLayoutProps } from './types'\r\nimport { isArr, isValid } from '@formily/shared'\r\nimport { computed, inject, ref } from 'vue'\r\nimport { useResizeObserver } from '../__builtins__'\r\n\r\nexport function calcBreakpointIndex(breakpoints: number[], width: number): number {\r\n  for (const [i, breakpoint] of breakpoints.entries()) {\r\n    if (width <= breakpoint) {\r\n      return i\r\n    }\r\n  }\r\n  return -1\r\n}\r\n\r\nexport function calcFactor<T>(value: T | readonly T[], breakpointIndex: number): T {\r\n  if (!Array.isArray(value) || value.length === 0) {\r\n    return value as T\r\n  }\r\n  const safeIndex = Math.max(-1, Math.min(breakpointIndex, value.length - 1))\r\n  return value.at(safeIndex)\r\n}\r\n\r\nexport function factor<T>(value: T | T[], breakpointIndex: number): T {\r\n  return isValid(value) ? calcFactor<T>(value, breakpointIndex) : value as T\r\n}\r\n\r\nexport function calculateProps(target: Element, props: IFormLayoutProps): IFormLayoutProps {\r\n  const { clientWidth } = target\r\n  const {\r\n    breakpoints,\r\n    layout,\r\n    labelAlign,\r\n    wrapperAlign,\r\n    labelCol,\r\n    wrapperCol,\r\n    ...otherProps\r\n  } = props\r\n  const breakpointIndex = calcBreakpointIndex(\r\n    breakpoints as number[],\r\n    clientWidth,\r\n  )\r\n\r\n  return {\r\n    layout: factor(layout, breakpointIndex),\r\n    labelAlign: factor(labelAlign, breakpointIndex),\r\n    wrapperAlign: factor(wrapperAlign, breakpointIndex),\r\n    labelCol: factor(labelCol, breakpointIndex),\r\n    wrapperCol: factor(wrapperCol, breakpointIndex),\r\n    ...otherProps,\r\n  }\r\n}\r\n\r\nexport function useResponsiveFormLayout(props: IFormLayoutProps, root: Ref<HTMLElement | null>) {\r\n  const { breakpoints } = props\r\n  if (!isArr(breakpoints)) {\r\n    return {\r\n      props: ref(props),\r\n    }\r\n  }\r\n\r\n  const layoutProps = ref<IFormLayoutProps>({})\r\n\r\n  useResizeObserver(root, () => {\r\n    layoutProps.value = calculateProps(root.value, props)\r\n  })\r\n\r\n  return {\r\n    props: layoutProps,\r\n  }\r\n}\r\n\r\nexport const formLayoutDeepContext: InjectionKey<Ref<IFormLayoutProps>> = Symbol(\r\n  'formLayoutDeepContext',\r\n)\r\n\r\nexport const formLayoutShallowContext: InjectionKey<Ref<IFormLayoutProps>>\r\n  = Symbol('formLayoutShallowContext')\r\n\r\nexport function useFormDeepLayout(): Ref<IFormLayoutProps> {\r\n  return inject(formLayoutDeepContext, ref({}))\r\n}\r\n\r\nexport function useFormLayout(): Ref<IFormLayoutProps> {\r\n  const shallowLayout = inject(formLayoutShallowContext, ref({}))\r\n  const deepLayout = inject(formLayoutDeepContext, ref({}))\r\n\r\n  const formLayout = computed(() => {\r\n    return {\r\n      ...deepLayout.value,\r\n      ...shallowLayout.value,\r\n    }\r\n  })\r\n\r\n  return formLayout\r\n}\r\n\r\nexport const FORM_LAYOUT_PROPS_KEYS: ReadonlyArray<keyof IFormLayoutProps> = [\r\n  'colon',\r\n  'labelAlign',\r\n  'wrapperAlign',\r\n  'labelWrap',\r\n  'labelWidth',\r\n  'wrapperWidth',\r\n  'wrapperWrap',\r\n  'labelCol',\r\n  'wrapperCol',\r\n  'fullness',\r\n  'size',\r\n  'layout',\r\n  'feedbackLayout',\r\n  'tooltipLayout',\r\n  'breakpoints',\r\n  'hideRequiredAsterisk',\r\n  'statusIcon',\r\n] as const\r\n\r\nexport function filterValidFormLayoutProps(props: IFormLayoutProps): IFormLayoutProps {\r\n  return Object.fromEntries(\r\n    Object.entries(props)\r\n      .filter(([_, value]) => isValid(value)),\r\n  )\r\n}\r\n"],"names":["calcBreakpointIndex","breakpoints","width","i","breakpoint","calcFactor","value","breakpointIndex","safeIndex","factor","isValid","calculateProps","target","props","clientWidth","layout","labelAlign","wrapperAlign","labelCol","wrapperCol","otherProps","useResponsiveFormLayout","root","isArr","ref","layoutProps","useResizeObserver","formLayoutDeepContext","formLayoutShallowContext","useFormDeepLayout","inject","useFormLayout","shallowLayout","deepLayout","computed","FORM_LAYOUT_PROPS_KEYS","filterValidFormLayoutProps","_"],"mappings":";;;AAMO,SAASA,EAAoBC,GAAuBC,GAAuB;AAChF,aAAW,CAACC,GAAGC,CAAU,KAAKH,EAAY;AACxC,QAAIC,KAASE;AACX,aAAOD;AAGX,SAAO;AACT;AAEO,SAASE,EAAcC,GAAyBC,GAA4B;AACjF,MAAI,CAAC,MAAM,QAAQD,CAAK,KAAKA,EAAM,WAAW;AAC5C,WAAOA;AAET,QAAME,IAAY,KAAK,IAAI,IAAI,KAAK,IAAID,GAAiBD,EAAM,SAAS,CAAC,CAAC;AAC1E,SAAOA,EAAM,GAAGE,CAAS;AAC3B;AAEO,SAASC,EAAUH,GAAgBC,GAA4B;AACpE,SAAOG,EAAQJ,CAAK,IAAID,EAAcC,GAAOC,CAAe,IAAID;AAClE;AAEO,SAASK,EAAeC,GAAiBC,GAA2C;AACzF,QAAM,EAAE,aAAAC,MAAgBF,GAClB;AAAA,IACJ,aAAAX;AAAA,IACA,QAAAc;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDP,GACEN,IAAkBP;AAAA,IACtBC;AAAA,IACAa;AAAA,EAAA;AAGF,SAAO;AAAA,IACL,QAAQL,EAAOM,GAAQR,CAAe;AAAA,IACtC,YAAYE,EAAOO,GAAYT,CAAe;AAAA,IAC9C,cAAcE,EAAOQ,GAAcV,CAAe;AAAA,IAClD,UAAUE,EAAOS,GAAUX,CAAe;AAAA,IAC1C,YAAYE,EAAOU,GAAYZ,CAAe;AAAA,IAC9C,GAAGa;AAAA,EAAA;AAEP;AAEO,SAASC,EAAwBR,GAAyBS,GAA+B;AAC9F,QAAM,EAAE,aAAArB,MAAgBY;AACxB,MAAI,CAACU,EAAMtB,CAAW;AACpB,WAAO;AAAA,MACL,OAAOuB,EAAIX,CAAK;AAAA,IAAA;AAIpB,QAAMY,IAAcD,EAAsB,EAAE;AAE5C,SAAAE,EAAkBJ,GAAM,MAAM;AAC5B,IAAAG,EAAY,QAAQd,EAAeW,EAAK,OAAOT,CAAK;AAAA,EACtD,CAAC,GAEM;AAAA,IACL,OAAOY;AAAA,EAAA;AAEX;AAEO,MAAME,IAA6D;AAAA,EACxE;AACF,GAEaC,IACT,OAAO,0BAA0B;AAE9B,SAASC,IAA2C;AACzD,SAAOC,EAAOH,GAAuBH,EAAI,CAAA,CAAE,CAAC;AAC9C;AAEO,SAASO,IAAuC;AACrD,QAAMC,IAAgBF,EAAOF,GAA0BJ,EAAI,CAAA,CAAE,CAAC,GACxDS,IAAaH,EAAOH,GAAuBH,EAAI,CAAA,CAAE,CAAC;AASxD,SAPmBU,EAAS,OACnB;AAAA,IACL,GAAGD,EAAW;AAAA,IACd,GAAGD,EAAc;AAAA,EAAA,EAEpB;AAGH;AAEO,MAAMG,IAAgE;AAAA,EAC3E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,SAASC,EAA2BvB,GAA2C;AACpF,SAAO,OAAO;AAAA,IACZ,OAAO,QAAQA,CAAK,EACjB,OAAO,CAAC,CAACwB,GAAG/B,CAAK,MAAMI,EAAQJ,CAAK,CAAC;AAAA,EAAA;AAE5C;"}
+{"version":3,"file":"utils.mjs","sources":["../../src/form-layout/utils.ts"],"sourcesContent":["import type { ComputedRef, InjectionKey, Ref } from 'vue'\r\nimport type { IFormLayoutProps } from './types'\r\nimport { isArr, isValid } from '@formily/shared'\r\nimport { computed, inject, ref } from 'vue'\r\nimport { useResizeObserver } from '../__builtins__'\r\n\r\nexport function calcBreakpointIndex(breakpoints: number[], width: number): number {\r\n  for (const [i, breakpoint] of breakpoints.entries()) {\r\n    if (width <= breakpoint) {\r\n      return i\r\n    }\r\n  }\r\n  return -1\r\n}\r\n\r\nexport function calcFactor<T>(value: T | readonly T[], breakpointIndex: number): T {\r\n  if (!Array.isArray(value) || value.length === 0) {\r\n    return value as T\r\n  }\r\n  const safeIndex = Math.max(-1, Math.min(breakpointIndex, value.length - 1))\r\n  return value.at(safeIndex)\r\n}\r\n\r\nexport function factor<T>(value: T | T[], breakpointIndex: number): T {\r\n  return isValid(value) ? calcFactor<T>(value, breakpointIndex) : value as T\r\n}\r\n\r\nexport function calculateProps(target: Element, props: IFormLayoutProps): IFormLayoutProps {\r\n  const { clientWidth } = target\r\n  const {\r\n    breakpoints,\r\n    layout,\r\n    labelAlign,\r\n    wrapperAlign,\r\n    labelCol,\r\n    wrapperCol,\r\n    ...otherProps\r\n  } = props\r\n  const breakpointIndex = calcBreakpointIndex(\r\n    breakpoints as number[],\r\n    clientWidth,\r\n  )\r\n\r\n  return {\r\n    layout: factor(layout, breakpointIndex),\r\n    labelAlign: factor(labelAlign, breakpointIndex),\r\n    wrapperAlign: factor(wrapperAlign, breakpointIndex),\r\n    labelCol: factor(labelCol, breakpointIndex),\r\n    wrapperCol: factor(wrapperCol, breakpointIndex),\r\n    ...otherProps,\r\n  }\r\n}\r\n\r\nexport function useResponsiveFormLayout(props: IFormLayoutProps, root: Ref<HTMLElement | null>) {\r\n  const { breakpoints } = props\r\n  if (!isArr(breakpoints)) {\r\n    return {\r\n      props: ref(props),\r\n    }\r\n  }\r\n\r\n  const layoutProps = ref<IFormLayoutProps>({})\r\n\r\n  useResizeObserver(root, () => {\r\n    layoutProps.value = calculateProps(root.value, props)\r\n  })\r\n\r\n  return {\r\n    props: layoutProps,\r\n  }\r\n}\r\n\r\nexport const formLayoutDeepContext: InjectionKey<Ref<IFormLayoutProps>> = Symbol(\r\n  'formLayoutDeepContext',\r\n)\r\n\r\nexport const formLayoutShallowContext: InjectionKey<Ref<IFormLayoutProps>>\r\n  = Symbol('formLayoutShallowContext')\r\n\r\nexport const formLayoutIdContext: InjectionKey<ComputedRef<string>>\r\n  = Symbol('formLayoutIdContext')\r\n\r\nexport function useFormDeepLayout(): Ref<IFormLayoutProps> {\r\n  return inject(formLayoutDeepContext, ref({}))\r\n}\r\n\r\nexport function useFormLayout(): Ref<IFormLayoutProps> {\r\n  const shallowLayout = inject(formLayoutShallowContext, ref({}))\r\n  const deepLayout = inject(formLayoutDeepContext, ref({}))\r\n\r\n  const formLayout = computed(() => {\r\n    return {\r\n      ...deepLayout.value,\r\n      ...shallowLayout.value,\r\n    }\r\n  })\r\n\r\n  return formLayout\r\n}\r\n\r\nexport function useFormLayoutId(): ComputedRef<string> {\r\n  return inject(formLayoutIdContext, computed(() => ''))\r\n}\r\n\r\nexport const FORM_LAYOUT_PROPS_KEYS: ReadonlyArray<keyof IFormLayoutProps> = [\r\n  'colon',\r\n  'labelAlign',\r\n  'wrapperAlign',\r\n  'labelWrap',\r\n  'labelWidth',\r\n  'wrapperWidth',\r\n  'labelCol',\r\n  'wrapperCol',\r\n  'fullness',\r\n  'size',\r\n  'layout',\r\n  'feedbackLayout',\r\n  'tooltipLayout',\r\n  'breakpoints',\r\n  'hideRequiredAsterisk',\r\n  'statusIcon',\r\n  'requireAsteriskPosition',\r\n] as const\r\n\r\nexport function filterValidFormLayoutProps(props: IFormLayoutProps): IFormLayoutProps {\r\n  return Object.fromEntries(\r\n    Object.entries(props)\r\n      .filter(([_, value]) => isValid(value)),\r\n  )\r\n}\r\n"],"names":["calcBreakpointIndex","breakpoints","width","i","breakpoint","calcFactor","value","breakpointIndex","safeIndex","factor","isValid","calculateProps","target","props","clientWidth","layout","labelAlign","wrapperAlign","labelCol","wrapperCol","otherProps","useResponsiveFormLayout","root","isArr","ref","layoutProps","useResizeObserver","formLayoutDeepContext","formLayoutShallowContext","formLayoutIdContext","useFormDeepLayout","inject","useFormLayout","shallowLayout","deepLayout","computed","useFormLayoutId","FORM_LAYOUT_PROPS_KEYS","filterValidFormLayoutProps","_"],"mappings":";;;AAMO,SAASA,EAAoBC,GAAuBC,GAAuB;AAChF,aAAW,CAACC,GAAGC,CAAU,KAAKH,EAAY;AACxC,QAAIC,KAASE;AACX,aAAOD;AAGX,SAAO;AACT;AAEO,SAASE,EAAcC,GAAyBC,GAA4B;AACjF,MAAI,CAAC,MAAM,QAAQD,CAAK,KAAKA,EAAM,WAAW;AAC5C,WAAOA;AAET,QAAME,IAAY,KAAK,IAAI,IAAI,KAAK,IAAID,GAAiBD,EAAM,SAAS,CAAC,CAAC;AAC1E,SAAOA,EAAM,GAAGE,CAAS;AAC3B;AAEO,SAASC,EAAUH,GAAgBC,GAA4B;AACpE,SAAOG,EAAQJ,CAAK,IAAID,EAAcC,GAAOC,CAAe,IAAID;AAClE;AAEO,SAASK,EAAeC,GAAiBC,GAA2C;AACzF,QAAM,EAAE,aAAAC,MAAgBF,GAClB;AAAA,IACJ,aAAAX;AAAA,IACA,QAAAc;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDP,GACEN,IAAkBP;AAAA,IACtBC;AAAA,IACAa;AAAA,EAAA;AAGF,SAAO;AAAA,IACL,QAAQL,EAAOM,GAAQR,CAAe;AAAA,IACtC,YAAYE,EAAOO,GAAYT,CAAe;AAAA,IAC9C,cAAcE,EAAOQ,GAAcV,CAAe;AAAA,IAClD,UAAUE,EAAOS,GAAUX,CAAe;AAAA,IAC1C,YAAYE,EAAOU,GAAYZ,CAAe;AAAA,IAC9C,GAAGa;AAAA,EAAA;AAEP;AAEO,SAASC,EAAwBR,GAAyBS,GAA+B;AAC9F,QAAM,EAAE,aAAArB,MAAgBY;AACxB,MAAI,CAACU,EAAMtB,CAAW;AACpB,WAAO;AAAA,MACL,OAAOuB,EAAIX,CAAK;AAAA,IAAA;AAIpB,QAAMY,IAAcD,EAAsB,EAAE;AAE5C,SAAAE,EAAkBJ,GAAM,MAAM;AAC5B,IAAAG,EAAY,QAAQd,EAAeW,EAAK,OAAOT,CAAK;AAAA,EACtD,CAAC,GAEM;AAAA,IACL,OAAOY;AAAA,EAAA;AAEX;AAEO,MAAME,IAA6D;AAAA,EACxE;AACF,GAEaC,IACT,OAAO,0BAA0B,GAExBC,IACT,OAAO,qBAAqB;AAEzB,SAASC,IAA2C;AACzD,SAAOC,EAAOJ,GAAuBH,EAAI,CAAA,CAAE,CAAC;AAC9C;AAEO,SAASQ,IAAuC;AACrD,QAAMC,IAAgBF,EAAOH,GAA0BJ,EAAI,CAAA,CAAE,CAAC,GACxDU,IAAaH,EAAOJ,GAAuBH,EAAI,CAAA,CAAE,CAAC;AASxD,SAPmBW,EAAS,OACnB;AAAA,IACL,GAAGD,EAAW;AAAA,IACd,GAAGD,EAAc;AAAA,EAAA,EAEpB;AAGH;AAEO,SAASG,IAAuC;AACrD,SAAOL,EAAOF,GAAqBM,EAAS,MAAM,EAAE,CAAC;AACvD;AAEO,MAAME,IAAgE;AAAA,EAC3E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEO,SAASC,EAA2BzB,GAA2C;AACpF,SAAO,OAAO;AAAA,IACZ,OAAO,QAAQA,CAAK,EACjB,OAAO,CAAC,CAAC0B,GAAGjC,CAAK,MAAMI,EAAQJ,CAAK,CAAC;AAAA,EAAA;AAE5C;"}

package/esm/form-step/index.mjs

@@ -1,44 +1,46 @@
-import { observer as g } from "@formily/reactive-vue";
-import { defineComponent as $, renderSlot as P, computed as B, createElementBlock as o, openBlock as r, normalizeClass as E, createVNode as N, unref as t, mergeProps as h, withCtx as u, Fragment as c, renderList as x, createBlock as m, createSlots as V, resolveDynamicComponent as _, createTextVNode as v, toDisplayString as y, createCommentVNode as b } from "vue";
+import { defineComponent as $, renderSlot as g, computed as P, createElementBlock as o, openBlock as r, normalizeClass as B, createVNode as E, unref as t, mergeProps as h, withCtx as u, Fragment as c, renderList as x, createBlock as m, createSlots as N, resolveDynamicComponent as _, createTextVNode as v, toDisplayString as y, createCommentVNode as O } from "vue";
 import { isObj as k } from "@formily/shared";
-import { useField as A, useFieldSchema as D, RecursionField as O } from "@silver-formily/vue";
+import { useObserver as V } from "@silver-formily/reactive-vue";
+import { useField as b, useFieldSchema as A, RecursionField as D } from "@silver-formily/vue";
 import { ElSteps as R, ElStep as j } from "element-plus";
-import { createFormStep as S, parseSteps as w } from "./utils.mjs";
+import { createFormStep as C, parseSteps as w } from "./utils.mjs";
 import { stylePrefix as z } from "../__builtins__/configs/index.mjs";
-import { composeExport as I } from "../__builtins__/shared/utils.mjs";
-const L = $({
+import { composeExport as L } from "../__builtins__/shared/utils.mjs";
+const T = $({
   name: "FFormStepPane",
   inheritAttrs: !1
-}), T = (n, i) => {
+}), q = (n, i) => {
   const a = n.__vccOpts || n;
   for (const [s, p] of i)
     a[s] = p;
   return a;
 };
-function q(n, i, a, s, p, f) {
-  return P(n.$slots, "default");
+function G(n, i, a, s, p, f) {
+  return g(n.$slots, "default");
 }
-const G = /* @__PURE__ */ T(L, [["render", q]]), H = /* @__PURE__ */ $({
+const H = /* @__PURE__ */ q(T, [["render", G]]), I = /* @__PURE__ */ $({
   name: "FFormStep",
   inheritAttrs: !1,
   __name: "form-step",
   props: {
-    formStep: { default: () => S() },
-    active: null
+    formStep: { default: () => C() },
+    active: {}
   },
   setup(n) {
-    const i = n, a = A().value, s = `${z}-form-step`, p = D(), f = w(p.value);
+    const i = n;
+    V();
+    const a = b().value, s = `${z}-form-step`, p = A(), f = w(p.value);
     i.formStep.connect?.(f, a);
-    const F = B(() => i.active ?? i.formStep?.current ?? 0);
-    return (C, K) => (r(), o("div", {
-      class: E(s)
+    const F = P(() => i.active ?? i.formStep?.current ?? 0);
+    return (S, J) => (r(), o("div", {
+      class: B(s)
     }, [
-      N(t(R), h(C.$attrs, {
+      E(t(R), h(S.$attrs, {
         active: F.value,
         style: [{ marginBottom: "10px" }]
       }), {
         default: u(() => [
-          (r(!0), o(c, null, x(t(f), ({ props: l, slots: e }, d) => (r(), m(t(j), h({ key: d }, { ref_for: !0 }, l), V({ _: 2 }, [
+          (r(!0), o(c, null, x(t(f), ({ props: l, slots: e }, d) => (r(), m(t(j), h({ key: d }, { ref_for: !0 }, l), N({ _: 2 }, [
             e?.title ? {
               name: "title",
               fn: u(() => [
@@ -71,20 +73,20 @@ const G = /* @__PURE__ */ T(L, [["render", q]]), H = /* @__PURE__ */ $({
         _: 1
       }, 16, ["active"]),
       (r(!0), o(c, null, x(t(f), ({ name: l, schema: e }, d) => (r(), o(c, { key: l }, [
-        d === F.value ? (r(), m(t(O), {
+        d === F.value ? (r(), m(t(D), {
           key: 0,
           name: l,
           schema: e
-        }, null, 8, ["name", "schema"])) : b("", !0)
+        }, null, 8, ["name", "schema"])) : O("", !0)
       ], 64))), 128))
     ]));
   }
-}), J = g(H), re = I(J, {
-  StepPane: G,
-  createFormStep: S
+}), ee = L(I, {
+  StepPane: H,
+  createFormStep: C
 });
 export {
-  re as FormStep,
-  re as default
+  ee as FormStep,
+  ee as default
 };
 //# sourceMappingURL=index.mjs.map

package/esm/form-step/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/form-step/form-step-pane.vue","../../src/form-step/form-step-pane.vue","../../src/form-step/form-step.vue","../../src/form-step/index.ts"],"sourcesContent":["<script lang=\"ts\">\r\nimport { defineComponent } from 'vue'\r\n\r\nexport default defineComponent({\r\n  name: 'FFormStepPane',\r\n  inheritAttrs: false,\r\n})\r\n</script>\r\n\r\n<template>\r\n  <slot />\r\n</template>\r\n","<script lang=\"ts\">\r\nimport { defineComponent } from 'vue'\r\n\r\nexport default defineComponent({\r\n  name: 'FFormStepPane',\r\n  inheritAttrs: false,\r\n})\r\n</script>\r\n\r\n<template>\r\n  <slot />\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { VoidField } from '@formily/core'\r\nimport type { IFormStepProps } from './types'\r\nimport { isObj } from '@formily/shared'\r\nimport { RecursionField, useField, useFieldSchema } from '@silver-formily/vue'\r\nimport { ElStep, ElSteps } from 'element-plus'\r\nimport { computed } from 'vue'\r\nimport { stylePrefix } from '../__builtins__'\r\nimport { createFormStep, parseSteps } from './utils'\r\n\r\ndefineOptions({\r\n  name: 'FFormStep',\r\n  inheritAttrs: false,\r\n})\r\n\r\nconst props = defineProps({\n  formStep: { default: () => createFormStep() },\n  active: null\n})\r\n\r\nconst field = useField<VoidField>().value\r\nconst prefixCls = `${stylePrefix}-form-step`\r\nconst fieldSchemaRef = useFieldSchema()\r\n\r\nconst steps = parseSteps(fieldSchemaRef.value)\r\n\r\nprops.formStep.connect?.(steps, field)\r\n\r\nconst current = computed(() => props.active ?? props.formStep?.current ?? 0)\r\n</script>\r\n\r\n<template>\r\n  <div :class=\"prefixCls\">\r\n    <ElSteps\r\n      v-bind=\"$attrs\"\r\n      :active=\"current\"\r\n      :style=\"[{ marginBottom: '10px' }]\"\r\n    >\r\n      <ElStep\r\n        v-for=\"({ props: stepProps, slots: stepSlots }, key) of steps\"\r\n        :key=\"key\"\r\n        v-bind=\"stepProps\"\r\n      >\r\n        <template v-if=\"stepSlots?.title\" #title>\r\n          <template v-if=\"isObj(stepSlots.title)\">\r\n            <component :is=\"stepSlots.title\" />\r\n          </template>\r\n          <template v-else>\r\n            {{ stepSlots.title }}\r\n          </template>\r\n        </template>\r\n        <template v-if=\"stepSlots?.icon\" #icon>\r\n          <template v-if=\"isObj(stepSlots.icon)\">\r\n            <component :is=\"stepSlots.icon\" />\r\n          </template>\r\n          <template v-else>\r\n            {{ stepSlots.icon }}\r\n          </template>\r\n        </template>\r\n        <template v-if=\"stepSlots?.description\" #description>\r\n          <template v-if=\"isObj(stepSlots.description)\">\r\n            <component :is=\"stepSlots.description\" />\r\n          </template>\r\n          <template v-else>\r\n            {{ stepSlots.description }}\r\n          </template>\r\n        </template>\r\n      </ElStep>\r\n    </ElSteps>\r\n\r\n    <template v-for=\"({ name, schema }, key) of steps\" :key=\"name\">\r\n      <RecursionField\r\n        v-if=\"key === current\"\r\n        :name=\"name\"\r\n        :schema=\"schema\"\r\n      />\r\n    </template>\r\n  </div>\r\n</template>\r\n","import { observer } from '@formily/reactive-vue'\r\nimport { composeExport } from '../__builtins__'\r\nimport FFormStepPane from './form-step-pane.vue'\r\nimport FFormStep from './form-step.vue'\r\nimport { createFormStep } from './utils'\r\n\r\nconst FormStepInner = observer(FFormStep)\r\n\r\nexport const FormStep = composeExport(FormStepInner, {\r\n  StepPane: FFormStepPane,\r\n  createFormStep,\r\n})\r\n\r\nexport default FormStep\r\n"],"names":["_sfc_main$1","defineComponent","_renderSlot","_ctx","props","__props","field","useField","prefixCls","stylePrefix","fieldSchemaRef","useFieldSchema","steps","parseSteps","current","computed","_createElementBlock","_createVNode","_unref","ElSteps","_mergeProps","_openBlock","_Fragment","stepProps","stepSlots","key","_createBlock","_createSlots","isObj","_resolveDynamicComponent","_createTextVNode","_toDisplayString","name","schema","RecursionField","FormStepInner","observer","FFormStep","FormStep","composeExport","FFormStepPane","createFormStep"],"mappings":";;;;;;;;AAGA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;;;;;SCICC,EAAQC,EAAA,QAAA,SAAA;;;;;;;;;;;ACKV,UAAMC,IAAQC,GAKRC,IAAQC,IAAsB,OAC9BC,IAAY,GAAGC,CAAW,cAC1BC,IAAiBC,EAAA,GAEjBC,IAAQC,EAAWH,EAAe,KAAK;AAE7C,IAAAN,EAAM,SAAS,UAAUQ,GAAON,CAAK;AAErC,UAAMQ,IAAUC,EAAS,MAAMX,EAAM,UAAUA,EAAM,UAAU,WAAW,CAAC;2BAIzEY,EA6CM,OAAA;AAAA,MA7CA,SAAOR,CAAS;AAAA,IAAA;MACpBS,EAmCUC,EAAAC,CAAA,GAnCVC,EAmCUjB,EAAA,QAlCM;AAAA,QACb,QAAQW,EAAA;AAAA,QACR,OAAO,CAAA,EAAA,cAAA,QAAA;AAAA,MAAA;mBAGN,MAA8D;AAAA,WADhEO,EAAA,EAAA,GAAAL,EA6BSM,WA5BiDJ,EAAAN,CAAA,GAAK,CAAA,EAAA,OAA5CW,GAAS,OAASC,EAAA,GAAaC,OADlDJ,EAAA,GAAAK,EA6BSR,MA7BTE,EA6BS,EA3BN,KAAAK,EAAA,oBACOF,CAAS,GAAAI,EAAA,EAAA,GAAA,KAAA;AAAA,YAEDH,GAAW;oBAAQ;AAAA,oBAAvC,MAEW;AAAA,gBADWN,EAAAU,CAAA,EAAMJ,EAAU,KAAK,UACnCE,EAAmCG,EAAnBL,EAAU,KAAK,GAAA,EAAA,KAAA,EAAA,CAAA,WAEjCR,EAEWM,GAAA,EAAA,KAAA,KAAA;AAAA,kBADNQ,EAAAC,EAAAP,EAAU,KAAK,GAAA,CAAA;AAAA,gBAAA;;;;YAGNA,GAAW;oBAAO;AAAA,oBAAtC,MAEW;AAAA,gBADWN,EAAAU,CAAA,EAAMJ,EAAU,IAAI,UAClCE,EAAkCG,EAAlBL,EAAU,IAAI,GAAA,EAAA,KAAA,EAAA,CAAA,WAEhCR,EAEWM,GAAA,EAAA,KAAA,KAAA;AAAA,kBADNQ,EAAAC,EAAAP,EAAU,IAAI,GAAA,CAAA;AAAA,gBAAA;;;;YAGLA,GAAW;oBAAc;AAAA,oBAA7C,MAEW;AAAA,gBADWN,EAAAU,CAAA,EAAMJ,EAAU,WAAW,UACzCE,EAAyCG,EAAzBL,EAAU,WAAW,GAAA,EAAA,KAAA,EAAA,CAAA,WAEvCR,EAEWM,GAAA,EAAA,KAAA,KAAA;AAAA,kBADNQ,EAAAC,EAAAP,EAAU,WAAW,GAAA,CAAA;AAAA,gBAAA;;;;;;;;OAMhCH,EAAA,EAAA,GAAAL,EAMWM,WANiCJ,EAAAN,CAAA,GAAK,CAAA,EAA7B,MAAAoB,GAAM,QAAAC,EAAA,GAAUR,wBAAqBO,KAAI;AAAA,QAEnDP,MAAQX,EAAA,cADhBY,EAIER,EAAAgB,CAAA,GAAA;AAAA;UAFC,MAAAF;AAAA,UACA,QAAAC;AAAA,QAAA;;;;ICpEHE,IAAgBC,EAASC,CAAS,GAE3BC,KAAWC,EAAcJ,GAAe;AAAA,EACnD,UAAUK;AAAA,EACV,gBAAAC;AACF,CAAC;"}
+{"version":3,"file":"index.mjs","sources":["../../src/form-step/form-step-pane.vue","../../src/form-step/form-step-pane.vue","../../src/form-step/form-step.vue","../../src/form-step/index.ts"],"sourcesContent":["<script lang=\"ts\">\r\nimport { defineComponent } from 'vue'\r\n\r\nexport default defineComponent({\r\n  name: 'FFormStepPane',\r\n  inheritAttrs: false,\r\n})\r\n</script>\r\n\r\n<template>\r\n  <slot />\r\n</template>\r\n","<script lang=\"ts\">\r\nimport { defineComponent } from 'vue'\r\n\r\nexport default defineComponent({\r\n  name: 'FFormStepPane',\r\n  inheritAttrs: false,\r\n})\r\n</script>\r\n\r\n<template>\r\n  <slot />\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { VoidField } from '@formily/core'\r\nimport type { IFormStepProps } from './types'\r\nimport { isObj } from '@formily/shared'\r\nimport { useObserver } from '@silver-formily/reactive-vue'\r\nimport { RecursionField, useField, useFieldSchema } from '@silver-formily/vue'\r\nimport { ElStep, ElSteps } from 'element-plus'\r\nimport { computed } from 'vue'\r\nimport { stylePrefix } from '../__builtins__'\r\nimport { createFormStep, parseSteps } from './utils'\r\n\r\ndefineOptions({\r\n  name: 'FFormStep',\r\n  inheritAttrs: false,\r\n})\r\n\r\nconst props = withDefaults(defineProps<IFormStepProps>(), {\r\n  formStep: () => createFormStep(),\r\n})\r\n\r\nuseObserver()\r\n\r\nconst field = useField<VoidField>().value\r\nconst prefixCls = `${stylePrefix}-form-step`\r\nconst fieldSchemaRef = useFieldSchema()\r\n\r\nconst steps = parseSteps(fieldSchemaRef.value)\r\n\r\nprops.formStep.connect?.(steps, field)\r\n\r\nconst current = computed(() => props.active ?? props.formStep?.current ?? 0)\r\n</script>\r\n\r\n<template>\r\n  <div :class=\"prefixCls\">\r\n    <ElSteps\r\n      v-bind=\"$attrs\"\r\n      :active=\"current\"\r\n      :style=\"[{ marginBottom: '10px' }]\"\r\n    >\r\n      <ElStep\r\n        v-for=\"({ props: stepProps, slots: stepSlots }, key) of steps\"\r\n        :key=\"key\"\r\n        v-bind=\"stepProps\"\r\n      >\r\n        <template v-if=\"stepSlots?.title\" #title>\r\n          <template v-if=\"isObj(stepSlots.title)\">\r\n            <component :is=\"stepSlots.title\" />\r\n          </template>\r\n          <template v-else>\r\n            {{ stepSlots.title }}\r\n          </template>\r\n        </template>\r\n        <template v-if=\"stepSlots?.icon\" #icon>\r\n          <template v-if=\"isObj(stepSlots.icon)\">\r\n            <component :is=\"stepSlots.icon\" />\r\n          </template>\r\n          <template v-else>\r\n            {{ stepSlots.icon }}\r\n          </template>\r\n        </template>\r\n        <template v-if=\"stepSlots?.description\" #description>\r\n          <template v-if=\"isObj(stepSlots.description)\">\r\n            <component :is=\"stepSlots.description\" />\r\n          </template>\r\n          <template v-else>\r\n            {{ stepSlots.description }}\r\n          </template>\r\n        </template>\r\n      </ElStep>\r\n    </ElSteps>\r\n\r\n    <template v-for=\"({ name, schema }, key) of steps\" :key=\"name\">\r\n      <RecursionField\r\n        v-if=\"key === current\"\r\n        :name=\"name\"\r\n        :schema=\"schema\"\r\n      />\r\n    </template>\r\n  </div>\r\n</template>\r\n","import { composeExport } from '../__builtins__'\r\nimport FFormStepPane from './form-step-pane.vue'\r\nimport FFormStep from './form-step.vue'\r\nimport { createFormStep } from './utils'\r\n\r\nexport const FormStep = composeExport(FFormStep, {\r\n  StepPane: FFormStepPane,\r\n  createFormStep,\r\n})\r\n\r\nexport default FormStep\r\n"],"names":["_sfc_main$1","defineComponent","_renderSlot","_ctx","props","__props","useObserver","field","useField","prefixCls","stylePrefix","fieldSchemaRef","useFieldSchema","steps","parseSteps","current","computed","_createElementBlock","_createVNode","_unref","ElSteps","_mergeProps","_openBlock","_Fragment","stepProps","stepSlots","key","_createBlock","_createSlots","isObj","_resolveDynamicComponent","_createTextVNode","_toDisplayString","name","schema","RecursionField","FormStep","composeExport","FFormStep","FFormStepPane","createFormStep"],"mappings":";;;;;;;;AAGA,MAAAA,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;;;;;SCICC,EAAQC,EAAA,QAAA,SAAA;;;;;;;;;;;ACMV,UAAMC,IAAQC;AAId,IAAAC,EAAA;AAEA,UAAMC,IAAQC,IAAsB,OAC9BC,IAAY,GAAGC,CAAW,cAC1BC,IAAiBC,EAAA,GAEjBC,IAAQC,EAAWH,EAAe,KAAK;AAE7C,IAAAP,EAAM,SAAS,UAAUS,GAAON,CAAK;AAErC,UAAMQ,IAAUC,EAAS,MAAMZ,EAAM,UAAUA,EAAM,UAAU,WAAW,CAAC;2BAIzEa,EA6CM,OAAA;AAAA,MA7CA,SAAOR,CAAS;AAAA,IAAA;MACpBS,EAmCUC,EAAAC,CAAA,GAnCVC,EAmCUlB,EAAA,QAlCM;AAAA,QACb,QAAQY,EAAA;AAAA,QACR,OAAO,CAAA,EAAA,cAAA,QAAA;AAAA,MAAA;mBAGN,MAA8D;AAAA,WADhEO,EAAA,EAAA,GAAAL,EA6BSM,WA5BiDJ,EAAAN,CAAA,GAAK,CAAA,EAAA,OAA5CW,GAAS,OAASC,EAAA,GAAaC,OADlDJ,EAAA,GAAAK,EA6BSR,MA7BTE,EA6BS,EA3BN,KAAAK,EAAA,oBACOF,CAAS,GAAAI,EAAA,EAAA,GAAA,KAAA;AAAA,YAEDH,GAAW;oBAAQ;AAAA,oBACjC,MAEW;AAAA,gBAFKN,EAAAU,CAAA,EAAMJ,EAAU,KAAK,UACnCE,EAAmCG,EAAnBL,EAAU,KAAK,GAAA,EAAA,KAAA,EAAA,CAAA,WAEjCR,EAEWM,GAAA,EAAA,KAAA,KAAA;AAAA,kBADNQ,EAAAC,EAAAP,EAAU,KAAK,GAAA,CAAA;AAAA,gBAAA;;;;YAGNA,GAAW;oBAAO;AAAA,oBAChC,MAEW;AAAA,gBAFKN,EAAAU,CAAA,EAAMJ,EAAU,IAAI,UAClCE,EAAkCG,EAAlBL,EAAU,IAAI,GAAA,EAAA,KAAA,EAAA,CAAA,WAEhCR,EAEWM,GAAA,EAAA,KAAA,KAAA;AAAA,kBADNQ,EAAAC,EAAAP,EAAU,IAAI,GAAA,CAAA;AAAA,gBAAA;;;;YAGLA,GAAW;oBAAc;AAAA,oBACvC,MAEW;AAAA,gBAFKN,EAAAU,CAAA,EAAMJ,EAAU,WAAW,UACzCE,EAAyCG,EAAzBL,EAAU,WAAW,GAAA,EAAA,KAAA,EAAA,CAAA,WAEvCR,EAEWM,GAAA,EAAA,KAAA,KAAA;AAAA,kBADNQ,EAAAC,EAAAP,EAAU,WAAW,GAAA,CAAA;AAAA,gBAAA;;;;;;;;OAMhCH,EAAA,EAAA,GAAAL,EAMWM,WANiCJ,EAAAN,CAAA,GAAK,CAAA,EAA7B,MAAAoB,GAAM,QAAAC,EAAA,GAAUR,wBAAqBO,KAAI;AAAA,QAEnDP,MAAQX,EAAA,cADhBY,EAIER,EAAAgB,CAAA,GAAA;AAAA;UAFC,MAAAF;AAAA,UACA,QAAAC;AAAA,QAAA;;;;ICvEIE,KAAWC,EAAcC,GAAW;AAAA,EAC/C,UAAUC;AAAA,EACV,gBAAAC;AACF,CAAC;"}

package/esm/form-tab/index.d.ts

@@ -1,28 +1,3 @@
-import { createFormTab } from './utils';
-export declare const composeFormTab: {
-    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').IFormTabProps> & Readonly<{
-        "onUpdate:modelValue"?: (...args: any[]) => any;
-    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-        "update:modelValue": (...args: any[]) => void;
-    }, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
-        P: {};
-        B: {};
-        D: {};
-        C: {};
-        M: {};
-        Defaults: {};
-    }, Readonly<import('./types').IFormTabProps> & Readonly<{
-        "onUpdate:modelValue"?: (...args: any[]) => any;
-    }>, {}, {}, {}, {}, {}>;
-    __isFragment?: never;
-    __isTeleport?: never;
-    __isSuspense?: never;
-} & import('vue').ComponentOptionsBase<Readonly<import('./types').IFormTabProps> & Readonly<{
-    "onUpdate:modelValue"?: (...args: any[]) => any;
-}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (...args: any[]) => void;
-}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
-    createFormTab: typeof createFormTab;
-};
+export declare const composeFormTab: any;
 export { composeFormTab as FormTab };
 export default composeFormTab;