@operato/process 9.0.0-beta.19 → 9.0.0-beta.21

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@operato/process",
3
- "version": "9.0.0-beta.19",
3
+ "version": "9.0.0-beta.21",
4
4
  "description": "Webcomponent for business process modeling following open-wc recommendations",
5
5
  "author": "heartyoh",
6
6
  "type": "module",
@@ -75,19 +75,19 @@
75
75
  },
76
76
  "dependencies": {
77
77
  "@open-wc/scoped-elements": "^2.1.3",
78
- "@operato/app": "^9.0.0-beta.19",
79
- "@operato/board": "^9.0.0-beta.19",
80
- "@operato/data-grist": "^9.0.0-beta.18",
81
- "@operato/font": "^9.0.0-beta.18",
82
- "@operato/graphql": "^9.0.0-beta.18",
83
- "@operato/i18n": "^9.0.0-beta.18",
84
- "@operato/input": "^9.0.0-beta.18",
85
- "@operato/markdown": "^9.0.0-beta.18",
86
- "@operato/popup": "^9.0.0-beta.18",
87
- "@operato/property-editor": "^9.0.0-beta.18",
88
- "@operato/property-panel": "^9.0.0-beta.19",
89
- "@operato/styles": "^9.0.0-beta.18",
90
- "@operato/utils": "^9.0.0-beta.18",
78
+ "@operato/app": "^9.0.0-beta.21",
79
+ "@operato/board": "^9.0.0-beta.21",
80
+ "@operato/data-grist": "^9.0.0-beta.21",
81
+ "@operato/font": "^9.0.0-beta.21",
82
+ "@operato/graphql": "^9.0.0-beta.20",
83
+ "@operato/i18n": "^9.0.0-beta.20",
84
+ "@operato/input": "^9.0.0-beta.21",
85
+ "@operato/markdown": "^9.0.0-beta.21",
86
+ "@operato/popup": "^9.0.0-beta.21",
87
+ "@operato/property-editor": "^9.0.0-beta.21",
88
+ "@operato/property-panel": "^9.0.0-beta.21",
89
+ "@operato/styles": "^9.0.0-beta.21",
90
+ "@operato/utils": "^9.0.0-beta.20",
91
91
  "@polymer/paper-dropdown-menu": "^3.2.0",
92
92
  "@types/file-saver": "^2.0.4",
93
93
  "@types/sortablejs": "^1.10.7",
@@ -136,5 +136,5 @@
136
136
  "prettier --write"
137
137
  ]
138
138
  },
139
- "gitHead": "1b15658de6d4d1d406a1cf8dea8968d47f7cac18"
139
+ "gitHead": "2009d843d9b1f3ee954b01a3e9434676e39184b8"
140
140
  }
@@ -1,54 +0,0 @@
1
- /**
2
- * @license Copyright © HatioLab Inc. All rights reserved.
3
- */
4
- import '@material/web/icon/icon.js';
5
- import { LitElement, PropertyValues } from 'lit';
6
- import { Component, Model, Scene } from '@hatiolab/things-scene';
7
- import { PropertyEffects } from '@operato/property-panel/effects.js';
8
- import { SceneInspector } from '@operato/property-panel/inspector.js';
9
- import { PropertyShapes } from '@operato/property-panel/shapes.js';
10
- import { PropertySpecific } from '@operato/property-panel/specifics.js';
11
- import { PropertyStyles } from '@operato/property-panel/styles.js';
12
- import { PropertyDataBinding } from '@operato/property-panel/data-binding.js';
13
- declare const PropertySidebar_base: typeof LitElement & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/types.js").ScopedElementsHost>;
14
- export declare class PropertySidebar extends PropertySidebar_base {
15
- static styles: import("lit").CSSResult[];
16
- scene: Scene | null;
17
- bounds: any;
18
- model: Model | null;
19
- selected: Component[];
20
- specificProps: any;
21
- tabName: string | null;
22
- collapsed: boolean;
23
- fonts: any[];
24
- propertyEditor: any[];
25
- hideDataBinding: boolean;
26
- hideEffect: boolean;
27
- hideInspector: boolean;
28
- hideShape: boolean;
29
- hideStyle: boolean;
30
- hideSpecific: boolean;
31
- propertyTarget: Component | null;
32
- firstUpdated(): void;
33
- updated(change: PropertyValues<this>): void;
34
- static get scopedElements(): {
35
- 'process-property-shape': typeof PropertyShapes;
36
- 'process-property-style': typeof PropertyStyles;
37
- 'process-property-effect': typeof PropertyEffects;
38
- 'process-property-specific': typeof PropertySpecific;
39
- 'process-property-data-binding': typeof PropertyDataBinding;
40
- 'process-scene-inspector': typeof SceneInspector;
41
- };
42
- render(): import("lit-html").TemplateResult<1>;
43
- private onPropertyChanged;
44
- private onBoundsChanged;
45
- private onChangedByScene;
46
- private setPropertyTargetAsDefault;
47
- private onCollapsed;
48
- private onSceneChanged;
49
- private onSelectedChanged;
50
- private setPropertyTarget;
51
- private setBounds;
52
- private isLine;
53
- }
54
- export {};
@@ -1,372 +0,0 @@
1
- /**
2
- * @license Copyright © HatioLab Inc. All rights reserved.
3
- */
4
- import { __decorate } from "tslib";
5
- import '@material/web/icon/icon.js';
6
- import { css, html, LitElement } from 'lit';
7
- import { property } from 'lit/decorators.js';
8
- import deepClone from 'lodash-es/cloneDeep.js';
9
- import { ScopedElementsMixin } from '@open-wc/scoped-elements';
10
- import { ScrollbarStyles } from '@operato/styles';
11
- import { PropertyEffects } from '@operato/property-panel/effects.js';
12
- import { SceneInspector } from '@operato/property-panel/inspector.js';
13
- import { PropertyShapes } from '@operato/property-panel/shapes.js';
14
- import { PropertySpecific } from '@operato/property-panel/specifics.js';
15
- import { PropertyStyles } from '@operato/property-panel/styles.js';
16
- import { PropertyDataBinding } from '@operato/property-panel/data-binding.js';
17
- export class PropertySidebar extends ScopedElementsMixin(LitElement) {
18
- constructor() {
19
- super(...arguments);
20
- this.scene = null;
21
- this.bounds = {};
22
- this.model = {};
23
- this.selected = [];
24
- this.tabName = 'shape';
25
- this.collapsed = false;
26
- this.fonts = [];
27
- this.propertyEditor = [];
28
- this.hideDataBinding = false;
29
- this.hideEffect = false;
30
- this.hideInspector = false;
31
- this.hideShape = false;
32
- this.hideStyle = false;
33
- this.hideSpecific = false;
34
- this.propertyTarget = null;
35
- }
36
- firstUpdated() {
37
- this.renderRoot.addEventListener('property-change', this.onPropertyChanged.bind(this));
38
- this.renderRoot.addEventListener('bounds-change', this.onBoundsChanged.bind(this));
39
- }
40
- updated(change) {
41
- change.has('scene') && this.onSceneChanged();
42
- change.has('selected') && this.onSelectedChanged(this.selected);
43
- change.has('collapsed') && this.onCollapsed(this.collapsed);
44
- }
45
- static get scopedElements() {
46
- return {
47
- 'process-property-shape': PropertyShapes,
48
- 'process-property-style': PropertyStyles,
49
- 'process-property-effect': PropertyEffects,
50
- 'process-property-specific': PropertySpecific,
51
- 'process-property-data-binding': PropertyDataBinding,
52
- 'process-scene-inspector': SceneInspector
53
- };
54
- }
55
- render() {
56
- var tabName = this.tabName ? this.tabName : 'shape';
57
- return html `
58
- <div
59
- tab
60
- @click=${(e) => {
61
- this.tabName = e.target.getAttribute('name');
62
- }}
63
- >
64
- <md-icon name="specific" ?selected=${tabName == 'specific'} ?hidden=${this.hideSpecific}>tune</md-icon>
65
- <md-icon name="shape" ?selected=${tabName == 'shape'} ?hidden=${this.hideShape}>format_shapes</md-icon>
66
- <md-icon name="style" ?selected=${tabName == 'style'} ?hidden=${this.hideStyle}>palette</md-icon>
67
- <md-icon name="effect" ?selected=${tabName == 'effect'} ?hidden=${this.hideEffect}>movie_filter</md-icon>
68
- <md-icon name="data-binding" ?selected=${tabName == 'data-binding'} ?hidden=${this.hideDataBinding}
69
- >share</md-icon
70
- >
71
- <md-icon name="inspector" ?selected=${tabName == 'inspector'} ?hidden=${this.hideInspector}>visibility</md-icon>
72
- </div>
73
-
74
- <div content>
75
- ${html `
76
- ${{
77
- specific: html `
78
- <process-property-specific
79
- .value=${this.model}
80
- .scene=${this.scene}
81
- .selected=${this.selected}
82
- .props=${this.specificProps}
83
- .propertyEditor=${this.propertyEditor}
84
- ?active=${tabName == 'specific'}
85
- >
86
- </process-property-specific>
87
- `,
88
- shape: html `
89
- <process-property-shape
90
- .value=${this.model}
91
- .bounds=${this.bounds}
92
- .selected=${this.selected}
93
- ?active=${tabName == 'shape'}
94
- ?is-line=${this.isLine(this.selected)}
95
- >
96
- </process-property-shape>
97
- `,
98
- style: html `
99
- <process-property-style
100
- .value=${this.model}
101
- .selected=${this.selected}
102
- .fonts=${this.fonts}
103
- ?active=${tabName == 'style'}
104
- >
105
- </process-property-style>
106
- `,
107
- effect: html `
108
- <process-property-effect .value=${this.model} .scene=${this.scene} ?active=${tabName == 'effect'}>
109
- </process-property-effect>
110
- `,
111
- 'data-binding': html `
112
- <process-property-data-binding
113
- .scene=${this.scene}
114
- .value=${this.model}
115
- ?active=${tabName == 'data-binding'}
116
- >
117
- </process-property-data-binding>
118
- `,
119
- inspector: html `
120
- <process-scene-inspector .scene=${this.scene} ?active=${tabName == 'inspector'}></process-scene-inspector>
121
- `
122
- }[this.tabName]}
123
- `}
124
- </div>
125
- `;
126
- }
127
- onPropertyChanged(e) {
128
- var detail = e.detail;
129
- if (this.propertyTarget) {
130
- /* 단일 컴포넌트의 경우에 적용 */
131
- this.scene && this.scene.undoableChange(() => this.propertyTarget.set(detail));
132
- }
133
- else {
134
- /* 여러 컴포넌트의 경우에 적용 */
135
- this.scene && this.scene.undoableChange(() => this.selected.forEach(component => component.set(detail)));
136
- }
137
- }
138
- onBoundsChanged(e) {
139
- var detail = e.detail;
140
- if (!this.scene) {
141
- return;
142
- }
143
- if (this.propertyTarget) {
144
- /* 단일 컴포넌트의 경우에 적용 */
145
- this.scene.undoableChange(() => {
146
- this.propertyTarget.bounds = {
147
- ...this.propertyTarget.bounds,
148
- ...detail
149
- };
150
- });
151
- }
152
- else {
153
- /* 여러 컴포넌트의 경우에 적용 */
154
- this.scene.undoableChange(() => {
155
- this.selected.forEach(component => {
156
- component.bounds = {
157
- ...component.bounds,
158
- ...detail
159
- };
160
- });
161
- });
162
- }
163
- }
164
- onChangedByScene() {
165
- if (this.propertyTarget) {
166
- this.model = {
167
- ...this.propertyTarget.model
168
- };
169
- this.setBounds(this.propertyTarget.bounds);
170
- }
171
- }
172
- setPropertyTargetAsDefault() {
173
- if (!this.scene) {
174
- this.setPropertyTarget(null);
175
- this.specificProps = [];
176
- this.model = null;
177
- this.bounds = {};
178
- }
179
- else {
180
- this.scene.select('model-layer');
181
- }
182
- }
183
- onCollapsed(collapsed) {
184
- !collapsed && (this.style.display = '');
185
- this.animate(collapsed
186
- ? [
187
- { transform: 'translateX(0)', opacity: 1, easing: 'ease-in' },
188
- { transform: 'translateX(100%)', opacity: 1 }
189
- ]
190
- : [
191
- { transform: 'translateX(100%)', opacity: 1 },
192
- { transform: 'translateX(0)', opacity: 1, easing: 'ease-out' }
193
- ], {
194
- duration: 500
195
- }).onfinish = () => {
196
- collapsed && (this.style.display = 'none');
197
- dispatchEvent(new Event('resize'));
198
- };
199
- }
200
- async onSceneChanged() {
201
- await this.updateComplete;
202
- if (this.scene)
203
- this.selected = this.scene.select('model-layer');
204
- }
205
- async onSelectedChanged(after) {
206
- await this.updateComplete;
207
- if (after.length == 1) {
208
- this.setPropertyTarget(after[0]);
209
- // 컴포넌트 특성 속성(specific properties)을 먼저 바꾸고, 모델을 바꾸어준다.
210
- // 컴포넌트 속성에 따라 UI 컴포넌트가 준비되고, 이후에 모델값을 보여주도록 하기 위해서이다.
211
- this.specificProps = deepClone(this.propertyTarget.nature.properties);
212
- this.model = {
213
- ...this.propertyTarget.model
214
- };
215
- this.setBounds(this.propertyTarget.bounds);
216
- }
217
- else if (after.length == 0) {
218
- // 선택이 안된 경우
219
- this.setPropertyTargetAsDefault();
220
- }
221
- else {
222
- // 다중 선택된 경우
223
- var type = after[0].model.type;
224
- for (let i = 1; i < after.length; i++) {
225
- if (after[i].model.type != type) {
226
- type = undefined;
227
- break;
228
- }
229
- }
230
- this.setPropertyTarget(null);
231
- if (type)
232
- this.specificProps = deepClone(after[0].nature.properties);
233
- else
234
- this.specificProps = null;
235
- this.model = {
236
- type: type,
237
- alpha: 1
238
- };
239
- this.bounds = {};
240
- }
241
- }
242
- setPropertyTarget(newTarget) {
243
- var oldTarget = this.propertyTarget;
244
- if (oldTarget) {
245
- oldTarget.off('change', this.onChangedByScene, this);
246
- }
247
- if (newTarget) {
248
- newTarget.on('change', this.onChangedByScene, this);
249
- }
250
- this.propertyTarget = newTarget;
251
- }
252
- setBounds(bounds) {
253
- this.bounds = {
254
- left: bounds.left,
255
- top: bounds.top,
256
- width: Math.round(bounds.width),
257
- height: Math.round(bounds.height)
258
- };
259
- }
260
- isLine(selected) {
261
- var isLine = false;
262
- for (var i = 0; i < selected.length; i++) {
263
- var comp = selected[i];
264
- if (!comp.isLine || !comp.isLine()) {
265
- isLine = false;
266
- return isLine;
267
- }
268
- isLine = true;
269
- }
270
- return isLine;
271
- }
272
- }
273
- PropertySidebar.styles = [
274
- ScrollbarStyles,
275
- css `
276
- :host {
277
- border-left: 1px solid var(--md-sys-color-border, #ccc);
278
- width: 270px;
279
- display: flex;
280
- flex-direction: column;
281
- background-color: var(--property-sidebar-background-color, var(--md-sys-color-secondary-container));
282
- color: var(--property-sidebar-color, var(--md-sys-color-on-secondary-container));
283
- user-select: none;
284
-
285
- --input-padding: var(--spacing-small);
286
- --label-font: var(--property-sidebar-fieldset-label, roboto);
287
- }
288
-
289
- [tab] {
290
- display: flex;
291
- background-color: rgba(0, 0, 0, 0.08);
292
- opacity: 0.85;
293
- }
294
-
295
- [tab] md-icon {
296
- flex: 1;
297
-
298
- display: flex;
299
- align-items: center;
300
- justify-content: center;
301
-
302
- color: var(--property-sidebar-tab-icon-color);
303
- height: 40px;
304
- }
305
-
306
- [tab] [selected] {
307
- background-color: var(--property-sidebar-background-color, var(--md-sys-color-secondary-container));
308
- border-left: 1px solid rgba(255, 255, 255, 0.5);
309
- border-right: 1px solid rgba(0, 0, 0, 0.15);
310
- opacity: 1;
311
- }
312
-
313
- [content] {
314
- flex: 1;
315
-
316
- overflow: hidden;
317
- overflow-y: auto;
318
-
319
- --md-icon-size: 22px;
320
- }
321
-
322
- [content] > :not([active]) {
323
- display: none;
324
- }
325
- `
326
- ];
327
- __decorate([
328
- property({ type: Object })
329
- ], PropertySidebar.prototype, "scene", void 0);
330
- __decorate([
331
- property({ type: Object })
332
- ], PropertySidebar.prototype, "bounds", void 0);
333
- __decorate([
334
- property({ type: Object })
335
- ], PropertySidebar.prototype, "model", void 0);
336
- __decorate([
337
- property({ type: Array })
338
- ], PropertySidebar.prototype, "selected", void 0);
339
- __decorate([
340
- property({ type: Array })
341
- ], PropertySidebar.prototype, "specificProps", void 0);
342
- __decorate([
343
- property({ type: String })
344
- ], PropertySidebar.prototype, "tabName", void 0);
345
- __decorate([
346
- property({ type: Boolean })
347
- ], PropertySidebar.prototype, "collapsed", void 0);
348
- __decorate([
349
- property({ type: Array })
350
- ], PropertySidebar.prototype, "fonts", void 0);
351
- __decorate([
352
- property({ type: Array })
353
- ], PropertySidebar.prototype, "propertyEditor", void 0);
354
- __decorate([
355
- property({ type: Boolean, attribute: 'hide-data-binding' })
356
- ], PropertySidebar.prototype, "hideDataBinding", void 0);
357
- __decorate([
358
- property({ type: Boolean, attribute: 'hide-effect' })
359
- ], PropertySidebar.prototype, "hideEffect", void 0);
360
- __decorate([
361
- property({ type: Boolean, attribute: 'hide-inspector' })
362
- ], PropertySidebar.prototype, "hideInspector", void 0);
363
- __decorate([
364
- property({ type: Boolean, attribute: 'hide-shape' })
365
- ], PropertySidebar.prototype, "hideShape", void 0);
366
- __decorate([
367
- property({ type: Boolean, attribute: 'hide-style' })
368
- ], PropertySidebar.prototype, "hideStyle", void 0);
369
- __decorate([
370
- property({ type: Boolean, attribute: 'hide-specific' })
371
- ], PropertySidebar.prototype, "hideSpecific", void 0);
372
- //# sourceMappingURL=property-sidebar.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"property-sidebar.js","sourceRoot":"","sources":["../../../src/modeller/property-sidebar.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@material/web/icon/icon.js'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport deepClone from 'lodash-es/cloneDeep.js'\n\nimport { BOUNDS, Component, Model, Scene } from '@hatiolab/things-scene'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { PropertyEffects } from '@operato/property-panel/effects.js'\nimport { SceneInspector } from '@operato/property-panel/inspector.js'\nimport { PropertyShapes } from '@operato/property-panel/shapes.js'\nimport { PropertySpecific } from '@operato/property-panel/specifics.js'\nimport { PropertyStyles } from '@operato/property-panel/styles.js'\nimport { PropertyDataBinding } from '@operato/property-panel/data-binding.js'\n\nexport class PropertySidebar extends ScopedElementsMixin(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n border-left: 1px solid var(--md-sys-color-border, #ccc);\n width: 270px;\n display: flex;\n flex-direction: column;\n background-color: var(--property-sidebar-background-color, var(--md-sys-color-secondary-container));\n color: var(--property-sidebar-color, var(--md-sys-color-on-secondary-container));\n user-select: none;\n\n --input-padding: var(--spacing-small);\n --label-font: var(--property-sidebar-fieldset-label, roboto);\n }\n\n [tab] {\n display: flex;\n background-color: rgba(0, 0, 0, 0.08);\n opacity: 0.85;\n }\n\n [tab] md-icon {\n flex: 1;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n color: var(--property-sidebar-tab-icon-color);\n height: 40px;\n }\n\n [tab] [selected] {\n background-color: var(--property-sidebar-background-color, var(--md-sys-color-secondary-container));\n border-left: 1px solid rgba(255, 255, 255, 0.5);\n border-right: 1px solid rgba(0, 0, 0, 0.15);\n opacity: 1;\n }\n\n [content] {\n flex: 1;\n\n overflow: hidden;\n overflow-y: auto;\n\n --md-icon-size: 22px;\n }\n\n [content] > :not([active]) {\n display: none;\n }\n `\n ]\n\n @property({ type: Object }) scene: Scene | null = null\n @property({ type: Object }) bounds: any = {}\n @property({ type: Object }) model: Model | null = {}\n @property({ type: Array }) selected: Component[] = []\n @property({ type: Array }) specificProps: any\n @property({ type: String }) tabName: string | null = 'shape'\n @property({ type: Boolean }) collapsed: boolean = false\n @property({ type: Array }) fonts: any[] = []\n @property({ type: Array }) propertyEditor: any[] = []\n\n @property({ type: Boolean, attribute: 'hide-data-binding' }) hideDataBinding: boolean = false\n @property({ type: Boolean, attribute: 'hide-effect' }) hideEffect: boolean = false\n @property({ type: Boolean, attribute: 'hide-inspector' }) hideInspector: boolean = false\n @property({ type: Boolean, attribute: 'hide-shape' }) hideShape: boolean = false\n @property({ type: Boolean, attribute: 'hide-style' }) hideStyle: boolean = false\n @property({ type: Boolean, attribute: 'hide-specific' }) hideSpecific: boolean = false\n\n propertyTarget: Component | null = null\n\n firstUpdated() {\n this.renderRoot.addEventListener('property-change', this.onPropertyChanged.bind(this) as EventListener)\n this.renderRoot.addEventListener('bounds-change', this.onBoundsChanged.bind(this) as EventListener)\n }\n\n updated(change: PropertyValues<this>) {\n change.has('scene') && this.onSceneChanged()\n change.has('selected') && this.onSelectedChanged(this.selected)\n change.has('collapsed') && this.onCollapsed(this.collapsed)\n }\n\n static get scopedElements() {\n return {\n 'process-property-shape': PropertyShapes,\n 'process-property-style': PropertyStyles,\n 'process-property-effect': PropertyEffects,\n 'process-property-specific': PropertySpecific,\n 'process-property-data-binding': PropertyDataBinding,\n 'process-scene-inspector': SceneInspector\n }\n }\n\n render() {\n var tabName = this.tabName ? this.tabName : 'shape'\n\n return html`\n <div\n tab\n @click=${(e: MouseEvent) => {\n this.tabName = (e.target as HTMLElement).getAttribute('name')\n }}\n >\n <md-icon name=\"specific\" ?selected=${tabName == 'specific'} ?hidden=${this.hideSpecific}>tune</md-icon>\n <md-icon name=\"shape\" ?selected=${tabName == 'shape'} ?hidden=${this.hideShape}>format_shapes</md-icon>\n <md-icon name=\"style\" ?selected=${tabName == 'style'} ?hidden=${this.hideStyle}>palette</md-icon>\n <md-icon name=\"effect\" ?selected=${tabName == 'effect'} ?hidden=${this.hideEffect}>movie_filter</md-icon>\n <md-icon name=\"data-binding\" ?selected=${tabName == 'data-binding'} ?hidden=${this.hideDataBinding}\n >share</md-icon\n >\n <md-icon name=\"inspector\" ?selected=${tabName == 'inspector'} ?hidden=${this.hideInspector}>visibility</md-icon>\n </div>\n\n <div content>\n ${html`\n ${{\n specific: html`\n <process-property-specific\n .value=${this.model}\n .scene=${this.scene}\n .selected=${this.selected}\n .props=${this.specificProps}\n .propertyEditor=${this.propertyEditor}\n ?active=${tabName == 'specific'}\n >\n </process-property-specific>\n `,\n shape: html`\n <process-property-shape\n .value=${this.model}\n .bounds=${this.bounds}\n .selected=${this.selected}\n ?active=${tabName == 'shape'}\n ?is-line=${this.isLine(this.selected)}\n >\n </process-property-shape>\n `,\n style: html`\n <process-property-style\n .value=${this.model}\n .selected=${this.selected}\n .fonts=${this.fonts}\n ?active=${tabName == 'style'}\n >\n </process-property-style>\n `,\n effect: html`\n <process-property-effect .value=${this.model} .scene=${this.scene} ?active=${tabName == 'effect'}>\n </process-property-effect>\n `,\n\n 'data-binding': html`\n <process-property-data-binding\n .scene=${this.scene}\n .value=${this.model}\n ?active=${tabName == 'data-binding'}\n >\n </process-property-data-binding>\n `,\n inspector: html`\n <process-scene-inspector .scene=${this.scene} ?active=${tabName == 'inspector'}></process-scene-inspector>\n `\n }[this.tabName!]}\n `}\n </div>\n `\n }\n\n private onPropertyChanged(e: CustomEvent) {\n var detail = e.detail\n\n if (this.propertyTarget) {\n /* 단일 컴포넌트의 경우에 적용 */\n this.scene && this.scene.undoableChange(() => this.propertyTarget!.set(detail))\n } else {\n /* 여러 컴포넌트의 경우에 적용 */\n this.scene && this.scene.undoableChange(() => this.selected.forEach(component => component.set(detail)))\n }\n }\n\n private onBoundsChanged(e: CustomEvent) {\n var detail = e.detail\n\n if (!this.scene) {\n return\n }\n\n if (this.propertyTarget) {\n /* 단일 컴포넌트의 경우에 적용 */\n this.scene.undoableChange(() => {\n this.propertyTarget!.bounds = {\n ...this.propertyTarget!.bounds,\n ...detail\n }\n })\n } else {\n /* 여러 컴포넌트의 경우에 적용 */\n this.scene.undoableChange(() => {\n this.selected.forEach(component => {\n component.bounds = {\n ...component.bounds,\n ...detail\n }\n })\n })\n }\n }\n\n private onChangedByScene() {\n if (this.propertyTarget) {\n this.model = {\n ...this.propertyTarget.model\n }\n this.setBounds(this.propertyTarget.bounds)\n }\n }\n\n private setPropertyTargetAsDefault() {\n if (!this.scene) {\n this.setPropertyTarget(null)\n this.specificProps = []\n this.model = null\n this.bounds = {}\n } else {\n this.scene.select('model-layer')\n }\n }\n\n private onCollapsed(collapsed: boolean) {\n !collapsed && (this.style.display = '')\n\n this.animate(\n collapsed\n ? [\n { transform: 'translateX(0)', opacity: 1, easing: 'ease-in' },\n { transform: 'translateX(100%)', opacity: 1 }\n ]\n : [\n { transform: 'translateX(100%)', opacity: 1 },\n { transform: 'translateX(0)', opacity: 1, easing: 'ease-out' }\n ],\n {\n duration: 500\n }\n ).onfinish = () => {\n collapsed && (this.style.display = 'none')\n dispatchEvent(new Event('resize'))\n }\n }\n\n private async onSceneChanged() {\n await this.updateComplete\n\n if (this.scene) this.selected = this.scene.select('model-layer')\n }\n\n private async onSelectedChanged(after: Component[]) {\n await this.updateComplete\n\n if (after.length == 1) {\n this.setPropertyTarget(after[0])\n // 컴포넌트 특성 속성(specific properties)을 먼저 바꾸고, 모델을 바꾸어준다.\n // 컴포넌트 속성에 따라 UI 컴포넌트가 준비되고, 이후에 모델값을 보여주도록 하기 위해서이다.\n this.specificProps = deepClone(this.propertyTarget!.nature.properties)\n this.model = {\n ...this.propertyTarget!.model\n }\n this.setBounds(this.propertyTarget!.bounds)\n } else if (after.length == 0) {\n // 선택이 안된 경우\n\n this.setPropertyTargetAsDefault()\n } else {\n // 다중 선택된 경우\n\n var type = after[0].model.type\n for (let i = 1; i < after.length; i++) {\n if (after[i].model.type != type) {\n type = undefined\n break\n }\n }\n\n this.setPropertyTarget(null)\n\n if (type) this.specificProps = deepClone(after[0].nature.properties)\n else this.specificProps = null\n\n this.model = {\n type: type,\n alpha: 1\n }\n this.bounds = {}\n }\n }\n\n private setPropertyTarget(newTarget: Component | null) {\n var oldTarget = this.propertyTarget\n\n if (oldTarget) {\n oldTarget.off('change', this.onChangedByScene, this)\n }\n if (newTarget) {\n newTarget.on('change', this.onChangedByScene, this)\n }\n\n this.propertyTarget = newTarget\n }\n\n private setBounds(bounds: BOUNDS) {\n this.bounds = {\n left: bounds.left,\n top: bounds.top,\n width: Math.round(bounds.width),\n height: Math.round(bounds.height)\n }\n }\n\n private isLine(selected: Component[]) {\n var isLine = false\n\n for (var i = 0; i < selected.length; i++) {\n var comp = selected[i]\n\n if (!comp.isLine || !comp.isLine()) {\n isLine = false\n return isLine\n }\n\n isLine = true\n }\n\n return isLine\n }\n}\n"]}