@ibiz-template/vue3-components 0.7.41-alpha.36 → 0.7.41-alpha.38

package/es/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-grid2/repeater-grid2.mjs

@@ -0,0 +1,309 @@
+import { isVNode, defineComponent, createVNode, resolveComponent, mergeProps, withDirectives, resolveDirective, toRaw, h, ref, reactive, watch, onUnmounted } from 'vue';
+import Sortable from '../../../../../../node_modules/.pnpm/sortablejs@1.15.6/node_modules/sortablejs/modular/sortable.esm.mjs';
+import { EditFormController, ControlVO, FormMDCtrlRepeaterController } from '@ibiz-template/runtime';
+import { createUUID } from 'qx-util';
+import { useNamespace, useCtx } from '@ibiz-template/vue3-util';
+import { recursiveIterate } from '@ibiz-template/core';
+import { useLoadMore } from '../form-mdctrl-repeater.util.mjs';
+import './repeater-grid2.css';
+
+"use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const RepeaterGrid2 = /* @__PURE__ */ defineComponent({
+  name: "IBizRepeaterGrid2",
+  props: {
+    controller: {
+      type: FormMDCtrlRepeaterController,
+      required: true
+    }
+  },
+  emits: {
+    change: (_value) => true
+  },
+  setup(props, {
+    emit
+  }) {
+    var _a, _b;
+    const ns = useNamespace("repeater-grid2");
+    const formItems = [];
+    const tableRef = ref();
+    const tableKey = ref(createUUID());
+    const chunkSize = ((_a = props.controller.model.ctrlParams) == null ? void 0 : _a.chunkSize) ? Number((_b = props.controller.model.ctrlParams) == null ? void 0 : _b.chunkSize) : 100;
+    const {
+      renderItems,
+      loadMore,
+      updateTotalItems
+    } = useLoadMore(props.controller.value, chunkSize);
+    recursiveIterate(props.controller.repeatedForm, (item) => {
+      var _a2;
+      if (item.detailType === "FORMITEM") {
+        if (((_a2 = item.editor) == null ? void 0 : _a2.editorType) !== "HIDDEN") {
+          formItems.push(item);
+        }
+      }
+    }, {
+      childrenFields: ["deformPages", "deformTabPages", "deformDetails"]
+    });
+    const onSingleValueChange = (value, index) => {
+      const arrData = [...props.controller.value || []];
+      arrData[index] = value;
+      emit("change", arrData);
+    };
+    const ctx = useCtx();
+    const formControllers = reactive([]);
+    const addFormController = async (data = {}) => {
+      const formC = new EditFormController(props.controller.repeatedForm, props.controller.context, props.controller.params, ctx);
+      formC.state.isSimple = true;
+      await formC.created();
+      formC.setSimpleData(data);
+      formControllers.push(formC);
+      props.controller.setRepeaterController("".concat(formControllers.length - 1), formC);
+      formC.evt.on("onFormDataChange", (event) => {
+        const item = event.data[0];
+        const formData = item instanceof ControlVO ? item.clone() : {
+          ...item
+        };
+        const index = formControllers.indexOf(formC);
+        onSingleValueChange(formData, index);
+      });
+    };
+    watch(() => props.controller.value, (newVal) => {
+      if (newVal && newVal.length > 0) {
+        newVal.forEach((item, index) => {
+          const formC = formControllers[index];
+          if (formC) {
+            const changeVal = item || {};
+            const find = Object.keys(formC.data).find((key) => {
+              return changeVal[key] !== formC.data[key];
+            });
+            if (find) {
+              formC.setSimpleData(changeVal);
+            }
+          } else {
+            addFormController(item);
+          }
+        });
+      }
+      updateTotalItems(newVal || []);
+    }, {
+      immediate: true,
+      deep: true
+    });
+    let sortable;
+    const rowDrop = () => {
+      var _a2, _b2;
+      const wrapper = (_b2 = (_a2 = tableRef.value) == null ? void 0 : _a2.$el) == null ? void 0 : _b2.querySelector(".el-table__body-wrapper tbody");
+      if (!wrapper || !props.controller.enableSort)
+        return;
+      sortable = Sortable.create(wrapper, {
+        animation: 150,
+        handle: ".".concat(ns.e("drag-icon")),
+        ghostClass: "".concat(ns.e("sortable-ghost")),
+        onEnd({
+          newIndex,
+          oldIndex
+        }) {
+          props.controller.dragChange(oldIndex, newIndex);
+          tableKey.value = createUUID();
+        }
+      });
+    };
+    watch(() => tableRef.value, () => {
+      if (!props.controller.enableSort)
+        return;
+      tableRef.value ? rowDrop() : sortable == null ? void 0 : sortable.destroy();
+    });
+    onUnmounted(() => sortable == null ? void 0 : sortable.destroy());
+    const renderRemoveBtn = (index) => {
+      if (ibiz.config.form.mdCtrlConfirmBeforeRemove) {
+        return createVNode(resolveComponent("el-popconfirm"), {
+          "title": ibiz.i18n.t("control.form.repeaterGrid.promptInformation"),
+          "confirm-button-text": ibiz.i18n.t("app.confirm"),
+          "cancel-button-text": ibiz.i18n.t("app.cancel"),
+          "onConfirm": () => {
+            props.controller.remove(index);
+            formControllers.splice(index, 1);
+          }
+        }, {
+          reference: () => {
+            return createVNode("ion-icon", {
+              "name": "remove-outline",
+              "title": ibiz.i18n.t("app.delete"),
+              "class": ns.b("remove-btn")
+            }, null);
+          }
+        });
+      }
+      return createVNode("ion-icon", {
+        "name": "remove-outline",
+        "title": ibiz.i18n.t("app.delete"),
+        "class": ns.b("remove-btn"),
+        "onClick": () => {
+          props.controller.remove(index);
+          formControllers.splice(index, 1);
+        }
+      }, null);
+    };
+    return {
+      ns,
+      tableRef,
+      tableKey,
+      formItems,
+      renderItems,
+      formControllers,
+      renderRemoveBtn,
+      loadMore
+    };
+  },
+  render() {
+    var _a;
+    const tableHeight = (_a = this.controller.model.layoutPos) == null ? void 0 : _a.height;
+    const heightObject = tableHeight ? {
+      height: tableHeight
+    } : {};
+    const isEmpty = this.renderItems.length === 0;
+    return createVNode("div", {
+      "class": this.ns.b()
+    }, [createVNode(resolveComponent("el-table"), mergeProps({
+      "ref": "tableRef",
+      "key": this.tableKey,
+      "show-header": true,
+      "class": this.ns.e("table"),
+      "data": isEmpty && this.controller.enableCreate ? [{}] : this.renderItems,
+      "cell-class-name": ({
+        columnIndex
+      }) => {
+        const shouldShowIndex = this.controller.enableSort ? columnIndex === 1 : columnIndex === 0;
+        return shouldShowIndex ? this.ns.b("index") : "";
+      }
+    }, heightObject), {
+      default: () => {
+        return [this.controller.enableSort && createVNode(resolveComponent("el-table-column"), {
+          "width": 26,
+          "type": "default"
+        }, {
+          default: () => {
+            if (isEmpty) {
+              return "";
+            }
+            return createVNode("svg", {
+              "viewBox": "0 0 16 16",
+              "xmlns": "http://www.w3.org/2000/svg",
+              "height": "1em",
+              "width": "1em",
+              "class": this.ns.e("drag-icon"),
+              "preserveAspectRatio": "xMidYMid meet",
+              "focusable": "false"
+            }, [createVNode("g", {
+              "stroke-width": "1",
+              "fill-rule": "evenodd"
+            }, [createVNode("g", {
+              "transform": "translate(5 1)",
+              "fill-rule": "nonzero"
+            }, [createVNode("path", {
+              "d": "M1 2a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm4 0a1 1 0 1 1 0-2 1 1 0 0 1 0 2zM1 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm4 0a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm-4 4a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm4 0a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm-4 4a1 1 0 1 1 0-2 1 1 0 0 1 0 2zm4 0a1 1 0 1 1 0-2 1 1 0 0 1 0 2z"
+            }, null)])])]);
+          }
+        }), createVNode(resolveComponent("el-table-column"), {
+          "type": "index",
+          "width": 66,
+          "align": "center"
+        }, {
+          default: (opts) => {
+            if (isEmpty) {
+              return "";
+            }
+            const {
+              $index
+            } = opts;
+            return createVNode("span", null, [$index + 1]);
+          }
+        }), this.formItems.length > 0 && this.formItems.map((item) => {
+          const width = item.labelWidth;
+          let widthName = "width";
+          let columnWidth = "";
+          if (typeof width === "number") {
+            if (width === 1) {
+              widthName = "min-width";
+            }
+            columnWidth = "".concat(width, "px");
+          }
+          return createVNode(resolveComponent("el-table-column"), mergeProps({
+            "label": item.caption,
+            "prop": item.id
+          }, {
+            [widthName]: columnWidth
+          }, {
+            "align": "center"
+          }), {
+            default: (opts) => {
+              if (isEmpty) {
+                return "";
+              }
+              const {
+                $index
+              } = opts;
+              const formC = toRaw(this.formControllers[$index]);
+              if (!formC || !formC.state.isLoaded) {
+                return createVNode("div", null, [ibiz.i18n.t("control.form.repeaterGrid.absentOrLoad")]);
+              }
+              const formItemC = formC.formItems.find((x) => x.name === item.id);
+              let editor = null;
+              if (!formItemC.editorProvider) {
+                editor = createVNode(resolveComponent("not-supported-editor"), {
+                  "modelData": item.editor
+                }, null);
+              } else {
+                const component = resolveComponent(formItemC.editorProvider.formEditor);
+                editor = h(component, {
+                  value: formItemC.value,
+                  data: formItemC.data,
+                  controller: formItemC.editor,
+                  disabled: formItemC.state.disabled,
+                  readonly: formItemC.state.readonly,
+                  onChange: (val, name) => {
+                    formItemC.setDataValue(val, name);
+                  }
+                });
+              }
+              return createVNode(resolveComponent("iBizGridEditItem"), {
+                "error": formItemC.state.error,
+                "required": formItemC.state.required
+              }, _isSlot(editor) ? editor : {
+                default: () => [editor]
+              });
+            }
+          });
+        }), (this.controller.enableCreate || this.controller.enableDelete) && createVNode(resolveComponent("el-table-column"), {
+          "width": 80,
+          "align": "center"
+        }, {
+          default: (opts) => {
+            const {
+              $index
+            } = opts;
+            return createVNode("div", {
+              "class": this.ns.b("action-group")
+            }, [this.controller.enableCreate && createVNode("ion-icon", {
+              "name": "add-outline",
+              "title": ibiz.i18n.t("app.add"),
+              "class": this.ns.b("add-btn"),
+              "onClick": () => {
+                this.controller.create(isEmpty ? 0 : $index + 1);
+              }
+            }, null), this.controller.enableDelete && !isEmpty && this.renderRemoveBtn($index)]);
+          }
+        })];
+      },
+      append: () => {
+        return [tableHeight && withDirectives(createVNode("div", {
+          "infinite-scroll-distance": 20
+        }, null), [[resolveDirective("infinite-scroll"), () => this.loadMore()]])];
+      }
+    })]);
+  }
+});
+
+export { RepeaterGrid2 };

package/es/control/tab-exp-panel/tab-exp-panel.mjs

@@ -1,4 +1,4 @@
-import { isVNode, defineComponent, createVNode, resolveComponent, ref, onUnmounted, watch } from 'vue';
+import { isVNode, defineComponent, createVNode, resolveComponent, watch } from 'vue';
 import { useControlController, useNamespace, getNestedRoutePath, route2routePath } from '@ibiz-template/vue3-util';
 import './tab-exp-panel.css';
 import { TabExpPanelController } from '@ibiz-template/runtime';
@@ -52,19 +52,6 @@ const TabExpPanelControl = /* @__PURE__ */ defineComponent({
     var _a;
     const c = useControlController((...args) => new TabExpPanelController(...args));
     const ns = useNamespace("control-".concat(c.model.controlType.toLowerCase()));
-    const counterData = ref({});
-    const fn = (counter) => {
-      counterData.value = counter;
-    };
-    c.evt.on("onCreated", () => {
-      if (c.counter) {
-        c.counter.onChange(fn, true);
-      }
-    });
-    onUnmounted(() => {
-      var _a2;
-      (_a2 = c.counter) == null ? void 0 : _a2.offChange(fn);
-    });
     const handleTabChange = () => {
       c.handleTabChange();
     };
@@ -98,7 +85,6 @@ const TabExpPanelControl = /* @__PURE__ */ defineComponent({
       c,
       ns,
       tabPosition,
-      counterData,
       handleTabChange
     };
   },
@@ -106,7 +92,8 @@ const TabExpPanelControl = /* @__PURE__ */ defineComponent({
     let _slot;
     const {
       isCreated,
-      tabPages
+      tabPages,
+      counterData
     } = this.c.state;
     return createVNode(resolveComponent("iBizControlBase"), {
       "controller": this.c
@@ -117,7 +104,7 @@ const TabExpPanelControl = /* @__PURE__ */ defineComponent({
         "tabPosition": this.tabPosition,
         "onTabChange": this.handleTabChange
       }, _isSlot(_slot = tabPages.map((tab) => {
-        const counterNum = tab.counterId ? this.counterData[tab.counterId] : void 0;
+        const counterNum = tab.counterId ? counterData[tab.counterId] : void 0;
         return createVNode(resolveComponent("el-tab-pane"), {
           "class": [this.ns.e("tab-item")],
           "label": tab.caption,

package/es/editor/code/code-editor.controller.mjs

@@ -1,4 +1,5 @@
-import { EditorController, getDeACMode } from '@ibiz-template/runtime';
+import { RuntimeError } from '@ibiz-template/core';
+import { EditorController, getDeACMode, UIActionUtil } from '@ibiz-template/runtime';
 
 "use strict";
 var __defProp = Object.defineProperty;
@@ -17,6 +18,29 @@ class CodeEditorController extends EditorController {
      * @memberof CodeEditorController
      */
     __publicField(this, "deACMode");
+    /**
+     * editor 实例
+     *
+     * @private
+     * @type {Monaco.editor.IStandaloneCodeEditor}
+     * @memberof HtmlEditorController
+     */
+    __publicField(this, "editor");
+    /**
+     * monaco 实例
+     *
+     * @private
+     * @type {IMonaco}
+     * @memberof CodeEditorController
+     */
+    __publicField(this, "monaco");
+    /**
+     * editor 当前选区
+     *
+     * @type {monaco.Selection}
+     * @memberof CodeEditorController
+     */
+    __publicField(this, "currentSelection");
   }
   /**
    * 语言类型
@@ -53,6 +77,157 @@ class CodeEditorController extends EditorController {
         this.context.srfappid
       );
   }
+  /**
+   * editor 创建完成
+   *
+   * @private
+   * @param {Monaco.editor.IStandaloneCodeEditor} editor
+   */
+  onCreated(editor, monaco) {
+    this.editor = editor;
+    this.monaco = monaco;
+  }
+  /**
+   * 获取选中文本
+   * @return {*}  {string} 选中文本
+   */
+  getSelectionText() {
+    var _a, _b, _c;
+    const selection = (_a = this.editor) == null ? void 0 : _a.getSelection();
+    let selectedText;
+    if (selection) {
+      selectedText = (_c = (_b = this.editor) == null ? void 0 : _b.getModel()) == null ? void 0 : _c.getValueInRange(selection);
+    }
+    return selectedText || "";
+  }
+  /**
+   * 插入文本
+   * @param {string} text 文本
+   */
+  insertText(text) {
+    var _a, _b, _c, _d, _e, _f;
+    const model = (_a = this.editor) == null ? void 0 : _a.getModel();
+    if (!model || !this.monaco)
+      return;
+    const lastLineNumber = model.getLineCount();
+    const lastLineContent = model.getLineContent(lastLineNumber);
+    const lastColumn = lastLineContent.length + 1;
+    (_b = this.editor) == null ? void 0 : _b.executeEdits("", [
+      {
+        range: new this.monaco.Range(
+          lastLineNumber,
+          lastColumn,
+          lastLineNumber,
+          lastColumn
+        ),
+        text
+      }
+    ]);
+    const newLastLine = lastLineNumber + (text.includes("\n") ? 1 : 0);
+    const newLastColumn = ((_c = text.split("\n").pop()) == null ? void 0 : _c.length) || 0;
+    (_d = this.editor) == null ? void 0 : _d.setPosition(
+      new this.monaco.Position(newLastLine, newLastColumn)
+    );
+    (_e = this.editor) == null ? void 0 : _e.revealPositionInCenter(
+      new this.monaco.Position(newLastLine, newLastColumn)
+    );
+    (_f = this.editor) == null ? void 0 : _f.focus();
+  }
+  /**
+   * 替换选中文本
+   * @param {string} text
+   */
+  replaceSelectionText(text) {
+    var _a;
+    const selection = (_a = this.editor) == null ? void 0 : _a.getSelection();
+    if (!selection || selection.isEmpty() || !this.monaco || !this.editor) {
+      return;
+    }
+    const startPosition = selection.getStartPosition();
+    this.editor.executeEdits("", [
+      {
+        range: selection,
+        text
+      }
+    ]);
+    const textLines = text.split("\n");
+    const lineCount = textLines.length;
+    const lastLineChars = textLines[lineCount - 1].length;
+    let finalLineNumber;
+    let finalColumn;
+    if (lineCount === 1) {
+      finalLineNumber = startPosition.lineNumber;
+      finalColumn = startPosition.column + lastLineChars;
+    } else {
+      finalLineNumber = startPosition.lineNumber + (lineCount - 1);
+      finalColumn = 1 + lastLineChars;
+    }
+    const newSelection = new this.monaco.Range(
+      finalLineNumber,
+      finalColumn,
+      finalLineNumber,
+      finalColumn
+    );
+    this.editor.createDecorationsCollection().clear();
+    this.editor.setSelection(newSelection);
+    this.editor.focus();
+  }
+  /**
+   * 恢复选取
+   */
+  restoreSelection() {
+    var _a;
+    (_a = this.editor) == null ? void 0 : _a.focus();
+  }
+  /**
+   * 获取内联AI聊天参数
+   */
+  getInLineAiChatOptions() {
+    var _a, _b, _c, _d, _e, _f;
+    const contentArea = (_b = (_a = this.editor) == null ? void 0 : _a.getDomNode()) == null ? void 0 : _b.querySelector(".editor-scrollable");
+    if (!contentArea) {
+      throw new RuntimeError(ibiz.i18n.t("editor.code.noEditorArea"));
+    }
+    const position = (_c = this.currentSelection) == null ? void 0 : _c.getStartPosition();
+    if (!position) {
+      throw new RuntimeError(ibiz.i18n.t("editor.code.noSelStart"));
+    }
+    const coordinates = (_d = this.editor) == null ? void 0 : _d.getScrolledVisiblePosition(position);
+    const editorRect = (_f = (_e = this.editor) == null ? void 0 : _e.getDomNode()) == null ? void 0 : _f.getBoundingClientRect();
+    if (!editorRect) {
+      throw new RuntimeError(ibiz.i18n.t("editor.code.noEditorRect"));
+    }
+    if (!coordinates) {
+      throw new RuntimeError(ibiz.i18n.t("editor.code.noSelCoords"));
+    }
+    const rect = contentArea.getBoundingClientRect();
+    return {
+      left: rect.left,
+      top: editorRect.top + coordinates.top + 28,
+      // 减去 20px 的行高度及 8px 向下偏移
+      width: rect.width - 160
+      // 减去 左侧占位 及 右侧代码预览 边距
+    };
+  }
+  /**
+   * 执行内联AIUI操作
+   * @param uiActionId
+   * @param appId
+   */
+  async doInLineAIUIAction(uiActionId, appId) {
+    const eventArgs = this.ctrl.getEventArgs();
+    eventArgs.params.editor = this;
+    if (this.editorParams.srfaiappendcurdata && this.editorParams.srfaiappendcurdata === "true") {
+      eventArgs.context.srfaiappendcurdata = true;
+    }
+    await UIActionUtil.exec(
+      uiActionId,
+      {
+        ...eventArgs
+      },
+      appId
+    );
+  }
 }
 
 export { CodeEditorController };

package/es/editor/code/monaco-editor/monaco-editor.css

@@ -1 +1 @@
-.ibiz-code{display:flex;flex-direction:column;width:100%;height:100%}.ibiz-code__box{width:100%;height:100%;min-height:200px;overflow:hidden}.ibiz-code__first-prompt::before{padding-right:var(--ibiz-spacing-base);content:var(--ibiz-code-placeholder)}.ibiz-code-toolbar{position:absolute;top:4px;right:18px;z-index:10;display:flex;align-items:center;justify-content:end;width:auto;height:auto;padding-right:0;font-size:var(--ibiz-font-size-header-6)}.ibiz-code-toolbar>*+*{margin-left:var(--ibiz-spacing-base-loose)}.ibiz-code-toolbar__fullscreen{height:38px;padding:0 12px;font-size:var(--ibiz-font-size-regular);font-style:normal;line-height:2.8;cursor:pointer}.ibiz-code-toolbar__fullscreen:hover{background-color:var(--ibiz-color-bg-3)}.ibiz-code-footer{--ibiz-code-footer-toolbar-height:36px;--ibiz-code-footer-button-height:36px;display:flex;align-items:center;justify-content:end;width:100%;min-height:var(--ibiz-code-footer-toolbar-height);margin-top:var(--ibiz-spacing-base-tight);margin-right:var(--ibiz-spacing-tight)}.ibiz-code-footer>*+*{margin-left:var(--ibiz-spacing-base)}.ibiz-code-footer__cancel{height:var(--ibiz-code-footer-button-height);line-height:var(--ibiz-code-footer-button-height);color:var(--ibiz-color-text-1);cursor:pointer;opacity:.7}.ibiz-code-footer__cancel:hover{color:var(--ibiz-color-primary);opacity:1}.ibiz-code-footer__save{width:96px;height:var(--ibiz-code-footer-button-height);line-height:var(--ibiz-code-footer-button-height);color:var(--ibiz-color-primary-active-text);text-align:center;cursor:pointer;background-color:var(--ibiz-color-primary);border-radius:var(--ibiz-border-radius-small)}.ibiz-code-footer__save:hover{box-shadow:0 2px 5px 1px var(--ibiz-color-primary)}.ibiz-code-message{width:500px;max-width:unset}.ibiz-code-message__message-content--message-tip{color:var(--ibiz-color-text-3)}.ibiz-code-message__message-cancel{color:var(--ibiz-color-text-1);background-color:transparent}.ibiz-code-message__message-cancel:hover{color:var(--ibiz-color-primary);background-color:transparent}.ibiz-code-message__message-comfire{background-color:var(--ibiz-color-danger)!important}.ibiz-code-message__message-comfire:hover{box-shadow:0 2px 5px 1px var(--ibiz-color-danger)}.ibiz-code-editor-enable{--ibiz-code-footer-toolbar-height:36px;--ibiz-code-footer-button-height:36px}.ibiz-code-editor-enable .ibiz-code__box{height:100%}.ibiz-code-editor-enable:has(.ibiz-code-footer) .ibiz-code__box{height:calc(100% - var(--ibiz-code-footer-toolbar-height))}.ibiz-code-dialog-full-screen{width:100%!important;height:100%!important;margin:0!important}.ibiz-code-dialog-full-screen .ibiz-code-footer{--ibiz-code-footer-toolbar-height:68px}.ibiz-code-dialog-full-screen .ibiz-code{gap:0;padding:0 var(--ibiz-spacing-extra-loose);--w-e-toolbar-bg-color:var(--ibiz-color-bg-0)}.ibiz-code-dialog-full-screen .ibiz-code .ibiz-code-toolbar{right:calc(var(--ibiz-spacing-extra-loose) + 18px)}.ibiz-code-dialog-full-screen .el-dialog__header{display:none!important}.ibiz-code-dialog-full-screen .el-dialog__body{width:100%;height:100%;padding:0 0 var(--ibiz-spacing-base)}.ibiz-code-dialog-full-screen .el-dialog__body:has(.ibiz-code-footer){padding-bottom:0}.ibiz-code-footer-dialog{margin-top:0}
+.ibiz-code{display:flex;flex-direction:column;width:100%;height:100%}.ibiz-code__box{width:100%;height:100%;min-height:200px;overflow:hidden}.ibiz-code__first-prompt::before{padding-right:var(--ibiz-spacing-base);content:var(--ibiz-code-placeholder)}.ibiz-code-toolbar{position:absolute;top:4px;right:18px;z-index:10;display:flex;align-items:center;justify-content:end;width:auto;height:auto;padding-right:0;font-size:var(--ibiz-font-size-header-6)}.ibiz-code-toolbar>*+*{margin-left:var(--ibiz-spacing-base-loose)}.ibiz-code-toolbar__fullscreen{height:38px;padding:0 12px;font-size:var(--ibiz-font-size-regular);font-style:normal;line-height:2.8;cursor:pointer}.ibiz-code-toolbar__fullscreen:hover{background-color:var(--ibiz-color-bg-3)}.ibiz-code-footer{--ibiz-code-height-text-editor-toolbar:40px;--ibiz-code-footer-toolbar-height:36px;--ibiz-code-footer-button-height:36px;--ibiz-code-text-editor-toolbar-z-index:1;--ibiz-code-text-editor-toolbar-left:0;--ibiz-code-text-editor-toolbar-top:0;display:flex;align-items:center;justify-content:end;width:100%;min-height:var(--ibiz-code-footer-toolbar-height);margin-top:var(--ibiz-spacing-base-tight);margin-right:var(--ibiz-spacing-tight)}.ibiz-code-footer>*+*{margin-left:var(--ibiz-spacing-base)}.ibiz-code-footer__cancel{height:var(--ibiz-code-footer-button-height);line-height:var(--ibiz-code-footer-button-height);color:var(--ibiz-color-text-1);cursor:pointer;opacity:.7}.ibiz-code-footer__cancel:hover{color:var(--ibiz-color-primary);opacity:1}.ibiz-code-footer__save{width:96px;height:var(--ibiz-code-footer-button-height);line-height:var(--ibiz-code-footer-button-height);color:var(--ibiz-color-primary-active-text);text-align:center;cursor:pointer;background-color:var(--ibiz-color-primary);border-radius:var(--ibiz-border-radius-small)}.ibiz-code-footer__save:hover{box-shadow:0 2px 5px 1px var(--ibiz-color-primary)}.ibiz-code-message{width:500px;max-width:unset}.ibiz-code-message__message-content--message-tip{color:var(--ibiz-color-text-3)}.ibiz-code-message__message-cancel{color:var(--ibiz-color-text-1);background-color:transparent}.ibiz-code-message__message-cancel:hover{color:var(--ibiz-color-primary);background-color:transparent}.ibiz-code-message__message-comfire{background-color:var(--ibiz-color-danger)!important}.ibiz-code-message__message-comfire:hover{box-shadow:0 2px 5px 1px var(--ibiz-color-danger)}.ibiz-code-editor-enable{--ibiz-code-height-text-editor-toolbar:40px;--ibiz-code-footer-toolbar-height:36px;--ibiz-code-footer-button-height:36px;--ibiz-code-text-editor-toolbar-z-index:1;--ibiz-code-text-editor-toolbar-left:0;--ibiz-code-text-editor-toolbar-top:0}.ibiz-code-editor-enable .ibiz-code__box{height:100%}.ibiz-code-editor-enable:has(.ibiz-code-footer) .ibiz-code__box{height:calc(100% - var(--ibiz-code-footer-toolbar-height))}.ibiz-code-dialog-full-screen{width:100%!important;height:100%!important;margin:0!important}.ibiz-code-dialog-full-screen .ibiz-code-footer{--ibiz-code-footer-toolbar-height:68px}.ibiz-code-dialog-full-screen .ibiz-code{gap:0;padding:0 var(--ibiz-spacing-extra-loose);--w-e-toolbar-bg-color:var(--ibiz-color-bg-0)}.ibiz-code-dialog-full-screen .ibiz-code .ibiz-code-toolbar{right:calc(var(--ibiz-spacing-extra-loose) + 18px)}.ibiz-code-dialog-full-screen .el-dialog__header{display:none!important}.ibiz-code-dialog-full-screen .el-dialog__body{width:100%;height:100%;padding:0 0 var(--ibiz-spacing-base)}.ibiz-code-dialog-full-screen .el-dialog__body:has(.ibiz-code-footer){padding-bottom:0}.ibiz-code-footer-dialog{margin-top:0}.ibiz-code-text-editor-toolbar{--ibiz-code-height-text-editor-toolbar:40px;--ibiz-code-footer-toolbar-height:36px;--ibiz-code-footer-button-height:36px;--ibiz-code-text-editor-toolbar-z-index:1;--ibiz-code-text-editor-toolbar-left:0;--ibiz-code-text-editor-toolbar-top:0;position:fixed;top:var(--ibiz-code-text-editor-toolbar-top);left:var(--ibiz-code-text-editor-toolbar-left);z-index:var(--ibiz-code-text-editor-toolbar-z-index);display:flex;gap:var(--ibiz-spacing-tight);height:var(--ibiz-code-height-text-editor-toolbar);padding:var(--ibiz-spacing-extra-tight);font-size:var(--ibiz-font-size-regular);background-color:var(--ibiz-color-bg-2);border-radius:var(--ibiz-border-radius-extra-small);box-shadow:var(--ibiz-shadow-elevated)}.ibiz-code-text-editor-toolbar__item{display:flex;align-items:center;justify-content:center;padding:var(--ibiz-spacing-extra-tight) var(--ibiz-spacing-tight);cursor:pointer;border-radius:var(--ibiz-border-radius-extra-small)}.ibiz-code-text-editor-toolbar__item:hover{color:var(--ibiz-color-primary);background-color:var(--ibiz-color-primary-light-default)}