tinkiet 0.7.4 → 0.7.6

package/notie/notie.js

@@ -1,193 +0,0 @@
-import { __decorate } from 'tslib';
-import { css, unsafeCSS, html } from 'lit';
-import { state, property, query, customElement } from 'lit/decorators.js';
-import '../box/index.js';
-import '../textfield/index.js';
-import css_248z from './notie.scss.js';
-import { TkBox } from '../box/box.js';
-
-var TkNotie_1;
-var NotieType;
-(function (NotieType) {
-    NotieType["show"] = "show";
-    NotieType["force"] = "force";
-    NotieType["confirm"] = "confirm";
-    NotieType["input"] = "input";
-})(NotieType || (NotieType = {}));
-var NotieLevel;
-(function (NotieLevel) {
-    NotieLevel["success"] = "success";
-    NotieLevel["warning"] = "warning";
-    NotieLevel["error"] = "error";
-    NotieLevel["info"] = "info";
-    NotieLevel["neutral"] = "neutral";
-})(NotieLevel || (NotieLevel = {}));
-let TkNotie = TkNotie_1 = class TkNotie extends TkBox {
-    static get styles() {
-        return [
-            ...TkBox.styles,
-            css `
-				${unsafeCSS(css_248z)}
-			`
-        ];
-    }
-    render() {
-        return html `
-			<div class="overlay" @click=${() => this.hide(false)}></div>
-			<tk-box class="container ${this.level}">
-				${this.text
-            ? html `
-							<tk-box class="text" @click="${() => (this.type == NotieType.show ? this.hide(true) : null)}">${this.text}</tk-box>
-					  `
-            : ""}
-				${this.template
-            ? html `
-							<tk-box class="template" @click="${() => (this.type == NotieType.show ? this.hide(true) : null)}">${this.template}</tk-box>
-					  `
-            : ""}
-				${this.type == NotieType.force
-            ? html `
-							<tk-box @click="${() => this.hide(true)}" class="button force">${this.buttonText}</tk-box>
-					  `
-            : ""}
-				${this.type == NotieType.input
-            ? html `
-							<tk-textfield class="input" ></tk-textfield>
-					  `
-            : ""}
-				${this.type == NotieType.confirm || this.type == NotieType.input
-            ? html `
-							<tk-box direction="row">
-								<tk-box justify="center" align-items="center" flex="grow" @click="${() => this.hide(true)}" class="button confirm">
-									${this.confirmText}
-								</tk-box>
-								<tk-box justify="center" align-items="center" flex="grow" @click="${() => this.hide(false)}" class="button confirm cancel">
-									${this.cancelText}
-								</tk-box>
-							</tk-box>
-					  `
-            : ""}
-			</tk-box>
-		`;
-    }
-    show() {
-        return new Promise(resolve => {
-            this.resolve = resolve;
-            this.style.setProperty("display", "flex");
-            setTimeout(() => (this.open = true));
-            this.dispatchEvent(new Event("didShow"));
-            if (this.$input)
-                setTimeout(() => this.$input.focus());
-            if (this.type == NotieType.show)
-                setTimeout(() => this.hide(false), this.delay);
-        });
-    }
-    hide(value) {
-        if (value && this.type === NotieType.input)
-            value = this.$input.value;
-        if (!value && this.type === NotieType.input)
-            value = null;
-        this.$input ? (this.$input.value = "") : null;
-        this.$container.addEventListener("transitionend", () => {
-            this.dispatchEvent(new Event("didHide"));
-            this.resolve(value);
-            if (!this.persistent)
-                this.remove();
-        }, { once: true });
-        this.open = false;
-    }
-    constructor(text = "") {
-        super();
-        this.persistent = true;
-        this.open = false;
-        this.position = "bottom";
-        this.type = NotieType.show;
-        this.level = NotieLevel.info;
-        this.delay = 3000;
-        this.animationDelay = 300;
-        this.buttonText = "OK";
-        this.confirmText = "OK";
-        this.cancelText = "CANCEL";
-        this.text = text;
-    }
-    static show(options) {
-        const notie = this.getNotie(options, NotieType.show);
-        return notie.show();
-    }
-    static force(options) {
-        const notie = this.getNotie(options, NotieType.force);
-        options.buttonText ? (notie.buttonText = options.buttonText) : null;
-        return notie.show();
-    }
-    static confirm(options) {
-        const notie = this.getNotie(options, NotieType.confirm);
-        options.confirmText ? (notie.confirmText = options.confirmText) : null;
-        options.cancelText ? (notie.cancelText = options.cancelText) : null;
-        return notie.show();
-    }
-    static input(options) {
-        const notie = this.getNotie(options, NotieType.input);
-        options.password ? (notie.$input.type = "password") : null;
-        options.confirmText ? (notie.confirmText = options.confirmText) : null;
-        options.cancelText ? (notie.cancelText = options.cancelText) : null;
-        return notie.show();
-    }
-    static getNotie(options, type) {
-        var _a, _b;
-        const notie = new TkNotie_1(options.text);
-        notie.persistent = false;
-        notie.type = type;
-        notie.delay = (_a = options.delay) !== null && _a !== void 0 ? _a : 999999999;
-        options.template ? (notie.template = options.template) : null;
-        options.position ? (notie.position = options.position) : null;
-        options.background && notie.$container ? notie.$container.setAttribute("background-color", options.background) : null;
-        options.color && notie.$container ? notie.$container.setAttribute("color", options.color) : null;
-        options.container ? (_b = options.container.shadowRoot) === null || _b === void 0 ? void 0 : _b.appendChild(notie) : window.document.body.appendChild(notie);
-        options.zIndex ? notie.style.setProperty("z-index", options.zIndex.toString()) : null;
-        return notie;
-    }
-};
-__decorate([
-    state()
-], TkNotie.prototype, "persistent", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], TkNotie.prototype, "open", void 0);
-__decorate([
-    property({ reflect: true })
-], TkNotie.prototype, "position", void 0);
-__decorate([
-    property({ type: String })
-], TkNotie.prototype, "type", void 0);
-__decorate([
-    property({ type: String })
-], TkNotie.prototype, "level", void 0);
-__decorate([
-    property({ type: Number })
-], TkNotie.prototype, "delay", void 0);
-__decorate([
-    property()
-], TkNotie.prototype, "text", void 0);
-__decorate([
-    property()
-], TkNotie.prototype, "buttonText", void 0);
-__decorate([
-    property()
-], TkNotie.prototype, "confirmText", void 0);
-__decorate([
-    property()
-], TkNotie.prototype, "cancelText", void 0);
-__decorate([
-    property({ type: Object })
-], TkNotie.prototype, "template", void 0);
-__decorate([
-    query("tk-textfield")
-], TkNotie.prototype, "$input", void 0);
-__decorate([
-    query(".container")
-], TkNotie.prototype, "$container", void 0);
-TkNotie = TkNotie_1 = __decorate([
-    customElement("tk-notie")
-], TkNotie);
-
-export { TkNotie };

package/notie/notie.scss.js

@@ -1,4 +0,0 @@
-var css_248z = ":host{bottom:0;display:none;font-size:1.6rem;left:0;margin:0;position:fixed;right:0;top:0}:host .overlay{background-color:rgba(0,0,0,.502);bottom:0;left:0;position:fixed;right:0;top:0;z-index:var(--notie-z-index,400)}:host .container{background-color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));bottom:0;box-shadow:10px 10px 10px 10px var(--shadow);color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));height:fit-content;left:0;position:fixed;right:0;text-align:center;transform:translateY(100%);transition:all .15s ease-in;z-index:calc(var(--notie-z-index, 400) + 1)}:host .container.info{background-color:#4d82d6}:host .container.error{background-color:#e1715b}:host .container.warning{background-color:#d6a14d}:host .container.success{background-color:#57bf57}:host .text{padding:.5em}:host .input{--input-font-size:$font-size-widescreen;background-color:var(--background);color:var(--foreground);text-align:center}:host .button{cursor:pointer;padding:.5em}:host .button.confirm,:host .button.forcer{background-color:#57bf57;color:#fff}:host .button.cancel{background-color:var(--error,#e1715b);color:var(--on-error,#fff)}@media screen and (max-width:900px){:host{font-size:1.4rem}}@media screen and (max-width:750px){:host{font-size:1.2rem}}@media screen and (max-width:400px){:host{font-size:1rem}}:host([position=top]) .container{bottom:inherit;position:fixed;top:0;transform:translateY(-100%)}:host([open]) .container{transform:translateY(0)}";
-var stylesheet=":host{bottom:0;display:none;font-size:1.6rem;left:0;margin:0;position:fixed;right:0;top:0}:host .overlay{background-color:rgba(0,0,0,.502);bottom:0;left:0;position:fixed;right:0;top:0;z-index:var(--notie-z-index,400)}:host .container{background-color:var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%)));bottom:0;box-shadow:10px 10px 10px 10px var(--shadow);color:var(--on-primary,hsl(var(--on-primary-h,0),var(--on-primary-s,0%),var(--on-primary-l,100%)));height:fit-content;left:0;position:fixed;right:0;text-align:center;transform:translateY(100%);transition:all .15s ease-in;z-index:calc(var(--notie-z-index, 400) + 1)}:host .container.info{background-color:#4d82d6}:host .container.error{background-color:#e1715b}:host .container.warning{background-color:#d6a14d}:host .container.success{background-color:#57bf57}:host .text{padding:.5em}:host .input{--input-font-size:$font-size-widescreen;background-color:var(--background);color:var(--foreground);text-align:center}:host .button{cursor:pointer;padding:.5em}:host .button.confirm,:host .button.forcer{background-color:#57bf57;color:#fff}:host .button.cancel{background-color:var(--error,#e1715b);color:var(--on-error,#fff)}@media screen and (max-width:900px){:host{font-size:1.4rem}}@media screen and (max-width:750px){:host{font-size:1.2rem}}@media screen and (max-width:400px){:host{font-size:1rem}}:host([position=top]) .container{bottom:inherit;position:fixed;top:0;transform:translateY(-100%)}:host([open]) .container{transform:translateY(0)}";
-
-export { css_248z as default, stylesheet };

package/pages/index.d.ts

@@ -1 +0,0 @@
-export * from "./pages";

package/pages/index.js

@@ -1 +0,0 @@
-export { TkPages } from './pages.js';

package/pages/pages.d.ts

@@ -1,18 +0,0 @@
-import { LitElement } from "lit";
-declare class TkPages extends LitElement {
-    static styles: import("lit").CSSResult;
-    private _page;
-    set page(val: string);
-    get page(): string;
-    selected: string;
-    handleScroll: boolean;
-    private scrollHistory;
-    render(): import("lit-html").TemplateResult<1>;
-    updated(props: any): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        "tk-pages": TkPages;
-    }
-}
-export { TkPages };

package/pages/pages.js

@@ -1,75 +0,0 @@
-import { __decorate } from 'tslib';
-import { LitElement, html, css, unsafeCSS } from 'lit';
-import { property, customElement } from 'lit/decorators.js';
-import css_248z from './pages.scss.js';
-
-let TkPages = class TkPages extends LitElement {
-    constructor() {
-        super(...arguments);
-        this._page = "";
-        this.selected = "";
-        this.handleScroll = false;
-        this.scrollHistory = {};
-    }
-    set page(val) {
-        let oldVal = this._page;
-        this._page = val;
-        if (oldVal && this.handleScroll) {
-            const el = this.querySelector(`[page=${oldVal}]`);
-            if (el) {
-                const scrollElement = document.scrollingElement || document.documentElement;
-                this.scrollHistory[oldVal] = scrollElement.scrollTop;
-            }
-        }
-        this.requestUpdate("page", oldVal);
-    }
-    get page() {
-        return this._page;
-    }
-    render() {
-        return html `
-			<slot></slot>
-		`;
-    }
-    updated(props) {
-        if (props.has("page")) {
-            this.querySelectorAll(":scope > *").forEach(el => {
-                var _a;
-                const elPageAttribute = (_a = el.getAttribute("page")) !== null && _a !== void 0 ? _a : "default";
-                const scrollElement = document.scrollingElement || document.documentElement;
-                if (elPageAttribute == this.page) {
-                    el.removeAttribute("hidden");
-                    if (this.selected != "") {
-                        el.setAttribute(this.selected, "");
-                    }
-                    if (this.handleScroll && !el.hasAttribute("no-scroll")) {
-                        scrollElement.scrollTop = this.scrollHistory[elPageAttribute] ? this.scrollHistory[elPageAttribute] : 0;
-                    }
-                }
-                else {
-                    el.setAttribute("hidden", "");
-                    if (this.selected != "") {
-                        el.removeAttribute(this.selected);
-                    }
-                }
-            });
-        }
-    }
-};
-TkPages.styles = css `
-		${unsafeCSS(css_248z)}
-	`;
-__decorate([
-    property({ attribute: "page", type: String })
-], TkPages.prototype, "page", null);
-__decorate([
-    property({ attribute: true, type: String })
-], TkPages.prototype, "selected", void 0);
-__decorate([
-    property({ attribute: "handle-scroll", type: Boolean })
-], TkPages.prototype, "handleScroll", void 0);
-TkPages = __decorate([
-    customElement("tk-pages")
-], TkPages);
-
-export { TkPages };

package/pages/pages.scss.js

@@ -1,4 +0,0 @@
-var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}";
-var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}";
-
-export { css_248z as default, stylesheet };

package/radio/index.d.ts

@@ -1 +0,0 @@
-export * from "./radio";

package/radio/index.js

@@ -1 +0,0 @@
-export { TkRadio } from './radio.js';

package/radio/radio.d.ts

@@ -1,24 +0,0 @@
-import { LitElement } from "lit";
-declare class TkRadio extends LitElement {
-    static styles: import("lit").CSSResult;
-    private _id;
-    name: string;
-    checked: boolean;
-    required: boolean;
-    disabled: boolean;
-    readonly: boolean;
-    value: string;
-    private $input;
-    render(): import("lit-html").TemplateResult<1>;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    firstUpdated(): void;
-    protected onKeyDown(e: KeyboardEvent): void;
-    protected handleClick(): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        "tk-radio": TkRadio;
-    }
-}
-export { TkRadio };

package/radio/radio.js

@@ -1,98 +0,0 @@
-import { __decorate } from 'tslib';
-import { LitElement, html, css, unsafeCSS } from 'lit';
-import { property, query, customElement } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import '../box/index.js';
-import { uniqueID } from '../utils/unique.js';
-import css_248z from './radio.scss.js';
-
-let TkRadio = class TkRadio extends LitElement {
-    constructor() {
-        super(...arguments);
-        this._id = uniqueID();
-        this.checked = false;
-        this.required = false;
-        this.disabled = false;
-        this.readonly = false;
-    }
-    render() {
-        return html `
-			<tk-box direction="row" align-items="center">
-				<div tabindex="0" class="radio">
-					<div id="dot"></div>
-				</div>
-				<span class="label"><slot></slot></span>
-			</tk-box>
-			<input
-				id=${this._id}
-				type="radio"
-				style="position: absolute;left: 0;z-index: -1;"
-				?checked="${this.checked}"
-				.checked=${this.checked}
-				?required="${this.required}"
-				?disabled="${this.disabled}"
-				?readonly="${this.readonly}"
-				value="${ifDefined(this.value)}"
-				name="${ifDefined(this.name)}"
-				tabindex="-1"
-			/>
-		`;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        this.addEventListener("click", this.handleClick.bind(this));
-        this.addEventListener("keydown", this.onKeyDown.bind(this));
-    }
-    disconnectedCallback() {
-        super.disconnectedCallback();
-        this.removeEventListener("click", this.handleClick);
-        this.removeEventListener("keydown", this.onKeyDown);
-    }
-    firstUpdated() {
-        this.appendChild(this.$input);
-    }
-    onKeyDown(e) {
-        if (e.code === "Space" || e.code === "Enter") {
-            e.preventDefault();
-            e.stopPropagation();
-            this.click();
-        }
-    }
-    handleClick() {
-        this.checked = !this.checked;
-        if (this.checked && this.name)
-            this.getRootNode()
-                .querySelectorAll(`tk-radio[name="${this.name}"]`)
-                .forEach(el => (el != this ? (el.checked = false) : null));
-        setTimeout(() => this.dispatchEvent(new Event("change", { bubbles: true, composed: true })));
-    }
-};
-TkRadio.styles = css `
-		${unsafeCSS(css_248z)}
-	`;
-__decorate([
-    property({ attribute: true, type: String })
-], TkRadio.prototype, "name", void 0);
-__decorate([
-    property({ attribute: true, type: Boolean, reflect: true })
-], TkRadio.prototype, "checked", void 0);
-__decorate([
-    property({ type: Boolean })
-], TkRadio.prototype, "required", void 0);
-__decorate([
-    property({ type: Boolean })
-], TkRadio.prototype, "disabled", void 0);
-__decorate([
-    property({ type: Boolean })
-], TkRadio.prototype, "readonly", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], TkRadio.prototype, "value", void 0);
-__decorate([
-    query("input")
-], TkRadio.prototype, "$input", void 0);
-TkRadio = __decorate([
-    customElement("tk-radio")
-], TkRadio);
-
-export { TkRadio };

package/radio/radio.scss.js

@@ -1,4 +0,0 @@
-var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_radio-bg:var(--radio-bg,#0000);--_radio-color:var(--radio-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));display:inline-flex}:host .radio{align-items:center;background:var(--_radio-bg);border:var(--radio-border-config,.125rem solid) currentColor;border-radius:var(--radio-border-radius,100%);color:var(--_radio-color);display:inline-flex;height:var(--radio-size,1.25rem);justify-content:center;outline:none;position:relative;transition:var(--radio-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),border-color var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));-webkit-user-select:none;user-select:none;width:var(--radio-size,1.25rem)}:host .label{font-size:1.1em;margin-left:10px}:host(:not([disabled])){cursor:pointer}:host([checked]){--_radio-bg:var(--radio-bg-checked,#0000);--_radio-color:var(--radio-color-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([checked]) #dot{transform:scale(1)}:host(:focus),:host(:hover){will-change:border,background}:host(:focus) #dot,:host(:hover) #dot{will-change:transform,background}:host([disabled]){--_radio-bg:var(--radio-bg-disabled,#0000);--_radio-color:var(--radio-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));pointer-events:none}:host([disabled][checked]){--_radio-bg:var(--radio-bg-disabled-checked,#0000);--_radio-color:var(--radio-color-disabled-checked,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}#dot{background:currentColor;border-radius:var(--radio-dot-border-radius,100%);height:var(--radio-dot-size,.625rem);transform:scale(0);transition:var(--radio-dot-transition,transform var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--radio-dot-size,.625rem)}#ripple{transform:var(--radio-ripple-transform,translate(-50%,-50%) scale(1.8))}";
-var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_radio-bg:var(--radio-bg,#0000);--_radio-color:var(--radio-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));display:inline-flex}:host .radio{align-items:center;background:var(--_radio-bg);border:var(--radio-border-config,.125rem solid) currentColor;border-radius:var(--radio-border-radius,100%);color:var(--_radio-color);display:inline-flex;height:var(--radio-size,1.25rem);justify-content:center;outline:none;position:relative;transition:var(--radio-transition,background var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)),border-color var(--transition-duration-fast,.12s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));-webkit-user-select:none;user-select:none;width:var(--radio-size,1.25rem)}:host .label{font-size:1.1em;margin-left:10px}:host(:not([disabled])){cursor:pointer}:host([checked]){--_radio-bg:var(--radio-bg-checked,#0000);--_radio-color:var(--radio-color-checked,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([checked]) #dot{transform:scale(1)}:host(:focus),:host(:hover){will-change:border,background}:host(:focus) #dot,:host(:hover) #dot{will-change:transform,background}:host([disabled]){--_radio-bg:var(--radio-bg-disabled,#0000);--_radio-color:var(--radio-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));pointer-events:none}:host([disabled][checked]){--_radio-bg:var(--radio-bg-disabled-checked,#0000);--_radio-color:var(--radio-color-disabled-checked,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}#dot{background:currentColor;border-radius:var(--radio-dot-border-radius,100%);height:var(--radio-dot-size,.625rem);transform:scale(0);transition:var(--radio-dot-transition,transform var(--transition-duration-medium,.18s) var(--transition-timing-function-deceleration-curve,cubic-bezier(0,0,.2,1)));width:var(--radio-dot-size,.625rem)}#ripple{transform:var(--radio-ripple-transform,translate(-50%,-50%) scale(1.8))}";
-
-export { css_248z as default, stylesheet };

package/select/index.d.ts

@@ -1 +0,0 @@
-export * from "./select";

package/select/index.js

@@ -1 +0,0 @@
-export { TkSelect } from './select.js';

package/select/select.d.ts

@@ -1,32 +0,0 @@
-import { LitElement } from "lit";
-declare class TkSelect extends LitElement {
-    static styles: import("lit").CSSResult;
-    private _id;
-    set value(value: string);
-    get value(): string;
-    name: string;
-    list: string;
-    type: "email" | "number" | "password" | "text" | "search";
-    required: boolean;
-    disabled: boolean;
-    readonly: boolean;
-    autocomplete: "on" | "off";
-    pattern: string;
-    initialValue: string;
-    label: string;
-    min: number;
-    max: number;
-    minLength: number;
-    maxLength: number;
-    private $select;
-    render(): import("lit-html").TemplateResult<1>;
-    private handleChange;
-    firstUpdated(): void;
-    private refreshAttributes;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        "tk-select": TkSelect;
-    }
-}
-export { TkSelect };

package/select/select.js

@@ -1,132 +0,0 @@
-import { __decorate } from 'tslib';
-import { LitElement, html, css, unsafeCSS } from 'lit';
-import { property, state, eventOptions, customElement } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import '../box/index.js';
-import { uniqueID } from '../utils/unique.js';
-import css_248z from './select.scss.js';
-
-let TkSelect = class TkSelect extends LitElement {
-    constructor() {
-        super(...arguments);
-        this._id = uniqueID();
-        this.type = "text";
-        this.required = false;
-        this.disabled = false;
-        this.readonly = false;
-    }
-    set value(value) {
-        if (!this.$select) {
-            this.initialValue = value;
-        }
-        else {
-            this.$select.value = value;
-            this.refreshAttributes();
-        }
-    }
-    get value() {
-        return this.$select != null ? this.$select.value : this.initialValue || "";
-    }
-    render() {
-        return html `
-			<div id="container">
-				<slot id="before" name="before"></slot>
-				<div id="wrapper">
-					<div id="label">${this.label}</div>
-					<slot id="slot"></slot>
-					<select
-						id="${this._id}"
-						@keydown=${this.handleChange.bind(this)}
-						@input=${this.handleChange.bind(this)}
-						@focusout=${this.handleChange.bind(this)}
-						@change=${this.handleChange.bind(this)}
-						.value="${this.initialValue}"
-						?required="${this.required}"
-						?disabled="${this.disabled}"
-						?readonly="${this.readonly}"
-						name="${ifDefined(this.name)}"
-						autocomplete="${ifDefined(this.autocomplete)}"
-						tabindex="${this.disabled ? -1 : 0}"
-					></select>
-					<svg id="arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 25" preserveAspectRatio="none">
-						<polygon points="0,0 50,0 25,25" />
-					</svg>
-				</div>
-				<slot id="after" name="after"></slot>
-			</div>
-		`;
-    }
-    handleChange() {
-        this.refreshAttributes();
-    }
-    firstUpdated() {
-        var _a;
-        this.$select = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("select");
-        this.appendChild(this.$select);
-        const options = this.querySelectorAll("option");
-        options.forEach(option => this.$select.appendChild(option));
-        if (this.initialValue)
-            this.value = this.initialValue;
-    }
-    refreshAttributes() {
-        this.$select.value ? this.setAttribute("dirty", "") : this.removeAttribute("dirty");
-        this.$select.checkValidity() ? this.removeAttribute("invalid") : this.setAttribute("invalid", "");
-        setTimeout(() => this.dispatchEvent(new Event("change", { bubbles: true, composed: true })));
-    }
-};
-TkSelect.styles = css `
-		${unsafeCSS(css_248z)}
-	`;
-__decorate([
-    property({ type: String })
-], TkSelect.prototype, "value", null);
-__decorate([
-    property({ attribute: true, type: String })
-], TkSelect.prototype, "name", void 0);
-__decorate([
-    property({ type: String })
-], TkSelect.prototype, "list", void 0);
-__decorate([
-    property({ type: String })
-], TkSelect.prototype, "type", void 0);
-__decorate([
-    property({ type: Boolean })
-], TkSelect.prototype, "required", void 0);
-__decorate([
-    property({ type: Boolean })
-], TkSelect.prototype, "disabled", void 0);
-__decorate([
-    property({ type: Boolean })
-], TkSelect.prototype, "readonly", void 0);
-__decorate([
-    property({ type: String })
-], TkSelect.prototype, "autocomplete", void 0);
-__decorate([
-    property({ type: String })
-], TkSelect.prototype, "pattern", void 0);
-__decorate([
-    state()
-], TkSelect.prototype, "initialValue", void 0);
-__decorate([
-    property({ type: String })
-], TkSelect.prototype, "label", void 0);
-__decorate([
-    property({ type: Number })
-], TkSelect.prototype, "min", void 0);
-__decorate([
-    property({ type: Number })
-], TkSelect.prototype, "max", void 0);
-__decorate([
-    property({ type: Number })
-], TkSelect.prototype, "minLength", void 0);
-__decorate([
-    property({ type: Number })
-], TkSelect.prototype, "maxLength", void 0);
-__decorate([
-    eventOptions({ passive: true })
-], TkSelect.prototype, "handleChange", null);
-TkSelect = __decorate([
-    customElement("tk-select")
-], TkSelect);
-
-export { TkSelect };

package/select/select.scss.js

@@ -1,4 +0,0 @@
-var css_248z = "*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}#arrow{fill:var(--_input-state-color);height:8px;position:absolute;right:0;top:50%;transform:translate(-100%,-50%);z-index:-1}::slotted(option){display:none}:host(:not([dirty])) ::slotted(select){opacity:0}";
-var stylesheet="*{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;box-sizing:border-box}:host{--_input-state-color:var(--input-state-color-inactive,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-padding-left-right:var(--input-padding-left-right,0);--_input-bg:var(--input-bg,#0000);--_input-border-radius:0;--_input-color:var(--input-color,var(--foreground,#454545));--_input-label-color:var(--input-label-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-border-style:var(--input-border-style,solid);display:block;outline:none;transform:translateZ(0)}:host([disabled]){--_input-state-color:var(--input-state-color-disabled,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))));--_input-label-color:var(--input-label-color-disabled,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))));--_input-color:var(--input-color-disabled,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))));--_input-border-style:var(--input-border-style-disabled,dashed);pointer-events:none}#container{align-items:center;background:var(--_input-bg);border-bottom:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color);border-radius:var(--_input-border-radius);color:var(--_input-color);display:flex;font-size:var(--input-font-size,1rem);overflow:hidden;position:relative;transition:var(--input-transition,border-color var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease),background var(--transition-duration-medium,.18s) var(--transition-timing-function-ease,ease))}#wrapper{flex-grow:1;position:relative}#label{color:var(--_input-label-color);font-size:inherit;left:var(--_input-padding-left-right);line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:var(--input-label-transition,top var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),font-size var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear),transform var(--transition-duration-fast,.12s) var(--transition-timing-function-linear,linear));-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:1}:host(:hover){--_input-state-color:var(--input-state-color-hover,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host([filled]),:host([outlined]){--_input-padding-left-right:var(--input-padding-left-right-outlined,0.75rem)}:host([filled]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem 0.5rem 0 0);--_input-bg:var(--input-bg,var(--shade-lighter,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.3))))}:host([filled]:hover){--_input-bg:var(--input-bg-filled-hover,var(--shade-light,hsl(var(--shade-h,0),var(--shade-s,0%),calc(var(--shade-l, 66.6667%)*1.15))))}:host([outlined]){--_input-border-radius:var(--input-border-radius-outlined,0.5rem)}:host([outlined]) #container{border:var(--input-border-width,.0625rem) var(--_input-border-style) var(--_input-state-color)}:host(:focus-within){--_input-state-color:var(--input-state-color-active,var(--primary,hsl(var(--primary-h,258.987),var(--primary-s,38.1643%),var(--primary-l,59.4118%))))}:host(:focus-within) #label,:host([dirty]) #label,:host([type=color]) #label,:host([type=date]) #label,:host([type=file]) #label,:host([type=range]) #label{font-size:var(--input-label-font-size,.75rem);top:var(--input-padding-top-bottom,.5rem);transform:translateY(0)}#slot-wrapper,::slotted(input),::slotted(select),::slotted(textarea){-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;-webkit-text-fill-color:var(--_input-color);-webkit-overflow-scrolling:touch;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#0000;border:none;box-sizing:border-box;caret-color:var(--_input-color-state);color:inherit;display:block;font-size:var(--input-font-size,1rem);margin:0;outline:none;padding:var(--input-padding-top-bottom,.5rem) var(--_input-padding-left-right);position:relative;text-align:var(--input-text-align,inherit);width:100%}:host([label]) #slot-wrapper,:host([label]) ::slotted(input),:host([label]) ::slotted(select),:host([label]) ::slotted(textarea){padding-top:calc(var(--input-label-space, .875rem) + var(--input-padding-top-bottom, .5rem))}:host([invalid]){--_input-state-color:var(--input-state-color-invalid,var(--error,hsl(var(--error-h,4.10526),var(--error-s,89.6226%),var(--error-l,58.4314%))))}::slotted(input[type=color]){cursor:pointer;height:3.75rem}::slotted([slot=after]),::slotted([slot=before]){color:var(--input-before-after-color,var(--shade,hsl(var(--shade-h,0),var(--shade-s,0%),var(--shade-l,66.6667%))))}:host(:not([outlined]):not([filled])) ::slotted([slot=before]){margin-right:var(--input-padding-left-right-outlined,.75rem)}:host(:not([outlined]):not([filled])) ::slotted([slot=after]),:host([filled]) ::slotted([slot=before]),:host([outlined]) ::slotted([slot=before]){margin-left:var(--input-padding-left-right-outlined,.75rem)}:host([filled]) ::slotted([slot=after]),:host([outlined]) ::slotted([slot=after]){margin-right:var(--input-padding-left-right-outlined,.75rem)}#arrow{fill:var(--_input-state-color);height:8px;position:absolute;right:0;top:50%;transform:translate(-100%,-50%);z-index:-1}::slotted(option){display:none}:host(:not([dirty])) ::slotted(select){opacity:0}";
-
-export { css_248z as default, stylesheet };

package/slider/index.d.ts

@@ -1 +0,0 @@
-export * from "./slider";

package/slider/index.js

@@ -1 +0,0 @@
-export { TkSlider } from './slider.js';