@silver-formily/element-plus 0.0.1-beta.0 → 1.0.1

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

@@ -0,0 +1,184 @@
+import { createFormGrid } from './hooks';
+export declare const FormGrid: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+        columnGap: {
+            type: NumberConstructor;
+        };
+        rowGap: {
+            type: NumberConstructor;
+        };
+        minColumns: {
+            type: (ArrayConstructor | NumberConstructor)[];
+        };
+        minWidth: {
+            type: (ArrayConstructor | NumberConstructor)[];
+        };
+        maxColumns: {
+            type: (ArrayConstructor | NumberConstructor)[];
+        };
+        maxWidth: {
+            type: (ArrayConstructor | NumberConstructor)[];
+        };
+        breakpoints: {
+            type: import('vue').PropType<number[]>;
+        };
+        colWrap: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        strictAutoFit: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        shouldVisible: {
+            type: import('vue').PropType<import('@formily/grid').IGridOptions["shouldVisible"]>;
+            default(): () => true;
+        };
+        grid: {
+            type: import('vue').PropType<import('@formily/grid').Grid<HTMLElement>>;
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        colWrap: boolean;
+        strictAutoFit: boolean;
+        shouldVisible: (node: import('@formily/grid').GridNode, grid: import('@formily/grid').Grid<HTMLElement>) => boolean;
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        rootRef: HTMLDivElement;
+    }, HTMLDivElement, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('vue').ExtractPropTypes<{
+        columnGap: {
+            type: NumberConstructor;
+        };
+        rowGap: {
+            type: NumberConstructor;
+        };
+        minColumns: {
+            type: (ArrayConstructor | NumberConstructor)[];
+        };
+        minWidth: {
+            type: (ArrayConstructor | NumberConstructor)[];
+        };
+        maxColumns: {
+            type: (ArrayConstructor | NumberConstructor)[];
+        };
+        maxWidth: {
+            type: (ArrayConstructor | NumberConstructor)[];
+        };
+        breakpoints: {
+            type: import('vue').PropType<number[]>;
+        };
+        colWrap: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        strictAutoFit: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        shouldVisible: {
+            type: import('vue').PropType<import('@formily/grid').IGridOptions["shouldVisible"]>;
+            default(): () => true;
+        };
+        grid: {
+            type: import('vue').PropType<import('@formily/grid').Grid<HTMLElement>>;
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, {
+        colWrap: boolean;
+        strictAutoFit: boolean;
+        shouldVisible: (node: import('@formily/grid').GridNode, grid: import('@formily/grid').Grid<HTMLElement>) => boolean;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+    columnGap: {
+        type: NumberConstructor;
+    };
+    rowGap: {
+        type: NumberConstructor;
+    };
+    minColumns: {
+        type: (ArrayConstructor | NumberConstructor)[];
+    };
+    minWidth: {
+        type: (ArrayConstructor | NumberConstructor)[];
+    };
+    maxColumns: {
+        type: (ArrayConstructor | NumberConstructor)[];
+    };
+    maxWidth: {
+        type: (ArrayConstructor | NumberConstructor)[];
+    };
+    breakpoints: {
+        type: import('vue').PropType<number[]>;
+    };
+    colWrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    strictAutoFit: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    shouldVisible: {
+        type: import('vue').PropType<import('@formily/grid').IGridOptions["shouldVisible"]>;
+        default(): () => true;
+    };
+    grid: {
+        type: import('vue').PropType<import('@formily/grid').Grid<HTMLElement>>;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    colWrap: boolean;
+    strictAutoFit: boolean;
+    shouldVisible: (node: import('@formily/grid').GridNode, grid: import('@formily/grid').Grid<HTMLElement>) => boolean;
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: {
+        default?(_: {}): any;
+    };
+}) & {
+    GridColumn: {
+        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<{
+            gridSpan: {
+                type: NumberConstructor;
+                default: number;
+            };
+        }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+            gridSpan: number;
+        }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('vue').ExtractPropTypes<{
+            gridSpan: {
+                type: NumberConstructor;
+                default: number;
+            };
+        }>> & Readonly<{}>, {}, {}, {}, {}, {
+            gridSpan: number;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<{
+        gridSpan: {
+            type: NumberConstructor;
+            default: number;
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+        gridSpan: number;
+    }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+        $slots: {
+            default?(_: {}): any;
+        };
+    });
+    createFormGrid: typeof createFormGrid;
+};
+export default FormGrid;

package/esm/form-grid/index.mjs

@@ -0,0 +1,107 @@
+import { observer as s } from "@formily/reactive-vue";
+import { defineComponent as l, createElementBlock as u, openBlock as c, renderSlot as d, ref as y, computed as G, provide as b, watchEffect as _, normalizeStyle as g, normalizeClass as F } from "vue";
+import "element-plus";
+import { markRaw as C } from "@formily/reactive";
+import "@formily/core";
+import "@formily/vue";
+import { composeExport as v } from "../__builtins__/shared/utils.mjs";
+import { Grid as h } from "@formily/grid";
+import { stylePrefix as N } from "../__builtins__/configs/index.mjs";
+import { FormGridSymbol as w, createFormGrid as x } from "./hooks.mjs";
+import '../styles/form-grid/index.css';const A = ["data-grid-span"], k = /* @__PURE__ */ l({
+  name: "FFormGridColumn",
+  __name: "form-grid-column",
+  props: {
+    gridSpan: {
+      type: Number,
+      default: 1
+    }
+  },
+  setup(m) {
+    const r = m;
+    return (n, a) => (c(), u("div", {
+      "data-grid-span": r.gridSpan
+    }, [
+      d(n.$slots, "default")
+    ], 8, A));
+  }
+}), S = /* @__PURE__ */ l({
+  name: "FFormGrid",
+  __name: "form-grid",
+  props: {
+    columnGap: {
+      type: Number
+    },
+    rowGap: {
+      type: Number
+    },
+    minColumns: {
+      type: [Number, Array]
+    },
+    minWidth: {
+      type: [Number, Array]
+    },
+    maxColumns: {
+      type: [Number, Array]
+    },
+    maxWidth: {
+      type: [Number, Array]
+    },
+    breakpoints: {
+      type: Array
+    },
+    colWrap: {
+      type: Boolean,
+      default: !0
+    },
+    strictAutoFit: {
+      type: Boolean,
+      default: !1
+    },
+    shouldVisible: {
+      type: Function,
+      default() {
+        return () => !0;
+      }
+    },
+    grid: {
+      type: Object
+    }
+  },
+  setup(m) {
+    const r = m, n = `${N}-form-grid`, a = y(), o = G(() => {
+      const { grid: e, ...t } = r, f = {
+        columnGap: r?.columnGap ?? 8,
+        rowGap: r.rowGap ?? 4,
+        ...Object.fromEntries(
+          Object.entries(t).filter(([i, p]) => p !== void 0).map(([i, p]) => [i, p])
+        )
+      };
+      return C(e ?? new h(f));
+    });
+    return b(w, o), _((e) => {
+      const t = o.value.connect(a.value);
+      e(() => {
+        t();
+      });
+    }), (e, t) => (c(), u("div", {
+      ref_key: "rootRef",
+      ref: a,
+      class: F(n),
+      style: g({
+        gridTemplateColumns: o.value.templateColumns,
+        gap: o.value.gap
+      })
+    }, [
+      d(e.$slots, "default")
+    ], 4));
+  }
+}), B = s(S), E = s(k), q = v(B, {
+  GridColumn: E,
+  createFormGrid: x
+});
+export {
+  q as FormGrid,
+  q as default
+};
+//# sourceMappingURL=index.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../src/form-grid/form-grid-column.vue","../../src/form-grid/form-grid.vue","../../src/form-grid/index.ts"],"sourcesContent":["<script lang=\"ts\" setup>\ndefineOptions({\n  name: 'FFormGridColumn',\n})\n\nconst props = defineProps({\n  gridSpan: {\n    type: Number,\n    default: 1,\n  },\n})\n</script>\n\n<template>\n  <!-- @formily/grid 会优先使用这个值，如果没有会自动生成 -->\n  <div :data-grid-span=\"props.gridSpan\">\n    <slot />\n  </div>\n</template>\n","<script lang=\"ts\" setup>\nimport type { IGridOptions } from '@formily/grid'\nimport type { PropType } from 'vue'\nimport { Grid } from '@formily/grid'\nimport { markRaw } from '@formily/reactive'\nimport { computed, provide, ref, watchEffect } from 'vue'\nimport { stylePrefix } from '../__builtins__'\nimport { FormGridSymbol } from './hooks'\n\ndefineOptions({\n  name: 'FFormGrid',\n})\n\nconst props = defineProps({\n  columnGap: {\n    type: Number,\n  },\n  rowGap: {\n    type: Number,\n  },\n  minColumns: {\n    type: [Number, Array],\n  },\n  minWidth: {\n    type: [Number, Array],\n  },\n  maxColumns: {\n    type: [Number, Array],\n  },\n  maxWidth: {\n    type: [Number, Array],\n  },\n  breakpoints: {\n    type: Array as PropType<number[]>,\n  },\n  colWrap: {\n    type: Boolean,\n    default: true,\n  },\n  strictAutoFit: {\n    type: Boolean,\n    default: false,\n  },\n  shouldVisible: {\n    type: Function as PropType<IGridOptions['shouldVisible']>,\n    default() {\n      return () => true\n    },\n  },\n  grid: {\n    type: Object as PropType<Grid<HTMLElement>>,\n  },\n})\n\nconst prefixCls = `${stylePrefix}-form-grid`\nconst rootRef = ref<HTMLElement>()\n\nconst gridInstance = computed(() => {\n  const { grid, ...restProps } = props\n  const options = {\n    columnGap: props?.columnGap ?? 8,\n    rowGap: props.rowGap ?? 4,\n    ...Object.fromEntries(\n      Object.entries(restProps)\n        .filter(([_, v]) => v !== undefined)\n        .map(([k, v]) => [k, v]),\n    ),\n  }\n  return markRaw(grid ?? new Grid(options))\n})\n\nprovide(FormGridSymbol, gridInstance)\n\nwatchEffect((onInvalidate) => {\n  const dispose = gridInstance.value.connect(rootRef.value)\n  onInvalidate(() => {\n    dispose()\n  })\n})\n</script>\n\n<template>\n  <div\n    ref=\"rootRef\"\n    :class=\"prefixCls\"\n    :style=\"{\n      gridTemplateColumns: gridInstance.templateColumns,\n      gap: gridInstance.gap,\n    }\"\n  >\n    <slot />\n  </div>\n</template>\n","import { observer } from '@formily/reactive-vue'\nimport { composeExport } from '../__builtins__'\nimport FFormGridColumn from './form-grid-column.vue'\nimport FFormGrid from './form-grid.vue'\nimport { createFormGrid } from './hooks'\nimport './style.scss'\n\nconst FormGridInner = observer(FFormGrid)\n\nconst FormGridColumn = observer(FFormGridColumn)\n\nexport const FormGrid = composeExport(FormGridInner, {\n  GridColumn: FormGridColumn,\n  createFormGrid,\n})\n\nexport default FormGrid\n"],"names":["props","__props","_createElementBlock","_renderSlot","_ctx","prefixCls","stylePrefix","rootRef","ref","gridInstance","computed","grid","restProps","options","_","v","k","markRaw","Grid","provide","FormGridSymbol","watchEffect","onInvalidate","dispose","_normalizeStyle","FormGridInner","observer","FFormGrid","FormGridColumn","FFormGridColumn","FormGrid","composeExport","createFormGrid"],"mappings":";;;;;;;;;;;;;;;;;;;;AAKA,UAAMA,IAAQC;2BAUZC,EAEM,OAAA;AAAA,MAFA,kBAAgBF,EAAM;AAAA,IAAA;MAC1BG,EAAQC,EAAA,QAAA,SAAA;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACHZ,UAAMJ,IAAQC,GAyCRI,IAAY,GAAGC,CAAW,cAC1BC,IAAUC,EAAA,GAEVC,IAAeC,EAAS,MAAM;AAClC,YAAM,EAAE,MAAAC,GAAM,GAAGC,EAAA,IAAcZ,GACzBa,IAAU;AAAA,QACd,WAAWb,GAAO,aAAa;AAAA,QAC/B,QAAQA,EAAM,UAAU;AAAA,QACxB,GAAG,OAAO;AAAA,UACR,OAAO,QAAQY,CAAS,EACrB,OAAO,CAAC,CAACE,GAAGC,CAAC,MAAMA,MAAM,MAAS,EAClC,IAAI,CAAC,CAACC,GAAGD,CAAC,MAAM,CAACC,GAAGD,CAAC,CAAC;AAAA,QAAA;AAAA,MAC3B;AAEF,aAAOE,EAAQN,KAAQ,IAAIO,EAAKL,CAAO,CAAC;AAAA,IAC1C,CAAC;AAED,WAAAM,EAAQC,GAAgBX,CAAY,GAEpCY,EAAY,CAACC,MAAiB;AAC5B,YAAMC,IAAUd,EAAa,MAAM,QAAQF,EAAQ,KAAK;AACxD,MAAAe,EAAa,MAAM;AACjB,QAAAC,EAAA;AAAA,MACF,CAAC;AAAA,IACH,CAAC,mBAICrB,EASM,OAAA;AAAA,eARA;AAAA,MAAJ,KAAIK;AAAA,MACH,SAAOF,CAAS;AAAA,MAChB,OAAKmB,EAAA;AAAA,QAA+B,qBAAAf,EAAA,MAAa;AAAA,QAA4B,KAAAA,EAAA,MAAa;AAAA,MAAA;;MAK3FN,EAAQC,EAAA,QAAA,SAAA;AAAA,IAAA;;ICnFNqB,IAAgBC,EAASC,CAAS,GAElCC,IAAiBF,EAASG,CAAe,GAElCC,IAAWC,EAAcN,GAAe;AAAA,EACnD,YAAYG;AAAA,EACZ,gBAAAI;AACF,CAAC;"}

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

@@ -0,0 +1,18 @@
+import { TooltipInstance } from 'element-plus';
+import { IFormItemProps } from './types';
+declare function __VLS_template(): any;
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<IFormItemProps, {
+    feedbackTooltipRef: import('vue').Ref<TooltipInstance, TooltipInstance>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<IFormItemProps> & Readonly<{}>, {
+    colon: boolean;
+    fullness: boolean;
+    feedbackLayout: "loose" | "terse" | "popover";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, any, 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/esm/form-item/index.d.ts

@@ -0,0 +1,70 @@
+export declare function fieldFeedbackMapper(props: any, field: any): any;
+export declare const FormItem: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').IFormItemProps> & Readonly<{}>, {
+        feedbackTooltipRef: import('vue').Ref<import('element-plus').TooltipInstance, import('element-plus').TooltipInstance>;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        colon: boolean;
+        fullness: boolean;
+        feedbackLayout: "loose" | "terse" | "popover";
+    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, any, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('./types').IFormItemProps> & Readonly<{}>, {
+        feedbackTooltipRef: import('vue').Ref<import('element-plus').TooltipInstance, import('element-plus').TooltipInstance>;
+    }, {}, {}, {}, {
+        colon: boolean;
+        fullness: boolean;
+        feedbackLayout: "loose" | "terse" | "popover";
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('./types').IFormItemProps> & Readonly<{}>, {
+    feedbackTooltipRef: import('vue').Ref<import('element-plus').TooltipInstance, import('element-plus').TooltipInstance>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    colon: boolean;
+    fullness: boolean;
+    feedbackLayout: "loose" | "terse" | "popover";
+}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+    $slots: any;
+}) & {
+    BaseItem: {
+        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').IFormItemProps> & Readonly<{}>, {
+            feedbackTooltipRef: import('vue').Ref<import('element-plus').TooltipInstance, import('element-plus').TooltipInstance>;
+        }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+            colon: boolean;
+            fullness: boolean;
+            feedbackLayout: "loose" | "terse" | "popover";
+        }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, any, any, import('vue').ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import('./types').IFormItemProps> & Readonly<{}>, {
+            feedbackTooltipRef: import('vue').Ref<import('element-plus').TooltipInstance, import('element-plus').TooltipInstance>;
+        }, {}, {}, {}, {
+            colon: boolean;
+            fullness: boolean;
+            feedbackLayout: "loose" | "terse" | "popover";
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import('vue').ComponentOptionsBase<Readonly<import('./types').IFormItemProps> & Readonly<{}>, {
+        feedbackTooltipRef: import('vue').Ref<import('element-plus').TooltipInstance, import('element-plus').TooltipInstance>;
+    }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+        colon: boolean;
+        fullness: boolean;
+        feedbackLayout: "loose" | "terse" | "popover";
+    }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
+        $slots: any;
+    });
+};
+export default FormItem;
+export { default as FormBaseItem } from './form-item';