@silver-formily/element-plus 3.0.2 → 3.0.3

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

@@ -0,0 +1 @@
+{"version":3,"file":"form-grid.mjs","names":[],"sources":["../../src/form-grid/form-grid.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Grid, IGridOptions } from '@silver-formily/grid'\nimport type { PropType } from 'vue'\nimport { createGrid } from '@silver-formily/grid'\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 grid ?? createGrid(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"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,QAAQ;EAyCd,MAAM,YAAY,GAAG,YAAY;EACjC,MAAM,UAAU,KAAiB;EAEjC,MAAM,eAAe,eAAe;GAClC,MAAM,EAAE,MAAM,GAAG,cAAc;GAC/B,MAAM,UAAU;IACd,WAAW,OAAO,aAAa;IAC/B,QAAQ,MAAM,UAAU;IACxB,GAAG,OAAO,YACR,OAAO,QAAQ,UAAS,CACrB,QAAQ,CAAC,GAAG,OAAO,MAAM,KAAA,EAAS,CAClC,KAAK,CAAC,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAC3B;IACH;AACA,UAAO,QAAQ,WAAW,QAAO;IAClC;AAED,UAAQ,gBAAgB,aAAY;AAEpC,eAAa,iBAAiB;GAC5B,MAAM,UAAU,aAAa,MAAM,QAAQ,QAAQ,MAAK;AACxD,sBAAmB;AACjB,aAAQ;KACT;IACF;;uBAIC,mBASM,OAAA;aARA;IAAJ,KAAI;IACH,OAAK,eAAE,UAAS;IAChB,OAAK,eAAA;0BAA+B,aAAA,MAAa;UAA4B,aAAA,MAAa;;OAK3F,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA"}

package/esm/form-grid/hooks.mjs

@@ -1,7 +1,7 @@
-import { inject as o } from "vue";
-const r = /* @__PURE__ */ Symbol("FormGridContext"), t = () => o(r);
-export {
-  r as FormGridSymbol,
-  t as useFormGrid
-};
-//# sourceMappingURL=hooks.mjs.map
+import "vue";
+//#region src/form-grid/hooks.ts
+const FormGridSymbol = Symbol("FormGridContext");
+//#endregion
+export { FormGridSymbol };
+
+//# sourceMappingURL=hooks.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"hooks.mjs","sources":["../../src/form-grid/hooks.ts"],"sourcesContent":["import type { Grid as IGrid } from '@silver-formily/grid'\nimport type { InjectionKey, Ref } from 'vue'\nimport { inject } from 'vue'\n\nexport const FormGridSymbol: InjectionKey<Ref<IGrid<HTMLElement>>> = Symbol('FormGridContext')\n\nexport const useFormGrid = (): Ref<IGrid<HTMLElement>> => inject(FormGridSymbol)\n"],"names":["FormGridSymbol","useFormGrid","inject"],"mappings":";AAIO,MAAMA,2BAA+D,iBAAiB,GAEhFC,IAAc,MAA+BC,EAAOF,CAAc;"}
+{"version":3,"file":"hooks.mjs","names":[],"sources":["../../src/form-grid/hooks.ts"],"sourcesContent":["import type { Grid as IGrid } from '@silver-formily/grid'\nimport type { InjectionKey, Ref } from 'vue'\nimport { inject } from 'vue'\n\nexport const FormGridSymbol: InjectionKey<Ref<IGrid<HTMLElement>>> = Symbol('FormGridContext')\n\nexport const useFormGrid = (): Ref<IGrid<HTMLElement>> => inject(FormGridSymbol)\n"],"mappings":";;AAIA,MAAa,iBAAwD,OAAO,kBAAkB"}

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

@@ -1,2 +1,5 @@
-export declare const FormGrid: any;
-export default FormGrid;
+//#region src/form-grid/index.d.ts
+declare const FormGrid: any;
+//#endregion
+export { FormGrid };
+//# sourceMappingURL=index.d.ts.map

package/esm/form-grid/index.mjs

@@ -1,109 +1,10 @@
-import { observer as s } from "@silver-formily/reactive-vue";
-import "element-plus";
-import "@vueuse/core";
-import { defineComponent as l, computed as u, openBlock as d, createElementBlock as c, normalizeStyle as f, renderSlot as y, ref as b, provide as G, watchEffect as _, normalizeClass as C } from "vue";
-import "@formily/core";
-import "@silver-formily/vue";
-import { composeExport as v } from "../__builtins__/shared/utils.mjs";
-import { createGrid as F } from "@silver-formily/grid";
-import { stylePrefix as S } from "../__builtins__/configs/index.mjs";
-import { FormGridSymbol as h } from "./hooks.mjs";
-import '../styles/form-grid/index.css';const N = ["data-grid-span"], x = /* @__PURE__ */ l({
-  name: "FFormGridColumn",
-  __name: "form-grid-column",
-  props: {
-    gridSpan: {
-      type: Number,
-      default: 1
-    }
-  },
-  setup(m) {
-    const r = m, a = u(() => r.gridSpan === -1 ? {} : {
-      gridColumn: `span ${r.gridSpan} / auto`
-    });
-    return (t, e) => (d(), c("div", {
-      "data-grid-span": r.gridSpan,
-      style: f(a.value)
-    }, [
-      y(t.$slots, "default")
-    ], 12, N));
-  }
-}), A = /* @__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, a = `${S}-form-grid`, t = b(), e = u(() => {
-      const { grid: o, ...n } = r, g = {
-        columnGap: r?.columnGap ?? 8,
-        rowGap: r.rowGap ?? 4,
-        ...Object.fromEntries(
-          Object.entries(n).filter(([i, p]) => p !== void 0).map(([i, p]) => [i, p])
-        )
-      };
-      return o ?? F(g);
-    });
-    return G(h, e), _((o) => {
-      const n = e.value.connect(t.value);
-      o(() => {
-        n();
-      });
-    }), (o, n) => (d(), c("div", {
-      ref_key: "rootRef",
-      ref: t,
-      class: C(a),
-      style: f({
-        gridTemplateColumns: e.value.templateColumns,
-        gap: e.value.gap
-      })
-    }, [
-      y(o.$slots, "default")
-    ], 4));
-  }
-}), $ = s(A), k = s(x), T = v($, {
-  GridColumn: k
-});
-export {
-  T as FormGrid,
-  T as default
-};
-//# sourceMappingURL=index.mjs.map
+import { composeExport } from "../__builtins__/shared/utils.mjs";
+import _sfc_main from "./form-grid-column.mjs";
+import _sfc_main$1 from "./form-grid.mjs";
+import "./style.css";
+import { observer } from "@silver-formily/reactive-vue";
+const FormGrid = composeExport(observer(_sfc_main$1), { GridColumn: observer(_sfc_main) });
+//#endregion
+export { FormGrid as default };
+
+//# sourceMappingURL=index.mjs.map

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

@@ -1 +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>\nimport { computed } from 'vue'\n\ndefineOptions({\n  name: 'FFormGridColumn',\n})\n\nconst props = defineProps({\n  gridSpan: {\n    type: Number,\n    default: 1,\n  },\n})\n\nconst gridColumnStyle = computed(() => {\n  if (props.gridSpan === -1) {\n    // gridSpan=-1 means \"fill remaining columns in current row\".\n    // Leave gridColumn unset so @silver-formily/grid can manage it dynamically.\n    return {}\n  }\n  return {\n    gridColumn: `span ${props.gridSpan} / auto`,\n  }\n})\n</script>\n\n<template>\n  <!-- @silver-formily/grid 会优先使用这个值，如果没有会自动生成 -->\n  <div :data-grid-span=\"props.gridSpan\" :style=\"gridColumnStyle\">\n    <slot />\n  </div>\n</template>\n","<script lang=\"ts\" setup>\nimport type { Grid, IGridOptions } from '@silver-formily/grid'\nimport type { PropType } from 'vue'\nimport { createGrid } from '@silver-formily/grid'\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 grid ?? createGrid(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 '@silver-formily/reactive-vue'\nimport { composeExport } from '../__builtins__'\nimport FFormGridColumn from './form-grid-column.vue'\nimport FFormGrid from './form-grid.vue'\nimport './style.scss'\n\nconst FormGridInner = observer(FFormGrid)\n\nconst FormGridColumn = observer(FFormGridColumn)\n\nexport const FormGrid = composeExport(FormGridInner, {\n  GridColumn: FormGridColumn,\n})\n\nexport default FormGrid\n"],"names":["props","__props","gridColumnStyle","computed","_createElementBlock","_renderSlot","_ctx","prefixCls","stylePrefix","rootRef","ref","gridInstance","grid","restProps","options","_","v","k","createGrid","provide","FormGridSymbol","watchEffect","onInvalidate","dispose","_normalizeStyle","FormGridInner","observer","FFormGrid","FormGridColumn","FFormGridColumn","FormGrid","composeExport"],"mappings":";;;;;;;;;;;;;;;;;;;;AAOA,UAAMA,IAAQC,GAORC,IAAkBC,EAAS,MAC3BH,EAAM,aAAa,KAGd,CAAA,IAEF;AAAA,MACL,YAAY,QAAQA,EAAM,QAAQ;AAAA,IAAA,CAErC;2BAKCI,EAEM,OAAA;AAAA,MAFA,kBAAgBJ,EAAM;AAAA,MAAW,SAAOE,EAAA,KAAe;AAAA,IAAA;MAC3DG,EAAQC,EAAA,QAAA,SAAA;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACjBZ,UAAMN,IAAQC,GAyCRM,IAAY,GAAGC,CAAW,cAC1BC,IAAUC,EAAA,GAEVC,IAAeR,EAAS,MAAM;AAClC,YAAM,EAAE,MAAAS,GAAM,GAAGC,EAAA,IAAcb,GACzBc,IAAU;AAAA,QACd,WAAWd,GAAO,aAAa;AAAA,QAC/B,QAAQA,EAAM,UAAU;AAAA,QACxB,GAAG,OAAO;AAAA,UACR,OAAO,QAAQa,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,aAAOJ,KAAQM,EAAWJ,CAAO;AAAA,IACnC,CAAC;AAED,WAAAK,EAAQC,GAAgBT,CAAY,GAEpCU,EAAY,CAACC,MAAiB;AAC5B,YAAMC,IAAUZ,EAAa,MAAM,QAAQF,EAAQ,KAAK;AACxD,MAAAa,EAAa,MAAM;AACjB,QAAAC,EAAA;AAAA,MACF,CAAC;AAAA,IACH,CAAC,mBAICnB,EASM,OAAA;AAAA,eARA;AAAA,MAAJ,KAAIK;AAAA,MACH,SAAOF,CAAS;AAAA,MAChB,OAAKiB,EAAA;AAAA,QAA+B,qBAAAb,EAAA,MAAa;AAAA,QAA4B,KAAAA,EAAA,MAAa;AAAA,MAAA;;MAK3FN,EAAQC,EAAA,QAAA,SAAA;AAAA,IAAA;;ICnFNmB,IAAgBC,EAASC,CAAS,GAElCC,IAAiBF,EAASG,CAAe,GAElCC,IAAWC,EAAcN,GAAe;AAAA,EACnD,YAAYG;AACd,CAAC;"}
+{"version":3,"file":"index.mjs","names":["FFormGrid","FFormGridColumn"],"sources":["../../src/form-grid/index.ts"],"sourcesContent":["import { observer } from '@silver-formily/reactive-vue'\nimport { composeExport } from '../__builtins__'\nimport FFormGridColumn from './form-grid-column.vue'\nimport FFormGrid from './form-grid.vue'\nimport './style.scss'\n\nconst FormGridInner = observer(FFormGrid)\n\nconst FormGridColumn = observer(FFormGridColumn)\n\nexport const FormGrid = composeExport(FormGridInner, {\n  GridColumn: FormGridColumn,\n})\n\nexport default FormGrid\n"],"mappings":";;;;;AAUA,MAAa,WAAW,cAJF,SAASA,YAAU,EAIY,EACnD,YAHqB,SAASC,UAAgB,EAI/C,CAAC"}

package/esm/form-grid/style.css

@@ -0,0 +1,128 @@
+.formily-element-plus-form-grid {
+  display: grid;
+}
+.formily-element-plus-form-grid > [data-grid-span="-1"],
+.formily-element-plus-form-grid > [gridspan="-1"],
+.formily-element-plus-form-grid > [gridspan="span -1"] {
+  grid-column: 1/-1;
+}
+.formily-element-plus-form-grid > [data-grid-span="1"],
+.formily-element-plus-form-grid > [gridspan="1"],
+.formily-element-plus-form-grid > [gridspan="span 1"] {
+  grid-column: span 1/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="2"],
+.formily-element-plus-form-grid > [gridspan="2"],
+.formily-element-plus-form-grid > [gridspan="span 2"] {
+  grid-column: span 2/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="3"],
+.formily-element-plus-form-grid > [gridspan="3"],
+.formily-element-plus-form-grid > [gridspan="span 3"] {
+  grid-column: span 3/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="4"],
+.formily-element-plus-form-grid > [gridspan="4"],
+.formily-element-plus-form-grid > [gridspan="span 4"] {
+  grid-column: span 4/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="5"],
+.formily-element-plus-form-grid > [gridspan="5"],
+.formily-element-plus-form-grid > [gridspan="span 5"] {
+  grid-column: span 5/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="6"],
+.formily-element-plus-form-grid > [gridspan="6"],
+.formily-element-plus-form-grid > [gridspan="span 6"] {
+  grid-column: span 6/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="7"],
+.formily-element-plus-form-grid > [gridspan="7"],
+.formily-element-plus-form-grid > [gridspan="span 7"] {
+  grid-column: span 7/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="8"],
+.formily-element-plus-form-grid > [gridspan="8"],
+.formily-element-plus-form-grid > [gridspan="span 8"] {
+  grid-column: span 8/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="9"],
+.formily-element-plus-form-grid > [gridspan="9"],
+.formily-element-plus-form-grid > [gridspan="span 9"] {
+  grid-column: span 9/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="10"],
+.formily-element-plus-form-grid > [gridspan="10"],
+.formily-element-plus-form-grid > [gridspan="span 10"] {
+  grid-column: span 10/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="11"],
+.formily-element-plus-form-grid > [gridspan="11"],
+.formily-element-plus-form-grid > [gridspan="span 11"] {
+  grid-column: span 11/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="12"],
+.formily-element-plus-form-grid > [gridspan="12"],
+.formily-element-plus-form-grid > [gridspan="span 12"] {
+  grid-column: span 12/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="13"],
+.formily-element-plus-form-grid > [gridspan="13"],
+.formily-element-plus-form-grid > [gridspan="span 13"] {
+  grid-column: span 13/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="14"],
+.formily-element-plus-form-grid > [gridspan="14"],
+.formily-element-plus-form-grid > [gridspan="span 14"] {
+  grid-column: span 14/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="15"],
+.formily-element-plus-form-grid > [gridspan="15"],
+.formily-element-plus-form-grid > [gridspan="span 15"] {
+  grid-column: span 15/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="16"],
+.formily-element-plus-form-grid > [gridspan="16"],
+.formily-element-plus-form-grid > [gridspan="span 16"] {
+  grid-column: span 16/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="17"],
+.formily-element-plus-form-grid > [gridspan="17"],
+.formily-element-plus-form-grid > [gridspan="span 17"] {
+  grid-column: span 17/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="18"],
+.formily-element-plus-form-grid > [gridspan="18"],
+.formily-element-plus-form-grid > [gridspan="span 18"] {
+  grid-column: span 18/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="19"],
+.formily-element-plus-form-grid > [gridspan="19"],
+.formily-element-plus-form-grid > [gridspan="span 19"] {
+  grid-column: span 19/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="20"],
+.formily-element-plus-form-grid > [gridspan="20"],
+.formily-element-plus-form-grid > [gridspan="span 20"] {
+  grid-column: span 20/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="21"],
+.formily-element-plus-form-grid > [gridspan="21"],
+.formily-element-plus-form-grid > [gridspan="span 21"] {
+  grid-column: span 21/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="22"],
+.formily-element-plus-form-grid > [gridspan="22"],
+.formily-element-plus-form-grid > [gridspan="span 22"] {
+  grid-column: span 22/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="23"],
+.formily-element-plus-form-grid > [gridspan="23"],
+.formily-element-plus-form-grid > [gridspan="span 23"] {
+  grid-column: span 23/auto;
+}
+.formily-element-plus-form-grid > [data-grid-span="24"],
+.formily-element-plus-form-grid > [gridspan="24"],
+.formily-element-plus-form-grid > [gridspan="span 24"] {
+  grid-column: span 24/auto;
+}

package/esm/form-item/form-item.mjs

@@ -0,0 +1,308 @@
+import { stylePrefix } from "../__builtins__/configs/index.mjs";
+import { FORM_LAYOUT_PROPS_KEYS, formLayoutShallowContext, useFormLayout } from "../form-layout/utils.mjs";
+import { ElIcon, ElTooltip, formItemContextKey, useFormSize, useId, useNamespace } from "element-plus";
+import { useResizeObserver } from "@vueuse/core";
+import { Fragment, TransitionGroup, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, isVNode, normalizeClass, normalizeStyle, openBlock, provide, reactive, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, watch, withCtx } from "vue";
+import { useField } from "@silver-formily/vue";
+import { isArr, isValid } from "@formily/shared";
+import { pick } from "lodash-es";
+import { CircleCheck, CircleClose, InfoFilled, Warning } from "@element-plus/icons-vue";
+import { addUnit } from "element-plus/es/utils/index";
+//#region src/form-item/form-item.vue
+const _hoisted_1 = ["role", "aria-labelledby"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "FFormItem",
+	__name: "form-item",
+	props: {
+		internalFormItemClass: {},
+		label: {},
+		for: {},
+		tooltip: {},
+		addonBefore: {},
+		addonAfter: {},
+		extra: {},
+		feedbackText: {},
+		feedbackStatus: {},
+		asterisk: {
+			type: Boolean,
+			default: void 0
+		},
+		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: {},
+		layout: {},
+		feedbackLayout: {},
+		tooltipLayout: {}
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const slots = useSlots();
+		const ns = useNamespace("form-item");
+		const prefixCls = `${stylePrefix}-form-item`;
+		const rootFormItemClass = computed(() => props.internalFormItemClass || ns.b());
+		const formItemConfig = computed(() => Object.fromEntries(Object.entries(pick(props, FORM_LAYOUT_PROPS_KEYS)).filter(([_, value]) => isValid(value))));
+		const formlayoutConfig = useFormLayout();
+		const formlayout = computed(() => Object.assign({
+			colon: true,
+			feedbackLayout: "loose",
+			fullness: false,
+			labelWrap: false
+		}, formlayoutConfig.value, formItemConfig.value));
+		const field = useField();
+		const inheritedSize = useFormSize(void 0, { formItem: false });
+		const formItemSize = computed(() => {
+			if (isValid(formlayout.value.size)) return formlayout.value.size;
+			return inheritedSize.value;
+		});
+		const labelId = useId().value;
+		const inputIds = ref([]);
+		const validateState = ref("");
+		const formItemRef = ref();
+		const labelRef = ref();
+		const feedbackTooltipRef = ref();
+		__expose({ feedbackTooltipRef });
+		const labelPosition = computed(() => {
+			if (formlayout.value.layout === "vertical" || isArr(formlayout.value.layout) && formlayout.value.layout.includes("vertical")) return "top";
+			return formlayout.value.labelAlign ?? "right";
+		});
+		const labelStyle = computed(() => {
+			if (labelPosition.value === "top") return {};
+			const labelWidth = addUnit(formlayout.value.labelWidth || "");
+			if (labelWidth) return { width: labelWidth };
+			return {};
+		});
+		const contentStyle = computed(() => {
+			const contentWidth = addUnit(formlayout.value?.wrapperWidth || "");
+			if (contentWidth) return {
+				width: contentWidth,
+				flex: "unset"
+			};
+			return {};
+		});
+		const contentWrapperStyle = computed(() => {
+			return { justifyContent: formlayout.value?.wrapperAlign === "right" && "flex-end" };
+		});
+		const isRequired = computed(() => props.asterisk && field.value?.pattern !== "readPretty");
+		const formItemClasses = computed(() => [
+			rootFormItemClass.value,
+			ns.m(formItemSize.value || "default"),
+			ns.is(props.feedbackStatus),
+			ns.is("validating", validateState.value === "validating"),
+			ns.is("success", validateState.value === "success"),
+			ns.is("required", isRequired.value || props.asterisk),
+			ns.is("no-asterisk", formlayout.value?.hideRequiredAsterisk),
+			ns.is(formlayout.value.feedbackLayout),
+			formlayout.value?.requireAsteriskPosition === "right" ? "asterisk-right" : "asterisk-left",
+			{
+				[ns.m("feedback")]: formlayout.value?.statusIcon,
+				[ns.m(`label-${labelPosition.value}`)]: labelPosition.value
+			}
+		]);
+		const validateClasses = computed(() => [
+			`${prefixCls}-feedback`,
+			ns.is(props.feedbackStatus),
+			ns.is("loose", formlayout.value.feedbackLayout === "loose")
+		]);
+		const hasLabel = computed(() => {
+			return props.label !== "" && isValid(props.label) || isValid(slots.label);
+		});
+		const labelFor = computed(() => {
+			return props.for || (inputIds.value.length === 1 ? inputIds.value[0] : void 0);
+		});
+		const isGroup = computed(() => {
+			return !labelFor.value && hasLabel.value;
+		});
+		async function validate() {
+			return true;
+		}
+		/* istanbul ignore next -- @preserve */
+		const clearValidate = () => {};
+		/* istanbul ignore next -- @preserve */
+		const resetField = async () => {};
+		/* istanbul ignore next -- @preserve */
+		const setInitialValue = () => {};
+		const addInputId = (id) => {
+			/* istanbul ignore else -- @preserve */
+			if (!inputIds.value.includes(id)) inputIds.value.push(id);
+		};
+		const removeInputId = (id) => {
+			inputIds.value = inputIds.value.filter((listId) => listId !== id);
+		};
+		const isEllipsisActive = ref(false);
+		useResizeObserver(labelRef, () => {
+			isEllipsisActive.value = labelRef.value?.scrollWidth > labelRef.value?.clientWidth;
+		});
+		const isEllipsis = computed(() => {
+			return isEllipsisActive.value && !formlayout.value.labelWrap;
+		});
+		const _validateState = ref("");
+		const context = reactive({
+			$el: formItemRef,
+			labelWidth: formlayout.value?.labelWidth,
+			size: formItemSize,
+			validateState: _validateState.value,
+			labelId,
+			inputIds,
+			isGroup,
+			hasLabel,
+			addInputId,
+			removeInputId,
+			resetField,
+			clearValidate,
+			validate,
+			labelPosition,
+			inlineMessage: true,
+			showMessage: true,
+			fieldValue: field.value?.value,
+			validateMessage: "",
+			propString: "",
+			setInitialValue
+		});
+		watch(() => props.feedbackStatus, (val) => {
+			if (val === "pending") {
+				context.validateState = "validating";
+				return;
+			}
+			if (val === "warning") {
+				context.validateState = "";
+				return;
+			}
+			context.validateState = val;
+		}, { immediate: true });
+		provide(formLayoutShallowContext, ref({
+			...isValid(formlayout.value.size) && { size: formlayout.value.size },
+			...isValid(formlayout.value.colon) && { colon: formlayout.value.colon }
+		}));
+		provide(formItemContextKey, context);
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "formItemRef",
+				ref: formItemRef,
+				class: normalizeClass([
+					prefixCls,
+					formlayout.value.labelWrap && "is-warp",
+					...formItemClasses.value
+				]),
+				role: isGroup.value ? "group" : void 0,
+				"aria-labelledby": isGroup.value ? unref(labelId) : void 0
+			}, [
+				hasLabel.value ? (openBlock(), createBlock(resolveDynamicComponent(labelFor.value ? "label" : "div"), {
+					key: 0,
+					id: unref(labelId),
+					for: labelFor.value,
+					class: normalizeClass([unref(ns).e("label"), unref(isValid)(formlayout.value.labelCol) && `${prefixCls}-col-${formlayout.value.labelCol}`]),
+					style: normalizeStyle(labelStyle.value)
+				}, {
+					default: withCtx(() => [createCommentVNode(" label "), isVNode(props.label) ? (openBlock(), createBlock(resolveDynamicComponent(props.label), { key: 0 })) : (openBlock(), createElementBlock("div", {
+						key: 1,
+						class: normalizeClass(`${prefixCls}-label__wrapper`)
+					}, [
+						createVNode(unref(ElTooltip), { disabled: !isEllipsis.value && formlayout.value.tooltipLayout !== "text" }, {
+							content: withCtx(() => [isVNode(props.tooltip) ? (openBlock(), createBlock(resolveDynamicComponent(props.tooltip), { key: 0 })) : (openBlock(), createElementBlock("div", {
+								key: 1,
+								style: normalizeStyle(`width: ${labelRef.value?.clientWidth ?? 0}px;`)
+							}, [isEllipsis.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createTextVNode(toDisplayString(props.label), 1)], 64)) : createCommentVNode("v-if", true), formlayout.value.tooltipLayout === "text" ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(props.tooltip), 1)], 64)) : createCommentVNode("v-if", true)], 4))]),
+							default: withCtx(() => [createElementVNode("span", { class: normalizeClass({
+								[`${prefixCls}-label-content`]: true,
+								["is-tooltip"]: isEllipsis.value || props.tooltip && formlayout.value.tooltipLayout === "text"
+							}) }, [createElementVNode("span", {
+								ref_key: "labelRef",
+								ref: labelRef
+							}, toDisplayString(props.label), 513)], 2)]),
+							_: 1
+						}, 8, ["disabled"]),
+						props.tooltip && !isVNode(props.tooltip) && formlayout.value.tooltipLayout !== "text" ? (openBlock(), createBlock(unref(ElTooltip), {
+							key: 0,
+							content: props.tooltip
+						}, {
+							default: withCtx(() => [createVNode(unref(ElIcon), { class: normalizeClass(`${prefixCls}-label-tooltip`) }, {
+								default: withCtx(() => [createVNode(unref(InfoFilled))]),
+								_: 1
+							}, 8, ["class"])]),
+							_: 1
+						}, 8, ["content"])) : createCommentVNode("v-if", true),
+						formlayout.value.colon ? (openBlock(), createElementBlock("span", {
+							key: 1,
+							class: normalizeClass(`${prefixCls}-colon`)
+						}, ":", 2)) : createCommentVNode("v-if", true)
+					], 2))]),
+					_: 1
+				}, 8, [
+					"id",
+					"for",
+					"class",
+					"style"
+				])) : createCommentVNode("v-if", true),
+				createCommentVNode(" content "),
+				createElementVNode("div", {
+					class: normalizeClass([`${prefixCls}-content__wrapper`, unref(isValid)(formlayout.value.wrapperCol) && `${prefixCls}-col-${formlayout.value.wrapperCol}`]),
+					style: normalizeStyle(contentWrapperStyle.value)
+				}, [
+					unref(isValid)(props.addonBefore) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [isVNode(props.addonBefore) ? (openBlock(), createBlock(resolveDynamicComponent(props.addonBefore), { key: 0 })) : (openBlock(), createElementBlock("div", {
+						key: 1,
+						class: normalizeClass(`${prefixCls}-addon-before`)
+					}, toDisplayString(props.addonBefore), 3))], 64)) : createCommentVNode("v-if", true),
+					createElementVNode("div", {
+						class: normalizeClass([
+							unref(ns).e("content"),
+							formlayout.value.fullness && "is-fullness",
+							unref(ns).is("addon-after", !!props.addonAfter)
+						]),
+						style: normalizeStyle(contentStyle.value)
+					}, [formlayout.value.feedbackLayout === "popover" ? (openBlock(), createBlock(unref(ElTooltip), {
+						key: 0,
+						ref_key: "feedbackTooltipRef",
+						ref: feedbackTooltipRef,
+						visible: !!props.feedbackText,
+						effect: "light",
+						offset: 6
+					}, {
+						default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+						content: withCtx(() => [createElementVNode("div", { class: normalizeClass([...validateClasses.value, unref(ns).is("tooltip")]) }, [createVNode(unref(ElIcon), null, {
+							default: withCtx(() => [
+								props.feedbackStatus === "error" ? (openBlock(), createBlock(unref(CircleClose), { key: 0 })) : createCommentVNode("v-if", true),
+								props.feedbackStatus === "success" ? (openBlock(), createBlock(unref(CircleCheck), { key: 1 })) : createCommentVNode("v-if", true),
+								props.feedbackStatus === "warning" ? (openBlock(), createBlock(unref(Warning), { key: 2 })) : createCommentVNode("v-if", true)
+							]),
+							_: 1
+						}), createTextVNode(" " + toDisplayString(props.feedbackText), 1)], 2)]),
+						_: 3
+					}, 8, ["visible"])) : renderSlot(_ctx.$slots, "default", { key: 1 }), createVNode(TransitionGroup, { name: `${unref(ns).namespace.value}-zoom-in-top` }, {
+						default: withCtx(() => [props.feedbackText && formlayout.value.feedbackLayout !== "popover" ? (openBlock(), createElementBlock("div", {
+							key: 0,
+							class: normalizeClass(validateClasses.value)
+						}, toDisplayString(props.feedbackText), 3)) : createCommentVNode("v-if", true), unref(isValid)(props.extra) ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [isVNode(props.extra) ? (openBlock(), createBlock(resolveDynamicComponent(props.extra), { key: 0 })) : (openBlock(), createElementBlock("div", {
+							key: 1,
+							class: normalizeClass(`${prefixCls}-extra`)
+						}, toDisplayString(props.extra), 3))], 64)) : createCommentVNode("v-if", true)]),
+						_: 1
+					}, 8, ["name"])], 6),
+					unref(isValid)(props.addonAfter) ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [isVNode(props.addonAfter) ? (openBlock(), createBlock(resolveDynamicComponent(props.addonAfter), { key: 0 })) : (openBlock(), createElementBlock("div", {
+						key: 1,
+						class: normalizeClass(`${prefixCls}-addon-after`)
+					}, toDisplayString(props.addonAfter), 3))], 64)) : createCommentVNode("v-if", true)
+				], 6)
+			], 10, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=form-item.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"form-item.mjs","names":[],"sources":["../../src/form-item/form-item.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Field } from '@formily/core'\nimport type {\n  FormItemContext,\n  FormItemValidateState,\n  FormValidationResult,\n  TooltipInstance,\n} from 'element-plus'\nimport type { CSSProperties } from 'vue'\nimport type { ICalculatedFormLayoutProps } from '../form-layout/types'\nimport type { IFormItemProps } from './types'\nimport { CircleCheck, CircleClose, InfoFilled, Warning } from '@element-plus/icons-vue'\nimport { isArr, isValid } from '@formily/shared'\nimport { useField } from '@silver-formily/vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport { ElIcon, ElTooltip, formItemContextKey, useFormSize, useId, useNamespace } from 'element-plus'\nimport { addUnit } from 'element-plus/es/utils/index'\nimport { pick } from 'lodash-es'\nimport { computed, isVNode, provide, reactive, ref, useSlots, watch } from 'vue'\nimport { stylePrefix } from '../__builtins__'\nimport { FORM_LAYOUT_PROPS_KEYS, formLayoutShallowContext, useFormLayout } from '../form-layout/utils'\n\ndefineOptions({\n  name: 'FFormItem',\n})\nconst props = withDefaults(defineProps<IFormItemProps>(), {\n  asterisk: undefined,\n  colon: undefined,\n  labelWrap: undefined,\n  fullness: undefined,\n})\nconst slots = useSlots()\nconst ns = useNamespace('form-item')\nconst prefixCls = `${stylePrefix}-form-item`\nconst rootFormItemClass = computed(() => props.internalFormItemClass || ns.b())\nconst formItemConfig = computed<Partial<ICalculatedFormLayoutProps>>(() =>\n  Object.fromEntries(\n    Object.entries(pick(props, FORM_LAYOUT_PROPS_KEYS))\n      .filter(([_, value]) => isValid(value)),\n  ),\n)\nconst formlayoutConfig = useFormLayout()\nconst formlayout = computed(() => Object.assign({\n  colon: true,\n  feedbackLayout: 'loose',\n  fullness: false,\n  labelWrap: false,\n}, formlayoutConfig.value, formItemConfig.value))\nconst field = useField<Field>()\n\nconst inheritedSize = useFormSize(undefined, { formItem: false })\nconst formItemSize = computed(() => {\n  if (isValid(formlayout.value.size)) {\n    return formlayout.value.size\n  }\n  return inheritedSize.value\n})\n\nconst labelId = useId().value\nconst inputIds = ref<string[]>([])\n\nconst validateState = ref<FormItemValidateState>('')\nconst formItemRef = ref<HTMLDivElement>()\nconst labelRef = ref<HTMLElement>()\nconst feedbackTooltipRef = ref<TooltipInstance>()\ndefineExpose({\n  feedbackTooltipRef,\n})\n\nconst labelPosition = computed(\n  () => {\n    if (formlayout.value.layout === 'vertical' || (isArr(formlayout.value.layout) && formlayout.value.layout.includes('vertical' as any))) {\n      return 'top'\n    }\n    return formlayout.value.labelAlign ?? 'right'\n  },\n)\n\nconst labelStyle = computed<CSSProperties>(() => {\n  if (labelPosition.value === 'top') {\n    return {}\n  }\n\n  const labelWidth = addUnit(formlayout.value.labelWidth || '')\n  if (labelWidth)\n    return { width: labelWidth }\n  return {}\n})\n\nconst contentStyle = computed<CSSProperties>(() => {\n  const contentWidth = addUnit(formlayout.value?.wrapperWidth || '')\n  if (contentWidth)\n    return { width: contentWidth, flex: 'unset' }\n  return {}\n})\n\nconst contentWrapperStyle = computed<CSSProperties>(() => {\n  return {\n    justifyContent: formlayout.value?.wrapperAlign === 'right' && 'flex-end',\n  }\n})\n\nconst isRequired = computed(() =>\n  props.asterisk && field.value?.pattern !== 'readPretty',\n)\n\nconst formItemClasses = computed(() => [\n  rootFormItemClass.value,\n  ns.m(formItemSize.value || 'default'),\n  ns.is(props.feedbackStatus),\n  ns.is('validating', validateState.value === 'validating'),\n  ns.is('success', validateState.value === 'success'),\n  ns.is('required', isRequired.value || props.asterisk),\n  ns.is('no-asterisk', formlayout.value?.hideRequiredAsterisk),\n  ns.is(formlayout.value.feedbackLayout),\n  formlayout.value?.requireAsteriskPosition === 'right'\n    ? 'asterisk-right'\n    : 'asterisk-left',\n  {\n    [ns.m('feedback')]: formlayout.value?.statusIcon,\n    [ns.m(`label-${labelPosition.value}`)]: labelPosition.value,\n  },\n])\n\nconst validateClasses = computed(() => [\n  `${prefixCls}-feedback`,\n  ns.is(props.feedbackStatus),\n  ns.is('loose', formlayout.value.feedbackLayout === 'loose'),\n])\n\nconst hasLabel = computed<boolean>(() => {\n  return (props.label !== '' && isValid(props.label)) || isValid(slots.label)\n})\n\nconst labelFor = computed<string | undefined>(() => {\n  return (\n    props.for || (inputIds.value.length === 1 ? inputIds.value[0] : undefined)\n  )\n})\n\nconst isGroup = computed<boolean>(() => {\n  return !labelFor.value && hasLabel.value\n})\n\nasync function validate(): FormValidationResult {\n  return true\n}\n/* istanbul ignore next -- @preserve */\nconst clearValidate: FormItemContext['clearValidate'] = () => {}\n/* istanbul ignore next -- @preserve */\nconst resetField: FormItemContext['resetField'] = async () => {}\n/* istanbul ignore next -- @preserve */\nconst setInitialValue: FormItemContext['setInitialValue'] = () => {}\n\nconst addInputId: FormItemContext['addInputId'] = (id: string) => {\n  /* istanbul ignore else -- @preserve */\n  if (!inputIds.value.includes(id)) {\n    inputIds.value.push(id)\n  }\n}\n\nconst removeInputId: FormItemContext['removeInputId'] = (id: string) => {\n  inputIds.value = inputIds.value.filter(listId => listId !== id)\n}\n\nconst isEllipsisActive = ref(false)\nuseResizeObserver(labelRef, () => {\n  isEllipsisActive.value = labelRef.value?.scrollWidth > labelRef.value?.clientWidth\n})\nconst isEllipsis = computed(() => {\n  return isEllipsisActive.value && !formlayout.value.labelWrap\n})\n\n// HACK computed无法监听到props.feedbackStatus的变化\nconst _validateState = ref<FormItemValidateState>('')\nconst context: FormItemContext = reactive({\n  $el: formItemRef,\n  labelWidth: formlayout.value?.labelWidth,\n  size: formItemSize,\n  validateState: _validateState.value,\n  labelId,\n  inputIds,\n  isGroup,\n  hasLabel,\n  addInputId,\n  removeInputId,\n  resetField,\n  clearValidate,\n  validate,\n  labelPosition,\n  inlineMessage: true,\n  showMessage: true,\n  fieldValue: field.value?.value,\n  validateMessage: '',\n  propString: '',\n  setInitialValue,\n})\nwatch(() => props.feedbackStatus, (val) => {\n  if (val === 'pending') {\n    context.validateState = 'validating'\n    return\n  }\n  if (val === 'warning') {\n    context.validateState = ''\n    return\n  }\n  context.validateState = val\n}, {\n  immediate: true,\n})\n\nprovide(formLayoutShallowContext, ref({\n  ...(isValid(formlayout.value.size) && { size: formlayout.value.size }),\n  ...(isValid(formlayout.value.colon) && { colon: formlayout.value.colon }),\n}))\nprovide(formItemContextKey, context)\n</script>\n\n<template>\n  <div\n    ref=\"formItemRef\" :class=\"[prefixCls, formlayout.labelWrap && 'is-warp', ...formItemClasses]\"\n    :role=\"isGroup ? 'group' : undefined\" :aria-labelledby=\"isGroup ? labelId : undefined\"\n  >\n    <component\n      :is=\"labelFor ? 'label' : 'div'\" v-if=\"hasLabel\" :id=\"labelId\" :for=\"labelFor\"\n      :class=\"[ns.e('label'), isValid(formlayout.labelCol) && `${prefixCls}-col-${formlayout.labelCol}`]\"\n      :style=\"labelStyle\"\n    >\n      <!-- label -->\n      <template v-if=\"isVNode(props.label)\">\n        <component :is=\"props.label\" />\n      </template>\n      <div v-else :class=\"`${prefixCls}-label__wrapper`\">\n        <ElTooltip :disabled=\"!isEllipsis && formlayout.tooltipLayout !== 'text'\">\n          <span\n            :class=\"{\n              [`${prefixCls}-label-content`]: true,\n              ['is-tooltip']: isEllipsis || (props.tooltip && formlayout.tooltipLayout === 'text'),\n            }\"\n          >\n            <span ref=\"labelRef\">{{ props.label }}</span>\n          </span>\n          <template #content>\n            <template v-if=\"isVNode(props.tooltip)\">\n              <component :is=\"props.tooltip\" />\n            </template>\n            <div v-else :style=\"`width: ${labelRef?.clientWidth ?? 0}px;`\">\n              <template v-if=\"isEllipsis\">\n                {{ props.label }}\n              </template>\n              <template v-if=\"formlayout.tooltipLayout === 'text'\">\n                {{ props.tooltip }}\n              </template>\n            </div>\n          </template>\n        </ElTooltip>\n        <ElTooltip v-if=\"props.tooltip && !isVNode(props.tooltip) && formlayout.tooltipLayout !== 'text'\" :content=\"props.tooltip\">\n          <ElIcon :class=\"`${prefixCls}-label-tooltip`\">\n            <InfoFilled />\n          </ElIcon>\n        </ElTooltip>\n        <span v-if=\"formlayout.colon\" :class=\"`${prefixCls}-colon`\">:</span>\n      </div>\n    </component>\n    <!-- content -->\n    <div\n      :class=\"[\n        `${prefixCls}-content__wrapper`,\n        isValid(formlayout.wrapperCol) && `${prefixCls}-col-${formlayout.wrapperCol}`,\n      ]\"\n      :style=\"contentWrapperStyle\"\n    >\n      <template v-if=\"isValid(props.addonBefore)\">\n        <template v-if=\"isVNode(props.addonBefore)\">\n          <component :is=\"props.addonBefore\" />\n        </template>\n        <div v-else :class=\"`${prefixCls}-addon-before`\">\n          {{ props.addonBefore }}\n        </div>\n      </template>\n      <div\n        :class=\"[\n          ns.e('content'),\n          formlayout.fullness && 'is-fullness',\n          ns.is('addon-after', !!props.addonAfter),\n        ]\" :style=\"contentStyle\"\n      >\n        <ElTooltip\n          v-if=\"formlayout.feedbackLayout === 'popover'\"\n          ref=\"feedbackTooltipRef\"\n          :visible=\"!!props.feedbackText\"\n          effect=\"light\"\n          :offset=\"6\"\n        >\n          <template #default>\n            <slot />\n          </template>\n          <template #content>\n            <div :class=\"[...validateClasses, ns.is('tooltip')]\">\n              <ElIcon>\n                <CircleClose v-if=\"props.feedbackStatus === 'error'\" />\n                <CircleCheck v-if=\"props.feedbackStatus === 'success'\" />\n                <Warning v-if=\"props.feedbackStatus === 'warning'\" />\n              </ElIcon>\n              {{ props.feedbackText }}\n            </div>\n          </template>\n        </ElTooltip>\n        <slot v-else />\n        <TransitionGroup :name=\"`${ns.namespace.value}-zoom-in-top`\">\n          <div v-if=\"props.feedbackText && formlayout.feedbackLayout !== 'popover'\" :class=\"validateClasses\">\n            {{ props.feedbackText }}\n          </div>\n          <template v-if=\"isValid(props.extra)\">\n            <template v-if=\"isVNode(props.extra)\">\n              <component :is=\"props.extra\" />\n            </template>\n            <div v-else :class=\"`${prefixCls}-extra`\">\n              {{ props.extra }}\n            </div>\n          </template>\n        </TransitionGroup>\n      </div>\n      <template v-if=\"isValid(props.addonAfter)\">\n        <template v-if=\"isVNode(props.addonAfter)\">\n          <component :is=\"props.addonAfter\" />\n        </template>\n        <div v-else :class=\"`${prefixCls}-addon-after`\">\n          {{ props.addonAfter }}\n        </div>\n      </template>\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}