cnhis-design-vue 3.3.1-beta.9 → 3.3.1-release.4

package/es/components/iho-table/src/plugins/rendererPlugins/editableWidgets/selectRendererPlugin/index.js

@@ -1 +1,268 @@
-import{reactive as e,inject as o,createVNode as l,mergeProps as n,onBeforeUnmount as t}from"vue";import{arrayed as i}from"../../../../../../../shared/utils/index.js";import"../../../../../index.js";import{EDITABLE_WIDGET_TYPE as r,InjectionIhoTableUUID as d}from"../../../../constants/index.js";import{useAutoFocus as s}from"../hooks/useAutoFocus.js";import{getTitle as u,IhoTableRenderHelper as c,getLowCodeFieldFromField as a,IhoTableUtils as p}from"../../../../utils/index.js";import f from"./editSelect.js";import{getDefaultValue as m,getArray as v}from"./selectUtils.js";import{getSelectOptions as w,selectOptionsMap as h,selectColumnMap as g}from"../hooks/useSelectOption.js";import{isString as C,isFunction as y,isEqual as b}from"lodash-es";import{defineTablePlugin as F}from"../../../../hooks/useTablePlugin.js";function E(){const E="selectRendererPlugin",P=e(new Map);function x(e){return!0===e||"1"===e}return F({name:E,vxe(e){e.renderer.add(r.SELECT,{renderCell({props:e},{row:n,column:t,$table:r}){var s,c,a,p,f,v;const h=o(d),g=w(h,t.field,n,r);if(e&&e.labelToValue&&g.length){const o=x(null!=(c=null==(s=e.componentProps)?void 0:s.allowModify)?c:e.allowModify),l=x(null!=(p=null==(a=e.componentProps)?void 0:a.allowCreate)?p:e.allowCreate)||o,i=n[t.field];if(!o&&!l&&null!=i&&""!==i){const{aliasField:o="",labelField:l="label",valueField:r="value"}=e.componentProps||{};if(!g.find((e=>e[r]===i))){const e=g.find((e=>e[l]===i||e[o]===i));e?n[t.field]=e[r]:Reflect.deleteProperty(n,t.field)}}}const C=m(n,e,g),y=i(C).join(","),b=e&&(null==(f=e.componentProps)?void 0:f.multiple)&&(x(e.variableHeight)||(null==(v=e.componentProps)?void 0:v.indexedText));return[l("span",{title:u(t,y),class:"iho-table__colorAndIcon"},[b?i(C).reduce(((e,o)=>(null!=o&&e.push([o,";",l("br",null,null)]),e)),[]):y])]},renderEdit:c.createRenderEdit((({fieldItem:e,emitFormClick:t,row:i,column:r,$rowIndex:s,$table:u})=>{var c,a,p,m;const v=o(d),h=w(v,r.field,i,u),g=x(null!=(a=null==(c=e.componentProps)?void 0:c.allowModify)?a:e.allowModify),C=x(null!=(m=null==(p=e.componentProps)?void 0:p.allowCreate)?m:e.allowCreate)||g;return[l(f,n({queryOptions:e.queryOptions},e.componentProps,{options:h,column:r,row:i,"row-index":s,value:i[r.field],"onUpdate:value":e=>i[r.field]=e,allowModify:g,allowCreate:C,onClick:t}),null)]}))})},apply(e){async function o(e,o={}){var l,n,t;const i=null==(l=e.editRender)?void 0:l.props;if(!i)return[];let r=v(i.options)||v(null==(n=i.componentProps)?void 0:n.options)||[];if(i.queryOptions)try{const l={column:e,isFullData:!0,...o};r=await(null==(t=i.queryOptions)?void 0:t.call(i,l))}catch(e){console.log(`获取${i.field}_options错误`)}return r}function l(e){return e&&p.getCellType(e)===r.SELECT}s(e).bindAutoFocusConfig(E,r.SELECT,".n-base-selection-input,.n-base-selection-tags"),e.fieldHooks.fieldList.tap(E,((e,{uuid:n})=>{if(n){h.get(n)||h.set(n,{}),P.set(n,e);const t={};e.forEach((e=>{t[e.field]=e})),g.setItemFromUUID(n,{});const i=g.getItemFromUUID(n);e.forEach((e=>{const o=a(e);if(!o||!o.connectField||!C(o.connectField))return;o.connectField.split(",").forEach((o=>{i[o]=i[o]||[],i[o].push(e)}))}));const r=h.get(n);e.forEach((async e=>{var n,t;const d=null==(n=e.editRender)?void 0:n.props;if(e.field&&d&&l(d)&&!(null==(t=i[e.field])?void 0:t.length)){if(y(d.queryOptions)&&r[e.field])return;r[e.field]=[],r[e.field]=await o(e)}}))}return e})),e.dataHooks.data.tap(E,((e,{uuid:n},t)=>{if(!n)return;const i=P.get(n);if(!i||!i.length)return;const r=h.get(n);i.forEach((async n=>{var t;const d=null==(t=n.editRender)?void 0:t.props;if(n.field&&d&&l(d)&&(null==d?void 0:d.connectField)){const l=d.connectField.split(","),t=e[d.columnName];l.forEach((async l=>{const s=null==i?void 0:i.find((e=>e.field===l));if(!s)return;const u=t?`${l}__${d.columnName}-${t}`:l;r[u]||(r[u]=[],r[u]=await o(s,{row:e,connectColumn:n}))}))}}))})),e.setupHooks.setup.tap(E,(e=>{t((()=>{var o;const l=null==(o=e.value)?void 0:o.uuid;l&&(h.delete(l),g.removeItemFromUUID(l),P.delete(l))}))})),e.eventHooks.onCellDblclick.tap(E,((e,o,{emits:n})=>{var t,i,r;const{$table:d,row:s,column:u}=e,c=Reflect.get(e,"verticalState");let{column:a,row:p}=d.reactData.editStore.actived;if(!(a&&p||(c&&(a=null==(t=c.editCell)?void 0:t.column,p=null==(i=c.editCell)?void 0:i.row),a&&p)))return;c&&(a=u,p=s);const f=null==(r=a.editRender)?void 0:r.props,{cellDblclickSelectable:m=!1,multiple:v=!1,valueField:h="value"}=f.componentProps||{};if(!m||!l(f))return;const g=o.uuid&&w(o.uuid,a.field,p,d);if(1!==(null==g?void 0:g.length))return;const C=v?[g[0][h]]:g[0][h],y=p[a.field];d.clearEdit(),b(C,y)||(p[a.field]=C,n("formChange",{column:a,row:p,oldValue:y,value:C,index:d.getRowIndex(p),$table:d,option:g[0]}),c&&(c.editCell=null))}))}})}export{E as selectRendererPlugin};
+import { reactive, inject, createVNode, mergeProps, onBeforeUnmount } from 'vue';
+import { arrayed, traverse } from '../../../../../../../shared/utils/index.js';
+import '../../../../../index.js';
+import { EDITABLE_WIDGET_TYPE, InjectionIhoTableUUID } from '../../../../constants/index.js';
+import { useAutoFocus } from '../hooks/useAutoFocus.js';
+import { getTitle, IhoTableRenderHelper, getLowCodeFieldFromField, IhoTableUtils } from '../../../../utils/index.js';
+import EditSelect from './editSelect.js';
+import { getDefaultValue, getArray } from './selectUtils.js';
+import { getSelectOptions, selectOptionsMap, selectColumnMap } from '../hooks/useSelectOption.js';
+import { isString, isFunction, isEqual } from 'lodash-es';
+import { defineTablePlugin } from '../../../../hooks/useTablePlugin.js';
+
+function selectRendererPlugin() {
+  const pluginName = "selectRendererPlugin";
+  const columnMap = reactive(/* @__PURE__ */ new Map());
+  function isPositive(value) {
+    return value === true || value === "1";
+  }
+  function asLowCodeField(item) {
+    return !!item;
+  }
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(EDITABLE_WIDGET_TYPE.SELECT, {
+        renderCell({
+          props
+        }, {
+          row,
+          column,
+          $table
+        }) {
+          var _a, _b, _c, _d, _e, _f;
+          const uuid = inject(InjectionIhoTableUUID);
+          const options = getSelectOptions(uuid, column.field, row, $table);
+          if (asLowCodeField(props) && props.labelToValue && options.length) {
+            const allowModify = isPositive((_b = (_a = props.componentProps) == null ? void 0 : _a.allowModify) != null ? _b : props.allowModify);
+            const allowCreate = isPositive((_d = (_c = props.componentProps) == null ? void 0 : _c.allowCreate) != null ? _d : props.allowCreate) || allowModify;
+            const rowValue = row[column.field];
+            if (!allowModify && !allowCreate && rowValue != null && rowValue !== "") {
+              const {
+                aliasField = "",
+                labelField = "label",
+                valueField = "value"
+              } = props.componentProps || {};
+              const option = options.find((option2) => option2[valueField] === rowValue);
+              if (!option) {
+                const targetOption = options.find((option2) => option2[labelField] === rowValue || option2[aliasField] === rowValue);
+                if (targetOption) {
+                  row[column.field] = targetOption[valueField];
+                } else {
+                  Reflect.deleteProperty(row, column.field);
+                }
+              }
+            }
+          }
+          const value = getDefaultValue(row, props, options);
+          const valueString = arrayed(value).join(",");
+          const indexed = props && ((_e = props.componentProps) == null ? void 0 : _e.multiple) && (isPositive(props.variableHeight) || ((_f = props.componentProps) == null ? void 0 : _f.indexedText));
+          return [createVNode("span", {
+            "title": getTitle(column, valueString),
+            "class": "iho-table__colorAndIcon"
+          }, [indexed ? arrayed(value).reduce((res, value2) => {
+            if (value2 != null)
+              res.push([value2, ";", createVNode("br", null, null)]);
+            return res;
+          }, []) : valueString])];
+        },
+        renderEdit: IhoTableRenderHelper.createRenderEdit(({
+          fieldItem,
+          emitFormClick,
+          row,
+          column,
+          $rowIndex,
+          $table
+        }) => {
+          var _a, _b, _c, _d;
+          const uuid = inject(InjectionIhoTableUUID);
+          const options = getSelectOptions(uuid, column.field, row, $table);
+          const allowModify = isPositive((_b = (_a = fieldItem.componentProps) == null ? void 0 : _a.allowModify) != null ? _b : fieldItem.allowModify);
+          const allowCreate = isPositive((_d = (_c = fieldItem.componentProps) == null ? void 0 : _c.allowCreate) != null ? _d : fieldItem.allowCreate) || allowModify;
+          return [createVNode(EditSelect, mergeProps({
+            "queryOptions": fieldItem.queryOptions
+          }, fieldItem.componentProps, {
+            "options": options,
+            "column": column,
+            "row": row,
+            "row-index": $rowIndex,
+            "value": row[column.field],
+            "onUpdate:value": ($event) => row[column.field] = $event,
+            "allowModify": allowModify,
+            "allowCreate": allowCreate,
+            "onClick": emitFormClick
+          }), null)];
+        })
+      });
+    },
+    apply(hooks) {
+      useAutoFocus(hooks).bindAutoFocusConfig(pluginName, EDITABLE_WIDGET_TYPE.SELECT, ".n-base-selection-input,.n-base-selection-tags");
+      hooks.fieldHooks.fieldList.tap(pluginName, (fieldList, {
+        uuid
+      }) => {
+        if (uuid) {
+          if (!selectOptionsMap.get(uuid))
+            selectOptionsMap.set(uuid, {});
+          columnMap.set(uuid, fieldList);
+          const fieldMap = {};
+          fieldList.forEach((column) => {
+            fieldMap[column.field] = column;
+          });
+          selectColumnMap.setItemFromUUID(uuid, {});
+          const currentSelectColumnMap = selectColumnMap.getItemFromUUID(uuid);
+          traverse(fieldList, (column) => {
+            fieldList.forEach((column2) => {
+              const lowCodeField = getLowCodeFieldFromField(column2);
+              if (!lowCodeField || !lowCodeField.connectField || !isString(lowCodeField.connectField))
+                return;
+              const connectFields = lowCodeField.connectField.split(",");
+              connectFields.forEach((connectField) => {
+                currentSelectColumnMap[connectField] = currentSelectColumnMap[connectField] || [];
+                currentSelectColumnMap[connectField].push(column2);
+              });
+            });
+          });
+          const optionMap = selectOptionsMap.get(uuid);
+          traverse(fieldList, async (column) => {
+            var _a, _b;
+            const lowCodeField = (_a = column.editRender) == null ? void 0 : _a.props;
+            if (!column.field || !lowCodeField)
+              return;
+            if (isSelect(lowCodeField) && !((_b = currentSelectColumnMap[column.field]) == null ? void 0 : _b.length)) {
+              if (isFunction(lowCodeField.queryOptions) && optionMap[column.field])
+                return;
+              optionMap[column.field] = [];
+              optionMap[column.field] = await getOptions(column);
+            }
+          });
+        }
+        return fieldList;
+      });
+      hooks.dataHooks.data.tap(pluginName, (row, {
+        uuid
+      }, __) => {
+        if (!uuid)
+          return;
+        const columns = columnMap.get(uuid);
+        if (!columns || !columns.length)
+          return;
+        const optionMap = selectOptionsMap.get(uuid);
+        columns.forEach(async (column) => {
+          var _a;
+          const lowCodeField = (_a = column.editRender) == null ? void 0 : _a.props;
+          if (!column.field || !lowCodeField)
+            return;
+          if (isSelect(lowCodeField) && (lowCodeField == null ? void 0 : lowCodeField.connectField)) {
+            const connectFields = lowCodeField.connectField.split(",");
+            const value = row[lowCodeField.columnName];
+            connectFields.forEach(async (connectField) => {
+              const connectFieldItem = columns == null ? void 0 : columns.find((fieldItem) => fieldItem.field === connectField);
+              if (!connectFieldItem)
+                return;
+              const mapKey = value ? `${connectField}__${lowCodeField.columnName}-${value}` : connectField;
+              if (optionMap[mapKey])
+                return;
+              optionMap[mapKey] = [];
+              optionMap[mapKey] = await getOptions(connectFieldItem, {
+                row,
+                connectColumn: column
+              });
+            });
+          }
+        });
+      });
+      async function getOptions(column, otherParams = {}) {
+        var _a, _b, _c;
+        const lowCodeField = (_a = column.editRender) == null ? void 0 : _a.props;
+        if (!lowCodeField)
+          return [];
+        let options = getArray(lowCodeField.options) || getArray((_b = lowCodeField.componentProps) == null ? void 0 : _b.options) || [];
+        if (lowCodeField.queryOptions) {
+          try {
+            const params = {
+              column,
+              isFullData: true,
+              ...otherParams
+            };
+            options = await ((_c = lowCodeField.queryOptions) == null ? void 0 : _c.call(lowCodeField, params));
+          } catch (e) {
+            console.log(`\u83B7\u53D6${lowCodeField.field}_options\u9519\u8BEF`);
+          }
+        }
+        return options;
+      }
+      hooks.setupHooks.setup.tap(pluginName, (config) => {
+        onBeforeUnmount(() => {
+          var _a;
+          const uuid = (_a = config.value) == null ? void 0 : _a.uuid;
+          if (uuid) {
+            selectOptionsMap.delete(uuid);
+            selectColumnMap.removeItemFromUUID(uuid);
+            columnMap.delete(uuid);
+          }
+        });
+      });
+      hooks.eventHooks.onCellDblclick.tap(pluginName, (payload, config, {
+        emits
+      }) => {
+        var _a, _b, _c;
+        const {
+          $table,
+          row: eventRow,
+          column: eventColumn
+        } = payload;
+        const verticalState = Reflect.get(payload, "verticalState");
+        let {
+          column,
+          row
+        } = $table.reactData.editStore.actived;
+        if (!column || !row) {
+          if (verticalState) {
+            column = (_a = verticalState.editCell) == null ? void 0 : _a.column;
+            row = (_b = verticalState.editCell) == null ? void 0 : _b.row;
+          }
+          if (!column || !row)
+            return;
+        }
+        if (verticalState) {
+          column = eventColumn;
+          row = eventRow;
+        }
+        const lowCodeField = (_c = column.editRender) == null ? void 0 : _c.props;
+        const {
+          cellDblclickSelectable = false,
+          multiple = false,
+          valueField = "value"
+        } = lowCodeField.componentProps || {};
+        if (!cellDblclickSelectable || !isSelect(lowCodeField))
+          return;
+        const options = config.uuid && getSelectOptions(config.uuid, column.field, row, $table);
+        if ((options == null ? void 0 : options.length) !== 1)
+          return;
+        const value = multiple ? [options[0][valueField]] : options[0][valueField];
+        const oldValue = row[column.field];
+        $table.clearEdit();
+        if (isEqual(value, oldValue))
+          return;
+        row[column.field] = value;
+        emits("formChange", {
+          column,
+          row,
+          oldValue,
+          value,
+          index: $table.getRowIndex(row),
+          $table,
+          option: options[0]
+        });
+        if (verticalState) {
+          verticalState.editCell = null;
+        }
+      });
+      function isSelect(lowCodeField) {
+        return lowCodeField && IhoTableUtils.getCellType(lowCodeField) === EDITABLE_WIDGET_TYPE.SELECT;
+      }
+    }
+  });
+}
+
+export { selectRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/editableWidgets/selectRendererPlugin/selectUtils.js

@@ -1 +1,21 @@
-function l(l,r,u=[]){const{aliasField:e="",labelField:i="label",valueField:o="value"}=(null==r?void 0:r.componentProps)||{},a=l[r.columnName];return Array.isArray(a)?a.map((l=>t(l))):t(a);function t(l){var r,a,t;const d=null==(r=n(u))?void 0:r.find((n=>n[o]==l));return null!=(t=null!=(a=null==d?void 0:d[e])?a:null==d?void 0:d[i])?t:l}}function n(l){return Array.isArray(l)&&!l.length?null:l}export{n as getArray,l as getDefaultValue};
+function getDefaultValue(row, item, options = []) {
+  const {
+    aliasField = "",
+    labelField = "label",
+    valueField = "value"
+  } = (item == null ? void 0 : item.componentProps) || {};
+  const value = row[item.columnName];
+  if (Array.isArray(value))
+    return value.map((v) => getValue(v));
+  return getValue(value);
+  function getValue(value2) {
+    var _a, _b, _c;
+    const findItem = (_a = getArray(options)) == null ? void 0 : _a.find((v) => v[valueField] == value2);
+    return (_c = (_b = findItem == null ? void 0 : findItem[aliasField]) != null ? _b : findItem == null ? void 0 : findItem[labelField]) != null ? _c : value2;
+  }
+}
+function getArray(list) {
+  return Array.isArray(list) && !list.length ? null : list;
+}
+
+export { getArray, getDefaultValue };

package/es/components/iho-table/src/plugins/rendererPlugins/editableWidgets/separateRendererPlugin/editSeparate.vue.js

@@ -1 +1,6 @@
-import e from"./editSeparate.vue2.js";import r from"../../../../../../../_virtual/_plugin-vue_export-helper.js";var t=r(e,[["__file","editSeparate.vue"]]);export{t as default};
+import _sfc_main from './editSeparate.vue2.js';
+import _export_sfc from '../../../../../../../_virtual/_plugin-vue_export-helper.js';
+
+var EditSeparate = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "editSeparate.vue"]]);
+
+export { EditSeparate as default };

package/es/components/iho-table/src/plugins/rendererPlugins/editableWidgets/separateRendererPlugin/editSeparate.vue2.js

@@ -1 +1,125 @@
-import{defineComponent as e,inject as a,ref as t,watch as o,computed as l,onDeactivated as u,openBlock as r,createBlock as n,unref as i,withCtx as s,createElementVNode as p,withModifiers as d,normalizeStyle as v,toDisplayString as c,renderSlot as m,createVNode as f}from"vue";import{cloneDeep as h,isObject as b,isArray as w}from"lodash-es";import{NPopover as y,NInput as g}from"naive-ui";import{InjectionIhoTableHandler as x}from"../../../../constants/index.js";import{useIhoTableFormEvent as k}from"../../../../utils/index.js";const _=["onClick"];var C=e({__name:"editSeparate",props:{value:{},height:{type:Number,default:48},column:{type:Object,required:!0},row:{type:Object,required:!0},displayContent:{type:String,default:""},rowIndex:{type:Number,required:!0}},emits:["update:value","click"],setup(e,{emit:C}){const j=e,U=a(x),q=a("$xetable"),P=t(),S=t();function T(e){S.value=e}const $=t(!1);function I(e){$.value=e}function N(e){$.value=!$.value,C("click",e)}o($,(function(e){e?async function(){var e;S.value=h(j.value),await new Promise((e=>setTimeout(e))),null==(e=P.value)||e.syncPosition()}():async function(){if(!b(S.value)&&!w(S.value)&&j.value===S.value)return;const e=j.value;C("update:value",S.value),O({oldValue:e}),U.updateTableDataRef()}()}));const{emitFormChangeWithParams:O}=k(l((()=>({...j,$table:q}))));const R=l((()=>({border:"1px solid #f5f5f5",height:j.height-16+"px",display:"flex",alignItems:"center",padding:"0",background:"white",wordBreak:"keep-all",boxSizing:"border-box","border-radius":"4px"})));return u((()=>I(!1))),(a,t)=>(r(),n(i(y),{ref_key:"popoverRef",ref:P,trigger:"manual",show:$.value,"onUpdate:show":t[1]||(t[1]=e=>$.value=e),"show-arrow":!1},{trigger:s((()=>[p("div",{onClick:d(N,["stop"]),style:v(i(R)),class:"iho-table__separateText"},c(e.displayContent||" "),13,_)])),default:s((()=>[m(a.$slots,"menu",{value:S.value,"onUpdate:value":T,"onUpdate:show":I,col:e.column,row:e.row},(()=>[f(i(g),{value:S.value,"onUpdate:value":t[0]||(t[0]=e=>S.value=e),type:"textarea"},null,8,["value"])]))])),_:3},8,["show"]))}});export{C as default};
+import { defineComponent, inject, ref, watch, computed, onDeactivated, openBlock, createBlock, unref, withCtx, createElementVNode, withModifiers, normalizeStyle, toDisplayString, renderSlot, createVNode } from 'vue';
+import { cloneDeep, isObject, isArray } from 'lodash-es';
+import { NPopover, NInput } from 'naive-ui';
+import { InjectionIhoTableHandler } from '../../../../constants/index.js';
+import { useIhoTableFormEvent } from '../../../../utils/index.js';
+
+const _hoisted_1 = ["onClick"];
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "editSeparate",
+  props: {
+    value: {},
+    height: {
+      type: Number,
+      default: 48
+    },
+    column: {
+      type: Object,
+      required: true
+    },
+    row: {
+      type: Object,
+      required: true
+    },
+    displayContent: {
+      type: String,
+      default: ""
+    },
+    rowIndex: {
+      type: Number,
+      required: true
+    }
+  },
+  emits: ["update:value", "click"],
+  setup(__props, {
+    emit
+  }) {
+    const props = __props;
+    const tableHandler = inject(InjectionIhoTableHandler);
+    const $table = inject("$xetable");
+    const popoverRef = ref();
+    const editContent = ref();
+    function setEditContent(value) {
+      editContent.value = value;
+    }
+    const show = ref(false);
+    function setShow(v) {
+      show.value = v;
+    }
+    function onContentClick(event) {
+      show.value = !show.value;
+      emit("click", event);
+    }
+    watch(show, updateShow);
+    function updateShow(show2) {
+      show2 ? onShow() : onClose();
+    }
+    async function onShow() {
+      var _a;
+      editContent.value = cloneDeep(props.value);
+      await new Promise((resolve) => setTimeout(resolve));
+      (_a = popoverRef.value) == null ? void 0 : _a.syncPosition();
+      return;
+    }
+    const {
+      emitFormChangeWithParams
+    } = useIhoTableFormEvent(computed(() => ({
+      ...props,
+      $table
+    })));
+    async function onClose() {
+      if (!isObject(editContent.value) && !isArray(editContent.value)) {
+        if (props.value === editContent.value)
+          return;
+      }
+      const oldValue = props.value;
+      emit("update:value", editContent.value);
+      emitFormChangeWithParams({
+        oldValue
+      });
+      tableHandler.updateTableDataRef();
+    }
+    const style = computed(() => ({
+      border: "1px solid #f5f5f5",
+      height: props.height - 16 + "px",
+      display: "flex",
+      alignItems: "center",
+      padding: "0",
+      background: "white",
+      wordBreak: "keep-all",
+      boxSizing: "border-box",
+      "border-radius": "4px"
+    }));
+    onDeactivated(() => setShow(false));
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(NPopover), {
+        ref_key: "popoverRef",
+        ref: popoverRef,
+        trigger: "manual",
+        show: show.value,
+        "onUpdate:show": _cache[1] || (_cache[1] = ($event) => show.value = $event),
+        "show-arrow": false
+      }, {
+        trigger: withCtx(() => [createElementVNode("div", {
+          onClick: withModifiers(onContentClick, ["stop"]),
+          style: normalizeStyle(unref(style)),
+          class: "iho-table__separateText"
+        }, toDisplayString(__props.displayContent || " "), 13, _hoisted_1)]),
+        default: withCtx(() => [renderSlot(_ctx.$slots, "menu", {
+          value: editContent.value,
+          "onUpdate:value": setEditContent,
+          "onUpdate:show": setShow,
+          col: __props.column,
+          row: __props.row
+        }, () => [createVNode(unref(NInput), {
+          value: editContent.value,
+          "onUpdate:value": _cache[0] || (_cache[0] = ($event) => editContent.value = $event),
+          type: "textarea"
+        }, null, 8, ["value"])])]),
+        _: 3
+      }, 8, ["show"]);
+    };
+  }
+});
+
+export { _sfc_main as default };