@silver-formily/element-plus 3.0.2 → 4.0.1

package/esm/editable/editable.mjs

@@ -0,0 +1,113 @@
+import { stylePrefix } from "../__builtins__/configs/index.mjs";
+import _sfc_main$1 from "../form-item/form-item.mjs";
+import { ClickOutside } from "element-plus";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, nextTick, normalizeClass, openBlock, ref, renderSlot, unref, withCtx, withDirectives } from "vue";
+import { useField } from "@silver-formily/vue";
+import { isPlainObj, isValid } from "@formily/shared";
+import { omit } from "lodash-es";
+import { Close, Edit } from "@element-plus/icons-vue";
+//#region src/editable/editable.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	name: "FEditable",
+	__name: "editable",
+	props: {
+		internalFormItemClass: {},
+		label: {},
+		for: {},
+		tooltip: {},
+		addonBefore: {},
+		addonAfter: {},
+		extra: {},
+		feedbackText: {},
+		feedbackStatus: {},
+		asterisk: { type: Boolean },
+		colon: { type: Boolean },
+		labelAlign: {},
+		wrapperAlign: {},
+		labelWrap: { type: Boolean },
+		labelWidth: {},
+		wrapperWidth: {},
+		labelCol: {},
+		wrapperCol: {},
+		fullness: { type: Boolean },
+		size: { default: "default" },
+		layout: {},
+		feedbackLayout: { default: "popover" },
+		tooltipLayout: {},
+		editProps: {}
+	},
+	setup(__props) {
+		const props = __props;
+		const fieldRef = useField();
+		const innerRef = ref(null);
+		const prefixCls = `${stylePrefix}-editable`;
+		const formItemRef = ref(null);
+		const commonProps = computed(() => omit(props, "editProps"));
+		const editProps = computed(() => {
+			if (isPlainObj(props.editProps)) return {
+				...omit(props, "editProps"),
+				...props.editProps
+			};
+			return omit(props, "editProps");
+		});
+		function handleEnsureReadPretty() {
+			if (!isValid(fieldRef.value.data)) fieldRef.value.data = {};
+		}
+		handleEnsureReadPretty();
+		fieldRef.value.data.readPretty = true;
+		async function onClick() {
+			if (fieldRef.value.disabled) return;
+			handleEnsureReadPretty();
+			fieldRef.value.data.readPretty = false;
+			await nextTick();
+			formItemRef.value.feedbackTooltipRef.updatePopper();
+			innerRef.value?.querySelector("input")?.focus();
+		}
+		function onClickOutside() {
+			if (fieldRef.value.data?.readPretty === true) return;
+			handleEnsureReadPretty();
+			setTimeout(async () => {
+				fieldRef.value.data.readPretty = true;
+				await nextTick();
+				formItemRef.value?.feedbackTooltipRef.updatePopper();
+			}, 0);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "innerRef",
+				ref: innerRef,
+				class: normalizeClass([prefixCls, unref(fieldRef).disabled && "is-disabled"])
+			}, [withDirectives((openBlock(), createElementBlock("div", { class: normalizeClass(`${prefixCls}-content`) }, [createVNode(unref(_sfc_main$1), mergeProps({
+				ref_key: "formItemRef",
+				ref: formItemRef
+			}, unref(fieldRef).data?.readPretty === false ? editProps.value : commonProps.value, { onClick }), {
+				default: withCtx(() => [createElementVNode("div", null, [renderSlot(_ctx.$slots, "default")])]),
+				_: 3
+			}, 16), !unref(fieldRef).disabled ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [unref(fieldRef).data?.readPretty === true ? (openBlock(), createBlock(unref(_sfc_main$1), {
+				key: 0,
+				size: props.size,
+				"feedback-layout": props.feedbackLayout
+			}, {
+				default: withCtx(() => [createVNode(unref(Edit), {
+					class: normalizeClass(`${prefixCls}-edit-btn`),
+					onClick
+				}, null, 8, ["class"])]),
+				_: 1
+			}, 8, ["size", "feedback-layout"])) : (openBlock(), createBlock(unref(_sfc_main$1), {
+				key: 1,
+				size: props.size,
+				"feedback-layout": props.feedbackLayout
+			}, {
+				default: withCtx(() => [createVNode(unref(Close), {
+					class: normalizeClass(`${prefixCls}-close-btn`),
+					onClick: onClickOutside
+				}, null, 8, ["class"])]),
+				_: 1
+			}, 8, ["size", "feedback-layout"]))], 64)) : createCommentVNode("v-if", true)], 2)), [[unref(ClickOutside), onClickOutside]])], 2);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=editable.mjs.map

package/esm/editable/editable.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"editable.mjs","names":[],"sources":["../../src/editable/editable.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Field } from '@formily/core'\nimport type { IFormItemProps } from '../form-item/types'\nimport { Close, Edit } from '@element-plus/icons-vue'\nimport { isPlainObj, isValid } from '@formily/shared'\nimport { useField } from '@silver-formily/vue'\nimport { ClickOutside as vClickOutside } from 'element-plus'\nimport { omit } from 'lodash-es'\nimport { computed, nextTick, ref } from 'vue'\nimport { stylePrefix } from '../__builtins__/configs'\nimport { FormBaseItem } from '../form-item'\n\ndefineOptions({\n  name: 'FEditable',\n})\n\nconst props = withDefaults(defineProps<IFormItemProps & { editProps?: IFormItemProps }>(), {\n  feedbackLayout: 'popover',\n  size: 'default',\n})\n\nconst fieldRef = useField<Field>()\nconst innerRef = ref<HTMLElement>(null)\nconst prefixCls = `${stylePrefix}-editable`\nconst formItemRef = ref<InstanceType<typeof FormBaseItem>>(null)\n\nconst commonProps = computed(() => omit(props, 'editProps'))\nconst editProps = computed(() => {\n  if (isPlainObj(props.editProps)) {\n    return { ...omit(props, 'editProps'), ...props.editProps }\n  }\n  return omit(props, 'editProps')\n})\n\nfunction handleEnsureReadPretty() {\n  if (!isValid(fieldRef.value.data)) {\n    fieldRef.value.data = {}\n  }\n}\n\nhandleEnsureReadPretty()\nfieldRef.value.data.readPretty = true\n\nasync function onClick() {\n  if (fieldRef.value.disabled)\n    return\n  handleEnsureReadPretty()\n  fieldRef.value.data.readPretty = false\n  await nextTick()\n  formItemRef.value.feedbackTooltipRef.updatePopper()\n  innerRef.value?.querySelector('input')?.focus()\n}\n\nfunction onClickOutside() {\n  if (fieldRef.value.data?.readPretty === true)\n    return\n  handleEnsureReadPretty()\n  // 使用下拉菜单等触发的事件完成应有的操作\n  setTimeout(async () => {\n    fieldRef.value.data.readPretty = true\n    await nextTick()\n    formItemRef.value?.feedbackTooltipRef.updatePopper()\n  }, 0)\n}\n</script>\n\n<template>\n  <div ref=\"innerRef\" :class=\"[prefixCls, fieldRef.disabled && 'is-disabled']\">\n    <div v-click-outside=\"onClickOutside\" :class=\"`${prefixCls}-content`\">\n      <FormBaseItem ref=\"formItemRef\" v-bind=\"fieldRef.data?.readPretty === false ? editProps : commonProps\" @click=\"onClick\">\n        <div>\n          <slot />\n        </div>\n      </FormBaseItem>\n      <template v-if=\"!fieldRef.disabled\">\n        <template v-if=\"fieldRef.data?.readPretty === true\">\n          <FormBaseItem :size=\"props.size\" :feedback-layout=\"props.feedbackLayout\">\n            <Edit :class=\"`${prefixCls}-edit-btn`\" @click=\"onClick\" />\n          </FormBaseItem>\n        </template>\n        <template v-else>\n          <FormBaseItem :size=\"props.size\" :feedback-layout=\"props.feedbackLayout\">\n            <Close :class=\"`${prefixCls}-close-btn`\" @click=\"onClickOutside\" />\n          </FormBaseItem>\n        </template>\n      </template>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgBA,MAAM,QAAQ;EAKd,MAAM,WAAW,UAAgB;EACjC,MAAM,WAAW,IAAiB,KAAI;EACtC,MAAM,YAAY,GAAG,YAAY;EACjC,MAAM,cAAc,IAAuC,KAAI;EAE/D,MAAM,cAAc,eAAe,KAAK,OAAO,YAAY,CAAA;EAC3D,MAAM,YAAY,eAAe;AAC/B,OAAI,WAAW,MAAM,UAAU,CAC7B,QAAO;IAAE,GAAG,KAAK,OAAO,YAAY;IAAE,GAAG,MAAM;IAAU;AAE3D,UAAO,KAAK,OAAO,YAAW;IAC/B;EAED,SAAS,yBAAyB;AAChC,OAAI,CAAC,QAAQ,SAAS,MAAM,KAAK,CAC/B,UAAS,MAAM,OAAO,EAAC;;AAI3B,0BAAuB;AACvB,WAAS,MAAM,KAAK,aAAa;EAEjC,eAAe,UAAU;AACvB,OAAI,SAAS,MAAM,SACjB;AACF,2BAAuB;AACvB,YAAS,MAAM,KAAK,aAAa;AACjC,SAAM,UAAS;AACf,eAAY,MAAM,mBAAmB,cAAa;AAClD,YAAS,OAAO,cAAc,QAAQ,EAAE,OAAM;;EAGhD,SAAS,iBAAiB;AACxB,OAAI,SAAS,MAAM,MAAM,eAAe,KACtC;AACF,2BAAuB;AAEvB,cAAW,YAAY;AACrB,aAAS,MAAM,KAAK,aAAa;AACjC,UAAM,UAAS;AACf,gBAAY,OAAO,mBAAmB,cAAa;MAClD,EAAC;;;uBAKJ,mBAoBM,OAAA;aApBG;IAAJ,KAAI;IAAY,OAAK,eAAA,CAAG,WAAW,MAAA,SAAQ,CAAC,YAAQ,cAAA,CAAA;oCACvD,mBAkBM,OAAA,EAlBiC,OAAK,eAAA,GAAK,UAAS,UAAA,EAAA,EAAA,CACxD,YAIe,MAAA,YAAA,EAJf,WAIe;aAJG;IAAJ,KAAI;MAAsB,MAAA,SAAQ,CAAC,MAAM,eAAU,QAAa,UAAA,QAAY,YAAA,OAAW,EAAU,SAAO,CAAA,EAAA;2BAG9G,CAFN,mBAEM,OAAA,MAAA,CADJ,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA,CAAA,CAAA;;YAGK,MAAA,SAAQ,CAAC,YAAA,WAAA,EAA1B,mBAWW,UAAA,EAAA,KAAA,GAAA,EAAA,CAVO,MAAA,SAAQ,CAAC,MAAM,eAAU,QAAA,WAAA,EACvC,YAEe,MAAA,YAAA,EAAA;;IAFA,MAAM,MAAM;IAAO,mBAAiB,MAAM;;2BACG,CAA1D,YAA0D,MAAA,KAAA,EAAA;KAAnD,OAAK,eAAA,GAAK,UAAS,WAAA;KAAqB;;;uDAIjD,YAEe,MAAA,YAAA,EAAA;;IAFA,MAAM,MAAM;IAAO,mBAAiB,MAAM;;2BACY,CAAnE,YAAmE,MAAA,MAAA,EAAA;KAA3D,OAAK,eAAA,GAAK,UAAS,YAAA;KAAe,SAAO;;;+GAdnC,eAAc,CAAA,CAAA,CAAA,EAAA,EAAA"}

package/esm/editable/index.d.ts

@@ -1,150 +1,69 @@
-import { ElPopover } from 'element-plus';
-import { IFormItemProps } from '../form-item/types';
-export type EditableProps = IFormItemProps;
-export type EditablePopoverProps = typeof ElPopover;
-export declare const Editable: {
-    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<IFormItemProps & {
-        editProps?: IFormItemProps;
-    }> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
-        size: "small" | "default" | "large";
-        feedbackLayout: "loose" | "terse" | "popover";
-    }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
-        innerRef: HTMLDivElement;
-        formItemRef: {
-            $: import('vue').ComponentInternalInstance;
-            $data: {};
-            $props: Partial<{
-                asterisk: boolean;
-                colon: boolean;
-                labelWrap: boolean;
-                fullness: boolean;
-            }> & Omit<{
-                readonly internalFormItemClass?: string;
-                readonly label?: import('../form-item/types').FormItemContent;
-                readonly for?: string;
-                readonly tooltip?: import('../form-item/types').FormItemContent;
-                readonly addonBefore?: import('../form-item/types').FormItemContent;
-                readonly addonAfter?: import('../form-item/types').FormItemContent;
-                readonly extra?: import('../form-item/types').FormItemContent;
-                readonly feedbackText?: import('../form-item/types').FormItemContent;
-                readonly feedbackStatus?: "error" | "warning" | "success" | "pending";
-                readonly asterisk?: boolean;
-                readonly colon?: boolean;
-                readonly labelAlign?: "right" | "left";
-                readonly wrapperAlign?: "right" | "left";
-                readonly labelWrap?: boolean;
-                readonly labelWidth?: number;
-                readonly wrapperWidth?: number;
-                readonly labelCol?: number;
-                readonly wrapperCol?: number;
-                readonly fullness?: boolean;
-                readonly size?: "small" | "default" | "large";
-                readonly layout?: "vertical" | "horizontal" | "inline" | ("vertical" | "horizontal" | "inline")[];
-                readonly feedbackLayout?: "loose" | "terse" | "popover";
-                readonly tooltipLayout?: "icon" | "text";
-            } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "asterisk" | "colon" | "labelWrap" | "fullness">;
-            $attrs: {
-                [x: string]: unknown;
-            };
-            $refs: any;
-            $slots: Readonly<{
-                [name: string]: import('vue').Slot<any>;
-            }>;
-            $root: import('vue').ComponentPublicInstance | null;
-            $parent: import('vue').ComponentPublicInstance | null;
-            $host: Element | null;
-            $emit: (event: string, ...args: any[]) => void;
-            $el: any;
-            $options: import('vue').ComponentOptionsBase<Readonly<IFormItemProps> & Readonly<{}>, {
-                feedbackTooltipRef: import('vue').Ref<import('element-plus').TooltipInstance, import('element-plus').TooltipInstance>;
-            }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
-                asterisk: boolean;
-                colon: boolean;
-                labelWrap: boolean;
-                fullness: boolean;
-            }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
-                beforeCreate?: (() => void) | (() => void)[];
-                created?: (() => void) | (() => void)[];
-                beforeMount?: (() => void) | (() => void)[];
-                mounted?: (() => void) | (() => void)[];
-                beforeUpdate?: (() => void) | (() => void)[];
-                updated?: (() => void) | (() => void)[];
-                activated?: (() => void) | (() => void)[];
-                deactivated?: (() => void) | (() => void)[];
-                beforeDestroy?: (() => void) | (() => void)[];
-                beforeUnmount?: (() => void) | (() => void)[];
-                destroyed?: (() => void) | (() => void)[];
-                unmounted?: (() => void) | (() => void)[];
-                renderTracked?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
-                renderTriggered?: ((e: import('vue').DebuggerEvent) => void) | ((e: import('vue').DebuggerEvent) => void)[];
-                errorCaptured?: ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import('vue').ComponentPublicInstance | null, info: string) => boolean | void)[];
-            };
-            $forceUpdate: () => void;
-            $nextTick: typeof import('vue').nextTick;
-            $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
-        } & Readonly<{
-            asterisk: boolean;
-            colon: boolean;
-            labelWrap: boolean;
-            fullness: boolean;
-        }> & Omit<Readonly<IFormItemProps> & Readonly<{}>, ("asterisk" | "colon" | "labelWrap" | "fullness") | "feedbackTooltipRef"> & import('vue').ShallowUnwrapRef<{
-            feedbackTooltipRef: import('vue').Ref<import('element-plus').TooltipInstance, import('element-plus').TooltipInstance>;
-        }> & {} & import('vue').ComponentCustomProperties & {} & {
-            $slots: any;
-        };
-    }, HTMLDivElement, import('vue').ComponentProvideOptions, {
-        P: {};
-        B: {};
-        D: {};
-        C: {};
-        M: {};
-        Defaults: {};
-    }, Readonly<IFormItemProps & {
-        editProps?: IFormItemProps;
-    }> & Readonly<{}>, {}, {}, {}, {}, {
-        size: "small" | "default" | "large";
-        feedbackLayout: "loose" | "terse" | "popover";
+import { IFormItemProps } from "../form-item/types.js";
+import { ElPopover } from "element-plus";
+import * as _$vue from "vue";
+
+//#region src/editable/index.d.ts
+type EditableProps = IFormItemProps;
+type EditablePopoverProps = typeof ElPopover;
+declare const Editable: {
+  new (...args: any[]): _$vue.CreateComponentPublicInstanceWithMixins<Readonly<IFormItemProps & {
+    editProps?: IFormItemProps;
+  }> & Readonly<{}>, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, _$vue.PublicProps, {
+    size: "small" | "default" | "large";
+    feedbackLayout: "loose" | "terse" | "popover";
+  }, true, {}, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, {}, any, _$vue.ComponentProvideOptions, {
+    P: {};
+    B: {};
+    D: {};
+    C: {};
+    M: {};
+    Defaults: {};
+  }, Readonly<IFormItemProps & {
+    editProps?: IFormItemProps;
+  }> & Readonly<{}>, {}, {}, {}, {}, {
+    size: "small" | "default" | "large";
+    feedbackLayout: "loose" | "terse" | "popover";
+  }>;
+  __isFragment?: never;
+  __isTeleport?: never;
+  __isSuspense?: never;
+} & _$vue.ComponentOptionsBase<Readonly<IFormItemProps & {
+  editProps?: IFormItemProps;
+}> & Readonly<{}>, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, {
+  size: "small" | "default" | "large";
+  feedbackLayout: "loose" | "terse" | "popover";
+}, {}, string, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, _$vue.ComponentProvideOptions> & _$vue.VNodeProps & _$vue.AllowedComponentProps & _$vue.ComponentCustomProps & (new () => {
+  $slots: {
+    default?: (props: {}) => any;
+  };
+}) & {
+  Popover: {
+    new (...args: any[]): _$vue.CreateComponentPublicInstanceWithMixins<Readonly<IFormItemProps> & Readonly<{}>, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, _$vue.PublicProps, {
+      size: "small" | "default" | "large";
+      feedbackLayout: "loose" | "terse" | "popover";
+    }, true, {}, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, {}, any, _$vue.ComponentProvideOptions, {
+      P: {};
+      B: {};
+      D: {};
+      C: {};
+      M: {};
+      Defaults: {};
+    }, Readonly<IFormItemProps> & Readonly<{}>, {}, {}, {}, {}, {
+      size: "small" | "default" | "large";
+      feedbackLayout: "loose" | "terse" | "popover";
     }>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
-} & import('vue').ComponentOptionsBase<Readonly<IFormItemProps & {
-    editProps?: IFormItemProps;
-}> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+  } & _$vue.ComponentOptionsBase<Readonly<IFormItemProps> & Readonly<{}>, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, {
     size: "small" | "default" | "large";
     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 () => {
+  }, {}, string, {}, _$vue.GlobalComponents, _$vue.GlobalDirectives, string, _$vue.ComponentProvideOptions> & _$vue.VNodeProps & _$vue.AllowedComponentProps & _$vue.ComponentCustomProps & (new () => {
     $slots: {
-        default?(_: {}): any;
+      default?: (props: {}) => any;
     };
-}) & {
-    Popover: {
-        new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<IFormItemProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
-            size: "small" | "default" | "large";
-            feedbackLayout: "loose" | "terse" | "popover";
-        }, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
-            contentRef: HTMLDivElement;
-        }, any, import('vue').ComponentProvideOptions, {
-            P: {};
-            B: {};
-            D: {};
-            C: {};
-            M: {};
-            Defaults: {};
-        }, Readonly<IFormItemProps> & Readonly<{}>, {}, {}, {}, {}, {
-            size: "small" | "default" | "large";
-            feedbackLayout: "loose" | "terse" | "popover";
-        }>;
-        __isFragment?: never;
-        __isTeleport?: never;
-        __isSuspense?: never;
-    } & import('vue').ComponentOptionsBase<Readonly<IFormItemProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
-        size: "small" | "default" | "large";
-        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: {
-            default?(_: {}): any;
-        };
-    });
+  });
 };
-export default Editable;
+//#endregion
+export { Editable, EditablePopoverProps, EditableProps };
+//# sourceMappingURL=index.d.ts.map

package/esm/editable/index.mjs

@@ -1,219 +1,17 @@
-import { useField as x, connect as E, mapProps as w } from "@silver-formily/vue";
-import { ElPopover as O, ElText as S, ClickOutside as R } from "element-plus";
-import { reactionWatch as V } from "@silver-formily/reactive-vue";
-import "@vueuse/core";
-import { defineComponent as z, ref as m, openBlock as n, createElementBlock as c, normalizeClass as i, createVNode as u, unref as t, mergeProps as P, withCtx as d, withDirectives as F, createBlock as C, createElementVNode as _, createTextVNode as q, toDisplayString as D, renderSlot as T, computed as g, Fragment as N, createCommentVNode as M, nextTick as h } from "vue";
-import "@formily/core";
-import { composeExport as j } from "../__builtins__/shared/utils.mjs";
-import { FormBaseItem as f, fieldFeedbackMapper as A } from "../form-item/index.mjs";
-import { Edit as W, Close as G } from "@element-plus/icons-vue";
-import { isValid as $, isPlainObj as H } from "@formily/shared";
-import { stylePrefix as I } from "../__builtins__/configs/index.mjs";
-import { o as k } from "../vendor/lodash.mjs";
-import '../styles/editable/index.css';const J = /* @__PURE__ */ z({
-  name: "FEditablePopover",
-  inheritAttrs: !1,
-  __name: "editable-popover",
-  props: {
-    internalFormItemClass: {},
-    label: {},
-    for: {},
-    tooltip: {},
-    addonBefore: {},
-    addonAfter: {},
-    extra: {},
-    feedbackText: {},
-    feedbackStatus: {},
-    asterisk: { type: Boolean },
-    colon: { type: Boolean },
-    labelAlign: {},
-    wrapperAlign: {},
-    labelWrap: { type: Boolean },
-    labelWidth: {},
-    wrapperWidth: {},
-    labelCol: {},
-    wrapperCol: {},
-    fullness: { type: Boolean },
-    size: { default: "default" },
-    layout: {},
-    feedbackLayout: { default: "popover" },
-    tooltipLayout: {}
-  },
-  setup(b) {
-    const a = b, e = x(), r = `${I}-editable`, s = m(), l = m(!1);
-    $(e.value.data) ? $(e.value.data.readPretty) || (e.value.data.readPretty = !0) : (e.value.data = {}, e.value.data.readPretty = !0);
-    function v(o) {
-      s.value.parentElement.contains(o.target) || (l.value = !1);
-    }
-    function y() {
-      l.value = !0;
-    }
-    return V(
-      () => e.value.form.queryFeedbacks({
-        type: "error",
-        address: `${e.value.address.entire}.*`
-      }),
-      (o) => {
-        o.length > 0 && (l.value = !0);
-      }
-    ), (o, p) => (n(), c("div", {
-      class: i(r)
-    }, [
-      u(t(O), P(o.$attrs, {
-        visible: l.value,
-        title: o.$attrs.title || t(e).title,
-        trigger: "click",
-        width: "auto"
-      }), {
-        default: d(() => [
-          _("div", {
-            ref_key: "contentRef",
-            ref: s,
-            class: i(`${r}-popover-wrapper`)
-          }, [
-            T(o.$slots, "default")
-          ], 2)
-        ]),
-        reference: d(() => [
-          F((n(), C(t(f), P(a, {
-            class: `${r}-trigger`
-          }), {
-            default: d(() => [
-              _("div", {
-                class: i(`${r}-content`),
-                onClick: y
-              }, [
-                u(t(S), null, {
-                  default: d(() => [
-                    q(D(t(e).title), 1)
-                  ]),
-                  _: 1
-                }),
-                u(t(W), {
-                  class: i(`${r}-edit-btn`)
-                }, null, 8, ["class"])
-              ], 2)
-            ]),
-            _: 1
-          }, 16, ["class"])), [
-            [t(R), v]
-          ])
-        ]),
-        _: 3
-      }, 16, ["visible", "title"])
-    ]));
-  }
-}), K = /* @__PURE__ */ z({
-  name: "FEditable",
-  __name: "editable",
-  props: {
-    internalFormItemClass: {},
-    label: {},
-    for: {},
-    tooltip: {},
-    addonBefore: {},
-    addonAfter: {},
-    extra: {},
-    feedbackText: {},
-    feedbackStatus: {},
-    asterisk: { type: Boolean },
-    colon: { type: Boolean },
-    labelAlign: {},
-    wrapperAlign: {},
-    labelWrap: { type: Boolean },
-    labelWidth: {},
-    wrapperWidth: {},
-    labelCol: {},
-    wrapperCol: {},
-    fullness: { type: Boolean },
-    size: { default: "default" },
-    layout: {},
-    feedbackLayout: { default: "popover" },
-    tooltipLayout: {},
-    editProps: {}
-  },
-  setup(b) {
-    const a = b, e = x(), r = m(null), s = `${I}-editable`, l = m(null), v = g(() => k(a, "editProps")), y = g(() => H(a.editProps) ? { ...k(a, "editProps"), ...a.editProps } : k(a, "editProps"));
-    function o() {
-      $(e.value.data) || (e.value.data = {});
-    }
-    o(), e.value.data.readPretty = !0;
-    async function p() {
-      e.value.disabled || (o(), e.value.data.readPretty = !1, await h(), l.value.feedbackTooltipRef.updatePopper(), r.value?.querySelector("input")?.focus());
-    }
-    function B() {
-      e.value.data?.readPretty !== !0 && (o(), setTimeout(async () => {
-        e.value.data.readPretty = !0, await h(), l.value?.feedbackTooltipRef.updatePopper();
-      }, 0));
-    }
-    return (L, X) => (n(), c("div", {
-      ref_key: "innerRef",
-      ref: r,
-      class: i([s, t(e).disabled && "is-disabled"])
-    }, [
-      F((n(), c("div", {
-        class: i(`${s}-content`)
-      }, [
-        u(t(f), P({
-          ref_key: "formItemRef",
-          ref: l
-        }, t(e).data?.readPretty === !1 ? y.value : v.value, { onClick: p }), {
-          default: d(() => [
-            _("div", null, [
-              T(L.$slots, "default")
-            ])
-          ]),
-          _: 3
-        }, 16),
-        t(e).disabled ? M("", !0) : (n(), c(N, { key: 0 }, [
-          t(e).data?.readPretty === !0 ? (n(), C(t(f), {
-            key: 0,
-            size: a.size,
-            "feedback-layout": a.feedbackLayout
-          }, {
-            default: d(() => [
-              u(t(W), {
-                class: i(`${s}-edit-btn`),
-                onClick: p
-              }, null, 8, ["class"])
-            ]),
-            _: 1
-          }, 8, ["size", "feedback-layout"])) : (n(), C(t(f), {
-            key: 1,
-            size: a.size,
-            "feedback-layout": a.feedbackLayout
-          }, {
-            default: d(() => [
-              u(t(G), {
-                class: i(`${s}-close-btn`),
-                onClick: B
-              }, null, 8, ["class"])
-            ]),
-            _: 1
-          }, 8, ["size", "feedback-layout"]))
-        ], 64))
-      ], 2)), [
-        [t(R), B]
-      ])
-    ], 2));
-  }
-}), Q = E(K, w(
-  {
-    required: !0,
-    description: "extra"
-  },
-  A
-)), U = E(J, w(
-  {
-    required: !0,
-    description: "extra"
-  },
-  A
-)), ue = j(Q, {
-  Popover: U
-});
-export {
-  ue as Editable,
-  ue as default
-};
-//# sourceMappingURL=index.mjs.map
+import { composeExport } from "../__builtins__/shared/utils.mjs";
+import { fieldFeedbackMapper } from "../form-item/index.mjs";
+import _sfc_main from "./editable-popover.mjs";
+import _sfc_main$1 from "./editable.mjs";
+import "./style.css";
+import { connect, mapProps } from "@silver-formily/vue";
+const Editable = composeExport(connect(_sfc_main$1, mapProps({
+	required: true,
+	description: "extra"
+}, fieldFeedbackMapper)), { Popover: connect(_sfc_main, mapProps({
+	required: true,
+	description: "extra"
+}, fieldFeedbackMapper)) });
+//#endregion
+export { Editable as default };
+
+//# sourceMappingURL=index.mjs.map

package/esm/editable/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/editable/editable-popover.vue","../../src/editable/editable.vue","../../src/editable/index.ts"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Field } from '@formily/core'\nimport type { IFormItemProps } from '../form-item/types'\nimport { Edit } from '@element-plus/icons-vue'\nimport { isValid } from '@formily/shared'\nimport { reactionWatch } from '@silver-formily/reactive-vue'\nimport { useField } from '@silver-formily/vue'\nimport { ElPopover, ElText, ClickOutside as vClickOutside } from 'element-plus'\nimport { ref } from 'vue'\nimport { stylePrefix } from '../__builtins__/configs'\nimport { FormBaseItem } from '../form-item'\n\ndefineOptions({\n  name: 'FEditablePopover',\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<IFormItemProps>(), {\n  feedbackLayout: 'popover',\n  size: 'default',\n})\n\nconst fieldRef = useField<Field>()\nconst prefixCls = `${stylePrefix}-editable`\nconst contentRef = ref<HTMLElement>()\nconst visible = ref(false)\n\nif (isValid(fieldRef.value.data)) {\n  /* istanbul ignore else -- @preserve */\n  if (!isValid(fieldRef.value.data.readPretty)) {\n    fieldRef.value.data.readPretty = true\n  }\n}\nelse {\n  fieldRef.value.data = {}\n  fieldRef.value.data.readPretty = true\n}\n\nfunction onClickOutside(e) {\n  const popoverDOM = contentRef.value.parentElement\n  /* istanbul ignore else -- @preserve */\n  if (!popoverDOM.contains(e.target)) {\n    visible.value = false\n  }\n}\nfunction onClick() {\n  visible.value = true\n}\n\nreactionWatch(\n  () => fieldRef.value.form.queryFeedbacks({\n    type: 'error',\n    address: `${fieldRef.value.address.entire}.*`,\n  }),\n  (errorList) => {\n    if (errorList.length > 0) {\n      visible.value = true\n    }\n  },\n)\n</script>\n\n<template>\n  <div :class=\"prefixCls\">\n    <ElPopover\n      v-bind=\"$attrs\"\n      :visible=\"visible\"\n      :title=\"$attrs.title || fieldRef.title\" trigger=\"click\" width=\"auto\"\n    >\n      <template #default>\n        <div ref=\"contentRef\" :class=\"`${prefixCls}-popover-wrapper`\">\n          <slot />\n        </div>\n      </template>\n      <template #reference>\n        <FormBaseItem v-click-outside=\"onClickOutside\" v-bind=\"props\" :class=\"`${prefixCls}-trigger`\">\n          <div :class=\"`${prefixCls}-content`\" @click=\"onClick\">\n            <ElText>\n              {{ fieldRef.title }}\n            </ElText>\n            <Edit :class=\"`${prefixCls}-edit-btn`\" />\n          </div>\n        </FormBaseItem>\n      </template>\n    </ElPopover>\n  </div>\n</template>\n","<script lang=\"ts\" setup>\nimport type { Field } from '@formily/core'\nimport type { IFormItemProps } from '../form-item/types'\nimport { Close, Edit } from '@element-plus/icons-vue'\nimport { isPlainObj, isValid } from '@formily/shared'\nimport { useField } from '@silver-formily/vue'\nimport { ClickOutside as vClickOutside } from 'element-plus'\nimport { omit } from 'lodash-es'\nimport { computed, nextTick, ref } from 'vue'\nimport { stylePrefix } from '../__builtins__/configs'\nimport { FormBaseItem } from '../form-item'\n\ndefineOptions({\n  name: 'FEditable',\n})\n\nconst props = withDefaults(defineProps<IFormItemProps & { editProps?: IFormItemProps }>(), {\n  feedbackLayout: 'popover',\n  size: 'default',\n})\n\nconst fieldRef = useField<Field>()\nconst innerRef = ref<HTMLElement>(null)\nconst prefixCls = `${stylePrefix}-editable`\nconst formItemRef = ref<InstanceType<typeof FormBaseItem>>(null)\n\nconst commonProps = computed(() => omit(props, 'editProps'))\nconst editProps = computed(() => {\n  if (isPlainObj(props.editProps)) {\n    return { ...omit(props, 'editProps'), ...props.editProps }\n  }\n  return omit(props, 'editProps')\n})\n\nfunction handleEnsureReadPretty() {\n  if (!isValid(fieldRef.value.data)) {\n    fieldRef.value.data = {}\n  }\n}\n\nhandleEnsureReadPretty()\nfieldRef.value.data.readPretty = true\n\nasync function onClick() {\n  if (fieldRef.value.disabled)\n    return\n  handleEnsureReadPretty()\n  fieldRef.value.data.readPretty = false\n  await nextTick()\n  formItemRef.value.feedbackTooltipRef.updatePopper()\n  innerRef.value?.querySelector('input')?.focus()\n}\n\nfunction onClickOutside() {\n  if (fieldRef.value.data?.readPretty === true)\n    return\n  handleEnsureReadPretty()\n  // 使用下拉菜单等触发的事件完成应有的操作\n  setTimeout(async () => {\n    fieldRef.value.data.readPretty = true\n    await nextTick()\n    formItemRef.value?.feedbackTooltipRef.updatePopper()\n  }, 0)\n}\n</script>\n\n<template>\n  <div ref=\"innerRef\" :class=\"[prefixCls, fieldRef.disabled && 'is-disabled']\">\n    <div v-click-outside=\"onClickOutside\" :class=\"`${prefixCls}-content`\">\n      <FormBaseItem ref=\"formItemRef\" v-bind=\"fieldRef.data?.readPretty === false ? editProps : commonProps\" @click=\"onClick\">\n        <div>\n          <slot />\n        </div>\n      </FormBaseItem>\n      <template v-if=\"!fieldRef.disabled\">\n        <template v-if=\"fieldRef.data?.readPretty === true\">\n          <FormBaseItem :size=\"props.size\" :feedback-layout=\"props.feedbackLayout\">\n            <Edit :class=\"`${prefixCls}-edit-btn`\" @click=\"onClick\" />\n          </FormBaseItem>\n        </template>\n        <template v-else>\n          <FormBaseItem :size=\"props.size\" :feedback-layout=\"props.feedbackLayout\">\n            <Close :class=\"`${prefixCls}-close-btn`\" @click=\"onClickOutside\" />\n          </FormBaseItem>\n        </template>\n      </template>\n    </div>\n  </div>\n</template>\n","import type { ElPopover } from 'element-plus'\nimport type { IFormItemProps } from '../form-item/types'\nimport { connect, mapProps } from '@silver-formily/vue'\nimport { composeExport } from '../__builtins__/shared'\nimport { fieldFeedbackMapper } from '../form-item'\nimport FEditablePopover from './editable-popover.vue'\nimport FEditable from './editable.vue'\nimport './style.scss'\n\nexport type EditableProps = IFormItemProps\nexport type EditablePopoverProps = typeof ElPopover\n\nconst EditableInner = connect<typeof FEditable>(FEditable, mapProps(\n  {\n    required: true,\n    description: 'extra',\n  },\n  fieldFeedbackMapper,\n))\n\nconst EditablePopover = connect<typeof FEditablePopover>(FEditablePopover, mapProps(\n  {\n    required: true,\n    description: 'extra',\n  },\n  fieldFeedbackMapper,\n))\n\nexport const Editable = composeExport(EditableInner, {\n  Popover: EditablePopover,\n})\n\nexport default Editable\n"],"names":["props","__props","fieldRef","useField","prefixCls","stylePrefix","contentRef","ref","visible","isValid","onClickOutside","e","onClick","reactionWatch","errorList","_createElementBlock","_createVNode","_unref","ElPopover","_mergeProps","_ctx","$attrs","_createElementVNode","_renderSlot","_createBlock","FormBaseItem","ElText","_createTextVNode","_toDisplayString","Edit","innerRef","formItemRef","commonProps","computed","omit","editProps","isPlainObj","handleEnsureReadPretty","nextTick","_normalizeClass","_Fragment","Close","EditableInner","connect","FEditable","mapProps","fieldFeedbackMapper","EditablePopover","FEditablePopover","Editable","composeExport"],"mappings":"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"}
+{"version":3,"file":"index.mjs","names":["FEditable","FEditablePopover"],"sources":["../../src/editable/index.ts"],"sourcesContent":["import type { ElPopover } from 'element-plus'\nimport type { IFormItemProps } from '../form-item/types'\nimport { connect, mapProps } from '@silver-formily/vue'\nimport { composeExport } from '../__builtins__/shared'\nimport { fieldFeedbackMapper } from '../form-item'\nimport FEditablePopover from './editable-popover.vue'\nimport FEditable from './editable.vue'\nimport './style.scss'\n\nexport type EditableProps = IFormItemProps\nexport type EditablePopoverProps = typeof ElPopover\n\nconst EditableInner = connect<typeof FEditable>(FEditable, mapProps(\n  {\n    required: true,\n    description: 'extra',\n  },\n  fieldFeedbackMapper,\n))\n\nconst EditablePopover = connect<typeof FEditablePopover>(FEditablePopover, mapProps(\n  {\n    required: true,\n    description: 'extra',\n  },\n  fieldFeedbackMapper,\n))\n\nexport const Editable = composeExport(EditableInner, {\n  Popover: EditablePopover,\n})\n\nexport default Editable\n"],"mappings":";;;;;;AA4BA,MAAa,WAAW,cAhBF,QAA0BA,aAAW,SACzD;CACE,UAAU;CACV,aAAa;CACd,EACD,oBACD,CAAC,EAUmD,EACnD,SATsB,QAAiCC,WAAkB,SACzE;CACE,UAAU;CACV,aAAa;CACd,EACD,oBACD,CAAC,EAID,CAAC"}

package/esm/editable/style.css

@@ -0,0 +1,29 @@
+.formily-element-plus-editable {
+  cursor: pointer;
+  display: inline-block !important;
+}
+.formily-element-plus-editable.is-disabled {
+  cursor: not-allowed;
+}
+.formily-element-plus-editable-content {
+  display: flex;
+  align-items: center;
+}
+.formily-element-plus-editable-content > * {
+  margin-right: 3px;
+}
+.formily-element-plus-editable-content > *:last-child {
+  margin-right: 0;
+}
+.formily-element-plus-editable .formily-element-plus-editable-edit-btn,
+.formily-element-plus-editable .formily-element-plus-editable-close-btn {
+  transition: all 0.25s ease-in-out;
+  width: 14px;
+  height: 14px;
+  display: inline;
+  vertical-align: sub;
+}
+.formily-element-plus-editable .formily-element-plus-editable-edit-btn:hover,
+.formily-element-plus-editable .formily-element-plus-editable-close-btn:hover {
+  color: var(--el-color-primary);
+}