@operato/board 9.0.0-beta.6 → 9.0.0-beta.62

package/dist/src/modeller/property-sidebar/data-binding/data-binding-value-map.d.ts

@@ -1,6 +0,0 @@
-import { OxInputValueMap } from '@operato/input';
-import '@operato/attachment/ox-attachment-selector.js';
-export declare class DataBindingValueMap extends OxInputValueMap {
-    static styles: import("lit").CSSResult;
-    valueInputTemplate(value?: any): import("lit-html").TemplateResult<1>;
-}

package/dist/src/modeller/property-sidebar/data-binding/data-binding-value-map.js

@@ -1,20 +0,0 @@
-import { __decorate } from "tslib";
-import { html } from 'lit';
-import { customElement } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import { OxInputValueMap } from '@operato/input';
-import '@operato/attachment/ox-attachment-selector.js';
-let DataBindingValueMap = class DataBindingValueMap extends OxInputValueMap {
-    valueInputTemplate(value) {
-        if (this.valuetype == 'attachment') {
-            return html `<ox-attachment-selector data-value value=${ifDefined(value)}></ox-attachment-selector>`;
-        }
-        return super.valueInputTemplate(value);
-    }
-};
-DataBindingValueMap.styles = OxInputValueMap.styles;
-DataBindingValueMap = __decorate([
-    customElement('data-binding-value-map')
-], DataBindingValueMap);
-export { DataBindingValueMap };
-//# sourceMappingURL=data-binding-value-map.js.map

package/dist/src/modeller/property-sidebar/data-binding/data-binding-value-map.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"data-binding-value-map.js","sourceRoot":"","sources":["../../../../../src/modeller/property-sidebar/data-binding/data-binding-value-map.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAExD,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAEhD,OAAO,+CAA+C,CAAA;AAG/C,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,eAAe;IAGtD,kBAAkB,CAAC,KAAW;QAC5B,IAAI,IAAI,CAAC,SAAS,IAAI,YAAY,EAAE,CAAC;YACnC,OAAO,IAAI,CAAA,4CAA4C,SAAS,CAAC,KAAK,CAAC,4BAA4B,CAAA;QACrG,CAAC;QACD,OAAO,KAAK,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAA;IACxC,CAAC;;AAPM,0BAAM,GAAG,eAAe,CAAC,MAAM,AAAzB,CAAyB;AAD3B,mBAAmB;IAD/B,aAAa,CAAC,wBAAwB,CAAC;GAC3B,mBAAmB,CAS/B","sourcesContent":["import { html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\nimport { OxInputValueMap } from '@operato/input'\n\nimport '@operato/attachment/ox-attachment-selector.js'\n\n@customElement('data-binding-value-map')\nexport class DataBindingValueMap extends OxInputValueMap {\n  static styles = OxInputValueMap.styles\n\n  valueInputTemplate(value?: any) {\n    if (this.valuetype == 'attachment') {\n      return html`<ox-attachment-selector data-value value=${ifDefined(value)}></ox-attachment-selector>`\n    }\n    return super.valueInputTemplate(value)\n  }\n}\n"]}

package/dist/src/modeller/property-sidebar/data-binding/data-binding-value-range.d.ts

@@ -1,6 +0,0 @@
-import { OxInputValueRange } from '@operato/input';
-import '@operato/attachment/ox-attachment-selector.js';
-export declare class DataBindingValueRange extends OxInputValueRange {
-    static styles: import("lit").CSSResult;
-    valueInputTemplate(value?: any): import("lit-html").TemplateResult<1>;
-}

package/dist/src/modeller/property-sidebar/data-binding/data-binding-value-range.js

@@ -1,20 +0,0 @@
-import { __decorate } from "tslib";
-import { html } from 'lit';
-import { customElement } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import { OxInputValueRange } from '@operato/input';
-import '@operato/attachment/ox-attachment-selector.js';
-let DataBindingValueRange = class DataBindingValueRange extends OxInputValueRange {
-    valueInputTemplate(value) {
-        if (this.valuetype == 'attachment') {
-            return html `<ox-attachment-selector data-value value=${ifDefined(value)}></ox-attachment-selector>`;
-        }
-        return super.valueInputTemplate(value);
-    }
-};
-DataBindingValueRange.styles = OxInputValueRange.styles;
-DataBindingValueRange = __decorate([
-    customElement('data-binding-value-range')
-], DataBindingValueRange);
-export { DataBindingValueRange };
-//# sourceMappingURL=data-binding-value-range.js.map

package/dist/src/modeller/property-sidebar/data-binding/data-binding-value-range.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"data-binding-value-range.js","sourceRoot":"","sources":["../../../../../src/modeller/property-sidebar/data-binding/data-binding-value-range.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAExD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAElD,OAAO,+CAA+C,CAAA;AAG/C,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,iBAAiB;IAG1D,kBAAkB,CAAC,KAAW;QAC5B,IAAI,IAAI,CAAC,SAAS,IAAI,YAAY,EAAE,CAAC;YACnC,OAAO,IAAI,CAAA,4CAA4C,SAAS,CAAC,KAAK,CAAC,4BAA4B,CAAA;QACrG,CAAC;QACD,OAAO,KAAK,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAA;IACxC,CAAC;;AAPM,4BAAM,GAAG,iBAAiB,CAAC,MAAM,AAA3B,CAA2B;AAD7B,qBAAqB;IADjC,aAAa,CAAC,0BAA0B,CAAC;GAC7B,qBAAqB,CASjC","sourcesContent":["import { html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\n\nimport { OxInputValueRange } from '@operato/input'\n\nimport '@operato/attachment/ox-attachment-selector.js'\n\n@customElement('data-binding-value-range')\nexport class DataBindingValueRange extends OxInputValueRange {\n  static styles = OxInputValueRange.styles\n\n  valueInputTemplate(value?: any) {\n    if (this.valuetype == 'attachment') {\n      return html`<ox-attachment-selector data-value value=${ifDefined(value)}></ox-attachment-selector>`\n    }\n    return super.valueInputTemplate(value)\n  }\n}\n"]}

package/dist/src/modeller/property-sidebar/data-binding/data-binding.d.ts

@@ -1,44 +0,0 @@
-/**
- * @license Copyright © HatioLab Inc. All rights reserved.
- */
-import '@material/web/icon/icon.js';
-import '@operato/help/ox-title-with-help.js';
-import '@operato/input/ox-buttons-radio.js';
-import '@operato/input/ox-input-data.js';
-import '@operato/i18n/ox-i18n.js';
-import { PropertyValues } from 'lit';
-import { Properties, Scene } from '@hatiolab/things-scene';
-import { AbstractProperty } from '../abstract-property.js';
-import { DataBindingMapper } from './data-binding-mapper.js';
-declare const PropertyDataBinding_base: typeof AbstractProperty & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/types/src/types.js").ScopedElementsHost>;
-export declare class PropertyDataBinding extends PropertyDataBinding_base {
-    static styles: import("lit").CSSResult[];
-    value?: Properties;
-    scene?: Scene;
-    mappingIndex: number;
-    _afterRender?: Function | null;
-    _dataExpanded: boolean;
-    tabs: HTMLElement;
-    tabNavLeftButton: HTMLElement;
-    tabNavRightButton: HTMLElement;
-    private mapping;
-    get mappings(): any;
-    firstUpdated(): void;
-    updated(changes: PropertyValues<this>): void;
-    static get scopedElements(): {
-        'data-binding-mapper': typeof DataBindingMapper;
-    };
-    render(): import("lit-html").TemplateResult<1>;
-    _setMappingIndex(idx: number): void;
-    _clearDataBindingMapper(): void;
-    _copyDataBindingMapper(): void;
-    _pasteDataBindingMapper(): Promise<void>;
-    _onValueChanged(): Promise<void>;
-    _onValueChange(e: Event): void;
-    get tabContainer(): HTMLElement;
-    _onMappingChanged(e: CustomEvent): Promise<void>;
-    _onTabScroll(): void;
-    _onTabScrollNavLeft(): void;
-    _onTabScrollNavRight(): void;
-}
-export {};

package/dist/src/modeller/property-sidebar/data-binding/data-binding.js

@@ -1,458 +0,0 @@
-/**
- * @license Copyright © HatioLab Inc. All rights reserved.
- */
-import { __decorate } from "tslib";
-import '@material/web/icon/icon.js';
-import '@operato/help/ox-title-with-help.js';
-import '@operato/input/ox-buttons-radio.js';
-import '@operato/input/ox-input-data.js';
-import '@operato/i18n/ox-i18n.js';
-import { css, html } from 'lit';
-import { property, query, state } from 'lit/decorators.js';
-import { ScopedElementsMixin } from '@open-wc/scoped-elements';
-import { AbstractProperty } from '../abstract-property.js';
-import { PropertySharedStyle } from '../property-shared-style.js';
-import { DataBindingMapper } from './data-binding-mapper.js';
-var clipboard = '{}';
-const PROPS = [
-    '',
-    'text',
-    ['fillStyle', 'fill style'],
-    ['strokeStyle', 'stroke style'],
-    ['fontColor', 'font color'],
-    'value',
-    'data',
-    'source',
-    'hidden',
-    'started',
-    'play',
-    ['ref', 'reference'],
-    'action',
-    'options',
-    'rotate',
-    'dimension',
-    'location',
-    'accessor',
-    ['tap', '(tap)'],
-    '(action)'
-].map(prop => {
-    return typeof prop == 'string' ? { name: prop, label: prop } : { name: prop[0], label: prop[1] };
-});
-export class PropertyDataBinding extends ScopedElementsMixin(AbstractProperty) {
-    constructor() {
-        super(...arguments);
-        this.mappingIndex = 0;
-        this._dataExpanded = false;
-        this.mapping = {};
-    }
-    get mappings() {
-        var _a;
-        return ((_a = this.value) === null || _a === void 0 ? void 0 : _a.mappings) || [];
-    }
-    firstUpdated() {
-        this.renderRoot.addEventListener('change', this._onValueChange.bind(this));
-        this.tabContainer.addEventListener('scroll', () => {
-            this._onTabScroll();
-        });
-    }
-    updated(changes) {
-        if (changes.has('value')) {
-            this._onValueChanged();
-        }
-    }
-    static get scopedElements() {
-        return {
-            'data-binding-mapper': DataBindingMapper
-        };
-    }
-    render() {
-        const value = this.value || {
-            mappings: []
-        };
-        return html `
-      <fieldset>
-        <legend>
-          <ox-title-with-help topic="board-modeller/data-binding" msgid="label.identifier"
-            >identifier</ox-title-with-help
-          >
-        </legend>
-        <div class="property-grid">
-          <label> <ox-i18n msgid="label.id">ID</ox-i18n> </label>
-          <input value-key="id" .value=${value.id || ''} />
-
-          <label> <ox-i18n msgid="label.class">Class</ox-i18n> </label>
-          <input value-key="class" .value=${value.class || ''} />
-
-          <label> <ox-i18n msgid="label.tag">Tag</ox-i18n> </label>
-          <input value-key="tag" .value=${value.tag || ''} />
-
-          <label> <ox-i18n msgid="label.template-prefix">Template Prefix</ox-i18n> </label>
-          <input value-key="templatePrefix" .value=${value.templatePrefix || ''} />
-
-          <div class="checkbox-row">
-            <input id="checkbox-ndns" type="checkbox" value-key="ndns" .checked=${value.ndns} />
-            <label for="checkbox-ndns"> <ox-i18n msgid="label.ndns">No Data No Show</ox-i18n> </label>
-          </div>
-
-          <div class="checkbox-row">
-            <input id="checkbox-sensitive" type="checkbox" value-key="sensitive" .checked=${value.sensitive} />
-            <label for="checkbox-sensitive">
-              <ox-i18n msgid="label.intent-sensitive">Intent Sensitive</ox-i18n>
-            </label>
-          </div>
-
-          <div class="checkbox-row">
-            <input id="checkbox-persistent" type="checkbox" value-key="persistent" .checked=${value.persistent} />
-            <label for="checkbox-persistent">
-              <ox-i18n msgid="label.persistent-data">Persistent Data</ox-i18n>
-            </label>
-          </div>
-        </div>
-      </fieldset>
-
-      <fieldset collapsable ?collapsed=${!this._dataExpanded}>
-        <legend>
-          <ox-title-with-help topic="board-modeller/initial-data" msgid="label.initial-data"
-            >initial value</ox-title-with-help
-          >
-          <md-icon
-            @click=${() => {
-            this._dataExpanded = !this._dataExpanded;
-        }}
-            >${this._dataExpanded ? 'expand_less' : 'expand_more'}</md-icon
-          >
-        </legend>
-        <ox-input-data value-key="data" .value=${value.data}> </ox-input-data>
-      </fieldset>
-
-      <fieldset>
-        <legend>
-          <ox-title-with-help topic="board-modeller/data-spread" msgid="label.data-spread"
-            >Data Spread</ox-title-with-help
-          >
-        </legend>
-
-        <div id="tab-header">
-          <md-icon
-            id="tab-nav-left-button"
-            @click=${() => {
-            this._onTabScrollNavLeft();
-        }}
-            disabled
-            >chevron_left</md-icon
-          >
-
-          <ox-buttons-radio
-            id="tabs"
-            .value=${String(this.mappingIndex)}
-            @change=${(e) => {
-            e.stopPropagation();
-            this._setMappingIndex(e.target.value);
-        }}
-          >
-            ${this.mappings.map((m, i) => html ` <div data-value=${i} data-mapping>${i + 1}</div> `)}
-            <div data-value=${this.mappings.length} data-mapping disabled>${this.mappings.length + 1}</div>
-          </ox-buttons-radio>
-
-          <md-icon
-            id="tab-nav-right-button"
-            @click=${(e) => {
-            this._onTabScrollNavRight();
-        }}
-            disabled
-            >chevron_right</md-icon
-          >
-        </div>
-
-        <div binding>
-          <md-icon style="font-size:19px" @click=${() => this._clearDataBindingMapper()} title="delete current tab"
-            >delete_forever</md-icon
-          >
-          <md-icon @click=${() => this._pasteDataBindingMapper()} title="replace current tab">content_paste</md-icon>
-          <md-icon style="font-size:17px" @click=${() => this._copyDataBindingMapper()} title="copy current tab"
-            >content_copy</md-icon
-          >
-        </div>
-
-        <data-binding-mapper
-          @value-change=${(e) => this._onMappingChanged(e)}
-          .scene=${this.scene}
-          .mapping=${(value.mappings && value.mappings[this.mappingIndex]) || {}}
-          .properties=${PROPS}
-        >
-        </data-binding-mapper>
-      </fieldset>
-    `;
-    }
-    _setMappingIndex(idx) {
-        this.mappingIndex = isNaN(Number(idx)) ? 0 : Number(idx);
-        this._onTabScroll();
-    }
-    _clearDataBindingMapper() {
-        var _a;
-        var mappings = [...(((_a = this.value) === null || _a === void 0 ? void 0 : _a.mappings) || [])];
-        mappings.splice(this.mappingIndex, 1);
-        this._onAfterValueChange('mappings', mappings.filter(m => !!m));
-    }
-    _copyDataBindingMapper() {
-        clipboard = JSON.stringify(this.mappings[this.mappingIndex]);
-    }
-    async _pasteDataBindingMapper() {
-        var _a;
-        var index = this.mappingIndex;
-        var mappings = [...(((_a = this.value) === null || _a === void 0 ? void 0 : _a.mappings) || [])];
-        mappings[this.mappingIndex] = JSON.parse(clipboard);
-        this._onAfterValueChange('mappings', mappings);
-        setTimeout(() => {
-            this._setMappingIndex(index);
-        }, 100);
-    }
-    async _onValueChanged() {
-        await this.updateComplete;
-        if (this._afterRender) {
-            this._afterRender();
-        }
-        else {
-            this._setMappingIndex(0);
-        }
-        this._afterRender = null;
-    }
-    _onValueChange(e) {
-        var element = e.target;
-        var key = element.getAttribute('value-key');
-        var value = this._getValueFromEventTarget(element);
-        if (!key) {
-            return;
-        }
-        this.value = {
-            ...this.value,
-            [key]: value
-        };
-        this._onAfterValueChange(key, value);
-    }
-    get tabContainer() {
-        return this.tabs;
-    }
-    async _onMappingChanged(e) {
-        var _a, _b;
-        var mapping = e.target.mapping;
-        /* data spread target의 변경이 있는 경우, target 컴포넌트들의 태그를 블링크 시킨다 */
-        if (mapping && mapping.target) {
-            this.scene &&
-                this.scene.findAll(mapping.target, this.scene.selected && this.scene.selected[0]).forEach((c, i) => {
-                    if (i == 0)
-                        c.trigger('decotagreset');
-                    c.trigger('decotag', {});
-                });
-        }
-        /* mapping의 모든 속성이 편집되면, 모델에 반영한다. */
-        var mappings = [...(((_a = this.value) === null || _a === void 0 ? void 0 : _a.mappings) || [])];
-        if (mapping.target && mapping.property && mapping.rule) {
-            mappings[this.mappingIndex] = mapping;
-            var mappingIdx = this.mappingIndex;
-            this._afterRender = () => {
-                this._setMappingIndex(mappingIdx);
-                this.tabContainer.scrollLeft = this.tabContainer.scrollWidth;
-            };
-            this.dispatchEvent(new CustomEvent('property-change', {
-                bubbles: true,
-                composed: true,
-                detail: {
-                    mappings: mappings.filter(m => !!m)
-                }
-            }));
-            await this.requestUpdate();
-        }
-        else if (!mapping.target && !mapping.property) {
-            const { accessor, source } = ((_b = e.detail) === null || _b === void 0 ? void 0 : _b.changed) || {};
-            // accessor나 source를 입력중인 경우 tabIndex Change 방지
-            if (!accessor && !source) {
-                mappings[this.mappingIndex] = null;
-                var nextMappingIdx = Math.max(this.mappingIndex - 1, 0);
-                this._afterRender = () => {
-                    this._setMappingIndex(nextMappingIdx);
-                };
-                this.dispatchEvent(new CustomEvent('property-change', {
-                    bubbles: true,
-                    composed: true,
-                    detail: {
-                        mappings: mappings.filter(m => !!m)
-                    }
-                }));
-            }
-        }
-    }
-    _onTabScroll() {
-        if (this.tabContainer.clientWidth == this.tabContainer.scrollWidth) {
-            this.tabNavLeftButton.setAttribute('disabled', '');
-            this.tabNavRightButton.setAttribute('disabled', '');
-        }
-        // left-end
-        else if (this.tabContainer.scrollLeft == 0) {
-            this.tabNavLeftButton.setAttribute('disabled', '');
-            this.tabNavRightButton.removeAttribute('disabled');
-        }
-        // right-end
-        else if (this.tabContainer.scrollLeft + this.tabContainer.clientWidth >= this.tabContainer.scrollWidth) {
-            this.tabNavLeftButton.removeAttribute('disabled');
-            this.tabNavRightButton.setAttribute('disabled', '');
-        }
-        else {
-            this.tabNavLeftButton.removeAttribute('disabled');
-            this.tabNavRightButton.removeAttribute('disabled');
-        }
-    }
-    _onTabScrollNavLeft() {
-        this.tabContainer.style.scrollBehavior = 'smooth';
-        this.tabContainer.scrollLeft -= this.tabContainer.clientWidth;
-        this.tabContainer.style.scrollBehavior = 'auto';
-    }
-    _onTabScrollNavRight() {
-        this.tabContainer.style.scrollBehavior = 'smooth';
-        this.tabContainer.scrollLeft += this.tabContainer.clientWidth;
-        this.tabContainer.style.scrollBehavior = 'auto';
-    }
-}
-PropertyDataBinding.styles = [
-    PropertySharedStyle,
-    css `
-      #tab-header {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-      }
-
-      #tab-header > md-icon {
-        padding: 0;
-        margin: 0;
-        width: 25px;
-        height: 25px;
-        font-size: x-large;
-        border-bottom: 1px solid rgba(0, 0, 0, 0.2);
-      }
-
-      fieldset[collapsable] legend {
-        box-sizing: border-box;
-        width: 100%;
-      }
-
-      fieldset[collapsable] legend md-icon {
-        float: right;
-        font-size: medium;
-        margin: 0;
-      }
-
-      fieldset[collapsable][collapsed] > :not(legend) {
-        display: none;
-      }
-
-      ox-buttons-radio {
-        flex: 1;
-        height: 25px;
-        border: 1px solid rgba(0, 0, 0, 0.2);
-        border-width: 1px 1px 0 1px;
-        text-align: center;
-
-        display: flex;
-        padding: 0;
-        box-sizing: border-box;
-
-        width: 0; /* limit width */
-        overflow-x: hidden;
-      }
-
-      ox-buttons-radio > div {
-        background-color: rgba(0, 0, 0, 0.2);
-        border: 1px solid rgba(0, 0, 0, 0.07);
-        border-width: 0 0 2px 0;
-        padding: 0;
-        color: #fff;
-        font-size: 13px;
-        max-width: 25px;
-        min-width: 25px;
-      }
-
-      ox-buttons-radio > div[disabled] {
-        background-color: rgba(0, 0, 0, 0.1);
-      }
-
-      ox-buttons-radio > div[active] {
-        border-color: rgb(242, 71, 28);
-      }
-
-      ox-buttons-radio > div.iron-selected {
-        background-color: var(--md-sys-color-surface);
-        color: var(--md-sys-color-on-surface);
-      }
-
-      div[binding] {
-        display: flex;
-        flex-direction: row-reverse;
-        background-color: var(--md-sys-color-surface);
-        color: var(--md-sys-color-on-surface);
-        overflow: hidden;
-        border-style: solid;
-        border-color: rgba(0, 0, 0, 0.2);
-        border-image: initial;
-        border-width: 0px 1px;
-        padding: 7px 5px 2px 5px;
-      }
-
-      md-icon {
-        margin-left: 5px;
-        color: var(--md-sys-color-on-secondary-container);
-        opacity: 0.8;
-        cursor: pointer;
-        --md-icon-size: 18px;
-      }
-
-      md-icon:hover {
-        color: var(--md-sys-color-on-primary-container);
-        opacity: 1;
-      }
-
-      md-icon[disabled] {
-        color: rgba(0, 0, 0, 0.1);
-      }
-
-      data-binding-mapper {
-        --things-select: {
-          min-width: 50%;
-          margin-bottom: 10px;
-          padding: 3px 20px 2px 5px;
-          -webkit-border-radius: 4px;
-          -moz-border-radius: 4px;
-          border-radius: 4px;
-          border: 1px solid rgba(0, 0, 0, 0.15);
-          font-size: 15px;
-          font-weight: 300;
-          -webkit-appearance: none;
-        };
-      }
-    `
-];
-__decorate([
-    property({ type: Object })
-], PropertyDataBinding.prototype, "value", void 0);
-__decorate([
-    property({ type: Object })
-], PropertyDataBinding.prototype, "scene", void 0);
-__decorate([
-    state()
-], PropertyDataBinding.prototype, "mappingIndex", void 0);
-__decorate([
-    state()
-], PropertyDataBinding.prototype, "_afterRender", void 0);
-__decorate([
-    state()
-], PropertyDataBinding.prototype, "_dataExpanded", void 0);
-__decorate([
-    query('#tabs')
-], PropertyDataBinding.prototype, "tabs", void 0);
-__decorate([
-    query('#tab-nav-left-button')
-], PropertyDataBinding.prototype, "tabNavLeftButton", void 0);
-__decorate([
-    query('#tab-nav-right-button')
-], PropertyDataBinding.prototype, "tabNavRightButton", void 0);
-//# sourceMappingURL=data-binding.js.map

package/dist/src/modeller/property-sidebar/data-binding/data-binding.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"data-binding.js","sourceRoot":"","sources":["../../../../../src/modeller/property-sidebar/data-binding/data-binding.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@material/web/icon/icon.js'\nimport '@operato/help/ox-title-with-help.js'\nimport '@operato/input/ox-buttons-radio.js'\nimport '@operato/input/ox-input-data.js'\nimport '@operato/i18n/ox-i18n.js'\n\nimport { css, html, PropertyValues } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\n\nimport { Properties, Scene } from '@hatiolab/things-scene'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\n\nimport { AbstractProperty } from '../abstract-property.js'\nimport { PropertySharedStyle } from '../property-shared-style.js'\nimport { DataBindingMapper } from './data-binding-mapper.js'\n\nvar clipboard = '{}'\n\nconst PROPS = [\n  '',\n  'text',\n  ['fillStyle', 'fill style'],\n  ['strokeStyle', 'stroke style'],\n  ['fontColor', 'font color'],\n  'value',\n  'data',\n  'source',\n  'hidden',\n  'started',\n  'play',\n  ['ref', 'reference'],\n  'action',\n  'options',\n  'rotate',\n  'dimension',\n  'location',\n  'accessor',\n  ['tap', '(tap)'],\n  '(action)'\n].map(prop => {\n  return typeof prop == 'string' ? { name: prop, label: prop } : { name: prop[0], label: prop[1] }\n})\n\nexport class PropertyDataBinding extends ScopedElementsMixin(AbstractProperty) {\n  static styles = [\n    PropertySharedStyle,\n    css`\n      #tab-header {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n      }\n\n      #tab-header > md-icon {\n        padding: 0;\n        margin: 0;\n        width: 25px;\n        height: 25px;\n        font-size: x-large;\n        border-bottom: 1px solid rgba(0, 0, 0, 0.2);\n      }\n\n      fieldset[collapsable] legend {\n        box-sizing: border-box;\n        width: 100%;\n      }\n\n      fieldset[collapsable] legend md-icon {\n        float: right;\n        font-size: medium;\n        margin: 0;\n      }\n\n      fieldset[collapsable][collapsed] > :not(legend) {\n        display: none;\n      }\n\n      ox-buttons-radio {\n        flex: 1;\n        height: 25px;\n        border: 1px solid rgba(0, 0, 0, 0.2);\n        border-width: 1px 1px 0 1px;\n        text-align: center;\n\n        display: flex;\n        padding: 0;\n        box-sizing: border-box;\n\n        width: 0; /* limit width */\n        overflow-x: hidden;\n      }\n\n      ox-buttons-radio > div {\n        background-color: rgba(0, 0, 0, 0.2);\n        border: 1px solid rgba(0, 0, 0, 0.07);\n        border-width: 0 0 2px 0;\n        padding: 0;\n        color: #fff;\n        font-size: 13px;\n        max-width: 25px;\n        min-width: 25px;\n      }\n\n      ox-buttons-radio > div[disabled] {\n        background-color: rgba(0, 0, 0, 0.1);\n      }\n\n      ox-buttons-radio > div[active] {\n        border-color: rgb(242, 71, 28);\n      }\n\n      ox-buttons-radio > div.iron-selected {\n        background-color: var(--md-sys-color-surface);\n        color: var(--md-sys-color-on-surface);\n      }\n\n      div[binding] {\n        display: flex;\n        flex-direction: row-reverse;\n        background-color: var(--md-sys-color-surface);\n        color: var(--md-sys-color-on-surface);\n        overflow: hidden;\n        border-style: solid;\n        border-color: rgba(0, 0, 0, 0.2);\n        border-image: initial;\n        border-width: 0px 1px;\n        padding: 7px 5px 2px 5px;\n      }\n\n      md-icon {\n        margin-left: 5px;\n        color: var(--md-sys-color-on-secondary-container);\n        opacity: 0.8;\n        cursor: pointer;\n        --md-icon-size: 18px;\n      }\n\n      md-icon:hover {\n        color: var(--md-sys-color-on-primary-container);\n        opacity: 1;\n      }\n\n      md-icon[disabled] {\n        color: rgba(0, 0, 0, 0.1);\n      }\n\n      data-binding-mapper {\n        --things-select: {\n          min-width: 50%;\n          margin-bottom: 10px;\n          padding: 3px 20px 2px 5px;\n          -webkit-border-radius: 4px;\n          -moz-border-radius: 4px;\n          border-radius: 4px;\n          border: 1px solid rgba(0, 0, 0, 0.15);\n          font-size: 15px;\n          font-weight: 300;\n          -webkit-appearance: none;\n        };\n      }\n    `\n  ]\n\n  @property({ type: Object }) value?: Properties\n  @property({ type: Object }) scene?: Scene\n\n  @state() mappingIndex: number = 0\n  @state() _afterRender?: Function | null\n  @state() _dataExpanded: boolean = false\n\n  @query('#tabs') tabs!: HTMLElement\n  @query('#tab-nav-left-button') tabNavLeftButton!: HTMLElement\n  @query('#tab-nav-right-button') tabNavRightButton!: HTMLElement\n\n  private mapping: Properties = {}\n\n  get mappings() {\n    return this.value?.mappings || []\n  }\n\n  firstUpdated() {\n    this.renderRoot.addEventListener('change', this._onValueChange.bind(this))\n\n    this.tabContainer.addEventListener('scroll', () => {\n      this._onTabScroll()\n    })\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('value')) {\n      this._onValueChanged()\n    }\n  }\n\n  static get scopedElements() {\n    return {\n      'data-binding-mapper': DataBindingMapper\n    }\n  }\n\n  render() {\n    const value = this.value || {\n      mappings: []\n    }\n\n    return html`\n      <fieldset>\n        <legend>\n          <ox-title-with-help topic=\"board-modeller/data-binding\" msgid=\"label.identifier\"\n            >identifier</ox-title-with-help\n          >\n        </legend>\n        <div class=\"property-grid\">\n          <label> <ox-i18n msgid=\"label.id\">ID</ox-i18n> </label>\n          <input value-key=\"id\" .value=${value.id || ''} />\n\n          <label> <ox-i18n msgid=\"label.class\">Class</ox-i18n> </label>\n          <input value-key=\"class\" .value=${value.class || ''} />\n\n          <label> <ox-i18n msgid=\"label.tag\">Tag</ox-i18n> </label>\n          <input value-key=\"tag\" .value=${value.tag || ''} />\n\n          <label> <ox-i18n msgid=\"label.template-prefix\">Template Prefix</ox-i18n> </label>\n          <input value-key=\"templatePrefix\" .value=${value.templatePrefix || ''} />\n\n          <div class=\"checkbox-row\">\n            <input id=\"checkbox-ndns\" type=\"checkbox\" value-key=\"ndns\" .checked=${value.ndns} />\n            <label for=\"checkbox-ndns\"> <ox-i18n msgid=\"label.ndns\">No Data No Show</ox-i18n> </label>\n          </div>\n\n          <div class=\"checkbox-row\">\n            <input id=\"checkbox-sensitive\" type=\"checkbox\" value-key=\"sensitive\" .checked=${value.sensitive} />\n            <label for=\"checkbox-sensitive\">\n              <ox-i18n msgid=\"label.intent-sensitive\">Intent Sensitive</ox-i18n>\n            </label>\n          </div>\n\n          <div class=\"checkbox-row\">\n            <input id=\"checkbox-persistent\" type=\"checkbox\" value-key=\"persistent\" .checked=${value.persistent} />\n            <label for=\"checkbox-persistent\">\n              <ox-i18n msgid=\"label.persistent-data\">Persistent Data</ox-i18n>\n            </label>\n          </div>\n        </div>\n      </fieldset>\n\n      <fieldset collapsable ?collapsed=${!this._dataExpanded}>\n        <legend>\n          <ox-title-with-help topic=\"board-modeller/initial-data\" msgid=\"label.initial-data\"\n            >initial value</ox-title-with-help\n          >\n          <md-icon\n            @click=${() => {\n              this._dataExpanded = !this._dataExpanded\n            }}\n            >${this._dataExpanded ? 'expand_less' : 'expand_more'}</md-icon\n          >\n        </legend>\n        <ox-input-data value-key=\"data\" .value=${value.data}> </ox-input-data>\n      </fieldset>\n\n      <fieldset>\n        <legend>\n          <ox-title-with-help topic=\"board-modeller/data-spread\" msgid=\"label.data-spread\"\n            >Data Spread</ox-title-with-help\n          >\n        </legend>\n\n        <div id=\"tab-header\">\n          <md-icon\n            id=\"tab-nav-left-button\"\n            @click=${() => {\n              this._onTabScrollNavLeft()\n            }}\n            disabled\n            >chevron_left</md-icon\n          >\n\n          <ox-buttons-radio\n            id=\"tabs\"\n            .value=${String(this.mappingIndex)}\n            @change=${(e: Event) => {\n              e.stopPropagation()\n              this._setMappingIndex((e.target as any).value)\n            }}\n          >\n            ${this.mappings.map((m: string, i: number) => html` <div data-value=${i} data-mapping>${i + 1}</div> `)}\n            <div data-value=${this.mappings.length} data-mapping disabled>${this.mappings.length + 1}</div>\n          </ox-buttons-radio>\n\n          <md-icon\n            id=\"tab-nav-right-button\"\n            @click=${(e: Event) => {\n              this._onTabScrollNavRight()\n            }}\n            disabled\n            >chevron_right</md-icon\n          >\n        </div>\n\n        <div binding>\n          <md-icon style=\"font-size:19px\" @click=${() => this._clearDataBindingMapper()} title=\"delete current tab\"\n            >delete_forever</md-icon\n          >\n          <md-icon @click=${() => this._pasteDataBindingMapper()} title=\"replace current tab\">content_paste</md-icon>\n          <md-icon style=\"font-size:17px\" @click=${() => this._copyDataBindingMapper()} title=\"copy current tab\"\n            >content_copy</md-icon\n          >\n        </div>\n\n        <data-binding-mapper\n          @value-change=${(e: CustomEvent) => this._onMappingChanged(e)}\n          .scene=${this.scene}\n          .mapping=${(value.mappings && value.mappings[this.mappingIndex]) || {}}\n          .properties=${PROPS}\n        >\n        </data-binding-mapper>\n      </fieldset>\n    `\n  }\n\n  _setMappingIndex(idx: number) {\n    this.mappingIndex = isNaN(Number(idx)) ? 0 : Number(idx)\n\n    this._onTabScroll()\n  }\n\n  _clearDataBindingMapper() {\n    var mappings = [...(this.value?.mappings || [])]\n    mappings.splice(this.mappingIndex, 1)\n    this._onAfterValueChange(\n      'mappings',\n      mappings.filter(m => !!m)\n    )\n  }\n\n  _copyDataBindingMapper() {\n    clipboard = JSON.stringify(this.mappings[this.mappingIndex])\n  }\n\n  async _pasteDataBindingMapper() {\n    var index = this.mappingIndex\n    var mappings = [...(this.value?.mappings || [])]\n    mappings[this.mappingIndex] = JSON.parse(clipboard)\n\n    this._onAfterValueChange('mappings', mappings)\n\n    setTimeout(() => {\n      this._setMappingIndex(index)\n    }, 100)\n  }\n\n  async _onValueChanged() {\n    await this.updateComplete\n\n    if (this._afterRender) {\n      this._afterRender()\n    } else {\n      this._setMappingIndex(0)\n    }\n\n    this._afterRender = null\n  }\n\n  _onValueChange(e: Event) {\n    var element = e.target as HTMLElement\n    var key = element.getAttribute('value-key')\n\n    var value = this._getValueFromEventTarget(element)\n\n    if (!key) {\n      return\n    }\n\n    this.value = {\n      ...this.value,\n      [key]: value\n    }\n\n    this._onAfterValueChange(key, value)\n  }\n\n  get tabContainer() {\n    return this.tabs\n  }\n\n  async _onMappingChanged(e: CustomEvent) {\n    var mapping = (e.target as any).mapping\n\n    /* data spread target의 변경이 있는 경우, target 컴포넌트들의 태그를 블링크 시킨다 */\n    if (mapping && mapping.target) {\n      this.scene &&\n        this.scene.findAll(mapping.target, this.scene.selected && this.scene.selected[0]).forEach((c, i) => {\n          if (i == 0) c.trigger('decotagreset')\n          c.trigger('decotag', {})\n        })\n    }\n\n    /* mapping의 모든 속성이 편집되면, 모델에 반영한다. */\n    var mappings = [...(this.value?.mappings || [])]\n\n    if (mapping.target && mapping.property && mapping.rule) {\n      mappings[this.mappingIndex] = mapping\n\n      var mappingIdx = this.mappingIndex\n      this._afterRender = () => {\n        this._setMappingIndex(mappingIdx)\n        this.tabContainer.scrollLeft = this.tabContainer.scrollWidth\n      }\n\n      this.dispatchEvent(\n        new CustomEvent('property-change', {\n          bubbles: true,\n          composed: true,\n          detail: {\n            mappings: mappings.filter(m => !!m)\n          }\n        })\n      )\n\n      await this.requestUpdate()\n    } else if (!mapping.target && !mapping.property) {\n      const { accessor, source } = e.detail?.changed || {}\n\n      // accessor나 source를 입력중인 경우 tabIndex Change 방지\n      if (!accessor && !source) {\n        mappings[this.mappingIndex] = null\n        var nextMappingIdx = Math.max(this.mappingIndex - 1, 0)\n        this._afterRender = () => {\n          this._setMappingIndex(nextMappingIdx)\n        }\n        this.dispatchEvent(\n          new CustomEvent('property-change', {\n            bubbles: true,\n            composed: true,\n            detail: {\n              mappings: mappings.filter(m => !!m)\n            }\n          })\n        )\n      }\n    }\n  }\n\n  _onTabScroll() {\n    if (this.tabContainer.clientWidth == this.tabContainer.scrollWidth) {\n      this.tabNavLeftButton.setAttribute('disabled', '')\n      this.tabNavRightButton.setAttribute('disabled', '')\n    }\n    // left-end\n    else if (this.tabContainer.scrollLeft == 0) {\n      this.tabNavLeftButton.setAttribute('disabled', '')\n      this.tabNavRightButton.removeAttribute('disabled')\n    }\n    // right-end\n    else if (this.tabContainer.scrollLeft + this.tabContainer.clientWidth >= this.tabContainer.scrollWidth) {\n      this.tabNavLeftButton.removeAttribute('disabled')\n      this.tabNavRightButton.setAttribute('disabled', '')\n    } else {\n      this.tabNavLeftButton.removeAttribute('disabled')\n      this.tabNavRightButton.removeAttribute('disabled')\n    }\n  }\n\n  _onTabScrollNavLeft() {\n    this.tabContainer.style.scrollBehavior = 'smooth'\n    this.tabContainer.scrollLeft -= this.tabContainer.clientWidth\n    this.tabContainer.style.scrollBehavior = 'auto'\n  }\n\n  _onTabScrollNavRight() {\n    this.tabContainer.style.scrollBehavior = 'smooth'\n    this.tabContainer.scrollLeft += this.tabContainer.clientWidth\n    this.tabContainer.style.scrollBehavior = 'auto'\n  }\n}\n"]}

package/dist/src/modeller/property-sidebar/effects/effects-shared-style.d.ts

@@ -1,4 +0,0 @@
-/**
- * @license Copyright © HatioLab Inc. All rights reserved.
- */
-export declare const EffectsSharedStyle: import("lit").CSSResult;