godown 2.7.4 → 2.7.6

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

@@ -1 +1 @@
-{"version":3,"file":"switch-input.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/input/switch-input.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAuB,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACjF,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAqB,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEjE,MAAM,UAAU,GAAG,cAAc,CAAC;AAElC,MAAM,QAAQ,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAEzC;;;;GAIG;AAEI,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,WAAW;IAArC;;QACL;;WAEG;QACS,SAAI,GAAmB,MAAM,CAAC;QAC1C;;WAEG;QAC0B,YAAO,GAAG,KAAK,CAAC;QAC7C;;WAEG;QAC0B,aAAQ,GAAG,KAAK,CAAC;QAC9C;;WAEG;QACS,QAAG,GAAG,OAAO,CAAC;QAC1B;;WAEG;QACS,SAAI,GAAG,UAAU,CAAC;QAC9B;;WAEG;QACS,UAAK,GAAG,IAAI,CAAC;IAoK3B,CAAC;IAlCW,MAAM;QACd,OAAO,IAAI,CAAA,gBAAgB,IAAI,CAAC,IAAI;wBAChB,IAAI,CAAC,aAAa,gBAAgB,IAAI,CAAC,QAAQ,eAAe,IAAI,CAAC,OAAO,WAAW,IAAI,CAAC,IAAI;;;8BAGxF,QAAQ,EAAE;;;YAG5B,CAAC;IACX,CAAC;IAED,KAAK;QACH,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,GAAG,KAAK,MAAM,CAAC;QACnC,IAAI,CAAC,MAAM,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;IACrC,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,IAAI,CAAC,GAAG,GAAG,MAAM,CAAC;QACpB,CAAC;aAAM,IAAI,IAAI,CAAC,GAAG,KAAK,MAAM,EAAE,CAAC;YAC/B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACtB,CAAC;IACH,CAAC;IAES,aAAa;QACrB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;QACnC,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,OAAO,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;QACtG,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IAC1F,CAAC;IAED,SAAS;QACP,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,CAAC;;AA/JM,kBAAM,GAAG;IACd,WAAW,CAAC,MAAM;IAClB,GAAG,CAAA;;UAEG,QAAQ;UACR,QAAQ,sBAAsB,QAAQ;qBAC3B,QAAQ;sBACP,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;0BA2BJ,YAAY,CAAC,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCAgDZ,YAAY,CAAC,KAAK;;;;;0BAKxB,YAAY,CAAC,KAAK;;;;;;;0BAOlB,YAAY,CAAC,KAAK;;;;;;;;;;;;0BAYlB,YAAY,CAAC,KAAK;;;;;;;;;;;;;;;;;KAiBvC;CACgB,AA5HN,CA4HO;AApJR;IAAX,QAAQ,EAAE;yCAA+B;AAIb;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAAiB;AAIhB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAkB;AAIlC;IAAX,QAAQ,EAAE;wCAAe;AAId;IAAX,QAAQ,EAAE;yCAAmB;AAIlB;IAAX,QAAQ,EAAE;0CAAc;AAET;IAAf,KAAK,CAAC,OAAO,CAAC;2CAA0B;AA1B9B,WAAW;IADvB,MAAM,CAAC,UAAU,CAAC;GACN,WAAW,CA4LvB;;AAED,eAAe,WAAW,CAAC","sourcesContent":["import { css, type CSSResultGroup, html, property, query } from \"../../.deps.js\";\nimport { define } from \"../../decorators/define.js\";\nimport { htmlSlot, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { GodownInput } from \"../../supers/input.js\";\nimport { createScope, cssvarValues } from \"../../supers/root.js\";\n\nconst defineName = \"switch-input\";\n\nconst cssScope = createScope(defineName);\n\n/**\n * {@linkcode SwitchInput } renders a switch.\n *\n * Inspired by Steam.\n */\n@define(defineName)\nexport class SwitchInput extends GodownInput {\n  /**\n   * Border style.\n   */\n  @property() base: \"fat\" | \"rect\" = \"rect\";\n  /**\n   * Whether this element is selected or not.\n   */\n  @property({ type: Boolean }) checked = false;\n  /**\n   * Whether this element is disabled or not.\n   */\n  @property({ type: Boolean }) disabled = false;\n  /**\n   * Parsed by JSON.parse to checked.\n   */\n  @property() def = \"false\";\n  /**\n   * Input name.\n   */\n  @property() name = \"checkbox\";\n  /**\n   * Input value.\n   */\n  @property() value = \"on\";\n\n  @query(\"input\") _input: HTMLInputElement;\n\n  static styles = [\n    GodownInput.styles,\n    css`\n      :host {\n        ${cssScope}--width: 3em;\n        ${cssScope}--height: calc(var(${cssScope}--width) / 2);\n        width: var(${cssScope}--width);\n        height: var(${cssScope}--height);\n      }\n\n      :host,\n      span {\n        display: inline-flex;\n        font-size: inherit;\n        position: relative;\n        align-items: center;\n        border-radius: inherit;\n      }\n\n      span {\n        width: inherit;\n        height: inherit;\n      }\n\n      input {\n        width: inherit;\n        height: inherit;\n        margin: 0;\n        outline: none;\n        appearance: none;\n        -webkit-appearance: none;\n        -moz-appearance: none;\n        position: relative;\n        font-size: inherit;\n        background: var(${cssvarValues.input}--false);\n        border-radius: inherit;\n        transition: all 0.3s;\n      }\n\n      aside {\n        pointer-events: none;\n        transition: 0.3s;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        position: absolute;\n        font-size: inherit;\n        overflow: hidden;\n        border-radius: inherit;\n      }\n\n      aside div {\n        height: 100%;\n      }\n\n      input[disabled] ~ aside {\n        filter: brightness(0.87);\n      }\n\n      .rect div.always {\n        display: none;\n      }\n\n      .always {\n        position: absolute;\n      }\n\n      .rect aside {\n        height: 100%;\n        width: 100%;\n        left: 0;\n      }\n\n      .rect .true,\n      .rect .false {\n        width: 50%;\n        text-align: center;\n        transition: all 0.3s;\n      }\n\n      .rect input:checked ~ aside div.true,\n      .rect .false {\n        background-color: var(${cssvarValues.input}--true);\n      }\n\n      .rect input:checked ~ aside div.false,\n      .rect .true {\n        background: var(${cssvarValues.input}--false);\n      }\n\n      .fat aside {\n        width: 1.2em;\n        height: 1.2em;\n        border-radius: 50%;\n        background: var(${cssvarValues.input}--control);\n        transition: 0.3s;\n        left: 0.15em;\n        top: 0.15em;\n        bottom: 0.15em;\n      }\n\n      .fat {\n        border-radius: 0.75em;\n      }\n\n      .fat input:checked {\n        background: var(${cssvarValues.input}--true);\n      }\n\n      .fat input:checked ~ aside {\n        left: calc(100% - 0.15em - 1.2em);\n        right: 0.15em;\n      }\n\n      .fat input:checked ~ aside div.true,\n      .fat div.false {\n        display: block;\n      }\n\n      .fat input:checked ~ aside div.false,\n      .fat div.true {\n        display: none;\n      }\n    `,\n  ] as CSSResultGroup;\n\n  protected render(): HTMLTemplate {\n    return html`<span class=\"${this.base}\">\n      <input @change=\"${this._handleChange}\" ?disabled=\"${this.disabled}\" ?checked=\"${this.checked}\" name=\"${this.name}\" type=\"checkbox\" />\n      <aside>\n        <div class=\"false\"><slot name=\"false\"></slot></div>\n        <div class=\"always\">${htmlSlot()}<slot name=\"always\"></slot></div>\n        <div class=\"true\"><slot name=\"true\"></slot></div>\n      </aside>\n    </span>`;\n  }\n\n  reset() {\n    this.checked = this.def === \"true\";\n    this._input.checked = this.checked;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    if (this.checked) {\n      this.def = \"true\";\n    } else if (this.def === \"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\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"switch-input\": SwitchInput;\n    \"g-switch-input\": SwitchInput;\n  }\n}\n"]}
+{"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"]}

package/web-components/layout/flex-flow.d.ts

@@ -1,25 +1,17 @@
-import { type HTMLTemplate } from "../../lib/templates.js";
-import { GodownElement } from "../../supers/root.js";
+import { GodownElement } from "../../proto/godown-element.js";
 /**
- * {@linkcode FlexFlow} controls the flex layout based on the width of the screen.
+ * {@linkcode FlexFlow} provides flex layout.
  */
 export declare class FlexFlow extends GodownElement {
-    /**
-     * The flex-flow behavior.
-     */
-    flexflow: string;
-    /**
-     * The width of the screen for the position change.
-     */
-    mobile: string;
-    static styles: import("lit").CSSResult[];
-    protected render(): HTMLTemplate;
+    flexFlow: string;
+    direction: string;
+    gap: string;
+    flex: string;
+    justify: string;
+    align: string;
+    wrap: string;
+    vertical: boolean;
+    protected render(): import("lit").TemplateResult<1>[];
 }
 export default FlexFlow;
-declare global {
-    interface HTMLElementTagNameMap {
-        "flex-flow": FlexFlow;
-        "g-flex-flow": FlexFlow;
-    }
-}
 //# sourceMappingURL=flex-flow.d.ts.map

package/web-components/layout/flex-flow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flex-flow.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/flex-flow.ts"],"names":[],"mappings":"AAEA,OAAO,EAAuB,KAAK,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAChF,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAIrD;;GAEG;AACH,qBACa,QAAS,SAAQ,aAAa;IACzC;;OAEG;IACS,QAAQ,SAA8B;IAClD;;OAEG;IACS,MAAM,SAAW;IAE7B,MAAM,CAAC,MAAM,4BAMX;IAEF,SAAS,CAAC,MAAM,IAAI,YAAY;CAUjC;AAED,eAAe,QAAQ,CAAC;AACxB,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;QACtB,aAAa,EAAE,QAAQ,CAAC;KACzB;CACF"}
+{"version":3,"file":"flex-flow.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/flex-flow.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAI9D;;GAEG;AACH,qBAYa,QAAS,SAAQ,aAAa;IAIzC,QAAQ,EAAE,MAAM,CAAC;IAEL,SAAS,EAAE,MAAM,CAAC;IAElB,GAAG,EAAE,MAAM,CAAC;IAEZ,IAAI,EAAE,MAAM,CAAC;IAEb,OAAO,EAAE,MAAM,CAAC;IAEhB,KAAK,EAAE,MAAM,CAAC;IAEd,IAAI,EAAE,MAAM,CAAC;IAEI,QAAQ,EAAE,OAAO,CAAC;IAE/C,SAAS,CAAC,MAAM;CAkBjB;AAED,eAAe,QAAQ,CAAC"}

package/web-components/layout/flex-flow.js

@@ -1,50 +1,72 @@
 import { __decorate } from "tslib";
-import { css, html, property } from "../../.deps.js";
-import { define } from "../../decorators/define.js";
-import { htmlSlot, htmlStyle } from "../../lib/templates.js";
-import { GodownElement } from "../../supers/root.js";
-const defineName = "flex-flow";
+import { css, property } from "../../_deps.js";
+import { godown } from "../../decorators/godown.js";
+import { styles } from "../../decorators/styles.js";
+import { htmlSlot } from "../../lib/directives.js";
+import { htmlStyle } from "../../lib/directives.js";
+import { joinRules } from "../../lib/utils.js";
+import { GodownElement } from "../../proto/godown-element.js";
+const protoName = "flex-flow";
 /**
- * {@linkcode FlexFlow} controls the flex layout based on the width of the screen.
+ * {@linkcode FlexFlow} provides flex layout.
  */
 let FlexFlow = class FlexFlow extends GodownElement {
-    constructor() {
-        super(...arguments);
-        /**
-         * The flex-flow behavior.
-         */
-        this.flexflow = "row nowrap column nowrap";
-        /**
-         * The width of the screen for the position change.
-         */
-        this.mobile = "720px";
-    }
     render() {
-        const flexflow = this.flexflow.split(/\s+/);
-        const flexDirection = flexflow[0] || "row";
-        const flexWrap = flexflow[1] || "nowrap";
-        const flexDirectionM = flexflow[2] || flexDirection || "column";
-        const flexWrapM = flexflow[3] || flexWrap || "nowrap";
-        const m = this.mobile || "720px";
-        const style = `:host{flex-direction:${flexDirection};flex-wrap:${flexWrap};}@media(max-width: ${m}){:host{flex-direction:${flexDirectionM};flex-wrap:${flexWrapM}}`;
-        return html `${htmlSlot()} ${htmlStyle(style)}`;
+        return [
+            htmlSlot(),
+            htmlStyle(joinRules({
+                ":host": {
+                    "flex-direction": this.direction,
+                    "flex-wrap": this.wrap,
+                    gap: this.gap,
+                    "align-items": this.align,
+                    "justify-content": this.justify,
+                    flex: this.flex,
+                    "flex-flow": this.flexFlow,
+                },
+            })),
+        ];
     }
 };
-FlexFlow.styles = [
-    css `
-      :host {
-        display: flex !important;
-      }
-    `,
-];
+__decorate([
+    property({
+        attribute: protoName,
+    })
+], FlexFlow.prototype, "flexFlow", void 0);
+__decorate([
+    property()
+], FlexFlow.prototype, "direction", void 0);
 __decorate([
     property()
-], FlexFlow.prototype, "flexflow", void 0);
+], FlexFlow.prototype, "gap", void 0);
 __decorate([
     property()
-], FlexFlow.prototype, "mobile", void 0);
+], FlexFlow.prototype, "flex", void 0);
+__decorate([
+    property()
+], FlexFlow.prototype, "justify", void 0);
+__decorate([
+    property()
+], FlexFlow.prototype, "align", void 0);
+__decorate([
+    property()
+], FlexFlow.prototype, "wrap", void 0);
+__decorate([
+    property({ type: Boolean })
+], FlexFlow.prototype, "vertical", void 0);
 FlexFlow = __decorate([
-    define(defineName)
+    godown(protoName),
+    styles([
+        css `
+    :host {
+      display: flex;
+    }
+
+    :host([vertical]) {
+      flex-direction: column;
+    }
+  `,
+    ])
 ], FlexFlow);
 export { FlexFlow };
 export default FlexFlow;

package/web-components/layout/flex-flow.js.map

@@ -1 +1 @@
-{"version":3,"file":"flex-flow.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/flex-flow.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAqB,MAAM,wBAAwB,CAAC;AAChF,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAErD,MAAM,UAAU,GAAG,WAAW,CAAC;AAE/B;;GAEG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,aAAa;IAApC;;QACL;;WAEG;QACS,aAAQ,GAAG,0BAA0B,CAAC;QAClD;;WAEG;QACS,WAAM,GAAG,OAAO,CAAC;IAoB/B,CAAC;IAVW,MAAM;QACd,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC5C,MAAM,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC;QAC3C,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,CAAC;QACzC,MAAM,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,aAAa,IAAI,QAAQ,CAAC;QAChE,MAAM,SAAS,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,QAAQ,IAAI,QAAQ,CAAC;QACtD,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,IAAI,OAAO,CAAC;QACjC,MAAM,KAAK,GAAG,wBAAwB,aAAa,cAAc,QAAQ,uBAAuB,CAAC,0BAA0B,cAAc,cAAc,SAAS,GAAG,CAAC;QACpK,OAAO,IAAI,CAAA,GAAG,QAAQ,EAAE,IAAI,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC;IACjD,CAAC;;AAjBM,eAAM,GAAG;IACd,GAAG,CAAA;;;;KAIF;CACF,AANY,CAMX;AAZU;IAAX,QAAQ,EAAE;0CAAuC;AAItC;IAAX,QAAQ,EAAE;wCAAkB;AARlB,QAAQ;IADpB,MAAM,CAAC,UAAU,CAAC;GACN,QAAQ,CA4BpB;;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { css, html, property } from \"../../.deps.js\";\nimport { define } from \"../../decorators/define.js\";\nimport { htmlSlot, htmlStyle, type HTMLTemplate } from \"../../lib/templates.js\";\nimport { GodownElement } from \"../../supers/root.js\";\n\nconst defineName = \"flex-flow\";\n\n/**\n * {@linkcode FlexFlow} controls the flex layout based on the width of the screen.\n */\n@define(defineName)\nexport class FlexFlow extends GodownElement {\n  /**\n   * The flex-flow behavior.\n   */\n  @property() flexflow = \"row nowrap column nowrap\";\n  /**\n   * The width of the screen for the position change.\n   */\n  @property() mobile = \"720px\";\n\n  static styles = [\n    css`\n      :host {\n        display: flex !important;\n      }\n    `,\n  ];\n\n  protected render(): HTMLTemplate {\n    const flexflow = this.flexflow.split(/\\s+/);\n    const flexDirection = flexflow[0] || \"row\";\n    const flexWrap = flexflow[1] || \"nowrap\";\n    const flexDirectionM = flexflow[2] || flexDirection || \"column\";\n    const flexWrapM = flexflow[3] || flexWrap || \"nowrap\";\n    const m = this.mobile || \"720px\";\n    const style = `:host{flex-direction:${flexDirection};flex-wrap:${flexWrap};}@media(max-width: ${m}){:host{flex-direction:${flexDirectionM};flex-wrap:${flexWrapM}}`;\n    return html`${htmlSlot()} ${htmlStyle(style)}`;\n  }\n}\n\nexport default FlexFlow;\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"flex-flow\": FlexFlow;\n    \"g-flex-flow\": FlexFlow;\n  }\n}\n"]}
+{"version":3,"file":"flex-flow.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/flex-flow.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,MAAM,SAAS,GAAG,WAAW,CAAC;AAE9B;;GAEG;AAaI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,aAAa;IAoB/B,MAAM;QACd,OAAO;YACL,QAAQ,EAAE;YACV,SAAS,CACP,SAAS,CAAC;gBACR,OAAO,EAAE;oBACP,gBAAgB,EAAE,IAAI,CAAC,SAAS;oBAChC,WAAW,EAAE,IAAI,CAAC,IAAI;oBACtB,GAAG,EAAE,IAAI,CAAC,GAAG;oBACb,aAAa,EAAE,IAAI,CAAC,KAAK;oBACzB,iBAAiB,EAAE,IAAI,CAAC,OAAO;oBAC/B,IAAI,EAAE,IAAI,CAAC,IAAI;oBACf,WAAW,EAAE,IAAI,CAAC,QAAQ;iBAC3B;aACF,CAAC,CACH;SACF,CAAC;IACJ,CAAC;CACF,CAAA;AAlCC;IAHC,QAAQ,CAAC;QACR,SAAS,EAAE,SAAS;KACrB,CAAC;0CACe;AAEL;IAAX,QAAQ,EAAE;2CAAmB;AAElB;IAAX,QAAQ,EAAE;qCAAa;AAEZ;IAAX,QAAQ,EAAE;sCAAc;AAEb;IAAX,QAAQ,EAAE;yCAAiB;AAEhB;IAAX,QAAQ,EAAE;uCAAe;AAEd;IAAX,QAAQ,EAAE;sCAAc;AAEI;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CAAmB;AAlBpC,QAAQ;IAZpB,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CAAC;QACN,GAAG,CAAA;;;;;;;;GAQF;KACF,CAAC;GACW,QAAQ,CAsCpB;;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { css, property } from \"../../_deps.js\";\nimport { godown } from \"../../decorators/godown.js\";\nimport { styles } from \"../../decorators/styles.js\";\nimport { htmlSlot } from \"../../lib/directives.js\";\nimport { htmlStyle } from \"../../lib/directives.js\";\nimport { joinRules } from \"../../lib/utils.js\";\nimport { GodownElement } from \"../../proto/godown-element.js\";\n\nconst protoName = \"flex-flow\";\n\n/**\n * {@linkcode FlexFlow} provides flex layout.\n */\n@godown(protoName)\n@styles([\n  css`\n    :host {\n      display: flex;\n    }\n\n    :host([vertical]) {\n      flex-direction: column;\n    }\n  `,\n])\nexport class FlexFlow extends GodownElement {\n  @property({\n    attribute: protoName,\n  })\n  flexFlow: string;\n\n  @property() direction: string;\n\n  @property() gap: string;\n\n  @property() flex: string;\n\n  @property() justify: string;\n\n  @property() align: string;\n\n  @property() wrap: string;\n\n  @property({ type: Boolean }) vertical: boolean;\n\n  protected render() {\n    return [\n      htmlSlot(),\n      htmlStyle(\n        joinRules({\n          \":host\": {\n            \"flex-direction\": this.direction,\n            \"flex-wrap\": this.wrap,\n            gap: this.gap,\n            \"align-items\": this.align,\n            \"justify-content\": this.justify,\n            flex: this.flex,\n            \"flex-flow\": this.flexFlow,\n          },\n        }),\n      ),\n    ];\n  }\n}\n\nexport default FlexFlow;\n"]}

package/web-components/layout/grid-flow.d.ts

@@ -0,0 +1,14 @@
+import { GodownElement } from "../../proto/godown-element.js";
+/**
+ * {@linkcode GridFlow} provides gird layout.
+ */
+export declare class GridFlow extends GodownElement {
+    gap: string;
+    columns: string | number;
+    rows: string | number;
+    content: string;
+    items: string;
+    protected render(): import("lit").TemplateResult<1>[];
+}
+export default GridFlow;
+//# sourceMappingURL=grid-flow.d.ts.map

package/web-components/layout/grid-flow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-flow.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/grid-flow.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAI9D;;GAEG;AACH,qBAQa,QAAS,SAAQ,aAAa;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IAE1B,SAAS,CAAC,MAAM;CAgBjB;AAED,eAAe,QAAQ,CAAC"}

package/web-components/layout/grid-flow.js

@@ -0,0 +1,56 @@
+import { __decorate } from "tslib";
+import { css, property } from "../../_deps.js";
+import { godown } from "../../decorators/godown.js";
+import { styles } from "../../decorators/styles.js";
+import { htmlSlot } from "../../lib/directives.js";
+import { htmlStyle } from "../../lib/directives.js";
+import { joinRules, numerical } from "../../lib/utils.js";
+import { GodownElement } from "../../proto/godown-element.js";
+const protoName = "grid-flow";
+/**
+ * {@linkcode GridFlow} provides gird layout.
+ */
+let GridFlow = class GridFlow extends GodownElement {
+    render() {
+        return [
+            htmlSlot(),
+            htmlStyle(joinRules({
+                ":host": {
+                    gap: this.gap,
+                    "grid-template-columns": numerical(this.columns) ? `repeat(${this.columns},1fr)` : this.columns,
+                    "grid-template-rows": numerical(this.rows) ? `repeat(${this.rows},1fr)` : this.rows,
+                    "place-content": this.content,
+                    "place-items": this.items,
+                },
+            })),
+        ];
+    }
+};
+__decorate([
+    property()
+], GridFlow.prototype, "gap", void 0);
+__decorate([
+    property()
+], GridFlow.prototype, "columns", void 0);
+__decorate([
+    property()
+], GridFlow.prototype, "rows", void 0);
+__decorate([
+    property()
+], GridFlow.prototype, "content", void 0);
+__decorate([
+    property()
+], GridFlow.prototype, "items", void 0);
+GridFlow = __decorate([
+    godown(protoName),
+    styles([
+        css `
+    :host {
+      display: grid;
+    }
+  `,
+    ])
+], GridFlow);
+export { GridFlow };
+export default GridFlow;
+//# sourceMappingURL=grid-flow.js.map

package/web-components/layout/grid-flow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-flow.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/grid-flow.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,MAAM,SAAS,GAAG,WAAW,CAAC;AAE9B;;GAEG;AASI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,aAAa;IAO/B,MAAM;QACd,OAAO;YACL,QAAQ,EAAE;YACV,SAAS,CACP,SAAS,CAAC;gBACR,OAAO,EAAE;oBACP,GAAG,EAAE,IAAI,CAAC,GAAG;oBACb,uBAAuB,EAAE,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,OAAO,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO;oBAC/F,oBAAoB,EAAE,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI;oBACnF,eAAe,EAAE,IAAI,CAAC,OAAO;oBAC7B,aAAa,EAAE,IAAI,CAAC,KAAK;iBAC1B;aACF,CAAC,CACH;SACF,CAAC;IACJ,CAAC;CACF,CAAA;AAtBa;IAAX,QAAQ,EAAE;qCAAa;AACZ;IAAX,QAAQ,EAAE;yCAA0B;AACzB;IAAX,QAAQ,EAAE;sCAAuB;AACtB;IAAX,QAAQ,EAAE;yCAAiB;AAChB;IAAX,QAAQ,EAAE;uCAAe;AALf,QAAQ;IARpB,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CAAC;QACN,GAAG,CAAA;;;;GAIF;KACF,CAAC;GACW,QAAQ,CAuBpB;;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { css, property } from \"../../_deps.js\";\nimport { godown } from \"../../decorators/godown.js\";\nimport { styles } from \"../../decorators/styles.js\";\nimport { htmlSlot } from \"../../lib/directives.js\";\nimport { htmlStyle } from \"../../lib/directives.js\";\nimport { joinRules, numerical } from \"../../lib/utils.js\";\nimport { GodownElement } from \"../../proto/godown-element.js\";\n\nconst protoName = \"grid-flow\";\n\n/**\n * {@linkcode GridFlow} provides gird layout.\n */\n@godown(protoName)\n@styles([\n  css`\n    :host {\n      display: grid;\n    }\n  `,\n])\nexport class GridFlow extends GodownElement {\n  @property() gap: string;\n  @property() columns: string | number;\n  @property() rows: string | number;\n  @property() content: string;\n  @property() items: string;\n\n  protected render() {\n    return [\n      htmlSlot(),\n      htmlStyle(\n        joinRules({\n          \":host\": {\n            gap: this.gap,\n            \"grid-template-columns\": numerical(this.columns) ? `repeat(${this.columns},1fr)` : this.columns,\n            \"grid-template-rows\": numerical(this.rows) ? `repeat(${this.rows},1fr)` : this.rows,\n            \"place-content\": this.content,\n            \"place-items\": this.items,\n          },\n        }),\n      ),\n    ];\n  }\n}\n\nexport default GridFlow;\n"]}

package/web-components/layout/layout.d.ts

@@ -0,0 +1,18 @@
+import { GodownElement } from "../../proto/godown-element.js";
+/**
+ * {@linkcode NavLayout} renders a navigation, an optional top header, an optional bottom footer.
+ *
+ * @slot - The main content of the layout.
+ *
+ * @slot header - The header of the layout.
+ *
+ * @slot footer - The footer of the layout.
+ */
+export declare class NavLayout extends GodownElement {
+    noHeader: boolean;
+    noFooter: boolean;
+    sticky: boolean;
+    protected render(): import("lit").TemplateResult<1>;
+}
+export default NavLayout;
+//# sourceMappingURL=layout.d.ts.map

package/web-components/layout/layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/layout.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAG9D;;;;;;;;GAQG;AACH,qBA0Ba,SAAU,SAAQ,aAAa;IAI1C,QAAQ,EAAE,OAAO,CAAC;IAIlB,QAAQ,EAAE,OAAO,CAAC;IAKlB,MAAM,EAAE,OAAO,CAAC;IAEhB,SAAS,CAAC,MAAM;CAejB;AAED,eAAe,SAAS,CAAC"}

package/web-components/layout/layout.js

@@ -0,0 +1,76 @@
+import { __decorate } from "tslib";
+import { css, html, property } from "../../_deps.js";
+import { godown } from "../../decorators/godown.js";
+import { styles } from "../../decorators/styles.js";
+import { combine, htmlSlot, ifValue } from "../../lib/directives.js";
+import { GodownElement } from "../../proto/godown-element.js";
+const protoName = "layout";
+/**
+ * {@linkcode NavLayout} renders a navigation, an optional top header, an optional bottom footer.
+ *
+ * @slot - The main content of the layout.
+ *
+ * @slot header - The header of the layout.
+ *
+ * @slot footer - The footer of the layout.
+ */
+let NavLayout = class NavLayout extends GodownElement {
+    render() {
+        return html `${ifValue(!this.noHeader, html `<header
+          part="header"
+          class="${combine({
+            sticky: this.sticky,
+        })}"
+        >
+          ${htmlSlot("header")}
+        </header>`)}
+      <main part="main">${htmlSlot()}</main>
+      ${ifValue(!this.noFooter, html `<footer part="footer">${htmlSlot("footer")}</footer> `)}`;
+    }
+};
+__decorate([
+    property({
+        type: Boolean,
+    })
+], NavLayout.prototype, "noHeader", void 0);
+__decorate([
+    property({
+        type: Boolean,
+    })
+], NavLayout.prototype, "noFooter", void 0);
+__decorate([
+    property({
+        type: Boolean,
+    })
+], NavLayout.prototype, "sticky", void 0);
+NavLayout = __decorate([
+    godown(protoName),
+    styles([
+        css `
+    :host {
+      min-height: 100%;
+      display: flex;
+      flex-direction: column;
+    }
+
+    .sticky {
+      position: sticky;
+      top: 0;
+      z-index: 1;
+    }
+
+    [part="main"] {
+      position: relative;
+      flex: 1;
+      width: 100%;
+    }
+
+    [part] {
+      width: 100%;
+    }
+  `,
+    ])
+], NavLayout);
+export { NavLayout };
+export default NavLayout;
+//# sourceMappingURL=layout.js.map

package/web-components/layout/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/layout/layout.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,MAAM,SAAS,GAAG,QAAQ,CAAC;AAC3B;;;;;;;;GAQG;AA2BI,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,aAAa;IAehC,MAAM;QACd,OAAO,IAAI,CAAA,GAAG,OAAO,CACjB,CAAC,IAAI,CAAC,QAAQ,EACd,IAAI,CAAA;;mBAEO,OAAO,CAAC;YACf,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC;;YAEA,QAAQ,CAAC,QAAQ,CAAC;kBACZ,CACX;0BACmB,QAAQ,EAAE;QAC5B,OAAO,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAA,yBAAyB,QAAQ,CAAC,QAAQ,CAAC,YAAY,CAAC,EAAE,CAAC;IAC7F,CAAC;CACF,CAAA;AA1BC;IAHC,QAAQ,CAAC;QACR,IAAI,EAAE,OAAO;KACd,CAAC;2CACgB;AAIlB;IAHC,QAAQ,CAAC;QACR,IAAI,EAAE,OAAO;KACd,CAAC;2CACgB;AAKlB;IAHC,QAAQ,CAAC;QACR,IAAI,EAAE,OAAO;KACd,CAAC;yCACc;AAbL,SAAS;IA1BrB,MAAM,CAAC,SAAS,CAAC;IACjB,MAAM,CAAC;QACN,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;GAsBF;KACF,CAAC;GACW,SAAS,CA8BrB;;AAED,eAAe,SAAS,CAAC","sourcesContent":["import { css, html, property } from \"../../_deps.js\";\nimport { godown } from \"../../decorators/godown.js\";\nimport { styles } from \"../../decorators/styles.js\";\nimport { combine, htmlSlot, ifValue } from \"../../lib/directives.js\";\nimport { GodownElement } from \"../../proto/godown-element.js\";\n\nconst protoName = \"layout\";\n/**\n * {@linkcode NavLayout} renders a navigation, an optional top header, an optional bottom footer.\n *\n * @slot - The main content of the layout.\n *\n * @slot header - The header of the layout.\n *\n * @slot footer - The footer of the layout.\n */\n@godown(protoName)\n@styles([\n  css`\n    :host {\n      min-height: 100%;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .sticky {\n      position: sticky;\n      top: 0;\n      z-index: 1;\n    }\n\n    [part=\"main\"] {\n      position: relative;\n      flex: 1;\n      width: 100%;\n    }\n\n    [part] {\n      width: 100%;\n    }\n  `,\n])\nexport class NavLayout extends GodownElement {\n  @property({\n    type: Boolean,\n  })\n  noHeader: boolean;\n  @property({\n    type: Boolean,\n  })\n  noFooter: boolean;\n\n  @property({\n    type: Boolean,\n  })\n  sticky: boolean;\n\n  protected render() {\n    return html`${ifValue(\n        !this.noHeader,\n        html`<header\n          part=\"header\"\n          class=\"${combine({\n            sticky: this.sticky,\n          })}\"\n        >\n          ${htmlSlot(\"header\")}\n        </header>`,\n      )}\n      <main part=\"main\">${htmlSlot()}</main>\n      ${ifValue(!this.noFooter, html`<footer part=\"footer\">${htmlSlot(\"footer\")}</footer> `)}`;\n  }\n}\n\nexport default NavLayout;\n"]}

package/web-components/link/link.d.ts

@@ -0,0 +1,10 @@
+import GodownSuperA from "../../proto/super-a.js";
+/**
+ * {@linkcode A} similar to a.
+ *
+ * Has an optional arrow.
+ */
+export declare class A extends GodownSuperA {
+}
+export default A;
+//# sourceMappingURL=link.d.ts.map

package/web-components/link/link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/link/link.ts"],"names":[],"mappings":"AACA,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAIlD;;;;GAIG;AACH,qBACa,CAAE,SAAQ,YAAY;CAAG;AAEtC,eAAe,CAAC,CAAC"}

package/web-components/link/link.js

@@ -0,0 +1,17 @@
+import { __decorate } from "tslib";
+import { godown } from "../../decorators/godown.js";
+import GodownSuperA from "../../proto/super-a.js";
+const protoName = "link";
+/**
+ * {@linkcode A} similar to a.
+ *
+ * Has an optional arrow.
+ */
+let A = class A extends GodownSuperA {
+};
+A = __decorate([
+    godown(protoName)
+], A);
+export { A };
+export default A;
+//# sourceMappingURL=link.js.map

package/web-components/link/link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/link/link.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAElD,MAAM,SAAS,GAAG,MAAM,CAAC;AAEzB;;;;GAIG;AAEI,IAAM,CAAC,GAAP,MAAM,CAAE,SAAQ,YAAY;CAAG,CAAA;AAAzB,CAAC;IADb,MAAM,CAAC,SAAS,CAAC;GACL,CAAC,CAAwB;;AAEtC,eAAe,CAAC,CAAC","sourcesContent":["import { godown } from \"../../decorators/godown.js\";\nimport GodownSuperA from \"../../proto/super-a.js\";\n\nconst protoName = \"link\";\n\n/**\n * {@linkcode A} similar to a.\n *\n * Has an optional arrow.\n */\n@godown(protoName)\nexport class A extends GodownSuperA {}\n\nexport default A;\n"]}

package/web-components/link/router-link.d.ts

@@ -0,0 +1,19 @@
+import GodownSuperA from "../../proto/super-a.js";
+/**
+ * {@linkcode RouterLink} works with {@linkcode Router}.
+ *
+ * @extends A
+ */
+export declare class RouterLink extends GodownSuperA {
+    /**
+     * If true, replaceState, or pushState.
+     */
+    replace: boolean;
+    connectedCallback(): void;
+    protected _handleClick(e: MouseEvent): void;
+    pushState(url?: string, data?: any): void;
+    replaceState(url?: string, data?: any): void;
+    updateRouter(): void;
+}
+export default RouterLink;
+//# sourceMappingURL=router-link.d.ts.map

package/web-components/link/router-link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"router-link.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/link/router-link.ts"],"names":[],"mappings":"AAEA,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAKlD;;;;GAIG;AACH,qBACa,UAAW,SAAQ,YAAY;IAC1C;;OAEG;IAC0B,OAAO,UAAS;IAE7C,iBAAiB;IAMjB,SAAS,CAAC,YAAY,CAAC,CAAC,EAAE,UAAU;IAYpC,SAAS,CAAC,GAAG,SAAY,EAAE,IAAI,MAAO;IAItC,YAAY,CAAC,GAAG,SAAY,EAAE,IAAI,MAAO;IAIzC,YAAY;CAQb;AAED,eAAe,UAAU,CAAC"}

package/web-components/link/router-link.js

@@ -0,0 +1,60 @@
+import { __decorate } from "tslib";
+import { property } from "../../_deps.js";
+import { godown } from "../../decorators/godown.js";
+import GodownSuperA from "../../proto/super-a.js";
+import { Router } from "../router/router.js";
+const protoName = "router-link";
+/**
+ * {@linkcode RouterLink} works with {@linkcode Router}.
+ *
+ * @extends A
+ */
+let RouterLink = class RouterLink extends GodownSuperA {
+    constructor() {
+        super(...arguments);
+        /**
+         * If true, replaceState, or pushState.
+         */
+        this.replace = false;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.addEvent(window, "popstate", this.useActive.bind(this));
+        this.useActive();
+    }
+    _handleClick(e) {
+        const { sameOrigin } = this.useActive();
+        if (sameOrigin) {
+            e.preventDefault();
+            if (this.replace) {
+                this.replaceState(this.href);
+            }
+            else {
+                this.pushState(this.href);
+            }
+        }
+    }
+    pushState(url = this.href, data = null) {
+        history.pushState(data, "", url);
+    }
+    replaceState(url = this.href, data = null) {
+        history.replaceState(data, "", url);
+    }
+    updateRouter() {
+        const routers = this.deepQuerySelectorAll(Router.elementTagName, document.body);
+        routers.forEach((router) => {
+            if (!router.override) {
+                router.pathname = window.location.pathname;
+            }
+        });
+    }
+};
+__decorate([
+    property({ type: Boolean })
+], RouterLink.prototype, "replace", void 0);
+RouterLink = __decorate([
+    godown(protoName)
+], RouterLink);
+export { RouterLink };
+export default RouterLink;
+//# sourceMappingURL=router-link.js.map

package/web-components/link/router-link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"router-link.js","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/link/router-link.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE7C,MAAM,SAAS,GAAG,aAAa,CAAC;AAEhC;;;;GAIG;AAEI,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,YAAY;IAArC;;QACL;;WAEG;QAC0B,YAAO,GAAG,KAAK,CAAC;IAoC/C,CAAC;IAlCC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,UAAU,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAC7D,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAES,YAAY,CAAC,CAAa;QAClC,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QACxC,IAAI,UAAU,EAAE,CAAC;YACf,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;gBACjB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAC/B,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAC5B,CAAC;QACH,CAAC;IACH,CAAC;IAED,SAAS,CAAC,GAAG,GAAG,IAAI,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;QACpC,OAAO,CAAC,SAAS,CAAC,IAAI,EAAE,EAAE,EAAE,GAAG,CAAC,CAAC;IACnC,CAAC;IAED,YAAY,CAAC,GAAG,GAAG,IAAI,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;QACvC,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,EAAE,EAAE,GAAG,CAAC,CAAC;IACtC,CAAC;IAED,YAAY;QACV,MAAM,OAAO,GAAG,IAAI,CAAC,oBAAoB,CAAS,MAAM,CAAC,cAAc,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;QACxF,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;YACzB,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC;gBACrB,MAAM,CAAC,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC;YAC7C,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;CACF,CAAA;AApC8B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2CAAiB;AAJlC,UAAU;IADtB,MAAM,CAAC,SAAS,CAAC;GACL,UAAU,CAwCtB;;AAED,eAAe,UAAU,CAAC","sourcesContent":["import { property } from \"../../_deps.js\";\nimport { godown } from \"../../decorators/godown.js\";\nimport GodownSuperA from \"../../proto/super-a.js\";\nimport { Router } from \"../router/router.js\";\n\nconst protoName = \"router-link\";\n\n/**\n * {@linkcode RouterLink} works with {@linkcode Router}.\n *\n * @extends A\n */\n@godown(protoName)\nexport class RouterLink extends GodownSuperA {\n  /**\n   * If true, replaceState, or pushState.\n   */\n  @property({ type: Boolean }) replace = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEvent(window, \"popstate\", this.useActive.bind(this));\n    this.useActive();\n  }\n\n  protected _handleClick(e: MouseEvent) {\n    const { sameOrigin } = this.useActive();\n    if (sameOrigin) {\n      e.preventDefault();\n      if (this.replace) {\n        this.replaceState(this.href);\n      } else {\n        this.pushState(this.href);\n      }\n    }\n  }\n\n  pushState(url = this.href, data = null) {\n    history.pushState(data, \"\", url);\n  }\n\n  replaceState(url = this.href, data = null) {\n    history.replaceState(data, \"\", url);\n  }\n\n  updateRouter() {\n    const routers = this.deepQuerySelectorAll<Router>(Router.elementTagName, document.body);\n    routers.forEach((router) => {\n      if (!router.override) {\n        router.pathname = window.location.pathname;\n      }\n    });\n  }\n}\n\nexport default RouterLink;\n"]}

package/web-components/progress/progress.d.ts

@@ -1,6 +1,4 @@
-import { type CSSResultGroup } from "../../.deps.js";
-import { type HTMLTemplate } from "../../lib/templates.js";
-import { GodownElement } from "../../supers/root.js";
+import { GodownElement } from "../../proto/godown-element.js";
 /**
  * {@linkcode Progress} similar to  progress.
  */
@@ -17,8 +15,7 @@ export declare class Progress extends GodownElement {
      * Input value.
      */
     value: any;
-    static styles: CSSResultGroup;
-    protected render(): HTMLTemplate;
+    protected render(): import("lit").TemplateResult<1>;
     /**
      * Convert s to a percentage without a percent sign.
      *
@@ -28,11 +25,4 @@ export declare class Progress extends GodownElement {
     parsePercent(s?: string | number): number;
 }
 export default Progress;
-declare global {
-    interface HTMLElementTagNameMap {
-        "loading-progress": Progress;
-        "load-track": Progress;
-        "g-progress": Progress;
-    }
-}
 //# sourceMappingURL=progress.d.ts.map

package/web-components/progress/progress.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"progress.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/progress/progress.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,cAAc,EAAkB,MAAM,gBAAgB,CAAC;AAE1E,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAgB,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAInE;;GAEG;AACH,qBACa,QAAS,SAAQ,aAAa;IACzC;;OAEG;IACyB,GAAG,SAAK;IACpC;;OAEG;IACyB,GAAG,SAAK;IACpC;;OAEG;IACwC,KAAK,MAAQ;IAExD,MAAM,CAAC,MAAM,iBAuCO;IAEpB,SAAS,CAAC,MAAM,IAAI,YAAY;IAYhC;;;;;OAKG;IACH,YAAY,CAAC,CAAC,GAAE,MAAM,GAAG,MAAY,GAAG,MAAM;CAM/C;AAED,eAAe,QAAQ,CAAC;AAExB,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,QAAQ,CAAC;QAC7B,YAAY,EAAE,QAAQ,CAAC;QACvB,YAAY,EAAE,QAAQ,CAAC;KACxB;CACF"}
+{"version":3,"file":"progress.d.ts","sourceRoot":"https://github.com/startracex/godown/tree/main/src/","sources":["web-components/progress/progress.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAK9D;;GAEG;AACH,qBA2Ca,QAAS,SAAQ,aAAa;IACzC;;OAEG;IACyB,GAAG,SAAK;IACpC;;OAEG;IACyB,GAAG,SAAK;IACpC;;OAEG;IACwC,KAAK,MAAQ;IAExD,SAAS,CAAC,MAAM;IAYhB;;;;;OAKG;IACH,YAAY,CAAC,CAAC,GAAE,MAAM,GAAG,MAAY,GAAG,MAAM;CAM/C;AAED,eAAe,QAAQ,CAAC"}