@node-projects/web-component-designer 0.0.251 → 0.0.252

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 (82) hide show
  1. package/dist/elements/services/propertiesService/PropertyTabsService.js +1 -0
  2. package/dist/elements/services/propertiesService/services/CssProperties.json +39 -6
  3. package/dist/elements/services/propertiesService/services/CssPropertiesService.d.ts +2 -1
  4. package/dist/elements/services/propertiesService/services/CssPropertiesService.js +9 -0
  5. package/dist/elements/widgets/designerView/tools/DrawEllipsisTool.js +4 -0
  6. package/dist/elements/widgets/designerView/tools/DrawLineTool.js +4 -0
  7. package/dist/elements/widgets/designerView/tools/DrawPathTool.js +4 -0
  8. package/dist/elements/widgets/designerView/tools/DrawRectTool.js +4 -0
  9. package/dist/index.d.ts +0 -1
  10. package/package.json +4 -4
  11. package/dist/elements/services/dragDropService/ExternalDragDropService copy.d.ts +0 -6
  12. package/dist/elements/services/dragDropService/ExternalDragDropService copy.js +0 -28
  13. package/dist/elements/services/dragDropService/IExternalDragDropService copy.d.ts +0 -5
  14. package/dist/elements/services/dragDropService/IExternalDragDropService copy.js +0 -1
  15. package/dist/elements/services/htmlParserService/AbstractClassElementParserService.d.ts +0 -9
  16. package/dist/elements/services/htmlParserService/AbstractClassElementParserService.js +0 -46
  17. package/dist/elements/services/htmlParserService/BaseCustomWebcomponentParserService copy.d.ts +0 -11
  18. package/dist/elements/services/htmlParserService/BaseCustomWebcomponentParserService copy.js +0 -90
  19. package/dist/elements/services/propertiesService/DefaultEditorTypesService copy.d.ts +0 -6
  20. package/dist/elements/services/propertiesService/DefaultEditorTypesService copy.js +0 -64
  21. package/dist/elements/services/propertiesService/GridEditorTypesService.d.ts +0 -6
  22. package/dist/elements/services/propertiesService/GridEditorTypesService.js +0 -64
  23. package/dist/elements/services/propertiesService/propertyEditors/GridCellPropertyEditor.d.ts +0 -9
  24. package/dist/elements/services/propertiesService/propertyEditors/GridCellPropertyEditor.js +0 -16
  25. package/dist/elements/services/propertiesService/propertyEditors/JsonPropertyEditor copy.d.ts +0 -9
  26. package/dist/elements/services/propertiesService/propertyEditors/JsonPropertyEditor copy.js +0 -21
  27. package/dist/elements/services/undoService/transactionItems/AttributeChangeAction copy.d.ts +0 -15
  28. package/dist/elements/services/undoService/transactionItems/AttributeChangeAction copy.js +0 -70
  29. package/dist/elements/services/undoService/transactionItems/ContentChangeAction.d.ts +0 -13
  30. package/dist/elements/services/undoService/transactionItems/ContentChangeAction.js +0 -38
  31. package/dist/elements/services/undoService/transactionItems/CssStyleChangeAction copy.d.ts +0 -14
  32. package/dist/elements/services/undoService/transactionItems/CssStyleChangeAction copy.js +0 -44
  33. package/dist/elements/services/undoService/transactionItems/InsertChildAction copy.d.ts +0 -16
  34. package/dist/elements/services/undoService/transactionItems/InsertChildAction copy.js +0 -37
  35. package/dist/elements/services/undoService/transactionItems/StylesheetStyleChangeAction.d.ts +0 -17
  36. package/dist/elements/services/undoService/transactionItems/StylesheetStyleChangeAction.js +0 -28
  37. package/dist/elements/widgets/codeView/code-view-ace copy.d.ts +0 -24
  38. package/dist/elements/widgets/codeView/code-view-ace copy.js +0 -133
  39. package/dist/elements/widgets/codeView/code-view-code-mirror copy.d.ts +0 -25
  40. package/dist/elements/widgets/codeView/code-view-code-mirror copy.js +0 -106
  41. package/dist/elements/widgets/codeView/code-view-code-mirror-6.d.ts +0 -25
  42. package/dist/elements/widgets/codeView/code-view-code-mirror-6.js +0 -102
  43. package/dist/elements/widgets/codeView/code-view-jar.d.ts +0 -23
  44. package/dist/elements/widgets/codeView/code-view-jar.js +0 -121
  45. package/dist/elements/widgets/designerView/extensions/GridExtension.d.ts +0 -51
  46. package/dist/elements/widgets/designerView/extensions/GridExtension.js +0 -346
  47. package/dist/elements/widgets/designerView/extensions/GridExtensionProvider.d.ts +0 -11
  48. package/dist/elements/widgets/designerView/extensions/GridExtensionProvider.js +0 -22
  49. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension copy 2.d.ts +0 -51
  50. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension copy 2.js +0 -346
  51. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension copy.d.ts +0 -51
  52. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension copy.js +0 -346
  53. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension.d.ts +0 -16
  54. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension.js +0 -71
  55. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtensionProvider copy.d.ts +0 -10
  56. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtensionProvider copy.js +0 -22
  57. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtensionProvider.d.ts +0 -10
  58. package/dist/elements/widgets/designerView/extensions/grid/EditGridExtensionProvider.js +0 -18
  59. package/dist/elements/widgets/designerView/extensions/grid/GridExtension copy.d.ts +0 -51
  60. package/dist/elements/widgets/designerView/extensions/grid/GridExtension copy.js +0 -346
  61. package/dist/elements/widgets/designerView/extensions/grid/GridExtension.d.ts +0 -51
  62. package/dist/elements/widgets/designerView/extensions/grid/GridExtension.js +0 -346
  63. package/dist/elements/widgets/designerView/extensions/grid/GridExtensionProvider copy.d.ts +0 -11
  64. package/dist/elements/widgets/designerView/extensions/grid/GridExtensionProvider copy.js +0 -22
  65. package/dist/elements/widgets/designerView/extensions/grid/GridExtensionProvider.d.ts +0 -11
  66. package/dist/elements/widgets/designerView/extensions/grid/GridExtensionProvider.js +0 -22
  67. package/dist/elements/widgets/designerView/extensions/grid/NewEditGridExtensionProvider.d.ts +0 -10
  68. package/dist/elements/widgets/designerView/extensions/grid/NewEditGridExtensionProvider.js +0 -22
  69. package/dist/elements/widgets/designerView/extensions/grid/OldEditGridExtension.d.ts +0 -51
  70. package/dist/elements/widgets/designerView/extensions/grid/OldEditGridExtension.js +0 -346
  71. package/dist/elements/widgets/designerView/extensions/grid/OldEditGridExtensionProvider.d.ts +0 -10
  72. package/dist/elements/widgets/designerView/extensions/grid/OldEditGridExtensionProvider.js +0 -22
  73. package/dist/elements/widgets/designerView/extensions/logic/ApplyFirstExtensionProvider.d.ts +0 -12
  74. package/dist/elements/widgets/designerView/extensions/logic/ApplyFirstExtensionProvider.js +0 -17
  75. package/dist/elements/widgets/designerView/extensions/logic/DisplayGridExtensionProvider.d.ts +0 -11
  76. package/dist/elements/widgets/designerView/extensions/logic/DisplayGridExtensionProvider.js +0 -23
  77. package/dist/elements/widgets/designerView/extensions/logic/OrCombineContainerProvider.d.ts +0 -12
  78. package/dist/elements/widgets/designerView/extensions/logic/OrCombineContainerProvider.js +0 -17
  79. package/dist/interfaces/ICommandHandler.d.ts +0 -5
  80. package/dist/interfaces/ICommandHandler.js +0 -1
  81. package/dist/polyfill/mobileDragDrop.d.ts +0 -2
  82. package/dist/polyfill/mobileDragDrop.js +0 -32
@@ -1,15 +0,0 @@
1
- import { ITransactionItem } from '../ITransactionItem.js';
2
- import { IDesignItem } from '../../../item/IDesignItem.js';
3
- import { IBinding } from '../../../item/IBinding.js';
4
- export declare class AttributeChangeAction implements ITransactionItem {
5
- constructor(designItem: IDesignItem, name: string, newValue: string | IBinding | null, oldValue: string | IBinding | null);
6
- title?: string;
7
- get affectedItems(): IDesignItem[];
8
- undo(): void;
9
- do(): void;
10
- designItem: IDesignItem;
11
- name: string;
12
- newValue: any;
13
- oldValue: any;
14
- mergeWith(other: ITransactionItem): boolean;
15
- }
@@ -1,70 +0,0 @@
1
- export class AttributeChangeAction {
2
- constructor(designItem, name, newValue, oldValue) {
3
- this.title = "Change Attribute " + name + " of <" + designItem.name + ">";
4
- this.designItem = designItem;
5
- this.name = name;
6
- this.newValue = newValue;
7
- this.oldValue = oldValue;
8
- }
9
- title;
10
- get affectedItems() {
11
- return [this.designItem];
12
- }
13
- undo() {
14
- if (this.oldValue == null) {
15
- this.designItem._withoutUndoRemoveAttribute(this.name);
16
- try {
17
- this.designItem.element.removeAttribute(this.name);
18
- }
19
- catch (e) {
20
- console.warn(e);
21
- }
22
- }
23
- else {
24
- this.designItem._withoutUndoSetAttribute(this.name, this.oldValue);
25
- if (this.name != "draggable") {
26
- try {
27
- if (typeof this.oldValue === 'string')
28
- this.designItem.element.setAttribute(this.name, this.oldValue);
29
- }
30
- catch (e) {
31
- console.warn(e);
32
- }
33
- }
34
- }
35
- }
36
- do() {
37
- if (this.newValue == null) {
38
- this.designItem._withoutUndoRemoveAttribute(this.name);
39
- try {
40
- this.designItem.element.removeAttribute(this.name);
41
- }
42
- catch (e) {
43
- console.warn(e);
44
- }
45
- }
46
- else {
47
- this.designItem._withoutUndoSetAttribute(this.name, this.newValue);
48
- if (this.name != "draggable") {
49
- try {
50
- if (typeof this.newValue === 'string')
51
- this.designItem.element.setAttribute(this.name, this.newValue);
52
- }
53
- catch (e) {
54
- console.warn(e);
55
- }
56
- }
57
- }
58
- }
59
- designItem;
60
- name;
61
- newValue;
62
- oldValue;
63
- mergeWith(other) {
64
- if (other instanceof AttributeChangeAction && this.designItem === other.designItem && this.name === other.name) {
65
- this.newValue = other.newValue;
66
- return true;
67
- }
68
- return false;
69
- }
70
- }
@@ -1,13 +0,0 @@
1
- import { ITransactionItem } from '../ITransactionItem.js';
2
- import { IDesignItem } from '../../../item/IDesignItem.js';
3
- export declare class ContentChangeAction implements ITransactionItem {
4
- constructor(designItem: IDesignItem, newValue: string);
5
- title?: string;
6
- get affectedItems(): IDesignItem[];
7
- undo(): void;
8
- do(): void;
9
- designItem: IDesignItem;
10
- newValue: any;
11
- oldValue: any;
12
- mergeWith(other: ITransactionItem): boolean;
13
- }
@@ -1,38 +0,0 @@
1
- import { NodeType } from '../../../item/NodeType.js';
2
- export class ContentChangeAction {
3
- constructor(designItem, newValue) {
4
- this.title = "Change Content of " + designItem.name + " to " + newValue;
5
- this.designItem = designItem;
6
- this.newValue = newValue;
7
- }
8
- title;
9
- get affectedItems() {
10
- return [this.designItem];
11
- }
12
- undo() {
13
- if (this.designItem.nodeType == NodeType.TextNode || this.designItem.nodeType == NodeType.Comment) {
14
- this.designItem.element.textContent = this.oldValue;
15
- }
16
- else {
17
- this.designItem.element.innerHTML = this.oldValue;
18
- }
19
- this.affectedItems[0].instanceServiceContainer.contentService.onContentChanged.emit({ changeType: 'edited', designItems: [this.designItem] });
20
- }
21
- do() {
22
- if (this.designItem.nodeType == NodeType.TextNode || this.designItem.nodeType == NodeType.Comment) {
23
- this.oldValue = this.designItem.element.textContent;
24
- this.designItem.element.textContent = this.newValue;
25
- }
26
- else {
27
- this.oldValue = this.designItem.element.innerHTML;
28
- this.designItem.element.innerHTML = this.newValue;
29
- }
30
- this.affectedItems[0].instanceServiceContainer.contentService.onContentChanged.emit({ changeType: 'edited', designItems: [this.designItem] });
31
- }
32
- designItem;
33
- newValue;
34
- oldValue;
35
- mergeWith(other) {
36
- return false;
37
- }
38
- }
@@ -1,14 +0,0 @@
1
- import { ITransactionItem } from '../ITransactionItem.js';
2
- import { IDesignItem } from '../../../item/IDesignItem.js';
3
- export declare class CssStyleChangeAction implements ITransactionItem {
4
- constructor(designItem: IDesignItem, name: string, newValue: any, oldValue: any);
5
- title?: string;
6
- get affectedItems(): IDesignItem[];
7
- undo(): void;
8
- do(): void;
9
- designItem: IDesignItem;
10
- name: string;
11
- newValue: any;
12
- oldValue: any;
13
- mergeWith(other: ITransactionItem): boolean;
14
- }
@@ -1,44 +0,0 @@
1
- export class CssStyleChangeAction {
2
- constructor(designItem, name, newValue, oldValue) {
3
- this.title = "Change Css Style " + name + " of <" + designItem.name + ">";
4
- this.designItem = designItem;
5
- this.name = name;
6
- this.newValue = newValue;
7
- this.oldValue = oldValue;
8
- }
9
- title;
10
- get affectedItems() {
11
- return [this.designItem];
12
- }
13
- undo() {
14
- if (this.oldValue === '' || this.oldValue == null) {
15
- this.designItem._withoutUndoRemoveStyle(this.name);
16
- this.designItem.element.style[this.name] = '';
17
- }
18
- else {
19
- this.designItem._withoutUndoSetStyle(this.name, this.oldValue);
20
- this.designItem.element.style[this.name] = this.oldValue;
21
- }
22
- }
23
- do() {
24
- if (this.newValue === '' || this.newValue == null) {
25
- this.designItem._withoutUndoRemoveStyle(this.name);
26
- this.designItem.element.style[this.name] = '';
27
- }
28
- else {
29
- this.designItem._withoutUndoSetStyle(this.name, this.newValue);
30
- this.designItem.element.style[this.name] = this.newValue;
31
- }
32
- }
33
- designItem;
34
- name;
35
- newValue;
36
- oldValue;
37
- mergeWith(other) {
38
- if (other instanceof CssStyleChangeAction && this.designItem === other.designItem && this.name === other.name) {
39
- this.newValue = other.newValue;
40
- return true;
41
- }
42
- return false;
43
- }
44
- }
@@ -1,16 +0,0 @@
1
- import { ITransactionItem } from '../ITransactionItem.js';
2
- import { IDesignItem } from '../../../item/IDesignItem.js';
3
- export declare class InsertChildAction implements ITransactionItem {
4
- constructor(designItem: IDesignItem, newParent: IDesignItem, newIndex: number);
5
- title?: string;
6
- get affectedItems(): IDesignItem[];
7
- undo(): void;
8
- do(): void;
9
- designItem: IDesignItem;
10
- newParent: IDesignItem;
11
- newIndex: number;
12
- oldParent: IDesignItem;
13
- oldIndex: number;
14
- newItem: IDesignItem;
15
- mergeWith(other: ITransactionItem): boolean;
16
- }
@@ -1,37 +0,0 @@
1
- export class InsertChildAction {
2
- constructor(designItem, newParent, newIndex) {
3
- this.title = "Move or Insert Item";
4
- this.designItem = designItem;
5
- this.newParent = newParent;
6
- this.newIndex = newIndex;
7
- }
8
- title;
9
- get affectedItems() {
10
- if (this.oldParent)
11
- return [this.designItem, this.newParent, this.oldParent];
12
- return [this.designItem, this.newParent];
13
- }
14
- undo() {
15
- if (this.oldParent)
16
- this.oldParent._insertChildInternal(this.designItem, this.oldIndex);
17
- else
18
- this.designItem.parent._removeChildInternal(this.designItem);
19
- this.affectedItems[0].instanceServiceContainer.contentService.onContentChanged.emit({ changeType: 'moved', designItems: [this.designItem] });
20
- }
21
- do() {
22
- this.oldParent = this.designItem.parent;
23
- if (this.oldParent)
24
- this.oldIndex = this.designItem.parent.indexOf(this.designItem);
25
- this.newParent._insertChildInternal(this.designItem, this.newIndex);
26
- this.affectedItems[0].instanceServiceContainer.contentService.onContentChanged.emit({ changeType: 'moved', designItems: [this.designItem] });
27
- }
28
- designItem;
29
- newParent;
30
- newIndex;
31
- oldParent;
32
- oldIndex;
33
- newItem;
34
- mergeWith(other) {
35
- return false;
36
- }
37
- }
@@ -1,17 +0,0 @@
1
- import { ITransactionItem } from '../ITransactionItem.js';
2
- import { IDesignItem } from '../../../item/IDesignItem.js';
3
- import { IStyleDeclaration, IStylesheetService } from '../../stylesheetService/IStylesheetService.js';
4
- export declare class StylesheetStyleChangeAction implements ITransactionItem {
5
- private stylesheetService;
6
- private declaration;
7
- constructor(stylesheetService: IStylesheetService, declaration: IStyleDeclaration, newValue: any, oldValue: any);
8
- title?: string;
9
- get affectedItems(): any[];
10
- undo(): void;
11
- do(): void;
12
- designItem: IDesignItem;
13
- name: string;
14
- newValue: any;
15
- oldValue: any;
16
- mergeWith(other: ITransactionItem): boolean;
17
- }
@@ -1,28 +0,0 @@
1
- export class StylesheetStyleChangeAction {
2
- stylesheetService;
3
- declaration;
4
- constructor(stylesheetService, declaration, newValue, oldValue) {
5
- this.title = "Change Css Style " + declaration.name + " to " + newValue;
6
- this.stylesheetService = stylesheetService;
7
- this.declaration = declaration;
8
- this.newValue = newValue;
9
- this.oldValue = oldValue;
10
- }
11
- title;
12
- get affectedItems() {
13
- return [];
14
- }
15
- undo() {
16
- this.stylesheetService.updateDeclarationValueWithoutUndo(this.declaration, this.oldValue, false);
17
- }
18
- do() {
19
- this.stylesheetService.updateDeclarationValueWithoutUndo(this.declaration, this.newValue, false);
20
- }
21
- designItem;
22
- name;
23
- newValue;
24
- oldValue;
25
- mergeWith(other) {
26
- return false;
27
- }
28
- }
@@ -1,24 +0,0 @@
1
- import { BaseCustomWebComponentLazyAppend, TypedEvent } from '@node-projects/base-custom-webcomponent';
2
- import { ICodeView } from './ICodeView.js';
3
- import { IStringPosition } from '../../services/htmlWriterService/IStringPosition.js';
4
- import { IUiCommand } from '../../../commandHandling/IUiCommand.js';
5
- import { IDisposable } from '../../../interfaces/IDisposable.js';
6
- export declare class CodeViewAce extends BaseCustomWebComponentLazyAppend implements ICodeView, IDisposable {
7
- canvasElement: HTMLElement;
8
- elementsToPackages: Map<string, string>;
9
- code: string;
10
- onTextChanged: TypedEvent<string>;
11
- private _aceEditor;
12
- private _editor;
13
- static readonly style: CSSStyleSheet;
14
- constructor();
15
- dispose(): void;
16
- executeCommand(command: IUiCommand): void;
17
- canExecuteCommand(command: IUiCommand): boolean;
18
- focusEditor(): void;
19
- oneTimeSetup(): void;
20
- ready(): void;
21
- update(code: any): void;
22
- getText(): string;
23
- setSelection(position: IStringPosition): void;
24
- }
@@ -1,133 +0,0 @@
1
- import { BaseCustomWebComponentLazyAppend, css, TypedEvent } from '@node-projects/base-custom-webcomponent';
2
- import { CommandType } from '../../../commandHandling/CommandType.js';
3
- class CodeViewAceCompleter {
4
- getCompletions(editor, session, pos, prefix, callback) {
5
- if (prefix.length === 0) {
6
- callback(null, []);
7
- return;
8
- }
9
- let wordList = ['t-t', 'visu-conveyor']; //TODO: get word list from custom elements
10
- {
11
- callback(null, wordList.map((w) => {
12
- return { name: w, value: w, score: 1, meta: "tag" };
13
- }));
14
- }
15
- }
16
- }
17
- export class CodeViewAce extends BaseCustomWebComponentLazyAppend {
18
- canvasElement;
19
- elementsToPackages;
20
- code;
21
- onTextChanged = new TypedEvent();
22
- _aceEditor;
23
- _editor;
24
- static style = css `
25
- :host {
26
- display: block;
27
- height: 100%;
28
- width: 100%;
29
- }
30
- `;
31
- constructor() {
32
- super();
33
- this.style.display = 'block';
34
- this._editor = document.createElement("div");
35
- this._editor.style.height = '100%';
36
- this._editor.style.width = '100%';
37
- this.shadowRoot.appendChild(this._editor);
38
- }
39
- dispose() {
40
- this._aceEditor.destroy();
41
- }
42
- executeCommand(command) {
43
- switch (command.type) {
44
- case CommandType.undo:
45
- this._aceEditor.execCommand('undo');
46
- break;
47
- case CommandType.redo:
48
- this._aceEditor.execCommand('redo');
49
- break;
50
- case CommandType.copy:
51
- let text = this._aceEditor.getCopyText();
52
- this._aceEditor.execCommand("copy");
53
- navigator.clipboard.writeText(text);
54
- break;
55
- case CommandType.paste:
56
- navigator.clipboard.readText().then(text => {
57
- this._aceEditor.execCommand("paste", text);
58
- });
59
- break;
60
- case CommandType.cut:
61
- text = this._aceEditor.getCopyText();
62
- this._aceEditor.execCommand("cut");
63
- navigator.clipboard.writeText(text);
64
- break;
65
- case CommandType.delete:
66
- this._aceEditor.execCommand("delete");
67
- break;
68
- }
69
- }
70
- canExecuteCommand(command) {
71
- switch (command.type) {
72
- case CommandType.undo:
73
- case CommandType.redo:
74
- case CommandType.copy:
75
- case CommandType.paste:
76
- case CommandType.cut:
77
- case CommandType.delete:
78
- return true;
79
- }
80
- return false;
81
- }
82
- focusEditor() {
83
- requestAnimationFrame(() => {
84
- this.focus();
85
- this._aceEditor.focus();
86
- });
87
- }
88
- oneTimeSetup() {
89
- //@ts-ignore
90
- let langTools = ace.require("ace/ext/language_tools");
91
- langTools.addCompleter(new CodeViewAceCompleter());
92
- }
93
- ready() {
94
- //@ts-ignore
95
- this._aceEditor = ace.edit(this._editor, {
96
- theme: "ace/theme/chrome",
97
- mode: "ace/mode/html",
98
- value: "",
99
- autoScrollEditorIntoView: true,
100
- fontSize: "14px",
101
- showPrintMargin: false,
102
- displayIndentGuides: true,
103
- enableBasicAutocompletion: true,
104
- enableSnippets: true,
105
- enableLiveAutocompletion: true
106
- });
107
- //own snippet completer: http://plnkr.co/edit/6MVntVmXYUbjR0DI82Cr?p=preview
108
- this._aceEditor.renderer.attachToShadowRoot();
109
- let observer = new MutationObserver((m) => {
110
- this._aceEditor.setAutoScrollEditorIntoView(false);
111
- this._aceEditor.setAutoScrollEditorIntoView(true);
112
- });
113
- let config = { attributes: true, childList: true, characterData: true };
114
- observer.observe(this.shadowRoot.querySelector('.ace_content'), config);
115
- this._aceEditor.on('change', () => this.onTextChanged.emit(this._aceEditor.getValue()));
116
- }
117
- update(code) {
118
- this._aceEditor.setValue(code);
119
- this._aceEditor.clearSelection();
120
- }
121
- getText() {
122
- return this._aceEditor.getValue();
123
- }
124
- setSelection(position) {
125
- let point1 = this._aceEditor.session.getDocument().indexToPosition(position.start, 0);
126
- let point2 = this._aceEditor.session.getDocument().indexToPosition(position.start + position.length, 0);
127
- //@ts-ignore
128
- this._aceEditor.selection.setRange({ start: point1, end: point2 });
129
- //@ts-ignore
130
- this._aceEditor.scrollToLine(point1.row);
131
- }
132
- }
133
- customElements.define('node-projects-code-view-ace', CodeViewAce);
@@ -1,25 +0,0 @@
1
- import { BaseCustomWebComponentLazyAppend } from '@node-projects/base-custom-webcomponent';
2
- import { ICodeView } from './ICodeView.js';
3
- import { IStringPosition } from '../../services/htmlWriterService/IStringPosition.js';
4
- import { IUiCommand } from '../../../commandHandling/IUiCommand.js';
5
- import { IDisposable } from '../../../interfaces/IDisposable.js';
6
- export declare class CodeViewCodeMirror extends BaseCustomWebComponentLazyAppend implements ICodeView, IDisposable {
7
- canvasElement: HTMLElement;
8
- elementsToPackages: Map<string, string>;
9
- code: string;
10
- onTextChanged: any;
11
- mode: string;
12
- private _codeMirrorEditor;
13
- private _editor;
14
- static readonly style: any;
15
- static readonly template: any;
16
- constructor();
17
- dispose(): void;
18
- executeCommand(command: IUiCommand): void;
19
- canExecuteCommand(command: IUiCommand): boolean;
20
- focusEditor(): void;
21
- ready(): void;
22
- update(code: any): void;
23
- getText(): string;
24
- setSelection(position: IStringPosition): void;
25
- }
@@ -1,106 +0,0 @@
1
- import { BaseCustomWebComponentLazyAppend, css, html, TypedEvent } from '@node-projects/base-custom-webcomponent';
2
- import { CommandType } from '../../../commandHandling/CommandType.js';
3
- export class CodeViewCodeMirror extends BaseCustomWebComponentLazyAppend {
4
- canvasElement;
5
- elementsToPackages;
6
- code;
7
- onTextChanged = new TypedEvent();
8
- mode = 'xml';
9
- _codeMirrorEditor;
10
- _editor;
11
- static style = css `
12
- :host {
13
- display: block;
14
- height: 100%;
15
- width: 100%;
16
- }`;
17
- static template = html `
18
- <div style="width: 100%; height: 100%; overflow: auto;">
19
- <div id="textarea"></div>
20
- </div>`;
21
- constructor() {
22
- super();
23
- this._restoreCachedInititalValues();
24
- import("codemirror/lib/codemirror.css", { with: { type: 'css' } }).then(x => this.shadowRoot.adoptedStyleSheets = [x.default, ...this.shadowRoot.adoptedStyleSheets]);
25
- import("codemirror/addon/fold/foldgutter.css", { with: { type: 'css' } }).then(x => this.shadowRoot.adoptedStyleSheets = [x.default, ...this.shadowRoot.adoptedStyleSheets]);
26
- this.style.display = 'block';
27
- this._editor = this._getDomElement('textarea');
28
- }
29
- dispose() {
30
- }
31
- executeCommand(command) {
32
- switch (command.type) {
33
- case CommandType.undo:
34
- this._codeMirrorEditor.undo();
35
- break;
36
- case CommandType.redo:
37
- this._codeMirrorEditor.redo();
38
- break;
39
- case CommandType.copy:
40
- const text = this._codeMirrorEditor.getSelection();
41
- navigator.clipboard.writeText(text);
42
- break;
43
- case CommandType.paste:
44
- navigator.clipboard.readText().then(text => {
45
- this._codeMirrorEditor.replaceSelection(text);
46
- });
47
- break;
48
- case CommandType.cut:
49
- const textc = this._codeMirrorEditor.getSelection();
50
- navigator.clipboard.writeText(textc);
51
- this._codeMirrorEditor.replaceSelection('');
52
- break;
53
- case CommandType.delete:
54
- this._codeMirrorEditor.replaceSelection('');
55
- break;
56
- }
57
- }
58
- canExecuteCommand(command) {
59
- switch (command.type) {
60
- case CommandType.undo:
61
- case CommandType.redo:
62
- case CommandType.copy:
63
- case CommandType.paste:
64
- case CommandType.cut:
65
- case CommandType.delete:
66
- return true;
67
- }
68
- return false;
69
- }
70
- focusEditor() {
71
- requestAnimationFrame(() => {
72
- this.focus();
73
- this._codeMirrorEditor.focus();
74
- });
75
- }
76
- ready() {
77
- const config = {
78
- tabSize: 3,
79
- lineNumbers: true,
80
- mode: this.mode,
81
- //@ts-ignore
82
- htmlMode: true,
83
- lineWrapping: true,
84
- //@ts-ignore
85
- extraKeys: { "Ctrl-Q": function (cm) { cm.foldCode(cm.getCursor()); } },
86
- foldGutter: true,
87
- gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"]
88
- };
89
- //@ts-ignore
90
- this._codeMirrorEditor = CodeMirror(this._editor, config);
91
- this._codeMirrorEditor.setSize('100%', '100%');
92
- this._codeMirrorEditor.on('change', () => this.onTextChanged.emit(this._codeMirrorEditor.getValue()));
93
- }
94
- update(code) {
95
- this._codeMirrorEditor.setValue(code);
96
- }
97
- getText() {
98
- return this._codeMirrorEditor.getValue();
99
- }
100
- setSelection(position) {
101
- let point1 = this._codeMirrorEditor.posFromIndex(position.start);
102
- let point2 = this._codeMirrorEditor.posFromIndex(position.start + position.length);
103
- this._codeMirrorEditor.setSelection(point1, point2);
104
- }
105
- }
106
- customElements.define('node-projects-code-view-code-mirror', CodeViewCodeMirror);
@@ -1,25 +0,0 @@
1
- import { BaseCustomWebComponentLazyAppend, TypedEvent } from '@node-projects/base-custom-webcomponent';
2
- import { ICodeView } from './ICodeView.js';
3
- import { IStringPosition } from '../../services/htmlWriterService/IStringPosition.js';
4
- import { IUiCommand } from '../../../commandHandling/IUiCommand.js';
5
- import { IDisposable } from '../../../interfaces/IDisposable.js';
6
- export declare class CodeViewCodeMirror6 extends BaseCustomWebComponentLazyAppend implements ICodeView, IDisposable {
7
- canvasElement: HTMLElement;
8
- elementsToPackages: Map<string, string>;
9
- code: string;
10
- onTextChanged: TypedEvent<string>;
11
- mode: string;
12
- private _editor;
13
- static readonly style: CSSStyleSheet;
14
- static readonly template: HTMLTemplateElement;
15
- private _cm;
16
- constructor();
17
- ready(): void;
18
- dispose(): void;
19
- executeCommand(command: IUiCommand): Promise<void>;
20
- canExecuteCommand(command: IUiCommand): boolean;
21
- focusEditor(): void;
22
- update(code: any): void;
23
- getText(): string;
24
- setSelection(position: IStringPosition): void;
25
- }