@operato/scene-tab 9.1.1 → 10.0.0-beta.1

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 (12) hide show
  1. package/dist/tab-button.d.ts +237 -1
  2. package/dist/tab-button.js +5 -2
  3. package/dist/tab-button.js.map +1 -1
  4. package/dist/tab-card.js +1 -0
  5. package/dist/tab-card.js.map +1 -1
  6. package/dist/tab-container.d.ts +8 -3
  7. package/dist/tab-container.js +5 -7
  8. package/dist/tab-container.js.map +1 -1
  9. package/dist/tab.d.ts +12 -2
  10. package/dist/tab.js +6 -6
  11. package/dist/tab.js.map +1 -1
  12. package/package.json +13 -13
package/dist/tab-button.d.ts CHANGED
@@ -1,5 +1,241 @@
1
1
  import { Component, State } from '@hatiolab/things-scene';
2
- declare const TabButton_base: typeof Component;
2
+ declare const TabButton_base: (new (...args: any[]) => {
3
+ contains(x: number, y: number): boolean;
4
+ get path(): {
5
+ x: any;
6
+ y: any;
7
+ }[];
8
+ set path(path: {
9
+ x: any;
10
+ y: any;
11
+ }[]): any;
12
+ get anchors(): {
13
+ name: string;
14
+ position: {
15
+ x: any;
16
+ y: any;
17
+ };
18
+ }[];
19
+ get bounds(): any;
20
+ set bounds(bounds: any): any;
21
+ render(ctx: CanvasRenderingContext2D): void;
22
+ _app: any;
23
+ _model: any;
24
+ _state: any;
25
+ _delta: any;
26
+ _animation: any;
27
+ _animate: any;
28
+ _parent: any;
29
+ _disposed: any;
30
+ _textHidden: any;
31
+ _text_substitutor: any;
32
+ _value_substitutor: any;
33
+ _mappings: any;
34
+ _realObject: import("@hatiolab/things-scene").IRealObject | undefined;
35
+ _cachedState: any;
36
+ updatedAt: any;
37
+ fontSize: any;
38
+ __cache__: any;
39
+ created(): void;
40
+ added(parent: any): void;
41
+ removed(parent: any): void;
42
+ ready(): Promise<void>;
43
+ touch(): void;
44
+ clearCache(...attrs: any[]): void;
45
+ removeSelf(completely: any): void;
46
+ resetAnimation(): void;
47
+ dispose(): void;
48
+ get nature(): import("@hatiolab/things-scene").ComponentNature;
49
+ get disposed(): boolean;
50
+ isLayer(): boolean;
51
+ isGroup(): boolean;
52
+ isContainer(): this is import("@hatiolab/things-scene/dist-types/types/component.js").Container;
53
+ isLine(): boolean;
54
+ isRoot(): boolean;
55
+ isRootModel(): boolean;
56
+ is3dish(): boolean;
57
+ get is3dMode(): boolean;
58
+ isIn3DSpace(): boolean;
59
+ isTemplate(): boolean;
60
+ isHTMLElement(): boolean;
61
+ isConnectable(): boolean;
62
+ isIdentifiable(): boolean;
63
+ isPositionable(): boolean;
64
+ replaceRefids(replaceMap: any): void;
65
+ get(property: any): any;
66
+ set(props: any, propval?: any): any;
67
+ getState(property: any): any;
68
+ setState(props: any, propval?: any): any;
69
+ get model(): any;
70
+ get state(): any;
71
+ get hierarchy(): any;
72
+ get volatile(): never[];
73
+ _applyProps(target: any, props: any, options: any): any;
74
+ move(offset: {
75
+ x: number;
76
+ y: number;
77
+ }, ...args: boolean[]): void;
78
+ symmetryX(x?: number): void;
79
+ symmetryY(y: number): void;
80
+ adjustResize(bounds: import("@hatiolab/things-scene").BOUNDS, origin_bounds: import("@hatiolab/things-scene").BOUNDS, diagonal: boolean): {
81
+ left: any;
82
+ top: any;
83
+ width: any;
84
+ height: any;
85
+ };
86
+ adjustRotation(rotation: number, step: boolean): number;
87
+ outline(progress: number): any;
88
+ get center(): import("@hatiolab/things-scene").POINT;
89
+ set center(p: import("@hatiolab/things-scene").POINT): any;
90
+ get location(): import("@hatiolab/things-scene").POINT;
91
+ set location(l: import("@hatiolab/things-scene").POINT): any;
92
+ get rotate(): import("@hatiolab/things-scene").POINT;
93
+ set rotate(r: import("@hatiolab/things-scene").POINT): any;
94
+ get dimension(): import("@hatiolab/things-scene").DIMENSION;
95
+ set dimension(d: import("@hatiolab/things-scene").DIMENSION): any;
96
+ get drawPath(): import("@hatiolab/things-scene").POINT[];
97
+ get rotatePoint(): import("@hatiolab/things-scene").POINT;
98
+ get mutable(): boolean;
99
+ get resizable(): boolean;
100
+ get rotatable(): boolean;
101
+ buildRealObject(): import("@hatiolab/things-scene").IRealObject | undefined;
102
+ get realObject(): import("@hatiolab/things-scene").IRealObject | undefined;
103
+ draw(context?: import("@hatiolab/things-scene").SceneRenderContext): void;
104
+ prerender(context: import("@hatiolab/things-scene").SceneRenderContext): void;
105
+ postrender(context: import("@hatiolab/things-scene").SceneRenderContext): void;
106
+ prepare(resolve: (component: Component) => void, reject: (reason: any) => void): void;
107
+ prepareIf(condition: boolean): void;
108
+ drawText(context: import("@hatiolab/things-scene").SceneRenderContext): void;
109
+ drawStroke(context: import("@hatiolab/things-scene").SceneRenderContext, override?: Record<string, unknown>): void;
110
+ drawFill(context: import("@hatiolab/things-scene").SceneRenderContext, override?: Record<string, unknown>): void;
111
+ get strokeStyle(): any;
112
+ set strokeStyle(v: any): any;
113
+ get fillStyle(): any;
114
+ set fillStyle(v: any): any;
115
+ get fontColor(): string;
116
+ set fontColor(v: string): any;
117
+ get rotation(): number;
118
+ set rotation(v: number): any;
119
+ get decorators(): string[];
120
+ get decotag(): string;
121
+ get hidden(): boolean;
122
+ set hidden(v: boolean): any;
123
+ get tag(): string;
124
+ set tag(v: string): any;
125
+ get appendum(): any;
126
+ set appendum(v: any): any;
127
+ defaultTextSubstitutor(): string;
128
+ textLines(context?: import("@hatiolab/things-scene").SceneRenderContext): any[][];
129
+ get font(): string;
130
+ get lineHeight(): number;
131
+ get textSubstitutor(): () => string;
132
+ get text(): string;
133
+ set text(v: string): any;
134
+ get textBounds(): import("@hatiolab/things-scene").BOUNDS;
135
+ get textRotation(): number;
136
+ get textHidden(): boolean;
137
+ set textHidden(v: boolean): any;
138
+ get hasTextProperty(): boolean;
139
+ animate(opts: import("@hatiolab/things-scene").AnimationConfig): any;
140
+ effect(context: import("@hatiolab/things-scene").SceneRenderContext, model: any): void;
141
+ serialize(...others: any[]): string;
142
+ trim(): void;
143
+ closeScene(data: any): void;
144
+ delta(attr?: string | object, value?: any): any;
145
+ invalidate(): void;
146
+ get value(): any;
147
+ set value(v: any): any;
148
+ get data(): any;
149
+ set data(v: any): any;
150
+ set tap(v: any): any;
151
+ get mappings(): any[];
152
+ get retention(): number;
153
+ get animation(): import("@hatiolab/things-scene").AnimationController | undefined;
154
+ get started(): boolean;
155
+ set started(v: boolean): any;
156
+ get controls(): import("@hatiolab/things-scene").Control[] | undefined;
157
+ findFirst(finder: string | ((c: Component) => boolean), ...others: any[]): Component | undefined;
158
+ findAll(s: string | ((c: Component) => boolean), ...others: any[]): any[] | undefined;
159
+ capture(x: number, y: number, except?: (c: Component) => boolean): any;
160
+ findAnchor(name: string): any;
161
+ isDescendible(container: Component): boolean;
162
+ getContext(component?: unknown): any;
163
+ get root(): Component;
164
+ get rootModel(): Component;
165
+ get parent(): Component;
166
+ set parent(v: Component): any;
167
+ get scalable(): boolean;
168
+ get stuck(): boolean;
169
+ get capturable(): boolean;
170
+ get position(): string;
171
+ get origin(): string;
172
+ get offset(): import("@hatiolab/things-scene").POINT;
173
+ get app(): import("@hatiolab/things-scene").ApplicationContext;
174
+ drawEffect(context: import("@hatiolab/things-scene").SceneRenderContext): void;
175
+ prepareFill(resolve: Function, reject: Function): void;
176
+ prepareFillIf(condition: boolean): void;
177
+ onchangeFill(after: Record<string, any>, before: Record<string, any>): void;
178
+ drawImage(context: import("@hatiolab/things-scene").SceneRenderContext, image: HTMLImageElement, left: number, top: number, width: number, height: number): void;
179
+ mutateBounds(logic: ((bounds: import("@hatiolab/things-scene").BOUNDS) => import("@hatiolab/things-scene").BOUNDS | void) | null, context?: any): void;
180
+ mutatePath(beforeLogic: ((path: import("@hatiolab/things-scene").POINT[]) => import("@hatiolab/things-scene").POINT[] | void) | null, afterLogic: ((path: import("@hatiolab/things-scene").POINT[]) => import("@hatiolab/things-scene").POINT[] | void) | null, context?: any): void;
181
+ access(accessor: string): any;
182
+ substitute(template: string, data: any): string | undefined;
183
+ onchangeMappings(after: Record<string, any>, before: Record<string, any>): void;
184
+ onchangeData(after: Record<string, any>, before: Record<string, any>): void;
185
+ buildMappings(): void;
186
+ executeMappings(force?: boolean): void;
187
+ disposeMappings(): void;
188
+ ondropfile(transfered: FileList, files: string[]): void;
189
+ transcoordS2P(x: number, y: number, rp?: import("@hatiolab/things-scene").POINT): import("@hatiolab/things-scene").POINT;
190
+ transcoordP2S(x: number, y: number, rp?: import("@hatiolab/things-scene").POINT): import("@hatiolab/things-scene").POINT;
191
+ transcoordS2T(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
192
+ transcoordT2P(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
193
+ transcoordT2S(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
194
+ transcoordS2TR(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
195
+ transcoordS2O(x: number, y: number, target: Component): import("@hatiolab/things-scene").POINT;
196
+ transcoordC2S(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
197
+ transcoordS2C(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
198
+ toParent(x: number, y: number, rp?: import("@hatiolab/things-scene").POINT): import("@hatiolab/things-scene").POINT;
199
+ fromParent(x: number, y: number, rp?: import("@hatiolab/things-scene").POINT): import("@hatiolab/things-scene").POINT;
200
+ toScene(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
201
+ fromScene(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
202
+ toLocal(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
203
+ toGlobal(x: number, y: number, top?: Component): import("@hatiolab/things-scene").POINT;
204
+ toOther(x: number, y: number, target: Component): import("@hatiolab/things-scene").POINT;
205
+ on(name: string | object, callback: Function, context?: any): any;
206
+ off(name?: string | object, callback?: Function, context?: any): any;
207
+ once(name: string | object, callback: Function, context?: any): any;
208
+ trigger(name: string, ...args: any[]): any;
209
+ delegate_on(delegator: any): any;
210
+ delegate_off(delegator: any): any;
211
+ onchange(after: Record<string, any>, before: Record<string, any>): void;
212
+ calculateBounds?(): void;
213
+ oncreate_element?(element: HTMLElement): void;
214
+ removeComponent(component: Component, ghost?: boolean): void;
215
+ addComponent(component: Component, ghost?: boolean): void;
216
+ insertComponentAt(component: Component, index: number, ghost?: boolean): void;
217
+ getOverlay(component: Component): HTMLElement | undefined;
218
+ findById(id: string): Component | undefined;
219
+ findByRefid(ref: string | number): Component | undefined;
220
+ findAllById(id: string): Component[];
221
+ resize(): void;
222
+ fit(type?: string): void;
223
+ get components(): Component[] | undefined;
224
+ get layout(): any;
225
+ get auxOverlay(): HTMLElement | undefined;
226
+ get isReady(): boolean;
227
+ get unitScale(): number;
228
+ get selected(): Component[];
229
+ set selected(_v: Component[]): any;
230
+ get focused(): Component | null;
231
+ set focused(_v: Component | null): any;
232
+ get hasSameParentForAllSelected(): boolean;
233
+ set hasSameParentForAllSelected(_v: boolean): any;
234
+ get fitMode(): string | undefined;
235
+ set fitMode(_v: string | undefined): any;
236
+ get element(): HTMLElement | null;
237
+ set element(_v: HTMLElement | null): any;
238
+ }) & typeof Component;
3
239
  export default class TabButton extends TabButton_base {
4
240
  get index(): number;
5
241
  get activated(): boolean;
package/dist/tab-button.js CHANGED
@@ -10,6 +10,10 @@ let TabButton = class TabButton extends RectPath(Component) {
10
10
  get activated() {
11
11
  return this.parent.activeIndex === this.index;
12
12
  }
13
+ _fillStyle;
14
+ _fontColor;
15
+ _strokeStyle;
16
+ _lineWidth;
13
17
  prerender(context) {
14
18
  super.prerender(context);
15
19
  let { activeFillStyle, activeLineColor, activeLineWidth, activeFontColor } = this.state;
@@ -50,10 +54,9 @@ let TabButton = class TabButton extends RectPath(Component) {
50
54
  this.set(style);
51
55
  }
52
56
  onchange(after) {
53
- var _a;
54
57
  if ('text' in after) {
55
58
  ;
56
- (_a = this.parent.reference) === null || _a === void 0 ? void 0 : _a.getAt(this.index).setState('text', after.text);
59
+ this.parent.reference?.getAt(this.index).setState('text', after.text);
57
60
  }
58
61
  this.invalidate();
59
62
  }
package/dist/tab-button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tab-button.js","sourceRoot":"","sources":["../src/tab-button.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport { Component, RectPath, sceneComponent, State } from '@hatiolab/things-scene'\n\nimport Tab from './tab.js'\n\n@sceneComponent('tab-button')\nexport default class TabButton extends RectPath(Component) {\n get index() {\n return (this.parent as Tab).indexOf(this)\n }\n\n get activated() {\n return (this.parent as Tab).activeIndex === this.index\n }\n\n private _fillStyle?: string\n private _fontColor?: string\n private _strokeStyle?: string\n private _lineWidth?: string\n\n prerender(context: CanvasRenderingContext2D) {\n super.prerender(context)\n\n let { activeFillStyle, activeLineColor, activeLineWidth, activeFontColor } = this.state\n\n if (this.activated) {\n this.model.fillStyle = activeFillStyle\n this.model.fontColor = activeFontColor\n this.model.strokeStyle = activeLineColor\n this.model.lineWidth = activeLineWidth\n } else {\n this.model.fillStyle = this._fillStyle\n this.model.fontColor = this._fontColor\n this.model.strokeStyle = this._strokeStyle\n this.model.lineWidth = this._lineWidth\n }\n }\n\n render(context: CanvasRenderingContext2D) {\n var { left = 0, top = 0, width, height } = this.bounds\n\n context.beginPath()\n\n context.rect(left, top, width, height)\n\n this.drawFill(context)\n this.drawStroke(context)\n }\n\n onclick(e: MouseEvent) {\n ;(this.parent as Tab).activeIndex = this.index\n this.parent.invalidate()\n }\n\n setStylesFromParent(style: State) {\n if ('fillStyle' in style) this._fillStyle = style.fillStyle\n if ('fontColor' in style) this._fontColor = style.fontColor\n if ('strokeStyle' in style) this._strokeStyle = style.strokeStyle\n if ('lineWidth' in style) this._lineWidth = style.lineWidth\n\n this.set(style)\n }\n\n onchange(after: State) {\n if ('text' in after) {\n ;(this.parent as Tab).reference?.getAt(this.index).setState('text', after.text)\n }\n\n this.invalidate()\n }\n}\n"]}
1
+ {"version":3,"file":"tab-button.js","sourceRoot":"","sources":["../src/tab-button.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport { Component, RectPath, sceneComponent, State } from '@hatiolab/things-scene'\n\nimport Tab from './tab.js'\n\n@sceneComponent('tab-button')\nexport default class TabButton extends RectPath(Component) {\n get index() {\n return (this.parent as Tab).indexOf(this)\n }\n\n get activated() {\n return (this.parent as Tab).activeIndex === this.index\n }\n\n private _fillStyle?: string\n private _fontColor?: string\n private _strokeStyle?: string\n private _lineWidth?: string\n\n prerender(context: CanvasRenderingContext2D) {\n super.prerender(context)\n\n let { activeFillStyle, activeLineColor, activeLineWidth, activeFontColor } = this.state\n\n if (this.activated) {\n this.model.fillStyle = activeFillStyle\n this.model.fontColor = activeFontColor\n this.model.strokeStyle = activeLineColor\n this.model.lineWidth = activeLineWidth\n } else {\n this.model.fillStyle = this._fillStyle\n this.model.fontColor = this._fontColor\n this.model.strokeStyle = this._strokeStyle\n this.model.lineWidth = this._lineWidth\n }\n }\n\n render(context: CanvasRenderingContext2D) {\n var { left = 0, top = 0, width, height } = this.bounds\n\n context.beginPath()\n\n context.rect(left, top, width, height)\n\n this.drawFill(context)\n this.drawStroke(context)\n }\n\n onclick(e: MouseEvent) {\n ;(this.parent as Tab).activeIndex = this.index\n this.parent.invalidate()\n }\n\n setStylesFromParent(style: State) {\n if ('fillStyle' in style) this._fillStyle = style.fillStyle\n if ('fontColor' in style) this._fontColor = style.fontColor\n if ('strokeStyle' in style) this._strokeStyle = style.strokeStyle\n if ('lineWidth' in style) this._lineWidth = style.lineWidth\n\n this.set(style)\n }\n\n onchange(after: State) {\n if ('text' in after) {\n ;(this.parent as Tab).reference?.getAt(this.index).setState('text', after.text)\n }\n\n this.invalidate()\n }\n}\n"]}
package/dist/tab-card.js CHANGED
@@ -24,6 +24,7 @@ const NATURE = {
24
24
  ]
25
25
  };
26
26
  let TabCard = class TabCard extends Container {
27
+ _clickPoint;
27
28
  get hasTextProperty() {
28
29
  return false;
29
30
  }
package/dist/tab-card.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tab-card.js","sourceRoot":"","sources":["../src/tab-card.ts"],"names":[],"mappings":";AAAA;;GAEG;AACH,OAAO,EAA8B,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAI9F,MAAM,MAAM,GAAoB;IAC9B,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,IAAI;IACf,UAAU,EAAE;QACV;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,QAAQ;YACf,IAAI,EAAE,QAAQ;YACd,QAAQ,EAAE;gBACR,IAAI,EAAE,eAAe;gBACrB,MAAM,EAAE,UAAU,OAAgB;oBAChC,IAAI,YAAY,GAAG,OAAO,CAAC,MAAsB,CAAA;oBACjD,YAAY,CAAC,eAAe,CAAC,OAAO,CAAC,CAAA;oBACrC,YAAY,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC,CAAC,CAAA;gBACpC,CAAC;aACF;SACF;KACF;CACF,CAAA;AAGc,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,SAAS;IAG5C,IAAI,eAAe;QACjB,OAAO,KAAK,CAAA;IACd,CAAC;IAED,IAAI,cAAc;QAChB,OAAO,KAAK,CAAA;IACd,CAAC;IAED;;;;;;;OAOG;IACH,IAAI,OAAO;QACT,OAAO,KAAK,CAAA;IACd,CAAC;IAED;;;;;OAKG;IACH,IAAI,SAAS;QACX,OAAO,KAAK,CAAA;IACd,CAAC;IAED;;;;OAIG;IACH,IAAI,SAAS;QACX,OAAO,KAAK,CAAA;IACd,CAAC;IAED,IAAI,MAAM;QACR,OAAO,MAAM,CAAA;IACf,CAAC;CACF,CAAA;AA7CoB,OAAO;IAD3B,cAAc,CAAC,UAAU,CAAC;GACN,OAAO,CA6C3B;eA7CoB,OAAO","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport { Component, ComponentNature, Container, sceneComponent } from '@hatiolab/things-scene'\n\nimport TabContainer from './tab-container.js'\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'action',\n label: 'remove',\n name: 'remove',\n property: {\n icon: 'remove_circle',\n action: function (tabCard: TabCard) {\n let tabContainer = tabCard.parent as TabContainer\n tabContainer.removeComponent(tabCard)\n tabContainer.set('activeIndex', 0)\n }\n }\n }\n ]\n}\n\n@sceneComponent('tab-card')\nexport default class TabCard extends Container {\n private _clickPoint?: Component\n\n get hasTextProperty() {\n return false\n }\n\n get showMoveHandle() {\n return false\n }\n\n /*\n * PATH 리스트를 직접 수정할 수 있는 지를 결정한다.\n *\n * 일반적으로 PATH는 바운드 생성을 위해서 논리적으로 생성되므로, 직접 수정하지 않는다.(return false)\n * 그러나, 각 꼭지점들이 개별로 움직이는 다각형류는 path 라는 모델데이타를 가지므로, 직접수정이 가능할 수 있다.(return true)\n *\n * Immutable 컴포넌트의 형상을 바꾸는 방법은 바운드를 이용한 리사이즈나, 특별한 컨트롤을 통해서 가능하다.\n */\n get mutable() {\n return false\n }\n\n /*\n * BOUND를 통해서 리사이즈를 할 수 있는 지를 결정한다.\n *\n * 일반적으로 면적을 갖는 컴포넌트는 대체로 가능하다.(return true)\n * 그러나, LINE 등 면적을 가지지않는 컴포넌트는 가능하지 않도록 정의한다.(return false)\n */\n get resizable() {\n return false\n }\n\n /*\n * 회전을 할 수 있는 지를 결정한다.\n *\n * 일반적으로 모든 컴포넌트는 가능하다.(return true)\n */\n get rotatable() {\n return false\n }\n\n get nature() {\n return NATURE\n }\n}\n"]}
1
+ {"version":3,"file":"tab-card.js","sourceRoot":"","sources":["../src/tab-card.ts"],"names":[],"mappings":";AAAA;;GAEG;AACH,OAAO,EAA8B,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAI9F,MAAM,MAAM,GAAoB;IAC9B,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,IAAI;IACf,UAAU,EAAE;QACV;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,QAAQ;YACf,IAAI,EAAE,QAAQ;YACd,QAAQ,EAAE;gBACR,IAAI,EAAE,eAAe;gBACrB,MAAM,EAAE,UAAU,OAAgB;oBAChC,IAAI,YAAY,GAAG,OAAO,CAAC,MAAsB,CAAA;oBACjD,YAAY,CAAC,eAAe,CAAC,OAAO,CAAC,CAAA;oBACrC,YAAY,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC,CAAC,CAAA;gBACpC,CAAC;aACF;SACF;KACF;CACF,CAAA;AAGc,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,SAAS;IACpC,WAAW,CAAY;IAE/B,IAAI,eAAe;QACjB,OAAO,KAAK,CAAA;IACd,CAAC;IAED,IAAI,cAAc;QAChB,OAAO,KAAK,CAAA;IACd,CAAC;IAED;;;;;;;OAOG;IACH,IAAI,OAAO;QACT,OAAO,KAAK,CAAA;IACd,CAAC;IAED;;;;;OAKG;IACH,IAAI,SAAS;QACX,OAAO,KAAK,CAAA;IACd,CAAC;IAED;;;;OAIG;IACH,IAAI,SAAS;QACX,OAAO,KAAK,CAAA;IACd,CAAC;IAED,IAAI,MAAM;QACR,OAAO,MAAM,CAAA;IACf,CAAC;CACF,CAAA;AA7CoB,OAAO;IAD3B,cAAc,CAAC,UAAU,CAAC;GACN,OAAO,CA6C3B;eA7CoB,OAAO","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport { Component, ComponentNature, Container, sceneComponent } from '@hatiolab/things-scene'\n\nimport TabContainer from './tab-container.js'\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'action',\n label: 'remove',\n name: 'remove',\n property: {\n icon: 'remove_circle',\n action: function (tabCard: TabCard) {\n let tabContainer = tabCard.parent as TabContainer\n tabContainer.removeComponent(tabCard)\n tabContainer.set('activeIndex', 0)\n }\n }\n }\n ]\n}\n\n@sceneComponent('tab-card')\nexport default class TabCard extends Container {\n private _clickPoint?: Component\n\n get hasTextProperty() {\n return false\n }\n\n get showMoveHandle() {\n return false\n }\n\n /*\n * PATH 리스트를 직접 수정할 수 있는 지를 결정한다.\n *\n * 일반적으로 PATH는 바운드 생성을 위해서 논리적으로 생성되므로, 직접 수정하지 않는다.(return false)\n * 그러나, 각 꼭지점들이 개별로 움직이는 다각형류는 path 라는 모델데이타를 가지므로, 직접수정이 가능할 수 있다.(return true)\n *\n * Immutable 컴포넌트의 형상을 바꾸는 방법은 바운드를 이용한 리사이즈나, 특별한 컨트롤을 통해서 가능하다.\n */\n get mutable() {\n return false\n }\n\n /*\n * BOUND를 통해서 리사이즈를 할 수 있는 지를 결정한다.\n *\n * 일반적으로 면적을 갖는 컴포넌트는 대체로 가능하다.(return true)\n * 그러나, LINE 등 면적을 가지지않는 컴포넌트는 가능하지 않도록 정의한다.(return false)\n */\n get resizable() {\n return false\n }\n\n /*\n * 회전을 할 수 있는 지를 결정한다.\n *\n * 일반적으로 모든 컴포넌트는 가능하다.(return true)\n */\n get rotatable() {\n return false\n }\n\n get nature() {\n return NATURE\n }\n}\n"]}
package/dist/tab-container.d.ts CHANGED
@@ -1,16 +1,21 @@
1
1
  import { ComponentNature, Container, State } from '@hatiolab/things-scene';
2
2
  import TabCard from './tab-card.js';
3
3
  export default class TabContainer extends Container {
4
- private _focused;
4
+ _focused: boolean;
5
5
  private __down_point?;
6
6
  get nature(): ComponentNature;
7
- get layout(): import("@hatiolab/things-scene").LAYOUT;
7
+ get layout(): {
8
+ reflow(container: import("@hatiolab/things-scene/dist-types/types/component.js").Container): void;
9
+ capturables(container: import("@hatiolab/things-scene/dist-types/types/component.js").Container): import("@hatiolab/things-scene").ComponentInterface[];
10
+ drawables(container: import("@hatiolab/things-scene/dist-types/types/component.js").Container): import("@hatiolab/things-scene").ComponentInterface[];
11
+ isStuck(component: import("@hatiolab/things-scene").ComponentInterface): boolean;
12
+ };
8
13
  get layoutConfig(): any;
9
14
  set layoutConfig(config: any);
10
15
  get activeCard(): TabCard;
11
16
  get activeIndex(): number;
12
17
  set activeIndex(activeIndex: number);
13
- ready(): void;
18
+ ready(): Promise<void>;
14
19
  postrender(context: CanvasRenderingContext2D): void;
15
20
  contains(x: number, y: number): boolean;
16
21
  onchange(after: State): void;
package/dist/tab-container.js CHANGED
@@ -34,10 +34,8 @@ const NATURE = {
34
34
  help: 'scene/component/tab-container'
35
35
  };
36
36
  let TabContainer = class TabContainer extends Container {
37
- constructor() {
38
- super(...arguments);
39
- this._focused = false;
40
- }
37
+ _focused = false;
38
+ __down_point;
41
39
  get nature() {
42
40
  return NATURE;
43
41
  }
@@ -59,8 +57,8 @@ let TabContainer = class TabContainer extends Container {
59
57
  set activeIndex(activeIndex) {
60
58
  this.setState('activeIndex', Number(activeIndex));
61
59
  }
62
- ready() {
63
- super.ready();
60
+ async ready() {
61
+ await super.ready();
64
62
  if (this.components.length == 0) {
65
63
  this.addCard();
66
64
  }
@@ -166,7 +164,7 @@ let TabContainer = class TabContainer extends Container {
166
164
  left: 0,
167
165
  width: 100,
168
166
  height: 100
169
- });
167
+ }, this.app);
170
168
  this.addComponent(tabCard);
171
169
  this.setState('activeIndex', this.components.length - 1);
172
170
  }
package/dist/tab-container.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tab-container.js","sourceRoot":"","sources":["../src/tab-container.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport {\n CardLayout,\n Component,\n ComponentNature,\n Container,\n Model,\n POINT,\n sceneComponent,\n State\n} from '@hatiolab/things-scene'\n\nimport TabCard from './tab-card.js'\n\nconst LABEL_WIDTH = 25\nconst LABEL_HEIGHT = 25\n\nfunction rgba(r: number, g: number, b: number, a: number) {\n return `rgba(${r}, ${g}, ${b}, ${a})`\n}\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'action',\n label: 'add-card',\n name: 'addCard',\n property: {\n icon: 'add_circle',\n action: (tabContainer: TabContainer) => {\n tabContainer.addCard()\n }\n }\n },\n {\n type: 'number',\n label: 'active index',\n name: 'activeIndex'\n }\n ],\n 'value-property': 'activeIndex',\n help: 'scene/component/tab-container'\n}\n\n@sceneComponent('tab-container')\nexport default class TabContainer extends Container {\n private _focused: boolean = false\n private __down_point?: POINT\n\n get nature() {\n return NATURE\n }\n\n get layout() {\n return CardLayout\n }\n\n get layoutConfig() {\n return this.getState('layoutConfig')\n }\n\n set layoutConfig(config) {\n this.setState('layoutConfig', config)\n }\n\n get activeCard(): TabCard {\n return this.components[this.getState('layoutConfig').activeIndex || 0] as TabCard\n }\n\n get activeIndex() {\n return this.getState('activeIndex') || 0\n }\n\n set activeIndex(activeIndex: number) {\n this.setState('activeIndex', Number(activeIndex))\n }\n\n ready() {\n super.ready()\n\n if (this.components.length == 0) {\n this.addCard()\n }\n\n this.data = this.state.activeIndex\n }\n\n postrender(context: CanvasRenderingContext2D) {\n if (!this.app.isViewMode && this._focused) {\n var { left, top, width, fillStyle } = this.state\n\n // tabCard 선택 탭 그리기\n for (let i = 0; i < this.components.length; i++) {\n context.beginPath()\n\n context.rect(left - LABEL_WIDTH, top + i * LABEL_HEIGHT, LABEL_WIDTH, LABEL_HEIGHT)\n\n let color = 255 - ((20 * (i + 1)) % 255)\n context.fillStyle = rgba(color, color, color, 1)\n context.fill()\n\n context.closePath()\n }\n\n context.beginPath()\n\n context.moveTo(left, top)\n context.lineTo(left - LABEL_WIDTH, top)\n context.lineTo(left - LABEL_WIDTH, top + this.components.length * LABEL_HEIGHT)\n context.lineTo(left, top + this.components.length * LABEL_HEIGHT)\n\n context.strokeStyle = '#ccc'\n context.stroke()\n\n context.closePath()\n }\n\n super.postrender(context)\n }\n\n contains(x: number, y: number) {\n var contains = super.contains(x, y)\n\n if (this.app.isViewMode) return contains\n\n var { left, top, width } = this.bounds\n var h = LABEL_HEIGHT\n\n contains =\n contains ||\n // card selector 영역에 포함되는지\n (x < Math.max(left - LABEL_WIDTH, left) &&\n x > Math.min(left - LABEL_WIDTH, left) &&\n y < Math.max(top + h * this.size(), top) &&\n y > Math.min(top + h * this.size(), top))\n\n if (contains) this._focused = true\n else this._focused = false\n\n this.invalidate()\n return contains\n }\n\n onchange(after: State) {\n if ('activeIndex' in after) {\n this.layoutConfig = {\n ...this.layoutConfig,\n activeIndex: after.activeIndex\n }\n\n /* \n 자동 data 변경은 반복적인 데이타바인딩을 일으키는 점을 감안하라.\n 즉, 자신의 activeIndex를 데이타바인딩으로 수정하지말아야 한다.\n */\n this.data = after.activeIndex\n }\n }\n\n onmouseup(e: MouseEvent) {\n var down_point = this.__down_point\n delete this.__down_point\n\n if (!down_point || down_point.x != e.offsetX || down_point.y != e.offsetY) {\n return\n }\n\n var point = this.transcoordC2S(e.offsetX, e.offsetY)\n\n var { left, top } = this.state\n\n var x = point.x - left\n var y = point.y - top\n\n if (x > 0) return\n\n y /= LABEL_HEIGHT\n y = Math.floor(y)\n\n if (!this.layoutConfig) this.layoutConfig = {}\n\n if (y >= this.components.length) return\n\n // /* 생성 버튼이 클릭되면, 새로운 tabCard를 추가한다. */\n // if(y == this.components.length) {\n // this.add(Model.compile({\n // type: 'tab-card',\n // width: 100,\n // height: 100\n // }))\n // }\n this.setState('activeIndex', y)\n }\n\n onmousedown(e: MouseEvent) {\n this.__down_point = {\n x: e.offsetX,\n y: e.offsetY\n }\n }\n\n addCard() {\n const color = 255 - ((20 * (this.components.length + 1)) % 255)\n const hex = color.toString(16)\n\n const tabCard = Model.compile({\n type: 'tab-card',\n fillStyle: `#${hex}${hex}${hex}`,\n top: 0,\n left: 0,\n width: 100,\n height: 100\n })\n\n this.addComponent(tabCard)\n this.setState('activeIndex', this.components.length - 1)\n }\n}\n"]}
1
+ {"version":3,"file":"tab-container.js","sourceRoot":"","sources":["../src/tab-container.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport {\n CardLayout,\n Component,\n ComponentNature,\n Container,\n Model,\n POINT,\n sceneComponent,\n State\n} from '@hatiolab/things-scene'\n\nimport TabCard from './tab-card.js'\n\nconst LABEL_WIDTH = 25\nconst LABEL_HEIGHT = 25\n\nfunction rgba(r: number, g: number, b: number, a: number) {\n return `rgba(${r}, ${g}, ${b}, ${a})`\n}\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'action',\n label: 'add-card',\n name: 'addCard',\n property: {\n icon: 'add_circle',\n action: (tabContainer: TabContainer) => {\n tabContainer.addCard()\n }\n }\n },\n {\n type: 'number',\n label: 'active index',\n name: 'activeIndex'\n }\n ],\n 'value-property': 'activeIndex',\n help: 'scene/component/tab-container'\n}\n\n@sceneComponent('tab-container')\nexport default class TabContainer extends Container {\n _focused: boolean = false\n private __down_point?: POINT\n\n get nature() {\n return NATURE\n }\n\n get layout() {\n return CardLayout\n }\n\n get layoutConfig() {\n return this.getState('layoutConfig')\n }\n\n set layoutConfig(config) {\n this.setState('layoutConfig', config)\n }\n\n get activeCard(): TabCard {\n return this.components[this.getState('layoutConfig').activeIndex || 0] as TabCard\n }\n\n get activeIndex() {\n return this.getState('activeIndex') || 0\n }\n\n set activeIndex(activeIndex: number) {\n this.setState('activeIndex', Number(activeIndex))\n }\n\n async ready() {\n await super.ready()\n\n if (this.components.length == 0) {\n this.addCard()\n }\n\n this.data = this.state.activeIndex\n }\n\n postrender(context: CanvasRenderingContext2D) {\n if (!this.app.isViewMode && this._focused) {\n var { left, top, width, fillStyle } = this.state\n\n // tabCard 선택 탭 그리기\n for (let i = 0; i < this.components.length; i++) {\n context.beginPath()\n\n context.rect(left - LABEL_WIDTH, top + i * LABEL_HEIGHT, LABEL_WIDTH, LABEL_HEIGHT)\n\n let color = 255 - ((20 * (i + 1)) % 255)\n context.fillStyle = rgba(color, color, color, 1)\n context.fill()\n\n context.closePath()\n }\n\n context.beginPath()\n\n context.moveTo(left, top)\n context.lineTo(left - LABEL_WIDTH, top)\n context.lineTo(left - LABEL_WIDTH, top + this.components.length * LABEL_HEIGHT)\n context.lineTo(left, top + this.components.length * LABEL_HEIGHT)\n\n context.strokeStyle = '#ccc'\n context.stroke()\n\n context.closePath()\n }\n\n super.postrender(context)\n }\n\n contains(x: number, y: number) {\n var contains = super.contains(x, y)\n\n if (this.app.isViewMode) return contains\n\n var { left, top, width } = this.bounds\n var h = LABEL_HEIGHT\n\n contains =\n contains ||\n // card selector 영역에 포함되는지\n (x < Math.max(left - LABEL_WIDTH, left) &&\n x > Math.min(left - LABEL_WIDTH, left) &&\n y < Math.max(top + h * this.size(), top) &&\n y > Math.min(top + h * this.size(), top))\n\n if (contains) this._focused = true\n else this._focused = false\n\n this.invalidate()\n return contains\n }\n\n onchange(after: State) {\n if ('activeIndex' in after) {\n this.layoutConfig = {\n ...this.layoutConfig,\n activeIndex: after.activeIndex\n }\n\n /* \n 자동 data 변경은 반복적인 데이타바인딩을 일으키는 점을 감안하라.\n 즉, 자신의 activeIndex를 데이타바인딩으로 수정하지말아야 한다.\n */\n this.data = after.activeIndex\n }\n }\n\n onmouseup(e: MouseEvent) {\n var down_point = this.__down_point\n delete this.__down_point\n\n if (!down_point || down_point.x != e.offsetX || down_point.y != e.offsetY) {\n return\n }\n\n var point = this.transcoordC2S(e.offsetX, e.offsetY)\n\n var { left, top } = this.state\n\n var x = point.x - left\n var y = point.y - top\n\n if (x > 0) return\n\n y /= LABEL_HEIGHT\n y = Math.floor(y)\n\n if (!this.layoutConfig) this.layoutConfig = {}\n\n if (y >= this.components.length) return\n\n // /* 생성 버튼이 클릭되면, 새로운 tabCard를 추가한다. */\n // if(y == this.components.length) {\n // this.add(Model.compile({\n // type: 'tab-card',\n // width: 100,\n // height: 100\n // }))\n // }\n this.setState('activeIndex', y)\n }\n\n onmousedown(e: MouseEvent) {\n this.__down_point = {\n x: e.offsetX,\n y: e.offsetY\n }\n }\n\n addCard() {\n const color = 255 - ((20 * (this.components.length + 1)) % 255)\n const hex = color.toString(16)\n\n const tabCard = Model.compile({\n type: 'tab-card',\n fillStyle: `#${hex}${hex}${hex}`,\n top: 0,\n left: 0,\n width: 100,\n height: 100\n }, this.app)\n\n this.addComponent(tabCard)\n this.setState('activeIndex', this.components.length - 1)\n }\n}\n"]}
package/dist/tab.d.ts CHANGED
@@ -1,6 +1,16 @@
1
1
  import { ComponentNature, Container, State, Style } from '@hatiolab/things-scene';
2
2
  export default class Tab extends Container {
3
- get layout(): import("@hatiolab/things-scene").LAYOUT;
3
+ get layout(): {
4
+ reflow(container: import("@hatiolab/things-scene/dist-types/types/component.js").Container): void;
5
+ capturables(container: import("@hatiolab/things-scene/dist-types/types/component.js").Container): import("@hatiolab/things-scene").ComponentInterface[];
6
+ drawables(container: import("@hatiolab/things-scene/dist-types/types/component.js").Container): import("@hatiolab/things-scene").ComponentInterface[];
7
+ isStuck(component: import("@hatiolab/things-scene").ComponentInterface): boolean;
8
+ } | {
9
+ reflow(container: import("@hatiolab/things-scene/dist-types/types/component.js").Container): void;
10
+ capturables(container: import("@hatiolab/things-scene/dist-types/types/component.js").Container): import("@hatiolab/things-scene").ComponentInterface[];
11
+ drawables(container: import("@hatiolab/things-scene/dist-types/types/component.js").Container): import("@hatiolab/things-scene").ComponentInterface[];
12
+ isStuck(component: import("@hatiolab/things-scene").ComponentInterface): boolean;
13
+ };
4
14
  get nature(): ComponentNature;
5
15
  get focusible(): boolean;
6
16
  get reference(): any;
@@ -8,7 +18,7 @@ export default class Tab extends Container {
8
18
  private _reference;
9
19
  set reference(reference: any);
10
20
  set activeIndex(index: any);
11
- ready(): void;
21
+ ready(): Promise<void>;
12
22
  render(context: CanvasRenderingContext2D): void;
13
23
  contains(x: number, y: number): boolean;
14
24
  rebuildTabButtons(): void;
package/dist/tab.js CHANGED
@@ -84,7 +84,7 @@ let Tab = class Tab extends Container {
84
84
  return null;
85
85
  }
86
86
  if (!this._reference) {
87
- this._reference = this.root.findById(reference);
87
+ this._reference = this.root.findById?.(reference);
88
88
  // this._reference?.on('change', this.onRefChanged, this)
89
89
  }
90
90
  return this._reference;
@@ -92,6 +92,7 @@ let Tab = class Tab extends Container {
92
92
  get activeIndex() {
93
93
  return this.getState('activeIndex');
94
94
  }
95
+ _reference;
95
96
  set reference(reference) {
96
97
  // this.reference?.off('change', this.onRefChanged, this)
97
98
  this._reference = null;
@@ -103,10 +104,9 @@ let Tab = class Tab extends Container {
103
104
  this.reference.activeIndex = index;
104
105
  }
105
106
  }
106
- ready() {
107
- var _a;
108
- super.ready();
109
- this.data = ((_a = this.state) === null || _a === void 0 ? void 0 : _a.activeIndex) || 0;
107
+ async ready() {
108
+ await super.ready();
109
+ this.data = this.state?.activeIndex || 0;
110
110
  this.setTabButtonsStyle(this.state);
111
111
  }
112
112
  render(context) {
@@ -180,7 +180,7 @@ let Tab = class Tab extends Container {
180
180
  top: 0,
181
181
  width: width,
182
182
  height: height
183
- }));
183
+ }, this.app));
184
184
  }
185
185
  this.add(children);
186
186
  this.reflow();
package/dist/tab.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tab.js","sourceRoot":"","sources":["../src/tab.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport {\n Component,\n ComponentNature,\n Container,\n LinearHorizontalLayout,\n LinearVerticalLayout,\n Model,\n sceneComponent,\n State,\n Style\n} from '@hatiolab/things-scene'\nimport TabButton from './tab-button.js'\n\nconst HANDLE_WIDTH = 25\nconst HANDLE_HEIGHT = 25\n\nfunction rgba(r: number, g: number, b: number, a: number) {\n return `rgba(${r}, ${g}, ${b}, ${a})`\n}\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'id-input',\n label: 'tab-reference',\n name: 'reference',\n property: {\n component: (c: Component) => {\n /* this means compare target component */\n const ret = ['tab-container', 'indoor-map'].includes(c.model.type as string)\n return ret\n }\n }\n },\n {\n type: 'number',\n label: 'tab-active-index',\n name: 'activeIndex',\n property: {\n min: 0,\n step: 1\n }\n },\n {\n type: 'color',\n label: 'active-fill-style',\n name: 'activeFillStyle',\n property: 'activeFillStyle'\n },\n {\n type: 'color',\n label: 'active-font-color',\n name: 'activeFontColor',\n property: 'activeFontColor'\n },\n {\n type: 'color',\n label: 'active-line-color',\n name: 'activeLineColor',\n property: 'activeLineColor'\n },\n {\n type: 'number',\n label: 'active-line-width',\n name: 'activeLineWidth',\n property: 'activeLineWidth'\n }\n ],\n 'value-property': 'activeIndex',\n help: 'scene/component/tab'\n}\n\n@sceneComponent('tab')\nexport default class Tab extends Container {\n get layout() {\n let { width, height } = this.state\n\n if (width >= height) {\n return LinearHorizontalLayout\n } else {\n return LinearVerticalLayout\n }\n }\n\n get nature() {\n return NATURE\n }\n\n get focusible() {\n return false\n }\n\n get reference() {\n var { reference } = this.state\n if (!reference) {\n return null\n }\n\n if (!this._reference) {\n this._reference = this.root.findById(reference)\n // this._reference?.on('change', this.onRefChanged, this)\n }\n\n return this._reference\n }\n\n get activeIndex() {\n return this.getState('activeIndex')\n }\n\n private _reference: any\n\n set reference(reference) {\n // this.reference?.off('change', this.onRefChanged, this)\n\n this._reference = null\n this.model.reference = reference\n }\n\n set activeIndex(index) {\n this.setState('activeIndex', index)\n if (this.reference) {\n this.reference.activeIndex = index\n }\n }\n\n ready() {\n super.ready()\n\n this.data = this.state?.activeIndex || 0\n\n this.setTabButtonsStyle(this.state)\n }\n\n render(context: CanvasRenderingContext2D) {\n super.render(context)\n\n if (this.reference) {\n if (this.size() !== this.reference.size()) {\n this.rebuildTabButtons()\n }\n } else {\n // TODO reference 가 잘못되거나 안되어있다는 경고 의미로 뭔가 그려라..\n var componentsLength = this.components.length\n\n for (var i = componentsLength - 1; i >= 0; i--) {\n var tabBtn = this.components[i]\n this.removeComponent(tabBtn)\n }\n }\n }\n\n contains(x: number, y: number) {\n if (!this.app.isEditMode) {\n return super.contains(x, y)\n }\n\n if (super.contains(x, y)) {\n return true\n }\n\n var { left, top, width } = this.bounds\n\n var right = left + width\n\n var h = HANDLE_HEIGHT\n\n return (\n x < Math.max(right + HANDLE_WIDTH, right) &&\n x > Math.min(right + HANDLE_WIDTH, right) &&\n y < Math.max(top + h, top) &&\n y > Math.min(top + h, top)\n )\n }\n\n // dispose() {\n // this.reference?.off('change', this.onRefChanged, this)\n\n // super.dispose()\n // }\n\n rebuildTabButtons() {\n var {\n width,\n height,\n fillStyle,\n activeFillStyle,\n activeLineColor,\n activeLineWidth,\n strokeStyle,\n fontColor,\n activeFontColor,\n fontFamily,\n fontSize,\n lineHeight,\n italic,\n bold,\n lineWidth = 0\n } = this.state\n\n var reference = this.reference\n let children = []\n\n let components = reference.components\n\n let componentsLength = this.components.length\n\n for (var i = componentsLength - 1; i >= 0; i--) {\n this.removeComponent(this.components[i])\n }\n\n for (let i = 0; i < components.length; i++) {\n const componentType = components[i].model.type\n if (componentType != 'tab-card' && componentType != 'floor') {\n continue\n }\n\n let tabCardText = components[i].text || ''\n\n children.push(\n Model.compile({\n type: 'tab-button',\n index: i,\n text: tabCardText || String(i + 1),\n fillStyle: fillStyle || 'transparent',\n activeFillStyle: activeFillStyle,\n activeLineColor: activeLineColor,\n activeLineWidth: activeLineWidth,\n activeFontColor: activeFontColor || fontColor,\n fontColor: fontColor,\n fontFamily: fontFamily,\n fontSize: fontSize,\n lineHeight: lineHeight,\n italic: italic,\n bold: bold,\n strokeStyle: strokeStyle,\n lineWidth: lineWidth,\n left: 0,\n top: 0,\n width: width,\n height: height\n })\n )\n }\n\n this.add(children)\n\n this.reflow()\n\n this.activeIndex = this.state.activeIndex || 0\n }\n\n setTabButtonsStyle(style: Style) {\n const toCopy = {} as any\n\n if ('fillStyle' in style) toCopy.fillStyle = style.fillStyle\n if ('fontColor' in style) toCopy.fontColor = style.fontColor\n if ('strokeStyle' in style) toCopy.strokeStyle = style.strokeStyle\n if ('lineWidth' in style) toCopy.lineWidth = style.lineWidth\n\n if ('activeFillStyle' in style) toCopy.activeFillStyle = style.activeFillStyle\n if ('activeFontColor' in style) toCopy.activeFontColor = style.activeFontColor\n if ('activeLineWidth' in style) toCopy.activeLineWidth = style.activeLineWidth\n if ('activeLineColor' in style) toCopy.activeLineColor = style.activeLineColor\n\n var children = this.components\n\n for (var i in children) {\n var tabBtn = children[i]\n ;(tabBtn as TabButton).setStylesFromParent(toCopy)\n }\n }\n\n // onRefChanged(after: any, before: any, hint: any) {\n // let sourceIndex = hint.deliverer.indexOf(hint.origin)\n // if (this.components[sourceIndex]) {\n // this.components[sourceIndex].set(after)\n // this.invalidate()\n // }\n // }\n\n onchange(after: State, before: State) {\n if ('reference' in after) {\n this.reference = after.reference\n this.invalidate()\n }\n\n if ('activeIndex' in after) {\n this.data = after.activeIndex\n }\n\n this.setTabButtonsStyle(after)\n }\n}\n"]}
1
+ {"version":3,"file":"tab.js","sourceRoot":"","sources":["../src/tab.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport {\n Component,\n ComponentNature,\n Container,\n LinearHorizontalLayout,\n LinearVerticalLayout,\n Model,\n sceneComponent,\n State,\n Style\n} from '@hatiolab/things-scene'\nimport TabButton from './tab-button.js'\n\nconst HANDLE_WIDTH = 25\nconst HANDLE_HEIGHT = 25\n\nfunction rgba(r: number, g: number, b: number, a: number) {\n return `rgba(${r}, ${g}, ${b}, ${a})`\n}\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'id-input',\n label: 'tab-reference',\n name: 'reference',\n property: {\n component: (c: Component) => {\n /* this means compare target component */\n const ret = ['tab-container', 'indoor-map'].includes(c.model.type as string)\n return ret\n }\n }\n },\n {\n type: 'number',\n label: 'tab-active-index',\n name: 'activeIndex',\n property: {\n min: 0,\n step: 1\n }\n },\n {\n type: 'color',\n label: 'active-fill-style',\n name: 'activeFillStyle',\n property: 'activeFillStyle'\n },\n {\n type: 'color',\n label: 'active-font-color',\n name: 'activeFontColor',\n property: 'activeFontColor'\n },\n {\n type: 'color',\n label: 'active-line-color',\n name: 'activeLineColor',\n property: 'activeLineColor'\n },\n {\n type: 'number',\n label: 'active-line-width',\n name: 'activeLineWidth',\n property: 'activeLineWidth'\n }\n ],\n 'value-property': 'activeIndex',\n help: 'scene/component/tab'\n}\n\n@sceneComponent('tab')\nexport default class Tab extends Container {\n get layout() {\n let { width, height } = this.state\n\n if (width >= height) {\n return LinearHorizontalLayout\n } else {\n return LinearVerticalLayout\n }\n }\n\n get nature() {\n return NATURE\n }\n\n get focusible() {\n return false\n }\n\n get reference() {\n var { reference } = this.state\n if (!reference) {\n return null\n }\n\n if (!this._reference) {\n this._reference = this.root.findById?.(reference)\n // this._reference?.on('change', this.onRefChanged, this)\n }\n\n return this._reference\n }\n\n get activeIndex() {\n return this.getState('activeIndex')\n }\n\n private _reference: any\n\n set reference(reference) {\n // this.reference?.off('change', this.onRefChanged, this)\n\n this._reference = null\n this.model.reference = reference\n }\n\n set activeIndex(index) {\n this.setState('activeIndex', index)\n if (this.reference) {\n this.reference.activeIndex = index\n }\n }\n\n async ready() {\n await super.ready()\n\n this.data = this.state?.activeIndex || 0\n\n this.setTabButtonsStyle(this.state)\n }\n\n render(context: CanvasRenderingContext2D) {\n super.render(context)\n\n if (this.reference) {\n if (this.size() !== this.reference.size()) {\n this.rebuildTabButtons()\n }\n } else {\n // TODO reference 가 잘못되거나 안되어있다는 경고 의미로 뭔가 그려라..\n var componentsLength = this.components.length\n\n for (var i = componentsLength - 1; i >= 0; i--) {\n var tabBtn = this.components[i]\n this.removeComponent(tabBtn)\n }\n }\n }\n\n contains(x: number, y: number) {\n if (!this.app.isEditMode) {\n return super.contains(x, y)\n }\n\n if (super.contains(x, y)) {\n return true\n }\n\n var { left, top, width } = this.bounds\n\n var right = left + width\n\n var h = HANDLE_HEIGHT\n\n return (\n x < Math.max(right + HANDLE_WIDTH, right) &&\n x > Math.min(right + HANDLE_WIDTH, right) &&\n y < Math.max(top + h, top) &&\n y > Math.min(top + h, top)\n )\n }\n\n // dispose() {\n // this.reference?.off('change', this.onRefChanged, this)\n\n // super.dispose()\n // }\n\n rebuildTabButtons() {\n var {\n width,\n height,\n fillStyle,\n activeFillStyle,\n activeLineColor,\n activeLineWidth,\n strokeStyle,\n fontColor,\n activeFontColor,\n fontFamily,\n fontSize,\n lineHeight,\n italic,\n bold,\n lineWidth = 0\n } = this.state\n\n var reference = this.reference\n let children = []\n\n let components = reference.components\n\n let componentsLength = this.components.length\n\n for (var i = componentsLength - 1; i >= 0; i--) {\n this.removeComponent(this.components[i])\n }\n\n for (let i = 0; i < components.length; i++) {\n const componentType = components[i].model.type\n if (componentType != 'tab-card' && componentType != 'floor') {\n continue\n }\n\n let tabCardText = components[i].text || ''\n\n children.push(\n Model.compile({\n type: 'tab-button',\n index: i,\n text: tabCardText || String(i + 1),\n fillStyle: fillStyle || 'transparent',\n activeFillStyle: activeFillStyle,\n activeLineColor: activeLineColor,\n activeLineWidth: activeLineWidth,\n activeFontColor: activeFontColor || fontColor,\n fontColor: fontColor,\n fontFamily: fontFamily,\n fontSize: fontSize,\n lineHeight: lineHeight,\n italic: italic,\n bold: bold,\n strokeStyle: strokeStyle,\n lineWidth: lineWidth,\n left: 0,\n top: 0,\n width: width,\n height: height\n }, this.app)\n )\n }\n\n this.add(children)\n\n this.reflow()\n\n this.activeIndex = this.state.activeIndex || 0\n }\n\n setTabButtonsStyle(style: Style) {\n const toCopy = {} as any\n\n if ('fillStyle' in style) toCopy.fillStyle = style.fillStyle\n if ('fontColor' in style) toCopy.fontColor = style.fontColor\n if ('strokeStyle' in style) toCopy.strokeStyle = style.strokeStyle\n if ('lineWidth' in style) toCopy.lineWidth = style.lineWidth\n\n if ('activeFillStyle' in style) toCopy.activeFillStyle = style.activeFillStyle\n if ('activeFontColor' in style) toCopy.activeFontColor = style.activeFontColor\n if ('activeLineWidth' in style) toCopy.activeLineWidth = style.activeLineWidth\n if ('activeLineColor' in style) toCopy.activeLineColor = style.activeLineColor\n\n var children = this.components\n\n for (var i in children) {\n var tabBtn = children[i]\n ;(tabBtn as TabButton).setStylesFromParent(toCopy)\n }\n }\n\n // onRefChanged(after: any, before: any, hint: any) {\n // let sourceIndex = hint.deliverer.indexOf(hint.origin)\n // if (this.components[sourceIndex]) {\n // this.components[sourceIndex].set(after)\n // this.invalidate()\n // }\n // }\n\n onchange(after: State, before: State) {\n if ('reference' in after) {\n this.reference = after.reference\n this.invalidate()\n }\n\n if ('activeIndex' in after) {\n this.data = after.activeIndex\n }\n\n this.setTabButtonsStyle(after)\n }\n}\n"]}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@operato/scene-tab",
3
3
  "description": "Tab style container for Things Scene",
4
4
  "author": "heartyoh",
5
- "version": "9.1.1",
5
+ "version": "10.0.0-beta.1",
6
6
  "type": "module",
7
7
  "main": "dist/index.js",
8
8
  "module": "dist/index.js",
@@ -10,7 +10,7 @@
10
10
  "things-scene": true,
11
11
  "publishConfig": {
12
12
  "access": "public",
13
- "@oprato:registry": "https://registry.npmjs.org"
13
+ "@operato:registry": "https://registry.npmjs.org"
14
14
  },
15
15
  "repository": {
16
16
  "type": "git",
@@ -22,27 +22,27 @@
22
22
  "serve:dev": "npm run serve",
23
23
  "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
24
24
  "build": "tsc",
25
- "prepublish": "tsc",
26
- "lint": "eslint --ext .ts,.html . --ignore-path .gitignore && prettier \"**/*.ts\" --check --ignore-path .gitignore",
27
- "format": "eslint --ext .ts,.html . --fix --ignore-path .gitignore && prettier \"**/*.ts\" --write --ignore-path .gitignore",
25
+ "prepublishOnly": "tsc",
26
+ "lint": "eslint src/ && prettier \"src/**/*.ts\" --check",
27
+ "format": "eslint src/ --fix && prettier \"src/**/*.ts\" --write",
28
28
  "migration": "things-factory-migration"
29
29
  },
30
30
  "dependencies": {
31
- "@hatiolab/things-scene": "^9.0.0"
31
+ "@hatiolab/things-scene": "^10.0.0-beta.1"
32
32
  },
33
33
  "devDependencies": {
34
34
  "@hatiolab/prettier-config": "^1.0.0",
35
- "@things-factory/builder": "^9.0.0",
36
- "@things-factory/operato-board": "^9.0.0",
37
- "@typescript-eslint/eslint-plugin": "^4.33.0",
38
- "@typescript-eslint/parser": "^4.33.0",
35
+ "@things-factory/builder": "^10.0.0-beta.1",
36
+ "@things-factory/operato-board": "^10.0.0-beta.1",
37
+ "@typescript-eslint/eslint-plugin": "^8.0.0",
38
+ "@typescript-eslint/parser": "^8.0.0",
39
39
  "@web/dev-server": "^0.1.28",
40
40
  "concurrently": "^8.0.1",
41
41
  "eslint": "^9.18.0",
42
42
  "eslint-config-prettier": "^10.0.1",
43
43
  "husky": "^8.0.3",
44
- "lint-staged": "^13.2.2",
45
- "prettier": "^2.4.1",
44
+ "lint-staged": "^15.2.2",
45
+ "prettier": "^3.2.5",
46
46
  "tslib": "^2.3.1",
47
47
  "typescript": "^5.0.4"
48
48
  },
@@ -58,5 +58,5 @@
58
58
  "prettier --write"
59
59
  ]
60
60
  },
61
- "gitHead": "14946e6f709e9b427a43ac6c5751b4fdb58961dd"
61
+ "gitHead": "bb127dd516b9e962fb2d0a24bc2d8c5e108f06fb"
62
62
  }