@visactor/vtable-editors 1.1.3-alpha.2 → 1.2.0-alpha.3
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.
- package/cjs/index.d.ts +1 -2
- package/cjs/index.js +1 -10
- package/cjs/index.js.map +1 -1
- package/cjs/input-editor.d.ts +2 -1
- package/cjs/input-editor.js +3 -5
- package/cjs/input-editor.js.map +1 -1
- package/dist/vtable-editors.js +0 -71
- package/dist/vtable-editors.min.js +1 -1
- package/es/index.d.ts +1 -2
- package/es/index.js +1 -3
- package/es/index.js.map +1 -1
- package/es/input-editor.d.ts +2 -1
- package/es/input-editor.js +3 -5
- package/es/input-editor.js.map +1 -1
- package/package.json +1 -1
- package/cjs/textArea-editor.d.ts +0 -20
- package/cjs/textArea-editor.js +0 -47
- package/cjs/textArea-editor.js.map +0 -1
- package/es/textArea-editor.d.ts +0 -20
- package/es/textArea-editor.js +0 -39
- package/es/textArea-editor.js.map +0 -1
package/cjs/index.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { InputEditor } from './input-editor';
|
|
2
2
|
import { DateInputEditor } from './date-input-editor';
|
|
3
3
|
import { ListEditor } from './list-editor';
|
|
4
|
-
|
|
5
|
-
export { InputEditor, DateInputEditor, ListEditor, TextAreaEditor };
|
|
4
|
+
export { InputEditor, DateInputEditor, ListEditor };
|
|
6
5
|
export * from './types';
|
package/cjs/index.js
CHANGED
|
@@ -17,7 +17,7 @@ var __createBinding = this && this.__createBinding || (Object.create ? function(
|
|
|
17
17
|
|
|
18
18
|
Object.defineProperty(exports, "__esModule", {
|
|
19
19
|
value: !0
|
|
20
|
-
}), exports.
|
|
20
|
+
}), exports.ListEditor = exports.DateInputEditor = exports.InputEditor = void 0;
|
|
21
21
|
|
|
22
22
|
const input_editor_1 = require("./input-editor");
|
|
23
23
|
|
|
@@ -44,14 +44,5 @@ Object.defineProperty(exports, "ListEditor", {
|
|
|
44
44
|
get: function() {
|
|
45
45
|
return list_editor_1.ListEditor;
|
|
46
46
|
}
|
|
47
|
-
});
|
|
48
|
-
|
|
49
|
-
const textArea_editor_1 = require("./textArea-editor");
|
|
50
|
-
|
|
51
|
-
Object.defineProperty(exports, "TextAreaEditor", {
|
|
52
|
-
enumerable: !0,
|
|
53
|
-
get: function() {
|
|
54
|
-
return textArea_editor_1.TextAreaEditor;
|
|
55
|
-
}
|
|
56
47
|
}), __exportStar(require("./types"), exports);
|
|
57
48
|
//# sourceMappingURL=index.js.map
|
package/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,iDAA6C;
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,iDAA6C;AAGpC,4FAHA,0BAAW,OAGA;AAFpB,2DAAsD;AAEhC,gGAFb,mCAAe,OAEa;AADrC,+CAA2C;AACJ,2FAD9B,wBAAU,OAC8B;AACjD,0CAAwB","file":"index.js","sourcesContent":["import { InputEditor } from './input-editor';\nimport { DateInputEditor } from './date-input-editor';\nimport { ListEditor } from './list-editor';\nexport { InputEditor, DateInputEditor, ListEditor };\nexport * from './types';\n"]}
|
package/cjs/input-editor.d.ts
CHANGED
package/cjs/input-editor.js
CHANGED
|
@@ -9,12 +9,10 @@ class InputEditor {
|
|
|
9
9
|
this.editorType = "Input", this.editorConfig = editorConfig;
|
|
10
10
|
}
|
|
11
11
|
createElement() {
|
|
12
|
-
var _a;
|
|
13
12
|
const input = document.createElement("input");
|
|
14
|
-
input.setAttribute("type", "text"),
|
|
15
|
-
input.style.
|
|
16
|
-
|
|
17
|
-
input.addEventListener("keydown", (e => {
|
|
13
|
+
input.setAttribute("type", "text"), input.style.position = "absolute", input.style.padding = "4px",
|
|
14
|
+
input.style.width = "100%", input.style.boxSizing = "border-box", this.element = input,
|
|
15
|
+
this.container.appendChild(input), input.addEventListener("keydown", (e => {
|
|
18
16
|
"a" === e.key && (e.ctrlKey || e.metaKey) && e.stopPropagation();
|
|
19
17
|
}));
|
|
20
18
|
}
|
package/cjs/input-editor.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/input-editor.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"sources":["../src/input-editor.ts"],"names":[],"mappings":";;;AAOA,MAAa,WAAW;IAOtB,YAAY,YAAgC;QAN5C,eAAU,GAAW,OAAO,CAAC;QAO3B,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;IACnC,CAAC;IAED,aAAa;QACX,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC9C,KAAK,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QACnC,KAAK,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;QAClC,KAAK,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC;QAC5B,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC;QAC3B,KAAK,CAAC,KAAK,CAAC,SAAS,GAAG,YAAY,CAAC;QACrC,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QAErB,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAGlC,KAAK,CAAC,gBAAgB,CAAC,SAAS,EAAE,CAAC,CAAgB,EAAE,EAAE;YACrD,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,EAAE;gBAE7C,CAAC,CAAC,eAAe,EAAE,CAAC;aACrB;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAED,QAAQ,CAAC,KAAa;QACpB,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,OAAO,KAAK,KAAK,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;IACjE,CAAC;IAED,QAAQ;QACN,OAAO,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC;IAC5B,CAAC;IAED,OAAO,CAAC,EAAE,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,OAAO,EAAuB;QAC3E,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;QAC3B,IAAI,CAAC,eAAe,GAAG,OAAO,CAAC;QAC/B,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;YACjB,IAAI,CAAC,aAAa,EAAE,CAAC;YAErB,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,EAAE;gBACzC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;aACtB;YACD,IAAI,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,IAAI,EAAE;gBAC3B,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;aAC7C;SACF;QACD,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IAEvB,CAAC;IAED,cAAc,CAAC,IAAe;QAC5B,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;QACzC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QAC3C,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAC7C,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;IACjD,CAAC;IAED,UAAU;IAEV,CAAC;IAED,KAAK;QAEH,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACzC,IAAI,CAAC,OAAO,GAAG,SAAS,CAAC;IAC3B,CAAC;IAED,eAAe,CAAC,MAAmB;QACjC,OAAO,MAAM,KAAK,IAAI,CAAC,OAAO,CAAC;IACjC,CAAC;CACF;AA5ED,kCA4EC","file":"input-editor.js","sourcesContent":["import type { EditContext, IEditor, Placement, RectProps } from './types';\n\nexport interface InputEditorConfig {\n max?: number;\n min?: number;\n}\n\nexport class InputEditor implements IEditor {\n editorType: string = 'Input';\n editorConfig: InputEditorConfig;\n container: HTMLElement;\n successCallback?: () => void;\n element?: HTMLInputElement;\n\n constructor(editorConfig?: InputEditorConfig) {\n this.editorConfig = editorConfig;\n }\n\n createElement() {\n const input = document.createElement('input');\n input.setAttribute('type', 'text');\n input.style.position = 'absolute';\n input.style.padding = '4px';\n input.style.width = '100%';\n input.style.boxSizing = 'border-box';\n this.element = input;\n\n this.container.appendChild(input);\n\n // 监听键盘事件\n input.addEventListener('keydown', (e: KeyboardEvent) => {\n if (e.key === 'a' && (e.ctrlKey || e.metaKey)) {\n // 阻止冒泡 防止处理成表格全选事件\n e.stopPropagation();\n }\n });\n }\n\n setValue(value: string) {\n this.element.value = typeof value !== 'undefined' ? value : '';\n }\n\n getValue() {\n return this.element.value;\n }\n\n onStart({ value, referencePosition, container, endEdit }: EditContext<string>) {\n this.container = container;\n this.successCallback = endEdit;\n if (!this.element) {\n this.createElement();\n\n if (value !== undefined && value !== null) {\n this.setValue(value);\n }\n if (referencePosition?.rect) {\n this.adjustPosition(referencePosition.rect);\n }\n }\n this.element.focus();\n // do nothing\n }\n\n adjustPosition(rect: RectProps) {\n this.element.style.top = rect.top + 'px';\n this.element.style.left = rect.left + 'px';\n this.element.style.width = rect.width + 'px';\n this.element.style.height = rect.height + 'px';\n }\n\n endEditing() {\n // do nothing\n }\n\n onEnd() {\n // do nothing\n this.container.removeChild(this.element);\n this.element = undefined;\n }\n\n isEditorElement(target: HTMLElement) {\n return target === this.element;\n }\n}\n"]}
|
package/dist/vtable-editors.js
CHANGED
|
@@ -16,9 +16,6 @@
|
|
|
16
16
|
createElement() {
|
|
17
17
|
const input = document.createElement('input');
|
|
18
18
|
input.setAttribute('type', 'text');
|
|
19
|
-
if (this.editorConfig?.readonly) {
|
|
20
|
-
input.setAttribute('readonly', `${this.editorConfig.readonly}`);
|
|
21
|
-
}
|
|
22
19
|
input.style.position = 'absolute';
|
|
23
20
|
input.style.padding = '4px';
|
|
24
21
|
input.style.width = '100%';
|
|
@@ -155,73 +152,6 @@
|
|
|
155
152
|
}
|
|
156
153
|
}
|
|
157
154
|
|
|
158
|
-
class TextAreaEditor {
|
|
159
|
-
editorType = 'TextArea';
|
|
160
|
-
editorConfig;
|
|
161
|
-
container;
|
|
162
|
-
successCallback;
|
|
163
|
-
element;
|
|
164
|
-
constructor(editorConfig) {
|
|
165
|
-
this.editorConfig = editorConfig || {};
|
|
166
|
-
}
|
|
167
|
-
createElement() {
|
|
168
|
-
const input = document.createElement('textArea');
|
|
169
|
-
if (this.editorConfig?.readonly) {
|
|
170
|
-
input.setAttribute('readonly', `${this.editorConfig.readonly}`);
|
|
171
|
-
}
|
|
172
|
-
input.style.resize = 'none';
|
|
173
|
-
input.style.position = 'absolute';
|
|
174
|
-
input.style.padding = '4px';
|
|
175
|
-
input.style.width = '100%';
|
|
176
|
-
input.style.height = '100%';
|
|
177
|
-
input.style.boxSizing = 'border-box';
|
|
178
|
-
this.element = input;
|
|
179
|
-
this.container.appendChild(input);
|
|
180
|
-
input.addEventListener('keydown', (e) => {
|
|
181
|
-
const _isSelectAll = e.key === 'a' && (e.ctrlKey || e.metaKey);
|
|
182
|
-
const _isTextAreaNewLine = e.key === 'Enter' && e.shiftKey;
|
|
183
|
-
if (_isSelectAll || _isTextAreaNewLine) {
|
|
184
|
-
e.stopPropagation();
|
|
185
|
-
}
|
|
186
|
-
});
|
|
187
|
-
}
|
|
188
|
-
setValue(value) {
|
|
189
|
-
this.element.value = typeof value !== 'undefined' ? value : '';
|
|
190
|
-
}
|
|
191
|
-
getValue() {
|
|
192
|
-
return this.element.value;
|
|
193
|
-
}
|
|
194
|
-
onStart({ value, referencePosition, container, endEdit }) {
|
|
195
|
-
this.container = container;
|
|
196
|
-
this.successCallback = endEdit;
|
|
197
|
-
if (!this.element) {
|
|
198
|
-
this.createElement();
|
|
199
|
-
if (value !== undefined && value !== null) {
|
|
200
|
-
this.setValue(value);
|
|
201
|
-
}
|
|
202
|
-
if (referencePosition?.rect) {
|
|
203
|
-
this.adjustPosition(referencePosition.rect);
|
|
204
|
-
}
|
|
205
|
-
}
|
|
206
|
-
this.element.focus();
|
|
207
|
-
}
|
|
208
|
-
adjustPosition(rect) {
|
|
209
|
-
this.element.style.top = rect.top + 'px';
|
|
210
|
-
this.element.style.left = rect.left + 'px';
|
|
211
|
-
this.element.style.width = rect.width + 'px';
|
|
212
|
-
this.element.style.height = rect.height + 'px';
|
|
213
|
-
}
|
|
214
|
-
endEditing() {
|
|
215
|
-
}
|
|
216
|
-
onEnd() {
|
|
217
|
-
this.container.removeChild(this.element);
|
|
218
|
-
this.element = undefined;
|
|
219
|
-
}
|
|
220
|
-
isEditorElement(target) {
|
|
221
|
-
return target === this.element;
|
|
222
|
-
}
|
|
223
|
-
}
|
|
224
|
-
|
|
225
155
|
exports.Placement = void 0;
|
|
226
156
|
(function (Placement) {
|
|
227
157
|
Placement["top"] = "top";
|
|
@@ -233,6 +163,5 @@
|
|
|
233
163
|
exports.DateInputEditor = DateInputEditor;
|
|
234
164
|
exports.InputEditor = InputEditor;
|
|
235
165
|
exports.ListEditor = ListEditor;
|
|
236
|
-
exports.TextAreaEditor = TextAreaEditor;
|
|
237
166
|
|
|
238
167
|
}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).VTable=e.VTable||{},e.VTable.editors={}))}(this,(function(e){"use strict";class t{editorType="Input";editorConfig;container;successCallback;element;constructor(e){this.editorConfig=e}createElement(){const e=document.createElement("input");e.setAttribute("type","text"),
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).VTable=e.VTable||{},e.VTable.editors={}))}(this,(function(e){"use strict";class t{editorType="Input";editorConfig;container;successCallback;element;constructor(e){this.editorConfig=e}createElement(){const e=document.createElement("input");e.setAttribute("type","text"),e.style.position="absolute",e.style.padding="4px",e.style.width="100%",e.style.boxSizing="border-box",this.element=e,this.container.appendChild(e),e.addEventListener("keydown",(e=>{"a"===e.key&&(e.ctrlKey||e.metaKey)&&e.stopPropagation()}))}setValue(e){this.element.value=void 0!==e?e:""}getValue(){return this.element.value}onStart({value:e,referencePosition:t,container:i,endEdit:n}){this.container=i,this.successCallback=n,this.element||(this.createElement(),null!=e&&this.setValue(e),t?.rect&&this.adjustPosition(t.rect)),this.element.focus()}adjustPosition(e){this.element.style.top=e.top+"px",this.element.style.left=e.left+"px",this.element.style.width=e.width+"px",this.element.style.height=e.height+"px"}endEditing(){}onEnd(){this.container.removeChild(this.element),this.element=void 0}isEditorElement(e){return e===this.element}}var i;e.Placement=void 0,(i=e.Placement||(e.Placement={})).top="top",i.bottom="bottom",i.left="left",i.right="right",e.DateInputEditor=class extends t{editorType="DateInput";constructor(e){super(e),this.editorConfig=e}createElement(){const e=document.createElement("input");e.setAttribute("type","date"),e.style.padding="4px",e.style.width="100%",e.style.boxSizing="border-box",e.style.position="absolute",this.element=e,this.container.appendChild(e),e.addEventListener("keydown",(e=>{"a"===e.key&&(e.ctrlKey||e.metaKey)&&e.stopPropagation()}))}},e.InputEditor=t,e.ListEditor=class{editorType="Input";input;editorConfig;container;element;successCallback;constructor(e){this.editorConfig=e}createElement(e){const t=document.createElement("select");t.setAttribute("type","text"),t.style.position="absolute",t.style.padding="4px",t.style.width="100%",t.style.boxSizing="border-box",this.element=t;const{values:i}=this.editorConfig;let n="";i.forEach((t=>{n+=t===e?`<option value=${t} selected>${t}</option>`:`<option value=${t} >${t}</option>`})),t.innerHTML=n,this.container.appendChild(t)}_bindSelectChangeEvent(){this.element.addEventListener("change",(()=>{}))}setValue(e){}getValue(){return this.element.value}onStart({container:e,value:t,referencePosition:i,endEdit:n}){this.container=e,this.successCallback=n,this.createElement(t),null!=t&&this.setValue(t),i?.rect&&this.adjustPosition(i.rect),this.element.focus()}adjustPosition(e){this.element.style.top=e.top+"px",this.element.style.left=e.left+"px",this.element.style.width=e.width+"px",this.element.style.height=e.height+"px"}endEditing(){}onEnd(){this.container.removeChild(this.element)}isEditorElement(e){return e===this.element}}}));
|
package/es/index.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { InputEditor } from './input-editor';
|
|
2
2
|
import { DateInputEditor } from './date-input-editor';
|
|
3
3
|
import { ListEditor } from './list-editor';
|
|
4
|
-
|
|
5
|
-
export { InputEditor, DateInputEditor, ListEditor, TextAreaEditor };
|
|
4
|
+
export { InputEditor, DateInputEditor, ListEditor };
|
|
6
5
|
export * from './types';
|
package/es/index.js
CHANGED
|
@@ -4,9 +4,7 @@ import { DateInputEditor } from "./date-input-editor";
|
|
|
4
4
|
|
|
5
5
|
import { ListEditor } from "./list-editor";
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
export { InputEditor, DateInputEditor, ListEditor, TextAreaEditor };
|
|
7
|
+
export { InputEditor, DateInputEditor, ListEditor };
|
|
10
8
|
|
|
11
9
|
export * from "./types";
|
|
12
10
|
//# sourceMappingURL=index.js.map
|
package/es/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,UAAU,EAAE,CAAC;AACpD,cAAc,SAAS,CAAC","file":"index.js","sourcesContent":["import { InputEditor } from './input-editor';\nimport { DateInputEditor } from './date-input-editor';\nimport { ListEditor } from './list-editor';\nexport { InputEditor, DateInputEditor, ListEditor };\nexport * from './types';\n"]}
|
package/es/input-editor.d.ts
CHANGED
package/es/input-editor.js
CHANGED
|
@@ -3,12 +3,10 @@ export class InputEditor {
|
|
|
3
3
|
this.editorType = "Input", this.editorConfig = editorConfig;
|
|
4
4
|
}
|
|
5
5
|
createElement() {
|
|
6
|
-
var _a;
|
|
7
6
|
const input = document.createElement("input");
|
|
8
|
-
input.setAttribute("type", "text"),
|
|
9
|
-
input.style.
|
|
10
|
-
|
|
11
|
-
input.addEventListener("keydown", (e => {
|
|
7
|
+
input.setAttribute("type", "text"), input.style.position = "absolute", input.style.padding = "4px",
|
|
8
|
+
input.style.width = "100%", input.style.boxSizing = "border-box", this.element = input,
|
|
9
|
+
this.container.appendChild(input), input.addEventListener("keydown", (e => {
|
|
12
10
|
"a" === e.key && (e.ctrlKey || e.metaKey) && e.stopPropagation();
|
|
13
11
|
}));
|
|
14
12
|
}
|
package/es/input-editor.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/input-editor.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../src/input-editor.ts"],"names":[],"mappings":"AAOA,MAAM,OAAO,WAAW;IAOtB,YAAY,YAAgC;QAN5C,eAAU,GAAW,OAAO,CAAC;QAO3B,IAAI,CAAC,YAAY,GAAG,YAAY,CAAC;IACnC,CAAC;IAED,aAAa;QACX,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC9C,KAAK,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QACnC,KAAK,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;QAClC,KAAK,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC;QAC5B,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC;QAC3B,KAAK,CAAC,KAAK,CAAC,SAAS,GAAG,YAAY,CAAC;QACrC,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QAErB,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAGlC,KAAK,CAAC,gBAAgB,CAAC,SAAS,EAAE,CAAC,CAAgB,EAAE,EAAE;YACrD,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,EAAE;gBAE7C,CAAC,CAAC,eAAe,EAAE,CAAC;aACrB;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAED,QAAQ,CAAC,KAAa;QACpB,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,OAAO,KAAK,KAAK,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;IACjE,CAAC;IAED,QAAQ;QACN,OAAO,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC;IAC5B,CAAC;IAED,OAAO,CAAC,EAAE,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,OAAO,EAAuB;QAC3E,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;QAC3B,IAAI,CAAC,eAAe,GAAG,OAAO,CAAC;QAC/B,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;YACjB,IAAI,CAAC,aAAa,EAAE,CAAC;YAErB,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,EAAE;gBACzC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;aACtB;YACD,IAAI,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,IAAI,EAAE;gBAC3B,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;aAC7C;SACF;QACD,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IAEvB,CAAC;IAED,cAAc,CAAC,IAAe;QAC5B,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;QACzC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QAC3C,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAC7C,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;IACjD,CAAC;IAED,UAAU;IAEV,CAAC;IAED,KAAK;QAEH,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACzC,IAAI,CAAC,OAAO,GAAG,SAAS,CAAC;IAC3B,CAAC;IAED,eAAe,CAAC,MAAmB;QACjC,OAAO,MAAM,KAAK,IAAI,CAAC,OAAO,CAAC;IACjC,CAAC;CACF","file":"input-editor.js","sourcesContent":["import type { EditContext, IEditor, Placement, RectProps } from './types';\n\nexport interface InputEditorConfig {\n max?: number;\n min?: number;\n}\n\nexport class InputEditor implements IEditor {\n editorType: string = 'Input';\n editorConfig: InputEditorConfig;\n container: HTMLElement;\n successCallback?: () => void;\n element?: HTMLInputElement;\n\n constructor(editorConfig?: InputEditorConfig) {\n this.editorConfig = editorConfig;\n }\n\n createElement() {\n const input = document.createElement('input');\n input.setAttribute('type', 'text');\n input.style.position = 'absolute';\n input.style.padding = '4px';\n input.style.width = '100%';\n input.style.boxSizing = 'border-box';\n this.element = input;\n\n this.container.appendChild(input);\n\n // 监听键盘事件\n input.addEventListener('keydown', (e: KeyboardEvent) => {\n if (e.key === 'a' && (e.ctrlKey || e.metaKey)) {\n // 阻止冒泡 防止处理成表格全选事件\n e.stopPropagation();\n }\n });\n }\n\n setValue(value: string) {\n this.element.value = typeof value !== 'undefined' ? value : '';\n }\n\n getValue() {\n return this.element.value;\n }\n\n onStart({ value, referencePosition, container, endEdit }: EditContext<string>) {\n this.container = container;\n this.successCallback = endEdit;\n if (!this.element) {\n this.createElement();\n\n if (value !== undefined && value !== null) {\n this.setValue(value);\n }\n if (referencePosition?.rect) {\n this.adjustPosition(referencePosition.rect);\n }\n }\n this.element.focus();\n // do nothing\n }\n\n adjustPosition(rect: RectProps) {\n this.element.style.top = rect.top + 'px';\n this.element.style.left = rect.left + 'px';\n this.element.style.width = rect.width + 'px';\n this.element.style.height = rect.height + 'px';\n }\n\n endEditing() {\n // do nothing\n }\n\n onEnd() {\n // do nothing\n this.container.removeChild(this.element);\n this.element = undefined;\n }\n\n isEditorElement(target: HTMLElement) {\n return target === this.element;\n }\n}\n"]}
|
package/package.json
CHANGED
package/cjs/textArea-editor.d.ts
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import type { EditContext, IEditor, RectProps } from './types';
|
|
2
|
-
export interface TextAreaEditorConfig {
|
|
3
|
-
readonly?: boolean;
|
|
4
|
-
}
|
|
5
|
-
export declare class TextAreaEditor implements IEditor {
|
|
6
|
-
editorType: string;
|
|
7
|
-
editorConfig: TextAreaEditorConfig;
|
|
8
|
-
container: HTMLElement;
|
|
9
|
-
successCallback?: () => void;
|
|
10
|
-
element?: HTMLTextAreaElement;
|
|
11
|
-
constructor(editorConfig?: TextAreaEditorConfig);
|
|
12
|
-
createElement(): void;
|
|
13
|
-
setValue(value: string): void;
|
|
14
|
-
getValue(): string;
|
|
15
|
-
onStart({ value, referencePosition, container, endEdit }: EditContext<string>): void;
|
|
16
|
-
adjustPosition(rect: RectProps): void;
|
|
17
|
-
endEditing(): void;
|
|
18
|
-
onEnd(): void;
|
|
19
|
-
isEditorElement(target: HTMLElement): boolean;
|
|
20
|
-
}
|
package/cjs/textArea-editor.js
DELETED
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: !0
|
|
5
|
-
}), exports.TextAreaEditor = void 0;
|
|
6
|
-
|
|
7
|
-
class TextAreaEditor {
|
|
8
|
-
constructor(editorConfig) {
|
|
9
|
-
this.editorType = "TextArea", this.editorConfig = editorConfig || {};
|
|
10
|
-
}
|
|
11
|
-
createElement() {
|
|
12
|
-
var _a;
|
|
13
|
-
const input = document.createElement("textArea");
|
|
14
|
-
(null === (_a = this.editorConfig) || void 0 === _a ? void 0 : _a.readonly) && input.setAttribute("readonly", `${this.editorConfig.readonly}`),
|
|
15
|
-
input.style.resize = "none", input.style.position = "absolute", input.style.padding = "4px",
|
|
16
|
-
input.style.width = "100%", input.style.height = "100%", input.style.boxSizing = "border-box",
|
|
17
|
-
this.element = input, this.container.appendChild(input), input.addEventListener("keydown", (e => {
|
|
18
|
-
const _isSelectAll = "a" === e.key && (e.ctrlKey || e.metaKey), _isTextAreaNewLine = "Enter" === e.key && e.shiftKey;
|
|
19
|
-
(_isSelectAll || _isTextAreaNewLine) && e.stopPropagation();
|
|
20
|
-
}));
|
|
21
|
-
}
|
|
22
|
-
setValue(value) {
|
|
23
|
-
this.element.value = void 0 !== value ? value : "";
|
|
24
|
-
}
|
|
25
|
-
getValue() {
|
|
26
|
-
return this.element.value;
|
|
27
|
-
}
|
|
28
|
-
onStart({value: value, referencePosition: referencePosition, container: container, endEdit: endEdit}) {
|
|
29
|
-
this.container = container, this.successCallback = endEdit, this.element || (this.createElement(),
|
|
30
|
-
null != value && this.setValue(value), (null == referencePosition ? void 0 : referencePosition.rect) && this.adjustPosition(referencePosition.rect)),
|
|
31
|
-
this.element.focus();
|
|
32
|
-
}
|
|
33
|
-
adjustPosition(rect) {
|
|
34
|
-
this.element.style.top = rect.top + "px", this.element.style.left = rect.left + "px",
|
|
35
|
-
this.element.style.width = rect.width + "px", this.element.style.height = rect.height + "px";
|
|
36
|
-
}
|
|
37
|
-
endEditing() {}
|
|
38
|
-
onEnd() {
|
|
39
|
-
this.container.removeChild(this.element), this.element = void 0;
|
|
40
|
-
}
|
|
41
|
-
isEditorElement(target) {
|
|
42
|
-
return target === this.element;
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
exports.TextAreaEditor = TextAreaEditor;
|
|
47
|
-
//# sourceMappingURL=textArea-editor.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/textArea-editor.ts"],"names":[],"mappings":"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","file":"textArea-editor.js","sourcesContent":["import type { EditContext, IEditor, RectProps } from './types';\n\nexport interface TextAreaEditorConfig {\n readonly?: boolean;\n}\n\nexport class TextAreaEditor implements IEditor {\n editorType: string = 'TextArea';\n editorConfig: TextAreaEditorConfig;\n container: HTMLElement;\n successCallback?: () => void;\n element?: HTMLTextAreaElement;\n\n constructor(editorConfig?: TextAreaEditorConfig) {\n this.editorConfig = editorConfig || {};\n }\n\n createElement() {\n const input = document.createElement('textArea') as HTMLTextAreaElement;\n if (this.editorConfig?.readonly) {\n input.setAttribute('readonly', `${this.editorConfig.readonly}`);\n }\n input.style.resize = 'none';\n input.style.position = 'absolute';\n input.style.padding = '4px';\n input.style.width = '100%';\n input.style.height = '100%';\n input.style.boxSizing = 'border-box';\n this.element = input;\n\n this.container.appendChild(input);\n\n // 监听键盘事件\n input.addEventListener('keydown', (e: KeyboardEvent) => {\n const _isSelectAll = e.key === 'a' && (e.ctrlKey || e.metaKey);\n const _isTextAreaNewLine = e.key === 'Enter' && e.shiftKey;\n if (_isSelectAll || _isTextAreaNewLine) {\n // 阻止冒泡 防止处理成表格全选事件\n e.stopPropagation();\n }\n });\n }\n\n setValue(value: string) {\n this.element.value = typeof value !== 'undefined' ? value : '';\n }\n\n getValue() {\n return this.element.value;\n }\n\n onStart({ value, referencePosition, container, endEdit }: EditContext<string>) {\n this.container = container;\n this.successCallback = endEdit;\n if (!this.element) {\n this.createElement();\n\n if (value !== undefined && value !== null) {\n this.setValue(value);\n }\n if (referencePosition?.rect) {\n this.adjustPosition(referencePosition.rect);\n }\n }\n this.element.focus();\n // do nothing\n }\n\n adjustPosition(rect: RectProps) {\n this.element.style.top = rect.top + 'px';\n this.element.style.left = rect.left + 'px';\n this.element.style.width = rect.width + 'px';\n this.element.style.height = rect.height + 'px';\n }\n\n endEditing() {\n // do nothing\n }\n\n onEnd() {\n // do nothing\n this.container.removeChild(this.element);\n this.element = undefined;\n }\n\n isEditorElement(target: HTMLElement) {\n return target === this.element;\n }\n}\n"]}
|
package/es/textArea-editor.d.ts
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import type { EditContext, IEditor, RectProps } from './types';
|
|
2
|
-
export interface TextAreaEditorConfig {
|
|
3
|
-
readonly?: boolean;
|
|
4
|
-
}
|
|
5
|
-
export declare class TextAreaEditor implements IEditor {
|
|
6
|
-
editorType: string;
|
|
7
|
-
editorConfig: TextAreaEditorConfig;
|
|
8
|
-
container: HTMLElement;
|
|
9
|
-
successCallback?: () => void;
|
|
10
|
-
element?: HTMLTextAreaElement;
|
|
11
|
-
constructor(editorConfig?: TextAreaEditorConfig);
|
|
12
|
-
createElement(): void;
|
|
13
|
-
setValue(value: string): void;
|
|
14
|
-
getValue(): string;
|
|
15
|
-
onStart({ value, referencePosition, container, endEdit }: EditContext<string>): void;
|
|
16
|
-
adjustPosition(rect: RectProps): void;
|
|
17
|
-
endEditing(): void;
|
|
18
|
-
onEnd(): void;
|
|
19
|
-
isEditorElement(target: HTMLElement): boolean;
|
|
20
|
-
}
|
package/es/textArea-editor.js
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
export class TextAreaEditor {
|
|
2
|
-
constructor(editorConfig) {
|
|
3
|
-
this.editorType = "TextArea", this.editorConfig = editorConfig || {};
|
|
4
|
-
}
|
|
5
|
-
createElement() {
|
|
6
|
-
var _a;
|
|
7
|
-
const input = document.createElement("textArea");
|
|
8
|
-
(null === (_a = this.editorConfig) || void 0 === _a ? void 0 : _a.readonly) && input.setAttribute("readonly", `${this.editorConfig.readonly}`),
|
|
9
|
-
input.style.resize = "none", input.style.position = "absolute", input.style.padding = "4px",
|
|
10
|
-
input.style.width = "100%", input.style.height = "100%", input.style.boxSizing = "border-box",
|
|
11
|
-
this.element = input, this.container.appendChild(input), input.addEventListener("keydown", (e => {
|
|
12
|
-
const _isSelectAll = "a" === e.key && (e.ctrlKey || e.metaKey), _isTextAreaNewLine = "Enter" === e.key && e.shiftKey;
|
|
13
|
-
(_isSelectAll || _isTextAreaNewLine) && e.stopPropagation();
|
|
14
|
-
}));
|
|
15
|
-
}
|
|
16
|
-
setValue(value) {
|
|
17
|
-
this.element.value = void 0 !== value ? value : "";
|
|
18
|
-
}
|
|
19
|
-
getValue() {
|
|
20
|
-
return this.element.value;
|
|
21
|
-
}
|
|
22
|
-
onStart({value: value, referencePosition: referencePosition, container: container, endEdit: endEdit}) {
|
|
23
|
-
this.container = container, this.successCallback = endEdit, this.element || (this.createElement(),
|
|
24
|
-
null != value && this.setValue(value), (null == referencePosition ? void 0 : referencePosition.rect) && this.adjustPosition(referencePosition.rect)),
|
|
25
|
-
this.element.focus();
|
|
26
|
-
}
|
|
27
|
-
adjustPosition(rect) {
|
|
28
|
-
this.element.style.top = rect.top + "px", this.element.style.left = rect.left + "px",
|
|
29
|
-
this.element.style.width = rect.width + "px", this.element.style.height = rect.height + "px";
|
|
30
|
-
}
|
|
31
|
-
endEditing() {}
|
|
32
|
-
onEnd() {
|
|
33
|
-
this.container.removeChild(this.element), this.element = void 0;
|
|
34
|
-
}
|
|
35
|
-
isEditorElement(target) {
|
|
36
|
-
return target === this.element;
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
//# sourceMappingURL=textArea-editor.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/textArea-editor.ts"],"names":[],"mappings":"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","file":"textArea-editor.js","sourcesContent":["import type { EditContext, IEditor, RectProps } from './types';\n\nexport interface TextAreaEditorConfig {\n readonly?: boolean;\n}\n\nexport class TextAreaEditor implements IEditor {\n editorType: string = 'TextArea';\n editorConfig: TextAreaEditorConfig;\n container: HTMLElement;\n successCallback?: () => void;\n element?: HTMLTextAreaElement;\n\n constructor(editorConfig?: TextAreaEditorConfig) {\n this.editorConfig = editorConfig || {};\n }\n\n createElement() {\n const input = document.createElement('textArea') as HTMLTextAreaElement;\n if (this.editorConfig?.readonly) {\n input.setAttribute('readonly', `${this.editorConfig.readonly}`);\n }\n input.style.resize = 'none';\n input.style.position = 'absolute';\n input.style.padding = '4px';\n input.style.width = '100%';\n input.style.height = '100%';\n input.style.boxSizing = 'border-box';\n this.element = input;\n\n this.container.appendChild(input);\n\n // 监听键盘事件\n input.addEventListener('keydown', (e: KeyboardEvent) => {\n const _isSelectAll = e.key === 'a' && (e.ctrlKey || e.metaKey);\n const _isTextAreaNewLine = e.key === 'Enter' && e.shiftKey;\n if (_isSelectAll || _isTextAreaNewLine) {\n // 阻止冒泡 防止处理成表格全选事件\n e.stopPropagation();\n }\n });\n }\n\n setValue(value: string) {\n this.element.value = typeof value !== 'undefined' ? value : '';\n }\n\n getValue() {\n return this.element.value;\n }\n\n onStart({ value, referencePosition, container, endEdit }: EditContext<string>) {\n this.container = container;\n this.successCallback = endEdit;\n if (!this.element) {\n this.createElement();\n\n if (value !== undefined && value !== null) {\n this.setValue(value);\n }\n if (referencePosition?.rect) {\n this.adjustPosition(referencePosition.rect);\n }\n }\n this.element.focus();\n // do nothing\n }\n\n adjustPosition(rect: RectProps) {\n this.element.style.top = rect.top + 'px';\n this.element.style.left = rect.left + 'px';\n this.element.style.width = rect.width + 'px';\n this.element.style.height = rect.height + 'px';\n }\n\n endEditing() {\n // do nothing\n }\n\n onEnd() {\n // do nothing\n this.container.removeChild(this.element);\n this.element = undefined;\n }\n\n isEditorElement(target: HTMLElement) {\n return target === this.element;\n }\n}\n"]}
|