@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.
- package/dist/elements/services/propertiesService/PropertyTabsService.js +1 -0
- package/dist/elements/services/propertiesService/services/CssProperties.json +39 -6
- package/dist/elements/services/propertiesService/services/CssPropertiesService.d.ts +2 -1
- package/dist/elements/services/propertiesService/services/CssPropertiesService.js +9 -0
- package/dist/elements/widgets/designerView/tools/DrawEllipsisTool.js +4 -0
- package/dist/elements/widgets/designerView/tools/DrawLineTool.js +4 -0
- package/dist/elements/widgets/designerView/tools/DrawPathTool.js +4 -0
- package/dist/elements/widgets/designerView/tools/DrawRectTool.js +4 -0
- package/dist/index.d.ts +0 -1
- package/package.json +4 -4
- package/dist/elements/services/dragDropService/ExternalDragDropService copy.d.ts +0 -6
- package/dist/elements/services/dragDropService/ExternalDragDropService copy.js +0 -28
- package/dist/elements/services/dragDropService/IExternalDragDropService copy.d.ts +0 -5
- package/dist/elements/services/dragDropService/IExternalDragDropService copy.js +0 -1
- package/dist/elements/services/htmlParserService/AbstractClassElementParserService.d.ts +0 -9
- package/dist/elements/services/htmlParserService/AbstractClassElementParserService.js +0 -46
- package/dist/elements/services/htmlParserService/BaseCustomWebcomponentParserService copy.d.ts +0 -11
- package/dist/elements/services/htmlParserService/BaseCustomWebcomponentParserService copy.js +0 -90
- package/dist/elements/services/propertiesService/DefaultEditorTypesService copy.d.ts +0 -6
- package/dist/elements/services/propertiesService/DefaultEditorTypesService copy.js +0 -64
- package/dist/elements/services/propertiesService/GridEditorTypesService.d.ts +0 -6
- package/dist/elements/services/propertiesService/GridEditorTypesService.js +0 -64
- package/dist/elements/services/propertiesService/propertyEditors/GridCellPropertyEditor.d.ts +0 -9
- package/dist/elements/services/propertiesService/propertyEditors/GridCellPropertyEditor.js +0 -16
- package/dist/elements/services/propertiesService/propertyEditors/JsonPropertyEditor copy.d.ts +0 -9
- package/dist/elements/services/propertiesService/propertyEditors/JsonPropertyEditor copy.js +0 -21
- package/dist/elements/services/undoService/transactionItems/AttributeChangeAction copy.d.ts +0 -15
- package/dist/elements/services/undoService/transactionItems/AttributeChangeAction copy.js +0 -70
- package/dist/elements/services/undoService/transactionItems/ContentChangeAction.d.ts +0 -13
- package/dist/elements/services/undoService/transactionItems/ContentChangeAction.js +0 -38
- package/dist/elements/services/undoService/transactionItems/CssStyleChangeAction copy.d.ts +0 -14
- package/dist/elements/services/undoService/transactionItems/CssStyleChangeAction copy.js +0 -44
- package/dist/elements/services/undoService/transactionItems/InsertChildAction copy.d.ts +0 -16
- package/dist/elements/services/undoService/transactionItems/InsertChildAction copy.js +0 -37
- package/dist/elements/services/undoService/transactionItems/StylesheetStyleChangeAction.d.ts +0 -17
- package/dist/elements/services/undoService/transactionItems/StylesheetStyleChangeAction.js +0 -28
- package/dist/elements/widgets/codeView/code-view-ace copy.d.ts +0 -24
- package/dist/elements/widgets/codeView/code-view-ace copy.js +0 -133
- package/dist/elements/widgets/codeView/code-view-code-mirror copy.d.ts +0 -25
- package/dist/elements/widgets/codeView/code-view-code-mirror copy.js +0 -106
- package/dist/elements/widgets/codeView/code-view-code-mirror-6.d.ts +0 -25
- package/dist/elements/widgets/codeView/code-view-code-mirror-6.js +0 -102
- package/dist/elements/widgets/codeView/code-view-jar.d.ts +0 -23
- package/dist/elements/widgets/codeView/code-view-jar.js +0 -121
- package/dist/elements/widgets/designerView/extensions/GridExtension.d.ts +0 -51
- package/dist/elements/widgets/designerView/extensions/GridExtension.js +0 -346
- package/dist/elements/widgets/designerView/extensions/GridExtensionProvider.d.ts +0 -11
- package/dist/elements/widgets/designerView/extensions/GridExtensionProvider.js +0 -22
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension copy 2.d.ts +0 -51
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension copy 2.js +0 -346
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension copy.d.ts +0 -51
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension copy.js +0 -346
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension.d.ts +0 -16
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtension.js +0 -71
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtensionProvider copy.d.ts +0 -10
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtensionProvider copy.js +0 -22
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtensionProvider.d.ts +0 -10
- package/dist/elements/widgets/designerView/extensions/grid/EditGridExtensionProvider.js +0 -18
- package/dist/elements/widgets/designerView/extensions/grid/GridExtension copy.d.ts +0 -51
- package/dist/elements/widgets/designerView/extensions/grid/GridExtension copy.js +0 -346
- package/dist/elements/widgets/designerView/extensions/grid/GridExtension.d.ts +0 -51
- package/dist/elements/widgets/designerView/extensions/grid/GridExtension.js +0 -346
- package/dist/elements/widgets/designerView/extensions/grid/GridExtensionProvider copy.d.ts +0 -11
- package/dist/elements/widgets/designerView/extensions/grid/GridExtensionProvider copy.js +0 -22
- package/dist/elements/widgets/designerView/extensions/grid/GridExtensionProvider.d.ts +0 -11
- package/dist/elements/widgets/designerView/extensions/grid/GridExtensionProvider.js +0 -22
- package/dist/elements/widgets/designerView/extensions/grid/NewEditGridExtensionProvider.d.ts +0 -10
- package/dist/elements/widgets/designerView/extensions/grid/NewEditGridExtensionProvider.js +0 -22
- package/dist/elements/widgets/designerView/extensions/grid/OldEditGridExtension.d.ts +0 -51
- package/dist/elements/widgets/designerView/extensions/grid/OldEditGridExtension.js +0 -346
- package/dist/elements/widgets/designerView/extensions/grid/OldEditGridExtensionProvider.d.ts +0 -10
- package/dist/elements/widgets/designerView/extensions/grid/OldEditGridExtensionProvider.js +0 -22
- package/dist/elements/widgets/designerView/extensions/logic/ApplyFirstExtensionProvider.d.ts +0 -12
- package/dist/elements/widgets/designerView/extensions/logic/ApplyFirstExtensionProvider.js +0 -17
- package/dist/elements/widgets/designerView/extensions/logic/DisplayGridExtensionProvider.d.ts +0 -11
- package/dist/elements/widgets/designerView/extensions/logic/DisplayGridExtensionProvider.js +0 -23
- package/dist/elements/widgets/designerView/extensions/logic/OrCombineContainerProvider.d.ts +0 -12
- package/dist/elements/widgets/designerView/extensions/logic/OrCombineContainerProvider.js +0 -17
- package/dist/interfaces/ICommandHandler.d.ts +0 -5
- package/dist/interfaces/ICommandHandler.js +0 -1
- package/dist/polyfill/mobileDragDrop.d.ts +0 -2
- 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
|
-
}
|
package/dist/elements/services/undoService/transactionItems/StylesheetStyleChangeAction.d.ts
DELETED
|
@@ -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
|
-
}
|