@hufe921/canvas-editor 0.9.88 → 0.9.89

package/CHANGELOG.md

@@ -1,3 +1,25 @@
+## [0.9.89](https://github.com/Hufe921/canvas-editor/compare/v0.9.88...v0.9.89) (2024-08-09)
+
+
+### Bug Fixes
+
+* three click selection paragraph boundary error #742 ([9dd192f](https://github.com/Hufe921/canvas-editor/commit/9dd192ffd26f9f271efa06c81b6bd5e32557d872)), closes [#742](https://github.com/Hufe921/canvas-editor/issues/742)
+
+
+### Documentation
+
+* update plugin markdown ([c2d3e94](https://github.com/Hufe921/canvas-editor/commit/c2d3e941b19a6bc766b0bfa8dac7911578170b6c))
+
+
+### Features
+
+* add id property to contextMenu context #737 ([997ecc0](https://github.com/Hufe921/canvas-editor/commit/997ecc03e89afeaaf6b903f9f253c5c5090b3f78)), closes [#737](https://github.com/Hufe921/canvas-editor/issues/737)
+* add line number option #734 ([d89218a](https://github.com/Hufe921/canvas-editor/commit/d89218a916fce5a7b7b6bf27fa4663ecc4d15cf6)), closes [#734](https://github.com/Hufe921/canvas-editor/issues/734)
+* control related apis support the control id property ([dd1b53e](https://github.com/Hufe921/canvas-editor/commit/dd1b53ee6297bc72b0064c09522b597118919c50))
+* set range using the shift shortcut key #728 ([8878fd7](https://github.com/Hufe921/canvas-editor/commit/8878fd7734ae0a566f16ca2db14e64ded5a05f38)), closes [#728](https://github.com/Hufe921/canvas-editor/issues/728)
+
+
+
 ## [0.9.88](https://github.com/Hufe921/canvas-editor/compare/v0.9.87...v0.9.88) (2024-08-02)
 
 

package/dist/canvas-editor.es.js

@@ -23,7 +23,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 var index = "";
-const version = "0.9.88";
+const version = "0.9.89";
 var MaxHeightRatio;
 (function(MaxHeightRatio2) {
   MaxHeightRatio2["HALF"] = "half";
@@ -5550,7 +5550,7 @@ class CheckboxControl {
     return -1;
   }
   setSelect(codes, context = {}, options = {}) {
-    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl()) {
+    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl(context)) {
       return;
     }
     const { control } = this.element;
@@ -5602,7 +5602,7 @@ class CheckboxControl {
 }
 class RadioControl extends CheckboxControl {
   setSelect(codes, context = {}, options = {}) {
-    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl()) {
+    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl(context)) {
       return;
     }
     const { control } = this.element;
@@ -5670,6 +5670,7 @@ function mousedown(evt, host) {
     draw.setPageNo(Number(pageIndex));
   }
   host.isAllowSelection = true;
+  const oldPositionContext = deepClone(position.getPositionContext());
   const positionResult = position.adjustPositionContext({
     x: evt.offsetX,
     y: evt.offsetY
@@ -5690,7 +5691,22 @@ function mousedown(evt, host) {
   const isDirectHitCheckbox = !!(isDirectHit && isCheckbox);
   const isDirectHitRadio = !!(isDirectHit && isRadio);
   if (~index2) {
-    rangeManager.setRange(curIndex, curIndex);
+    let startIndex = curIndex;
+    let endIndex = curIndex;
+    if (evt.shiftKey) {
+      const { startIndex: oldStartIndex } = rangeManager.getRange();
+      if (~oldStartIndex) {
+        const newPositionContext = position.getPositionContext();
+        if (newPositionContext.tdId === oldPositionContext.tdId) {
+          if (curIndex > oldStartIndex) {
+            startIndex = oldStartIndex;
+          } else {
+            endIndex = oldStartIndex;
+          }
+        }
+      }
+    }
+    rangeManager.setRange(startIndex, endIndex);
     position.setCursorPosition(positionList[curIndex]);
     const isSetCheckbox = isDirectHitCheckbox && !isReadonly;
     const isSetRadio = isDirectHitRadio && !isReadonly;
@@ -7261,7 +7277,7 @@ function threeClick(host) {
   if (newStartIndex < 0)
     return;
   let newEndIndex = index2 + downCount + 1;
-  if (((_b = elementList[newEndIndex]) == null ? void 0 : _b.value) === ZERO) {
+  if (((_b = elementList[newEndIndex]) == null ? void 0 : _b.value) === ZERO || newEndIndex > elementList.length - 1) {
     newEndIndex -= 1;
   }
   rangeManager.setRange(newStartIndex, newEndIndex);
@@ -10519,7 +10535,6 @@ class ControlSearch {
   computeHighlightList() {
     const search = this.draw.getSearch();
     const computeHighlight = (elementList, restArgs) => {
-      var _a;
       let i = 0;
       while (i < elementList.length) {
         const element = elementList[i];
@@ -10541,10 +10556,10 @@ class ControlSearch {
             }
           }
         }
-        const controlConceptId = (_a = element == null ? void 0 : element.control) == null ? void 0 : _a.conceptId;
-        if (!controlConceptId)
+        const currentControl = element == null ? void 0 : element.control;
+        if (!currentControl)
           continue;
-        const highlightIndex = this.highlightList.findIndex((highlight2) => highlight2.conceptId === controlConceptId);
+        const highlightIndex = this.highlightList.findIndex((highlight2) => highlight2.id === element.controlId || currentControl.conceptId && currentControl.conceptId === highlight2.conceptId);
         if (!~highlightIndex)
           continue;
         const startIndex = i;
@@ -10748,7 +10763,7 @@ class SelectControl {
   }
   clearSelect(context = {}, options = {}) {
     const { isIgnoreDisabledRule = false, isAddPlaceholder = true } = options;
-    if (!isIgnoreDisabledRule && this.control.getIsDisabledControl()) {
+    if (!isIgnoreDisabledRule && this.control.getIsDisabledControl(context)) {
       return -1;
     }
     const elementList = context.elementList || this.control.getElementList();
@@ -10785,7 +10800,7 @@ class SelectControl {
     return preIndex;
   }
   setSelect(code, context = {}, options = {}) {
-    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl()) {
+    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl(context)) {
       return;
     }
     const elementList = context.elementList || this.control.getElementList();
@@ -10936,7 +10951,7 @@ class TextControl {
     return data2;
   }
   setValue(data2, context = {}, options = {}) {
-    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl()) {
+    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl(context)) {
       return -1;
     }
     const elementList = context.elementList || this.control.getElementList();
@@ -10966,7 +10981,7 @@ class TextControl {
     return start + data2.length - 1;
   }
   clearValue(context = {}, options = {}) {
-    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl()) {
+    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl(context)) {
       return -1;
     }
     const elementList = context.elementList || this.control.getElementList();
@@ -11574,7 +11589,7 @@ class DateControl {
     return data2;
   }
   setValue(data2, context = {}, options = {}) {
-    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl()) {
+    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl(context)) {
       return -1;
     }
     const elementList = context.elementList || this.control.getElementList();
@@ -11605,7 +11620,7 @@ class DateControl {
   }
   clearSelect(context = {}, options = {}) {
     const { isIgnoreDisabledRule = false, isAddPlaceholder = true } = options;
-    if (!isIgnoreDisabledRule && this.control.getIsDisabledControl()) {
+    if (!isIgnoreDisabledRule && this.control.getIsDisabledControl(context)) {
       return -1;
     }
     const range = this.getValueRange(context);
@@ -11623,7 +11638,7 @@ class DateControl {
     return leftIndex;
   }
   setSelect(date, context = {}, options = {}) {
-    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl()) {
+    if (!options.isIgnoreDisabledRule && this.control.getIsDisabledControl(context)) {
       return;
     }
     const elementList = context.elementList || this.control.getElementList();
@@ -11887,13 +11902,13 @@ class Control {
       return false;
     return prefixCount === postfixCount;
   }
-  getIsDisabledControl() {
+  getIsDisabledControl(context = {}) {
     var _a, _b;
     if (!this.activeControl)
       return false;
-    const { startIndex, endIndex } = this.range.getRange();
-    if (startIndex === endIndex) {
-      const elementList = this.getElementList();
+    const { startIndex, endIndex } = context.range || this.range.getRange();
+    if (startIndex === endIndex && ~startIndex && ~endIndex) {
+      const elementList = context.elementList || this.getElementList();
       const startElement = elementList[startIndex];
       if (startElement.controlComponent === ControlComponent.POSTFIX) {
         return false;
@@ -12192,11 +12207,12 @@ class Control {
     }
     return this.activeControl.cut();
   }
-  getValueByConceptId(payload) {
-    const { conceptId } = payload;
+  getValueById(payload) {
+    const { id, conceptId } = payload;
     const result = [];
+    if (!id && !conceptId)
+      return result;
     const getValue = (elementList, zone2) => {
-      var _a;
       let i = 0;
       while (i < elementList.length) {
         const element = elementList[i];
@@ -12211,8 +12227,9 @@ class Control {
             }
           }
         }
-        if (((_a = element == null ? void 0 : element.control) == null ? void 0 : _a.conceptId) !== conceptId)
+        if (!element.control || id && element.controlId !== id || conceptId && element.control.conceptId !== conceptId) {
           continue;
+        }
         const { type, code, valueSets } = element.control;
         let j = i;
         let textControlValue = "";
@@ -12233,8 +12250,8 @@ class Control {
           }));
         } else if (type === ControlType.SELECT || type === ControlType.CHECKBOX || type === ControlType.RADIO) {
           const innerText = code == null ? void 0 : code.split(",").map((selectCode) => {
-            var _a2;
-            return (_a2 = valueSets == null ? void 0 : valueSets.find((valueSet) => valueSet.code === selectCode)) == null ? void 0 : _a2.value;
+            var _a;
+            return (_a = valueSets == null ? void 0 : valueSets.find((valueSet) => valueSet.code === selectCode)) == null ? void 0 : _a.value;
           }).filter(Boolean).join("");
           result.push(__spreadProps(__spreadValues({}, element.control), {
             zone: zone2,
@@ -12264,11 +12281,12 @@ class Control {
     }
     return result;
   }
-  setValueByConceptId(payload) {
+  setValueById(payload) {
     let isExistSet = false;
-    const { conceptId, value } = payload;
+    const { id, conceptId, value } = payload;
+    if (!id && !conceptId)
+      return;
     const setValue = (elementList) => {
-      var _a;
       let i = 0;
       while (i < elementList.length) {
         const element = elementList[i];
@@ -12283,8 +12301,9 @@ class Control {
             }
           }
         }
-        if (((_a = element == null ? void 0 : element.control) == null ? void 0 : _a.conceptId) !== conceptId)
+        if (!element.control || id && element.controlId !== id || conceptId && element.control.conceptId !== conceptId) {
           continue;
+        }
         isExistSet = true;
         const { type } = element.control;
         let currentEndIndex = i;
@@ -12371,10 +12390,11 @@ class Control {
       });
     }
   }
-  setExtensionByConceptId(payload) {
-    const { conceptId, extension } = payload;
+  setExtensionById(payload) {
+    const { id, conceptId, extension } = payload;
+    if (!id && !conceptId)
+      return;
     const setExtension = (elementList) => {
-      var _a;
       let i = 0;
       while (i < elementList.length) {
         const element = elementList[i];
@@ -12389,8 +12409,9 @@ class Control {
             }
           }
         }
-        if (((_a = element == null ? void 0 : element.control) == null ? void 0 : _a.conceptId) !== conceptId)
+        if (!element.control || id && element.controlId !== id || conceptId && element.control.conceptId !== conceptId) {
           continue;
+        }
         element.control.extension = extension;
         let newEndIndex = i;
         while (newEndIndex < elementList.length) {
@@ -12411,11 +12432,12 @@ class Control {
       setExtension(elementList);
     }
   }
-  setPropertiesByConceptId(payload) {
-    const { conceptId, properties } = payload;
+  setPropertiesById(payload) {
+    const { id, conceptId, properties } = payload;
+    if (!id && !conceptId)
+      return;
     let isExistUpdate = false;
     function setProperties(elementList) {
-      var _a;
       let i = 0;
       while (i < elementList.length) {
         const element = elementList[i];
@@ -12430,8 +12452,9 @@ class Control {
             }
           }
         }
-        if (((_a = element == null ? void 0 : element.control) == null ? void 0 : _a.conceptId) !== conceptId)
+        if (!element.control || id && element.controlId !== id || conceptId && element.control.conceptId !== conceptId) {
           continue;
+        }
         isExistUpdate = true;
         element.control = __spreadProps(__spreadValues(__spreadValues({}, element.control), properties), {
           value: element.control.value
@@ -14581,6 +14604,42 @@ class MouseObserver {
     this.eventBus.emit("mouseleave", evt);
   }
 }
+var LineNumberType;
+(function(LineNumberType2) {
+  LineNumberType2["PAGE"] = "page";
+  LineNumberType2["CONTINUITY"] = "continuity";
+})(LineNumberType || (LineNumberType = {}));
+class LineNumber {
+  constructor(draw) {
+    __publicField(this, "draw");
+    __publicField(this, "options");
+    this.draw = draw;
+    this.options = draw.getOptions();
+  }
+  render(ctx, pageNo) {
+    const { scale, lineNumber: { color, size, font, right: right2, type } } = this.options;
+    const textParticle = this.draw.getTextParticle();
+    const margins = this.draw.getMargins();
+    const positionList = this.draw.getPosition().getOriginalMainPositionList();
+    const pageRowList = this.draw.getPageRowList();
+    const rowList = pageRowList[pageNo];
+    ctx.save();
+    ctx.fillStyle = color;
+    ctx.font = `${size * scale}px ${font}`;
+    for (let i = 0; i < rowList.length; i++) {
+      const row = rowList[i];
+      const { coordinate: { leftBottom } } = positionList[row.startIndex];
+      const seq = type === LineNumberType.PAGE ? i + 1 : row.rowIndex + 1;
+      const textMetrics = textParticle.measureText(ctx, {
+        value: `${seq}`
+      });
+      const x = margins[3] - (textMetrics.width + right2) * scale;
+      const y = leftBottom[1] - textMetrics.actualBoundingBoxAscent * scale;
+      ctx.fillText(`${seq}`, x, y);
+    }
+    ctx.restore();
+  }
+}
 class Draw {
   constructor(rootContainer, options, data2, listener, eventBus, override) {
     __publicField(this, "container");
@@ -14617,6 +14676,7 @@ class Draw {
     __publicField(this, "tableParticle");
     __publicField(this, "tableTool");
     __publicField(this, "pageNumber");
+    __publicField(this, "lineNumber");
     __publicField(this, "waterMark");
     __publicField(this, "placeholder");
     __publicField(this, "header");
@@ -14680,6 +14740,7 @@ class Draw {
     this.tableParticle = new TableParticle(this);
     this.tableTool = new TableTool(this);
     this.pageNumber = new PageNumber(this);
+    this.lineNumber = new LineNumber(this);
     this.waterMark = new Watermark(this);
     this.placeholder = new Placeholder(this);
     this.header = new Header(this, data2.header);
@@ -14946,6 +15007,9 @@ class Draw {
   getLineBreakParticle() {
     return this.lineBreakParticle;
   }
+  getTextParticle() {
+    return this.textParticle;
+  }
   getHeaderElementList() {
     return this.header.getElementList();
   }
@@ -15465,6 +15529,7 @@ class Draw {
         ascent: 0,
         elementList: [],
         startIndex: 0,
+        rowIndex: 0,
         rowFlex: ((_a = elementList == null ? void 0 : elementList[0]) == null ? void 0 : _a.rowFlex) || ((_b = elementList == null ? void 0 : elementList[1]) == null ? void 0 : _b.rowFlex)
       });
     }
@@ -15799,6 +15864,7 @@ class Draw {
           startIndex: i,
           elementList: [rowElement],
           ascent,
+          rowIndex: curRow.rowIndex + 1,
           rowFlex: ((_g = elementList[i]) == null ? void 0 : _g.rowFlex) || ((_h = elementList[i + 1]) == null ? void 0 : _h.rowFlex),
           isPageBreak: element.type === ElementType.PAGE_BREAK
         };
@@ -16129,7 +16195,7 @@ class Draw {
   _drawPage(payload) {
     var _a, _b;
     const { elementList, positionList, rowList, pageNo } = payload;
-    const { inactiveAlpha, pageMode, header, footer, pageNumber } = this.options;
+    const { inactiveAlpha, pageMode, header, footer, pageNumber, lineNumber } = this.options;
     const innerWidth = this.getInnerWidth();
     const ctx = this.ctxList[pageNo];
     ctx.globalAlpha = !this.zone.isMainActive() ? inactiveAlpha : 1;
@@ -16177,6 +16243,9 @@ class Draw {
     if (this.elementList.length <= 1 && !((_b = this.elementList[0]) == null ? void 0 : _b.listId)) {
       this.placeholder.render(ctx);
     }
+    if (!lineNumber.disabled) {
+      this.lineNumber.render(ctx, pageNo);
+    }
   }
   _disconnectLazyRender() {
     var _a;
@@ -16687,6 +16756,14 @@ const defaultTableOption = {
 const defaultZoneOption = {
   tipDisabled: true
 };
+const defaultLineNumberOption = {
+  size: 12,
+  font: "Microsoft YaHei",
+  color: "#000000",
+  disabled: true,
+  right: 20,
+  type: LineNumberType.CONTINUITY
+};
 function mergeOption(options = {}) {
   const tableOptions = __spreadValues(__spreadValues({}, defaultTableOption), options.table);
   const headerOptions = __spreadValues(__spreadValues({}, defaultHeaderOption), options.header);
@@ -16705,6 +16782,7 @@ function mergeOption(options = {}) {
   const backgroundOptions = __spreadValues(__spreadValues({}, defaultBackground), options.background);
   const lineBreakOptions = __spreadValues(__spreadValues({}, defaultLineBreak), options.lineBreak);
   const separatorOptions = __spreadValues(__spreadValues({}, defaultSeparatorOption), options.separator);
+  const lineNumberOptions = __spreadValues(__spreadValues({}, defaultLineNumberOption), options.lineNumber);
   return __spreadProps(__spreadValues({
     mode: EditorMode.EDIT,
     defaultType: "TEXT",
@@ -16763,7 +16841,8 @@ function mergeOption(options = {}) {
     zone: zoneOptions,
     background: backgroundOptions,
     lineBreak: lineBreakOptions,
-    separator: separatorOptions
+    separator: separatorOptions,
+    lineNumber: lineNumberOptions
   });
 }
 function printImageBase64(base64List, options) {
@@ -18909,16 +18988,16 @@ class CommandAdapt {
     this.draw.getZone().setZone(zone2);
   }
   getControlValue(payload) {
-    return this.draw.getControl().getValueByConceptId(payload);
+    return this.draw.getControl().getValueById(payload);
   }
   setControlValue(payload) {
-    this.draw.getControl().setValueByConceptId(payload);
+    this.draw.getControl().setValueById(payload);
   }
   setControlExtension(payload) {
-    this.draw.getControl().setExtensionByConceptId(payload);
+    this.draw.getControl().setExtensionById(payload);
   }
   setControlProperties(payload) {
-    this.draw.getControl().setPropertiesByConceptId(payload);
+    this.draw.getControl().setPropertiesById(payload);
   }
   setControlHighlight(payload) {
     this.draw.getControl().setHighlightList(payload);
@@ -19788,7 +19867,9 @@ class ContextMenu {
       const originalElementList = this.draw.getOriginalElementList();
       const originTableElement = originalElementList[index2] || null;
       if (originTableElement) {
-        tableElement = zipElementList([originTableElement])[0];
+        tableElement = zipElementList([originTableElement], {
+          extraPickAttrs: ["id"]
+        })[0];
       }
     }
     const isCrossRowCol = isTable && !!crossRowCol;
@@ -20287,5 +20368,5 @@ class Editor {
     this.use = plugin.use.bind(plugin);
   }
 }
-export { BackgroundRepeat, BackgroundSize, BlockType, Command, ControlIndentation, ControlType, EDITOR_COMPONENT, Editor, EditorComponent, EditorMode, EditorZone, ElementType, INTERNAL_CONTEXT_MENU_KEY, ImageDisplay, KeyMap, LETTER_CLASS, ListStyle, ListType, MaxHeightRatio, NumberType, PageMode, PaperDirection, RenderMode, RowFlex, TableBorder, TdBorder, TdSlash, TextDecorationStyle, TitleLevel, VerticalAlign, WordBreak, Editor as default, splitText };
+export { BackgroundRepeat, BackgroundSize, BlockType, Command, ControlIndentation, ControlType, EDITOR_COMPONENT, Editor, EditorComponent, EditorMode, EditorZone, ElementType, INTERNAL_CONTEXT_MENU_KEY, ImageDisplay, KeyMap, LETTER_CLASS, LineNumberType, ListStyle, ListType, MaxHeightRatio, NumberType, PageMode, PaperDirection, RenderMode, RowFlex, TableBorder, TdBorder, TdSlash, TextDecorationStyle, TitleLevel, VerticalAlign, WordBreak, Editor as default, splitText };
 //# sourceMappingURL=canvas-editor.es.js.map