@design.estate/dees-catalog 1.0.173

package/dist_ts_web/elements/dees-form.js

@@ -0,0 +1,173 @@
+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;
+};
+import { customElement, html, 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 let DeesForm = class DeesForm extends DeesElement {
+    constructor() {
+        super(...arguments);
+        this.name = 'myform';
+        this.changeSubject = new domtools.rxjs.Subject();
+    }
+    static { this.demo = () => html `
+    <dees-form
+      style="display: block; margin:auto; max-width: 500px; padding: 20px"
+      @formData=${async (eventArg) => {
+        const form = eventArg.currentTarget;
+        form.setStatus('pending', 'authenticating...');
+        await domtools.plugins.smartdelay.delayFor(1000);
+        form.setStatus('success', 'authenticated!');
+    }}
+    >
+      <dees-input-text .required="${true}" key="hello1" label="a text"></dees-input-text>
+      <dees-input-text .required="${true}" key="hello2" label="also a text"></dees-input-text>
+      <dees-input-checkbox
+        .required="${true}"
+        key="hello3"
+        label="another text"
+      ></dees-input-checkbox>
+      <dees-form-submit>Submit</dees-form-submit>
+    </dees-form>
+  `; }
+    render() {
+        return html `
+      <style>
+        :host {
+          display: contents;
+        }
+      </style>
+      <slot></slot>
+    `;
+    }
+    async firstUpdated() {
+        const formChildren = this.getFormChildren();
+        this.checkRequiredStatus();
+        for (const child of formChildren) {
+            child.changeSubject.subscribe(async (elementArg) => {
+                const valueObject = await this.gatherData();
+                this.changeSubject.next(valueObject);
+                console.log(valueObject);
+                this.checkRequiredStatus();
+            });
+        }
+        await this.instrumentBehaviours();
+    }
+    getFormChildren() {
+        const children = this.children;
+        const formChildren = [];
+        for (const child of children) {
+            if (child instanceof DeesInputCheckbox ||
+                child instanceof DeesInputText ||
+                child instanceof DeesInputQuantitySelector) {
+                formChildren.push(child);
+            }
+        }
+        return formChildren;
+    }
+    getSubmitButton() {
+        const children = this.children;
+        let submitButton;
+        for (const childArg of children) {
+            if (childArg instanceof DeesFormSubmit) {
+                submitButton = childArg;
+            }
+        }
+        return submitButton;
+    }
+    async checkRequiredStatus() {
+        console.log('checking the required status.');
+        let requiredOK = true;
+        for (const childArg of this.getFormChildren()) {
+            if (childArg.required && !childArg.value) {
+                requiredOK = false;
+            }
+        }
+        if (this.getSubmitButton()) {
+            this.getSubmitButton().disabled = !requiredOK;
+        }
+    }
+    async gatherData() {
+        const children = this.getFormChildren();
+        const valueObject = {};
+        for (const child of children) {
+            valueObject[child.key] = child.value;
+        }
+        return valueObject;
+    }
+    async gatherAndDispatch() {
+        const valueObject = await this.gatherData();
+        const formDataEvent = new CustomEvent('formData', {
+            detail: {
+                data: valueObject,
+            },
+            bubbles: true,
+        });
+        this.dispatchEvent(formDataEvent);
+        console.log('dispatched data:');
+        console.log(valueObject);
+    }
+    setStatus(visualStateArg, textStateArg) {
+        const inputChildren = this.getFormChildren();
+        const submitButton = this.getSubmitButton();
+        switch (visualStateArg) {
+            case 'normal':
+                submitButton.disabled = false;
+                submitButton.status = 'normal';
+                for (const inputChild of inputChildren) {
+                    inputChild.disabled = false;
+                }
+                break;
+            case 'pending':
+                submitButton.disabled = true;
+                submitButton.status = 'pending';
+                for (const inputChild of inputChildren) {
+                    inputChild.disabled = true;
+                }
+                break;
+            case 'success':
+                submitButton.disabled = true;
+                submitButton.status = 'success';
+                for (const inputChild of inputChildren) {
+                    inputChild.disabled = true;
+                }
+                break;
+            case 'error':
+                submitButton.disabled = true;
+                submitButton.status = 'error';
+                for (const inputChild of inputChildren) {
+                    inputChild.disabled = true;
+                }
+                break;
+        }
+        submitButton.text = textStateArg;
+    }
+    async instrumentBehaviours() {
+        const children = this.getFormChildren();
+        for (const child of children) {
+            child.addEventListener('keydown', (eventArg) => {
+                if (eventArg.key === 'Enter') {
+                    const currentIndex = children.indexOf(child);
+                    if (currentIndex < children.length - 1) {
+                        children[currentIndex + 1].focus();
+                    }
+                    else {
+                        children[currentIndex].blur();
+                        this.getSubmitButton().focus();
+                    }
+                }
+            });
+        }
+    }
+};
+DeesForm = __decorate([
+    customElement('dees-form')
+], DeesForm);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1mb3JtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL2RlZXMtZm9ybS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSxPQUFPLEVBQUUsYUFBYSxFQUFFLElBQUksRUFBdUIsV0FBVyxHQUFtQixNQUFNLDZCQUE2QixDQUFDO0FBQ3JILE9BQU8sS0FBSyxRQUFRLE1BQU0sOEJBQThCLENBQUM7QUFFekQsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFDN0QsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ3JELE9BQU8sRUFBRSx5QkFBeUIsRUFBRSxNQUFNLGtDQUFrQyxDQUFDO0FBQzdFLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUN2RCxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFhaEQsV0FBTSxRQUFRLEdBQWQsTUFBTSxRQUFTLFNBQVEsV0FBVztJQUFsQzs7UUFzQkUsU0FBSSxHQUFXLFFBQVEsQ0FBQztRQUN4QixrQkFBYSxHQUFHLElBQUksUUFBUSxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztJQW1KckQsQ0FBQzthQXpLZSxTQUFJLEdBQUcsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFBOzs7a0JBR2YsS0FBSyxFQUFFLFFBQVEsRUFBRSxFQUFFO1FBQzdCLE1BQU0sSUFBSSxHQUFhLFFBQVEsQ0FBQyxhQUFhLENBQUM7UUFDOUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxTQUFTLEVBQUUsbUJBQW1CLENBQUMsQ0FBQztRQUMvQyxNQUFNLFFBQVEsQ0FBQyxPQUFPLENBQUMsVUFBVSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUNqRCxJQUFJLENBQUMsU0FBUyxDQUFDLFNBQVMsRUFBRSxnQkFBZ0IsQ0FBQyxDQUFDO0lBQzlDLENBQUM7O29DQUU2QixJ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

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

@@ -0,0 +1,76 @@
+import { DeesElement, type CSSResult } from '@design.estate/dees-element';
+import { type IconDefinition } from '@fortawesome/fontawesome-svg-core';
+export declare const faIcons: {
+    arrowRight: IconDefinition;
+    arrowUpRightFromSquare: IconDefinition;
+    arrowUpRightFromSquareSolid: IconDefinition;
+    bell: IconDefinition;
+    bellSolid: IconDefinition;
+    bug: IconDefinition;
+    bugSolid: IconDefinition;
+    building: IconDefinition;
+    buildingSolid: IconDefinition;
+    caretLeft: IconDefinition;
+    caretLeftSolid: IconDefinition;
+    caretRight: IconDefinition;
+    caretRightSolid: IconDefinition;
+    check: IconDefinition;
+    checkSolid: IconDefinition;
+    circleInfo: IconDefinition;
+    circleInfoSolid: IconDefinition;
+    circleCheck: IconDefinition;
+    circleCheckSolid: IconDefinition;
+    circleXmark: IconDefinition;
+    circleXmarkSolid: IconDefinition;
+    copy: IconDefinition;
+    copySolid: IconDefinition;
+    desktop: IconDefinition;
+    desktopSolid: IconDefinition;
+    eye: IconDefinition;
+    eyeSolid: IconDefinition;
+    eyeSlash: IconDefinition;
+    eyeSlashSolid: IconDefinition;
+    grip: IconDefinition;
+    gripSolid: IconDefinition;
+    message: IconDefinition;
+    messageSolid: IconDefinition;
+    mugHot: IconDefinition;
+    faMugHotSolid: IconDefinition;
+    minus: IconDefinition;
+    minusSolid: IconDefinition;
+    paste: IconDefinition;
+    pasteSolid: IconDefinition;
+    penToSquare: IconDefinition;
+    penToSquareSolid: IconDefinition;
+    rss: IconDefinition;
+    rssSolid: IconDefinition;
+    share: IconDefinition;
+    shareSolid: IconDefinition;
+    sun: IconDefinition;
+    sunSolid: IconDefinition;
+    xmark: IconDefinition;
+    xmarkSolid: IconDefinition;
+    facebook: IconDefinition;
+    google: IconDefinition;
+    instagram: IconDefinition;
+    linkedin: IconDefinition;
+    medium: IconDefinition;
+    slack: IconDefinition;
+    tiktok: IconDefinition;
+    twitter: IconDefinition;
+    users: IconDefinition;
+};
+declare global {
+    interface HTMLElementTagNameMap {
+        'dees-icon': DeesIcon;
+    }
+}
+export declare class DeesIcon extends DeesElement {
+    static demo: () => import("@design.estate/dees-element").TemplateResult<1>;
+    iconFA: keyof typeof faIcons;
+    iconSize: number;
+    constructor();
+    static styles: CSSResult[];
+    render(): import("@design.estate/dees-element").TemplateResult<1>;
+    updated(): Promise<void>;
+}

package/dist_ts_web/elements/dees-icon.js

@@ -0,0 +1,153 @@
+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, property, customElement, cssManager, css, } from '@design.estate/dees-element';
+import * as domtools from '@design.estate/dees-domtools';
+import { icon } from '@fortawesome/fontawesome-svg-core';
+import { faFacebook, faGoogle, faLinkedin, faMedium, faSlackHash, faTwitter, faInstagram, faTiktok, } from '@fortawesome/free-brands-svg-icons';
+import { faCopy as faCopyRegular, faCircleCheck as faCircleCheckRegular, faCircleXmark as faCircleXmarkRegular, faMessage as faMessageRegular, faPaste as faPasteRegular, faSun as faSunRegular, } from '@fortawesome/free-regular-svg-icons';
+import { faArrowRight as faArrowRightSolid, faArrowUpRightFromSquare as faArrowUpRightFromSquareSolid, faBell as faBellSolid, faBug as faBugSolid, faBuilding as faBuildingSolid, faCaretLeft as faCaretLeftSolid, faCaretRight as faCaretRightSolid, faCheck as faCheckSolid, faCircleInfo as faCircleInfoSolid, faCircleCheck as faCircleCheckSolid, faCircleXmark as faCircleXmarkSolid, faCopy as faCopySolid, faDesktop as faDesktopSolid, faEye as faEyeSolid, faEyeSlash as faEyeSlashSolid, faGrip as faGripSolid, faMessage as faMessageSolid, faMugHot as faMugHotSolid, faMinus as faMinusSolid, faPaste as faPasteSolid, faPenToSquare as faPenToSquareSolid, faRss as faRssSolid, faUsers as faUsersSolid, faShare as faShareSolid, faSun as faSunSolid, faXmark as faXmarkSolid, } from '@fortawesome/free-solid-svg-icons';
+export const faIcons = {
+    // normal
+    arrowRight: faArrowRightSolid,
+    arrowUpRightFromSquare: faArrowUpRightFromSquareSolid,
+    arrowUpRightFromSquareSolid: faArrowUpRightFromSquareSolid,
+    bell: faBellSolid,
+    bellSolid: faBellSolid,
+    bug: faBugSolid,
+    bugSolid: faBugSolid,
+    building: faBuildingSolid,
+    buildingSolid: faBuildingSolid,
+    caretLeft: faCaretLeftSolid,
+    caretLeftSolid: faCaretLeftSolid,
+    caretRight: faCaretRightSolid,
+    caretRightSolid: faCaretRightSolid,
+    check: faCheckSolid,
+    checkSolid: faCheckSolid,
+    circleInfo: faCircleInfoSolid,
+    circleInfoSolid: faCircleInfoSolid,
+    circleCheck: faCircleCheckRegular,
+    circleCheckSolid: faCircleCheckSolid,
+    circleXmark: faCircleXmarkRegular,
+    circleXmarkSolid: faCircleXmarkSolid,
+    copy: faCopyRegular,
+    copySolid: faCopySolid,
+    desktop: faDesktopSolid,
+    desktopSolid: faDesktopSolid,
+    eye: faEyeSolid,
+    eyeSolid: faEyeSolid,
+    eyeSlash: faEyeSlashSolid,
+    eyeSlashSolid: faEyeSlashSolid,
+    grip: faGripSolid,
+    gripSolid: faGripSolid,
+    message: faMessageRegular,
+    messageSolid: faMessageSolid,
+    mugHot: faMugHotSolid,
+    faMugHotSolid: faMugHotSolid,
+    minus: faMinusSolid,
+    minusSolid: faMinusSolid,
+    paste: faPasteRegular,
+    pasteSolid: faPasteSolid,
+    penToSquare: faPenToSquareSolid,
+    penToSquareSolid: faPenToSquareSolid,
+    rss: faRssSolid,
+    rssSolid: faRssSolid,
+    share: faShareSolid,
+    shareSolid: faShareSolid,
+    sun: faSunRegular,
+    sunSolid: faSunSolid,
+    xmark: faXmarkSolid,
+    xmarkSolid: faXmarkSolid,
+    // brands
+    facebook: faFacebook,
+    google: faGoogle,
+    instagram: faInstagram,
+    linkedin: faLinkedin,
+    medium: faMedium,
+    slack: faSlackHash,
+    tiktok: faTiktok,
+    twitter: faTwitter,
+    users: faUsersSolid,
+};
+export let DeesIcon = class DeesIcon extends DeesElement {
+    static { this.demo = () => html `
+    <dees-icon iconName="visibility"></dees-icon>
+    <div style="background: #fff; padding: 10px; font-size: 30px">
+      <style>
+        dees-icon {
+          transition: color 0.05s;
+        }
+        dees-icon:hover {
+          color: #e4002b;
+        }
+      </style>
+      <dees-icon .iconFA=${'messageSolid'}></dees-icon>
+      <dees-icon .iconFA=${'sun'}></dees-icon>
+      <dees-icon .iconFA=${'sunSolid'}></dees-icon>
+      <dees-icon .iconFA=${'facebook'}></dees-icon>
+      <dees-icon .iconFA=${'arrowUpRightFromSquare'}></dees-icon>
+    </div>
+  `; }
+    constructor() {
+        super();
+        domtools.elementBasic.setup();
+    }
+    static { this.styles = [
+        cssManager.defaultStyles,
+        css `
+      :host {
+        display: block;
+        white-space: nowrap;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+      * {
+        transition: inherit !important;
+      }
+    `,
+    ]; }
+    render() {
+        return html `
+      ${domtools.elementBasic.styles}
+      <style>
+        #iconContainer svg {
+          display: block;
+          height: ${this.iconSize}px;
+        }
+      </style>
+      <div id="iconContainer"></div>
+    `;
+    }
+    async updated() {
+        if (!this.iconSize) {
+            this.iconSize = parseInt(globalThis.getComputedStyle(this).fontSize.replace(/\D/g, ''));
+        }
+        if (this.iconFA) {
+            this.shadowRoot.querySelector('#iconContainer').innerHTML = this.iconFA
+                ? icon(faIcons[this.iconFA]).html[0]
+                : 'icon not found';
+        }
+    }
+};
+__decorate([
+    property({
+        type: String
+    }),
+    __metadata("design:type", Object)
+], DeesIcon.prototype, "iconFA", void 0);
+__decorate([
+    property(),
+    __metadata("design:type", Number)
+], DeesIcon.prototype, "iconSize", void 0);
+DeesIcon = __decorate([
+    customElement('dees-icon'),
+    __metadata("design:paramtypes", [])
+], DeesIcon);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1pY29uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL2RlZXMtaWNvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7QUFBQSxPQUFPLEVBQ0wsV0FBVyxFQUNYLElBQUksRUFDSixRQUFRLEVBQ1IsYUFBYSxFQUNiLFVBQVUsRUFDVixHQUFHLEdBRUosTUFBTSw2QkFBNkIsQ0FBQztBQUVyQyxPQUFPLEtBQUssUUFBUSxNQUFNLDhCQUE4QixDQUFDO0FBRXpELE9BQU8sRUFBRSxJQUFJLEVBQXVCLE1BQU0sbUNBQW1DLENBQUM7QUFDOUUsT0FBTyxFQUNMLFVBQVUsRUFDVixRQUFRLEVBQ1IsVUFBVSxFQUNWLFFBQVEsRUFDUixXQUFXLEVBQ1gsU0FBUyxFQUNULFdBQVcsRUFDWCxRQUFRLEdBQ1QsTUFBTSxvQ0FBb0MsQ0FBQztBQUU1QyxPQUFPLEVBQ0wsTUFBTSxJQUFJLGFBQWEsRUFDdkIsYUFBYSxJQUFJLG9CQUFvQixFQUNyQyxhQUFhLElBQUksb0JBQW9CLEVBQ3JDLFNBQVMsSUFBSSxnQkFBZ0IsRUFDN0IsT0FBTyxJQUFJLGNBQWMsRUFDekIsS0FBSyxJQUFJLFlBQVksR0FDdEIsTUFBTSxxQ0FBcUMsQ0FBQztBQUM3QyxPQUFPLEVBQ0wsWUFBWSxJQUFJLGlCQUFpQixFQUNqQyx3QkFBd0IsSUFBSSw2QkFBNkIsRUFDekQsTUFBTSxJQUFJLFdBQVcsRUFDckIsS0FBSyxJQUFJLFVBQVUsRUFDbkIsVUFBVSxJQUFJLGVBQWUsRUFDN0IsV0FBVyxJQUFJLGdCQUFnQixFQUMvQixZQUFZLElBQUksaUJBQWlCLEVBQ2pDLE9BQU8sSUFBSSxZQUFZLEVBQ3ZCLFlBQVksSUFBSSxpQkFBaUIsRUFDakMsYUFBYSxJQUFJLGtCQUFrQixFQUNuQyxhQUFhLElBQUksa0JBQWtCLEVBQ25DLE1BQU0sSUFBSSxXQUFXLEVBQ3JCLFNBQVMsSUFBSSxjQUFjLEVBQzNCLEtBQUssSUFBSSxV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

package/dist_ts_web/elements/dees-input-checkbox.d.ts

@@ -0,0 +1,18 @@
+import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
+import * as domtools from '@design.estate/dees-domtools';
+declare global {
+    interface HTMLElementTagNameMap {
+        'dees-input-checkbox': DeesInputCheckbox;
+    }
+}
+export declare class DeesInputCheckbox extends DeesElement {
+    static demo: () => TemplateResult<1>;
+    changeSubject: domtools.rxjs.Subject<unknown>;
+    key: string;
+    label: string;
+    value: boolean;
+    required: boolean;
+    disabled: boolean;
+    render(): TemplateResult;
+    toggleSelected(): Promise<void>;
+}

package/dist_ts_web/elements/dees-input-checkbox.js

@@ -0,0 +1,178 @@
+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, DeesElement, property, html, css, cssManager, } from '@design.estate/dees-element';
+import * as domtools from '@design.estate/dees-domtools';
+export let DeesInputCheckbox = class DeesInputCheckbox extends DeesElement {
+    constructor() {
+        super(...arguments);
+        // INSTANCE
+        this.changeSubject = new domtools.rxjs.Subject();
+        this.label = 'Label';
+        this.value = false;
+        this.required = false;
+        this.disabled = false;
+    }
+    // STATIC
+    static { this.demo = () => html `<dees-input-checkbox></dees-input-checkbox>`; }
+    render() {
+        return html `
+      ${domtools.elementBasic.styles}
+      <style>
+        * {
+          box-sizing: border-box;
+        }
+
+        :host {
+          display: block;
+          position: relative;
+          margin: 20px 0px;
+          cursor: pointer;
+        }
+
+        .maincontainer {
+          display: grid;
+          grid-template-columns: 25px auto;
+          padding: 5px 0px;
+          color: ${this.goBright ? '#333' : '#ccc'};
+        }
+
+        .maincontainer:hover {
+          ${this.goBright ? '#000' : '#ccc'};
+        }
+
+        .label {
+          margin-left: 15px;
+          line-height: 25px;
+          font-size: 14px;
+          font-weight: normal;
+        }
+
+        input:focus {
+          outline: none;
+          border-bottom: 1px solid #e4002b;
+        }
+
+        .checkbox {
+          transition: all 0.1s;
+          box-sizing: border-box;
+          border: 1px solid ${this.goBright ? '#CCC' : '#999'};
+          border-radius: 2px;
+          height: 24px;
+          width: 24px;
+          display: inline-block;
+          background: ${this.goBright ? '#fafafa' : '#222'};
+        }
+
+        .checkbox.selected {
+          background: #039BE5;
+          border: 1px solid #039BE5;
+        }
+
+        .checkbox.disabled {
+          background: none;
+          border: 1px dashed ${cssManager.bdTheme('#666666', '#666666')};
+        }
+
+        .checkbox .checkmark {
+          display: inline-block;
+          width: 22px;
+          height: 22px;
+          -ms-transform: rotate(45deg); /* IE 9 */
+          -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
+          transform: rotate(45deg);
+        }
+
+        .checkbox .checkmark_stem {
+          position: absolute;
+          width: 3px;
+          height: 9px;
+          background-color: #fff;
+          left: 11px;
+          top: 6px;
+        }
+
+        .checkbox .checkmark_kick {
+          position: absolute;
+          width: 3px;
+          height: 3px;
+          background-color: #fff;
+          left: 8px;
+          top: 12px;
+        }
+
+        .checkbox.disabled .checkmark_stem, .checkbox.disabled .checkmark_kick {
+          background-color: ${cssManager.bdTheme('#333', '#fff')};
+        }
+
+        img {
+          padding: 4px;
+        }
+      </style>
+      <div class="maincontainer" @click="${this.toggleSelected}">
+        <div class="checkbox ${this.value ? 'selected' : ''} ${this.disabled ? 'disabled' : ''}">
+          ${this.value
+            ? html `
+                <span class="checkmark">
+                  <div class="checkmark_stem"></div>
+                  <div class="checkmark_kick"></div>
+                </span>
+              `
+            : html ``}
+        </div>
+        <div class="label">${this.label}</div>
+      </div>
+    `;
+    }
+    async toggleSelected() {
+        if (this.disabled) {
+            return;
+        }
+        this.value = !this.value;
+        this.dispatchEvent(new CustomEvent('newValue', {
+            detail: this.value,
+            bubbles: true,
+        }));
+        this.changeSubject.next(this);
+    }
+};
+__decorate([
+    property({
+        type: String,
+    }),
+    __metadata("design:type", String)
+], DeesInputCheckbox.prototype, "key", void 0);
+__decorate([
+    property({
+        type: String,
+    }),
+    __metadata("design:type", String)
+], DeesInputCheckbox.prototype, "label", void 0);
+__decorate([
+    property({
+        type: Boolean,
+    }),
+    __metadata("design:type", Boolean)
+], DeesInputCheckbox.prototype, "value", void 0);
+__decorate([
+    property({
+        type: Boolean,
+    }),
+    __metadata("design:type", Boolean)
+], DeesInputCheckbox.prototype, "required", void 0);
+__decorate([
+    property({
+        type: Boolean
+    }),
+    __metadata("design:type", Boolean)
+], DeesInputCheckbox.prototype, "disabled", void 0);
+DeesInputCheckbox = __decorate([
+    customElement('dees-input-checkbox')
+], DeesInputCheckbox);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1pbnB1dC1jaGVja2JveC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3RzX3dlYi9lbGVtZW50cy9kZWVzLWlucHV0LWNoZWNrYm94LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7OztBQUFBLE9BQU8sRUFDTCxhQUFhLEVBQ2IsV0FBVyxFQUVYLFFBQVEsRUFDUixJQUFJLEVBQ0osR0FBRyxFQUNILFVBQVUsR0FFWCxNQUFNLDZCQUE2QixDQUFDO0FBQ3JDLE9BQU8sS0FBSyxRQUFRLE1BQU0sOEJBQThCLENBQUM7QUFTbEQsV0FBTSxpQkFBaUIsR0FBdkIsTUFBTSxpQkFBa0IsU0FBUSxXQUFXO0lBQTNDOztRQUlMLFdBQVc7UUFDSixrQkFBYSxHQUFHLElBQUksUUFBUSxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztRQVU1QyxVQUFLLEdBQVcsT0FBTyxDQUFDO1FBS3hCLFVBQUssR0FBWSxLQUFLLENBQUM7UUFLdkIsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUsxQixhQUFRLEdBQVksS0FBSyxDQUFDO0lBNkhuQyxDQUFDO0lBMUpDLFNBQVM7YUFDSyxTQUFJLEdBQUcsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFBLDZDQUE2QyxBQUExRCxDQUEyRDtJQThCdEUsTUFBTTtRQUNYLE9BQU8sSUFBSSxDQUFBO1FBQ1AsUUFBUSxDQUFDLFlBQVksQ0FBQyxNQUFNOzs7Ozs7Ozs7Ozs7Ozs7OzttQkFpQmpCLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsTUFBTTs7OztZQUl0QyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLE1BQU07Ozs7Ozs7Ozs7Ozs7Ozs7Ozs4QkFrQmIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNOzs7Ozt3QkFLckMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxNQUFNOzs7Ozs7Ozs7OytCQVUzQixVQUFVLENBQUMsT0FBTyxDQUFDLFNBQVMsRUFBRSxTQUFTLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OEJBK0J6QyxVQUFVLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRSxNQUFNLENBQUM7Ozs7Ozs7MkNBT3JCLElBQUksQ0FBQyxjQUFjOytCQUMvQixJQUFJLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLEVBQUUsSUFBSSxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLEVBQUU7WUFDbEYsSUFBSSxDQUFDLEtBQUs7WUFDVixDQUFDLENBQUMsSUFBSSxDQUFBOzs7OztlQUtIO1lBQ0gsQ0FBQyxDQUFDLElBQUksQ0FBQSxFQUFFOzs2QkFFUyxJQUFJLENBQUMsS0FBSzs7S0FFbEMsQ0FBQztJQUNKLENBQUM7SUFFTSxLQUFLLENBQUMsY0FBYztRQUN6QixJQUFJLElBQUksQ0FBQyxRQUFRLEVBQUU7WUFDakIsT0FBTztTQUNSO1FBQ0QsSUFBSSxDQUFDLEtBQUssR0FBRyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUM7UUFDekIsSUFBSSxDQUFDLGFBQWEsQ0FDaEIsSUFBSSxXQUFXLENBQUMsVUFBVSxFQUFFO1lBQzFCLE1BQU0sRUFBRSxJQUFJLENBQUMsS0FBSztZQUNsQixPQUFPLEVBQUUsSUFBSTtTQUNkLENBQUMsQ0FDSCxDQUFDO1FBQ0YsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDaEMsQ0FBQzs7QUFoSk07SUFITixRQUFRLENBQUM7UUFDUixJQUFJLEVBQUUsTUFBTTtLQUNiLENBQUM7OzhDQUNpQjtBQUtaO0lBSE4sUUFBUSxDQUFDO1FBQ1IsSUFBSSxFQUFFLE1BQU07S0FDYixDQUFDOztnREFDNkI7QUFLeEI7SUFITixRQUFRLENBQUM7UUFDUixJQUFJLEVBQUUsT0FBTztLQUNkLENBQUM7O2dEQUM0QjtBQUt2QjtJQUhOLFFBQVEsQ0FBQztRQUNSLElBQUksRUFBRSxPQUFPO0tBQ2QsQ0FBQzs7bURBQytCO0FBSzFCO0lBSE4sUUFBUSxDQUFDO1FBQ1IsSUFBSSxFQUFFLE9BQU87S0FDZCxDQUFDOzttREFDK0I7QUE5QnRCLGlCQUFpQjtJQUQ3QixhQUFhLENBQUMscUJBQXFCLENBQUM7R0FDeEIsaUJBQWlCLENBMko3QiJ9

package/dist_ts_web/elements/dees-input-dropdown.d.ts

@@ -0,0 +1,30 @@
+import { DeesElement, type TemplateResult, type CSSResult } from '@design.estate/dees-element';
+import * as domtools from '@design.estate/dees-domtools';
+declare global {
+    interface HTMLElementTagNameMap {
+        'dees-input-dropdown': DeesInputDropdown;
+    }
+}
+export declare class DeesInputDropdown extends DeesElement {
+    static demo: () => TemplateResult<1>;
+    changeSubject: domtools.rxjs.Subject<unknown>;
+    label: string;
+    key: string;
+    options: {
+        option: string;
+        key: string;
+        payload?: any;
+    }[];
+    selectedOption: {
+        option: string;
+        key: string;
+        payload?: any;
+    };
+    required: boolean;
+    disabled: boolean;
+    static styles: CSSResult[];
+    render(): TemplateResult;
+    firstUpdated(): void;
+    updateSelection(selectedOption: any): Promise<void>;
+    toggleSelectionBox(): void;
+}