@operato/scene-tab 10.0.0-beta.22 → 10.0.0-beta.30
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/tab-button.d.ts +3 -3
- package/dist/tab-container.d.ts +1 -6
- package/dist/tab-container.js.map +1 -1
- package/dist/tab.d.ts +1 -11
- package/dist/tab.js.map +1 -1
- package/package.json +2 -2
package/dist/tab-button.d.ts
CHANGED
|
@@ -49,7 +49,7 @@ declare const TabButton_base: (new (...args: any[]) => {
|
|
|
49
49
|
get disposed(): boolean;
|
|
50
50
|
isLayer(): boolean;
|
|
51
51
|
isGroup(): boolean;
|
|
52
|
-
isContainer(): this is import("@hatiolab/things-scene
|
|
52
|
+
isContainer(): this is import("@hatiolab/things-scene").Container;
|
|
53
53
|
isLine(): boolean;
|
|
54
54
|
isRoot(): boolean;
|
|
55
55
|
isRootModel(): boolean;
|
|
@@ -65,9 +65,9 @@ declare const TabButton_base: (new (...args: any[]) => {
|
|
|
65
65
|
get(property: any): any;
|
|
66
66
|
set(props: any, propval?: any): any;
|
|
67
67
|
getState(property: any): any;
|
|
68
|
-
setState(props:
|
|
68
|
+
setState(props: Partial<import("@hatiolab/things-scene").State> | string, propval?: any): any;
|
|
69
69
|
get model(): any;
|
|
70
|
-
get state():
|
|
70
|
+
get state(): import("@hatiolab/things-scene").State;
|
|
71
71
|
get hierarchy(): any;
|
|
72
72
|
get volatile(): never[];
|
|
73
73
|
_applyProps(target: any, props: any, options: any): any;
|
package/dist/tab-container.d.ts
CHANGED
|
@@ -4,12 +4,7 @@ export default class TabContainer extends Container {
|
|
|
4
4
|
_focused: boolean;
|
|
5
5
|
private __down_point?;
|
|
6
6
|
get nature(): ComponentNature;
|
|
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
|
-
};
|
|
7
|
+
get layout(): any;
|
|
13
8
|
get layoutConfig(): any;
|
|
14
9
|
set layoutConfig(config: any);
|
|
15
10
|
get activeCard(): TabCard;
|
|
@@ -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 _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"]}
|
|
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(): any {\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,16 +1,6 @@
|
|
|
1
1
|
import { ComponentNature, Container, State, Style } from '@hatiolab/things-scene';
|
|
2
2
|
export default class Tab extends Container {
|
|
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
|
-
};
|
|
3
|
+
get layout(): any;
|
|
14
4
|
get nature(): ComponentNature;
|
|
15
5
|
get focusible(): boolean;
|
|
16
6
|
get reference(): any;
|
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 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"]}
|
|
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(): any {\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": "10.0.0-beta.
|
|
5
|
+
"version": "10.0.0-beta.30",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"module": "dist/index.js",
|
|
@@ -58,5 +58,5 @@
|
|
|
58
58
|
"prettier --write"
|
|
59
59
|
]
|
|
60
60
|
},
|
|
61
|
-
"gitHead": "
|
|
61
|
+
"gitHead": "06b35b1726ec4f27ee76657ce341c6c6f3ba1b3a"
|
|
62
62
|
}
|