@ai-table/grid 0.0.47 → 0.0.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/components/drag/drag.component.d.ts +1 -4
  2. package/components/drag/drag.component.d.ts.map +1 -1
  3. package/components/drag/drag.component.scss +1 -1
  4. package/constants/icon.d.ts +2 -0
  5. package/constants/icon.d.ts.map +1 -1
  6. package/constants/table.d.ts +1 -0
  7. package/constants/table.d.ts.map +1 -1
  8. package/core/constants/field.d.ts.map +1 -1
  9. package/core/types/core.d.ts +2 -1
  10. package/core/types/core.d.ts.map +1 -1
  11. package/core/utils/field.d.ts +1 -1
  12. package/esm2022/components/cell-editors/link/edit-link/edit-link.component.mjs +3 -3
  13. package/esm2022/components/drag/drag.component.mjs +7 -47
  14. package/esm2022/constants/icon.mjs +3 -1
  15. package/esm2022/constants/table.mjs +2 -1
  16. package/esm2022/core/constants/field.mjs +7 -1
  17. package/esm2022/core/types/core.mjs +1 -1
  18. package/esm2022/core/utils/field.mjs +2 -2
  19. package/esm2022/grid.component.mjs +12 -13
  20. package/esm2022/public-api.mjs +2 -1
  21. package/esm2022/renderer/components/cells/index.mjs +2 -1
  22. package/esm2022/renderer/components/cells/richtext.component.mjs +90 -0
  23. package/esm2022/renderer/components/field-icon.component.mjs +5 -2
  24. package/esm2022/renderer/drawers/cell-drawer.mjs +5 -3
  25. package/esm2022/utils/i18n.mjs +3 -1
  26. package/esm2022/utils/style.mjs +5 -2
  27. package/fesm2022/ai-table-grid.mjs +937 -876
  28. package/fesm2022/ai-table-grid.mjs.map +1 -1
  29. package/grid.component.d.ts.map +1 -1
  30. package/package.json +1 -1
  31. package/public-api.d.ts +1 -0
  32. package/public-api.d.ts.map +1 -1
  33. package/renderer/components/cells/index.d.ts +1 -0
  34. package/renderer/components/cells/index.d.ts.map +1 -1
  35. package/renderer/components/cells/richtext.component.d.ts +14 -0
  36. package/renderer/components/cells/richtext.component.d.ts.map +1 -0
  37. package/renderer/components/field-icon.component.d.ts +1 -1
  38. package/renderer/components/field-icon.component.d.ts.map +1 -1
  39. package/renderer/drawers/cell-drawer.d.ts.map +1 -1
  40. package/utils/i18n.d.ts +1 -0
  41. package/utils/i18n.d.ts.map +1 -1
  42. package/utils/style.d.ts.map +1 -1
@@ -1,5 +1,28 @@
1
1
  import * as i0 from '@angular/core';
2
- import { signal, computed, output, inject, ElementRef, Component, ChangeDetectionStrategy, Input, input, EventEmitter, Output, ChangeDetectorRef, ViewChild, HostListener, Renderer2, Pipe, model, booleanAttribute, Injectable, InjectionToken, effect, DestroyRef, NgZone, ViewContainerRef, viewChild, afterNextRender, untracked } from '@angular/core';
2
+ import { InjectionToken, input, EventEmitter, inject, ElementRef, effect, Component, ChangeDetectionStrategy, Output, signal, computed, output, Input, ChangeDetectorRef, ViewChild, HostListener, Renderer2, Pipe, model, booleanAttribute, Injectable, DestroyRef, NgZone, ViewContainerRef, viewChild, afterNextRender, untracked } from '@angular/core';
3
+ import Konva from 'konva';
4
+ import { Shape } from 'konva/lib/Shape';
5
+ import { Sprite } from 'konva/lib/shapes/Sprite';
6
+ import { Stage } from 'konva/lib/Stage';
7
+ import { FastLayer } from 'konva/lib/FastLayer';
8
+ import { Group } from 'konva/lib/Group';
9
+ import { Layer } from 'konva/lib/Layer';
10
+ import { Arc } from 'konva/lib/shapes/Arc';
11
+ import { Arrow } from 'konva/lib/shapes/Arrow';
12
+ import { Circle } from 'konva/lib/shapes/Circle';
13
+ import { Ellipse } from 'konva/lib/shapes/Ellipse';
14
+ import { Image as Image$1 } from 'konva/lib/shapes/Image';
15
+ import { Label, Tag } from 'konva/lib/shapes/Label';
16
+ import { Line } from 'konva/lib/shapes/Line';
17
+ import { Path } from 'konva/lib/shapes/Path';
18
+ import { Rect } from 'konva/lib/shapes/Rect';
19
+ import { RegularPolygon } from 'konva/lib/shapes/RegularPolygon';
20
+ import { Ring } from 'konva/lib/shapes/Ring';
21
+ import { Star } from 'konva/lib/shapes/Star';
22
+ import { Text } from 'konva/lib/shapes/Text';
23
+ import { TextPath } from 'konva/lib/shapes/TextPath';
24
+ import { Transformer } from 'konva/lib/shapes/Transformer';
25
+ import { Wedge } from 'konva/lib/shapes/Wedge';
3
26
  import * as i1$1 from 'ngx-tethys/popover';
4
27
  import { ThyPopoverRef, ThyPopover, ThyPopoverModule } from 'ngx-tethys/popover';
5
28
  import ObjectID from 'bson-objectid';
@@ -45,186 +68,588 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
45
68
  import { LRUCache } from 'lru-cache';
46
69
  import { fromUnixTime, subDays } from 'date-fns';
47
70
  import { DEFAULT_COLORS } from 'ngx-tethys/color-picker';
48
- import Konva from 'konva';
49
- import { Shape } from 'konva/lib/Shape';
50
- import { Sprite } from 'konva/lib/shapes/Sprite';
51
71
  import GraphemeSplitter from 'grapheme-splitter';
52
- import { Stage } from 'konva/lib/Stage';
53
- import { FastLayer } from 'konva/lib/FastLayer';
54
- import { Group } from 'konva/lib/Group';
55
- import { Layer } from 'konva/lib/Layer';
56
- import { Arc } from 'konva/lib/shapes/Arc';
57
- import { Arrow } from 'konva/lib/shapes/Arrow';
58
- import { Circle } from 'konva/lib/shapes/Circle';
59
- import { Ellipse } from 'konva/lib/shapes/Ellipse';
60
- import { Image as Image$1 } from 'konva/lib/shapes/Image';
61
- import { Label, Tag } from 'konva/lib/shapes/Label';
62
- import { Line } from 'konva/lib/shapes/Line';
63
- import { Path } from 'konva/lib/shapes/Path';
64
- import { Rect } from 'konva/lib/shapes/Rect';
65
- import { RegularPolygon } from 'konva/lib/shapes/RegularPolygon';
66
- import { Ring } from 'konva/lib/shapes/Ring';
67
- import { Star } from 'konva/lib/shapes/Star';
68
- import { Text } from 'konva/lib/shapes/Text';
69
- import { TextPath } from 'konva/lib/shapes/TextPath';
70
- import { Transformer } from 'konva/lib/shapes/Transformer';
71
- import { Wedge } from 'konva/lib/shapes/Wedge';
72
72
 
73
- const Colors = {
74
- primary: '#6698FF',
75
- gray100: '#f5f5f5',
76
- gray200: '#eee',
77
- gray300: '#ddd',
78
- gray800: '#333',
79
- gray600: '#999',
80
- gray700: '#666',
81
- white: '#fff',
82
- black: '#000',
83
- transparent: 'transparent',
84
- gray80: '#fafafa',
85
- headSelectedBgColor: '#EAEFFA',
86
- itemActiveBgColor: '#6698ff1a',
87
- itemMatchBgColor: '#ff9f731a',
88
- waring: '#ffcd5d',
89
- success: '#73d897'
90
- };
73
+ const KO_CONTAINER_TOKEN = new InjectionToken('KO_CONTAINER_TOKEN');
91
74
 
92
- const AITable = {
93
- getColors() {
94
- return Colors;
95
- },
96
- getVisibleFields(aiTable) {
97
- return aiTable.gridData().fields.filter((field) => !field.hidden);
98
- },
99
- getVisibleRows(aiTable) {
100
- return aiTable.records();
101
- },
102
- getActiveCell(aiTable) {
103
- return aiTable.selection().activeCell;
104
- },
105
- getActiveRecordIds(aiTable) {
106
- const selectedRecords = aiTable.selection().selectedRecords;
107
- const selectedCells = aiTable.selection().selectedCells;
108
- let selectedRecordIds = [];
109
- if (selectedRecords.size > 0) {
110
- selectedRecordIds = [...selectedRecords.keys()];
111
- }
112
- else if (selectedCells.size > 0) {
113
- selectedRecordIds = [...selectedCells].map((item) => item.split(':')[0]);
75
+ function updatePicture(node) {
76
+ const drawingNode = node.getLayer() || node.getStage();
77
+ if (drawingNode) {
78
+ drawingNode.batchDraw();
79
+ }
80
+ }
81
+
82
+ // adapted FROM: https://github.com/lavrton/react-konva/blob/master/src/react-konva-fiber.js
83
+ function applyNodeProps(component, props = {}, oldProps = {}) {
84
+ if ('id' in props) {
85
+ const message = `You are using "id" attribute for Konva node. In some very rare cases it may produce bugs. Currently we recommend not to use it and use "name" attribute instead.`;
86
+ console.warn(message);
87
+ }
88
+ const instance = component.getNode();
89
+ const updatedProps = {};
90
+ let hasUpdates = false;
91
+ Object.keys(oldProps).forEach((key) => {
92
+ const isEvent = key.slice(0, 2) === 'ko';
93
+ const propChanged = oldProps[key] !== props[key];
94
+ if (isEvent && propChanged) {
95
+ let eventName = key.slice(2).toLowerCase();
96
+ if (eventName.slice(0, 7) === 'content') {
97
+ eventName = 'content' + eventName.slice(7, 8).toUpperCase() + eventName.slice(8);
98
+ }
99
+ instance.off(eventName, oldProps[key]);
114
100
  }
115
- else {
116
- selectedRecordIds = [];
101
+ const toRemove = !Object.hasOwn(props, key);
102
+ if (toRemove) {
103
+ instance.setAttr(key, undefined);
117
104
  }
118
- return selectedRecordIds;
119
- },
120
- isCellVisible(aiTable, cell) {
121
- const visibleRowIndexMap = aiTable.context.visibleRowsIndexMap();
122
- const visibleColumnIndexMap = aiTable.context.visibleColumnsIndexMap();
123
- const [recordId, fieldId] = cell || [];
124
- const isVisible = visibleRowIndexMap.has(recordId) && visibleColumnIndexMap.has(fieldId);
125
- return isVisible;
126
- },
127
- getCellIndex(aiTable, cell) {
128
- const visibleRowIndexMap = aiTable.context.visibleRowsIndexMap();
129
- const visibleColumnIndexMap = aiTable.context.visibleColumnsIndexMap();
130
- if (AITable.isCellVisible(aiTable, cell)) {
131
- const [recordId, fieldId] = cell;
132
- return {
133
- rowIndex: visibleRowIndexMap.get(recordId),
134
- columnIndex: visibleColumnIndexMap.get(fieldId)
135
- };
105
+ });
106
+ Object.keys(props).forEach((key) => {
107
+ const isEvent = key.slice(0, 2) === 'ko';
108
+ const toAdd = oldProps[key] !== props[key];
109
+ if (isEvent && toAdd) {
110
+ let eventName = key.slice(2).toLowerCase();
111
+ if (eventName.slice(0, 7) === 'content') {
112
+ eventName = 'content' + eventName.slice(7, 8).toUpperCase() + eventName.slice(8);
113
+ }
114
+ if (props[key]) {
115
+ instance.off(eventName);
116
+ instance.on(eventName, (event) => {
117
+ props[key]({
118
+ angularComponent: component,
119
+ event
120
+ });
121
+ });
122
+ }
136
123
  }
137
- return null;
138
- },
139
- isFrozenColumn(aiTable, columnIndex) {
140
- const frozenColumnCount = aiTable.context.frozenColumnCount();
141
- if (columnIndex <= frozenColumnCount - 1) {
142
- return true;
124
+ if (!isEvent && (props[key] !== oldProps[key] || props[key] !== instance.getAttr(key))) {
125
+ hasUpdates = true;
126
+ updatedProps[key] = props[key];
143
127
  }
144
- return false;
128
+ });
129
+ if (hasUpdates) {
130
+ instance.setAttrs(updatedProps);
131
+ updatePicture(instance);
132
+ let val;
133
+ Object.keys(updatedProps).forEach((prop) => {
134
+ val = updatedProps[prop];
135
+ if (val instanceof Image && !val.complete) {
136
+ const node = instance;
137
+ val.addEventListener('load', function () {
138
+ const layer = node.getLayer();
139
+ if (layer) {
140
+ layer.batchDraw();
141
+ }
142
+ });
143
+ }
144
+ });
145
145
  }
146
- };
147
-
148
- var AITableFieldType;
149
- (function (AITableFieldType) {
150
- AITableFieldType["text"] = "text";
151
- AITableFieldType["richText"] = "rich_text";
152
- AITableFieldType["select"] = "select";
153
- AITableFieldType["number"] = "number";
154
- AITableFieldType["date"] = "date";
155
- AITableFieldType["member"] = "member";
156
- AITableFieldType["progress"] = "progress";
157
- AITableFieldType["rate"] = "rate";
158
- AITableFieldType["link"] = "link";
159
- AITableFieldType["attachment"] = "attachment";
160
- AITableFieldType["createdAt"] = "created_at";
161
- AITableFieldType["updatedAt"] = "updated_at";
162
- AITableFieldType["createdBy"] = "created_by";
163
- AITableFieldType["updatedBy"] = "updated_by";
164
- })(AITableFieldType || (AITableFieldType = {}));
165
- var AITableStatType;
166
- (function (AITableStatType) {
167
- AITableStatType[AITableStatType["None"] = 0] = "None";
168
- AITableStatType[AITableStatType["CountAll"] = 1] = "CountAll";
169
- AITableStatType[AITableStatType["Empty"] = 2] = "Empty";
170
- AITableStatType[AITableStatType["Filled"] = 3] = "Filled";
171
- AITableStatType[AITableStatType["Unique"] = 4] = "Unique";
172
- AITableStatType[AITableStatType["PercentEmpty"] = 5] = "PercentEmpty";
173
- AITableStatType[AITableStatType["PercentFilled"] = 6] = "PercentFilled";
174
- AITableStatType[AITableStatType["PercentUnique"] = 7] = "PercentUnique";
175
- AITableStatType[AITableStatType["Sum"] = 8] = "Sum";
176
- AITableStatType[AITableStatType["Average"] = 9] = "Average";
177
- AITableStatType[AITableStatType["Max"] = 10] = "Max";
178
- AITableStatType[AITableStatType["Min"] = 11] = "Min";
179
- AITableStatType[AITableStatType["DateRangeOfDays"] = 12] = "DateRangeOfDays";
180
- AITableStatType[AITableStatType["DateRangeOfMonths"] = 13] = "DateRangeOfMonths";
181
- AITableStatType[AITableStatType["Checked"] = 14] = "Checked";
182
- AITableStatType[AITableStatType["UnChecked"] = 15] = "UnChecked";
183
- AITableStatType[AITableStatType["PercentChecked"] = 16] = "PercentChecked";
184
- AITableStatType[AITableStatType["PercentUnChecked"] = 17] = "PercentUnChecked";
185
- })(AITableStatType || (AITableStatType = {}));
186
- var AITableSelectOptionStyle;
187
- (function (AITableSelectOptionStyle) {
188
- AITableSelectOptionStyle[AITableSelectOptionStyle["text"] = 1] = "text";
189
- AITableSelectOptionStyle[AITableSelectOptionStyle["tag"] = 2] = "tag";
190
- AITableSelectOptionStyle[AITableSelectOptionStyle["dot"] = 3] = "dot";
191
- AITableSelectOptionStyle[AITableSelectOptionStyle["piece"] = 4] = "piece";
192
- })(AITableSelectOptionStyle || (AITableSelectOptionStyle = {}));
193
- var Direction;
194
- (function (Direction) {
195
- Direction["before"] = "before";
196
- Direction["after"] = "after";
197
- })(Direction || (Direction = {}));
198
- var DragType;
199
- (function (DragType) {
200
- DragType["record"] = "record";
201
- DragType["field"] = "field";
202
- DragType["columnWidth"] = "columnWidth";
203
- DragType["none"] = "none";
204
- })(DragType || (DragType = {}));
146
+ }
205
147
 
206
- var AITableGridI18nKey;
207
- (function (AITableGridI18nKey) {
208
- AITableGridI18nKey["dataPickerPlaceholder"] = "dataPickerPlaceholder";
209
- AITableGridI18nKey["linkTooltip"] = "linkTooltip";
210
- AITableGridI18nKey["invalidLinkFormat"] = "invalidLinkFormat";
211
- AITableGridI18nKey["linkRequired"] = "linkRequired";
212
- AITableGridI18nKey["linkText"] = "linkText";
213
- AITableGridI18nKey["linkUrl"] = "linkUrl";
214
- AITableGridI18nKey["inputText"] = "inputText";
215
- AITableGridI18nKey["inputUrl"] = "inputUrl";
216
- AITableGridI18nKey["fieldColumnName"] = "fieldColumnName";
217
- AITableGridI18nKey["fieldColumnNamePlaceholder"] = "fieldColumnNamePlaceholder";
218
- AITableGridI18nKey["fieldType"] = "fieldType";
219
- AITableGridI18nKey["allowMultipleMembers"] = "allowMultipleMembers";
220
- AITableGridI18nKey["cancel"] = "cancel";
221
- AITableGridI18nKey["apply"] = "apply";
148
+ function camelize(str) {
149
+ return str
150
+ .replace(/^\w|[A-Z]|\b\w/g, function (letter, index) {
151
+ return index == 0 ? letter.toLowerCase() : letter.toUpperCase();
152
+ })
153
+ .replace(/\s+/g, '');
154
+ }
155
+ function capitalizeFirstLetter(string) {
156
+ return string.charAt(0).toUpperCase() + string.slice(1);
157
+ }
158
+ function getName(componentTag) {
159
+ return capitalizeFirstLetter(camelize(componentTag.slice(3).replace('-', ' ')));
160
+ }
161
+ function createListener(instance) {
162
+ const output = {};
163
+ [
164
+ 'koMouseover',
165
+ 'koMousemove',
166
+ 'koMouseout',
167
+ 'koMouseenter',
168
+ 'koMouseleave',
169
+ 'koMousedown',
170
+ 'koMouseup',
171
+ 'koWheel',
172
+ 'koContextmenu',
173
+ 'koClick',
174
+ 'koDblclick',
175
+ 'koTouchstart',
176
+ 'koTouchmove',
177
+ 'koTouchend',
178
+ 'koTap',
179
+ 'koDbltap',
180
+ 'koDragstart',
181
+ 'koDragmove',
182
+ 'koDragend'
183
+ ].forEach((eventName) => {
184
+ const name = eventName;
185
+ const eventEmitter = instance[name];
186
+ if (eventEmitter.observed) {
187
+ output[eventName] = eventEmitter.emit.bind(eventEmitter);
188
+ }
189
+ });
190
+ return output;
191
+ }
192
+
193
+ class KoShape {
194
+ constructor() {
195
+ this.config = input();
196
+ this.koMouseover = new EventEmitter();
197
+ this.koMousemove = new EventEmitter();
198
+ this.koMouseout = new EventEmitter();
199
+ this.koMouseenter = new EventEmitter();
200
+ this.koMouseleave = new EventEmitter();
201
+ this.koMousedown = new EventEmitter();
202
+ this.koMouseup = new EventEmitter();
203
+ this.koWheel = new EventEmitter();
204
+ this.koContextmenu = new EventEmitter();
205
+ this.koClick = new EventEmitter();
206
+ this.koDblclick = new EventEmitter();
207
+ this.koTouchstart = new EventEmitter();
208
+ this.koTouchmove = new EventEmitter();
209
+ this.koTouchend = new EventEmitter();
210
+ this.koTap = new EventEmitter();
211
+ this.koDbltap = new EventEmitter();
212
+ this.koDragstart = new EventEmitter();
213
+ this.koDragmove = new EventEmitter();
214
+ this.koDragend = new EventEmitter();
215
+ this.elementRef = inject((ElementRef));
216
+ this.container = inject(KO_CONTAINER_TOKEN, { skipSelf: true });
217
+ this.cacheProps = {};
218
+ this.nameNode = getName(this.elementRef.nativeElement.localName);
219
+ effect(() => {
220
+ if (this.config()) {
221
+ this.updateNode(this.config());
222
+ }
223
+ });
224
+ }
225
+ getNode() {
226
+ return this._node;
227
+ }
228
+ ngOnInit() {
229
+ this.initKonva();
230
+ }
231
+ initKonva() {
232
+ if (!this._node) {
233
+ this._node = new Shape();
234
+ }
235
+ if (this.nameNode === 'Shape') {
236
+ this._node = new Shape();
237
+ }
238
+ else if (this.nameNode === 'Sprite') {
239
+ this._node = new Sprite(this.config());
240
+ }
241
+ else {
242
+ this._node = new Konva[this.nameNode](undefined);
243
+ }
244
+ const animationStage = this._node.to.bind(this._node);
245
+ this._node.to = (newConfig) => {
246
+ animationStage(newConfig);
247
+ setTimeout(() => {
248
+ Object.keys(this._node.attrs).forEach((key) => {
249
+ if (typeof this._node.attrs[key] !== 'function') {
250
+ this.config()[key] = this._node.attrs[key];
251
+ }
252
+ });
253
+ }, 200);
254
+ };
255
+ if (this.config()) {
256
+ this.updateNode(this.config());
257
+ }
258
+ }
259
+ updateNode(config) {
260
+ if (!this._node)
261
+ return;
262
+ const props = {
263
+ ...config,
264
+ ...createListener(this)
265
+ };
266
+ applyNodeProps(this, props, this.cacheProps);
267
+ this.cacheProps = props;
268
+ }
269
+ ngAfterViewInit() {
270
+ const container = this.container.getNode();
271
+ container.add(this.getNode());
272
+ updatePicture(this.container.getNode());
273
+ }
274
+ ngOnDestroy() {
275
+ this._node?.destroy();
276
+ }
277
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoShape, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
278
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: KoShape, isStandalone: true, selector: "ko-shape, ko-circle, ko-label, ko-rect, ko-ellipse, ko-wedge, ko-line, ko-sprite, ko-image, ko-text, ko-text-path, ko-star, ko-ring, ko-arc, ko-tag, ko-path, ko-regular-polygon, ko-arrow, ko-transformer", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { koMouseover: "koMouseover", koMousemove: "koMousemove", koMouseout: "koMouseout", koMouseenter: "koMouseenter", koMouseleave: "koMouseleave", koMousedown: "koMousedown", koMouseup: "koMouseup", koWheel: "koWheel", koContextmenu: "koContextmenu", koClick: "koClick", koDblclick: "koDblclick", koTouchstart: "koTouchstart", koTouchmove: "koTouchmove", koTouchend: "koTouchend", koTap: "koTap", koDbltap: "koDbltap", koDragstart: "koDragstart", koDragmove: "koDragmove", koDragend: "koDragend" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
279
+ }
280
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoShape, decorators: [{
281
+ type: Component,
282
+ args: [{
283
+ selector: 'ko-shape, ko-circle, ko-label, ko-rect, ko-ellipse, ko-wedge, ko-line, ko-sprite, ko-image, ko-text, ko-text-path, ko-star, ko-ring, ko-arc, ko-tag, ko-path, ko-regular-polygon, ko-arrow, ko-transformer',
284
+ standalone: true,
285
+ template: `<ng-content></ng-content>`,
286
+ changeDetection: ChangeDetectionStrategy.OnPush
287
+ }]
288
+ }], ctorParameters: () => [], propDecorators: { koMouseover: [{
289
+ type: Output
290
+ }], koMousemove: [{
291
+ type: Output
292
+ }], koMouseout: [{
293
+ type: Output
294
+ }], koMouseenter: [{
295
+ type: Output
296
+ }], koMouseleave: [{
297
+ type: Output
298
+ }], koMousedown: [{
299
+ type: Output
300
+ }], koMouseup: [{
301
+ type: Output
302
+ }], koWheel: [{
303
+ type: Output
304
+ }], koContextmenu: [{
305
+ type: Output
306
+ }], koClick: [{
307
+ type: Output
308
+ }], koDblclick: [{
309
+ type: Output
310
+ }], koTouchstart: [{
311
+ type: Output
312
+ }], koTouchmove: [{
313
+ type: Output
314
+ }], koTouchend: [{
315
+ type: Output
316
+ }], koTap: [{
317
+ type: Output
318
+ }], koDbltap: [{
319
+ type: Output
320
+ }], koDragstart: [{
321
+ type: Output
322
+ }], koDragmove: [{
323
+ type: Output
324
+ }], koDragend: [{
325
+ type: Output
326
+ }] } });
327
+
328
+ class KoContainer extends KoShape {
329
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoContainer, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
330
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: KoContainer, isStandalone: true, selector: "ko-layer, ko-fastlayer, ko-group", providers: [
331
+ {
332
+ provide: KO_CONTAINER_TOKEN,
333
+ useExisting: KoContainer
334
+ }
335
+ ], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
336
+ }
337
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoContainer, decorators: [{
338
+ type: Component,
339
+ args: [{
340
+ selector: 'ko-layer, ko-fastlayer, ko-group',
341
+ standalone: true,
342
+ template: `<ng-content></ng-content>`,
343
+ providers: [
344
+ {
345
+ provide: KO_CONTAINER_TOKEN,
346
+ useExisting: KoContainer
347
+ }
348
+ ],
349
+ changeDetection: ChangeDetectionStrategy.OnPush
350
+ }]
351
+ }] });
352
+
353
+ class KoStage {
354
+ constructor() {
355
+ this.config = input();
356
+ this.koMouseover = new EventEmitter();
357
+ this.koMousemove = new EventEmitter();
358
+ this.koMouseout = new EventEmitter();
359
+ this.koMouseenter = new EventEmitter();
360
+ this.koMouseleave = new EventEmitter();
361
+ this.koMousedown = new EventEmitter();
362
+ this.koMouseup = new EventEmitter();
363
+ this.koWheel = new EventEmitter();
364
+ this.koContextmenu = new EventEmitter();
365
+ this.koClick = new EventEmitter();
366
+ this.koDblclick = new EventEmitter();
367
+ this.koTouchstart = new EventEmitter();
368
+ this.koTouchmove = new EventEmitter();
369
+ this.koTouchend = new EventEmitter();
370
+ this.koTap = new EventEmitter();
371
+ this.koDbltap = new EventEmitter();
372
+ this.koDragstart = new EventEmitter();
373
+ this.koDragmove = new EventEmitter();
374
+ this.koDragend = new EventEmitter();
375
+ this.cacheProps = {};
376
+ this.nodeContainer = inject(ElementRef).nativeElement;
377
+ effect(() => {
378
+ if (this.config()) {
379
+ if (!this._stage) {
380
+ this.initStage();
381
+ }
382
+ this.updateNode(this.config());
383
+ }
384
+ });
385
+ }
386
+ ngOnInit() {
387
+ this.initStage();
388
+ }
389
+ getNode() {
390
+ return this._stage;
391
+ }
392
+ initStage() {
393
+ this._stage = new Stage({
394
+ ...this.config(),
395
+ container: this.nodeContainer
396
+ });
397
+ }
398
+ updateNode(config) {
399
+ const props = {
400
+ ...config,
401
+ ...createListener(this)
402
+ };
403
+ applyNodeProps(this, props, this.cacheProps);
404
+ this.cacheProps = props;
405
+ }
406
+ ngOnDestroy() {
407
+ this._stage?.destroy();
408
+ }
409
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoStage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
410
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: KoStage, isStandalone: true, selector: "ko-stage", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { koMouseover: "koMouseover", koMousemove: "koMousemove", koMouseout: "koMouseout", koMouseenter: "koMouseenter", koMouseleave: "koMouseleave", koMousedown: "koMousedown", koMouseup: "koMouseup", koWheel: "koWheel", koContextmenu: "koContextmenu", koClick: "koClick", koDblclick: "koDblclick", koTouchstart: "koTouchstart", koTouchmove: "koTouchmove", koTouchend: "koTouchend", koTap: "koTap", koDbltap: "koDbltap", koDragstart: "koDragstart", koDragmove: "koDragmove", koDragend: "koDragend" }, providers: [
411
+ {
412
+ provide: KO_CONTAINER_TOKEN,
413
+ useExisting: KoStage
414
+ }
415
+ ], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
416
+ }
417
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoStage, decorators: [{
418
+ type: Component,
419
+ args: [{
420
+ selector: 'ko-stage',
421
+ standalone: true,
422
+ template: `<ng-content></ng-content>`,
423
+ providers: [
424
+ {
425
+ provide: KO_CONTAINER_TOKEN,
426
+ useExisting: KoStage
427
+ }
428
+ ],
429
+ changeDetection: ChangeDetectionStrategy.OnPush
430
+ }]
431
+ }], ctorParameters: () => [], propDecorators: { koMouseover: [{
432
+ type: Output
433
+ }], koMousemove: [{
434
+ type: Output
435
+ }], koMouseout: [{
436
+ type: Output
437
+ }], koMouseenter: [{
438
+ type: Output
439
+ }], koMouseleave: [{
440
+ type: Output
441
+ }], koMousedown: [{
442
+ type: Output
443
+ }], koMouseup: [{
444
+ type: Output
445
+ }], koWheel: [{
446
+ type: Output
447
+ }], koContextmenu: [{
448
+ type: Output
449
+ }], koClick: [{
450
+ type: Output
451
+ }], koDblclick: [{
452
+ type: Output
453
+ }], koTouchstart: [{
454
+ type: Output
455
+ }], koTouchmove: [{
456
+ type: Output
457
+ }], koTouchend: [{
458
+ type: Output
459
+ }], koTap: [{
460
+ type: Output
461
+ }], koDbltap: [{
462
+ type: Output
463
+ }], koDragstart: [{
464
+ type: Output
465
+ }], koDragmove: [{
466
+ type: Output
467
+ }], koDragend: [{
468
+ type: Output
469
+ }] } });
470
+
471
+ class KoComponent extends Component {
472
+ }
473
+
474
+ const KoShapeTypes = {
475
+ Arc,
476
+ Arrow,
477
+ Circle,
478
+ Ellipse,
479
+ Image: Image$1,
480
+ Label,
481
+ Tag,
482
+ Line,
483
+ Path,
484
+ Rect,
485
+ RegularPolygon,
486
+ Ring,
487
+ Star,
488
+ Text,
489
+ TextPath,
490
+ Transformer,
491
+ Wedge,
492
+ Group,
493
+ Layer,
494
+ FastLayer
495
+ };
496
+
497
+ const Colors = {
498
+ primary: '#6698FF',
499
+ gray100: '#f5f5f5',
500
+ gray200: '#eee',
501
+ gray300: '#ddd',
502
+ gray800: '#333',
503
+ gray600: '#999',
504
+ gray700: '#666',
505
+ white: '#fff',
506
+ black: '#000',
507
+ transparent: 'transparent',
508
+ gray80: '#fafafa',
509
+ headSelectedBgColor: '#EAEFFA',
510
+ itemActiveBgColor: '#6698ff1a',
511
+ itemMatchBgColor: '#ff9f731a',
512
+ waring: '#ffcd5d',
513
+ success: '#73d897'
514
+ };
515
+
516
+ const AITable = {
517
+ getColors() {
518
+ return Colors;
519
+ },
520
+ getVisibleFields(aiTable) {
521
+ return aiTable.gridData().fields.filter((field) => !field.hidden);
522
+ },
523
+ getVisibleRows(aiTable) {
524
+ return aiTable.records();
525
+ },
526
+ getActiveCell(aiTable) {
527
+ return aiTable.selection().activeCell;
528
+ },
529
+ getActiveRecordIds(aiTable) {
530
+ const selectedRecords = aiTable.selection().selectedRecords;
531
+ const selectedCells = aiTable.selection().selectedCells;
532
+ let selectedRecordIds = [];
533
+ if (selectedRecords.size > 0) {
534
+ selectedRecordIds = [...selectedRecords.keys()];
535
+ }
536
+ else if (selectedCells.size > 0) {
537
+ selectedRecordIds = [...selectedCells].map((item) => item.split(':')[0]);
538
+ }
539
+ else {
540
+ selectedRecordIds = [];
541
+ }
542
+ return selectedRecordIds;
543
+ },
544
+ isCellVisible(aiTable, cell) {
545
+ const visibleRowIndexMap = aiTable.context.visibleRowsIndexMap();
546
+ const visibleColumnIndexMap = aiTable.context.visibleColumnsIndexMap();
547
+ const [recordId, fieldId] = cell || [];
548
+ const isVisible = visibleRowIndexMap.has(recordId) && visibleColumnIndexMap.has(fieldId);
549
+ return isVisible;
550
+ },
551
+ getCellIndex(aiTable, cell) {
552
+ const visibleRowIndexMap = aiTable.context.visibleRowsIndexMap();
553
+ const visibleColumnIndexMap = aiTable.context.visibleColumnsIndexMap();
554
+ if (AITable.isCellVisible(aiTable, cell)) {
555
+ const [recordId, fieldId] = cell;
556
+ return {
557
+ rowIndex: visibleRowIndexMap.get(recordId),
558
+ columnIndex: visibleColumnIndexMap.get(fieldId)
559
+ };
560
+ }
561
+ return null;
562
+ },
563
+ isFrozenColumn(aiTable, columnIndex) {
564
+ const frozenColumnCount = aiTable.context.frozenColumnCount();
565
+ if (columnIndex <= frozenColumnCount - 1) {
566
+ return true;
567
+ }
568
+ return false;
569
+ }
570
+ };
571
+
572
+ var AITableFieldType;
573
+ (function (AITableFieldType) {
574
+ AITableFieldType["text"] = "text";
575
+ AITableFieldType["richText"] = "rich_text";
576
+ AITableFieldType["select"] = "select";
577
+ AITableFieldType["number"] = "number";
578
+ AITableFieldType["date"] = "date";
579
+ AITableFieldType["member"] = "member";
580
+ AITableFieldType["progress"] = "progress";
581
+ AITableFieldType["rate"] = "rate";
582
+ AITableFieldType["link"] = "link";
583
+ AITableFieldType["attachment"] = "attachment";
584
+ AITableFieldType["createdAt"] = "created_at";
585
+ AITableFieldType["updatedAt"] = "updated_at";
586
+ AITableFieldType["createdBy"] = "created_by";
587
+ AITableFieldType["updatedBy"] = "updated_by";
588
+ })(AITableFieldType || (AITableFieldType = {}));
589
+ var AITableStatType;
590
+ (function (AITableStatType) {
591
+ AITableStatType[AITableStatType["None"] = 0] = "None";
592
+ AITableStatType[AITableStatType["CountAll"] = 1] = "CountAll";
593
+ AITableStatType[AITableStatType["Empty"] = 2] = "Empty";
594
+ AITableStatType[AITableStatType["Filled"] = 3] = "Filled";
595
+ AITableStatType[AITableStatType["Unique"] = 4] = "Unique";
596
+ AITableStatType[AITableStatType["PercentEmpty"] = 5] = "PercentEmpty";
597
+ AITableStatType[AITableStatType["PercentFilled"] = 6] = "PercentFilled";
598
+ AITableStatType[AITableStatType["PercentUnique"] = 7] = "PercentUnique";
599
+ AITableStatType[AITableStatType["Sum"] = 8] = "Sum";
600
+ AITableStatType[AITableStatType["Average"] = 9] = "Average";
601
+ AITableStatType[AITableStatType["Max"] = 10] = "Max";
602
+ AITableStatType[AITableStatType["Min"] = 11] = "Min";
603
+ AITableStatType[AITableStatType["DateRangeOfDays"] = 12] = "DateRangeOfDays";
604
+ AITableStatType[AITableStatType["DateRangeOfMonths"] = 13] = "DateRangeOfMonths";
605
+ AITableStatType[AITableStatType["Checked"] = 14] = "Checked";
606
+ AITableStatType[AITableStatType["UnChecked"] = 15] = "UnChecked";
607
+ AITableStatType[AITableStatType["PercentChecked"] = 16] = "PercentChecked";
608
+ AITableStatType[AITableStatType["PercentUnChecked"] = 17] = "PercentUnChecked";
609
+ })(AITableStatType || (AITableStatType = {}));
610
+ var AITableSelectOptionStyle;
611
+ (function (AITableSelectOptionStyle) {
612
+ AITableSelectOptionStyle[AITableSelectOptionStyle["text"] = 1] = "text";
613
+ AITableSelectOptionStyle[AITableSelectOptionStyle["tag"] = 2] = "tag";
614
+ AITableSelectOptionStyle[AITableSelectOptionStyle["dot"] = 3] = "dot";
615
+ AITableSelectOptionStyle[AITableSelectOptionStyle["piece"] = 4] = "piece";
616
+ })(AITableSelectOptionStyle || (AITableSelectOptionStyle = {}));
617
+ var Direction;
618
+ (function (Direction) {
619
+ Direction["before"] = "before";
620
+ Direction["after"] = "after";
621
+ })(Direction || (Direction = {}));
622
+ var DragType;
623
+ (function (DragType) {
624
+ DragType["record"] = "record";
625
+ DragType["field"] = "field";
626
+ DragType["columnWidth"] = "columnWidth";
627
+ DragType["none"] = "none";
628
+ })(DragType || (DragType = {}));
629
+
630
+ var AITableGridI18nKey;
631
+ (function (AITableGridI18nKey) {
632
+ AITableGridI18nKey["dataPickerPlaceholder"] = "dataPickerPlaceholder";
633
+ AITableGridI18nKey["linkTooltip"] = "linkTooltip";
634
+ AITableGridI18nKey["invalidLinkFormat"] = "invalidLinkFormat";
635
+ AITableGridI18nKey["linkRequired"] = "linkRequired";
636
+ AITableGridI18nKey["linkText"] = "linkText";
637
+ AITableGridI18nKey["linkUrl"] = "linkUrl";
638
+ AITableGridI18nKey["inputText"] = "inputText";
639
+ AITableGridI18nKey["inputUrl"] = "inputUrl";
640
+ AITableGridI18nKey["fieldColumnName"] = "fieldColumnName";
641
+ AITableGridI18nKey["fieldColumnNamePlaceholder"] = "fieldColumnNamePlaceholder";
642
+ AITableGridI18nKey["fieldType"] = "fieldType";
643
+ AITableGridI18nKey["allowMultipleMembers"] = "allowMultipleMembers";
644
+ AITableGridI18nKey["cancel"] = "cancel";
645
+ AITableGridI18nKey["apply"] = "apply";
222
646
  AITableGridI18nKey["fieldNameRequired"] = "fieldNameRequired";
223
647
  AITableGridI18nKey["fieldNameDuplicate"] = "fieldNameDuplicate";
224
648
  AITableGridI18nKey["confirm"] = "confirm";
225
649
  AITableGridI18nKey["copiedCells"] = "copiedCells";
226
650
  AITableGridI18nKey["invalidPasteContent"] = "invalidPasteContent";
227
651
  AITableGridI18nKey["fieldTypeText"] = "fieldTypeText";
652
+ AITableGridI18nKey["fieldTypeRichtext"] = "fieldTypeRichtext";
228
653
  AITableGridI18nKey["fieldTypeSelect"] = "fieldTypeSelect";
229
654
  AITableGridI18nKey["fieldTypeMultiSelect"] = "fieldTypeMultiSelect";
230
655
  AITableGridI18nKey["fieldTypeNumber"] = "fieldTypeNumber";
@@ -260,6 +685,7 @@ const AITableI18nText = {
260
685
  [AITableGridI18nKey.copiedCells]: '已复制 {count} 个单元格',
261
686
  [AITableGridI18nKey.invalidPasteContent]: '粘贴内容不符合当前类型', // 新增
262
687
  [AITableGridI18nKey.fieldTypeText]: '单行文本',
688
+ [AITableGridI18nKey.fieldTypeRichtext]: '多行文本',
263
689
  [AITableGridI18nKey.fieldTypeSelect]: '单选',
264
690
  [AITableGridI18nKey.fieldTypeMultiSelect]: '多选',
265
691
  [AITableGridI18nKey.fieldTypeNumber]: '数字',
@@ -300,6 +726,12 @@ function getFieldOptions(aiTable) {
300
726
  icon: 'font',
301
727
  width: AI_TABLE_FIELD_MAX_WIDTH
302
728
  },
729
+ {
730
+ type: AITableFieldType.richText,
731
+ name: getI18nTextByKey(aiTable, AITableGridI18nKey.fieldTypeRichtext),
732
+ icon: 'multiline-text',
733
+ width: AI_TABLE_FIELD_MAX_WIDTH
734
+ },
303
735
  {
304
736
  type: AITableFieldType.select,
305
737
  name: getI18nTextByKey(aiTable, AITableGridI18nKey.fieldTypeSelect),
@@ -820,7 +1252,7 @@ function getDefaultFieldValue(field) {
820
1252
  if (isArrayField(field)) {
821
1253
  return [];
822
1254
  }
823
- if (isNumberFiled(field)) {
1255
+ if (isNumberFiled(field) || field.type === AITableFieldType.richText) {
824
1256
  return null;
825
1257
  }
826
1258
  return '';
@@ -1143,7 +1575,7 @@ class LinkEditComponent {
1143
1575
  this.confirm.emit(link);
1144
1576
  }
1145
1577
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LinkEditComponent, deps: [{ token: i1$1.ThyPopoverRef }], target: i0.ɵɵFactoryTarget.Component }); }
1146
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LinkEditComponent, isStandalone: true, selector: "link-edit", inputs: { url: { classPropertyName: "url", publicName: "url", isSignal: false, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: false, isRequired: false, transformFunction: null }, aiTable: { classPropertyName: "aiTable", publicName: "aiTable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { confirm: "confirm" }, ngImport: i0, template: "<form\n thyLayout=\"vertical\"\n thyStopPropagation\n thyForm\n #linkForm=\"thyForm\"\n [thyFormValidatorConfig]=\"validatorConfig()\"\n name=\"linkForm\"\n class=\"p-5\"\n>\n <thy-form-group [thyLabelText]=\"i18nTexts().linkText\">\n <input thyInput [placeholder]=\"i18nTexts().textPlaceholder\" />\n </thy-form-group>\n <thy-form-group [thyLabelText]=\"i18nTexts().urlLabel\">\n <input name=\"url\" thyInput [placeholder]=\"i18nTexts().urlPlaceholder\" [pattern]=\"URLRegex\" type=\"text\" [(ngModel)]=\"url\" />\n </thy-form-group>\n <thy-form-group-footer thyAlign=\"right\">\n <div class=\"btn-pair\">\n <button thyStopPropagation thyButton=\"link-secondary\" thySize=\"sm\" (click)=\"close()\">{{i18nTexts().cancel}}</button>\n <button thyStopPropagation thyButton=\"primary\" thySize=\"sm\" (thyFormSubmit)=\"apply(linkForm)\">{{i18nTexts().apply}}</button>\n </div>\n </thy-form-group-footer>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: ThyStopPropagationDirective, selector: "[thyStopPropagation]", inputs: ["thyStopPropagation"] }, { kind: "directive", type: ThyInputDirective, selector: "input[thyInput], select[thyInput], textarea[thyInput]", inputs: ["thySize"], exportAs: ["thyInput"] }, { kind: "component", type: ThyButton, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thyBlock"] }, { kind: "directive", type: ThyFormSubmitDirective, selector: "[thyFormSubmit],[thy-form-submit]", outputs: ["thyFormSubmit"] }, { kind: "ngmodule", type: ThyFormModule }, { kind: "directive", type: i2.ThyFormDirective, selector: "[thyForm],[thy-form]", inputs: ["thyLayout", "thyEnterKeyMode", "thyFormValidatorConfig"], exportAs: ["thyForm"] }, { kind: "component", type: i2.ThyFormGroup, selector: "thy-form-group", inputs: ["thyLabelText", "thyLabelTextTranslateKey", "thyLabelRequired", "thyLabelPaddingTopClear", "thyFeedbackIcon", "thyTipsMode", "thyTips", "thyTipsTranslateKey", "thyRowFill"] }, { kind: "component", type: i2.ThyFormGroupFooter, selector: "thy-form-group-footer", inputs: ["thyAlign"] }] }); }
1578
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LinkEditComponent, isStandalone: true, selector: "link-edit", inputs: { url: { classPropertyName: "url", publicName: "url", isSignal: false, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: false, isRequired: false, transformFunction: null }, aiTable: { classPropertyName: "aiTable", publicName: "aiTable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { confirm: "confirm" }, ngImport: i0, template: "<form\n thyLayout=\"vertical\"\n thyStopPropagation\n thyForm\n #linkForm=\"thyForm\"\n [thyFormValidatorConfig]=\"validatorConfig()\"\n name=\"linkForm\"\n class=\"p-5\"\n>\n <thy-form-group [thyLabelText]=\"i18nTexts().linkText\">\n <input thyInput [placeholder]=\"i18nTexts().textPlaceholder\" name=\"text\" [(ngModel)]=\"text\" />\n </thy-form-group>\n <thy-form-group [thyLabelText]=\"i18nTexts().urlLabel\">\n <input name=\"url\" thyInput [placeholder]=\"i18nTexts().urlPlaceholder\" [pattern]=\"URLRegex\" type=\"text\" [(ngModel)]=\"url\" />\n </thy-form-group>\n <thy-form-group-footer thyAlign=\"right\">\n <div class=\"btn-pair\">\n <button thyStopPropagation thyButton=\"link-secondary\" thySize=\"sm\" (click)=\"close()\">{{ i18nTexts().cancel }}</button>\n <button thyStopPropagation thyButton=\"primary\" thySize=\"sm\" (thyFormSubmit)=\"apply(linkForm)\">{{ i18nTexts().apply }}</button>\n </div>\n </thy-form-group-footer>\n</form>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: ThyStopPropagationDirective, selector: "[thyStopPropagation]", inputs: ["thyStopPropagation"] }, { kind: "directive", type: ThyInputDirective, selector: "input[thyInput], select[thyInput], textarea[thyInput]", inputs: ["thySize"], exportAs: ["thyInput"] }, { kind: "component", type: ThyButton, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thyBlock"] }, { kind: "directive", type: ThyFormSubmitDirective, selector: "[thyFormSubmit],[thy-form-submit]", outputs: ["thyFormSubmit"] }, { kind: "ngmodule", type: ThyFormModule }, { kind: "directive", type: i2.ThyFormDirective, selector: "[thyForm],[thy-form]", inputs: ["thyLayout", "thyEnterKeyMode", "thyFormValidatorConfig"], exportAs: ["thyForm"] }, { kind: "component", type: i2.ThyFormGroup, selector: "thy-form-group", inputs: ["thyLabelText", "thyLabelTextTranslateKey", "thyLabelRequired", "thyLabelPaddingTopClear", "thyFeedbackIcon", "thyTipsMode", "thyTips", "thyTipsTranslateKey", "thyRowFill"] }, { kind: "component", type: i2.ThyFormGroupFooter, selector: "thy-form-group-footer", inputs: ["thyAlign"] }] }); }
1147
1579
  }
1148
1580
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LinkEditComponent, decorators: [{
1149
1581
  type: Component,
@@ -1155,7 +1587,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
1155
1587
  ThyButton,
1156
1588
  ThyFormSubmitDirective,
1157
1589
  ThyFormModule
1158
- ], template: "<form\n thyLayout=\"vertical\"\n thyStopPropagation\n thyForm\n #linkForm=\"thyForm\"\n [thyFormValidatorConfig]=\"validatorConfig()\"\n name=\"linkForm\"\n class=\"p-5\"\n>\n <thy-form-group [thyLabelText]=\"i18nTexts().linkText\">\n <input thyInput [placeholder]=\"i18nTexts().textPlaceholder\" />\n </thy-form-group>\n <thy-form-group [thyLabelText]=\"i18nTexts().urlLabel\">\n <input name=\"url\" thyInput [placeholder]=\"i18nTexts().urlPlaceholder\" [pattern]=\"URLRegex\" type=\"text\" [(ngModel)]=\"url\" />\n </thy-form-group>\n <thy-form-group-footer thyAlign=\"right\">\n <div class=\"btn-pair\">\n <button thyStopPropagation thyButton=\"link-secondary\" thySize=\"sm\" (click)=\"close()\">{{i18nTexts().cancel}}</button>\n <button thyStopPropagation thyButton=\"primary\" thySize=\"sm\" (thyFormSubmit)=\"apply(linkForm)\">{{i18nTexts().apply}}</button>\n </div>\n </thy-form-group-footer>\n</form>\n" }]
1590
+ ], template: "<form\n thyLayout=\"vertical\"\n thyStopPropagation\n thyForm\n #linkForm=\"thyForm\"\n [thyFormValidatorConfig]=\"validatorConfig()\"\n name=\"linkForm\"\n class=\"p-5\"\n>\n <thy-form-group [thyLabelText]=\"i18nTexts().linkText\">\n <input thyInput [placeholder]=\"i18nTexts().textPlaceholder\" name=\"text\" [(ngModel)]=\"text\" />\n </thy-form-group>\n <thy-form-group [thyLabelText]=\"i18nTexts().urlLabel\">\n <input name=\"url\" thyInput [placeholder]=\"i18nTexts().urlPlaceholder\" [pattern]=\"URLRegex\" type=\"text\" [(ngModel)]=\"url\" />\n </thy-form-group>\n <thy-form-group-footer thyAlign=\"right\">\n <div class=\"btn-pair\">\n <button thyStopPropagation thyButton=\"link-secondary\" thySize=\"sm\" (click)=\"close()\">{{ i18nTexts().cancel }}</button>\n <button thyStopPropagation thyButton=\"primary\" thySize=\"sm\" (thyFormSubmit)=\"apply(linkForm)\">{{ i18nTexts().apply }}</button>\n </div>\n </thy-form-group-footer>\n</form>\n" }]
1159
1591
  }], ctorParameters: () => [{ type: i1$1.ThyPopoverRef }], propDecorators: { url: [{
1160
1592
  type: Input
1161
1593
  }], text: [{
@@ -1971,6 +2403,7 @@ const AI_TABLE_ROW_HEIGHT = 44; // 默认行高基准
1971
2403
  const AI_TABLE_CELL_ACTIVE_BORDER_WIDTH = 2; // 选中单元格的边框宽度
1972
2404
  const AI_TABLE_CELL_ATTACHMENT_ADD = 'AI_TABLE_CELL_ATTACHMENT_ADD'; // 附件cell中新增图标名称
1973
2405
  const AI_TABLE_CELL_ATTACHMENT_FILE = 'AI_TABLE_CELL_ATTACHMENT_FILE'; // 附件cell中文件
2406
+ const AI_TABLE_CELL_EDIT = 'AI_TABLE_CELL_EDIT'; // 附件cell中编辑图标名称
1974
2407
  const AI_TABLE_FIELD_HEAD_TEXT_MIN_WIDTH = 30; // 字段列头文本的最小宽度
1975
2408
  const AI_TABLE_ROW_SELECT_CHECKBOX = 'AI_TABLE_ROW_SELECT_CHECKBOX'; // 行 checkbox
1976
2409
  const AI_TABLE_FIELD_HEAD_SELECT_CHECKBOX = 'AI_TABLE_FIELD_HEAD_SELECT_CHECKBOX'; // 表头 checkbox 标识
@@ -2069,6 +2502,7 @@ const Unchecked = `
2069
2502
  M15.7,3.3v11.4c0,0.5-0.5,1-1,1H3.3c-0.5,0-1-0.5-1-1V3.3c0-0.5,0.5-1,1-1h11.4C15.2,2.3,15.7,2.8,15.7,3.3z
2070
2503
  `;
2071
2504
  const ColumnTextFilledPath = `M7.268 8.674l-2.076-4.86-2.076 4.86h4.152zm0.513 1.2H2.603l-1.294 3.03L0 12.902L4.49 2.4H5.894l4.484 10.486-1.31 0.002-1.287-3.014zm2.86 1.111c0-1.423 1.246-2.193 4.21-2.49 0-0.89-0.235-1.72-1.362-1.72-0.772 0-1.484 0.356-2.017 0.711l-0.475-0.771c0.653-0.415 1.602-0.889 2.669-0.889 1.602 0 2.313 1.127 2.313 2.787v4.151h-0.948l-0.12-0.83h-0.06c-0.651 0.534-1.422 0.949-2.252 0.949-1.127 0-1.957-0.652-1.957-1.898zm4.113-1.778c-2.253 0.296-3.024 0.83-3.024 1.72 0 0.77 0.534 1.067 1.186 1.067 0.652 0 1.186-0.297 1.838-0.89V9.207z`;
2505
+ const ColumnRichTextFilledPath = `M14.5526,11.7084 C14.8845231,11.7084 15.1536,11.9774769 15.1536,12.3094 C15.1536,12.6413231 14.8845231,12.9104 14.5526,12.9104 L14.5526,12.9104 L11.7546,12.9104 C11.4226769,12.9104 11.1536,12.6413231 11.1536,12.3094 C11.1536,11.9774769 11.4226769,11.7084 11.7546,11.7084 L11.7546,11.7084 Z M5.894,2.4 L10.378,12.886 L9.068,12.888 L7.779,9.873 L2.603,9.873 L1.309,12.904 L2.84217094e-14,12.902 L4.49,2.4 L5.894,2.4 Z M5.191,3.814 L3.116,8.673 L7.267,8.673 L5.191,3.814 Z M14.5526,7.17723172 C14.8845231,7.17723172 15.1536,7.44630859 15.1536,7.77823172 C15.1536,8.11015486 14.8845231,8.37923172 14.5526,8.37923172 L14.5526,8.37923172 L10.7546,8.37923172 C10.4226769,8.37923172 10.1536,8.11015486 10.1536,7.77823172 C10.1536,7.44630859 10.4226769,7.17723172 10.7546,7.17723172 L10.7546,7.17723172 Z M14.5526,2.3094 C14.8845231,2.3094 15.1536,2.57847687 15.1536,2.9104 C15.1536,3.24232313 14.8845231,3.5114 14.5526,3.5114 L14.5526,3.5114 L9.7546,3.5114 C9.42267687,3.5114 9.1536,3.24232313 9.1536,2.9104 C9.1536,2.57847687 9.42267687,2.3094 9.7546,2.3094 L9.7546,2.3094 Z`;
2072
2506
  const ColumnSelectFilledPath = `M8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16zm0-1.2A6.8 6.8 0 1 0 8 1.2a6.8 6.8 0 0 0 0 13.6zM5.666 7.207l1.8 1.845 3.482-3.554.857.84-4.34 4.43-2.658-2.723.86-.838z`;
2073
2507
  const ColumnMultipleFillPath = `M2 2.551L3.576.976l.848.848L2 4.25.576 2.824l.848-.848L2 2.55zm0 5.425L3.576 6.4l.848.849L2 9.673.576 8.249l.848-.849.576.576zm0 5.4L3.576 11.8l.848.849L2 15.073.576 13.649l.848-.849.576.576zM5.663 2.6a.6.6 0 1 1 0-1.2H15.4a.6.6 0 0 1 0 1.2H5.663zm0 11.8a.6.6 0 0 1 0-1.2H15.4a.6.6 0 0 1 0 1.2H5.663zm0-6.2a.6.6 0 1 1 0-1.2H15.4a.6.6 0 0 1 0 1.2H5.663z`;
2074
2508
  const ColumnCalendarFilledPath = `M10.9 3.2H5.1v1.6H3.9V3.2H1.2v3.2h13.6V3.2h-2.7v1.6h-1.2V3.2zM12.1 2H15a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H1a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h2.9V.4h1.2V2h5.8V.4h1.2V2zm2.7 5.6H1.2v7.2h13.6V7.6z`;
@@ -2083,6 +2517,7 @@ const StarFill = `M9.186 2.12l1.02 2.769c.073.292.365.437.656.437l2.915.146c1.16
2083
2517
  const WebOutlinedPath = `M1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8ZM6.04798 2.85646C4.19852 3.55874 2.82616 5.22986 2.55071 7.25H5.26373C5.31861 5.76009 5.53564 4.40148 5.87147 3.352C5.92605 3.18143 5.98481 3.0157 6.04798 2.85646ZM5.87147 12.648C5.53564 11.5985 5.31861 10.2399 5.26373 8.75H2.55071C2.82616 10.7701 4.19852 12.4413 6.04798 13.1435C5.98481 12.9843 5.92605 12.8186 5.87147 12.648ZM10.1285 12.648C10.0739 12.8186 10.0152 12.9843 9.95202 13.1435C11.8015 12.4413 13.1738 10.7701 13.4493 8.75H10.7363C10.6814 10.2399 10.4644 11.5985 10.1285 12.648ZM8.6999 12.1908C8.98163 11.3104 9.18095 10.1118 9.23518 8.75H6.76482C6.81905 10.1118 7.01837 11.3104 7.3001 12.1908C7.46768 12.7145 7.65131 13.0839 7.81962 13.3063C7.90746 13.4224 7.9686 13.4711 8 13.4906C8.0314 13.4711 8.09254 13.4224 8.18038 13.3063C8.34869 13.0839 8.53232 12.7145 8.6999 12.1908ZM7.3001 3.80916C7.01837 4.68959 6.81905 5.88818 6.76482 7.25H9.23518C9.18095 5.88818 8.98163 4.68959 8.6999 3.80916C8.53232 3.28548 8.34869 2.91612 8.18038 2.69367C8.09254 2.57756 8.0314 2.52893 8 2.50944C7.9686 2.52893 7.90746 2.57756 7.81962 2.69367C7.65131 2.91612 7.46768 3.28548 7.3001 3.80916ZM10.1285 3.352C10.4644 4.40148 10.6814 5.76009 10.7363 7.25H13.4493C13.1738 5.22986 11.8015 3.55874 9.95203 2.85646C10.0152 3.0157 10.0739 3.18143 10.1285 3.352Z`;
2084
2518
  const DepartmentOutlinedPath = `M3 5.5C3 3.567 4.567 2 6.5 2C8.433 2 10 3.567 10 5.5C10 6.49548 9.5844 7.3939 8.91724 8.0312C10.7204 8.86779 12.017 10.6115 12.2217 12.6767C12.2976 13.4424 11.6682 14 11 14H2C1.33185 14 0.702358 13.4424 0.778277 12.6767C0.983033 10.6115 2.27961 8.86779 4.08276 8.0312C3.4156 7.3939 3 6.49548 3 5.5ZM8.5 5.5C8.5 4.39543 7.60457 3.5 6.5 3.5C5.39543 3.5 4.5 4.39543 4.5 5.5C4.5 6.60457 5.39543 7.5 6.5 7.5C7.60457 7.5 8.5 6.60457 8.5 5.5ZM2.31585 12.5H10.6841C10.3303 10.5108 8.59114 9 6.5 9C4.40886 9 2.66975 10.5108 2.31585 12.5Z', 'M11 3C10.5858 3 10.25 3.33579 10.25 3.75C10.25 4.16421 10.5858 4.5 11 4.5C11.6904 4.5 12.25 5.05964 12.25 5.75C12.25 6.44036 11.6904 7 11 7C10.5858 7 10.25 7.33579 10.25 7.75C10.25 8.16421 10.5858 8.5 11 8.5C12.6569 8.5 14 9.84315 14 11.5C14 11.9142 14.3358 12.25 14.75 12.25C15.1642 12.25 15.5 11.9142 15.5 11.5C15.5 9.77473 14.5291 8.27622 13.1038 7.52106C13.507 7.0426 13.75 6.42467 13.75 5.75C13.75 4.23122 12.5188 3 11 3Z`;
2085
2519
  const AttachmentPath = `M9.1 6.5V10a3.1 3.1 0 0 1-6.2.006l-.047-4.979a.6.6 0 0 1 1.2-.011L4.1 10a1.9 1.9 0 0 0 3.8 0V4.48C7.9 2.9 6.5 1.6 4.75 1.6S1.6 2.9 1.6 4.48v5.728c0 2.413 1.97 4.371 4.4 4.371 2.43 0 4.4-1.958 4.4-4.37v-5.16a.6.6 0 0 1 1.2 0v5.16c0 3.077-2.508 5.57-5.6 5.57-3.092 0-5.6-2.493-5.6-5.57V4.48C.4 2.216 2.357.4 4.75.4S9.1 2.216 9.1 4.48V6.5z`;
2520
+ const EditPath = `M2,8.33918294 L10.7095952,0 L15,4.17020474 L6.53816398,13 L2,13 L2,8.33918294 Z M3.2,8.85157902 L3.2,11.8 L6.02608482,11.8 L13.3091776,4.20020516 L10.7033283,1.66736141 L3.2,8.85157902 Z M0,16 L0,14.8 L16,14.8 L16,16 L0,16 Z`;
2086
2521
 
2087
2522
  const DEFAULT_FONT_SIZE = 14;
2088
2523
  const DEFAULT_FONT_FAMILY = '-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,Helvetica Neue,Noto Sans,Noto Sans CJK SC,Microsoft Yahei,Arial,Hiragino Sans GB,sans-serif';
@@ -3685,526 +4120,249 @@ const writeToAITable = async (aiTable, actions) => {
3685
4120
  try {
3686
4121
  actions.updateFieldValue({
3687
4122
  value,
3688
- path: [targetRecord._id, targetField._id]
3689
- });
3690
- isPasteSuccess = true;
3691
- }
3692
- catch (error) { }
3693
- }
3694
- });
3695
- });
3696
- return isPasteSuccess;
3697
- };
3698
-
3699
- const getVisibleRangeInfo = (coordinate, scrollState) => {
3700
- const { scrollTop, scrollLeft } = scrollState;
3701
- const { rowCount, columnCount, frozenColumnCount } = coordinate;
3702
- // 获取要渲染的垂直可见区域
3703
- const getVerticalRangeInfo = () => {
3704
- const startIndex = coordinate.getRowStartIndex(scrollTop);
3705
- const stopIndex = coordinate.getRowStopIndex(startIndex, scrollTop);
3706
- return {
3707
- rowStartIndex: Math.max(0, startIndex - 1),
3708
- rowStopIndex: Math.max(0, Math.min(rowCount - 1, stopIndex + 1))
3709
- };
3710
- };
3711
- // 获取要渲染的水平可见区域
3712
- const getHorizontalRangeInfo = () => {
3713
- const startIndex = coordinate.getColumnStartIndex(scrollLeft);
3714
- const stopIndex = coordinate.getColumnStopIndex(startIndex, scrollLeft);
3715
- return {
3716
- columnStartIndex: Math.max(frozenColumnCount - 1, startIndex),
3717
- columnStopIndex: Math.max(frozenColumnCount - 1, Math.min(columnCount - 1, stopIndex))
3718
- };
3719
- };
3720
- const { rowStartIndex, rowStopIndex } = getVerticalRangeInfo();
3721
- const { columnStartIndex, columnStopIndex } = getHorizontalRangeInfo();
3722
- return {
3723
- rowStartIndex,
3724
- rowStopIndex,
3725
- columnStartIndex,
3726
- columnStopIndex
3727
- };
3728
- };
3729
- const scrollMax = (aiTable, coordinate, visibleColumns) => {
3730
- const scrollMaxWidth = visibleColumns.reduce((pre, cur) => pre + getFieldOptionByField(aiTable, cur)?.width, AI_TABLE_ROW_HEAD_WIDTH);
3731
- const scrollMaxHeight = coordinate.getRowOffset(coordinate.rowCount - 1) + 32;
3732
- return { scrollMaxWidth, scrollMaxHeight };
3733
- };
3734
-
3735
- const getMousePosition = (aiTable, x, y, coordinate, fields, context, _targetName) => {
3736
- const { scrollTop, scrollLeft } = context.scrollState();
3737
- const { scrollMaxWidth, scrollMaxHeight } = scrollMax(aiTable, coordinate, fields);
3738
- const offsetTop = scrollTop + y;
3739
- const rowIndex = coordinate.getRowStartIndex(offsetTop);
3740
- const offsetLeft = isWithinFrozenColumnBoundary(x, coordinate.frozenColumnWidth) ? x : scrollLeft + x;
3741
- const columnIndex = coordinate.getColumnStartIndex(offsetLeft);
3742
- const areaType = offsetLeft <= scrollMaxWidth && offsetTop <= scrollMaxHeight ? AITableAreaType.grid : AITableAreaType.none;
3743
- const targetName = getTargetName(_targetName);
3744
- return {
3745
- areaType,
3746
- targetName, // As a simple operational identifier, with prefix name only
3747
- realTargetName: _targetName || AI_TABLE_BLANK, // Real name
3748
- rowIndex,
3749
- columnIndex,
3750
- offsetTop,
3751
- offsetLeft,
3752
- x,
3753
- y
3754
- };
3755
- };
3756
- const isWithinFrozenColumnBoundary = (x, frozenColumnWidth) => {
3757
- const max = AI_TABLE_ROW_HEAD_WIDTH + frozenColumnWidth;
3758
- const min = AI_TABLE_ROW_HEAD_WIDTH;
3759
- return x > min && x < max;
3760
- };
3761
- const getEditorSpace = (widthOrHeight) => {
3762
- return widthOrHeight + AI_TABLE_OFFSET * 2;
3763
- };
3764
- const getEditorBoxOffset = () => {
3765
- return -AI_TABLE_OFFSET;
3766
- };
3767
- const getCellEditorBorderSpace = () => {
3768
- return AI_TABLE_CELL_ACTIVE_BORDER_WIDTH * 2 - AI_TABLE_OFFSET * 2;
3769
- };
3770
- const getHoverEditorSpace = (widthOrHeight) => {
3771
- const borderSpace = getCellEditorBorderSpace();
3772
- return widthOrHeight - borderSpace;
3773
- };
3774
- const getHoverEditorBoxOffset = () => {
3775
- const borderSpace = getCellEditorBorderSpace();
3776
- return borderSpace / 2;
3777
- };
3778
-
3779
- const handleMouseStyle = (realTargetName, areaType = AITableAreaType.grid, container) => {
3780
- const { targetName, mouseStyle } = getDetailByTargetName(realTargetName);
3781
- if (mouseStyle)
3782
- return setMouseStyle(mouseStyle, container);
3783
- if (areaType === AITableAreaType.none)
3784
- return setMouseStyle('default', container);
3785
- switch (targetName) {
3786
- case AI_TABLE_FIELD_HEAD_SELECT_CHECKBOX:
3787
- case AI_TABLE_FIELD_HEAD_MORE:
3788
- case AI_TABLE_ROW_SELECT_CHECKBOX:
3789
- case AI_TABLE_ROW_ADD_BUTTON:
3790
- case AI_TABLE_FIELD_ADD_BUTTON: {
3791
- return setMouseStyle('pointer', container);
3792
- }
3793
- default:
3794
- return setMouseStyle('default', container);
3795
- }
3796
- };
3797
- const setMouseStyle = (mouseStyle, container) => {
3798
- container.style.cursor = mouseStyle;
3799
- };
3800
-
3801
- /**
3802
- * 在 Canvas 上测量文本的宽度和高度,以便在显示文本时能够动态调整布局或限制文本的显示区域
3803
- * @param defaults
3804
- * @returns
3805
- */
3806
- const TextMeasure = (defaults = {}) => {
3807
- const { fontFamily = DEFAULT_FONT_FAMILY, fontSize = DEFAULT_FONT_SIZE, fontWeight = DEFAULT_FONT_WEIGHT, fontStyle = DEFAULT_FONT_STYLE, lineHeight = DEFAULT_TEXT_LINE_HEIGHT, scale = DEFAULT_TEXT_SCALE } = defaults;
3808
- const o = {
3809
- fontFamily,
3810
- fontSize,
3811
- fontWeight,
3812
- fontStyle,
3813
- lineHeight,
3814
- scale
3815
- };
3816
- const canvas = document.createElement('canvas');
3817
- const context = canvas ? canvas.getContext('2d') : null;
3818
- const normalizeFontFamily = (fontFamily) => {
3819
- return fontFamily
3820
- .split(',')
3821
- .map((family) => {
3822
- family = family.trim();
3823
- const hasSpace = family.indexOf(' ') >= 0;
3824
- const hasQuotes = family.indexOf('"') >= 0 || family.indexOf("'") >= 0;
3825
- if (hasSpace && !hasQuotes) {
3826
- family = `"${family}"`;
3827
- }
3828
- return family;
3829
- })
3830
- .join(', ');
3831
- };
3832
- // 可以在运行时动态调整字体样式,从而影响后续的文本测量
3833
- const setFont = (options = {}) => {
3834
- for (const key in options) {
3835
- o[key] = options[key] ?? o[key];
3836
- }
3837
- if (context) {
3838
- context.font = `${o.fontWeight} ${o.fontSize * o.scale}px ${normalizeFontFamily(o.fontFamily)}`;
3839
- }
3840
- };
3841
- // 根据指定的最大宽度和行数来计算文本的显示方式。如果文本太长,它会自动换行或截断,并返回是否发生溢出的信息
3842
- const getWidthOfLongestText = (text, maxWidth, maxLineCount) => {
3843
- let width = 0;
3844
- let height = 0;
3845
- let lineCount = 0;
3846
- if (text == null) {
3847
- return { width, height, lastLineWidth: 0 };
3848
- }
3849
- const lines = text.split('\n');
3850
- for (let i = 0; i < lines.length; i++) {
3851
- const line = lines[i];
3852
- const lineWidth = context?.measureText(line).width ?? 0;
3853
- width = Math.max(width, lineWidth);
3854
- lineCount = maxWidth != null ? Math.ceil(lineWidth / maxWidth) || 1 : 1;
3855
- height += o.lineHeight * lineCount;
3856
- }
3857
- if (maxWidth == null || maxLineCount === 1 || (maxLineCount && lineCount <= maxLineCount)) {
3858
- return {
3859
- width: Math.ceil(width),
3860
- height: Math.ceil(height),
3861
- text,
3862
- isOverflow: Boolean(maxLineCount && lineCount > maxLineCount),
3863
- lastLineWidth: Math.ceil(width)
3864
- };
3865
- }
3866
- const arrText = text.split('');
3867
- let rowCount = 0; // 总行数
3868
- let textHeight = 0; // 文本最终占用的高度
3869
- let showText = ''; // 每行展示的文本
3870
- let totalText = '';
3871
- let isLimitRow = false;
3872
- const textLength = arrText.length;
3873
- for (let n = 0; n < textLength; n++) {
3874
- const singleText = arrText[n];
3875
- const composeText = showText + singleText;
3876
- // 如果没有超过 maxLineCount,就会继续换行
3877
- isLimitRow = maxLineCount ? rowCount === maxLineCount - 1 : false;
3878
- const measureText = isLimitRow ? composeText + '…' : composeText;
3879
- totalText += singleText;
3880
- const textWidth = context?.measureText(measureText).width ?? 0;
3881
- const isLineBreak = ['\n', '\r'].includes(singleText);
3882
- if (((maxWidth && textWidth > maxWidth) || isLineBreak) && (maxLineCount == null || rowCount < maxLineCount)) {
3883
- showText = isLineBreak ? '' : singleText;
3884
- textHeight += lineHeight;
3885
- rowCount++;
3886
- if (isLimitRow) {
3887
- if (n < textLength - 1) {
3888
- totalText = totalText.substring(0, totalText.length - 1) + '…';
3889
- }
3890
- break;
4123
+ path: [targetRecord._id, targetField._id]
4124
+ });
4125
+ isPasteSuccess = true;
3891
4126
  }
4127
+ catch (error) { }
3892
4128
  }
3893
- else {
3894
- showText = composeText;
3895
- }
3896
- }
4129
+ });
4130
+ });
4131
+ return isPasteSuccess;
4132
+ };
4133
+
4134
+ const getVisibleRangeInfo = (coordinate, scrollState) => {
4135
+ const { scrollTop, scrollLeft } = scrollState;
4136
+ const { rowCount, columnCount, frozenColumnCount } = coordinate;
4137
+ // 获取要渲染的垂直可见区域
4138
+ const getVerticalRangeInfo = () => {
4139
+ const startIndex = coordinate.getRowStartIndex(scrollTop);
4140
+ const stopIndex = coordinate.getRowStopIndex(startIndex, scrollTop);
3897
4141
  return {
3898
- width: Math.ceil(width),
3899
- height: Math.ceil(maxLineCount == null || rowCount < maxLineCount ? textHeight + lineHeight : textHeight),
3900
- text: totalText,
3901
- isOverflow: isLimitRow,
3902
- lastLineWidth: context?.measureText(showText).width ?? 0
4142
+ rowStartIndex: Math.max(0, startIndex - 1),
4143
+ rowStopIndex: Math.max(0, Math.min(rowCount - 1, stopIndex + 1))
3903
4144
  };
3904
4145
  };
3905
- // 测量给定文本的宽度和高度。
3906
- // 支持指定最大宽度 (maxWidth) 和最大行数 (maxLineCount),从而能够处理多行文本的自动换行和截断(例如在文本超过行数限制时添加省略号 "…")
3907
- const measureText = (text, maxWidth, maxLineCount) => {
3908
- return getWidthOfLongestText(castToString(text), maxWidth, maxLineCount);
4146
+ // 获取要渲染的水平可见区域
4147
+ const getHorizontalRangeInfo = () => {
4148
+ const startIndex = coordinate.getColumnStartIndex(scrollLeft);
4149
+ const stopIndex = coordinate.getColumnStopIndex(startIndex, scrollLeft);
4150
+ return {
4151
+ columnStartIndex: Math.max(frozenColumnCount - 1, startIndex),
4152
+ columnStopIndex: Math.max(frozenColumnCount - 1, Math.min(columnCount - 1, stopIndex))
4153
+ };
3909
4154
  };
3910
- // 可以将字体样式重置为初始默认配置
3911
- const reset = () => setFont(defaults);
3912
- setFont(o);
4155
+ const { rowStartIndex, rowStopIndex } = getVerticalRangeInfo();
4156
+ const { columnStartIndex, columnStopIndex } = getHorizontalRangeInfo();
3913
4157
  return {
3914
- context,
3915
- measureText,
3916
- setFont,
3917
- reset
4158
+ rowStartIndex,
4159
+ rowStopIndex,
4160
+ columnStartIndex,
4161
+ columnStopIndex
3918
4162
  };
3919
4163
  };
3920
-
3921
- const isCellMatchKeywords = (aiTable, field, recordId, keywords, references) => {
3922
- const cellValue = AITableQueries.getFieldValue(aiTable, [recordId, field._id]);
3923
- const transformValue = transformCellValue(aiTable, field, cellValue);
3924
- const fieldMethod = FieldModelMap[field.type];
3925
- let cellFullText = fieldMethod.cellFullText(transformValue, field, references);
3926
- return keywords && cellFullText.length && cellFullText.some((text) => text.toLowerCase().includes(keywords.toLowerCase()));
4164
+ const scrollMax = (aiTable, coordinate, visibleColumns) => {
4165
+ const scrollMaxWidth = visibleColumns.reduce((pre, cur) => pre + getFieldOptionByField(aiTable, cur)?.width, AI_TABLE_ROW_HEAD_WIDTH);
4166
+ const scrollMaxHeight = coordinate.getRowOffset(coordinate.rowCount - 1) + 32;
4167
+ return { scrollMaxWidth, scrollMaxHeight };
3927
4168
  };
3928
4169
 
3929
- function updatePicture(node) {
3930
- const drawingNode = node.getLayer() || node.getStage();
3931
- if (drawingNode) {
3932
- drawingNode.batchDraw();
3933
- }
3934
- }
3935
-
3936
- // adapted FROM: https://github.com/lavrton/react-konva/blob/master/src/react-konva-fiber.js
3937
- function applyNodeProps(component, props = {}, oldProps = {}) {
3938
- if ('id' in props) {
3939
- const message = `You are using "id" attribute for Konva node. In some very rare cases it may produce bugs. Currently we recommend not to use it and use "name" attribute instead.`;
3940
- console.warn(message);
3941
- }
3942
- const instance = component.getNode();
3943
- const updatedProps = {};
3944
- let hasUpdates = false;
3945
- Object.keys(oldProps).forEach((key) => {
3946
- const isEvent = key.slice(0, 2) === 'ko';
3947
- const propChanged = oldProps[key] !== props[key];
3948
- if (isEvent && propChanged) {
3949
- let eventName = key.slice(2).toLowerCase();
3950
- if (eventName.slice(0, 7) === 'content') {
3951
- eventName = 'content' + eventName.slice(7, 8).toUpperCase() + eventName.slice(8);
3952
- }
3953
- instance.off(eventName, oldProps[key]);
3954
- }
3955
- const toRemove = !Object.hasOwn(props, key);
3956
- if (toRemove) {
3957
- instance.setAttr(key, undefined);
3958
- }
3959
- });
3960
- Object.keys(props).forEach((key) => {
3961
- const isEvent = key.slice(0, 2) === 'ko';
3962
- const toAdd = oldProps[key] !== props[key];
3963
- if (isEvent && toAdd) {
3964
- let eventName = key.slice(2).toLowerCase();
3965
- if (eventName.slice(0, 7) === 'content') {
3966
- eventName = 'content' + eventName.slice(7, 8).toUpperCase() + eventName.slice(8);
3967
- }
3968
- if (props[key]) {
3969
- instance.off(eventName);
3970
- instance.on(eventName, (event) => {
3971
- props[key]({
3972
- angularComponent: component,
3973
- event
3974
- });
3975
- });
3976
- }
3977
- }
3978
- if (!isEvent && (props[key] !== oldProps[key] || props[key] !== instance.getAttr(key))) {
3979
- hasUpdates = true;
3980
- updatedProps[key] = props[key];
3981
- }
3982
- });
3983
- if (hasUpdates) {
3984
- instance.setAttrs(updatedProps);
3985
- updatePicture(instance);
3986
- let val;
3987
- Object.keys(updatedProps).forEach((prop) => {
3988
- val = updatedProps[prop];
3989
- if (val instanceof Image && !val.complete) {
3990
- const node = instance;
3991
- val.addEventListener('load', function () {
3992
- const layer = node.getLayer();
3993
- if (layer) {
3994
- layer.batchDraw();
3995
- }
3996
- });
3997
- }
3998
- });
3999
- }
4000
- }
4001
-
4002
- function camelize(str) {
4003
- return str
4004
- .replace(/^\w|[A-Z]|\b\w/g, function (letter, index) {
4005
- return index == 0 ? letter.toLowerCase() : letter.toUpperCase();
4006
- })
4007
- .replace(/\s+/g, '');
4008
- }
4009
- function capitalizeFirstLetter(string) {
4010
- return string.charAt(0).toUpperCase() + string.slice(1);
4011
- }
4012
- function getName(componentTag) {
4013
- return capitalizeFirstLetter(camelize(componentTag.slice(3).replace('-', ' ')));
4014
- }
4015
- function createListener(instance) {
4016
- const output = {};
4017
- [
4018
- 'koMouseover',
4019
- 'koMousemove',
4020
- 'koMouseout',
4021
- 'koMouseenter',
4022
- 'koMouseleave',
4023
- 'koMousedown',
4024
- 'koMouseup',
4025
- 'koWheel',
4026
- 'koContextmenu',
4027
- 'koClick',
4028
- 'koDblclick',
4029
- 'koTouchstart',
4030
- 'koTouchmove',
4031
- 'koTouchend',
4032
- 'koTap',
4033
- 'koDbltap',
4034
- 'koDragstart',
4035
- 'koDragmove',
4036
- 'koDragend'
4037
- ].forEach((eventName) => {
4038
- const name = eventName;
4039
- const eventEmitter = instance[name];
4040
- if (eventEmitter.observed) {
4041
- output[eventName] = eventEmitter.emit.bind(eventEmitter);
4042
- }
4043
- });
4044
- return output;
4045
- }
4046
-
4047
- const KO_CONTAINER_TOKEN = new InjectionToken('KO_CONTAINER_TOKEN');
4048
-
4049
- class KoShape {
4050
- constructor() {
4051
- this.config = input();
4052
- this.koMouseover = new EventEmitter();
4053
- this.koMousemove = new EventEmitter();
4054
- this.koMouseout = new EventEmitter();
4055
- this.koMouseenter = new EventEmitter();
4056
- this.koMouseleave = new EventEmitter();
4057
- this.koMousedown = new EventEmitter();
4058
- this.koMouseup = new EventEmitter();
4059
- this.koWheel = new EventEmitter();
4060
- this.koContextmenu = new EventEmitter();
4061
- this.koClick = new EventEmitter();
4062
- this.koDblclick = new EventEmitter();
4063
- this.koTouchstart = new EventEmitter();
4064
- this.koTouchmove = new EventEmitter();
4065
- this.koTouchend = new EventEmitter();
4066
- this.koTap = new EventEmitter();
4067
- this.koDbltap = new EventEmitter();
4068
- this.koDragstart = new EventEmitter();
4069
- this.koDragmove = new EventEmitter();
4070
- this.koDragend = new EventEmitter();
4071
- this.elementRef = inject((ElementRef));
4072
- this.container = inject(KO_CONTAINER_TOKEN, { skipSelf: true });
4073
- this.cacheProps = {};
4074
- this.nameNode = getName(this.elementRef.nativeElement.localName);
4075
- effect(() => {
4076
- if (this.config()) {
4077
- this.updateNode(this.config());
4078
- }
4079
- });
4080
- }
4081
- getNode() {
4082
- return this._node;
4083
- }
4084
- ngOnInit() {
4085
- this.initKonva();
4170
+ const getMousePosition = (aiTable, x, y, coordinate, fields, context, _targetName) => {
4171
+ const { scrollTop, scrollLeft } = context.scrollState();
4172
+ const { scrollMaxWidth, scrollMaxHeight } = scrollMax(aiTable, coordinate, fields);
4173
+ const offsetTop = scrollTop + y;
4174
+ const rowIndex = coordinate.getRowStartIndex(offsetTop);
4175
+ const offsetLeft = isWithinFrozenColumnBoundary(x, coordinate.frozenColumnWidth) ? x : scrollLeft + x;
4176
+ const columnIndex = coordinate.getColumnStartIndex(offsetLeft);
4177
+ const areaType = offsetLeft <= scrollMaxWidth && offsetTop <= scrollMaxHeight ? AITableAreaType.grid : AITableAreaType.none;
4178
+ const targetName = getTargetName(_targetName);
4179
+ return {
4180
+ areaType,
4181
+ targetName, // As a simple operational identifier, with prefix name only
4182
+ realTargetName: _targetName || AI_TABLE_BLANK, // Real name
4183
+ rowIndex,
4184
+ columnIndex,
4185
+ offsetTop,
4186
+ offsetLeft,
4187
+ x,
4188
+ y
4189
+ };
4190
+ };
4191
+ const isWithinFrozenColumnBoundary = (x, frozenColumnWidth) => {
4192
+ const max = AI_TABLE_ROW_HEAD_WIDTH + frozenColumnWidth;
4193
+ const min = AI_TABLE_ROW_HEAD_WIDTH;
4194
+ return x > min && x < max;
4195
+ };
4196
+ const getEditorSpace = (widthOrHeight) => {
4197
+ return widthOrHeight + AI_TABLE_OFFSET * 2;
4198
+ };
4199
+ const getEditorBoxOffset = () => {
4200
+ return -AI_TABLE_OFFSET;
4201
+ };
4202
+ const getCellEditorBorderSpace = () => {
4203
+ return AI_TABLE_CELL_ACTIVE_BORDER_WIDTH * 2 - AI_TABLE_OFFSET * 2;
4204
+ };
4205
+ const getHoverEditorSpace = (widthOrHeight) => {
4206
+ const borderSpace = getCellEditorBorderSpace();
4207
+ return widthOrHeight - borderSpace;
4208
+ };
4209
+ const getHoverEditorBoxOffset = () => {
4210
+ const borderSpace = getCellEditorBorderSpace();
4211
+ return borderSpace / 2;
4212
+ };
4213
+
4214
+ const handleMouseStyle = (realTargetName, areaType = AITableAreaType.grid, container) => {
4215
+ const { targetName, mouseStyle } = getDetailByTargetName(realTargetName);
4216
+ if (mouseStyle)
4217
+ return setMouseStyle(mouseStyle, container);
4218
+ if (areaType === AITableAreaType.none)
4219
+ return setMouseStyle('default', container);
4220
+ switch (targetName) {
4221
+ case AI_TABLE_FIELD_HEAD_SELECT_CHECKBOX:
4222
+ case AI_TABLE_FIELD_HEAD_MORE:
4223
+ case AI_TABLE_ROW_SELECT_CHECKBOX:
4224
+ case AI_TABLE_ROW_ADD_BUTTON:
4225
+ case AI_TABLE_FIELD_ADD_BUTTON: {
4226
+ return setMouseStyle('pointer', container);
4227
+ }
4228
+ case AI_TABLE_FIELD_HEAD_OPACITY_LINE: {
4229
+ return setMouseStyle('col-resize', container);
4230
+ }
4231
+ default:
4232
+ return setMouseStyle('default', container);
4086
4233
  }
4087
- initKonva() {
4088
- if (!this._node) {
4089
- this._node = new Shape();
4234
+ };
4235
+ const setMouseStyle = (mouseStyle, container) => {
4236
+ container.style.cursor = mouseStyle;
4237
+ };
4238
+
4239
+ /**
4240
+ * 在 Canvas 上测量文本的宽度和高度,以便在显示文本时能够动态调整布局或限制文本的显示区域
4241
+ * @param defaults
4242
+ * @returns
4243
+ */
4244
+ const TextMeasure = (defaults = {}) => {
4245
+ const { fontFamily = DEFAULT_FONT_FAMILY, fontSize = DEFAULT_FONT_SIZE, fontWeight = DEFAULT_FONT_WEIGHT, fontStyle = DEFAULT_FONT_STYLE, lineHeight = DEFAULT_TEXT_LINE_HEIGHT, scale = DEFAULT_TEXT_SCALE } = defaults;
4246
+ const o = {
4247
+ fontFamily,
4248
+ fontSize,
4249
+ fontWeight,
4250
+ fontStyle,
4251
+ lineHeight,
4252
+ scale
4253
+ };
4254
+ const canvas = document.createElement('canvas');
4255
+ const context = canvas ? canvas.getContext('2d') : null;
4256
+ const normalizeFontFamily = (fontFamily) => {
4257
+ return fontFamily
4258
+ .split(',')
4259
+ .map((family) => {
4260
+ family = family.trim();
4261
+ const hasSpace = family.indexOf(' ') >= 0;
4262
+ const hasQuotes = family.indexOf('"') >= 0 || family.indexOf("'") >= 0;
4263
+ if (hasSpace && !hasQuotes) {
4264
+ family = `"${family}"`;
4265
+ }
4266
+ return family;
4267
+ })
4268
+ .join(', ');
4269
+ };
4270
+ // 可以在运行时动态调整字体样式,从而影响后续的文本测量
4271
+ const setFont = (options = {}) => {
4272
+ for (const key in options) {
4273
+ o[key] = options[key] ?? o[key];
4090
4274
  }
4091
- if (this.nameNode === 'Shape') {
4092
- this._node = new Shape();
4275
+ if (context) {
4276
+ context.font = `${o.fontWeight} ${o.fontSize * o.scale}px ${normalizeFontFamily(o.fontFamily)}`;
4093
4277
  }
4094
- else if (this.nameNode === 'Sprite') {
4095
- this._node = new Sprite(this.config());
4278
+ };
4279
+ // 根据指定的最大宽度和行数来计算文本的显示方式。如果文本太长,它会自动换行或截断,并返回是否发生溢出的信息
4280
+ const getWidthOfLongestText = (text, maxWidth, maxLineCount) => {
4281
+ let width = 0;
4282
+ let height = 0;
4283
+ let lineCount = 0;
4284
+ if (text == null) {
4285
+ return { width, height, lastLineWidth: 0 };
4096
4286
  }
4097
- else {
4098
- this._node = new Konva[this.nameNode](undefined);
4287
+ const lines = text.split('\n');
4288
+ for (let i = 0; i < lines.length; i++) {
4289
+ const line = lines[i];
4290
+ const lineWidth = context?.measureText(line).width ?? 0;
4291
+ width = Math.max(width, lineWidth);
4292
+ lineCount = maxWidth != null ? Math.ceil(lineWidth / maxWidth) || 1 : 1;
4293
+ height += o.lineHeight * lineCount;
4099
4294
  }
4100
- const animationStage = this._node.to.bind(this._node);
4101
- this._node.to = (newConfig) => {
4102
- animationStage(newConfig);
4103
- setTimeout(() => {
4104
- Object.keys(this._node.attrs).forEach((key) => {
4105
- if (typeof this._node.attrs[key] !== 'function') {
4106
- this.config()[key] = this._node.attrs[key];
4295
+ if (maxWidth == null || maxLineCount === 1 || (maxLineCount && lineCount <= maxLineCount)) {
4296
+ return {
4297
+ width: Math.ceil(width),
4298
+ height: Math.ceil(height),
4299
+ text,
4300
+ isOverflow: Boolean(maxLineCount && lineCount > maxLineCount),
4301
+ lastLineWidth: Math.ceil(width)
4302
+ };
4303
+ }
4304
+ const arrText = text.split('');
4305
+ let rowCount = 0; // 总行数
4306
+ let textHeight = 0; // 文本最终占用的高度
4307
+ let showText = ''; // 每行展示的文本
4308
+ let totalText = '';
4309
+ let isLimitRow = false;
4310
+ const textLength = arrText.length;
4311
+ for (let n = 0; n < textLength; n++) {
4312
+ const singleText = arrText[n];
4313
+ const composeText = showText + singleText;
4314
+ // 如果没有超过 maxLineCount,就会继续换行
4315
+ isLimitRow = maxLineCount ? rowCount === maxLineCount - 1 : false;
4316
+ const measureText = isLimitRow ? composeText + '…' : composeText;
4317
+ totalText += singleText;
4318
+ const textWidth = context?.measureText(measureText).width ?? 0;
4319
+ const isLineBreak = ['\n', '\r'].includes(singleText);
4320
+ if (((maxWidth && textWidth > maxWidth) || isLineBreak) && (maxLineCount == null || rowCount < maxLineCount)) {
4321
+ showText = isLineBreak ? '' : singleText;
4322
+ textHeight += lineHeight;
4323
+ rowCount++;
4324
+ if (isLimitRow) {
4325
+ if (n < textLength - 1) {
4326
+ totalText = totalText.substring(0, totalText.length - 1) + '…';
4107
4327
  }
4108
- });
4109
- }, 200);
4110
- };
4111
- if (this.config()) {
4112
- this.updateNode(this.config());
4328
+ break;
4329
+ }
4330
+ }
4331
+ else {
4332
+ showText = composeText;
4333
+ }
4113
4334
  }
4114
- }
4115
- updateNode(config) {
4116
- if (!this._node)
4117
- return;
4118
- const props = {
4119
- ...config,
4120
- ...createListener(this)
4335
+ return {
4336
+ width: Math.ceil(width),
4337
+ height: Math.ceil(maxLineCount == null || rowCount < maxLineCount ? textHeight + lineHeight : textHeight),
4338
+ text: totalText,
4339
+ isOverflow: isLimitRow,
4340
+ lastLineWidth: context?.measureText(showText).width ?? 0
4121
4341
  };
4122
- applyNodeProps(this, props, this.cacheProps);
4123
- this.cacheProps = props;
4124
- }
4125
- ngAfterViewInit() {
4126
- const container = this.container.getNode();
4127
- container.add(this.getNode());
4128
- updatePicture(this.container.getNode());
4129
- }
4130
- ngOnDestroy() {
4131
- this._node?.destroy();
4132
- }
4133
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoShape, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4134
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: KoShape, isStandalone: true, selector: "ko-shape, ko-circle, ko-label, ko-rect, ko-ellipse, ko-wedge, ko-line, ko-sprite, ko-image, ko-text, ko-text-path, ko-star, ko-ring, ko-arc, ko-tag, ko-path, ko-regular-polygon, ko-arrow, ko-transformer", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { koMouseover: "koMouseover", koMousemove: "koMousemove", koMouseout: "koMouseout", koMouseenter: "koMouseenter", koMouseleave: "koMouseleave", koMousedown: "koMousedown", koMouseup: "koMouseup", koWheel: "koWheel", koContextmenu: "koContextmenu", koClick: "koClick", koDblclick: "koDblclick", koTouchstart: "koTouchstart", koTouchmove: "koTouchmove", koTouchend: "koTouchend", koTap: "koTap", koDbltap: "koDbltap", koDragstart: "koDragstart", koDragmove: "koDragmove", koDragend: "koDragend" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4135
- }
4136
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoShape, decorators: [{
4137
- type: Component,
4138
- args: [{
4139
- selector: 'ko-shape, ko-circle, ko-label, ko-rect, ko-ellipse, ko-wedge, ko-line, ko-sprite, ko-image, ko-text, ko-text-path, ko-star, ko-ring, ko-arc, ko-tag, ko-path, ko-regular-polygon, ko-arrow, ko-transformer',
4140
- standalone: true,
4141
- template: `<ng-content></ng-content>`,
4142
- changeDetection: ChangeDetectionStrategy.OnPush
4143
- }]
4144
- }], ctorParameters: () => [], propDecorators: { koMouseover: [{
4145
- type: Output
4146
- }], koMousemove: [{
4147
- type: Output
4148
- }], koMouseout: [{
4149
- type: Output
4150
- }], koMouseenter: [{
4151
- type: Output
4152
- }], koMouseleave: [{
4153
- type: Output
4154
- }], koMousedown: [{
4155
- type: Output
4156
- }], koMouseup: [{
4157
- type: Output
4158
- }], koWheel: [{
4159
- type: Output
4160
- }], koContextmenu: [{
4161
- type: Output
4162
- }], koClick: [{
4163
- type: Output
4164
- }], koDblclick: [{
4165
- type: Output
4166
- }], koTouchstart: [{
4167
- type: Output
4168
- }], koTouchmove: [{
4169
- type: Output
4170
- }], koTouchend: [{
4171
- type: Output
4172
- }], koTap: [{
4173
- type: Output
4174
- }], koDbltap: [{
4175
- type: Output
4176
- }], koDragstart: [{
4177
- type: Output
4178
- }], koDragmove: [{
4179
- type: Output
4180
- }], koDragend: [{
4181
- type: Output
4182
- }] } });
4183
-
4184
- class KoContainer extends KoShape {
4185
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoContainer, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
4186
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: KoContainer, isStandalone: true, selector: "ko-layer, ko-fastlayer, ko-group", providers: [
4187
- {
4188
- provide: KO_CONTAINER_TOKEN,
4189
- useExisting: KoContainer
4190
- }
4191
- ], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4192
- }
4193
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoContainer, decorators: [{
4194
- type: Component,
4195
- args: [{
4196
- selector: 'ko-layer, ko-fastlayer, ko-group',
4197
- standalone: true,
4198
- template: `<ng-content></ng-content>`,
4199
- providers: [
4200
- {
4201
- provide: KO_CONTAINER_TOKEN,
4202
- useExisting: KoContainer
4203
- }
4204
- ],
4205
- changeDetection: ChangeDetectionStrategy.OnPush
4206
- }]
4207
- }] });
4342
+ };
4343
+ // 测量给定文本的宽度和高度。
4344
+ // 支持指定最大宽度 (maxWidth) 和最大行数 (maxLineCount),从而能够处理多行文本的自动换行和截断(例如在文本超过行数限制时添加省略号 "…")
4345
+ const measureText = (text, maxWidth, maxLineCount) => {
4346
+ return getWidthOfLongestText(castToString(text), maxWidth, maxLineCount);
4347
+ };
4348
+ // 可以将字体样式重置为初始默认配置
4349
+ const reset = () => setFont(defaults);
4350
+ setFont(o);
4351
+ return {
4352
+ context,
4353
+ measureText,
4354
+ setFont,
4355
+ reset
4356
+ };
4357
+ };
4358
+
4359
+ const isCellMatchKeywords = (aiTable, field, recordId, keywords, references) => {
4360
+ const cellValue = AITableQueries.getFieldValue(aiTable, [recordId, field._id]);
4361
+ const transformValue = transformCellValue(aiTable, field, cellValue);
4362
+ const fieldMethod = FieldModelMap[field.type];
4363
+ let cellFullText = fieldMethod.cellFullText(transformValue, field, references);
4364
+ return keywords && cellFullText.length && cellFullText.some((text) => text.toLowerCase().includes(keywords.toLowerCase()));
4365
+ };
4208
4366
 
4209
4367
  class AITableText {
4210
4368
  constructor() {
@@ -5749,150 +5907,6 @@ function getFileThumbnailSvgString(ext) {
5749
5907
  return result;
5750
5908
  }
5751
5909
 
5752
- class KoStage {
5753
- constructor() {
5754
- this.config = input();
5755
- this.koMouseover = new EventEmitter();
5756
- this.koMousemove = new EventEmitter();
5757
- this.koMouseout = new EventEmitter();
5758
- this.koMouseenter = new EventEmitter();
5759
- this.koMouseleave = new EventEmitter();
5760
- this.koMousedown = new EventEmitter();
5761
- this.koMouseup = new EventEmitter();
5762
- this.koWheel = new EventEmitter();
5763
- this.koContextmenu = new EventEmitter();
5764
- this.koClick = new EventEmitter();
5765
- this.koDblclick = new EventEmitter();
5766
- this.koTouchstart = new EventEmitter();
5767
- this.koTouchmove = new EventEmitter();
5768
- this.koTouchend = new EventEmitter();
5769
- this.koTap = new EventEmitter();
5770
- this.koDbltap = new EventEmitter();
5771
- this.koDragstart = new EventEmitter();
5772
- this.koDragmove = new EventEmitter();
5773
- this.koDragend = new EventEmitter();
5774
- this.cacheProps = {};
5775
- this.nodeContainer = inject(ElementRef).nativeElement;
5776
- effect(() => {
5777
- if (this.config()) {
5778
- if (!this._stage) {
5779
- this.initStage();
5780
- }
5781
- this.updateNode(this.config());
5782
- }
5783
- });
5784
- }
5785
- ngOnInit() {
5786
- this.initStage();
5787
- }
5788
- getNode() {
5789
- return this._stage;
5790
- }
5791
- initStage() {
5792
- this._stage = new Stage({
5793
- ...this.config(),
5794
- container: this.nodeContainer
5795
- });
5796
- }
5797
- updateNode(config) {
5798
- const props = {
5799
- ...config,
5800
- ...createListener(this)
5801
- };
5802
- applyNodeProps(this, props, this.cacheProps);
5803
- this.cacheProps = props;
5804
- }
5805
- ngOnDestroy() {
5806
- this._stage?.destroy();
5807
- }
5808
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoStage, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5809
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: KoStage, isStandalone: true, selector: "ko-stage", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { koMouseover: "koMouseover", koMousemove: "koMousemove", koMouseout: "koMouseout", koMouseenter: "koMouseenter", koMouseleave: "koMouseleave", koMousedown: "koMousedown", koMouseup: "koMouseup", koWheel: "koWheel", koContextmenu: "koContextmenu", koClick: "koClick", koDblclick: "koDblclick", koTouchstart: "koTouchstart", koTouchmove: "koTouchmove", koTouchend: "koTouchend", koTap: "koTap", koDbltap: "koDbltap", koDragstart: "koDragstart", koDragmove: "koDragmove", koDragend: "koDragend" }, providers: [
5810
- {
5811
- provide: KO_CONTAINER_TOKEN,
5812
- useExisting: KoStage
5813
- }
5814
- ], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5815
- }
5816
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: KoStage, decorators: [{
5817
- type: Component,
5818
- args: [{
5819
- selector: 'ko-stage',
5820
- standalone: true,
5821
- template: `<ng-content></ng-content>`,
5822
- providers: [
5823
- {
5824
- provide: KO_CONTAINER_TOKEN,
5825
- useExisting: KoStage
5826
- }
5827
- ],
5828
- changeDetection: ChangeDetectionStrategy.OnPush
5829
- }]
5830
- }], ctorParameters: () => [], propDecorators: { koMouseover: [{
5831
- type: Output
5832
- }], koMousemove: [{
5833
- type: Output
5834
- }], koMouseout: [{
5835
- type: Output
5836
- }], koMouseenter: [{
5837
- type: Output
5838
- }], koMouseleave: [{
5839
- type: Output
5840
- }], koMousedown: [{
5841
- type: Output
5842
- }], koMouseup: [{
5843
- type: Output
5844
- }], koWheel: [{
5845
- type: Output
5846
- }], koContextmenu: [{
5847
- type: Output
5848
- }], koClick: [{
5849
- type: Output
5850
- }], koDblclick: [{
5851
- type: Output
5852
- }], koTouchstart: [{
5853
- type: Output
5854
- }], koTouchmove: [{
5855
- type: Output
5856
- }], koTouchend: [{
5857
- type: Output
5858
- }], koTap: [{
5859
- type: Output
5860
- }], koDbltap: [{
5861
- type: Output
5862
- }], koDragstart: [{
5863
- type: Output
5864
- }], koDragmove: [{
5865
- type: Output
5866
- }], koDragend: [{
5867
- type: Output
5868
- }] } });
5869
-
5870
- class KoComponent extends Component {
5871
- }
5872
-
5873
- const KoShapeTypes = {
5874
- Arc,
5875
- Arrow,
5876
- Circle,
5877
- Ellipse,
5878
- Image: Image$1,
5879
- Label,
5880
- Tag,
5881
- Line,
5882
- Path,
5883
- Rect,
5884
- RegularPolygon,
5885
- Ring,
5886
- Star,
5887
- Text,
5888
- TextPath,
5889
- Transformer,
5890
- Wedge,
5891
- Group,
5892
- Layer,
5893
- FastLayer
5894
- };
5895
-
5896
5910
  class AITableActionIcon {
5897
5911
  constructor() {
5898
5912
  this.onClick = output();
@@ -6111,12 +6125,95 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
6111
6125
  }]
6112
6126
  }] });
6113
6127
 
6128
+ class AITableCellRichtext {
6129
+ constructor() {
6130
+ this.config = input();
6131
+ this.textConfig = computed(() => {
6132
+ const render = this.config()?.render;
6133
+ if (render) {
6134
+ const { x, y, transformValue, field, columnWidth, rowHeight, style, zIndex } = render;
6135
+ let textRender = transformValue;
6136
+ if (textRender == null) {
6137
+ return;
6138
+ }
6139
+ textRender = textRender.replace(/\r|\n/g, ' ');
6140
+ const fontWeight = style?.fontWeight;
6141
+ const textMaxWidth = columnWidth - AI_TABLE_CELL_PADDING - AI_TABLE_ACTION_COMMON_RIGHT_PADDING - AI_TABLE_ACTION_COMMON_SIZE;
6142
+ const { text, textWidth } = drawer.textEllipsis({
6143
+ text: textRender,
6144
+ maxWidth: textMaxWidth,
6145
+ fontWeight
6146
+ });
6147
+ return {
6148
+ x,
6149
+ y,
6150
+ text,
6151
+ wrap: 'none',
6152
+ width: textWidth,
6153
+ fillStyle: Colors.primary,
6154
+ height: rowHeight + 2,
6155
+ lineHeight: 1.84,
6156
+ listening: false,
6157
+ ellipsis: true,
6158
+ zIndex
6159
+ };
6160
+ }
6161
+ return;
6162
+ });
6163
+ this.iconConfig = computed(() => {
6164
+ const { coordinate, render, field, recordId, readonly } = this.config();
6165
+ const offsetX = render.columnWidth - AI_TABLE_ACTION_COMMON_SIZE - AI_TABLE_ACTION_COMMON_RIGHT_PADDING;
6166
+ const offsetY = (coordinate.rowInitSize - AI_TABLE_ACTION_COMMON_SIZE) / 2;
6167
+ return {
6168
+ coordinate,
6169
+ readonly,
6170
+ name: generateTargetName({
6171
+ targetName: AI_TABLE_CELL,
6172
+ fieldId: field._id,
6173
+ recordId,
6174
+ source: AI_TABLE_CELL_EDIT,
6175
+ mouseStyle: readonly ? 'default' : 'pointer'
6176
+ }),
6177
+ x: offsetX,
6178
+ y: offsetY,
6179
+ data: EditPath,
6180
+ fill: Colors.gray600,
6181
+ hoverFill: Colors.primary,
6182
+ backgroundWidth: AI_TABLE_ACTION_COMMON_SIZE,
6183
+ backgroundHeight: AI_TABLE_ACTION_COMMON_SIZE,
6184
+ cornerRadius: AI_TABLE_ACTION_COMMON_RADIUS,
6185
+ listening: true
6186
+ };
6187
+ });
6188
+ }
6189
+ static { this.fieldType = AITableFieldType.richText; }
6190
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AITableCellRichtext, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
6191
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AITableCellRichtext, isStandalone: true, selector: "ai-table-richtext", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
6192
+ <ai-table-text [config]="textConfig()!"></ai-table-text>
6193
+ <ai-table-action-icon [config]="iconConfig()"></ai-table-action-icon>
6194
+ `, isInline: true, dependencies: [{ kind: "component", type: AITableText, selector: "ai-table-text", inputs: ["config"], outputs: ["koClick", "koMouseMove"] }, { kind: "component", type: AITableActionIcon, selector: "ai-table-action-icon", inputs: ["config"], outputs: ["onClick", "onMousemove", "onMouseenter", "onMouseleave"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
6195
+ }
6196
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AITableCellRichtext, decorators: [{
6197
+ type: Component,
6198
+ args: [{
6199
+ selector: 'ai-table-richtext',
6200
+ template: `
6201
+ <ai-table-text [config]="textConfig()!"></ai-table-text>
6202
+ <ai-table-action-icon [config]="iconConfig()"></ai-table-action-icon>
6203
+ `,
6204
+ standalone: true,
6205
+ imports: [AITableText, AITableActionIcon],
6206
+ changeDetection: ChangeDetectionStrategy.OnPush
6207
+ }]
6208
+ }] });
6209
+
6114
6210
  // TODO: components下的cells组件考虑移出 components ,这些组件都属于
6115
6211
 
6116
6212
  var cellComponents = /*#__PURE__*/Object.freeze({
6117
6213
  __proto__: null,
6118
6214
  AITableCellAttachment: AITableCellAttachment,
6119
- AITableCellLink: AITableCellLink
6215
+ AITableCellLink: AITableCellLink,
6216
+ AITableCellRichtext: AITableCellRichtext
6120
6217
  });
6121
6218
 
6122
6219
  const componentMap = {};
@@ -6928,6 +7025,7 @@ class CellDrawer extends Drawer {
6928
7025
  const fieldType = field.type;
6929
7026
  switch (fieldType) {
6930
7027
  case AITableFieldType.text:
7028
+ case AITableFieldType.richText:
6931
7029
  case AITableFieldType.number:
6932
7030
  case AITableFieldType.link:
6933
7031
  return this.renderCellText(render, ctx);
@@ -6958,8 +7056,9 @@ class CellDrawer extends Drawer {
6958
7056
  if (renderText == null) {
6959
7057
  return;
6960
7058
  }
6961
- const isSingleLine = !columnWidth;
6962
- const isTextField = fieldType === AITableFieldType.text;
7059
+ // const isSingleLine = !columnWidth;
7060
+ const isSingleLine = true;
7061
+ const isTextField = fieldType === AITableFieldType.text || fieldType === AITableFieldType.richText;
6963
7062
  const isNumberField = fieldType === AITableFieldType.number;
6964
7063
  if (isTextField && isSingleLine) {
6965
7064
  renderText = renderText.replace(/\r|\n/g, ' ');
@@ -7906,6 +8005,9 @@ class AITableFieldIcon {
7906
8005
  case AITableFieldType.text:
7907
8006
  data = ColumnTextFilledPath;
7908
8007
  break;
8008
+ case AITableFieldType.richText:
8009
+ data = ColumnRichTextFilledPath;
8010
+ break;
7909
8011
  case AITableFieldType.select:
7910
8012
  data = field.settings?.is_multiple ? ColumnMultipleFillPath : ColumnSelectFilledPath;
7911
8013
  break;
@@ -8903,15 +9005,12 @@ class AITableDragComponent {
8903
9005
  initElements() {
8904
9006
  this.rect = this.elementRef.nativeElement.querySelector('.rect');
8905
9007
  this.auxiliaryLine = this.elementRef.nativeElement.querySelector('.auxiliary-line');
8906
- this.colResizeLine = this.elementRef.nativeElement.querySelector('.col-resize-line');
8907
9008
  }
8908
9009
  setupEventListeners() {
8909
9010
  this.mousedownListener = this.render2.listen('window', 'mousedown', (e) => {
8910
9011
  this.mouseStartPosition = { x: e.x, y: e.y };
8911
- e.preventDefault();
8912
9012
  });
8913
9013
  this.mousemoveListener = this.render2.listen('window', 'mousemove', (e) => {
8914
- e.preventDefault();
8915
9014
  if (this.timer) {
8916
9015
  cancelAnimationFrame(this.timer);
8917
9016
  }
@@ -8936,10 +9035,6 @@ class AITableDragComponent {
8936
9035
  if (drag.type === DragType.none || !this.rect || !this.auxiliaryLine) {
8937
9036
  return;
8938
9037
  }
8939
- if (drag.type === DragType.columnWidth) {
8940
- this.setDisplayStyle('block');
8941
- this.showColResize(drag);
8942
- }
8943
9038
  this.aiTableDrag = drag;
8944
9039
  }
8945
9040
  handleDrag(e, drag) {
@@ -9017,6 +9112,7 @@ class AITableDragComponent {
9017
9112
  }
9018
9113
  }
9019
9114
  movingColumnWidth(drag, moveX) {
9115
+ this.setCursorStyle('col-resize');
9020
9116
  const aiTable = this.aiTableGridSelectionService.aiTable;
9021
9117
  const visibleColumnIndexMap = aiTable.context.visibleColumnsIndexMap();
9022
9118
  const sourceColumnIndex = visibleColumnIndexMap.get(drag.sourceIds.values().next().value) || 0;
@@ -9038,36 +9134,6 @@ class AITableDragComponent {
9038
9134
  width: Math.max(MIN_COLUMN_WIDTH, sourceColumnWidth + moveX)
9039
9135
  };
9040
9136
  }
9041
- showColResize(drag) {
9042
- const aiTable = this.aiTableGridSelectionService.aiTable;
9043
- const visibleColumnIndexMap = aiTable.context.visibleColumnsIndexMap();
9044
- const sourceColumnIndex = visibleColumnIndexMap.get(drag.sourceIds.values().next().value) || 0;
9045
- const coordinate = drag.coordinate;
9046
- const sourceColumnStartX = coordinate.getColumnOffset(sourceColumnIndex);
9047
- const scroll = drag.scroll || { x: 0, y: 0 };
9048
- let targetColumnIndex = coordinate.getColumnStartIndex(sourceColumnStartX + scroll.x);
9049
- let targetColumnStartX = coordinate.getColumnOffset(targetColumnIndex);
9050
- const sourceColumnWidth = drag.coordinate.getColumnWidth(sourceColumnIndex);
9051
- const opacityLineWidth = 4;
9052
- // 重置样式
9053
- this.setRectStyles({ width: 0 });
9054
- this.resetAuxiliaryLine();
9055
- this.setDisplayStyle('block');
9056
- this.render2.setStyle(this.elementRef.nativeElement, 'cursor', 'col-resize');
9057
- // 隐藏列宽调整线,用于监听鼠标离开此区域后结束宽度调整
9058
- this.setColResizeLine({
9059
- opacity: 0,
9060
- height: '100%',
9061
- width: `${opacityLineWidth}px`,
9062
- left: `${targetColumnStartX + sourceColumnWidth - opacityLineWidth / 2}px`,
9063
- zIndex: 10
9064
- });
9065
- this.lineMouseLeaveListener = this.render2.listen(this.colResizeLine, 'mouseleave', () => {
9066
- this.setDisplayStyle('none');
9067
- this.lineMouseLeaveListener?.();
9068
- this.lineMouseLeaveListener = undefined;
9069
- });
9070
- }
9071
9137
  handleDragEnd() {
9072
9138
  this.setDisplayStyle('none');
9073
9139
  if (this.draggedData) {
@@ -9087,6 +9153,9 @@ class AITableDragComponent {
9087
9153
  setDisplayStyle(display) {
9088
9154
  this.render2.setStyle(this.elementRef.nativeElement, 'display', display);
9089
9155
  }
9156
+ setCursorStyle(cursor) {
9157
+ this.render2.setStyle(this.elementRef.nativeElement, 'cursor', cursor);
9158
+ }
9090
9159
  setRectStyles(styles) {
9091
9160
  Object.entries(styles).forEach(([prop, value]) => {
9092
9161
  this.render2.setStyle(this.rect, prop, value);
@@ -9097,11 +9166,6 @@ class AITableDragComponent {
9097
9166
  this.render2.setStyle(this.auxiliaryLine, prop, value);
9098
9167
  });
9099
9168
  }
9100
- setColResizeLine(styles) {
9101
- Object.entries(styles).forEach(([prop, value]) => {
9102
- this.render2.setStyle(this.colResizeLine, prop, value);
9103
- });
9104
- }
9105
9169
  resetAuxiliaryLine() {
9106
9170
  this.setAuxiliaryLineStyles({ width: 0 });
9107
9171
  }
@@ -9112,21 +9176,19 @@ class AITableDragComponent {
9112
9176
  this.mousemoveListener();
9113
9177
  if (this.mouseupListener)
9114
9178
  this.mouseupListener();
9115
- if (this.lineMouseLeaveListener)
9116
- this.lineMouseLeaveListener();
9117
9179
  if (this.timer) {
9118
9180
  cancelAnimationFrame(this.timer);
9119
9181
  this.timer = null;
9120
9182
  }
9121
9183
  }
9122
9184
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AITableDragComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
9123
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AITableDragComponent, isStandalone: true, selector: "ai-table-drag", outputs: { dragEnd: "dragEnd" }, host: { classAttribute: "drag-container" }, ngImport: i0, template: "<div class=\"rect\"></div>\n<div class=\"auxiliary-line\"></div>\n<div class=\"col-resize-line\"></div>", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
9185
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AITableDragComponent, isStandalone: true, selector: "ai-table-drag", outputs: { dragEnd: "dragEnd" }, host: { classAttribute: "drag-container" }, ngImport: i0, template: "<div class=\"rect\"></div>\n<div class=\"auxiliary-line\"></div>", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
9124
9186
  }
9125
9187
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AITableDragComponent, decorators: [{
9126
9188
  type: Component,
9127
9189
  args: [{ selector: 'ai-table-drag', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, host: {
9128
9190
  class: 'drag-container'
9129
- }, template: "<div class=\"rect\"></div>\n<div class=\"auxiliary-line\"></div>\n<div class=\"col-resize-line\"></div>" }]
9191
+ }, template: "<div class=\"rect\"></div>\n<div class=\"auxiliary-line\"></div>" }]
9130
9192
  }], ctorParameters: () => [] });
9131
9193
 
9132
9194
  class AITableGrid extends AITableGridBase {
@@ -9324,18 +9386,6 @@ class AITableGrid extends AITableGridBase {
9324
9386
  }
9325
9387
  }
9326
9388
  }
9327
- const { targetName: _targetName, fieldId } = getDetailByTargetName(targetName);
9328
- if (_targetName === AI_TABLE_FIELD_HEAD_OPACITY_LINE && fieldId) {
9329
- this.aiTableGridSelectionService.drag({
9330
- type: DragType.columnWidth,
9331
- sourceIds: new Set([fieldId]),
9332
- scroll: this.getScrollPosition(),
9333
- coordinate: this.coordinate()
9334
- });
9335
- }
9336
- else if (this.aiTableGridSelectionService.getDragStateType() === DragType.columnWidth) {
9337
- this.aiTableGridSelectionService.clearDrag();
9338
- }
9339
9389
  });
9340
9390
  }
9341
9391
  stageMousedown(e) {
@@ -9356,6 +9406,17 @@ class AITableGrid extends AITableGridBase {
9356
9406
  this.aiTableGridSelectionService.selectField(fieldId);
9357
9407
  this.handleFieldDragStart();
9358
9408
  return;
9409
+ case AI_TABLE_FIELD_HEAD_OPACITY_LINE:
9410
+ mouseEvent.preventDefault();
9411
+ if (!fieldId)
9412
+ return;
9413
+ this.aiTableGridSelectionService.drag({
9414
+ type: DragType.columnWidth,
9415
+ sourceIds: new Set([fieldId]),
9416
+ scroll: this.getScrollPosition(),
9417
+ coordinate: this.coordinate()
9418
+ });
9419
+ return;
9359
9420
  case AI_TABLE_CELL:
9360
9421
  if (!recordId || !fieldId)
9361
9422
  return;
@@ -9725,5 +9786,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
9725
9786
  * Generated bundle index. Do not edit.
9726
9787
  */
9727
9788
 
9728
- export { AITable, AITableAreaType, AITableAvatarSize, AITableAvatarType, AITableCheckType, AITableContextMenu, AITableDomGrid, AITableFieldIsSameOptionPipe, AITableFieldSetting, AITableFieldType, AITableFilterOperation, AITableGrid, AITableGridEventService, AITableGridFieldService, AITableGridI18nKey, AITableGridSelectionService, AITableMemberType, AITableMouseDownType, AITableQueries, AITableRenderer, AITableRowColumnType, AITableRowType, AITableSelectAllState, AITableSelectOptionStyle, AITableStatType, AI_TABLE_ACTION_COMMON_RADIUS, AI_TABLE_ACTION_COMMON_RIGHT_PADDING, AI_TABLE_ACTION_COMMON_SIZE, AI_TABLE_BLANK, AI_TABLE_CELL, AI_TABLE_CELL_ACTIVE_BORDER_WIDTH, AI_TABLE_CELL_ADD_ITEM_BUTTON_SIZE, AI_TABLE_CELL_ATTACHMENT_ADD, AI_TABLE_CELL_ATTACHMENT_FILE, AI_TABLE_CELL_BORDER, AI_TABLE_CELL_DELETE_ITEM_BUTTON_SIZE, AI_TABLE_CELL_DELETE_ITEM_BUTTON_SIZE_OFFSET, AI_TABLE_CELL_EMOJI_PADDING, AI_TABLE_CELL_EMOJI_SIZE, AI_TABLE_CELL_FIELD_ITEM_HEIGHT, AI_TABLE_CELL_MAX_ROW_COUNT, AI_TABLE_CELL_MEMBER_ITEM_HEIGHT, AI_TABLE_CELL_MEMBER_ITEM_PADDING, AI_TABLE_CELL_MEMBER_MAX_HEIGHT, AI_TABLE_CELL_MULTI_DOT_RADIUS, AI_TABLE_CELL_MULTI_ITEM_MARGIN_LEFT, AI_TABLE_CELL_MULTI_ITEM_MARGIN_TOP, AI_TABLE_CELL_MULTI_ITEM_MIN_WIDTH, AI_TABLE_CELL_MULTI_PADDING_LEFT, AI_TABLE_CELL_MULTI_PADDING_TOP, AI_TABLE_CELL_PADDING, AI_TABLE_COMMON_FONT_SIZE, AI_TABLE_DEFAULT_COLUMN_WIDTH, AI_TABLE_DOT_RADIUS, AI_TABLE_FIELD_ADD_BUTTON, AI_TABLE_FIELD_ADD_BUTTON_WIDTH, AI_TABLE_FIELD_HEAD, AI_TABLE_FIELD_HEAD_HEIGHT, AI_TABLE_FIELD_HEAD_ICON_GAP_SIZE, AI_TABLE_FIELD_HEAD_MORE, AI_TABLE_FIELD_HEAD_OPACITY_LINE, AI_TABLE_FIELD_HEAD_SELECT_CHECKBOX, AI_TABLE_FIELD_HEAD_TEXT_MIN_WIDTH, AI_TABLE_FIELD_ITEM_MARGIN_RIGHT, AI_TABLE_FIELD_MAX_WIDTH, AI_TABLE_FIELD_MIDDLE_WIDTH, AI_TABLE_FIELD_MINI_WIDTH, AI_TABLE_FIELD_MIN_WIDTH, AI_TABLE_FILE_ICON_ITEM_HEIGHT, AI_TABLE_FILE_ICON_SIZE, AI_TABLE_GRID_FIELD_SERVICE_MAP, AI_TABLE_ICON_COMMON_SIZE, AI_TABLE_MEMBER_AVATAR_SIZE, AI_TABLE_MEMBER_ITEM_AVATAR_MARGIN_RIGHT, AI_TABLE_MEMBER_ITEM_PADDING_RIGHT, AI_TABLE_MIN_TEXT_WIDTH, AI_TABLE_OFFSET, AI_TABLE_OPTION_ITEM_FONT_SIZE, AI_TABLE_OPTION_ITEM_HEIGHT, AI_TABLE_OPTION_ITEM_PADDING, AI_TABLE_OPTION_ITEM_RADIUS, AI_TABLE_PIECE_RADIUS, AI_TABLE_PIECE_WIDTH, AI_TABLE_POPOVER_LEFT_OFFSET, AI_TABLE_PREVENT_CLEAR_SELECTION_CLASS, AI_TABLE_PROGRESS_BAR_HEIGHT, AI_TABLE_PROGRESS_BAR_RADIUS, AI_TABLE_PROGRESS_TEXT_Width, AI_TABLE_ROW_ADD_BUTTON, AI_TABLE_ROW_BLANK_HEIGHT, AI_TABLE_ROW_HEAD, AI_TABLE_ROW_HEAD_SIZE, AI_TABLE_ROW_HEAD_WIDTH, AI_TABLE_ROW_HEIGHT, AI_TABLE_ROW_SELECT_CHECKBOX, AI_TABLE_SCROLL_BAR_PADDING, AI_TABLE_TAG_FONT_SIZE, AI_TABLE_TAG_PADDING, AI_TABLE_TEXT_GAP, AbstractEditCellEditor, AddOutlinedPath, AttachmentPath, Check, Colors, ColumnCalendarFilledPath, ColumnLinkOutlinedPath, ColumnMemberFilledPath, ColumnMultipleFillPath, ColumnNumberFilledPath, ColumnProgressFilledPath, ColumnRatingFilledPath, ColumnSelectFilledPath, ColumnTextFilledPath, Coordinate, DBL_CLICK_EDIT_TYPE, DEFAULT_FONT_FAMILY, DEFAULT_FONT_SIZE, DEFAULT_FONT_STYLE, DEFAULT_FONT_WEIGHT, DEFAULT_ICON_SHAPE, DEFAULT_ICON_SIZE, DEFAULT_POINT_POSITION, DEFAULT_SCROLL_STATE, DEFAULT_TEXT_ALIGN_CENTER, DEFAULT_TEXT_ALIGN_LEFT, DEFAULT_TEXT_ALIGN_RIGHT, DEFAULT_TEXT_DECORATION, DEFAULT_TEXT_ELLIPSIS, DEFAULT_TEXT_FILL, DEFAULT_TEXT_LINE_HEIGHT, DEFAULT_TEXT_LISTENING, DEFAULT_TEXT_MAX_CACHE, DEFAULT_TEXT_MAX_HEIGHT, DEFAULT_TEXT_SCALE, DEFAULT_TEXT_TRANSFORMS_ENABLED, DEFAULT_TEXT_VERTICAL_ALIGN_MIDDLE, DEFAULT_TEXT_VERTICAL_ALIGN_TOP, DEFAULT_TEXT_WRAP, DEFAULT_WRAP_TEXT_MAX_ROW, DateCellEditorComponent, DepartmentOutlinedPath, Direction, DragType, FONT_SIZE_SM, FieldModelMap, GRID_CELL_EDITOR_MAP, IsSelectRecordPipe, LinkCellEditorComponent, MIN_COLUMN_WIDTH, MOUSEOVER_EDIT_TYPE, MemberSettingPipe, MoreStandOutlinedPath, NumberCellEditorComponent, ProgressEditorComponent, RatingCellEditorComponent, RendererContext, RowHeight, SelectCellEditorComponent, SelectOptionComponent, SelectOptionPipe, SelectOptionsPipe, SelectSettingPipe, StarFill, TextCellEditorComponent, TextMeasure, Unchecked, UserPipe, WebOutlinedPath, aiTableFragmentAttribute, buildClipboardData, buildGridData, buildGridLinearRows, castToString, compareNumber, compareString, createAITable, createActiveCellBorder, createCells, createDefaultField, createDefaultFieldName, extractLinkUrl, extractText, generateNewName, generateTargetName, getAvatarBgColor, getAvatarShortName, getCellEditorBorderSpace, getCellHorizontalPosition, getColumnIndicesSizeMap, getDefaultFieldValue, getDefaultI18nTextByKey, getDetailByTargetName, getEditorBoxOffset, getEditorSpace, getFieldOptionByField, getFieldOptions, getFieldValue, getHoverCell, getHoverEditorBoxOffset, getHoverEditorSpace, getI18nTextByKey, getMousePosition, getPlaceHolderCellsConfigs, getSystemFieldValue, getTargetName, getTextWidth, getVisibleRangeInfo, handleMouseStyle, hasIntersect, idCreator, idsCreator, imageCache, isArrayField, isCellMatchKeywords, isClipboardReadSupported, isClipboardReadTextSupported, isClipboardWriteSupported, isClipboardWriteTextSupported, isEmpty, isMac, isNumberFiled, isSameFieldOption, isSelectedField, isSystemField, isWindows, isWindowsOS, isWithinFrozenColumnBoundary, readFromClipboard, scrollMax, setMouseStyle, shortIdCreator, shortIdsCreator, stringInclude, textDataCache, transformCellValue, writeToAITable, writeToClipboard, zhIntlCollator };
9789
+ export { AITable, AITableAreaType, AITableAvatarSize, AITableAvatarType, AITableCheckType, AITableContextMenu, AITableDomGrid, AITableFieldIsSameOptionPipe, AITableFieldSetting, AITableFieldType, AITableFilterOperation, AITableGrid, AITableGridEventService, AITableGridFieldService, AITableGridI18nKey, AITableGridSelectionService, AITableMemberType, AITableMouseDownType, AITableQueries, AITableRenderer, AITableRowColumnType, AITableRowType, AITableSelectAllState, AITableSelectOptionStyle, AITableStatType, AI_TABLE_ACTION_COMMON_RADIUS, AI_TABLE_ACTION_COMMON_RIGHT_PADDING, AI_TABLE_ACTION_COMMON_SIZE, AI_TABLE_BLANK, AI_TABLE_CELL, AI_TABLE_CELL_ACTIVE_BORDER_WIDTH, AI_TABLE_CELL_ADD_ITEM_BUTTON_SIZE, AI_TABLE_CELL_ATTACHMENT_ADD, AI_TABLE_CELL_ATTACHMENT_FILE, AI_TABLE_CELL_BORDER, AI_TABLE_CELL_DELETE_ITEM_BUTTON_SIZE, AI_TABLE_CELL_DELETE_ITEM_BUTTON_SIZE_OFFSET, AI_TABLE_CELL_EDIT, AI_TABLE_CELL_EMOJI_PADDING, AI_TABLE_CELL_EMOJI_SIZE, AI_TABLE_CELL_FIELD_ITEM_HEIGHT, AI_TABLE_CELL_MAX_ROW_COUNT, AI_TABLE_CELL_MEMBER_ITEM_HEIGHT, AI_TABLE_CELL_MEMBER_ITEM_PADDING, AI_TABLE_CELL_MEMBER_MAX_HEIGHT, AI_TABLE_CELL_MULTI_DOT_RADIUS, AI_TABLE_CELL_MULTI_ITEM_MARGIN_LEFT, AI_TABLE_CELL_MULTI_ITEM_MARGIN_TOP, AI_TABLE_CELL_MULTI_ITEM_MIN_WIDTH, AI_TABLE_CELL_MULTI_PADDING_LEFT, AI_TABLE_CELL_MULTI_PADDING_TOP, AI_TABLE_CELL_PADDING, AI_TABLE_COMMON_FONT_SIZE, AI_TABLE_DEFAULT_COLUMN_WIDTH, AI_TABLE_DOT_RADIUS, AI_TABLE_FIELD_ADD_BUTTON, AI_TABLE_FIELD_ADD_BUTTON_WIDTH, AI_TABLE_FIELD_HEAD, AI_TABLE_FIELD_HEAD_HEIGHT, AI_TABLE_FIELD_HEAD_ICON_GAP_SIZE, AI_TABLE_FIELD_HEAD_MORE, AI_TABLE_FIELD_HEAD_OPACITY_LINE, AI_TABLE_FIELD_HEAD_SELECT_CHECKBOX, AI_TABLE_FIELD_HEAD_TEXT_MIN_WIDTH, AI_TABLE_FIELD_ITEM_MARGIN_RIGHT, AI_TABLE_FIELD_MAX_WIDTH, AI_TABLE_FIELD_MIDDLE_WIDTH, AI_TABLE_FIELD_MINI_WIDTH, AI_TABLE_FIELD_MIN_WIDTH, AI_TABLE_FILE_ICON_ITEM_HEIGHT, AI_TABLE_FILE_ICON_SIZE, AI_TABLE_GRID_FIELD_SERVICE_MAP, AI_TABLE_ICON_COMMON_SIZE, AI_TABLE_MEMBER_AVATAR_SIZE, AI_TABLE_MEMBER_ITEM_AVATAR_MARGIN_RIGHT, AI_TABLE_MEMBER_ITEM_PADDING_RIGHT, AI_TABLE_MIN_TEXT_WIDTH, AI_TABLE_OFFSET, AI_TABLE_OPTION_ITEM_FONT_SIZE, AI_TABLE_OPTION_ITEM_HEIGHT, AI_TABLE_OPTION_ITEM_PADDING, AI_TABLE_OPTION_ITEM_RADIUS, AI_TABLE_PIECE_RADIUS, AI_TABLE_PIECE_WIDTH, AI_TABLE_POPOVER_LEFT_OFFSET, AI_TABLE_PREVENT_CLEAR_SELECTION_CLASS, AI_TABLE_PROGRESS_BAR_HEIGHT, AI_TABLE_PROGRESS_BAR_RADIUS, AI_TABLE_PROGRESS_TEXT_Width, AI_TABLE_ROW_ADD_BUTTON, AI_TABLE_ROW_BLANK_HEIGHT, AI_TABLE_ROW_HEAD, AI_TABLE_ROW_HEAD_SIZE, AI_TABLE_ROW_HEAD_WIDTH, AI_TABLE_ROW_HEIGHT, AI_TABLE_ROW_SELECT_CHECKBOX, AI_TABLE_SCROLL_BAR_PADDING, AI_TABLE_TAG_FONT_SIZE, AI_TABLE_TAG_PADDING, AI_TABLE_TEXT_GAP, AbstractEditCellEditor, AddOutlinedPath, AttachmentPath, Check, Colors, ColumnCalendarFilledPath, ColumnLinkOutlinedPath, ColumnMemberFilledPath, ColumnMultipleFillPath, ColumnNumberFilledPath, ColumnProgressFilledPath, ColumnRatingFilledPath, ColumnRichTextFilledPath, ColumnSelectFilledPath, ColumnTextFilledPath, Coordinate, DBL_CLICK_EDIT_TYPE, DEFAULT_FONT_FAMILY, DEFAULT_FONT_SIZE, DEFAULT_FONT_STYLE, DEFAULT_FONT_WEIGHT, DEFAULT_ICON_SHAPE, DEFAULT_ICON_SIZE, DEFAULT_POINT_POSITION, DEFAULT_SCROLL_STATE, DEFAULT_TEXT_ALIGN_CENTER, DEFAULT_TEXT_ALIGN_LEFT, DEFAULT_TEXT_ALIGN_RIGHT, DEFAULT_TEXT_DECORATION, DEFAULT_TEXT_ELLIPSIS, DEFAULT_TEXT_FILL, DEFAULT_TEXT_LINE_HEIGHT, DEFAULT_TEXT_LISTENING, DEFAULT_TEXT_MAX_CACHE, DEFAULT_TEXT_MAX_HEIGHT, DEFAULT_TEXT_SCALE, DEFAULT_TEXT_TRANSFORMS_ENABLED, DEFAULT_TEXT_VERTICAL_ALIGN_MIDDLE, DEFAULT_TEXT_VERTICAL_ALIGN_TOP, DEFAULT_TEXT_WRAP, DEFAULT_WRAP_TEXT_MAX_ROW, DateCellEditorComponent, DepartmentOutlinedPath, Direction, DragType, EditPath, FONT_SIZE_SM, FieldModelMap, GRID_CELL_EDITOR_MAP, IsSelectRecordPipe, KO_CONTAINER_TOKEN, KoComponent, KoContainer, KoShape, KoShapeTypes, KoStage, LinkCellEditorComponent, MIN_COLUMN_WIDTH, MOUSEOVER_EDIT_TYPE, MemberSettingPipe, MoreStandOutlinedPath, NumberCellEditorComponent, ProgressEditorComponent, RatingCellEditorComponent, RendererContext, RowHeight, SelectCellEditorComponent, SelectOptionComponent, SelectOptionPipe, SelectOptionsPipe, SelectSettingPipe, StarFill, TextCellEditorComponent, TextMeasure, Unchecked, UserPipe, WebOutlinedPath, aiTableFragmentAttribute, applyNodeProps, buildClipboardData, buildGridData, buildGridLinearRows, castToString, compareNumber, compareString, createAITable, createActiveCellBorder, createCells, createDefaultField, createDefaultFieldName, createListener, extractLinkUrl, extractText, generateNewName, generateTargetName, getAvatarBgColor, getAvatarShortName, getCellEditorBorderSpace, getCellHorizontalPosition, getColumnIndicesSizeMap, getDefaultFieldValue, getDefaultI18nTextByKey, getDetailByTargetName, getEditorBoxOffset, getEditorSpace, getFieldOptionByField, getFieldOptions, getFieldValue, getHoverCell, getHoverEditorBoxOffset, getHoverEditorSpace, getI18nTextByKey, getMousePosition, getName, getPlaceHolderCellsConfigs, getSystemFieldValue, getTargetName, getTextWidth, getVisibleRangeInfo, handleMouseStyle, hasIntersect, idCreator, idsCreator, imageCache, isArrayField, isCellMatchKeywords, isClipboardReadSupported, isClipboardReadTextSupported, isClipboardWriteSupported, isClipboardWriteTextSupported, isEmpty, isMac, isNumberFiled, isSameFieldOption, isSelectedField, isSystemField, isWindows, isWindowsOS, isWithinFrozenColumnBoundary, readFromClipboard, scrollMax, setMouseStyle, shortIdCreator, shortIdsCreator, stringInclude, textDataCache, transformCellValue, updatePicture, writeToAITable, writeToClipboard, zhIntlCollator };
9729
9790
  //# sourceMappingURL=ai-table-grid.mjs.map