godown 2.7.7 → 3.0.0-canary.0

package/web-components/input/select-input.js

@@ -1,210 +0,0 @@
-import { __decorate } from "tslib";
-import { css, html, property } from "../../_deps.js";
-import { godown } from "../../decorators/godown.js";
-import { styles } from "../../decorators/styles.js";
-import { htmlSlot } from "../../lib/directives.js";
-import { svgDelta, svgX } from "../../lib/icons.js";
-import GodownInput from "../../proto/super-input.js";
-import { cssGlobalVars } from "../../styles/global.js";
-import { fieldStyle, inputStyle } from "../../styles/inputStyle.js";
-const protoName = "select-input";
-/**
- * {@linkcode SelectInput} select matched elements.
- *
- * This will not support multi-selection operations.
- *
- * @slot - Options.
- */
-let SelectInput = class SelectInput extends GodownInput {
-    constructor() {
-        super(...arguments);
-        /**
-         * Open content.
-         */
-        this.open = false;
-    }
-    render() {
-        return html `<div part="root" class="input-field">
-      <section part="selected">
-        ${this.value &&
-            html `<div class="selected-item">
-          ${this.value}
-          <i
-            @click="${() => {
-                this.value = "";
-            }}"
-            >${svgX()}</i
-          >
-        </div>`}
-      </section>
-      <input
-        part="input"
-        ?autofocus="${this.autofocus}"
-        id="${this.makeId}"
-        @focus="${() => {
-            this.open = true;
-        }}"
-        @input="${this._handleInput}"
-        placeholder="${this.placeholder}"
-      />
-      <label for="${this.makeId}"> <i>${svgDelta()}</i></label>
-      <div class="content" part="slot">${htmlSlot()}</div>
-    </div>`;
-    }
-    firstUpdated() {
-        super.firstUpdated();
-        this.addEvent(document, "click", (e) => {
-            const target = e.target;
-            if (!this.contains(e.target)) {
-                this.open = false;
-            }
-            else if (target !== this) {
-                const value = this.getOptionValue(target);
-                if (value) {
-                    this.select(value, target.textContent);
-                }
-            }
-        });
-    }
-    select(value, text) {
-        this.value = value;
-        this.text = text || value;
-        this._input.value = "";
-        this.filter();
-        this.dispatchEvent(new CustomEvent("change", { detail: this.namevalue() }));
-    }
-    filter(value) {
-        this.querySelectorAll("*").forEach((option) => {
-            const { style } = option;
-            if (!value) {
-                style.display = null;
-                return;
-            }
-            const optionValue = this.getOptionValue(option);
-            if (includesIgnoreCase(optionValue, value) || includesIgnoreCase(option.textContent, value)) {
-                style.display = null;
-            }
-            else {
-                style.display = "none";
-            }
-        });
-    }
-    reset() {
-        if (this.default) {
-            this.select(this.default, this.defaultText || this.default);
-        }
-    }
-    _handleInput() {
-        this.filter(this._input.value.trim());
-        this.dispatchEvent(new CustomEvent("input", { detail: this.namevalue() }));
-    }
-    focus(options) {
-        this._input?.focus(options);
-        this.open = true;
-    }
-    getOptionValue(option) {
-        return option.value || option.getAttribute("value") || "";
-    }
-};
-__decorate([
-    property({ type: Boolean, reflect: true })
-], SelectInput.prototype, "open", void 0);
-__decorate([
-    property()
-], SelectInput.prototype, "text", void 0);
-__decorate([
-    property({
-        attribute: "default-text",
-    })
-], SelectInput.prototype, "defaultText", void 0);
-SelectInput = __decorate([
-    godown(protoName),
-    styles([
-        inputStyle,
-        fieldStyle,
-        css `
-    :host {
-      background: var(--${cssGlobalVars.input}--background);
-      margin: var(--${cssGlobalVars.input}--outline-width);
-      outline: var(--${cssGlobalVars.input}--outline-width) solid transparent;
-      border-radius: var(--${cssGlobalVars.input}--radius);
-      height: var(--${cssGlobalVars.input}--height);
-      width: var(--${cssGlobalVars.input}--width);
-      display: block;
-    }
-
-    :host([open]) {
-      outline-color: var(--${cssGlobalVars.input}--outline-color);
-    }
-
-    input {
-      flex: 1;
-      width: 100%;
-      height: 100%;
-      cursor: inherit;
-      border: inherit;
-      background: none;
-      padding: 0 0 0 0.25em;
-      box-sizing: border-box;
-      border-radius: inherit;
-    }
-
-    section {
-      height: 100%;
-      overflow: hidden;
-      z-index: inherit;
-      border-radius: inherit;
-      max-width: calc(100% - 1.2em);
-    }
-
-    [part="root"] {
-      width: 100%;
-      z-index: inherit;
-      position: relative;
-      display: inline-flex;
-      align-items: center;
-      border-radius: inherit;
-    }
-
-    .content {
-      top: 100%;
-      position: absolute;
-      width: 100%;
-      z-index: 1;
-      margin-top: 1px;
-      visibility: hidden;
-      border-radius: inherit;
-    }
-
-    :host([open]) .content {
-      visibility: visible;
-    }
-  `,
-        css `
-    .selected-item {
-      background: var(--${cssGlobalVars.input}--true);
-      border-radius: inherit;
-      height: 100%;
-      float: left;
-      display: inline-flex;
-      font-style: normal;
-      align-items: center;
-      padding: 0 0.1em 0 0.2em;
-    }
-
-    .selected-item i {
-      height: -moz-fit-content;
-      height: fit-content;
-    }
-  `,
-    ])
-], SelectInput);
-export { SelectInput };
-export default SelectInput;
-function includesIgnoreCase(a, b) {
-    if (!a || !b) {
-        return false;
-    }
-    return a.toLowerCase().includes(b.toLowerCase());
-}
-//# sourceMappingURL=select-input.js.map

package/web-components/input/select-input.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"select-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/select-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property } from \"../../_deps.js\";\nimport { godown } from \"../../decorators/godown.js\";\nimport { styles } from \"../../decorators/styles.js\";\nimport { htmlSlot } from \"../../lib/directives.js\";\nimport { svgDelta, svgX } from \"../../lib/icons.js\";\nimport GodownInput from \"../../proto/super-input.js\";\nimport { cssGlobalVars } from \"../../styles/global.js\";\nimport { fieldStyle, inputStyle } from \"../../styles/inputStyle.js\";\n\nconst protoName = \"select-input\";\n\n/**\n * {@linkcode SelectInput} select matched elements.\n *\n * This will not support multi-selection operations.\n *\n * @slot - Options.\n */\n@godown(protoName)\n@styles([\n  inputStyle,\n  fieldStyle,\n  css`\n    :host {\n      background: var(--${cssGlobalVars.input}--background);\n      margin: var(--${cssGlobalVars.input}--outline-width);\n      outline: var(--${cssGlobalVars.input}--outline-width) solid transparent;\n      border-radius: var(--${cssGlobalVars.input}--radius);\n      height: var(--${cssGlobalVars.input}--height);\n      width: var(--${cssGlobalVars.input}--width);\n      display: block;\n    }\n\n    :host([open]) {\n      outline-color: var(--${cssGlobalVars.input}--outline-color);\n    }\n\n    input {\n      flex: 1;\n      width: 100%;\n      height: 100%;\n      cursor: inherit;\n      border: inherit;\n      background: none;\n      padding: 0 0 0 0.25em;\n      box-sizing: border-box;\n      border-radius: inherit;\n    }\n\n    section {\n      height: 100%;\n      overflow: hidden;\n      z-index: inherit;\n      border-radius: inherit;\n      max-width: calc(100% - 1.2em);\n    }\n\n    [part=\"root\"] {\n      width: 100%;\n      z-index: inherit;\n      position: relative;\n      display: inline-flex;\n      align-items: center;\n      border-radius: inherit;\n    }\n\n    .content {\n      top: 100%;\n      position: absolute;\n      width: 100%;\n      z-index: 1;\n      margin-top: 1px;\n      visibility: hidden;\n      border-radius: inherit;\n    }\n\n    :host([open]) .content {\n      visibility: visible;\n    }\n  `,\n  css`\n    .selected-item {\n      background: var(--${cssGlobalVars.input}--true);\n      border-radius: inherit;\n      height: 100%;\n      float: left;\n      display: inline-flex;\n      font-style: normal;\n      align-items: center;\n      padding: 0 0.1em 0 0.2em;\n    }\n\n    .selected-item i {\n      height: -moz-fit-content;\n      height: fit-content;\n    }\n  `,\n])\nexport class SelectInput extends GodownInput {\n  /**\n   * Open content.\n   */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /**\n   * Selected texts.\n   */\n  @property() text: string;\n  /**\n   * Selected texts.\n   */\n  @property({\n    attribute: \"default-text\",\n  })\n  defaultText: string;\n\n  protected render() {\n    return html`<div part=\"root\" class=\"input-field\">\n      <section part=\"selected\">\n        ${this.value &&\n        html`<div class=\"selected-item\">\n          ${this.value}\n          <i\n            @click=\"${() => {\n              this.value = \"\";\n            }}\"\n            >${svgX()}</i\n          >\n        </div>`}\n      </section>\n      <input\n        part=\"input\"\n        ?autofocus=\"${this.autofocus}\"\n        id=\"${this.makeId}\"\n        @focus=\"${() => {\n          this.open = true;\n        }}\"\n        @input=\"${this._handleInput}\"\n        placeholder=\"${this.placeholder}\"\n      />\n      <label for=\"${this.makeId}\"> <i>${svgDelta()}</i></label>\n      <div class=\"content\" part=\"slot\">${htmlSlot()}</div>\n    </div>`;\n  }\n\n  protected firstUpdated() {\n    super.firstUpdated();\n    this.addEvent(document, \"click\", (e) => {\n      const target = e.target as HTMLElement;\n      if (!this.contains(e.target as Node)) {\n        this.open = false;\n      } else if (target !== this) {\n        const value = this.getOptionValue(target);\n        if (value) {\n          this.select(value, target.textContent);\n        }\n      }\n    });\n  }\n\n  select(value: string, text?: string) {\n    this.value = value;\n    this.text = text || value;\n    this._input.value = \"\";\n    this.filter();\n    this.dispatchEvent(new CustomEvent(\"change\", { detail: this.namevalue() }));\n  }\n\n  filter(value?: string) {\n    this.querySelectorAll(\"*\").forEach((option: HTMLElement) => {\n      const { style } = option;\n      if (!value) {\n        style.display = null;\n        return;\n      }\n      const optionValue = this.getOptionValue(option);\n      if (includesIgnoreCase(optionValue, value) || includesIgnoreCase(option.textContent, value)) {\n        style.display = null;\n      } else {\n        style.display = \"none\";\n      }\n    });\n  }\n\n  reset() {\n    if (this.default) {\n      this.select(this.default, this.defaultText || this.default);\n    }\n  }\n\n  protected _handleInput() {\n    this.filter(this._input.value.trim());\n    this.dispatchEvent(new CustomEvent(\"input\", { detail: this.namevalue() }));\n  }\n\n  focus(options?: FocusOptions) {\n    this._input?.focus(options);\n    this.open = true;\n  }\n\n  getOptionValue(option: Element) {\n    return (option as HTMLOptionElement).value || option.getAttribute(\"value\") || \"\";\n  }\n  /**\n   * @deprecated\n   */\n  only: boolean;\n}\n\nexport default SelectInput;\n\nfunction includesIgnoreCase(a: string, b: string): boolean {\n  if (!a || !b) {\n    return false;\n  }\n  return a.toLowerCase().includes(b.toLowerCase());\n}\n"]}

package/web-components/input/split-input.d.ts

@@ -1,29 +0,0 @@
-import { type HTMLEvent } from "../../proto/godown-element";
-import GodownSuperInput from "../../proto/super-input.js";
-/**
- * {@linkcode SplitInput } renders multiple inputs.
- */
-export declare class SplitInput extends GodownSuperInput {
-    /**
-     * The number of simulated input boxes.
-     */
-    max: number;
-    /**
-     * Active index.
-     */
-    index: number;
-    _input: HTMLInputElement;
-    _spans: NodeListOf<HTMLSpanElement>;
-    current: number;
-    currentValue: (string | null)[];
-    protected render(): import("lit").TemplateResult<1>;
-    protected firstUpdated(): void;
-    protected _handleInput(e: HTMLEvent<HTMLInputElement>): void;
-    focus(): void;
-    focusAt(i: number): void;
-    blur(): void;
-    blurAt(i: number): void;
-    reset(): void;
-}
-export default SplitInput;
-//# sourceMappingURL=split-input.d.ts.map

package/web-components/input/split-input.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"split-input.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/split-input.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAC5D,OAAO,gBAAgB,MAAM,4BAA4B,CAAC;AAU1D;;GAEG;AACH,qBAuDa,UAAW,SAAQ,gBAAgB;IAC9C;;OAEG;IACyB,GAAG,SAAK;IACpC;;OAEG;IACyB,KAAK,SAAM;IAEvB,MAAM,EAAE,gBAAgB,CAAC;IACvB,MAAM,EAAE,UAAU,CAAC,eAAe,CAAC,CAAC;IACtD,OAAO,SAAK;IACZ,YAAY,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,CAAM;IAErC,SAAS,CAAC,MAAM;IAkBhB,SAAS,CAAC,YAAY;IAYtB,SAAS,CAAC,YAAY,CAAC,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC;IA4BrD,KAAK;IAIL,OAAO,CAAC,CAAC,EAAE,MAAM;IAQjB,IAAI;IAIJ,MAAM,CAAC,CAAC,EAAE,MAAM;IAKhB,KAAK;CASN;AAED,eAAe,UAAU,CAAC"}

package/web-components/input/split-input.js

@@ -1,184 +0,0 @@
-import { __decorate } from "tslib";
-import { css, html, property, query, queryAll } from "../../_deps.js";
-import { godown } from "../../decorators/godown.js";
-import { styles } from "../../decorators/styles.js";
-import GodownSuperInput from "../../proto/super-input.js";
-import { createScope, cssGlobalVars } from "../../styles/global.js";
-import { inputStyle } from "../../styles/inputStyle.js";
-const FOCUS = "focus";
-const protoName = "split-input";
-const cssScope = createScope(protoName);
-/**
- * {@linkcode SplitInput } renders multiple inputs.
- */
-let SplitInput = class SplitInput extends GodownSuperInput {
-    constructor() {
-        super(...arguments);
-        /**
-         * The number of simulated input boxes.
-         */
-        this.max = 6;
-        /**
-         * Active index.
-         */
-        this.index = -1;
-        this.current = 0;
-        this.currentValue = [];
-    }
-    render() {
-        return html `
-      <div part="root">
-        ${Array(this.max)
-            .fill(0)
-            .map(() => html `<span part="outline"><i part="inside"></i></span>`)}
-        <input
-          part="input"
-          id="${this.makeId}"
-          @blur=${() => {
-            this.blurAt(this.current);
-        }}
-          @input="${this._handleInput}"
-        />
-      </div>
-    `;
-    }
-    firstUpdated() {
-        this.currentValue = this.value.split("").concat(Array(this.max - this.value.length).fill(null));
-        this.current = this.index < 0 || this.index > this.max ? this.currentValue.indexOf(null) : this.index;
-        this._spans.forEach((span, index) => {
-            this.addEvent(span, "click", () => {
-                this.current = index;
-                this.focusAt(this.current);
-                this._input.focus();
-            });
-        });
-    }
-    _handleInput(e) {
-        if (e.data === null) {
-            if (this.currentValue[this.current] !== null) {
-                this.currentValue[this.current] = null;
-            }
-            else {
-                this.currentValue[this.current - 1] = null;
-                this.current = this.current - 1 < 0 ? 0 : this.current - 1;
-            }
-        }
-        else {
-            this.currentValue[this.current] = e.data;
-            if (this.current + 1 >= this.max) {
-                this.current = this.currentValue.indexOf(null);
-                if (this.current === -1) {
-                    this.blurAt(this.current);
-                }
-            }
-            else {
-                this.current += 1;
-            }
-        }
-        this.focus();
-        this._spans.forEach((span, index) => {
-            span.querySelector("i").innerText = this.currentValue[index] || "";
-        });
-        this.value = this.currentValue.join("");
-        this.dispatchEvent(new CustomEvent("input", { detail: this.value, bubbles: true, composed: true }));
-        this.dispatchEvent(new CustomEvent("change", { detail: this.value, composed: true }));
-    }
-    focus() {
-        this.focusAt(this.current);
-    }
-    focusAt(i) {
-        this._spans.forEach((span) => {
-            span.classList.remove(FOCUS);
-        });
-        this._spans[i]?.classList.add(FOCUS);
-        this._input.value = "";
-    }
-    blur() {
-        this.blurAt(this.current);
-    }
-    blurAt(i) {
-        this._spans[i]?.classList.remove(FOCUS);
-        this._input.blur();
-    }
-    reset() {
-        this.currentValue = Array(this.max).fill(null);
-        this.current = 0;
-        this._spans.forEach((span) => {
-            span.querySelector("i").innerText = "";
-        });
-        this.value = "";
-        this.dispatchEvent(new CustomEvent("change", { detail: this.value }));
-    }
-};
-__decorate([
-    property({ type: Number })
-], SplitInput.prototype, "max", void 0);
-__decorate([
-    property({ type: Number })
-], SplitInput.prototype, "index", void 0);
-__decorate([
-    query("input")
-], SplitInput.prototype, "_input", void 0);
-__decorate([
-    queryAll("span")
-], SplitInput.prototype, "_spans", void 0);
-SplitInput = __decorate([
-    godown(protoName),
-    styles([
-        inputStyle,
-        css `
-    :host {
-      --${cssScope}--outline: .15em solid var( --${cssGlobalVars.input}--outline-color);
-      margin: var(--${cssGlobalVars.input}--outline-width);
-      color: var(--${cssGlobalVars.foreground});
-      display: inline-block;
-      width: -moz-fit-content;
-      width: fit-content;
-      border-radius: 1px;
-    }
-
-    * {
-      font-size: 1em;
-      border-radius: inherit;
-    }
-
-    div {
-      gap: 0.25em;
-      position: relative;
-      vertical-align: top;
-      display: inline-flex;
-    }
-
-    span {
-      width: 1.45em;
-      height: 1.45em;
-      vertical-align: top;
-      display: inline-flex;
-      box-sizing: content-box;
-    }
-
-    i {
-      z-index: 1;
-      width: 100%;
-      height: inherit;
-      text-align: center;
-      background-color: var(--${cssGlobalVars.input}--background);
-    }
-
-    input {
-      width: 100%;
-      height: 100%;
-      opacity: 0;
-      background: none;
-      position: absolute;
-    }
-
-    .focus i {
-      outline: var(--${cssScope}--outline);
-    }
-  `,
-    ])
-], SplitInput);
-export { SplitInput };
-export default SplitInput;
-//# sourceMappingURL=split-input.js.map

package/web-components/input/split-input.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"split-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/split-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property, query, queryAll } from \"../../_deps.js\";\nimport { godown } from \"../../decorators/godown.js\";\nimport { styles } from \"../../decorators/styles.js\";\nimport { type HTMLEvent } from \"../../proto/godown-element\";\nimport GodownSuperInput from \"../../proto/super-input.js\";\nimport { createScope, cssGlobalVars } from \"../../styles/global.js\";\nimport { inputStyle } from \"../../styles/inputStyle.js\";\n\nconst FOCUS = \"focus\";\n\nconst protoName = \"split-input\";\n\nconst cssScope = createScope(protoName);\n\n/**\n * {@linkcode SplitInput } renders multiple inputs.\n */\n@godown(protoName)\n@styles([\n  inputStyle,\n  css`\n    :host {\n      --${cssScope}--outline: .15em solid var( --${cssGlobalVars.input}--outline-color);\n      margin: var(--${cssGlobalVars.input}--outline-width);\n      color: var(--${cssGlobalVars.foreground});\n      display: inline-block;\n      width: -moz-fit-content;\n      width: fit-content;\n      border-radius: 1px;\n    }\n\n    * {\n      font-size: 1em;\n      border-radius: inherit;\n    }\n\n    div {\n      gap: 0.25em;\n      position: relative;\n      vertical-align: top;\n      display: inline-flex;\n    }\n\n    span {\n      width: 1.45em;\n      height: 1.45em;\n      vertical-align: top;\n      display: inline-flex;\n      box-sizing: content-box;\n    }\n\n    i {\n      z-index: 1;\n      width: 100%;\n      height: inherit;\n      text-align: center;\n      background-color: var(--${cssGlobalVars.input}--background);\n    }\n\n    input {\n      width: 100%;\n      height: 100%;\n      opacity: 0;\n      background: none;\n      position: absolute;\n    }\n\n    .focus i {\n      outline: var(--${cssScope}--outline);\n    }\n  `,\n])\nexport class SplitInput extends GodownSuperInput {\n  /**\n   * The number of simulated input boxes.\n   */\n  @property({ type: Number }) max = 6;\n  /**\n   * Active index.\n   */\n  @property({ type: Number }) index = -1;\n\n  @query(\"input\") _input: HTMLInputElement;\n  @queryAll(\"span\") _spans: NodeListOf<HTMLSpanElement>;\n  current = 0;\n  currentValue: (string | null)[] = [];\n\n  protected render() {\n    return html`\n      <div part=\"root\">\n        ${Array(this.max)\n          .fill(0)\n          .map(() => html`<span part=\"outline\"><i part=\"inside\"></i></span>`)}\n        <input\n          part=\"input\"\n          id=\"${this.makeId}\"\n          @blur=${() => {\n            this.blurAt(this.current);\n          }}\n          @input=\"${this._handleInput}\"\n        />\n      </div>\n    `;\n  }\n\n  protected firstUpdated() {\n    this.currentValue = this.value.split(\"\").concat(Array(this.max - this.value.length).fill(null));\n    this.current = this.index < 0 || this.index > this.max ? this.currentValue.indexOf(null) : this.index;\n    this._spans.forEach((span, index) => {\n      this.addEvent(span, \"click\", () => {\n        this.current = index;\n        this.focusAt(this.current);\n        this._input.focus();\n      });\n    });\n  }\n\n  protected _handleInput(e: HTMLEvent<HTMLInputElement>) {\n    if (e.data === null) {\n      if (this.currentValue[this.current] !== null) {\n        this.currentValue[this.current] = null;\n      } else {\n        this.currentValue[this.current - 1] = null;\n        this.current = this.current - 1 < 0 ? 0 : this.current - 1;\n      }\n    } else {\n      this.currentValue[this.current] = e.data as string;\n      if (this.current + 1 >= this.max) {\n        this.current = this.currentValue.indexOf(null);\n        if (this.current === -1) {\n          this.blurAt(this.current);\n        }\n      } else {\n        this.current += 1;\n      }\n    }\n    this.focus();\n    this._spans.forEach((span, index) => {\n      span.querySelector(\"i\").innerText = this.currentValue[index] || \"\";\n    });\n    this.value = this.currentValue.join(\"\");\n    this.dispatchEvent(new CustomEvent(\"input\", { detail: this.value, bubbles: true, composed: true }));\n    this.dispatchEvent(new CustomEvent(\"change\", { detail: this.value, composed: true }));\n  }\n\n  focus() {\n    this.focusAt(this.current);\n  }\n\n  focusAt(i: number) {\n    this._spans.forEach((span) => {\n      span.classList.remove(FOCUS);\n    });\n    this._spans[i]?.classList.add(FOCUS);\n    this._input.value = \"\";\n  }\n\n  blur() {\n    this.blurAt(this.current);\n  }\n\n  blurAt(i: number) {\n    this._spans[i]?.classList.remove(FOCUS);\n    this._input.blur();\n  }\n\n  reset() {\n    this.currentValue = Array(this.max).fill(null);\n    this.current = 0;\n    this._spans.forEach((span) => {\n      span.querySelector(\"i\").innerText = \"\";\n    });\n    this.value = \"\";\n    this.dispatchEvent(new CustomEvent(\"change\", { detail: this.value }));\n  }\n}\n\nexport default SplitInput;\n"]}

package/web-components/input/switch-input.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"switch-input.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/switch-input.ts"],"names":[],"mappings":"AAGA,OAAO,WAAW,MAAM,4BAA4B,CAAC;AAMrD;;;;GAIG;AACH,qBA0Fa,WAAY,SAAQ,WAAW;IAC1C;;OAEG;IACH,IAAI,EAAE,KAAK,GAAG,MAAM,CAAC;IACrB;;OAEG;IAEyC,KAAK,UAAS;IAC1D;;OAEG;IACyC,OAAO,UAAS;IAC5D;;OAEG;IACyC,QAAQ,UAAS;IAC7D;;OAEG;IACS,OAAO,SAAW;IAC9B;;OAEG;IACS,KAAK,SAAQ;IAET,MAAM,EAAE,gBAAgB,CAAC;IAEzC,SAAS,CAAC,MAAM;IAiBhB,KAAK;IAKL,iBAAiB;IAUjB,SAAS,CAAC,aAAa;IAMvB,SAAS,IAAI,CAAC,MAAM,EAAE,OAAO,CAAC;CAG/B;AAED,eAAe,WAAW,CAAC"}

package/web-components/input/switch-input.js

@@ -1,189 +0,0 @@
-import { __decorate } from "tslib";
-import { css, html, property, query } from "../../_deps.js";
-import { godown } from "../../decorators/godown.js";
-import { styles } from "../../decorators/styles.js";
-import GodownInput from "../../proto/super-input.js";
-import { cssGlobalVars } from "../../styles/global.js";
-import { inputStyle } from "../../styles/inputStyle.js";
-const protoName = "switch-input";
-/**
- * {@linkcode SwitchInput } renders a switch.
- *
- * Inspired by Steam.
- */
-let SwitchInput = class SwitchInput extends GodownInput {
-    constructor() {
-        super(...arguments);
-        /**
-         * Border style.
-         */
-        // @property() variant: "fat" | "rect" = "rect";
-        this.round = false;
-        /**
-         * Whether this element is selected or not.
-         */
-        this.checked = false;
-        /**
-         * Whether this element is disabled or not.
-         */
-        this.disabled = false;
-        /**
-         * Parsed by JSON.parse to checked.
-         */
-        this.default = "false";
-        /**
-         * Input value.
-         */
-        this.value = "on";
-    }
-    render() {
-        return html `<div part="root" class="${this.round ? "round" : "rect"}">
-      <input
-        part="input"
-        @change="${this._handleChange}"
-        ?disabled="${this.disabled}"
-        ?checked="${this.checked}"
-        name="${this.name}"
-        id="${this.makeId}"
-        type="checkbox"
-      />
-      <span>
-        <i class="${this.checked}"><i></i></i>
-      </span>
-    </div>`;
-    }
-    reset() {
-        this.checked = this.default === "true";
-        this._input.checked = this.checked;
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        if (this.checked) {
-            this.default = "true";
-        }
-        if (this.default === "true") {
-            this.checked = true;
-        }
-    }
-    _handleChange() {
-        this.checked = this._input.checked;
-        this.dispatchEvent(new CustomEvent("input", { detail: this.checked, bubbles: true, composed: true }));
-        this.dispatchEvent(new CustomEvent("change", { detail: this.checked, composed: true }));
-    }
-    namevalue() {
-        return [this.name, this.checked];
-    }
-};
-__decorate([
-    property({ type: Boolean, reflect: true })
-], SwitchInput.prototype, "round", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], SwitchInput.prototype, "checked", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], SwitchInput.prototype, "disabled", void 0);
-__decorate([
-    property()
-], SwitchInput.prototype, "default", void 0);
-__decorate([
-    property()
-], SwitchInput.prototype, "value", void 0);
-__decorate([
-    query("input")
-], SwitchInput.prototype, "_input", void 0);
-SwitchInput = __decorate([
-    godown(protoName),
-    styles([
-        inputStyle,
-        css `
-    :host {
-      --${cssGlobalVars.input}--width: 3em;
-      --${cssGlobalVars.input}--height: calc(var(--${cssGlobalVars.input}--width) / 2);
-      --${cssGlobalVars.input}--gap: calc(var(--${cssGlobalVars.input}--width) / 25);
-      --${cssGlobalVars.input}--transition: all .25s ease-in-out;
-      background: var(--${cssGlobalVars.input}--background);
-      width: var(--${cssGlobalVars.input}--width);
-      height: var(--${cssGlobalVars.input}--height);
-      display: inline-block;
-      vertical-align: bottom;
-    }
-
-    [part="root"],
-    span,
-    i {
-      transition: var(--${cssGlobalVars.input}--transition);
-    }
-
-    [part="root"] {
-      border-radius: inherit;
-      position: relative;
-      height: inherit;
-    }
-
-    [part="root"],
-    input,
-    i {
-      width: 100%;
-    }
-
-    input {
-      margin: 0;
-      height: 100%;
-      outline: none;
-      appearance: none;
-      -webkit-appearance: none;
-      -moz-appearance: none;
-    }
-
-    span {
-      height: 100%;
-      display: inline-flex;
-      position: absolute;
-      left: 0;
-      width: 50%;
-      pointer-events: none;
-      border-radius: inherit;
-    }
-
-    :host([round]) {
-      border-radius: calc(var(--${cssGlobalVars.input}--height) / 2);
-    }
-
-    :host([checked]) span {
-      transform: translateX(100%);
-    }
-
-    .rect * {
-      border-radius: inherit;
-    }
-
-    .rect .true {
-      background: var(--${cssGlobalVars.input}--true);
-    }
-
-    .rect .false {
-      background: var(--${cssGlobalVars.input}--false);
-    }
-
-    .round i {
-      border-radius: 100%;
-      margin: var(--${cssGlobalVars.input}--gap);
-      background: var(--${cssGlobalVars.input}--control);
-      width: calc(var(--${cssGlobalVars.input}--height) - var(--${cssGlobalVars.input}--gap) * 2);
-      height: calc(var(--${cssGlobalVars.input}--height) - var(--${cssGlobalVars.input}--gap) * 2);
-    }
-
-    .round {
-      background: var(--${cssGlobalVars.input}--false);
-    }
-
-    :host([checked]) .round {
-      background: var(--${cssGlobalVars.input}--true);
-    }
-  `,
-    ])
-], SwitchInput);
-export { SwitchInput };
-export default SwitchInput;
-//# sourceMappingURL=switch-input.js.map

package/web-components/input/switch-input.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"switch-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/switch-input.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, property, query } from \"../../_deps.js\";\nimport { godown } from \"../../decorators/godown.js\";\nimport { styles } from \"../../decorators/styles.js\";\nimport GodownInput from \"../../proto/super-input.js\";\nimport { cssGlobalVars } from \"../../styles/global.js\";\nimport { inputStyle } from \"../../styles/inputStyle.js\";\n\nconst protoName = \"switch-input\";\n\n/**\n * {@linkcode SwitchInput } renders a switch.\n *\n * Inspired by Steam.\n */\n@godown(protoName)\n@styles([\n  inputStyle,\n  css`\n    :host {\n      --${cssGlobalVars.input}--width: 3em;\n      --${cssGlobalVars.input}--height: calc(var(--${cssGlobalVars.input}--width) / 2);\n      --${cssGlobalVars.input}--gap: calc(var(--${cssGlobalVars.input}--width) / 25);\n      --${cssGlobalVars.input}--transition: all .25s ease-in-out;\n      background: var(--${cssGlobalVars.input}--background);\n      width: var(--${cssGlobalVars.input}--width);\n      height: var(--${cssGlobalVars.input}--height);\n      display: inline-block;\n      vertical-align: bottom;\n    }\n\n    [part=\"root\"],\n    span,\n    i {\n      transition: var(--${cssGlobalVars.input}--transition);\n    }\n\n    [part=\"root\"] {\n      border-radius: inherit;\n      position: relative;\n      height: inherit;\n    }\n\n    [part=\"root\"],\n    input,\n    i {\n      width: 100%;\n    }\n\n    input {\n      margin: 0;\n      height: 100%;\n      outline: none;\n      appearance: none;\n      -webkit-appearance: none;\n      -moz-appearance: none;\n    }\n\n    span {\n      height: 100%;\n      display: inline-flex;\n      position: absolute;\n      left: 0;\n      width: 50%;\n      pointer-events: none;\n      border-radius: inherit;\n    }\n\n    :host([round]) {\n      border-radius: calc(var(--${cssGlobalVars.input}--height) / 2);\n    }\n\n    :host([checked]) span {\n      transform: translateX(100%);\n    }\n\n    .rect * {\n      border-radius: inherit;\n    }\n\n    .rect .true {\n      background: var(--${cssGlobalVars.input}--true);\n    }\n\n    .rect .false {\n      background: var(--${cssGlobalVars.input}--false);\n    }\n\n    .round i {\n      border-radius: 100%;\n      margin: var(--${cssGlobalVars.input}--gap);\n      background: var(--${cssGlobalVars.input}--control);\n      width: calc(var(--${cssGlobalVars.input}--height) - var(--${cssGlobalVars.input}--gap) * 2);\n      height: calc(var(--${cssGlobalVars.input}--height) - var(--${cssGlobalVars.input}--gap) * 2);\n    }\n\n    .round {\n      background: var(--${cssGlobalVars.input}--false);\n    }\n\n    :host([checked]) .round {\n      background: var(--${cssGlobalVars.input}--true);\n    }\n  `,\n])\nexport class SwitchInput extends GodownInput {\n  /**\n   * @deprecated\n   */\n  base: \"fat\" | \"rect\";\n  /**\n   * Border style.\n   */\n  // @property() variant: \"fat\" | \"rect\" = \"rect\";\n  @property({ type: Boolean, reflect: true }) round = false;\n  /**\n   * Whether this element is selected or not.\n   */\n  @property({ type: Boolean, reflect: true }) checked = false;\n  /**\n   * Whether this element is disabled or not.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  /**\n   * Parsed by JSON.parse to checked.\n   */\n  @property() default = \"false\";\n  /**\n   * Input value.\n   */\n  @property() value = \"on\";\n\n  @query(\"input\") _input: HTMLInputElement;\n\n  protected render() {\n    return html`<div part=\"root\" class=\"${this.round ? \"round\" : \"rect\"}\">\n      <input\n        part=\"input\"\n        @change=\"${this._handleChange}\"\n        ?disabled=\"${this.disabled}\"\n        ?checked=\"${this.checked}\"\n        name=\"${this.name}\"\n        id=\"${this.makeId}\"\n        type=\"checkbox\"\n      />\n      <span>\n        <i class=\"${this.checked}\"><i></i></i>\n      </span>\n    </div>`;\n  }\n\n  reset() {\n    this.checked = this.default === \"true\";\n    this._input.checked = this.checked;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    if (this.checked) {\n      this.default = \"true\";\n    }\n    if (this.default === \"true\") {\n      this.checked = true;\n    }\n  }\n\n  protected _handleChange() {\n    this.checked = this._input.checked;\n    this.dispatchEvent(new CustomEvent(\"input\", { detail: this.checked, bubbles: true, composed: true }));\n    this.dispatchEvent(new CustomEvent(\"change\", { detail: this.checked, composed: true }));\n  }\n\n  namevalue(): [string, boolean] {\n    return [this.name, this.checked];\n  }\n}\n\nexport default SwitchInput;\n"]}