@design.estate/dees-catalog 1.0.173

package/dist_ts_web/elements/dees-dataview-codebox.d.ts

@@ -0,0 +1,15 @@
+import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
+declare global {
+    interface HTMLElementTagNameMap {
+        'dees-dataview-codebox': DeesDataviewCodebox;
+    }
+}
+export declare class DeesDataviewCodebox extends DeesElement {
+    static demo: () => TemplateResult<1>;
+    progLang: string;
+    codeToDisplay: string;
+    constructor();
+    render(): TemplateResult;
+    private codeToDisplayStore;
+    updated(_changedProperties: any): Promise<void>;
+}

package/dist_ts_web/elements/dees-dataview-codebox.js

@@ -0,0 +1,177 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { DeesElement, html, customElement, property, state, } from '@design.estate/dees-element';
+import hlight from 'highlight.js';
+import * as smartstring from '@push.rocks/smartstring';
+import * as domtools from '@design.estate/dees-domtools';
+export let DeesDataviewCodebox = class DeesDataviewCodebox extends DeesElement {
+    static { this.demo = () => html `<dees-dataview-codebox proglang="typescript">
+    import * as text from './hello'; const hiThere = 'nice'; const myFunction = async () => {
+    console.log('nice one'); }
+  </dees-dataview-codebox>`; }
+    constructor() {
+        super();
+        this.progLang = 'typescript';
+        this.codeToDisplay = '';
+        this.codeToDisplayStore = '';
+    }
+    render() {
+        return html `
+      ${domtools.elementBasic.styles}
+      <style>
+        :host {
+          position: relative;
+          display: block;
+          text-align: left;
+          font-size: 16px;
+        }
+        .mainbox {
+          position: relative;
+          color: ${this.goBright ? '#333333' : '#ffffff'};
+        }
+
+        .languageLabel {
+          color: #fff;
+          font-size: 12px;
+          z-index: 10;
+          background: #6596ff;
+          display: inline-block;
+          position: absolute;
+          right: 32px;
+          padding: 4px;
+          border-bottom-left-radius: 3px;
+          border-bottom-right-radius: 3px;
+        }
+
+        .hljs-keyword {
+          color: #ff65ec;
+        }
+
+        .codegrid {
+          display: grid;
+          grid-template-columns: 50px auto;
+          background: ${this.goBright ? '#ffffff' : '#191919'};
+          border-top: 1px solid ${this.goBright ? '#ffffff' : '#333333'};
+          box-shadow: 0px 0px 5px ${this.goBright ? 'rgba(0,0,0,0.1)' : 'rgba(0,0,0,0.5)'};
+          border-radius: 3px;
+          overflow: hidden;
+        }
+
+        .lineNumbers {
+          background: ${this.goBright ? '#fafafa' : '#151515'};
+          color: ${this.goBright ? '#acacac' : '#666666'};
+          padding: 30px 16px 0px 0px;
+          text-align: right;
+        }
+
+        .lineCounter:last-child {
+          opacity: 50%;
+        }
+
+        pre {
+          overflow-x: auto;
+          margin: 0px;
+          padding: 30px 40px;
+        }
+
+        code {
+          font-weight: ${this.goBright ? '400' : '300'};
+          padding: 0px;
+          margin: 0px;
+        }
+
+        code,
+        code *,
+        .lineNumbers {
+          line-height: 1.4em;
+          font-weight: 200;
+          font-family: 'Intel One Mono', 'monospace';
+        }
+
+        .hljs-string {
+          color: #ffa465;
+        }
+
+        .hljs-built_in {
+          color: #65ff6a;
+        }
+
+        .hljs-function {
+          color: ${this.goBright ? '#2765DF' : '#6596ff'};
+        }
+
+        .hljs-params {
+          color: ${this.goBright ? '#3DB420' : '#65d5ff'};
+        }
+
+        .hljs-comment {
+          color: ${this.goBright ? '#EF9300' : '#ffd765'};
+        }
+      </style>
+      <div class="mainbox">
+        <div class="languageLabel">${this.progLang}</div>
+        <div class="codegrid">
+          <div class="lineNumbers">
+            ${(() => {
+            let lineCounter = 0;
+            return this.codeToDisplay.split('\n').map(lineArg => {
+                lineCounter++;
+                return html `<div class="lineCounter">${lineCounter}</div>`;
+            });
+        })()}
+          </div>
+          <pre><code></code></pre>
+        </div>
+      </div>
+    `;
+    }
+    async updated(_changedProperties) {
+        super.updated(_changedProperties);
+        console.log('highlighting now');
+        console.log(this.childNodes);
+        const slottedCodeNodes = [];
+        this.childNodes.forEach((childNode) => {
+            if (childNode.nodeName === '#text') {
+                slottedCodeNodes.push(childNode);
+            }
+        });
+        if (this.codeToDisplay && this.codeToDisplay !== this.codeToDisplayStore) {
+            this.codeToDisplayStore = smartstring.indent.normalize(this.codeToDisplay).trimStart();
+        }
+        if (slottedCodeNodes[0] && slottedCodeNodes[0].wholeText && !this.codeToDisplay) {
+            this.codeToDisplayStore = smartstring.indent.normalize(slottedCodeNodes[0].wholeText).trimStart();
+            this.codeToDisplay = this.codeToDisplayStore;
+        }
+        await domtools.plugins.smartdelay.delayFor(0);
+        const localCodeNode = this.shadowRoot.querySelector('code');
+        const html = hlight.highlight(this.codeToDisplayStore, { language: this.progLang, ignoreIllegals: true });
+        localCodeNode.innerHTML = html.value;
+    }
+};
+__decorate([
+    property(),
+    __metadata("design:type", String)
+], DeesDataviewCodebox.prototype, "progLang", void 0);
+__decorate([
+    property({
+        type: String,
+        reflect: true,
+    }),
+    __metadata("design:type", String)
+], DeesDataviewCodebox.prototype, "codeToDisplay", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], DeesDataviewCodebox.prototype, "codeToDisplayStore", void 0);
+DeesDataviewCodebox = __decorate([
+    customElement('dees-dataview-codebox'),
+    __metadata("design:paramtypes", [])
+], DeesDataviewCodebox);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1kYXRhdmlldy1jb2RlYm94LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL2RlZXMtZGF0YXZpZXctY29kZWJveC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7QUFBQSxPQUFPLEVBQ0wsV0FBVyxFQUNYLElBQUksRUFDSixhQUFhLEVBRWIsUUFBUSxFQUNSLEtBQUssR0FDTixNQUFNLDZCQUE2QixDQUFDO0FBRXJDLE9BQU8sTUFBTSxNQUFNLGNBQWMsQ0FBQztBQUVsQyxPQUFPLEtBQUssV0FBVyxNQUFNLHlCQUF5QixDQUFDO0FBRXZELE9BQU8sS0FBSyxRQUFRLE1BQU0sOEJBQThCLENBQUM7QUFTbEQsV0FBTSxtQkFBbUIsR0FBekIsTUFBTSxtQkFBb0IsU0FBUSxXQUFXO2FBQ3BDLFNBQUksR0FBRyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUE7OzsyQkFHTixBQUhQLENBR1E7SUFXMUI7UUFDRSxLQUFLLEVBQUUsQ0FBQztRQVRILGFBQVEsR0FBVyxZQUFZLENBQUM7UUFNaEMsa0JBQWEsR0FBVyxFQUFFLENBQUM7UUFzSDFCLHVCQUFrQixHQUFHLEVBQUUsQ0FBQztJQWxIaEMsQ0FBQztJQUVELE1BQU07UUFDSixPQUFPLElBQUksQ0FBQTtRQUNQLFFBQVEsQ0FBQyxZQUFZLENBQUMsTUFBTTs7Ozs7Ozs7OzttQkFVakIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxTQUFTOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozt3QkF1QmhDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsU0FBUztrQ0FDM0IsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxTQUFTO29DQUNuQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFD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

package/dist_ts_web/elements/dees-dataview-statusobject.d.ts

@@ -0,0 +1,14 @@
+import { DeesElement, type TemplateResult, type CSSResult } from '@design.estate/dees-element';
+import * as tsclass from '@tsclass/tsclass';
+declare global {
+    interface HTMLElementTagNameMap {
+        'dees-dataview-statusobject': DeesDataviewStatusobject;
+    }
+}
+export declare class DeesDataviewStatusobject extends DeesElement {
+    static demo: () => TemplateResult<1>;
+    statusObject: tsclass.code.IStatusObject;
+    static styles: CSSResult[];
+    render(): TemplateResult;
+    firstUpdated(): Promise<void>;
+}

package/dist_ts_web/elements/dees-dataview-statusobject.js

@@ -0,0 +1,163 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { DeesElement, html, customElement, property, state, cssManager, css, } from '@design.estate/dees-element';
+import * as tsclass from '@tsclass/tsclass';
+export let DeesDataviewStatusobject = class DeesDataviewStatusobject extends DeesElement {
+    static { this.demo = () => html `<dees-dataview-statusobject
+    .statusObject=${{
+        id: '1',
+        name: 'Demo Item',
+        combinedStatus: 'partly_ok',
+        combinedStatusText: 'partly_ok',
+        details: [
+            {
+                name: 'Detail 1',
+                value: 'Value 1',
+                status: 'ok',
+                statusText: 'OK',
+            },
+            {
+                name: 'Detail 2',
+                value: 'Value 2',
+                status: 'partly_ok',
+                statusText: 'partly_ok',
+            },
+            {
+                name: 'Detail 3',
+                value: 'Value 3',
+                status: 'not_ok',
+                statusText: 'not_ok',
+            },
+            {
+                name: 'Detail 4',
+                value: 'Value 4 jhdkfjhalskdfjhfdjskalsdkfjhfdjskalskdjfhjdkslaksjdhfjdkslaskdfjhfjdkslaskdjfhjdskalskdjhfdjskalskdjfhdjskl',
+                status: 'ok',
+                statusText: 'OK',
+            },
+        ],
+    }}
+  >
+  </dees-dataview-statusobject>`; }
+    static { this.styles = [
+        cssManager.defaultStyles,
+        css `
+      .mainbox {
+        border-radius: 3px;
+        background: ${cssManager.bdTheme('#fff', '#1b1b1b')};
+        box-shadow: 0px 1px 3px #00000030;
+        min-height: 48px;
+        color: ${cssManager.bdTheme('#000', '#fff')};
+      }
+
+      .heading {
+        display: grid;
+        align-items: center;
+        grid-template-columns: 40px auto 120px;
+      }
+
+      h1 {
+        display: block;
+        margin: 0px;
+        padding: 0px;
+        height: 48px;
+        text-transform: uppercase;
+        font-size: 12px;
+        line-height: 48px;
+      }
+
+      .statusdot {
+        height: 8px;
+        width: 8px;
+        border-radius: 6px;
+        background: grey;
+        margin: auto;
+      }
+
+      .copyMain {
+        cursor: pointer;
+        font-size: 8px;
+        font-weight: 600;
+        text-transform: uppercase;
+        border: 1px solid ${cssManager.bdTheme('#999', '#444')};
+        text-align: center;
+        padding: 4px;
+        border-radius: 3px;
+        margin-right: 16px;
+      }
+
+      .statusdot.ok {
+        background: green;
+      }
+
+      .statusdot.not_ok{
+        background: red;
+      }
+
+      .statusdot.partly_ok {
+        background: orange;
+      }
+
+      .detail {
+        minheight: 60px;
+        align-items: center;
+        display: grid;
+        grid-template-columns: 40px auto;
+        border-top: 1px dotted ${cssManager.bdTheme('#999', '#444')};
+      }
+
+      .detail .detailsText {
+        padding-top: 8px;
+        padding-bottom: 8px;
+        padding-right: 8px;
+        word-break: break-all;
+      }
+
+      .detail .detailsText .label {
+        font-size: 12px;
+      }
+
+      .detail .detailsText .value {
+        font-size: 16px;
+        font-family: 'Intel One Mono';
+      }
+    `,
+    ]; }
+    render() {
+        return html `
+      <div class="mainbox">
+        <div class="heading">
+          <div class="statusdot ${this.statusObject?.combinedStatus}"></div>
+          <h1>${this.statusObject?.name || 'no status object assigned'}</h1>
+          <div class="copyMain">Copy as JSON</div>
+        </div>
+        ${this.statusObject?.details?.map((detailArg) => {
+            return html `
+            <div class="detail">
+              <div class="statusdot ${detailArg.status}"></div>
+              <div class="detailsText">
+                <div class="label">${detailArg.name}</div>
+                <div class="value">${detailArg.value}</div>
+              </div>
+            </div>
+          `;
+        })}
+      </div>
+    `;
+    }
+    async firstUpdated() { }
+};
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], DeesDataviewStatusobject.prototype, "statusObject", void 0);
+DeesDataviewStatusobject = __decorate([
+    customElement('dees-dataview-statusobject')
+], DeesDataviewStatusobject);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1kYXRhdmlldy1zdGF0dXNvYmplY3QuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvZWxlbWVudHMvZGVlcy1kYXRhdmlldy1zdGF0dXNvYmplY3QudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7O0FBQUEsT0FBTyxFQUNMLFdBQVcsRUFDWCxJQUFJLEVBQ0osYUFBYSxFQUViLFFBQVEsRUFDUixLQUFLLEVBQ0wsVUFBVSxFQUNWLEdBQUcsR0FFSixNQUFNLDZCQUE2QixDQUFDO0FBRXJDLE9BQU8sS0FBSyxPQUFPLE1BQU0sa0JBQWtCLENBQUM7QUFTckMsV0FBTSx3QkFBd0IsR0FBOUIsTUFBTSx3QkFBeUIsU0FBUSxXQUFXO2FBQ3pDLFNBQUksR0FBRyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUE7b0JBQ2I7UUFDZCxFQUFFLEVBQUUsR0FBRztRQUNQLElBQUksRUFBRSxXQUFXO1FBQ2pCLGNBQWMsRUFBRSxXQUFXO1FBQzNCLGtCQUFrQixFQUFFLFdBQVc7UUFDL0IsT0FBTyxFQUFFO1lBQ1A7Z0JBQ0UsSUFBSSxFQUFFLFVBQVU7Z0JBQ2hCLEtBQUssRUFBRSxTQUFTO2dCQUNoQixNQUFNLEVBQUUsSUFBSTtnQkFDWixVQUFVLEVBQUUsSUFBSTthQUNqQjtZQUNEO2dCQUNFLElBQUksRUFBRSxVQUFVO2dCQUNoQixLQUFLLEVBQUUsU0FBUztnQkFDaEIsTUFBTSxFQUFFLFdBQVc7Z0JBQ25CLFVBQVUsRUFBRSxXQUFXO2FBQ3hCO1lBQ0Q7Z0JBQ0UsSUFBSSxFQUFFLFVBQVU7Z0JBQ2hCLEtBQUssRUFBRSxTQUFTO2dCQUNoQixNQUFNLEVBQUUsUUFBUTtnQkFDaEIsVUFBVSxFQUFFLFFBQVE7YUFDckI7WUFDRDtnQkFDRSxJQUFJLEVBQUUsVUFBVTtnQkFDaEIsS0FBSyxFQUFFLHFIQUFxSDtnQkFDNUgsTUFBTSxFQUFFLElBQUk7Z0JBQ1osVUFBVSxFQUFFLElBQUk7YUFDakI7U0FDRjtLQUNGOztnQ0FFMkIsQUFsQ1osQ0FrQ2E7YUFJakIsV0FBTSxHQUFHO1FBQ3JCLFVBQVUsQ0FBQyxhQUFhO1FBQ3hCLEdBQUcsQ0FBQTs7O3NCQUdlLFVBQVUsQ0FBQyxPQUFPLENBQUMsTUFBTSxFQUFFLFNBQVMsQ0FBQzs7O2lCQUcxQyxVQUFVLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRSxNQUFNLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OzRCQWdDdkIsVUFBVSxDQUFDLE9BQU8sQ0FBQyxNQUFNLEVBQUUsTUFBTSxDQUFDOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7aUNBd0I3QixVQUFVLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRSxNQUFNLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7OztLQWtCOUQ7S0FDRixBQW5GbUIsQ0FtRmxCO0lBRUYsTUFBTTtRQUNKLE9BQU8sSUFBSSxDQUFBOzs7a0NBR21CLElBQUksQ0FBQyxZQUFZLEVBQUUsY0FBYztnQkFDbkQsSUFBSSxDQUFDLFlBQVksRUFBRSxJQUFJLElBQUksMkJBQTJCOzs7VUFHNUQsSUFBSSxDQUFDLFlBQVksRUFBRSxPQUFPLEVBQUUsR0FBRyxDQUFDLENBQUMsU0FBUyxFQUFFLEVBQUU7WUFDOUMsT0FBTyxJQUFJLENBQUE7O3NDQUVpQixTQUFTLENBQUMsTUFBTTs7cUNBRWpCLFNBQVMsQ0FBQyxJQUFJO3FDQUNkLFNBQVMsQ0FBQyxLQUFLOzs7V0FHekMsQ0FBQztRQUNKLENBQUMsQ0FBQzs7S0FFTCxDQUFDO0lBQ0osQ0FBQztJQUVELEtBQUssQ0FBQyxZQUFZLEtBQUksQ0FBQzs7QUE5R0s7SUFBM0IsUUFBUSxDQUFDLEVBQUUsSUFBSSxFQUFFLE1BQU0sRUFBRSxDQUFDOzs4REFBMEM7QUFyQzFELHdCQUF3QjtJQURwQyxhQUFhLENBQUMsNEJBQTRCLENBQUM7R0FDL0Isd0JBQXdCLENBb0pwQyJ9

package/dist_ts_web/elements/dees-form-submit.d.ts

@@ -0,0 +1,17 @@
+import { DeesElement, type CSSResult } from '@design.estate/dees-element';
+declare global {
+    interface HTMLElementTagNameMap {
+        'dees-form-submit': DeesFormSubmit;
+    }
+}
+export declare class DeesFormSubmit extends DeesElement {
+    static demo: () => import("@design.estate/dees-element").TemplateResult<1>;
+    disabled: boolean;
+    text: string;
+    status: 'normal' | 'pending' | 'success' | 'error';
+    constructor();
+    static styles: CSSResult[];
+    render(): import("@design.estate/dees-element").TemplateResult<1>;
+    submit(): Promise<void>;
+    focus(): Promise<void>;
+}

package/dist_ts_web/elements/dees-form-submit.js

@@ -0,0 +1,68 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { customElement, html, DeesElement, css, cssManager, property, } from '@design.estate/dees-element';
+import { DeesForm } from './dees-form.js';
+export let DeesFormSubmit = class DeesFormSubmit extends DeesElement {
+    static { this.demo = () => html `<dees-form-submit>This is a sloted text</dees-form-submit>`; }
+    constructor() {
+        super();
+        this.disabled = false;
+        this.status = 'normal';
+    }
+    static { this.styles = [cssManager.defaultStyles, css ``]; }
+    render() {
+        return html `
+      <dees-button
+        status=${this.status}
+        @click=${this.submit}
+        .disabled=${this.disabled}
+        .text=${this.text ? this.text : this.textContent}
+      >
+      </dees-button>
+    `;
+    }
+    async submit() {
+        if (this.disabled) {
+            return;
+        }
+        const parentElement = this.parentElement;
+        parentElement.gatherAndDispatch();
+    }
+    async focus() {
+        const domtools = await this.domtoolsPromise;
+        if (!this.disabled) {
+            domtools.convenience.smartdelay.delayFor(0);
+            this.submit();
+        }
+    }
+};
+__decorate([
+    property({
+        type: Boolean,
+    }),
+    __metadata("design:type", Object)
+], DeesFormSubmit.prototype, "disabled", void 0);
+__decorate([
+    property({
+        type: String,
+    }),
+    __metadata("design:type", String)
+], DeesFormSubmit.prototype, "text", void 0);
+__decorate([
+    property({
+        type: String,
+    }),
+    __metadata("design:type", String)
+], DeesFormSubmit.prototype, "status", void 0);
+DeesFormSubmit = __decorate([
+    customElement('dees-form-submit'),
+    __metadata("design:paramtypes", [])
+], DeesFormSubmit);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1mb3JtLXN1Ym1pdC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3RzX3dlYi9lbGVtZW50cy9kZWVzLWZvcm0tc3VibWl0LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7OztBQUFBLE9BQU8sRUFDTCxhQUFhLEVBQ2IsSUFBSSxFQUNKLFdBQVcsRUFDWCxHQUFHLEVBQ0gsVUFBVSxFQUNWLFFBQVEsR0FFVCxNQUFNLDZCQUE2QixDQUFDO0FBQ3JDLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQVNuQyxXQUFNLGNBQWMsR0FBcEIsTUFBTSxjQUFlLFNBQVEsV0FBVzthQUMvQixTQUFJLEdBQUcsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFBLDREQUE0RCxBQUF6RSxDQUEwRTtJQWlCNUY7UUFDRSxLQUFLLEVBQUUsQ0FBQztRQWJILGFBQVEsR0FBRyxLQUFLLENBQUM7UUFVakIsV0FBTSxHQUErQyxRQUFRLENBQUM7SUFJckUsQ0FBQzthQUVhLFdBQU0sR0FBRyxDQUFDLFVBQVUsQ0FBQyxhQUFhLEVBQUUsR0FBRyxDQUFBLEVBQUUsQ0FBQyxBQUFwQyxDQUFxQztJQUVsRCxNQUFNO1FBQ1gsT0FBTyxJQUFJLENBQUE7O2lCQUVFLElBQUksQ0FBQyxNQUFNO2lCQUNYLElBQUksQ0FBQyxNQUFNO29CQUNSLElBQUksQ0FBQyxRQUFRO2dCQUNqQixJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsV0FBVzs7O0tBR25ELENBQUM7SUFDSixDQUFDO0lBRU0sS0FBSyxDQUFDLE1BQU07UUFDakIsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFO1lBQ2pCLE9BQU87U0FDUjtRQUNELE1BQU0sYUFBYSxHQUFhLElBQUksQ0FBQyxhQUF5QixDQUFDO1FBQy9ELGFBQWEsQ0FBQyxpQkFBaUIsRUFBRSxDQUFDO0lBQ3BDLENBQUM7SUFFTSxLQUFLLENBQUMsS0FBSztRQUNoQixNQUFNLFFBQVEsR0FBRyxNQUFNLElBQUksQ0FBQyxlQUFlLENBQUM7UUFDNUMsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUU7WUFDbEIsUUFBUSxDQUFDLFdBQVcsQ0FBQyxVQUFVLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDO1lBQzVDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQztTQUNmO0lBQ0gsQ0FBQzs7QUE1Q007SUFITixRQUFRLENBQUM7UUFDUixJQUFJLEVBQUUsT0FBTztLQUNkLENBQUM7O2dEQUNzQjtBQUtqQjtJQUhOLFFBQVEsQ0FBQztRQUNSLElBQUksRUFBRSxNQUFNO0tBQ2IsQ0FBQzs7NENBQ2tCO0FBS2I7SUFITixRQUFRLENBQUM7UUFDUixJQUFJLEVBQUUsTUFBTTtLQUNiLENBQUM7OzhDQUNtRTtBQWhCMUQsY0FBYztJQUQxQixhQUFhLENBQUMsa0JBQWtCLENBQUM7O0dBQ3JCLGNBQWMsQ0FtRDFCIn0=

package/dist_ts_web/elements/dees-form.d.ts

@@ -0,0 +1,29 @@
+import { type TemplateResult, DeesElement } from '@design.estate/dees-element';
+import * as domtools from '@design.estate/dees-domtools';
+import { DeesInputCheckbox } from './dees-input-checkbox.js';
+import { DeesInputText } from './dees-input-text.js';
+import { DeesInputQuantitySelector } from './dees-input-quantityselector.js';
+import { DeesInputRadio } from './dees-input-radio.js';
+import { DeesFormSubmit } from './dees-form-submit.js';
+export type TFormElement = Array<DeesInputCheckbox | DeesInputText | DeesInputQuantitySelector | DeesInputRadio>;
+declare global {
+    interface HTMLElementTagNameMap {
+        'dees-form': DeesForm;
+    }
+}
+export declare class DeesForm extends DeesElement {
+    static demo: () => TemplateResult<1>;
+    name: string;
+    changeSubject: domtools.rxjs.Subject<unknown>;
+    render(): TemplateResult;
+    firstUpdated(): Promise<void>;
+    getFormChildren(): TFormElement;
+    getSubmitButton(): DeesFormSubmit;
+    checkRequiredStatus(): Promise<void>;
+    gatherData(): Promise<{
+        [key: string]: string | number | boolean;
+    }>;
+    gatherAndDispatch(): Promise<void>;
+    setStatus(visualStateArg: 'normal' | 'pending' | 'error' | 'success', textStateArg: string): void;
+    instrumentBehaviours(): Promise<void>;
+}