npm - @fmsim/layout-view - Versions diffs - 1.0.83 → 2.0.0-beta.2 - Mend

@fmsim/layout-view 1.0.83 → 2.0.0-beta.2

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 (27) hide show

package/dist-client/data-grist/ox-input-animation-map.js ADDED Viewed

@@ -0,0 +1,231 @@
+/**
+ * Animation Map 에디터
+ *
+ * key-value 맵에서 value가 애니메이션 설정 객체인 경우를 위한 편집기.
+ * 각 행은 key 입력 + ox-input-animation-config 폼으로 구성된다.
+ *
+ * value 구조:
+ * {
+ *   "1001": { type: "rotation", duration: 1000, delay: 0, theta: 360, repeat: true, delta: "linear", ease: "in" },
+ *   "1007": { type: "vibration", duration: 500, ... },
+ *   "default": ""
+ * }
+ */
+import { __decorate, __metadata } from "tslib";
+import '@material/web/icon/icon.js';
+import './ox-input-animation-config.js';
+import { css, html, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { keyed } from 'lit/directives/keyed.js';
+let OxInputAnimationMap = class OxInputAnimationMap extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.value = {};
+        this._onNewKeyChange = (e) => {
+            e.stopPropagation();
+            const input = e.target;
+            if (input.value) {
+                this._add();
+            }
+        };
+    }
+    render() {
+        const entries = this._toArray(this.value);
+        return html `
+      ${entries.map((item, idx) => html `
+          <div class="entry" data-record data-index=${idx}>
+            <div class="entry-key">
+              <input type="text" data-key .value=${item.key} placeholder="key" />
+            </div>
+            <div class="entry-value">
+              <ox-input-animation-config
+                .value=${item.value}
+                @change=${(e) => this._onConfigChange(e, idx)}
+              ></ox-input-animation-config>
+            </div>
+            <div class="entry-action">
+              <button @click=${() => this._delete(idx)} tabindex="-1">
+                <md-icon>remove</md-icon>
+              </button>
+            </div>
+          </div>
+        `)}
+      ${keyed(Date.now(), html `
+          <div class="entry add-entry" data-record-new>
+            <div class="entry-key">
+              <input type="text" data-key value="" placeholder="new key" @change=${this._onNewKeyChange} />
+            </div>
+            <div class="entry-value">
+              <ox-input-animation-config .value=${{}}></ox-input-animation-config>
+            </div>
+            <div class="entry-action">
+              <button @click=${() => this._add()} tabindex="-1">
+                <md-icon>add</md-icon>
+              </button>
+            </div>
+          </div>
+        `)}
+    `;
+    }
+    _onConfigChange(e, idx) {
+        var _a;
+        e.stopPropagation();
+        const entries = this._toArray(this.value);
+        const key = (_a = entries[idx]) === null || _a === void 0 ? void 0 : _a.key;
+        if (!key)
+            return;
+        this.value = Object.assign(Object.assign({}, this.value), { [key]: e.detail });
+        this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }));
+    }
+    firstUpdated() {
+        this.renderRoot.addEventListener('change', (e) => {
+            const target = e.target;
+            const entry = target.closest('[data-record]');
+            if (!entry)
+                return;
+            // key 변경 시 rebuild
+            if (target.hasAttribute('data-key')) {
+                e.stopPropagation();
+                this._build();
+            }
+        });
+    }
+    _build() {
+        var _a;
+        const records = this.renderRoot.querySelectorAll('[data-record]');
+        const newMap = {};
+        records.forEach(record => {
+            var _a;
+            const key = (_a = record.querySelector('[data-key]')) === null || _a === void 0 ? void 0 : _a.value;
+            if (!key)
+                return;
+            const configEl = record.querySelector('ox-input-animation-config');
+            newMap[key] = (configEl === null || configEl === void 0 ? void 0 : configEl.value) || {};
+        });
+        if (((_a = this.value) === null || _a === void 0 ? void 0 : _a.default) !== undefined) {
+            newMap.default = this.value.default;
+        }
+        this.value = newMap;
+        this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }));
+    }
+    _add() {
+        var _a;
+        const newEntry = this.renderRoot.querySelector('[data-record-new]');
+        if (!newEntry)
+            return;
+        const key = (_a = newEntry.querySelector('[data-key]')) === null || _a === void 0 ? void 0 : _a.value;
+        if (!key)
+            return;
+        const configEl = newEntry.querySelector('ox-input-animation-config');
+        const config = (configEl === null || configEl === void 0 ? void 0 : configEl.value) || {};
+        this.value = Object.assign(Object.assign({}, this.value), { [key]: config });
+        this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }));
+    }
+    _delete(idx) {
+        var _a;
+        const entries = this._toArray(this.value);
+        const key = (_a = entries[idx]) === null || _a === void 0 ? void 0 : _a.key;
+        if (!key)
+            return;
+        const newMap = Object.assign({}, this.value);
+        delete newMap[key];
+        this.value = newMap;
+        this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }));
+    }
+    _toArray(map) {
+        const arr = [];
+        for (const key in map) {
+            if (key === 'default')
+                continue;
+            const val = map[key];
+            arr.push({
+                key,
+                value: typeof val === 'object' ? val : {}
+            });
+        }
+        return arr;
+    }
+};
+OxInputAnimationMap.styles = css `
+    :host {
+      display: flex;
+      flex-direction: column;
+      gap: 4px;
+      font-size: var(--fontsize-default, 12px);
+      --md-icon-size: 16px;
+    }
+    .entry {
+      display: flex;
+      flex-direction: row;
+      align-items: flex-start;
+      gap: 6px;
+      padding: 6px 8px;
+      border: 1px solid var(--md-sys-color-outline-variant, #ddd);
+      border-radius: 4px;
+      background: var(--md-sys-color-surface-container, #f8f8f8);
+    }
+    .entry-key {
+      flex: 0 0 80px;
+      padding-top: 3px;
+    }
+    .entry-key input {
+      width: 100%;
+      box-sizing: border-box;
+      border: 0;
+      border-bottom: 1px solid transparent;
+      padding: 3px 4px;
+      font: var(--input-font, 12px sans-serif);
+      font-weight: 600;
+      color: var(--md-sys-color-on-primary-container, #333);
+      background: transparent;
+    }
+    .entry-key input:focus {
+      outline: none;
+      border-bottom-color: var(--md-sys-color-primary, #1976d2);
+    }
+    .entry-value {
+      flex: 1;
+      min-width: 0;
+    }
+    .entry-action {
+      flex: 0 0 auto;
+      padding-top: 2px;
+    }
+    button {
+      border: none;
+      background: transparent;
+      cursor: pointer;
+      padding: 2px;
+      color: var(--md-sys-color-on-surface-variant, #666);
+      line-height: 0;
+    }
+    button:hover {
+      color: var(--md-sys-color-primary, #1976d2);
+    }
+    .add-entry {
+      opacity: 0.6;
+    }
+    .add-entry:focus-within {
+      opacity: 1;
+    }
+  `;
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], OxInputAnimationMap.prototype, "value", void 0);
+OxInputAnimationMap = __decorate([
+    customElement('ox-input-animation-map')
+], OxInputAnimationMap);
+export { OxInputAnimationMap };
+//# sourceMappingURL=ox-input-animation-map.js.map

package/dist-client/data-grist/ox-input-animation-map.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ox-input-animation-map.js","sourceRoot":"","sources":["../../client/data-grist/ox-input-animation-map.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Animation Map 에디터\n *\n * key-value 맵에서 value가 애니메이션 설정 객체인 경우를 위한 편집기.\n * 각 행은 key 입력 + ox-input-animation-config 폼으로 구성된다.\n *\n * value 구조:\n * {\n * \"1001\": { type: \"rotation\", duration: 1000, delay: 0, theta: 360, repeat: true, delta: \"linear\", ease: \"in\" },\n * \"1007\": { type: \"vibration\", duration: 500, ... },\n * \"default\": \"\"\n * }\n */\n\nimport '@material/web/icon/icon.js'\nimport './ox-input-animation-config.js'\n\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { keyed } from 'lit/directives/keyed.js'\n\ntype AnimationConfig = {\n type?: string\n delay?: number\n duration?: number\n interval?: number\n theta?: number\n scale?: number\n x?: number\n y?: number\n startAlpha?: number\n endAlpha?: number\n repeat?: boolean\n autoplay?: boolean\n delta?: string\n ease?: string\n}\n\ntype AnimationMap = { default?: any; [key: string]: AnimationConfig | any }\n\n@customElement('ox-input-animation-map')\nexport class OxInputAnimationMap extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: column;\n gap: 4px;\n font-size: var(--fontsize-default, 12px);\n\n --md-icon-size: 16px;\n }\n\n .entry {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n gap: 6px;\n padding: 6px 8px;\n border: 1px solid var(--md-sys-color-outline-variant, #ddd);\n border-radius: 4px;\n background: var(--md-sys-color-surface-container, #f8f8f8);\n }\n\n .entry-key {\n flex: 0 0 80px;\n padding-top: 3px;\n }\n\n .entry-key input {\n width: 100%;\n box-sizing: border-box;\n border: 0;\n border-bottom: 1px solid transparent;\n padding: 3px 4px;\n font: var(--input-font, 12px sans-serif);\n font-weight: 600;\n color: var(--md-sys-color-on-primary-container, #333);\n background: transparent;\n }\n\n .entry-key input:focus {\n outline: none;\n border-bottom-color: var(--md-sys-color-primary, #1976d2);\n }\n\n .entry-value {\n flex: 1;\n min-width: 0;\n }\n\n .entry-action {\n flex: 0 0 auto;\n padding-top: 2px;\n }\n\n button {\n border: none;\n background: transparent;\n cursor: pointer;\n padding: 2px;\n color: var(--md-sys-color-on-surface-variant, #666);\n line-height: 0;\n }\n\n button:hover {\n color: var(--md-sys-color-primary, #1976d2);\n }\n\n .add-entry {\n opacity: 0.6;\n }\n\n .add-entry:focus-within {\n opacity: 1;\n }\n `\n\n @property({ type: Object }) value: AnimationMap = {}\n\n render() {\n const entries = this._toArray(this.value)\n\n return html`\n ${entries.map(\n (item, idx) => html`\n <div class=\"entry\" data-record data-index=${idx}>\n <div class=\"entry-key\">\n <input type=\"text\" data-key .value=${item.key} placeholder=\"key\" />\n </div>\n <div class=\"entry-value\">\n <ox-input-animation-config\n .value=${item.value}\n @change=${(e: CustomEvent) => this._onConfigChange(e, idx)}\n ></ox-input-animation-config>\n </div>\n <div class=\"entry-action\">\n <button @click=${() => this._delete(idx)} tabindex=\"-1\">\n <md-icon>remove</md-icon>\n </button>\n </div>\n </div>\n `\n )}\n ${keyed(\n Date.now(),\n html`\n <div class=\"entry add-entry\" data-record-new>\n <div class=\"entry-key\">\n <input type=\"text\" data-key value=\"\" placeholder=\"new key\" @change=${this._onNewKeyChange} />\n </div>\n <div class=\"entry-value\">\n <ox-input-animation-config .value=${{}}></ox-input-animation-config>\n </div>\n <div class=\"entry-action\">\n <button @click=${() => this._add()} tabindex=\"-1\">\n <md-icon>add</md-icon>\n </button>\n </div>\n </div>\n `\n )}\n `\n }\n\n private _onConfigChange(e: CustomEvent, idx: number) {\n e.stopPropagation()\n\n const entries = this._toArray(this.value)\n const key = entries[idx]?.key\n if (!key) return\n\n this.value = { ...this.value, [key]: e.detail }\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }))\n }\n\n private _onNewKeyChange = (e: Event) => {\n e.stopPropagation()\n const input = e.target as HTMLInputElement\n if (input.value) {\n this._add()\n }\n }\n\n firstUpdated() {\n this.renderRoot.addEventListener('change', (e: Event) => {\n const target = e.target as HTMLElement\n const entry = target.closest('[data-record]')\n if (!entry) return\n\n // key 변경 시 rebuild\n if (target.hasAttribute('data-key')) {\n e.stopPropagation()\n this._build()\n }\n })\n }\n\n private _build() {\n const records = this.renderRoot.querySelectorAll('[data-record]')\n const newMap: AnimationMap = {}\n\n records.forEach(record => {\n const key = (record.querySelector('[data-key]') as HTMLInputElement)?.value\n if (!key) return\n\n const configEl = record.querySelector('ox-input-animation-config') as any\n newMap[key] = configEl?.value || {}\n })\n\n if (this.value?.default !== undefined) {\n newMap.default = this.value.default\n }\n\n this.value = newMap\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }))\n }\n\n private _add() {\n const newEntry = this.renderRoot.querySelector('[data-record-new]')\n if (!newEntry) return\n\n const key = (newEntry.querySelector('[data-key]') as HTMLInputElement)?.value\n if (!key) return\n\n const configEl = newEntry.querySelector('ox-input-animation-config') as any\n const config = configEl?.value || {}\n\n this.value = { ...this.value, [key]: config }\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }))\n }\n\n private _delete(idx: number) {\n const entries = this._toArray(this.value)\n const key = entries[idx]?.key\n if (!key) return\n\n const newMap = { ...this.value }\n delete newMap[key]\n this.value = newMap\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }))\n }\n\n private _toArray(map: AnimationMap): { key: string; value: AnimationConfig }[] {\n const arr: { key: string; value: AnimationConfig }[] = []\n for (const key in map) {\n if (key === 'default') continue\n const val = map[key]\n arr.push({\n key,\n value: typeof val === 'object' ? val : {}\n })\n }\n return arr\n }\n}\n"]}

package/dist-client/pages/board-modeller-page.d.ts CHANGED Viewed

@@ -3,11 +3,10 @@ import '@fmsim/board/ox-board-modeller.js';
 import { BoardModeller } from '@fmsim/board/ox-board-modeller.js';
 import { PageView } from '@operato/shell';
 declare const BoardModellerPage_base: (new (...args: any[]) => {
-    _storeUnsubscribe: import("redux").Unsubscribe;
+    _storeUnsubscribe: () => void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     stateChanged(_state: unknown): void;
-    readonly isConnected: boolean;
 }) & typeof PageView;
 export declare class BoardModellerPage extends BoardModellerPage_base {
     constructor();

package/dist-client/pages/board-modeller-page.js CHANGED Viewed

@@ -3,10 +3,9 @@ import './things-scene-components.import';
 import '@fmsim/board/ox-board-modeller.js';
 import { css, html } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
-import { connect } from 'pwa-helpers/connect-mixin.js';
 import { BoardModeller } from '@fmsim/board/ox-board-modeller.js';
 import { OxPropertyEditor } from '@operato/property-editor';
-import { PageView, store } from '@operato/shell';
+import { connect, PageView, store } from '@operato/shell';
 import { fetchBoardById, updateBoard } from '@fmsim/api';
 import { provider } from '../board-provider';
 import components from './things-scene-components-with-tools.import';

package/dist-client/pages/board-modeller-page.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"board-modeller-page.js","sourceRoot":"","sources":["../../client/pages/board-modeller-page.ts"],"names":[],"mappings":"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","sourcesContent":["import './things-scene-components.import'\nimport '@fmsim/board/ox-board-modeller.js'\n\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { BoardModeller } from '@fmsim/board/ox-board-modeller.js'\nimport { OxPropertyEditor } from '@operato/property-editor'\nimport { PageView, store } from '@operato/shell'\nimport { fetchBoardById, updateBoard } from '@fmsim/api'\n\nimport { provider } from '../board-provider'\nimport components from './things-scene-components-with-tools.import'\n\nconst NOOP = () => {}\n\n@customElement('board-modeller-page')\nexport class BoardModellerPage extends connect(store)(PageView) {\n constructor() {\n super()\n\n components.forEach(({ templates = [], groups = [] }) => {\n groups.forEach(group => BoardModeller.registerGroup(group))\n BoardModeller.registerTemplate(templates)\n })\n\n /* 컴포넌트에서 정의된 에디터들을 MODELLER_EDITORS에 등록 */\n var addedEditors = {}\n for (let component in components) {\n let { editors } = components[component]\n\n editors &&\n editors.forEach(editor => {\n let { type, element } = editor\n\n addedEditors[type] = element\n })\n }\n\n OxPropertyEditor.register(addedEditors)\n\n this.boardName = ''\n this.model = null\n this.themes = null\n this.baseUrl = ''\n this.selected = []\n this.mode = 1\n this.hideProperty = false\n this.overlay = null\n this.scene = null\n this.fonts = []\n this.board = null\n this.componentGroupList = BoardModeller.groups\n }\n\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n overflow: hidden;\n position: relative;\n }\n\n board-modeller {\n flex: 1;\n }\n\n oops-note {\n display: block;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n `\n ]\n\n @property({ type: String }) boardId?: string \| null\n @property({ type: String }) boardName?: string\n @property({ type: Object }) model: any\n @property({ type: Object }) themes: any\n @property({ type: String }) baseUrl?: string\n @property({ type: Array }) selected: any\n @property({ type: Number }) mode?: number\n @property({ type: Boolean }) hideProperty?: boolean\n @property({ type: String }) overlay?: string \| null\n @property({ type: Object }) scene: any\n @property({ type: Array }) componentGroupList?: any\n @property({ type: Array }) fonts: any\n @property({ type: Array }) propertyEditor: any\n @property({ type: Boolean }) preparing?: boolean\n\n board: any\n @query('ox-board-modeller') modeller?: BoardModeller\n\n get context() {\n return {\n title: this.board ? this.boardName : this.preparing ? 'Fetching board...' : 'Board Not Found',\n widebleed: true\n }\n }\n\n get oopsNote() {\n return {\n icon: 'color_lens',\n title: 'EMPTY BOARD',\n description: 'There are no board to be designed'\n }\n }\n\n async refresh() {\n if (!this.boardId) {\n this.board = null\n this.model = null\n\n return\n }\n try {\n this.preparing = true\n this.updateContext()\n\n var { board, themes } = (await fetchBoardById(this.boardId)) \|\| {}\n\n if (!board) {\n this.board = null\n throw 'board not found'\n }\n\n this.board = {\n ...board,\n model: {\n ...JSON.parse(board.model)\n }\n }\n\n this.boardName = this.board.name\n this.model = {\n ...this.board.model\n }\n this.themes = themes?.items.reduce((style, theme) => {\n style[theme.name] = theme.value\n return style\n }, {})\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: ex,\n ex\n }\n })\n )\n } finally {\n this.preparing = false\n this.updateContext()\n }\n }\n\n updated(changes) {\n if (changes.has('boardId')) {\n this.refresh()\n }\n }\n\n pageUpdated(changes, lifecycle) {\n if (this.active) {\n this.boardId = lifecycle.resourceId\n } else {\n this.boardId = null\n this.model = null\n this.modeller?.close()\n }\n }\n\n stateChanged(state) {\n this.baseUrl = state.route.rootPath\n this.fonts = state.font\n }\n\n render() {\n var oops = !this.preparing && !this.model && this.oopsNote\n\n return oops\n ? html` <oops-note icon=${oops.icon} title=${oops.title} description=${oops.description}></oops-note> `\n : html`\n <ox-board-modeller\n .mode=${this.mode}\n @mode-changed=${e => {\n this.mode = e.detail.value\n }}\n .model=${this.model}\n @model-changed=${e => {\n this.model = e.detail.value\n }}\n .scene=${this.scene}\n @scene-changed=${e => {\n this.scene = e.detail.value\n }}\n .selected=${this.selected}\n @selected-changed=${e => {\n this.selected = e.detail.value\n }}\n .baseUrl=${this.baseUrl}\n .provider=${provider}\n @save-model=${e => this.saveBoard()}\n .componentGroupList=${this.componentGroupList}\n .fonts=${this.fonts}\n .themes=${this.themes}\n .hideProperty=${this.hideProperty}\n >\n </ox-board-modeller>\n `\n }\n\n async updateBoard() {\n try {\n this.preparing = true\n\n var { id, name, description, groupId } = this.board\n var model = this.scene.model\n\n await updateBoard({ id, name, description, model, groupId })\n\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'info',\n message: 'saved'\n }\n })\n )\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: ex,\n ex: ex\n }\n })\n )\n } finally {\n this.preparing = false\n }\n\n this.updateContext()\n }\n\n async saveBoard() {\n await this.updateBoard()\n }\n}\n"]}
1	+ {"version":3,"file":"board-modeller-page.js","sourceRoot":"","sources":["../../client/pages/board-modeller-page.ts"],"names":[],"mappings":"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","sourcesContent":["import './things-scene-components.import'\nimport '@fmsim/board/ox-board-modeller.js'\n\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { BoardModeller } from '@fmsim/board/ox-board-modeller.js'\nimport { OxPropertyEditor } from '@operato/property-editor'\nimport { connect, PageView, store } from '@operato/shell'\nimport { fetchBoardById, updateBoard } from '@fmsim/api'\n\nimport { provider } from '../board-provider'\nimport components from './things-scene-components-with-tools.import'\n\nconst NOOP = () => {}\n\n@customElement('board-modeller-page')\nexport class BoardModellerPage extends connect(store)(PageView) {\n constructor() {\n super()\n\n components.forEach(({ templates = [], groups = [] }) => {\n groups.forEach(group => BoardModeller.registerGroup(group))\n BoardModeller.registerTemplate(templates)\n })\n\n /* 컴포넌트에서 정의된 에디터들을 MODELLER_EDITORS에 등록 */\n var addedEditors = {}\n for (let component in components) {\n let { editors } = components[component]\n\n editors &&\n editors.forEach(editor => {\n let { type, element } = editor\n\n addedEditors[type] = element\n })\n }\n\n OxPropertyEditor.register(addedEditors)\n\n this.boardName = ''\n this.model = null\n this.themes = null\n this.baseUrl = ''\n this.selected = []\n this.mode = 1\n this.hideProperty = false\n this.overlay = null\n this.scene = null\n this.fonts = []\n this.board = null\n this.componentGroupList = BoardModeller.groups\n }\n\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n overflow: hidden;\n position: relative;\n }\n\n board-modeller {\n flex: 1;\n }\n\n oops-note {\n display: block;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n `\n ]\n\n @property({ type: String }) boardId?: string \| null\n @property({ type: String }) boardName?: string\n @property({ type: Object }) model: any\n @property({ type: Object }) themes: any\n @property({ type: String }) baseUrl?: string\n @property({ type: Array }) selected: any\n @property({ type: Number }) mode?: number\n @property({ type: Boolean }) hideProperty?: boolean\n @property({ type: String }) overlay?: string \| null\n @property({ type: Object }) scene: any\n @property({ type: Array }) componentGroupList?: any\n @property({ type: Array }) fonts: any\n @property({ type: Array }) propertyEditor: any\n @property({ type: Boolean }) preparing?: boolean\n\n board: any\n @query('ox-board-modeller') modeller?: BoardModeller\n\n get context() {\n return {\n title: this.board ? this.boardName : this.preparing ? 'Fetching board...' : 'Board Not Found',\n widebleed: true\n }\n }\n\n get oopsNote() {\n return {\n icon: 'color_lens',\n title: 'EMPTY BOARD',\n description: 'There are no board to be designed'\n }\n }\n\n async refresh() {\n if (!this.boardId) {\n this.board = null\n this.model = null\n\n return\n }\n try {\n this.preparing = true\n this.updateContext()\n\n var { board, themes } = (await fetchBoardById(this.boardId)) \|\| {}\n\n if (!board) {\n this.board = null\n throw 'board not found'\n }\n\n this.board = {\n ...board,\n model: {\n ...JSON.parse(board.model)\n }\n }\n\n this.boardName = this.board.name\n this.model = {\n ...this.board.model\n }\n this.themes = themes?.items.reduce((style, theme) => {\n style[theme.name] = theme.value\n return style\n }, {})\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: ex,\n ex\n }\n })\n )\n } finally {\n this.preparing = false\n this.updateContext()\n }\n }\n\n updated(changes) {\n if (changes.has('boardId')) {\n this.refresh()\n }\n }\n\n pageUpdated(changes, lifecycle) {\n if (this.active) {\n this.boardId = lifecycle.resourceId\n } else {\n this.boardId = null\n this.model = null\n this.modeller?.close()\n }\n }\n\n stateChanged(state) {\n this.baseUrl = state.route.rootPath\n this.fonts = state.font\n }\n\n render() {\n var oops = !this.preparing && !this.model && this.oopsNote\n\n return oops\n ? html` <oops-note icon=${oops.icon} title=${oops.title} description=${oops.description}></oops-note> `\n : html`\n <ox-board-modeller\n .mode=${this.mode}\n @mode-changed=${e => {\n this.mode = e.detail.value\n }}\n .model=${this.model}\n @model-changed=${e => {\n this.model = e.detail.value\n }}\n .scene=${this.scene}\n @scene-changed=${e => {\n this.scene = e.detail.value\n }}\n .selected=${this.selected}\n @selected-changed=${e => {\n this.selected = e.detail.value\n }}\n .baseUrl=${this.baseUrl}\n .provider=${provider}\n @save-model=${e => this.saveBoard()}\n .componentGroupList=${this.componentGroupList}\n .fonts=${this.fonts}\n .themes=${this.themes}\n .hideProperty=${this.hideProperty}\n >\n </ox-board-modeller>\n `\n }\n\n async updateBoard() {\n try {\n this.preparing = true\n\n var { id, name, description, groupId } = this.board\n var model = this.scene.model\n\n await updateBoard({ id, name, description, model, groupId })\n\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'info',\n message: 'saved'\n }\n })\n )\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: ex,\n ex: ex\n }\n })\n )\n } finally {\n this.preparing = false\n }\n\n this.updateContext()\n }\n\n async saveBoard() {\n await this.updateBoard()\n }\n}\n"]}

package/dist-client/pages/board-viewer-page.d.ts CHANGED Viewed

@@ -4,11 +4,10 @@ import './fmb-unit-info.js';
 import { BoardViewer } from '@fmsim/board';
 import { PageView } from '@operato/shell';
 declare const BoardViewerPage_base: (new (...args: any[]) => {
-    _storeUnsubscribe: import("redux").Unsubscribe;
+    _storeUnsubscribe: () => void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     stateChanged(_state: unknown): void;
-    readonly isConnected: boolean;
 }) & typeof PageView;
 export declare class BoardViewerPage extends BoardViewerPage_base {
     static styles: import("lit").CSSResult[];

package/dist-client/pages/board-viewer-page.js CHANGED Viewed

@@ -4,9 +4,8 @@ import '@fmsim/board/ox-board-viewer.js';
 import './fmb-unit-info.js';
 import { css, html } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
-import { connect } from 'pwa-helpers/connect-mixin.js';
 import { BoardViewer } from '@fmsim/board';
-import { store, PageView } from '@operato/shell';
+import { connect, store, PageView } from '@operato/shell';
 import { fetchBoardById } from '@fmsim/api';
 import { provider } from '../board-provider.js';
 let BoardViewerPage = class BoardViewerPage extends connect(store)(PageView) {

package/dist-client/pages/board-viewer-page.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"board-viewer-page.js","sourceRoot":"","sources":["../../client/pages/board-viewer-page.ts"],"names":[],"mappings":";AAAA,OAAO,kCAAkC,CAAA;AACzC,OAAO,iCAAiC,CAAA;AACxC,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,~~OAAO~~,EAAE,MAAM,~~8BAA8B~~,CAAA;~~AAEtD~~,OAAO,EAAE,~~WAAW,EAAE,MAAM,cAAc,CAAA;AAC1C,~~OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;~~AAChD~~,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAA;AAE3C,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAIxC,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC;IAAtD;;QA4CG,2BAAsB,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAmJlE,CAAC;IA9IC,IAAI,QAAQ;QACV,OAAO;YACL,IAAI,EAAE,uBAAuB;YAC7B,KAAK,EAAE,aAAa;YACpB,WAAW,EAAE,gCAAgC;SAC9C,CAAA;IACH,CAAC;IAED,IAAI,OAAO;QACT,OAAO;YACL,wDAAwD;YACxD,KAAK,EACH,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC;gBAC9B,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,iBAAiB,CAAC;SAC9F,CAAA;IACH,CAAC;IAED,MAAM;QACJ,IAAI,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,QAAQ,CAAA;QAE3D,OAAO,IAAI;YACT,CAAC,CAAC,IAAI,CAAA,oBAAoB,IAAI,CAAC,IAAI,UAAU,IAAI,CAAC,KAAK,gBAAgB,IAAI,CAAC,WAAW,gBAAgB;YACvG,CAAC,CAAC,IAAI,CAAA;;qBAES,IAAI,CAAC,MAAM;wBACR,QAAQ;+BACD,IAAI,CAAC,YAAY;+BACjB,IAAI,CAAC,YAAY;;;;SAIvC,CAAA;IACP,CAAC;IAED,OAAO,CAAC,OAAO;QACb,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,OAAO,EAAE,CAAA;QAChB,CAAC;IACH,CAAC;IAED,WAAW,CAAC,OAAO,EAAE,SAAS;QAC5B,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,IAAI,CAAC,SAAS,EAAE,CAAA;YAChB,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC,UAAU,CAAA;YACpC,IAAI,CAAC,YAAY,GAAG,SAAS,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,MAAM,CAAA;QAChE,CAAC;aAAM,CAAC;YACN;;;;eAIG;YACH,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,IAAI,WAAW,GAAG,IAAI,CAAC,WAAW,CAAA;gBAClC,WAAW,IAAI,WAAW,CAAC,UAAU,EAAE,CAAA;YACzC,CAAC;YAED,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAA;QACpB,CAAC;IACH,CAAC;IAED,YAAY,CAAC,KAAK;QAChB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAA;IACnC,CAAC;IAED,KAAK,CAAC,OAAO;QACX,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACnB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;YAClB,OAAM;QACR,CAAC;QAED,IAAI,CAAC;YACH,IAAI,CAAC,SAAS,GAAG,IAAI,CAAA;YACrB,IAAI,CAAC,aAAa,EAAE,CAAA;YAEpB,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,CAAC,MAAM,cAAc,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,EAAE,CAAA;YACnE,MAAM,KAAK,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,KAAK,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;gBAClD,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,KAAK,CAAA;gBAC/B,OAAO,KAAK,CAAA;YACd,CAAC,EAAE,EAAE,CAAC,CAAA;YAEN,IAAI,CAAC,KAAK,EAAE,CAAC;gBACX,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;gBAClB,MAAM,iBAAiB,CAAA;YACzB,CAAC;YAED,IAAI,CAAC,MAAM,mCACN,KAAK,KACR,KAAK,oBACA,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAE5B,KAAK,GACN,CAAA;QACH,CAAC;QAAC,OAAO,EAAE,EAAE,CAAC;YACZ,QAAQ,CAAC,aAAa,CACpB,IAAI,WAAW,CAAC,QAAQ,EAAE;gBACxB,MAAM,EAAE;oBACN,KAAK,EAAE,OAAO;oBACd,OAAO,EAAE,EAAE;oBACX,EAAE;iBACH;aACF,CAAC,CACH,CAAA;QACH,CAAC;gBAAS,CAAC;YACT,IAAI,CAAC,SAAS,GAAG,KAAK,CAAA;YACtB,IAAI,CAAC,aAAa,EAAE,CAAA;QACtB,CAAC;IACH,CAAC;IAED,eAAe,CAAC,CAAQ;;QACtB,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,CAAA,MAAC,CAAiB,CAAC,MAAM,0CAAE,KAAK,KAAI,EAAE,CAAA;QAClF,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,GAAG,KAAK,IAAI,EAAE,CAAA;QAEhC,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,IAAI,IAAI,KAAK,EAAE,CAAC,CAAA;QAErC,IAAI,KAAK,IAAI,OAAO,EAAE,CAAC;YACrB,OAAM;QACR,CAAC;QAED,MAAM,IAAI,GAAG,CAAA,MAAC,CAAiB,CAAC,MAAM,0CAAE,KAAK,KAAI,EAAE,CAAA;QAEnD,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,eAAe,CAAgB,CAAA;YACpE,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE;gBAClC,CAAC,CAAC,eAAe,EAAE,CAAA;gBACnB,IAAI,CAAC,SAAS,EAAE,CAAA;YAClB,CAAC,CAAC,CAAA;YAEF,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;YACvB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;QACpB,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAA;IACxB,CAAC;IAED,SAAS;QACP,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;YAC5B,OAAO,IAAI,CAAC,KAAK,CAAA;QACnB,CAAC;IACH,CAAC;;AA7LM,sBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAiCF;CACF,AAnCY,CAmCZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+CAAY;AACX;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;iDAAkB;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;iDAAkB;AAChB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;;qDAAuB;AACtB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;;kDAAoB;AAKtB;IAAzB,KAAK,CAAC,iBAAiB,CAAC;8BAAe,WAAW;oDAAA;AA/CxC,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CA+L3B","sourcesContent":["import './things-scene-components.import'\nimport '@fmsim/board/ox-board-viewer.js'\nimport './fmb-unit-info.js'\n\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { ~~connect } from 'pwa-helpers/connect-mixin.js'\n\nimport {~~ BoardViewer } from '@fmsim/board'\nimport { store, PageView } from '@operato/shell'\nimport { fetchBoardById } from '@fmsim/api'\n\nimport { provider } from '../board-provider.js'\nimport { FMBUnitInfo } from './fmb-unit-info.js'\n\n@customElement('board-viewer-page')\nexport class BoardViewerPage extends connect(store)(PageView) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n width: 100%; /* 전체화면보기를 위해서 필요함. /\n height: 100%;\n\n overflow: hidden;\n position: relative;\n }\n\n ox-board-viewer {\n flex: 1;\n background-color: white;\n }\n\n ::slotted(fmb-unit-info) {\n position: absolute;\n right: 10px;\n top: 10px;\n width: 200px;\n opacity: 0.9;\n box-shadow: 2px 2px 4px gray;\n }\n\n oops-note {\n display: block;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n `\n ]\n\n @property({ type: Object }) _board: any\n @property({ type: String }) _boardId?: string\n @property({ type: String }) _baseUrl?: string\n @property({ type: Boolean }) _interactive?: boolean\n @property({ type: Boolean }) preparing?: boolean\n\n private showFMBUnitInfoHandler = this.showFMBUnitInfo.bind(this)\n private popup?: FMBUnitInfo\n\n @query('ox-board-viewer') boardViewer!: BoardViewer\n\n get oopsNote() {\n return {\n icon: 'insert_chart_outlined',\n title: 'EMPTY BOARD',\n description: 'There are no board to be shown'\n }\n }\n\n get context() {\n return {\n / can set the page title with the 'title' parameter. /\n title:\n this.lifecycle.params['title'] \|\|\n (this._board ? this._board.name : this.preparing ? 'Fetching board...' : 'Board Not Found')\n }\n }\n\n render() {\n var oops = !this.preparing && !this._board && this.oopsNote\n\n return oops\n ? html` <oops-note icon=${oops.icon} title=${oops.title} description=${oops.description}></oops-note> `\n : html`\n <ox-board-viewer\n .board=${this._board}\n .provider=${provider}\n ?hide-fullscreen=${this._interactive}\n ?hide-navigation=${this._interactive}\n ></ox-board-viewer>\n\n <slot></slot>\n `\n }\n\n updated(changes) {\n if (changes.has('_boardId')) {\n this.refresh()\n }\n }\n\n pageUpdated(changes, lifecycle) {\n if (this.active) {\n this.hidePopup()\n this._boardId = lifecycle.resourceId\n this._interactive = lifecycle.params['interactive'] === 'true'\n } else {\n /\n * 비활성화된 페이지에서 render update가 발생하지 않으므로, 강제로 scene을 close 한다.\n * 화면이 inactive 될 때, 굳이 scene을 close하는 이유는,\n * 새로운 board가 선택되어 뷰어가 열릴 때, 기존 보드 잔상이 보이지 않도록 하기위해서이다.\n */\n if (this._boardId) {\n let boardViewer = this.boardViewer\n boardViewer && boardViewer.closeScene()\n }\n\n this._boardId = ''\n }\n }\n\n stateChanged(state) {\n this._baseUrl = state.app.baseUrl\n }\n\n async refresh() {\n if (!this._boardId) {\n this._board = null\n return\n }\n\n try {\n this.preparing = true\n this.updateContext()\n\n var { board, themes } = (await fetchBoardById(this._boardId)) \|\| {}\n const style = themes?.items.reduce((style, theme) => {\n style[theme.name] = theme.value\n return style\n }, {})\n\n if (!board) {\n this._board = null\n throw 'board not found'\n }\n\n this._board = {\n ...board,\n model: {\n ...JSON.parse(board.model)\n },\n style\n }\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: ex,\n ex\n }\n })\n )\n } finally {\n this.preparing = false\n this.updateContext()\n }\n }\n\n showFMBUnitInfo(e: Event) {\n e.stopPropagation()\n\n const { type: etype, model, event, data } = (e as CustomEvent).detail?.value \|\| {}\n const { id, type } = model \|\| {}\n\n console.log(`${id}:${type} ${etype}`)\n\n if (etype == 'hover') {\n return\n }\n\n const unit = (e as CustomEvent).detail?.value \|\| {}\n\n if (!this.popup) {\n const popup = document.createElement('fmb-unit-info') as FMBUnitInfo\n popup.addEventListener('close', e => {\n e.stopPropagation()\n this.hidePopup()\n })\n\n this.appendChild(popup)\n this.popup = popup\n }\n\n this.popup.unit = unit\n }\n\n hidePopup() {\n if (this.popup) {\n this.removeChild(this.popup)\n delete this.popup\n }\n }\n}\n"]}
1	+ {"version":3,"file":"board-viewer-page.js","sourceRoot":"","sources":["../../client/pages/board-viewer-page.ts"],"names":[],"mappings":"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","sourcesContent":["import './things-scene-components.import'\nimport '@fmsim/board/ox-board-viewer.js'\nimport './fmb-unit-info.js'\n\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { BoardViewer } from '@fmsim/board'\nimport { connect, store, PageView } from '@operato/shell'\nimport { fetchBoardById } from '@fmsim/api'\n\nimport { provider } from '../board-provider.js'\nimport { FMBUnitInfo } from './fmb-unit-info.js'\n\n@customElement('board-viewer-page')\nexport class BoardViewerPage extends connect(store)(PageView) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n width: 100%; /* 전체화면보기를 위해서 필요함. /\n height: 100%;\n\n overflow: hidden;\n position: relative;\n }\n\n ox-board-viewer {\n flex: 1;\n background-color: white;\n }\n\n ::slotted(fmb-unit-info) {\n position: absolute;\n right: 10px;\n top: 10px;\n width: 200px;\n opacity: 0.9;\n box-shadow: 2px 2px 4px gray;\n }\n\n oops-note {\n display: block;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n `\n ]\n\n @property({ type: Object }) _board: any\n @property({ type: String }) _boardId?: string\n @property({ type: String }) _baseUrl?: string\n @property({ type: Boolean }) _interactive?: boolean\n @property({ type: Boolean }) preparing?: boolean\n\n private showFMBUnitInfoHandler = this.showFMBUnitInfo.bind(this)\n private popup?: FMBUnitInfo\n\n @query('ox-board-viewer') boardViewer!: BoardViewer\n\n get oopsNote() {\n return {\n icon: 'insert_chart_outlined',\n title: 'EMPTY BOARD',\n description: 'There are no board to be shown'\n }\n }\n\n get context() {\n return {\n / can set the page title with the 'title' parameter. /\n title:\n this.lifecycle.params['title'] \|\|\n (this._board ? this._board.name : this.preparing ? 'Fetching board...' : 'Board Not Found')\n }\n }\n\n render() {\n var oops = !this.preparing && !this._board && this.oopsNote\n\n return oops\n ? html` <oops-note icon=${oops.icon} title=${oops.title} description=${oops.description}></oops-note> `\n : html`\n <ox-board-viewer\n .board=${this._board}\n .provider=${provider}\n ?hide-fullscreen=${this._interactive}\n ?hide-navigation=${this._interactive}\n ></ox-board-viewer>\n\n <slot></slot>\n `\n }\n\n updated(changes) {\n if (changes.has('_boardId')) {\n this.refresh()\n }\n }\n\n pageUpdated(changes, lifecycle) {\n if (this.active) {\n this.hidePopup()\n this._boardId = lifecycle.resourceId\n this._interactive = lifecycle.params['interactive'] === 'true'\n } else {\n /\n * 비활성화된 페이지에서 render update가 발생하지 않으므로, 강제로 scene을 close 한다.\n * 화면이 inactive 될 때, 굳이 scene을 close하는 이유는,\n * 새로운 board가 선택되어 뷰어가 열릴 때, 기존 보드 잔상이 보이지 않도록 하기위해서이다.\n */\n if (this._boardId) {\n let boardViewer = this.boardViewer\n boardViewer && boardViewer.closeScene()\n }\n\n this._boardId = ''\n }\n }\n\n stateChanged(state) {\n this._baseUrl = state.app.baseUrl\n }\n\n async refresh() {\n if (!this._boardId) {\n this._board = null\n return\n }\n\n try {\n this.preparing = true\n this.updateContext()\n\n var { board, themes } = (await fetchBoardById(this._boardId)) \|\| {}\n const style = themes?.items.reduce((style, theme) => {\n style[theme.name] = theme.value\n return style\n }, {})\n\n if (!board) {\n this._board = null\n throw 'board not found'\n }\n\n this._board = {\n ...board,\n model: {\n ...JSON.parse(board.model)\n },\n style\n }\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: ex,\n ex\n }\n })\n )\n } finally {\n this.preparing = false\n this.updateContext()\n }\n }\n\n showFMBUnitInfo(e: Event) {\n e.stopPropagation()\n\n const { type: etype, model, event, data } = (e as CustomEvent).detail?.value \|\| {}\n const { id, type } = model \|\| {}\n\n console.log(`${id}:${type} ${etype}`)\n\n if (etype == 'hover') {\n return\n }\n\n const unit = (e as CustomEvent).detail?.value \|\| {}\n\n if (!this.popup) {\n const popup = document.createElement('fmb-unit-info') as FMBUnitInfo\n popup.addEventListener('close', e => {\n e.stopPropagation()\n this.hidePopup()\n })\n\n this.appendChild(popup)\n this.popup = popup\n }\n\n this.popup.unit = unit\n }\n\n hidePopup() {\n if (this.popup) {\n this.removeChild(this.popup)\n delete this.popup\n }\n }\n}\n"]}

package/dist-client/pages/fmb-unit-info.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
-import '@material/mwc-icon';
-import '@material/mwc-button';
+import '@material/web/icon/icon.js';
 import '@operato/property-editor/ox-properties-dynamic-view.js';
 import '@operato/markdown';
 import { LitElement } from 'lit';

package/dist-client/pages/fmb-unit-info.js CHANGED Viewed

@@ -1,6 +1,5 @@
 import { __decorate, __metadata } from "tslib";
-import '@material/mwc-icon';
-import '@material/mwc-button';
+import '@material/web/icon/icon.js';
 import '@operato/property-editor/ox-properties-dynamic-view.js';
 import '@operato/markdown';
 import { css, html, LitElement } from 'lit';
@@ -28,7 +27,7 @@ let FMBUnitInfo = class FMBUnitInfo extends LitElement {
         const { id, type } = state || {};
         return html `
       <div header @mousedown=${this.onDragStart.bind(this)} draggable="false">
-        Object Information<mwc-icon @click=${e => this.dispatchEvent(new CustomEvent('close'))}>close</mwc-icon>
+        Object Information<md-icon @click=${e => this.dispatchEvent(new CustomEvent('close'))}>close</md-icon>
       </div>
       <div content>
         <table>
@@ -107,7 +106,7 @@ FMBUnitInfo.styles = [
         border: 2px solid var(--primary-color);
         border-radius: 3px;
-        --mdc-icon-size: 12px;
+        --md-icon-size: 12px;
       }
       [header] {
@@ -120,7 +119,7 @@ FMBUnitInfo.styles = [
         display: flex;
       }
-      [header] mwc-icon {
+      [header] md-icon {
         margin-left: auto;
         align-self: center;
       }

package/dist-client/pages/fmb-unit-info.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"fmb-unit-info.js","sourceRoot":"","sources":["../../client/pages/fmb-unit-info.ts"],"names":[],"mappings":";AAAA,OAAO,~~oBAAoB~~,CAAA;~~AAC3B~~,OAAO,~~sBAAsB,CAAA;AAC7B,OAAO,~~wDAAwD,CAAA;AAC/D,OAAO,mBAAmB,CAAA;AAE1B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGhC,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAoEG,mBAAc,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAkB,CAAA;QAC3D,oBAAe,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAkB,CAAA;IAwGvE,CAAC;IAtGC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAA;QAEzB,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,CAAA;QACzD,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,eAAe,CAAC,CAAA;IAC9D,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAA;QAE5B,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,CAAA;QAC5D,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,eAAe,CAAC,CAAA;IACjE,CAAC;IAED,MAAM;QACJ,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,IAAI,IAAI,EAAE,CAAA;QAC9C,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,GAAG,KAAK,IAAI,EAAE,CAAA;QAEhC,OAAO,IAAI,CAAA;+BACgB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;~~6CACb~~,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,OAAO,CAAC,CAAC;;;;;~~wBAKtE~~,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC;;gBAE7B,EAAE;YACF,CAAC,CAAC,IAAI,CAAA;6BACO,GAAG,EAAE;gBACZ,MAAM,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,iBAAiB,EAAE,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAA;gBACnF,OAAO,KAAK,CAAA;YACd,CAAC;uBACE,EAAE;oBACL;YACJ,CAAC,CAAC,IAAI,CAAA,EAAE;;;;wBAIA,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;kBAC7B,IAAI;;;;;qBAKD,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;;;;;KAK7C,CAAA;IACH,CAAC;IAID,WAAW,CAAC,CAAa;QACvB,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC;YAClB,IAAI,CAAC,SAAS,GAAG;gBACf,CAAC,EAAE,CAAC,CAAC,OAAO;gBACZ,CAAC,EAAE,CAAC,CAAC,OAAO;aACb,CAAA;QACH,CAAC;QAED,OAAO,KAAK,CAAA;IACd,CAAC;IAED,UAAU,CAAC,CAAQ;QACjB,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;YACpB,OAAO,KAAK,CAAA;QACd,CAAC;QAED,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,CAAC,CAAC,cAAc,EAAE,CAAA;QAElB,IAAI,CAAC,GAAI,CAAgB,CAAC,OAAO,EAC/B,CAAC,GAAI,CAAgB,CAAC,OAAO,CAAA;QAE/B,MAAM,SAAS,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAA;QAE1B,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAA;QACrB,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAA;QAErB,IAAI,CAAC,SAAS,GAAG,SAAS,CAAA;QAE1B,IAAI,CAAC,KAAK,CAAC,IAAI;YACb,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,aAAc,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,GAAG,IAAI,CAAA;QACvG,IAAI,CAAC,KAAK,CAAC,GAAG;YACZ,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,aAAc,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,GAAG,IAAI,CAAA;QAExG,OAAO,KAAK,CAAA;IACd,CAAC;IAED,SAAS,CAAC,CAAQ;QAChB,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,CAAC,CAAC,eAAe,EAAE,CAAA;YACnB,CAAC,CAAC,cAAc,EAAE,CAAA;YAElB,OAAO,IAAI,CAAC,SAAS,CAAA;QACvB,CAAC;IACH,CAAC;;AA3KM,kBAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4DF;CACF,AA/DY,CA+DZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;yCAAW;AAlE3B,WAAW;IADvB,aAAa,CAAC,eAAe,CAAC;GAClB,WAAW,CA6KvB","sourcesContent":["import '@material/~~mwc-~~icon~~'\nimport '@material~~/~~mwc-button~~'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@operato/markdown'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ScrollbarStyles } from '@operato/styles'\nimport { i18next } from '@operato/i18n'\n\n@customElement('fmb-unit-info')\nexport class FMBUnitInfo extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n background-color: white;\n font-size: 12px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n border: 2px solid var(--primary-color);\n border-radius: 3px;\n\n --~~mdc~~-icon-size: 12px;\n }\n\n [header] {\n background-color: var(--primary-color);\n user-select: none;\n align-items: center;\n color: #eee;\n padding: 0 2px;\n\n display: flex;\n }\n\n [header] ~~mwc~~-icon {\n margin-left: auto;\n align-self: center;\n }\n\n [content] {\n overflow: auto;\n }\n\n table {\n border-collapse: collapse;\n background-color: #fff;\n width: 100%;\n margin: auto;\n }\n tr {\n border-bottom: var(--border-dark-color);\n }\n\n td {\n padding: var(--padding-narrow);\n border-right: var(--border-dark-color);\n font-size: 0.8em;\n }\n\n [subTh] {\n text-align: center !important;\n font-weight: bold;\n min-width: 60px;\n text-transform: capitalize;\n background-color: rgba(0, 0, 0, 0.05);\n }\n\n tr:hover,\n [formation]:hover {\n background-color: var(--focus-background-color) !important;\n }\n `\n ]\n\n @property({ type: Object }) unit?: any\n\n private dragEndHandler = this.onDragEnd.bind(this) as EventListener\n private dragMoveHandler = this.onDragMove.bind(this) as EventListener\n\n connectedCallback(): void {\n super.connectedCallback()\n\n document.addEventListener('mouseup', this.dragEndHandler)\n document.addEventListener('mousemove', this.dragMoveHandler)\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback()\n\n document.removeEventListener('mouseup', this.dragEndHandler)\n document.removeEventListener('mousemove', this.dragMoveHandler)\n }\n\n render() {\n const { model: state, data } = this.unit \|\| {}\n const { id, type } = state \|\| {}\n\n return html`\n <div header @mousedown=${this.onDragStart.bind(this)} draggable=\"false\">\n Object Information<~~mwc~~-icon @click=${e => this.dispatchEvent(new CustomEvent('close'))}>close</~~mwc~~-icon>\n </div>\n <div content>\n <table>\n <tr>\n <td subTh>${i18next.t('label.id')}</td>\n <td>\n ${id\n ? html`<a\n @click=${() => {\n window.dispatchEvent(new CustomEvent('fetchIFactsData', { detail: { value: id } }))\n return false\n }}\n >${id}</a\n >`\n : html``}\n </td>\n </tr>\n <tr>\n <td subTh>${i18next.t('label.type')}</td>\n <td>${type}</td>\n </tr>\n\n <tr>\n <td colspan=\"2\">\n <pre>${JSON.stringify(data, null, 2)}</pre>\n </td>\n </tr>\n </table>\n </div>\n `\n }\n\n private dragStart?: { x: number; y: number }\n\n onDragStart(e: MouseEvent) {\n e.stopPropagation()\n\n if (e.button == 0) {\n this.dragStart = {\n x: e.clientX,\n y: e.clientY\n }\n }\n\n return false\n }\n\n onDragMove(e: Event) {\n if (!this.dragStart) {\n return false\n }\n\n e.stopPropagation()\n e.preventDefault()\n\n var x = (e as MouseEvent).clientX,\n y = (e as MouseEvent).clientY\n\n const dragStart = { x, y }\n\n x -= this.dragStart.x\n y -= this.dragStart.y\n\n this.dragStart = dragStart\n\n this.style.left =\n Math.min(this.parentElement!.offsetWidth - this.offsetWidth, Math.max(0, this.offsetLeft + x)) + 'px'\n this.style.top =\n Math.min(this.parentElement!.offsetHeight - this.offsetHeight, Math.max(0, this.offsetTop + y)) + 'px'\n\n return false\n }\n\n onDragEnd(e: Event) {\n if (this.dragStart) {\n e.stopPropagation()\n e.preventDefault()\n\n delete this.dragStart\n }\n }\n}\n"]}
1	+ {"version":3,"file":"fmb-unit-info.js","sourceRoot":"","sources":["../../client/pages/fmb-unit-info.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@operato/markdown'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ScrollbarStyles } from '@operato/styles'\nimport { i18next } from '@operato/i18n'\n\n@customElement('fmb-unit-info')\nexport class FMBUnitInfo extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n background-color: white;\n font-size: 12px;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n border: 2px solid var(--primary-color);\n border-radius: 3px;\n\n --md-icon-size: 12px;\n }\n\n [header] {\n background-color: var(--primary-color);\n user-select: none;\n align-items: center;\n color: #eee;\n padding: 0 2px;\n\n display: flex;\n }\n\n [header] md-icon {\n margin-left: auto;\n align-self: center;\n }\n\n [content] {\n overflow: auto;\n }\n\n table {\n border-collapse: collapse;\n background-color: #fff;\n width: 100%;\n margin: auto;\n }\n tr {\n border-bottom: var(--border-dark-color);\n }\n\n td {\n padding: var(--padding-narrow);\n border-right: var(--border-dark-color);\n font-size: 0.8em;\n }\n\n [subTh] {\n text-align: center !important;\n font-weight: bold;\n min-width: 60px;\n text-transform: capitalize;\n background-color: rgba(0, 0, 0, 0.05);\n }\n\n tr:hover,\n [formation]:hover {\n background-color: var(--focus-background-color) !important;\n }\n `\n ]\n\n @property({ type: Object }) unit?: any\n\n private dragEndHandler = this.onDragEnd.bind(this) as EventListener\n private dragMoveHandler = this.onDragMove.bind(this) as EventListener\n\n connectedCallback(): void {\n super.connectedCallback()\n\n document.addEventListener('mouseup', this.dragEndHandler)\n document.addEventListener('mousemove', this.dragMoveHandler)\n }\n\n disconnectedCallback(): void {\n super.disconnectedCallback()\n\n document.removeEventListener('mouseup', this.dragEndHandler)\n document.removeEventListener('mousemove', this.dragMoveHandler)\n }\n\n render() {\n const { model: state, data } = this.unit \|\| {}\n const { id, type } = state \|\| {}\n\n return html`\n <div header @mousedown=${this.onDragStart.bind(this)} draggable=\"false\">\n Object Information<md-icon @click=${e => this.dispatchEvent(new CustomEvent('close'))}>close</md-icon>\n </div>\n <div content>\n <table>\n <tr>\n <td subTh>${i18next.t('label.id')}</td>\n <td>\n ${id\n ? html`<a\n @click=${() => {\n window.dispatchEvent(new CustomEvent('fetchIFactsData', { detail: { value: id } }))\n return false\n }}\n >${id}</a\n >`\n : html``}\n </td>\n </tr>\n <tr>\n <td subTh>${i18next.t('label.type')}</td>\n <td>${type}</td>\n </tr>\n\n <tr>\n <td colspan=\"2\">\n <pre>${JSON.stringify(data, null, 2)}</pre>\n </td>\n </tr>\n </table>\n </div>\n `\n }\n\n private dragStart?: { x: number; y: number }\n\n onDragStart(e: MouseEvent) {\n e.stopPropagation()\n\n if (e.button == 0) {\n this.dragStart = {\n x: e.clientX,\n y: e.clientY\n }\n }\n\n return false\n }\n\n onDragMove(e: Event) {\n if (!this.dragStart) {\n return false\n }\n\n e.stopPropagation()\n e.preventDefault()\n\n var x = (e as MouseEvent).clientX,\n y = (e as MouseEvent).clientY\n\n const dragStart = { x, y }\n\n x -= this.dragStart.x\n y -= this.dragStart.y\n\n this.dragStart = dragStart\n\n this.style.left =\n Math.min(this.parentElement!.offsetWidth - this.offsetWidth, Math.max(0, this.offsetLeft + x)) + 'px'\n this.style.top =\n Math.min(this.parentElement!.offsetHeight - this.offsetHeight, Math.max(0, this.offsetTop + y)) + 'px'\n\n return false\n }\n\n onDragEnd(e: Event) {\n if (this.dragStart) {\n e.stopPropagation()\n e.preventDefault()\n\n delete this.dragStart\n }\n }\n}\n"]}

package/dist-client/pages/theme/theme-editors.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 export declare function buildThemeValueRecordConfig(): {
     editor: (value: any, column: any, record: any, rowIndex: any, field: any) => import("@operato/data-grist").OxGristEditor;
-    renderer: (value: any, column: any, record: any, rowIndex: any, field: any) => string | void | import("@operato/data-grist").OxGristRenderer | import("lit-html").TemplateResult;
+    renderer: (value: any, column: any, record: any, rowIndex: any, field: any) => string | void | import("lit-html").TemplateResult | import("@operato/data-grist").OxGristRenderer;
     editable: boolean;
 };

package/dist-client/pages/theme/theme-list-page.d.ts CHANGED Viewed

@@ -2,11 +2,10 @@ import '@operato/data-grist';
 import { PageView } from '@operato/shell';
 import { FetchOption } from '@operato/data-grist';
 declare const ThemeListPage_base: (new (...args: any[]) => {
-    _storeUnsubscribe: import("redux").Unsubscribe;
+    _storeUnsubscribe: () => void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     stateChanged(_state: unknown): void;
-    readonly isConnected: boolean;
 }) & (new (...args: any[]) => import("lit").LitElement) & typeof PageView & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/types/src/types").ScopedElementsHost>;
 export declare class ThemeListPage extends ThemeListPage_base {
     static styles: import("lit").CSSResult[];

package/dist-client/pages/theme/theme-list-page.js CHANGED Viewed

@@ -1,10 +1,9 @@
 import { __decorate, __metadata } from "tslib";
 import '@operato/data-grist';
 import { CommonButtonStyles, CommonGristStyles, ScrollbarStyles } from '@operato/styles';
-import { PageView, store } from '@operato/shell';
+import { PageView, store, connect } from '@operato/shell';
 import { css, html } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
-import { connect } from 'pwa-helpers/connect-mixin';
 import { ScopedElementsMixin } from '@open-wc/scoped-elements';
 import { DataGrist, getEditor, getRenderer } from '@operato/data-grist';
 import { i18next, localize } from '@operato/i18n';
@@ -47,7 +46,7 @@ let ThemeListPage = class ThemeListPage extends connect(store)(localize(i18next)
           <div id="sorters">
             Sort
-            <mwc-icon
+            <md-icon
               @click=${e => {
             const target = e.currentTarget;
             this.sortersControl.open({
@@ -55,7 +54,7 @@ let ThemeListPage = class ThemeListPage extends connect(store)(localize(i18next)
                 top: target.offsetTop + target.offsetHeight
             });
         }}
-              >expand_more</mwc-icon
+              >expand_more</md-icon
             >
             <ox-popup id="sorter-control">
               <ox-sorters-control> </ox-sorters-control>
@@ -63,9 +62,9 @@ let ThemeListPage = class ThemeListPage extends connect(store)(localize(i18next)
           </div>
           <div id="modes">
-            <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</mwc-icon>
-            <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</mwc-icon>
-            <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</mwc-icon>
+            <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</md-icon>
+            <md-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</md-icon>
+            <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>
           </div>
         </div>
       </ox-grist>