@openremote/or-rules 1.8.0-snapshot.20250725120000 → 1.8.0-snapshot.20250725123024

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 (73) hide show
  1. package/README.md +30 -30
  2. package/custom-elements.json +13 -13
  3. package/dist/umd/index.bundle.js +4744 -4744
  4. package/dist/umd/index.bundle.js.map +1 -1
  5. package/lib/flow-viewer/components/confirmation-dialog.js +24 -61
  6. package/lib/flow-viewer/components/connection-container.js +1 -35
  7. package/lib/flow-viewer/components/connection-line.js +28 -117
  8. package/lib/flow-viewer/components/context-menu.js +45 -140
  9. package/lib/flow-viewer/components/editor-workspace.js +20 -282
  10. package/lib/flow-viewer/components/flow-editor.js +47 -160
  11. package/lib/flow-viewer/components/flow-node-socket.js +31 -146
  12. package/lib/flow-viewer/components/flow-node.js +29 -192
  13. package/lib/flow-viewer/components/internal-picker.js +54 -271
  14. package/lib/flow-viewer/components/node-menu-item.js +32 -132
  15. package/lib/flow-viewer/components/node-panel.js +60 -104
  16. package/lib/flow-viewer/components/notification-dialog.js +23 -55
  17. package/lib/flow-viewer/components/popup-modal.js +54 -113
  18. package/lib/flow-viewer/components/rule-browser.js +30 -119
  19. package/lib/flow-viewer/components/selectable-element.js +1 -71
  20. package/lib/flow-viewer/components/selection-box.js +15 -119
  21. package/lib/flow-viewer/components/top-bar.js +49 -116
  22. package/lib/flow-viewer/components/workspace-contextmenu-options.js +5 -128
  23. package/lib/flow-viewer/components/writable-dropdown.js +5 -51
  24. package/lib/flow-viewer/converters/node-converter.js +1 -10
  25. package/lib/flow-viewer/flow-viewer.js +1 -19
  26. package/lib/flow-viewer/models/camera.js +1 -2
  27. package/lib/flow-viewer/models/context-menu-button.js +1 -2
  28. package/lib/flow-viewer/models/light-node-collection.js +1 -2
  29. package/lib/flow-viewer/models/status.js +1 -8
  30. package/lib/flow-viewer/node-structure/copy.machine.js +1 -34
  31. package/lib/flow-viewer/node-structure/identity.assigner.js +1 -10
  32. package/lib/flow-viewer/node-structure/identity.dom.link.js +1 -4
  33. package/lib/flow-viewer/node-structure/index.js +1 -5
  34. package/lib/flow-viewer/node-structure/socket.type.matcher.js +1 -50
  35. package/lib/flow-viewer/node-structure/utils.js +1 -109
  36. package/lib/flow-viewer/services/copy-paste-manager.js +1 -59
  37. package/lib/flow-viewer/services/exporter.js +1 -67
  38. package/lib/flow-viewer/services/input.js +1 -80
  39. package/lib/flow-viewer/services/integration.js +1 -27
  40. package/lib/flow-viewer/services/modal.js +8 -29
  41. package/lib/flow-viewer/services/project.js +1 -222
  42. package/lib/flow-viewer/services/shortcuts.js +1 -63
  43. package/lib/flow-viewer/styles/editor-workspace-style.js +53 -55
  44. package/lib/flow-viewer/styles/flow-node-style.js +93 -95
  45. package/lib/flow-viewer/styles/picker-styles.js +29 -31
  46. package/lib/flow-viewer/utils.js +1 -49
  47. package/lib/index.js +56 -953
  48. package/lib/json-viewer/forms/or-rule-form-alarm.js +18 -91
  49. package/lib/json-viewer/forms/or-rule-form-email-message.js +12 -51
  50. package/lib/json-viewer/forms/or-rule-form-localized.js +43 -269
  51. package/lib/json-viewer/forms/or-rule-form-push-notification.js +63 -152
  52. package/lib/json-viewer/forms/or-rule-form-webhook.js +101 -296
  53. package/lib/json-viewer/modals/or-rule-alarm-modal.js +17 -173
  54. package/lib/json-viewer/modals/or-rule-notification-modal.js +11 -196
  55. package/lib/json-viewer/modals/or-rule-radial-modal.js +17 -142
  56. package/lib/json-viewer/modals/or-rule-webhook-modal.js +8 -78
  57. package/lib/json-viewer/or-rule-action-alarm.js +5 -97
  58. package/lib/json-viewer/or-rule-action-attribute.js +33 -235
  59. package/lib/json-viewer/or-rule-action-notification.js +56 -465
  60. package/lib/json-viewer/or-rule-action-webhook.js +18 -49
  61. package/lib/json-viewer/or-rule-asset-query.js +126 -849
  62. package/lib/json-viewer/or-rule-condition.js +29 -216
  63. package/lib/json-viewer/or-rule-json-viewer.js +34 -393
  64. package/lib/json-viewer/or-rule-then-otherwise.js +113 -609
  65. package/lib/json-viewer/or-rule-trigger-query.js +57 -227
  66. package/lib/json-viewer/or-rule-when.js +126 -343
  67. package/lib/or-rule-group-viewer.js +12 -106
  68. package/lib/or-rule-text-viewer.js +22 -133
  69. package/lib/or-rule-tree.js +57 -601
  70. package/lib/or-rule-validity.js +62 -373
  71. package/lib/or-rule-viewer.js +81 -361
  72. package/lib/style.js +64 -89
  73. package/package.json +11 -11
@@ -1,71 +1 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- import { LitElement } from "lit";
8
- import { property } from "lit/decorators.js";
9
- import { input } from "./flow-editor";
10
- import { i18next, translate } from "@openremote/or-translate";
11
- export class SelectableElement extends translate(i18next)(LitElement) {
12
- constructor() {
13
- super(...arguments);
14
- this.isSelected = false;
15
- this.onSelected = (e) => {
16
- if (e === this) {
17
- this.isSelected = true;
18
- }
19
- };
20
- this.onDeselected = (e) => {
21
- if (e === this) {
22
- this.isSelected = false;
23
- }
24
- };
25
- this.handleSelection = (event) => {
26
- if (event.buttons === 1) {
27
- input.handleSelection(this);
28
- event.stopPropagation();
29
- }
30
- else if (event.buttons === 2) {
31
- input.handleSelection(this, true);
32
- }
33
- };
34
- }
35
- get selected() {
36
- return this.isSelected;
37
- }
38
- get handle() {
39
- return this.selectableHandle;
40
- }
41
- disconnectedCallback() {
42
- super.disconnectedCallback();
43
- if (this.selected) {
44
- input.selected.splice(input.selected.indexOf(this), 1);
45
- }
46
- this.isSelected = false;
47
- input.removeListener("selected", this.onSelected);
48
- input.removeListener("deselected", this.onDeselected);
49
- input.selectables.splice(input.selectables.indexOf(this), 1);
50
- }
51
- setHandle(element) {
52
- if (this.selectableHandle) {
53
- this.selectableHandle.removeEventListener("mousedown", this.handleSelection);
54
- }
55
- element.addEventListener("mousedown", this.handleSelection);
56
- this.selectableHandle = element;
57
- }
58
- firstUpdated() {
59
- this.setHandle(this);
60
- input.selectables.push(this);
61
- input.addListener("selected", this.onSelected);
62
- input.addListener("deselected", this.onDeselected);
63
- }
64
- }
65
- __decorate([
66
- property({ type: Boolean })
67
- ], SelectableElement.prototype, "isSelected", void 0);
68
- __decorate([
69
- property({ attribute: false })
70
- ], SelectableElement.prototype, "selectableHandle", void 0);
71
- //# sourceMappingURL=selectable-element.js.map
1
+ var __decorate=this&&this.__decorate||function(e,t,s,l){var i,o=arguments.length,c=o<3?t:null===l?l=Object.getOwnPropertyDescriptor(t,s):l;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)c=Reflect.decorate(e,t,s,l);else for(var d=e.length-1;d>=0;d--)(i=e[d])&&(c=(o<3?i(c):o>3?i(t,s,c):i(t,s))||c);return o>3&&c&&Object.defineProperty(t,s,c),c};import{LitElement as e}from"lit";import{property as t}from"lit/decorators.js";import{input as s}from"./flow-editor";import{i18next as l,translate as i}from"@openremote/or-translate";export class SelectableElement extends i(l)(e){constructor(){super(...arguments),this.isSelected=!1,this.onSelected=e=>{e===this&&(this.isSelected=!0)},this.onDeselected=e=>{e===this&&(this.isSelected=!1)},this.handleSelection=e=>{1===e.buttons?(s.handleSelection(this),e.stopPropagation()):2===e.buttons&&s.handleSelection(this,!0)}}get selected(){return this.isSelected}get handle(){return this.selectableHandle}disconnectedCallback(){super.disconnectedCallback(),this.selected&&s.selected.splice(s.selected.indexOf(this),1),this.isSelected=!1,s.removeListener("selected",this.onSelected),s.removeListener("deselected",this.onDeselected),s.selectables.splice(s.selectables.indexOf(this),1)}setHandle(e){this.selectableHandle&&this.selectableHandle.removeEventListener("mousedown",this.handleSelection),e.addEventListener("mousedown",this.handleSelection),this.selectableHandle=e}firstUpdated(){this.setHandle(this),s.selectables.push(this),s.addListener("selected",this.onSelected),s.addListener("deselected",this.onDeselected)}}__decorate([t({type:Boolean})],SelectableElement.prototype,"isSelected",void 0),__decorate([t({attribute:!1})],SelectableElement.prototype,"selectableHandle",void 0);
@@ -1,120 +1,16 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- import { LitElement, html, css } from "lit";
8
- import { customElement, property } from "lit/decorators.js";
9
- import { Utilities } from "../utils";
10
- import { input } from "./flow-editor";
11
- let SelectionBox = class SelectionBox extends LitElement {
12
- constructor() {
13
- super(...arguments);
14
- this.distanceTreshold = 20;
15
- this.isSelecting = false;
16
- this.selectionStartPosition = { x: 0, y: 0 };
17
- this.selectionBox = { x: 0, y: 0, width: 0, height: 0 };
18
- this.workspaceMouseDown = (e) => {
19
- if (e.buttons !== 1) {
20
- return;
21
- }
22
- this.selectionBox.x = e.offsetX;
23
- this.selectionBox.y = e.offsetY;
24
- this.selectionStartPosition.x = this.selectionBox.x;
25
- this.selectionStartPosition.y = this.selectionBox.y;
26
- window.addEventListener("mousemove", this.mouseMove);
27
- };
28
- this.mouseMove = (e) => {
29
- const width = e.pageX - this.workspace.clientRect.left - this.selectionStartPosition.x;
30
- const height = e.pageY - this.workspace.clientRect.top - this.selectionStartPosition.y;
31
- if (width < 0) {
32
- this.selectionBox.x = e.pageX - this.workspace.clientRect.left;
33
- this.selectionBox.width = Math.abs(this.selectionBox.x - this.selectionStartPosition.x);
34
- }
35
- else {
36
- this.selectionBox.x = this.selectionStartPosition.x;
37
- this.selectionBox.width = Math.abs(width);
38
- }
39
- if (height < 0) {
40
- this.selectionBox.y = e.pageY - this.workspace.clientRect.top;
41
- this.selectionBox.height = Math.abs(this.selectionBox.y - this.selectionStartPosition.y);
42
- }
43
- else {
44
- this.selectionBox.y = this.selectionStartPosition.y;
45
- this.selectionBox.height = Math.abs(height);
46
- }
47
- if (this.selectionBox.width + this.selectionBox.height > this.distanceTreshold) {
48
- this.isSelecting = true;
49
- }
50
- this.requestUpdate();
51
- };
52
- this.workspaceMouseUp = () => {
53
- window.removeEventListener("mousemove", this.mouseMove);
54
- if (this.isSelecting) {
55
- this.selectInBounds();
56
- this.isSelecting = false;
57
- }
58
- };
59
- }
60
- static get styles() {
61
- return css `
62
- svg{
63
- fill: none;
64
- overflow: visible;
65
- position: absolute;
66
- pointer-events: all;
67
- stroke-linejoin: round;
68
- transition: stroke-width 120ms;
69
- z-index: 1000;
70
- width: 100vw;
71
- height: 100vh;
72
- }
73
- rect{
74
- fill: var(--highlight-faded);
75
- outline: solid 1px var(--highlight);
76
- }`;
77
- }
78
- firstUpdated() {
79
- this.workspace.addEventListener("mousedown", this.workspaceMouseDown);
80
- window.addEventListener("mouseup", this.workspaceMouseUp);
81
- }
82
- render() {
83
- if (!this.isSelecting) {
84
- return html ``;
1
+ var __decorate=this&&this.__decorate||function(t,e,i,o){var s,n=arguments.length,c=n<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)c=Reflect.decorate(t,e,i,o);else for(var h=t.length-1;h>=0;h--)(s=t[h])&&(c=(n<3?s(c):n>3?s(e,i,c):s(e,i))||c);return n>3&&c&&Object.defineProperty(e,i,c),c};import{LitElement as t,html as e,css as i}from"lit";import{customElement as o,property as s}from"lit/decorators.js";import{Utilities as n}from"../utils";import{input as c}from"./flow-editor";let SelectionBox=class extends t{constructor(){super(...arguments),this.distanceTreshold=20,this.isSelecting=!1,this.selectionStartPosition={x:0,y:0},this.selectionBox={x:0,y:0,width:0,height:0},this.workspaceMouseDown=t=>{1===t.buttons&&(this.selectionBox.x=t.offsetX,this.selectionBox.y=t.offsetY,this.selectionStartPosition.x=this.selectionBox.x,this.selectionStartPosition.y=this.selectionBox.y,window.addEventListener("mousemove",this.mouseMove))},this.mouseMove=t=>{let e=t.pageX-this.workspace.clientRect.left-this.selectionStartPosition.x,i=t.pageY-this.workspace.clientRect.top-this.selectionStartPosition.y;e<0?(this.selectionBox.x=t.pageX-this.workspace.clientRect.left,this.selectionBox.width=Math.abs(this.selectionBox.x-this.selectionStartPosition.x)):(this.selectionBox.x=this.selectionStartPosition.x,this.selectionBox.width=Math.abs(e)),i<0?(this.selectionBox.y=t.pageY-this.workspace.clientRect.top,this.selectionBox.height=Math.abs(this.selectionBox.y-this.selectionStartPosition.y)):(this.selectionBox.y=this.selectionStartPosition.y,this.selectionBox.height=Math.abs(i)),this.selectionBox.width+this.selectionBox.height>this.distanceTreshold&&(this.isSelecting=!0),this.requestUpdate()},this.workspaceMouseUp=()=>{window.removeEventListener("mousemove",this.mouseMove),this.isSelecting&&(this.selectInBounds(),this.isSelecting=!1)}}static get styles(){return i`
2
+ svg{
3
+ fill: none;
4
+ overflow: visible;
5
+ position: absolute;
6
+ pointer-events: all;
7
+ stroke-linejoin: round;
8
+ transition: stroke-width 120ms;
9
+ z-index: 1000;
10
+ width: 100vw;
11
+ height: 100vh;
85
12
  }
86
- return html `<svg><rect x="${this.selectionBox.x}px" y="${this.selectionBox.y}px" width="${this.selectionBox.width}px" height="${this.selectionBox.height}px"></rect></svg>`;
87
- }
88
- selectInBounds() {
89
- input.clearSelection();
90
- const offsetBox = {
91
- x: this.selectionBox.x + this.workspace.clientRect.left,
92
- y: this.selectionBox.y + this.workspace.clientRect.top,
93
- width: this.selectionBox.width,
94
- height: this.selectionBox.height,
95
- };
96
- for (const selectable of input.selectables) {
97
- const rect = selectable.handle.getBoundingClientRect();
98
- if (Utilities.isBoxInsideBox({ x: rect.left, y: rect.top, width: rect.width, height: rect.height }, offsetBox)) {
99
- input.select(selectable, true);
100
- }
101
- }
102
- }
103
- };
104
- __decorate([
105
- property({ attribute: false })
106
- ], SelectionBox.prototype, "workspace", void 0);
107
- __decorate([
108
- property({ attribute: false })
109
- ], SelectionBox.prototype, "isSelecting", void 0);
110
- __decorate([
111
- property({ attribute: false })
112
- ], SelectionBox.prototype, "selectionStartPosition", void 0);
113
- __decorate([
114
- property({ attribute: false })
115
- ], SelectionBox.prototype, "selectionBox", void 0);
116
- SelectionBox = __decorate([
117
- customElement("selection-box")
118
- ], SelectionBox);
119
- export { SelectionBox };
120
- //# sourceMappingURL=selection-box.js.map
13
+ rect{
14
+ fill: var(--highlight-faded);
15
+ outline: solid 1px var(--highlight);
16
+ }`}firstUpdated(){this.workspace.addEventListener("mousedown",this.workspaceMouseDown),window.addEventListener("mouseup",this.workspaceMouseUp)}render(){return this.isSelecting?e`<svg><rect x="${this.selectionBox.x}px" y="${this.selectionBox.y}px" width="${this.selectionBox.width}px" height="${this.selectionBox.height}px"></rect></svg>`:e``}selectInBounds(){c.clearSelection();let t={x:this.selectionBox.x+this.workspace.clientRect.left,y:this.selectionBox.y+this.workspace.clientRect.top,width:this.selectionBox.width,height:this.selectionBox.height};for(let e of c.selectables){let i=e.handle.getBoundingClientRect();n.isBoxInsideBox({x:i.left,y:i.top,width:i.width,height:i.height},t)&&c.select(e,!0)}}};__decorate([s({attribute:!1})],SelectionBox.prototype,"workspace",void 0),__decorate([s({attribute:!1})],SelectionBox.prototype,"isSelecting",void 0),__decorate([s({attribute:!1})],SelectionBox.prototype,"selectionStartPosition",void 0),__decorate([s({attribute:!1})],SelectionBox.prototype,"selectionBox",void 0),SelectionBox=__decorate([o("selection-box")],SelectionBox);export{SelectionBox};
@@ -1,118 +1,51 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- import { LitElement, html, css } from "lit";
8
- import { customElement, property } from "lit/decorators.js";
9
- import { InputType } from "@openremote/or-mwc-components/or-mwc-input";
10
- import { Utilities } from "../utils";
11
- import { i18next, translate } from "@openremote/or-translate";
12
- import { project, modal, exporter } from "./flow-editor";
13
- let TopBar = class TopBar extends translate(i18next)(LitElement) {
14
- static get styles() {
15
- return css `
16
- :host{
17
- display: flex;
18
- width: 100%;
19
- justify-content: flex-start;
20
- align-items: center;
21
- box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 5px -5px;
22
- line-height: var(--topbar-height);
23
- z-index: 150;
24
- }
25
- .button{
26
- padding: 0 25px 0 25px;
27
- cursor: pointer;
28
- }
29
- .button:hover{
30
- background: #fafafa;
31
- }
32
- .button:active{
33
- background: whitesmoke;
34
- }
35
- .debug.button{
36
- background: yellow;
37
- }
38
- .title{
39
- margin: 0 15px 0 15px;
40
- text-transform: uppercase;
41
- font-weight: bold;
42
- }
43
- .right{
44
- margin-left: auto;
45
- }`;
46
- }
47
- firstUpdated() {
48
- project.addListener("unsavedstateset", () => {
49
- this.requestUpdate();
50
- });
51
- }
52
- render() {
53
- return html `
54
- <span class="title">${i18next.t("flowEditor")}</span>
55
- <a class="button" @click="${() => {
56
- if (project.unsavedState) {
57
- modal.confirmation(() => { project.clear(true); }, "New project");
58
- }
59
- else {
60
- project.clear(true);
61
- }
62
- }}">New</a>
63
- <a class="button" @click="${this.save}">${i18next.t("save")} <i>${Utilities.ellipsis(project.existingFlowRuleName)}</i>${project.unsavedState && project.existingFlowRuleId !== -1 ? "*" : ""}</a>
64
- ${project.existingFlowRuleId === -1 ? null : html `<a @click="${this.showSaveAsDialog}" class="button">Save as...</a>`}
65
- <a class="button" @click="${this.showRuleBrowser}">Open</a>
66
- <a class="button right" @click="${() => {
67
- this.application.nodePanel.drawer.toggle();
68
- }}"><or-icon icon="menu"></or-icon></a>
69
- `;
70
- }
71
- save() {
72
- if (project.existingFlowRuleId === -1) {
73
- this.showSaveAsDialog();
1
+ var __decorate=this&&this.__decorate||function(e,t,o,i){var r,a=arguments.length,l=a<3?t:null===i?i=Object.getOwnPropertyDescriptor(t,o):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)l=Reflect.decorate(e,t,o,i);else for(var n=e.length-1;n>=0;n--)(r=e[n])&&(l=(a<3?r(l):a>3?r(t,o,l):r(t,o))||l);return a>3&&l&&Object.defineProperty(t,o,l),l};import{LitElement as e,html as t,css as o}from"lit";import{customElement as i,property as r}from"lit/decorators.js";import{InputType as a}from"@openremote/or-mwc-components/or-mwc-input";import{Utilities as l}from"../utils";import{i18next as n,translate as s}from"@openremote/or-translate";import{project as c,modal as p,exporter as u}from"./flow-editor";let TopBar=class extends s(n)(e){static get styles(){return o`
2
+ :host{
3
+ display: flex;
4
+ width: 100%;
5
+ justify-content: flex-start;
6
+ align-items: center;
7
+ box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 5px -5px;
8
+ line-height: var(--topbar-height);
9
+ z-index: 150;
74
10
  }
75
- else {
76
- exporter.exportAsExisting(project.existingFlowRuleId, project.toNodeCollection(project.existingFlowRuleName, project.existingFlowRuleDesc));
11
+ .button{
12
+ padding: 0 25px 0 25px;
13
+ cursor: pointer;
77
14
  }
78
- }
79
- showRuleBrowser() {
80
- modal.element.content = html `<rule-browser @ruleloaded="${() => modal.element.close()}"></rule-browser>`;
81
- modal.element.header = "Select a Flow rule";
82
- modal.element.open();
83
- }
84
- showSaveAsDialog() {
85
- let chosenName = "";
86
- let chosenDesc = "";
87
- modal.element.content = html `
88
- <div style="display: flex; flex-direction: column; width: auto; justify-content: space-between; align-items: stretch;">
89
- <or-mwc-input style="margin-bottom: 16px; width:100%;" required type="text" label="${i18next.t("name", "Name")}"
90
- @or-mwc-input-changed="${(e) => { chosenName = e.detail.value; }}"
91
- ></or-mwc-input>
92
- <or-mwc-input style="margin-bottom: 16px; width:100%;" fullwidth type="textarea" label="${i18next.t("description", "Description")}"
93
- @or-mwc-input-changed="${(e) => { chosenDesc = e.detail.value; }}"
94
- ></or-mwc-input>
95
- <div>
96
- <or-mwc-input style="text-align: left; margin-right: 10px" type="${InputType.BUTTON}" label="${i18next.t("cancel", "Cancel")}" @or-mwc-input-changed="${modal.element.close}"></or-mwc-input>
97
- <or-mwc-input style="text-align: right" type="${InputType.BUTTON}" unelevated label="${i18next.t("save", "Save")}" @or-mwc-input-changed="${() => {
98
- if (!chosenName) {
99
- return;
100
- }
101
- exporter.exportAsNew(project.toNodeCollection(chosenName, chosenDesc));
102
- modal.element.close();
103
- }}"></or-mwc-input>
104
- </div>
105
- </div>
106
- `;
107
- modal.element.header = "Save project";
108
- modal.element.open();
109
- }
110
- };
111
- __decorate([
112
- property({ attribute: false })
113
- ], TopBar.prototype, "application", void 0);
114
- TopBar = __decorate([
115
- customElement("top-bar")
116
- ], TopBar);
117
- export { TopBar };
118
- //# sourceMappingURL=top-bar.js.map
15
+ .button:hover{
16
+ background: #fafafa;
17
+ }
18
+ .button:active{
19
+ background: whitesmoke;
20
+ }
21
+ .debug.button{
22
+ background: yellow;
23
+ }
24
+ .title{
25
+ margin: 0 15px 0 15px;
26
+ text-transform: uppercase;
27
+ font-weight: bold;
28
+ }
29
+ .right{
30
+ margin-left: auto;
31
+ }`}firstUpdated(){c.addListener("unsavedstateset",()=>{this.requestUpdate()})}render(){return t`
32
+ <span class="title">${n.t("flowEditor")}</span>
33
+ <a class="button" @click="${()=>{c.unsavedState?p.confirmation(()=>{c.clear(!0)},"New project"):c.clear(!0)}}">New</a>
34
+ <a class="button" @click="${this.save}">${n.t("save")} <i>${l.ellipsis(c.existingFlowRuleName)}</i>${c.unsavedState&&-1!==c.existingFlowRuleId?"*":""}</a>
35
+ ${-1===c.existingFlowRuleId?null:t`<a @click="${this.showSaveAsDialog}" class="button">Save as...</a>`}
36
+ <a class="button" @click="${this.showRuleBrowser}">Open</a>
37
+ <a class="button right" @click="${()=>{this.application.nodePanel.drawer.toggle()}}"><or-icon icon="menu"></or-icon></a>
38
+ `}save(){-1===c.existingFlowRuleId?this.showSaveAsDialog():u.exportAsExisting(c.existingFlowRuleId,c.toNodeCollection(c.existingFlowRuleName,c.existingFlowRuleDesc))}showRuleBrowser(){p.element.content=t`<rule-browser @ruleloaded="${()=>p.element.close()}"></rule-browser>`,p.element.header="Select a Flow rule",p.element.open()}showSaveAsDialog(){let e="",o="";p.element.content=t`
39
+ <div style="display: flex; flex-direction: column; width: auto; justify-content: space-between; align-items: stretch;">
40
+ <or-mwc-input style="margin-bottom: 16px; width:100%;" required type="text" label="${n.t("name","Name")}"
41
+ @or-mwc-input-changed="${t=>{e=t.detail.value}}"
42
+ ></or-mwc-input>
43
+ <or-mwc-input style="margin-bottom: 16px; width:100%;" fullwidth type="textarea" label="${n.t("description","Description")}"
44
+ @or-mwc-input-changed="${e=>{o=e.detail.value}}"
45
+ ></or-mwc-input>
46
+ <div>
47
+ <or-mwc-input style="text-align: left; margin-right: 10px" type="${a.BUTTON}" label="${n.t("cancel","Cancel")}" @or-mwc-input-changed="${p.element.close}"></or-mwc-input>
48
+ <or-mwc-input style="text-align: right" type="${a.BUTTON}" unelevated label="${n.t("save","Save")}" @or-mwc-input-changed="${()=>{e&&(u.exportAsNew(c.toNodeCollection(e,o)),p.element.close())}}"></or-mwc-input>
49
+ </div>
50
+ </div>
51
+ `,p.element.header="Save project",p.element.open()}};__decorate([r({attribute:!1})],TopBar.prototype,"application",void 0),TopBar=__decorate([i("top-bar")],TopBar);export{TopBar};
@@ -1,128 +1,5 @@
1
- import { FlowNode } from "./flow-node";
2
- import { ConnectionLine } from "../flow-viewer";
3
- import { integration, project, copyPasteManager, input, exporter, modal } from "./flow-editor";
4
- import i18next from "i18next";
5
- import { Utilities } from "../utils";
6
- import { CopyMachine } from "../node-structure";
7
- import { ContextMenu } from "./context-menu";
8
- import { html } from "lit";
9
- export const createContextMenuButtons = (workspace, e) => {
10
- const selectedNodes = input.selected.filter((s) => s instanceof FlowNode && s.selected);
11
- const selectedConnections = input.selected.filter((s) => s instanceof ConnectionLine && s.selected);
12
- const createNodeButtons = (type) => {
13
- let nB = [
14
- {
15
- type: "button",
16
- label: "",
17
- icon: "arrow-left",
18
- action: () => { workspace.dispatchEvent(new MouseEvent("contextmenu", e)); }
19
- }
20
- ];
21
- nB = nB.concat(integration.nodes.filter((n) => n.type === type).map((node) => {
22
- const b = {
23
- type: "button",
24
- label: i18next.t("flow." + node.name, Utilities.humanLike(node.name)),
25
- action: () => {
26
- const copy = CopyMachine.copy(node);
27
- copy.position = workspace.offsetToWorld({ x: e.offsetX - workspace.offsetLeft, y: e.offsetY - workspace.offsetTop });
28
- project.createUndoSnapshot();
29
- project.addNode(copy);
30
- }
31
- };
32
- return b;
33
- }));
34
- return nB;
35
- };
36
- let buttons = [
37
- {
38
- type: "button",
39
- label: i18next.t("input", "Input"),
40
- icon: "arrow-collapse-right",
41
- action: () => { ContextMenu.open(e.pageX, e.pageY, workspace, createNodeButtons("INPUT" /* NodeType.INPUT */)); }
42
- },
43
- {
44
- type: "button",
45
- label: i18next.t("processors", "Processors"),
46
- icon: "cog",
47
- action: () => { ContextMenu.open(e.pageX, e.pageY, workspace, createNodeButtons("PROCESSOR" /* NodeType.PROCESSOR */)); }
48
- },
49
- {
50
- type: "button",
51
- label: i18next.t("output", "Output"),
52
- icon: "arrow-expand-right",
53
- action: () => { ContextMenu.open(e.pageX, e.pageY, workspace, createNodeButtons("OUTPUT" /* NodeType.OUTPUT */)); }
54
- },
55
- ];
56
- buttons = buttons.concat([
57
- { type: "separator" },
58
- {
59
- type: "button",
60
- icon: "content-copy",
61
- label: i18next.t("copy", "Copy"),
62
- action: () => {
63
- const pos = workspace.offsetToWorld({ x: e.offsetX, y: e.offsetY });
64
- copyPasteManager.copy(pos.x, pos.y);
65
- },
66
- disabled: selectedNodes.length === 0
67
- },
68
- {
69
- type: "button",
70
- icon: "content-paste",
71
- label: i18next.t("paste", "Paste"),
72
- action: () => {
73
- project.createUndoSnapshot();
74
- const pos = workspace.offsetToWorld({ x: e.offsetX, y: e.offsetY });
75
- project.notifyChange();
76
- workspace.pasteAt(pos.x, pos.y);
77
- },
78
- disabled: copyPasteManager.isFull
79
- },
80
- {
81
- type: "button",
82
- icon: "delete",
83
- label: i18next.t("delete", "Delete"),
84
- action: () => {
85
- project.createUndoSnapshot();
86
- selectedNodes.forEach((n) => {
87
- if (n.frozen) {
88
- return;
89
- }
90
- project.removeNode(n.node);
91
- });
92
- selectedConnections.forEach((n) => project.removeConnection(n.connection));
93
- project.notifyChange();
94
- },
95
- disabled: (selectedNodes.length === 0 && selectedConnections.length === 0) || (selectedNodes.length !== 0 && selectedNodes.every((n) => n.frozen))
96
- },
97
- { type: "separator" },
98
- {
99
- type: "button",
100
- icon: "fit-to-page-outline",
101
- label: i18next.t("fitViewToSelectedNodes", "Fit view to selected nodes"),
102
- action: () => workspace.fitCamera(selectedNodes.map((n) => n.node)),
103
- disabled: selectedNodes.length === 0
104
- },
105
- {
106
- type: "button",
107
- icon: "snowflake",
108
- label: "TOGGLE FROZEN [DEBUG FUNCTION]",
109
- action: () => selectedNodes.forEach((n) => n.frozen = !n.frozen),
110
- disabled: selectedNodes.length === 0
111
- },
112
- { type: "separator" },
113
- {
114
- type: "button",
115
- icon: "export",
116
- label: "Export to JSON",
117
- action: () => {
118
- modal.anything("Export result", html `
119
- <div style="user-select: all;font-family: monospace; padding: 5px; overflow: auto; background: whitesmoke; max-width:50vw; max-height:50vh">
120
- ${exporter.flowToJson(project.toNodeCollection("Exported on " + new Date(), ""))}
121
- </div>
122
- `);
123
- },
124
- },
125
- ]);
126
- return buttons;
127
- };
128
- //# sourceMappingURL=workspace-contextmenu-options.js.map
1
+ import{FlowNode as e}from"./flow-node";import{ConnectionLine as t}from"../flow-viewer";import{integration as o,project as n,copyPasteManager as a,input as l,exporter as i,modal as r}from"./flow-editor";import p from"i18next";import{Utilities as c}from"../utils";import{CopyMachine as s}from"../node-structure";import{ContextMenu as f}from"./context-menu";import{html as d}from"lit";export const createContextMenuButtons=(u,m)=>{let y=l.selected.filter(t=>t instanceof e&&t.selected),b=l.selected.filter(e=>e instanceof t&&e.selected),h=e=>{let t=[{type:"button",label:"",icon:"arrow-left",action:()=>{u.dispatchEvent(new MouseEvent("contextmenu",m))}}];return t.concat(o.nodes.filter(t=>t.type===e).map(e=>({type:"button",label:p.t("flow."+e.name,c.humanLike(e.name)),action:()=>{let t=s.copy(e);t.position=u.offsetToWorld({x:m.offsetX-u.offsetLeft,y:m.offsetY-u.offsetTop}),n.createUndoSnapshot(),n.addNode(t)}})))},g=[{type:"button",label:p.t("input","Input"),icon:"arrow-collapse-right",action:()=>{f.open(m.pageX,m.pageY,u,h("INPUT"))}},{type:"button",label:p.t("processors","Processors"),icon:"cog",action:()=>{f.open(m.pageX,m.pageY,u,h("PROCESSOR"))}},{type:"button",label:p.t("output","Output"),icon:"arrow-expand-right",action:()=>{f.open(m.pageX,m.pageY,u,h("OUTPUT"))}}];return g.concat([{type:"separator"},{type:"button",icon:"content-copy",label:p.t("copy","Copy"),action:()=>{let e=u.offsetToWorld({x:m.offsetX,y:m.offsetY});a.copy(e.x,e.y)},disabled:0===y.length},{type:"button",icon:"content-paste",label:p.t("paste","Paste"),action:()=>{n.createUndoSnapshot();let e=u.offsetToWorld({x:m.offsetX,y:m.offsetY});n.notifyChange(),u.pasteAt(e.x,e.y)},disabled:a.isFull},{type:"button",icon:"delete",label:p.t("delete","Delete"),action:()=>{n.createUndoSnapshot(),y.forEach(e=>{e.frozen||n.removeNode(e.node)}),b.forEach(e=>n.removeConnection(e.connection)),n.notifyChange()},disabled:0===y.length&&0===b.length||0!==y.length&&y.every(e=>e.frozen)},{type:"separator"},{type:"button",icon:"fit-to-page-outline",label:p.t("fitViewToSelectedNodes","Fit view to selected nodes"),action:()=>u.fitCamera(y.map(e=>e.node)),disabled:0===y.length},{type:"button",icon:"snowflake",label:"TOGGLE FROZEN [DEBUG FUNCTION]",action:()=>y.forEach(e=>e.frozen=!e.frozen),disabled:0===y.length},{type:"separator"},{type:"button",icon:"export",label:"Export to JSON",action:()=>{r.anything("Export result",d`
2
+ <div style="user-select: all;font-family: monospace; padding: 5px; overflow: auto; background: whitesmoke; max-width:50vw; max-height:50vh">
3
+ ${i.flowToJson(n.toNodeCollection("Exported on "+new Date,""))}
4
+ </div>
5
+ `)}}])};
@@ -1,51 +1,5 @@
1
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5
- return c > 3 && r && Object.defineProperty(target, key, r), r;
6
- };
7
- import { LitElement, html } from "lit";
8
- import { customElement, property, query } from "lit/decorators.js";
9
- import { PickerStyle } from "../styles/picker-styles";
10
- let WritableDropdown = class WritableDropdown extends LitElement {
11
- constructor() {
12
- super(...arguments);
13
- this.options = [];
14
- }
15
- static get styles() {
16
- return PickerStyle;
17
- }
18
- firstUpdated() {
19
- if (this.options.length > 0 && !this.value) {
20
- this.value = this.options[0].value;
21
- }
22
- this.selectElement.value = this.value;
23
- }
24
- shouldUpdate(_changedProperties) {
25
- if (this.selectElement && _changedProperties.has("value")) {
26
- this.selectElement.value = this.value;
27
- }
28
- return super.shouldUpdate(_changedProperties);
29
- }
30
- render() {
31
- return html `
32
- <select id="select-element" @change=${(e) => this.dispatchEvent(new Event("onchange", e))} @input=${(e) => { this.dispatchEvent(new InputEvent("oninput", e)); this.value = this.selectElement.value; }}>
33
- ${this.options.map((o) => html `<option value="${o.value}">${o.name}</option>`)}
34
- </select>
35
- `;
36
- }
37
- };
38
- __decorate([
39
- property({ type: Object, reflect: true })
40
- ], WritableDropdown.prototype, "value", void 0);
41
- __decorate([
42
- property({ type: Array })
43
- ], WritableDropdown.prototype, "options", void 0);
44
- __decorate([
45
- query("#select-element")
46
- ], WritableDropdown.prototype, "selectElement", void 0);
47
- WritableDropdown = __decorate([
48
- customElement("writable-dropdown")
49
- ], WritableDropdown);
50
- export { WritableDropdown };
51
- //# sourceMappingURL=writable-dropdown.js.map
1
+ var __decorate=this&&this.__decorate||function(e,t,o,r){var l,s=arguments.length,i=s<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,o):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,o,r);else for(var n=e.length-1;n>=0;n--)(l=e[n])&&(i=(s<3?l(i):s>3?l(t,o,i):l(t,o))||i);return s>3&&i&&Object.defineProperty(t,o,i),i};import{LitElement as e,html as t}from"lit";import{customElement as o,property as r,query as l}from"lit/decorators.js";import{PickerStyle as s}from"../styles/picker-styles";let WritableDropdown=class extends e{constructor(){super(...arguments),this.options=[]}static get styles(){return s}firstUpdated(){this.options.length>0&&!this.value&&(this.value=this.options[0].value),this.selectElement.value=this.value}shouldUpdate(e){return this.selectElement&&e.has("value")&&(this.selectElement.value=this.value),super.shouldUpdate(e)}render(){return t`
2
+ <select id="select-element" @change=${e=>this.dispatchEvent(new Event("onchange",e))} @input=${e=>{this.dispatchEvent(new InputEvent("oninput",e)),this.value=this.selectElement.value}}>
3
+ ${this.options.map(e=>t`<option value="${e.value}">${e.name}</option>`)}
4
+ </select>
5
+ `}};__decorate([r({type:Object,reflect:!0})],WritableDropdown.prototype,"value",void 0),__decorate([r({type:Array})],WritableDropdown.prototype,"options",void 0),__decorate([l("#select-element")],WritableDropdown.prototype,"selectElement",void 0),WritableDropdown=__decorate([o("writable-dropdown")],WritableDropdown);export{WritableDropdown};
@@ -1,10 +1 @@
1
- import { project } from "../components/flow-editor";
2
- export const nodeConverter = {
3
- fromAttribute: (value) => {
4
- return project.nodes.find((n) => n.id === value);
5
- },
6
- toAttribute: (node) => {
7
- return node.id;
8
- },
9
- };
10
- //# sourceMappingURL=node-converter.js.map
1
+ import{project as o}from"../components/flow-editor";export const nodeConverter={fromAttribute:t=>o.nodes.find(o=>o.id===t),toAttribute:o=>o.id};
@@ -1,19 +1 @@
1
- export { FlowEditor } from "./components/flow-editor";
2
- export { NodePanel } from "./components/node-panel";
3
- export { EditorWorkspace } from "./components/editor-workspace";
4
- export { TopBar } from "./components/top-bar";
5
- export { NodeMenuItem } from "./components/node-menu-item";
6
- export { SelectableElement } from "./components/selectable-element";
7
- export { FlowNode } from "./components/flow-node";
8
- export { FlowNodeSocket } from "./components/flow-node-socket";
9
- export { ConnectionLine } from "./components/connection-line";
10
- export { ConnectionContainer } from "./components/connection-container";
11
- export { SelectionBox } from "./components/selection-box";
12
- export { ContextMenu } from "./components/context-menu";
13
- export { InternalPicker } from "./components/internal-picker";
14
- export { PopupModal } from "./components/popup-modal";
15
- export { RuleBrowser } from "./components/rule-browser";
16
- export { WritableDropdown } from "./components/writable-dropdown";
17
- export { ConfirmationDialog } from "./components/confirmation-dialog";
18
- export { NotificationDialog } from "./components/notification-dialog";
19
- //# sourceMappingURL=flow-viewer.js.map
1
+ export{FlowEditor}from"./components/flow-editor";export{NodePanel}from"./components/node-panel";export{EditorWorkspace}from"./components/editor-workspace";export{TopBar}from"./components/top-bar";export{NodeMenuItem}from"./components/node-menu-item";export{SelectableElement}from"./components/selectable-element";export{FlowNode}from"./components/flow-node";export{FlowNodeSocket}from"./components/flow-node-socket";export{ConnectionLine}from"./components/connection-line";export{ConnectionContainer}from"./components/connection-container";export{SelectionBox}from"./components/selection-box";export{ContextMenu}from"./components/context-menu";export{InternalPicker}from"./components/internal-picker";export{PopupModal}from"./components/popup-modal";export{RuleBrowser}from"./components/rule-browser";export{WritableDropdown}from"./components/writable-dropdown";export{ConfirmationDialog}from"./components/confirmation-dialog";export{NotificationDialog}from"./components/notification-dialog";
@@ -1,2 +1 @@
1
- export {};
2
- //# sourceMappingURL=camera.js.map
1
+ export{};
@@ -1,2 +1 @@
1
- export {};
2
- //# sourceMappingURL=context-menu-button.js.map
1
+ export{};
@@ -1,2 +1 @@
1
- export {};
2
- //# sourceMappingURL=light-node-collection.js.map
1
+ export{};