@api-client/ui 0.0.17 → 0.1.0

package/build/src/elements/schema-design/DataEntityEditorElement.d.ts

@@ -1,69 +0,0 @@
-import { CSSResult, PropertyValues, TemplateResult } from 'lit';
-import { DataNamespace } from '@api-client/core/legacy.js';
-import ApiElement from '../ApiElement.js';
-import type DataSchemaDocument from './DataSchemaDocument.js';
-import '../../md/icons/ui-icon.js';
-import '../../md/icon-button/ui-icon-button.js';
-import '../../md/checkbox/ui-checkbox.js';
-import '../../md/radio/ui-radio.js';
-import '../../elements/highlight/marked-highlight.js';
-import './data-association-form.js';
-import './data-property-form.js';
-import './data-entity-form.js';
-import './data-schema-document.js';
-/**
- * The DataEntity editor UI and logic.
- *
- * @fires change - When the entity has changed and the parent element / app should update the value in the store.
- * @fires namechange - When a name of the data entity has changed.
- *    This triggers a render in the navigation. This is fired after the `change` event.
- */
-export default class DataEntityEditorElement extends ApiElement {
-    static get styles(): CSSResult[];
-    /**
-     * The read data namespace.
-     */
-    accessor root: DataNamespace | undefined;
-    /**
-     * The selected entity.
-     */
-    accessor selected: string | undefined;
-    /**
-     * The key of the selected property being edited.
-     */
-    accessor selectedProperty: string | undefined;
-    /**
-     * The key of the selected association being edited.
-     */
-    accessor selectedAssociation: string | undefined;
-    protected accessor _highlightEntityDropZone: boolean | undefined;
-    protected accessor _schemaExample: string | number | boolean | null | undefined;
-    protected accessor _schemaMime: string;
-    protected accessor _schemaMock: boolean | undefined;
-    protected _schemaOpened?: boolean;
-    protected accessor _schemaDoc: DataSchemaDocument;
-    constructor();
-    protected willUpdate(cp: PropertyValues<this>): void;
-    notifyChange(): void;
-    protected _dragEnterHandler(e: DragEvent): void;
-    protected _dragLeaveHandler(e: DragEvent): void;
-    protected _propertyChangeHandler(): void;
-    protected _entityChangeHandler(): void;
-    protected _schemaEntityChangeHandler(): void;
-    protected _schemaEntityEditHandler(e: CustomEvent): void;
-    protected _entityNameHandler(): void;
-    protected _cancelEditor(): void;
-    protected _computeExampleSchema(): void;
-    protected _computeExampleSchemaIfNeeded(): void;
-    protected _schemaOpenHandler(e: Event): void;
-    protected _schemaMimeHandler(e: Event): void;
-    protected _mockSchemaValuesHandler(e: Event): void;
-    protected render(): TemplateResult;
-    protected _structureTemplate(): TemplateResult;
-    protected _editorTemplate(): TemplateResult;
-    protected _propertyEditorTemplate(id: string): TemplateResult;
-    protected _associationEditorTemplate(id: string): TemplateResult;
-    protected renderEntityEditor(): TemplateResult;
-    protected renderSchema(): TemplateResult;
-}
-//# sourceMappingURL=DataEntityEditorElement.d.ts.map

package/build/src/elements/schema-design/DataEntityEditorElement.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DataEntityEditorElement.d.ts","sourceRoot":"","sources":["../../../../src/elements/schema-design/DataEntityEditorElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,SAAS,EAAQ,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAA;AAG1E,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAC1D,OAAO,UAAU,MAAM,kBAAkB,CAAA;AAMzC,OAAO,KAAK,kBAAkB,MAAM,yBAAyB,CAAA;AAG7D,OAAO,2BAA2B,CAAA;AAClC,OAAO,wCAAwC,CAAA;AAC/C,OAAO,kCAAkC,CAAA;AACzC,OAAO,4BAA4B,CAAA;AACnC,OAAO,8CAA8C,CAAA;AACrD,OAAO,4BAA4B,CAAA;AACnC,OAAO,yBAAyB,CAAA;AAChC,OAAO,uBAAuB,CAAA;AAC9B,OAAO,2BAA2B,CAAA;AAElC;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,OAAO,uBAAwB,SAAQ,UAAU;IAC7D,WAAoB,MAAM,IAAI,SAAS,EAAE,CAoDxC;IAED;;OAEG;IACyB,QAAQ,CAAC,IAAI,EAAE,aAAa,GAAG,SAAS,CAAA;IAEpE;;OAEG;IACyB,QAAQ,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAA;IAEjE;;OAEG;IACyB,QAAQ,CAAC,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAA;IAEzE;;OAEG;IACyB,QAAQ,CAAC,mBAAmB,EAAE,MAAM,GAAG,SAAS,CAAA;IAEnE,SAAS,CAAC,QAAQ,CAAC,wBAAwB,EAAE,OAAO,GAAG,SAAS,CAAA;IAEhE,SAAS,CAAC,QAAQ,CAAC,cAAc,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,GAAG,SAAS,CAAA;IAE/E,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAA;IAEtC,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,OAAO,GAAG,SAAS,CAAA;IAE5D,SAAS,CAAC,aAAa,CAAC,EAAE,OAAO,CAAA;IAEF,SAAS,CAAC,QAAQ,CAAC,UAAU,EAAG,kBAAkB,CAAA;;cAU9D,UAAU,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAOpD,YAAY,IAAI,IAAI;IAO7B,SAAS,CAAC,iBAAiB,CAAC,CAAC,EAAE,SAAS,GAAG,IAAI;IAa/C,SAAS,CAAC,iBAAiB,CAAC,CAAC,EAAE,SAAS,GAAG,IAAI;IAW/C,SAAS,CAAC,sBAAsB,IAAI,IAAI;IASxC,SAAS,CAAC,oBAAoB,IAAI,IAAI;IAStC,SAAS,CAAC,0BAA0B,IAAI,IAAI;IAM5C,SAAS,CAAC,wBAAwB,CAAC,CAAC,EAAE,WAAW,GAAG,IAAI;IAYxD,SAAS,CAAC,kBAAkB,IAAI,IAAI;IAMpC,SAAS,CAAC,aAAa,IAAI,IAAI;IAK/B,SAAS,CAAC,qBAAqB,IAAI,IAAI;IAcvC,SAAS,CAAC,6BAA6B,IAAI,IAAI;IAM/C,SAAS,CAAC,kBAAkB,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAQ5C,SAAS,CAAC,kBAAkB,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAS5C,SAAS,CAAC,wBAAwB,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;cAO/B,MAAM,IAAI,cAAc;IAI3C,SAAS,CAAC,kBAAkB,IAAI,cAAc;IAiB9C,SAAS,CAAC,eAAe,IAAI,cAAc;IAa3C,SAAS,CAAC,uBAAuB,CAAC,EAAE,EAAE,MAAM,GAAG,cAAc;IAiB7D,SAAS,CAAC,0BAA0B,CAAC,EAAE,EAAE,MAAM,GAAG,cAAc;IAiBhE,SAAS,CAAC,kBAAkB,IAAI,cAAc;IAc9C,SAAS,CAAC,YAAY,IAAI,cAAc;CAuCzC"}

package/build/src/elements/schema-design/DataEntityEditorElement.js

@@ -1,415 +0,0 @@
-import { __esDecorate, __runInitializers } from "tslib";
-import { css, html } from 'lit';
-import { property, query, state } from 'lit/decorators.js';
-import { DataEntityKind } from '@api-client/core/browser.js';
-import ApiElement from '../ApiElement.js';
-import theme from '../theme.js';
-import schemaCommon from './schemaCommon.js';
-import EditorCommon from './CommonStyles.js';
-import MarkdownStyles from '../highlight/MarkdownStyles.js';
-import typography from '../../styles/m3/typography.module.js';
-import '../../md/icons/ui-icon.js';
-import '../../md/icon-button/ui-icon-button.js';
-import '../../md/checkbox/ui-checkbox.js';
-import '../../md/radio/ui-radio.js';
-import '../../elements/highlight/marked-highlight.js';
-import './data-association-form.js';
-import './data-property-form.js';
-import './data-entity-form.js';
-import './data-schema-document.js';
-let DataEntityEditorElement = (() => {
-    let _classSuper = ApiElement;
-    let _root_decorators;
-    let _root_initializers = [];
-    let _root_extraInitializers = [];
-    let _selected_decorators;
-    let _selected_initializers = [];
-    let _selected_extraInitializers = [];
-    let _selectedProperty_decorators;
-    let _selectedProperty_initializers = [];
-    let _selectedProperty_extraInitializers = [];
-    let _selectedAssociation_decorators;
-    let _selectedAssociation_initializers = [];
-    let _selectedAssociation_extraInitializers = [];
-    let __highlightEntityDropZone_decorators;
-    let __highlightEntityDropZone_initializers = [];
-    let __highlightEntityDropZone_extraInitializers = [];
-    let __schemaExample_decorators;
-    let __schemaExample_initializers = [];
-    let __schemaExample_extraInitializers = [];
-    let __schemaMime_decorators;
-    let __schemaMime_initializers = [];
-    let __schemaMime_extraInitializers = [];
-    let __schemaMock_decorators;
-    let __schemaMock_initializers = [];
-    let __schemaMock_extraInitializers = [];
-    let __schemaDoc_decorators;
-    let __schemaDoc_initializers = [];
-    let __schemaDoc_extraInitializers = [];
-    return class DataEntityEditorElement extends _classSuper {
-        static {
-            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
-            _root_decorators = [property({ type: Object })];
-            _selected_decorators = [property({ type: String })];
-            _selectedProperty_decorators = [property({ type: String })];
-            _selectedAssociation_decorators = [property({ type: String })];
-            __highlightEntityDropZone_decorators = [state()];
-            __schemaExample_decorators = [state()];
-            __schemaMime_decorators = [state()];
-            __schemaMock_decorators = [state()];
-            __schemaDoc_decorators = [query('data-schema-document')];
-            __esDecorate(this, null, _root_decorators, { kind: "accessor", name: "root", static: false, private: false, access: { has: obj => "root" in obj, get: obj => obj.root, set: (obj, value) => { obj.root = value; } }, metadata: _metadata }, _root_initializers, _root_extraInitializers);
-            __esDecorate(this, null, _selected_decorators, { kind: "accessor", name: "selected", static: false, private: false, access: { has: obj => "selected" in obj, get: obj => obj.selected, set: (obj, value) => { obj.selected = value; } }, metadata: _metadata }, _selected_initializers, _selected_extraInitializers);
-            __esDecorate(this, null, _selectedProperty_decorators, { kind: "accessor", name: "selectedProperty", static: false, private: false, access: { has: obj => "selectedProperty" in obj, get: obj => obj.selectedProperty, set: (obj, value) => { obj.selectedProperty = value; } }, metadata: _metadata }, _selectedProperty_initializers, _selectedProperty_extraInitializers);
-            __esDecorate(this, null, _selectedAssociation_decorators, { kind: "accessor", name: "selectedAssociation", static: false, private: false, access: { has: obj => "selectedAssociation" in obj, get: obj => obj.selectedAssociation, set: (obj, value) => { obj.selectedAssociation = value; } }, metadata: _metadata }, _selectedAssociation_initializers, _selectedAssociation_extraInitializers);
-            __esDecorate(this, null, __highlightEntityDropZone_decorators, { kind: "accessor", name: "_highlightEntityDropZone", static: false, private: false, access: { has: obj => "_highlightEntityDropZone" in obj, get: obj => obj._highlightEntityDropZone, set: (obj, value) => { obj._highlightEntityDropZone = value; } }, metadata: _metadata }, __highlightEntityDropZone_initializers, __highlightEntityDropZone_extraInitializers);
-            __esDecorate(this, null, __schemaExample_decorators, { kind: "accessor", name: "_schemaExample", static: false, private: false, access: { has: obj => "_schemaExample" in obj, get: obj => obj._schemaExample, set: (obj, value) => { obj._schemaExample = value; } }, metadata: _metadata }, __schemaExample_initializers, __schemaExample_extraInitializers);
-            __esDecorate(this, null, __schemaMime_decorators, { kind: "accessor", name: "_schemaMime", static: false, private: false, access: { has: obj => "_schemaMime" in obj, get: obj => obj._schemaMime, set: (obj, value) => { obj._schemaMime = value; } }, metadata: _metadata }, __schemaMime_initializers, __schemaMime_extraInitializers);
-            __esDecorate(this, null, __schemaMock_decorators, { kind: "accessor", name: "_schemaMock", static: false, private: false, access: { has: obj => "_schemaMock" in obj, get: obj => obj._schemaMock, set: (obj, value) => { obj._schemaMock = value; } }, metadata: _metadata }, __schemaMock_initializers, __schemaMock_extraInitializers);
-            __esDecorate(this, null, __schemaDoc_decorators, { kind: "accessor", name: "_schemaDoc", static: false, private: false, access: { has: obj => "_schemaDoc" in obj, get: obj => obj._schemaDoc, set: (obj, value) => { obj._schemaDoc = value; } }, metadata: _metadata }, __schemaDoc_initializers, __schemaDoc_extraInitializers);
-            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
-        }
-        static get styles() {
-            return [
-                theme,
-                schemaCommon,
-                MarkdownStyles,
-                EditorCommon,
-                typography,
-                css `
-        :host {
-          display: block;
-          height: 100%;
-        }
-
-        .container {
-          display: flex;
-          flex-direction: row;
-          height: inherit;
-          flex: 1;
-        }
-
-        .structure {
-          flex: 8;
-          overflow: hidden;
-        }
-
-        .editor {
-          flex: 4;
-          background-color: var(--md-sys-color-surface);
-          border-radius: var(--md-sys-shape-corner-small);
-          box-shadow: var(--md-sys-elevation-1);
-          overflow: hidden;
-          display: flex;
-          flex-direction: column;
-          /* for the box shadow */
-          margin: 4px;
-        }
-
-        .editor-form {
-          overflow: auto;
-        }
-
-        .mime-options {
-          box-sizing: border-box;
-          display: flex;
-          align-items: center;
-        }
-
-        .schema-card {
-          margin: 20px 20px 20px 0px;
-        }
-      `,
-            ];
-        }
-        #root_accessor_storage = __runInitializers(this, _root_initializers, void 0);
-        /**
-         * The read data namespace.
-         */
-        get root() { return this.#root_accessor_storage; }
-        set root(value) { this.#root_accessor_storage = value; }
-        #selected_accessor_storage = (__runInitializers(this, _root_extraInitializers), __runInitializers(this, _selected_initializers, void 0));
-        /**
-         * The selected entity.
-         */
-        get selected() { return this.#selected_accessor_storage; }
-        set selected(value) { this.#selected_accessor_storage = value; }
-        #selectedProperty_accessor_storage = (__runInitializers(this, _selected_extraInitializers), __runInitializers(this, _selectedProperty_initializers, void 0));
-        /**
-         * The key of the selected property being edited.
-         */
-        get selectedProperty() { return this.#selectedProperty_accessor_storage; }
-        set selectedProperty(value) { this.#selectedProperty_accessor_storage = value; }
-        #selectedAssociation_accessor_storage = (__runInitializers(this, _selectedProperty_extraInitializers), __runInitializers(this, _selectedAssociation_initializers, void 0));
-        /**
-         * The key of the selected association being edited.
-         */
-        get selectedAssociation() { return this.#selectedAssociation_accessor_storage; }
-        set selectedAssociation(value) { this.#selectedAssociation_accessor_storage = value; }
-        #_highlightEntityDropZone_accessor_storage = (__runInitializers(this, _selectedAssociation_extraInitializers), __runInitializers(this, __highlightEntityDropZone_initializers, void 0));
-        get _highlightEntityDropZone() { return this.#_highlightEntityDropZone_accessor_storage; }
-        set _highlightEntityDropZone(value) { this.#_highlightEntityDropZone_accessor_storage = value; }
-        #_schemaExample_accessor_storage = (__runInitializers(this, __highlightEntityDropZone_extraInitializers), __runInitializers(this, __schemaExample_initializers, void 0));
-        get _schemaExample() { return this.#_schemaExample_accessor_storage; }
-        set _schemaExample(value) { this.#_schemaExample_accessor_storage = value; }
-        #_schemaMime_accessor_storage = (__runInitializers(this, __schemaExample_extraInitializers), __runInitializers(this, __schemaMime_initializers, void 0));
-        get _schemaMime() { return this.#_schemaMime_accessor_storage; }
-        set _schemaMime(value) { this.#_schemaMime_accessor_storage = value; }
-        #_schemaMock_accessor_storage = (__runInitializers(this, __schemaMime_extraInitializers), __runInitializers(this, __schemaMock_initializers, void 0));
-        get _schemaMock() { return this.#_schemaMock_accessor_storage; }
-        set _schemaMock(value) { this.#_schemaMock_accessor_storage = value; }
-        _schemaOpened = __runInitializers(this, __schemaMock_extraInitializers);
-        #_schemaDoc_accessor_storage = __runInitializers(this, __schemaDoc_initializers, void 0);
-        get _schemaDoc() { return this.#_schemaDoc_accessor_storage; }
-        set _schemaDoc(value) { this.#_schemaDoc_accessor_storage = value; }
-        constructor() {
-            super();
-            __runInitializers(this, __schemaDoc_extraInitializers);
-            this._schemaMime = 'application/json';
-            this._schemaMock = true;
-            this.addEventListener('dragenter', this._dragEnterHandler.bind(this));
-            this.addEventListener('dragleave', this._dragLeaveHandler.bind(this));
-        }
-        willUpdate(cp) {
-            super.willUpdate(cp);
-            if (cp.has('selected')) {
-                this._computeExampleSchemaIfNeeded();
-            }
-        }
-        notifyChange() {
-            super.notifyChange();
-            if (this._highlightEntityDropZone) {
-                this._highlightEntityDropZone = false;
-            }
-        }
-        _dragEnterHandler(e) {
-            const { dataTransfer: dt } = e;
-            if (!dt) {
-                return;
-            }
-            if (![...dt.types].includes(DataEntityKind.toLowerCase())) {
-                return;
-            }
-            this._highlightEntityDropZone = true;
-            this.selectedProperty = undefined;
-            this.selectedAssociation = undefined;
-        }
-        _dragLeaveHandler(e) {
-            const { dataTransfer: dt } = e;
-            if (!dt) {
-                return;
-            }
-            if (![...dt.types].includes(DataEntityKind.toLowerCase())) {
-                return;
-            }
-            this._highlightEntityDropZone = false;
-        }
-        _propertyChangeHandler() {
-            this.notifyChange();
-            const { _schemaDoc } = this;
-            if (_schemaDoc) {
-                _schemaDoc.requestUpdate();
-            }
-            this._computeExampleSchemaIfNeeded();
-        }
-        _entityChangeHandler() {
-            this.notifyChange();
-            const { _schemaDoc } = this;
-            if (_schemaDoc) {
-                _schemaDoc.requestUpdate();
-            }
-            this._computeExampleSchemaIfNeeded();
-        }
-        _schemaEntityChangeHandler() {
-            this.notifyChange();
-            this.requestUpdate();
-            this._computeExampleSchemaIfNeeded();
-        }
-        _schemaEntityEditHandler(e) {
-            const { type, key } = e.detail;
-            if (type === 'property') {
-                this.selectedProperty = key;
-                this.selectedAssociation = undefined;
-            }
-            else if (type === 'association') {
-                this.selectedProperty = undefined;
-                this.selectedAssociation = key;
-            }
-            this._computeExampleSchemaIfNeeded();
-        }
-        _entityNameHandler() {
-            // just retarget
-            this.dispatchEvent(new Event('namechange'));
-            this._computeExampleSchemaIfNeeded();
-        }
-        _cancelEditor() {
-            this.selectedProperty = undefined;
-            this.selectedAssociation = undefined;
-        }
-        _computeExampleSchema() {
-            const { selected, root } = this;
-            const entity = root?.definitions.entities.find((i) => i.key === selected);
-            if (!entity) {
-                this._schemaExample = undefined;
-                return;
-            }
-            this._schemaExample = entity.toExample(this._schemaMime, {
-                renderMocked: this._schemaMock,
-                renderExamples: true,
-                renderOptional: true,
-            });
-        }
-        _computeExampleSchemaIfNeeded() {
-            if (this._schemaOpened) {
-                this._computeExampleSchema();
-            }
-        }
-        _schemaOpenHandler(e) {
-            const details = e.target;
-            this._schemaOpened = details.open;
-            if (details.open) {
-                this._computeExampleSchema();
-            }
-        }
-        _schemaMimeHandler(e) {
-            const button = e.target;
-            if (!button.checked) {
-                return;
-            }
-            this._schemaMime = button.value;
-            this._computeExampleSchemaIfNeeded();
-        }
-        _mockSchemaValuesHandler(e) {
-            const input = e.target;
-            const { checked } = input;
-            this._schemaMock = checked;
-            this._computeExampleSchema();
-        }
-        render() {
-            return html ` <div class="container">${this._structureTemplate()} ${this._editorTemplate()}</div> `;
-        }
-        _structureTemplate() {
-            return html `
-      <div class="structure">
-        <data-schema-document
-          .root="${this.root}"
-          .key="${this.selected}"
-          .selectedProperty="${this.selectedProperty || this.selectedAssociation}"
-          ?associationDropZone="${this._highlightEntityDropZone}"
-          editable
-          @change="${this._schemaEntityChangeHandler}"
-          @edit="${this._schemaEntityEditHandler}"
-        ></data-schema-document>
-        ${this.renderSchema()}
-      </div>
-    `;
-        }
-        _editorTemplate() {
-            const { selectedProperty, selectedAssociation } = this;
-            let content;
-            if (selectedProperty) {
-                content = this._propertyEditorTemplate(selectedProperty);
-            }
-            else if (selectedAssociation) {
-                content = this._associationEditorTemplate(selectedAssociation);
-            }
-            else {
-                content = this.renderEntityEditor();
-            }
-            return html ` <div class="editor">${content}</div> `;
-        }
-        _propertyEditorTemplate(id) {
-            return html `
-      <div class="editor-title title-large">
-        Data Property
-        <ui-icon-button class="title-icon" title="Close this editor" @click="${this._cancelEditor}">
-          <ui-icon icon="close"></ui-icon>
-        </ui-icon-button>
-      </div>
-      <data-property-form
-        .root="${this.root}"
-        .key="${id}"
-        @change="${this._propertyChangeHandler}"
-        class="editor-form"
-      ></data-property-form>
-    `;
-        }
-        _associationEditorTemplate(id) {
-            return html `
-      <div class="editor-title title-large">
-        Data Association
-        <ui-icon-button class="title-icon" title="Close this editor" @click="${this._cancelEditor}">
-          <ui-icon icon="close"></ui-icon>
-        </ui-icon-button>
-      </div>
-      <data-association-form
-        .root="${this.root}"
-        .key="${id}"
-        @change="${this._propertyChangeHandler}"
-        class="editor-form"
-      ></data-association-form>
-    `;
-        }
-        renderEntityEditor() {
-            return html `
-      <div class="editor-title title-large">Data Entity</div>
-      <data-entity-form
-        .root="${this.root}"
-        .key="${this.selected}"
-        ?parentDropZone="${this._highlightEntityDropZone}"
-        @change="${this._entityChangeHandler}"
-        @namechange="${this._entityNameHandler}"
-        class="editor-form"
-      ></data-entity-form>
-    `;
-        }
-        renderSchema() {
-            return html ` <details class="schema-card" @toggle="${this._schemaOpenHandler}">
-      <summary class="title-medium">Example</summary>
-      <div class="example-content">
-        <div class="mime-options">
-          <span id="mimeLabel" class="label-large">Mime type:</span>
-          <label class="label-large">
-            <ui-radio
-              name="mimeValue"
-              value="application/json"
-              .checked="${this._schemaMime === 'application/json'}"
-              @change="${this._schemaMimeHandler}"
-              aria-describedby="mimeLabel"
-            ></ui-radio>
-            application/json
-          </label>
-          <label class="label-large">
-            <ui-radio
-              name="mimeValue"
-              value="application/xml"
-              .checked="${this._schemaMime === 'application/xml'}"
-              @change="${this._schemaMimeHandler}"
-              aria-describedby="mimeLabel"
-            ></ui-radio>
-            application/xml
-          </label>
-          <label class="label-large">
-            <ui-checkbox
-              .checked="${this._schemaMock}"
-              @change="${this._mockSchemaValuesHandler}"
-              title="Generates random values when examples are not defined."
-            ></ui-checkbox>
-            Mock values
-          </label>
-        </div>
-        <pre class="code-value text-selectable"><code>${this._schemaExample}</code></pre>
-      </div>
-    </details>`;
-        }
-    };
-})();
-/**
- * The DataEntity editor UI and logic.
- *
- * @fires change - When the entity has changed and the parent element / app should update the value in the store.
- * @fires namechange - When a name of the data entity has changed.
- *    This triggers a render in the navigation. This is fired after the `change` event.
- */
-export default DataEntityEditorElement;
-//# sourceMappingURL=DataEntityEditorElement.js.map

package/build/src/elements/schema-design/DataEntityEditorElement.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DataEntityEditorElement.js","sourceRoot":"","sources":["../../../../src/elements/schema-design/DataEntityEditorElement.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, CSSResult, html, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { DataEntityKind } from '@api-client/core/browser.js'\nimport { DataNamespace } from '@api-client/core/legacy.js'\nimport ApiElement from '../ApiElement.js'\nimport theme from '../theme.js'\nimport schemaCommon from './schemaCommon.js'\nimport EditorCommon from './CommonStyles.js'\nimport MarkdownStyles from '../highlight/MarkdownStyles.js'\nimport typography from '../../styles/m3/typography.module.js'\nimport type DataSchemaDocument from './DataSchemaDocument.js'\nimport type RadioElement from '../../md/radio/internals/RadioElement.js'\nimport type CheckboxElement from '../../md/checkbox/internals/CheckboxElement.js'\nimport '../../md/icons/ui-icon.js'\nimport '../../md/icon-button/ui-icon-button.js'\nimport '../../md/checkbox/ui-checkbox.js'\nimport '../../md/radio/ui-radio.js'\nimport '../../elements/highlight/marked-highlight.js'\nimport './data-association-form.js'\nimport './data-property-form.js'\nimport './data-entity-form.js'\nimport './data-schema-document.js'\n\n/**\n * The DataEntity editor UI and logic.\n *\n * @fires change - When the entity has changed and the parent element / app should update the value in the store.\n * @fires namechange - When a name of the data entity has changed.\n *    This triggers a render in the navigation. This is fired after the `change` event.\n */\nexport default class DataEntityEditorElement extends ApiElement {\n  static override get styles(): CSSResult[] {\n    return [\n      theme,\n      schemaCommon,\n      MarkdownStyles,\n      EditorCommon,\n      typography,\n      css`\n        :host {\n          display: block;\n          height: 100%;\n        }\n\n        .container {\n          display: flex;\n          flex-direction: row;\n          height: inherit;\n          flex: 1;\n        }\n\n        .structure {\n          flex: 8;\n          overflow: hidden;\n        }\n\n        .editor {\n          flex: 4;\n          background-color: var(--md-sys-color-surface);\n          border-radius: var(--md-sys-shape-corner-small);\n          box-shadow: var(--md-sys-elevation-1);\n          overflow: hidden;\n          display: flex;\n          flex-direction: column;\n          /* for the box shadow */\n          margin: 4px;\n        }\n\n        .editor-form {\n          overflow: auto;\n        }\n\n        .mime-options {\n          box-sizing: border-box;\n          display: flex;\n          align-items: center;\n        }\n\n        .schema-card {\n          margin: 20px 20px 20px 0px;\n        }\n      `,\n    ]\n  }\n\n  /**\n   * The read data namespace.\n   */\n  @property({ type: Object }) accessor root: DataNamespace | undefined\n\n  /**\n   * The selected entity.\n   */\n  @property({ type: String }) accessor selected: string | undefined\n\n  /**\n   * The key of the selected property being edited.\n   */\n  @property({ type: String }) accessor selectedProperty: string | undefined\n\n  /**\n   * The key of the selected association being edited.\n   */\n  @property({ type: String }) accessor selectedAssociation: string | undefined\n\n  @state() protected accessor _highlightEntityDropZone: boolean | undefined\n\n  @state() protected accessor _schemaExample: string | number | boolean | null | undefined\n\n  @state() protected accessor _schemaMime: string\n\n  @state() protected accessor _schemaMock: boolean | undefined\n\n  protected _schemaOpened?: boolean\n\n  @query('data-schema-document') protected accessor _schemaDoc!: DataSchemaDocument\n\n  constructor() {\n    super()\n    this._schemaMime = 'application/json'\n    this._schemaMock = true\n    this.addEventListener('dragenter', this._dragEnterHandler.bind(this))\n    this.addEventListener('dragleave', this._dragLeaveHandler.bind(this))\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    super.willUpdate(cp)\n    if (cp.has('selected')) {\n      this._computeExampleSchemaIfNeeded()\n    }\n  }\n\n  override notifyChange(): void {\n    super.notifyChange()\n    if (this._highlightEntityDropZone) {\n      this._highlightEntityDropZone = false\n    }\n  }\n\n  protected _dragEnterHandler(e: DragEvent): void {\n    const { dataTransfer: dt } = e\n    if (!dt) {\n      return\n    }\n    if (![...dt.types].includes(DataEntityKind.toLowerCase())) {\n      return\n    }\n    this._highlightEntityDropZone = true\n    this.selectedProperty = undefined\n    this.selectedAssociation = undefined\n  }\n\n  protected _dragLeaveHandler(e: DragEvent): void {\n    const { dataTransfer: dt } = e\n    if (!dt) {\n      return\n    }\n    if (![...dt.types].includes(DataEntityKind.toLowerCase())) {\n      return\n    }\n    this._highlightEntityDropZone = false\n  }\n\n  protected _propertyChangeHandler(): void {\n    this.notifyChange()\n    const { _schemaDoc } = this\n    if (_schemaDoc) {\n      _schemaDoc.requestUpdate()\n    }\n    this._computeExampleSchemaIfNeeded()\n  }\n\n  protected _entityChangeHandler(): void {\n    this.notifyChange()\n    const { _schemaDoc } = this\n    if (_schemaDoc) {\n      _schemaDoc.requestUpdate()\n    }\n    this._computeExampleSchemaIfNeeded()\n  }\n\n  protected _schemaEntityChangeHandler(): void {\n    this.notifyChange()\n    this.requestUpdate()\n    this._computeExampleSchemaIfNeeded()\n  }\n\n  protected _schemaEntityEditHandler(e: CustomEvent): void {\n    const { type, key } = e.detail\n    if (type === 'property') {\n      this.selectedProperty = key\n      this.selectedAssociation = undefined\n    } else if (type === 'association') {\n      this.selectedProperty = undefined\n      this.selectedAssociation = key\n    }\n    this._computeExampleSchemaIfNeeded()\n  }\n\n  protected _entityNameHandler(): void {\n    // just retarget\n    this.dispatchEvent(new Event('namechange'))\n    this._computeExampleSchemaIfNeeded()\n  }\n\n  protected _cancelEditor(): void {\n    this.selectedProperty = undefined\n    this.selectedAssociation = undefined\n  }\n\n  protected _computeExampleSchema(): void {\n    const { selected, root } = this\n    const entity = root?.definitions.entities.find((i) => i.key === selected)\n    if (!entity) {\n      this._schemaExample = undefined\n      return\n    }\n    this._schemaExample = entity.toExample(this._schemaMime, {\n      renderMocked: this._schemaMock,\n      renderExamples: true,\n      renderOptional: true,\n    })\n  }\n\n  protected _computeExampleSchemaIfNeeded(): void {\n    if (this._schemaOpened) {\n      this._computeExampleSchema()\n    }\n  }\n\n  protected _schemaOpenHandler(e: Event): void {\n    const details = e.target as HTMLDetailsElement\n    this._schemaOpened = details.open\n    if (details.open) {\n      this._computeExampleSchema()\n    }\n  }\n\n  protected _schemaMimeHandler(e: Event): void {\n    const button = e.target as RadioElement\n    if (!button.checked) {\n      return\n    }\n    this._schemaMime = button.value as string\n    this._computeExampleSchemaIfNeeded()\n  }\n\n  protected _mockSchemaValuesHandler(e: Event): void {\n    const input = e.target as CheckboxElement\n    const { checked } = input\n    this._schemaMock = checked\n    this._computeExampleSchema()\n  }\n\n  protected override render(): TemplateResult {\n    return html` <div class=\"container\">${this._structureTemplate()} ${this._editorTemplate()}</div> `\n  }\n\n  protected _structureTemplate(): TemplateResult {\n    return html`\n      <div class=\"structure\">\n        <data-schema-document\n          .root=\"${this.root}\"\n          .key=\"${this.selected}\"\n          .selectedProperty=\"${this.selectedProperty || this.selectedAssociation}\"\n          ?associationDropZone=\"${this._highlightEntityDropZone}\"\n          editable\n          @change=\"${this._schemaEntityChangeHandler}\"\n          @edit=\"${this._schemaEntityEditHandler}\"\n        ></data-schema-document>\n        ${this.renderSchema()}\n      </div>\n    `\n  }\n\n  protected _editorTemplate(): TemplateResult {\n    const { selectedProperty, selectedAssociation } = this\n    let content: TemplateResult\n    if (selectedProperty) {\n      content = this._propertyEditorTemplate(selectedProperty)\n    } else if (selectedAssociation) {\n      content = this._associationEditorTemplate(selectedAssociation)\n    } else {\n      content = this.renderEntityEditor()\n    }\n    return html` <div class=\"editor\">${content}</div> `\n  }\n\n  protected _propertyEditorTemplate(id: string): TemplateResult {\n    return html`\n      <div class=\"editor-title title-large\">\n        Data Property\n        <ui-icon-button class=\"title-icon\" title=\"Close this editor\" @click=\"${this._cancelEditor}\">\n          <ui-icon icon=\"close\"></ui-icon>\n        </ui-icon-button>\n      </div>\n      <data-property-form\n        .root=\"${this.root}\"\n        .key=\"${id}\"\n        @change=\"${this._propertyChangeHandler}\"\n        class=\"editor-form\"\n      ></data-property-form>\n    `\n  }\n\n  protected _associationEditorTemplate(id: string): TemplateResult {\n    return html`\n      <div class=\"editor-title title-large\">\n        Data Association\n        <ui-icon-button class=\"title-icon\" title=\"Close this editor\" @click=\"${this._cancelEditor}\">\n          <ui-icon icon=\"close\"></ui-icon>\n        </ui-icon-button>\n      </div>\n      <data-association-form\n        .root=\"${this.root}\"\n        .key=\"${id}\"\n        @change=\"${this._propertyChangeHandler}\"\n        class=\"editor-form\"\n      ></data-association-form>\n    `\n  }\n\n  protected renderEntityEditor(): TemplateResult {\n    return html`\n      <div class=\"editor-title title-large\">Data Entity</div>\n      <data-entity-form\n        .root=\"${this.root}\"\n        .key=\"${this.selected}\"\n        ?parentDropZone=\"${this._highlightEntityDropZone}\"\n        @change=\"${this._entityChangeHandler}\"\n        @namechange=\"${this._entityNameHandler}\"\n        class=\"editor-form\"\n      ></data-entity-form>\n    `\n  }\n\n  protected renderSchema(): TemplateResult {\n    return html` <details class=\"schema-card\" @toggle=\"${this._schemaOpenHandler}\">\n      <summary class=\"title-medium\">Example</summary>\n      <div class=\"example-content\">\n        <div class=\"mime-options\">\n          <span id=\"mimeLabel\" class=\"label-large\">Mime type:</span>\n          <label class=\"label-large\">\n            <ui-radio\n              name=\"mimeValue\"\n              value=\"application/json\"\n              .checked=\"${this._schemaMime === 'application/json'}\"\n              @change=\"${this._schemaMimeHandler}\"\n              aria-describedby=\"mimeLabel\"\n            ></ui-radio>\n            application/json\n          </label>\n          <label class=\"label-large\">\n            <ui-radio\n              name=\"mimeValue\"\n              value=\"application/xml\"\n              .checked=\"${this._schemaMime === 'application/xml'}\"\n              @change=\"${this._schemaMimeHandler}\"\n              aria-describedby=\"mimeLabel\"\n            ></ui-radio>\n            application/xml\n          </label>\n          <label class=\"label-large\">\n            <ui-checkbox\n              .checked=\"${this._schemaMock}\"\n              @change=\"${this._mockSchemaValuesHandler}\"\n              title=\"Generates random values when examples are not defined.\"\n            ></ui-checkbox>\n            Mock values\n          </label>\n        </div>\n        <pre class=\"code-value text-selectable\"><code>${this._schemaExample}</code></pre>\n      </div>\n    </details>`\n  }\n}\n"]}

package/build/src/elements/schema-design/DataModelVisualizationElement.d.ts

@@ -1,62 +0,0 @@
-import { TemplateResult, nothing, CSSResult, PropertyValues } from 'lit';
-import ApiElement from '../ApiElement.js';
-import { type DataEntity, type DataNamespace, type DataModel, type DataProperty, type DataAssociation } from '@api-client/core/legacy.js';
-import VizWorkspaceElement from '../../visualization/elements/VizWorkspaceElement.js';
-import { GroupSelection } from '../../visualization/plugin/group-selection/GroupSelection.js';
-import { DragAndDropPlugin } from '../../visualization/plugin/dnd/DragAndDropPlugin.js';
-import '../../visualization/viz-workspace.js';
-import '../../visualization/viz-association.js';
-import '../../md/icons/ui-icon.js';
-interface VizModel {
-    id?: string;
-    entity: DataEntity;
-    type: 'parent' | 'association' | 'internal' | 'external' | 'self';
-    x?: number;
-    y?: number;
-}
-export default class DataModelVisualizationElement extends ApiElement {
-    static get styles(): CSSResult[];
-    /**
-     * The key of the entity to edit.
-     */
-    accessor key: string | undefined;
-    /**
-     * The read data namespace.
-     */
-    accessor root: DataNamespace | undefined;
-    /**
-     * The computed entity when the key or root change.
-     */
-    protected accessor _model: DataModel | undefined;
-    protected accessor _data: VizModel[] | undefined;
-    protected accessor _workspace: VizWorkspaceElement;
-    protected groupSelectionPlugin?: GroupSelection;
-    protected dndPlugin?: DragAndDropPlugin;
-    firstUpdated(cp: PropertyValues<this>): void;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    protected willUpdate(cp: PropertyValues<this>): void;
-    /**
-     * Reloads the generated view model, runs the auto layout, and updated the view.
-     * Note, this is very expensive operation. It updates the view at least twice.
-     * THe layout computation can be very complex.
-     */
-    refresh(): Promise<void>;
-    /**
-     * Computes the view value for the property.
-     * This should be called before the update is complete so this won't trigger another update.
-     */
-    protected _computeModel(): void;
-    protected _runLayout(): Promise<void>;
-    protected _createVizData(): void;
-    protected _repositionHandler(e: CustomEvent): Promise<void>;
-    protected render(): TemplateResult;
-    protected _modelContents(): TemplateResult[] | typeof nothing;
-    protected _entityVisualization(model: VizModel): TemplateResult;
-    protected _propertiesListTemplate(entity: DataEntity): TemplateResult;
-    protected _propertyItemTemplate(item: DataProperty): TemplateResult;
-    protected _associationTemplate(item: DataAssociation): TemplateResult | typeof nothing;
-    protected _parentAssociationTemplate(id: string): TemplateResult;
-}
-export {};
-//# sourceMappingURL=DataModelVisualizationElement.d.ts.map

package/build/src/elements/schema-design/DataModelVisualizationElement.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DataModelVisualizationElement.d.ts","sourceRoot":"","sources":["../../../../src/elements/schema-design/DataModelVisualizationElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,OAAO,EAAE,SAAS,EAAO,cAAc,EAAE,MAAM,KAAK,CAAA;AAKnF,OAAO,UAAU,MAAM,kBAAkB,CAAA;AACzC,OAAO,EACL,KAAK,UAAU,EACf,KAAK,aAAa,EAClB,KAAK,SAAS,EACd,KAAK,YAAY,EACjB,KAAK,eAAe,EACrB,MAAM,4BAA4B,CAAA;AACnC,OAAO,mBAAmB,MAAM,qDAAqD,CAAA;AAErF,OAAO,EAAE,cAAc,EAAE,MAAM,8DAA8D,CAAA;AAC7F,OAAO,EAAE,iBAAiB,EAAE,MAAM,qDAAqD,CAAA;AACvF,OAAO,sCAAsC,CAAA;AAC7C,OAAO,wCAAwC,CAAA;AAC/C,OAAO,2BAA2B,CAAA;AAElC,UAAU,QAAQ;IAChB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,MAAM,EAAE,UAAU,CAAA;IAClB,IAAI,EAAE,QAAQ,GAAG,aAAa,GAAG,UAAU,GAAG,UAAU,GAAG,MAAM,CAAA;IACjE,CAAC,CAAC,EAAE,MAAM,CAAA;IACV,CAAC,CAAC,EAAE,MAAM,CAAA;CACX;AAED,MAAM,CAAC,OAAO,OAAO,6BAA8B,SAAQ,UAAU;IACnE,WAAoB,MAAM,IAAI,SAAS,EAAE,CAqFxC;IAED;;OAEG;IACwC,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAA;IAE3E;;OAEG;IACyB,QAAQ,CAAC,IAAI,EAAE,aAAa,GAAG,SAAS,CAAA;IAEpE;;OAEG;IACM,SAAS,CAAC,QAAQ,CAAC,MAAM,EAAE,SAAS,GAAG,SAAS,CAAA;IAEhD,SAAS,CAAC,QAAQ,CAAC,KAAK,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAA;IAEjC,SAAS,CAAC,QAAQ,CAAC,UAAU,EAAG,mBAAmB,CAAA;IAE3E,SAAS,CAAC,oBAAoB,CAAC,EAAE,cAAc,CAAA;IAE/C,SAAS,CAAC,SAAS,CAAC,EAAE,iBAAiB,CAAA;IAE9B,YAAY,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAY5C,iBAAiB,IAAI,IAAI;IAUzB,oBAAoB,IAAI,IAAI;cAUlB,UAAU,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAM7D;;;;OAIG;IACG,OAAO,IAAI,OAAO,CAAC,IAAI,CAAC;IAM9B;;;OAGG;IACH,SAAS,CAAC,aAAa,IAAI,IAAI;cAUf,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;IA0B3C,SAAS,CAAC,cAAc,IAAI,IAAI;cAkEhB,kBAAkB,CAAC,CAAC,EAAE,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;cAmB9C,MAAM,IAAI,cAAc;IAI3C,SAAS,CAAC,cAAc,IAAI,cAAc,EAAE,GAAG,OAAO,OAAO;IAQ7D,SAAS,CAAC,oBAAoB,CAAC,KAAK,EAAE,QAAQ,GAAG,cAAc;IA4B/D,SAAS,CAAC,uBAAuB,CAAC,MAAM,EAAE,UAAU,GAAG,cAAc;IASrE,SAAS,CAAC,qBAAqB,CAAC,IAAI,EAAE,YAAY,GAAG,cAAc;IA2BnE,SAAS,CAAC,oBAAoB,CAAC,IAAI,EAAE,eAAe,GAAG,cAAc,GAAG,OAAO,OAAO;IAkBtF,SAAS,CAAC,0BAA0B,CAAC,EAAE,EAAE,MAAM,GAAG,cAAc;CAQjE"}