godown 1.0.42 → 1.0.44

package/out/src/input-form/select-input.js

@@ -6,28 +6,27 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, css, property, query, state, define, conf, cssvar } from '../deps.js';
 import STD from './std.js';
-const selcls = `${conf.tag('select-input')}-selected`;
 let SelectInput = class SelectInput extends STD {
     constructor() {
         super(...arguments);
-        this.selcls = "select-input-selected";
+        this.open = false;
+        this.selcls = `${conf.tag('select-input')}-selected`;
         this.pla = undefined;
-        this.m = false;
+        this.only = false;
         this.def = "";
-        this.autofocus = false;
         this.value = [];
-        this.name = "";
+        this.name = "select";
         this.text = [];
+        this.autofocus = false;
     }
     get assigned() {
         return this.shadowRoot.querySelector('slot').assignedElements();
     }
     render() {
-        return html `<div>
-  <section>${this.lists()}</section>
-  <input id="input" @focus=${this.focus} @input=${this._handleInput} placeholder=${this.pla}/>
+        return html `<div><section>${this.lists()}</section>
+  <input id="input" @focus=${() => { this.open = true; }} @input=${this._handleInput} placeholder=${this.pla}/>
   <label for="input"><svg viewBox="0 0 48 48" fill="none"><path d="M36 19L24 31L12 19H36Z" fill="currentColor" stroke="currentColor" stroke-width="3" stroke-linejoin="round"/></svg></label>
-  <aside><slot></slot></aside>
+  <aside ?open=${this.open}><slot></slot></aside>
 </div>`;
     }
     lists() {
@@ -38,11 +37,22 @@ let SelectInput = class SelectInput extends STD {
         <svg @click=${() => { this.select(this.value[i]); }} t="1678769821062" viewBox="0 0 1024 1024" version="1.1" p-id="2770"><path d="M960 512c0-249.6-198.4-448-448-448S64 262.4 64 512s198.4 448 448 448 448-198.4 448-448zM691.2 736L512 556.8 332.8 736c-12.8 12.8-32 12.8-44.8 0-12.8-12.8-12.8-32 0-44.8L467.2 512 288 332.8c-12.8-12.8-12.8-32 0-44.8 12.8-12.8 32-12.8 44.8 0L512 467.2 691.2 288c12.8-12.8 32-12.8 44.8 0 12.8 12.8 12.8 32 0 44.8L556.8 512 736 691.2c12.8 12.8 12.8 32 0 44.8-12.8 12.8-32 12.8-44.8 0z" fill="currentColor" p-id="2771"></path></svg>
         </i>`);
             }
-        return html `${itemTemplates}`;
+        return itemTemplates;
+    }
+    _focusCheck() {
+        var _a;
+        if (this.autofocus) {
+            (_a = this._input) === null || _a === void 0 ? void 0 : _a.focus();
+            this.open = true;
+        }
+    }
+    focus(options) {
+        var _a;
+        (_a = this._input) === null || _a === void 0 ? void 0 : _a.focus(options);
+        this.open = true;
     }
     firstUpdated() {
-        if (this.autofocus)
-            this.focus();
+        this._focusCheck();
         this.assigned.forEach((option) => {
             if (option.value) {
                 option.addEventListener("click", () => {
@@ -57,14 +67,17 @@ let SelectInput = class SelectInput extends STD {
                 });
             }
         });
+        this.addEventListener("change", (e) => {
+            this.open = !this.only;
+        });
         document.addEventListener("click", (e) => {
-            if (!this.m && e.target != this || this.m && !this.contains(e.target)) {
-                this.close();
+            if (!this.contains(e.target)) {
+                this.open = false;
             }
         });
     }
     select(value, text) {
-        if (text === undefined) {
+        if (text === undefined || text === null) {
             this.assigned.forEach((option) => {
                 if (option.value) {
                     if (option.value == value) {
@@ -81,7 +94,7 @@ let SelectInput = class SelectInput extends STD {
             });
         }
         if (this.value.includes(value)) {
-            if (this.m) {
+            if (!this.only) {
                 this.value = this.value.filter(v => v != value);
                 this.text = this.text.filter(v => v != text);
             }
@@ -91,7 +104,7 @@ let SelectInput = class SelectInput extends STD {
             }
         }
         else {
-            if (this.m) {
+            if (!this.only) {
                 this.value.push(value);
                 this.text.push(text);
             }
@@ -103,40 +116,30 @@ let SelectInput = class SelectInput extends STD {
         this.assigned.forEach((option) => {
             if (option.value) {
                 if (this.value.includes(option.value)) {
-                    option.classList.add(selcls);
+                    option.classList.add(this.selcls);
                 }
                 else {
-                    option.classList.remove(selcls);
+                    option.classList.remove(this.selcls);
                 }
             }
             else if (option.children) {
                 [...option.children].forEach(option => {
                     if (this.value.includes(option.value)) {
-                        option.classList.add(selcls);
+                        option.classList.add(this.selcls);
                     }
                     else {
-                        option.classList.remove(selcls);
+                        option.classList.remove(this.selcls);
                     }
                 });
             }
         });
         this._input.value = "";
-        this.requestUpdate();
         this.dispatchEvent(new CustomEvent("change", { detail: this.namevalue() }));
-    }
-    focus() {
-        this._input.focus();
-        this.open();
-    }
-    close() {
-        this._aside.style.visibility = "hidden";
-    }
-    open() {
-        this._aside.style.visibility = "visible";
+        this.requestUpdate();
     }
     _handleInput() {
         let value = this._input.value.trim();
-        if (this.m && value.includes(";")) {
+        if (!this.only && value.includes(";")) {
             value = value.split(";").pop().trim();
         }
         this.assigned.forEach(option => {
@@ -178,7 +181,7 @@ let SelectInput = class SelectInput extends STD {
         this.dispatchEvent(new CustomEvent("input", { detail: this.namevalue() }));
     }
     namevalue() {
-        if (this.m) {
+        if (!this.only) {
             return [this.name, this.value];
         }
         return [this.name, this.value[0]];
@@ -189,24 +192,24 @@ let SelectInput = class SelectInput extends STD {
         this._input.value = "";
         this.assigned.forEach((option) => {
             if (option.value) {
-                option.classList.remove(selcls);
+                option.classList.remove(this.selcls);
             }
             else if (option.children) {
                 [...option.children].forEach(option => {
-                    option.classList.remove(selcls);
+                    option.classList.remove(this.selcls);
                 });
             }
         });
         if (this.def) {
-            if (this.m) {
+            if (!this.only) {
                 this.def.split(";").forEach(def => {
                     if (def.trim())
-                        this.select(def.trim(), undefined);
+                        this.select(def.trim(), null);
                 });
             }
             else {
                 if (this.def.split(";")[0].trim())
-                    this.select(this.def.split(";")[0].trim(), undefined);
+                    this.select(this.def.split(";")[0].trim(), null);
             }
         }
     }
@@ -221,7 +224,7 @@ SelectInput.styles = [STD.styles, css `
     height: 1.5em;
     width: var(${cssvar}--input-width);
   }
-  :host(:focus){
+  :host([open]){
     outline-color: var(${cssvar}--input-outline);
   }
   input{
@@ -272,7 +275,7 @@ SelectInput.styles = [STD.styles, css `
     font-style: normal;
     align-items: center;
     padding-left: .1em;
-    margin-left: 0.1em;
+    margin-left: 0.065em;
   }
   i:first-child{
     margin-left: 0;
@@ -283,7 +286,13 @@ SelectInput.styles = [STD.styles, css `
     height:.8em;
     pointer-events: all;
   }
+  aside[open]{
+    visibility: visible;
+  }
   `];
+__decorate([
+    property({ type: Boolean, reflect: true })
+], SelectInput.prototype, "open", void 0);
 __decorate([
     property()
 ], SelectInput.prototype, "selcls", void 0);
@@ -292,13 +301,10 @@ __decorate([
 ], SelectInput.prototype, "pla", void 0);
 __decorate([
     property({ type: Boolean })
-], SelectInput.prototype, "m", void 0);
+], SelectInput.prototype, "only", void 0);
 __decorate([
     property()
 ], SelectInput.prototype, "def", void 0);
-__decorate([
-    property()
-], SelectInput.prototype, "autofocus", void 0);
 __decorate([
     property({ type: Array })
 ], SelectInput.prototype, "value", void 0);
@@ -308,6 +314,9 @@ __decorate([
 __decorate([
     state()
 ], SelectInput.prototype, "text", void 0);
+__decorate([
+    property({ type: Boolean })
+], SelectInput.prototype, "autofocus", void 0);
 __decorate([
     query('input')
 ], SelectInput.prototype, "_input", void 0);

package/out/src/input-form/split-input.d.ts

@@ -5,6 +5,7 @@ export declare class SplitInput extends STD {
     value: string;
     max: number;
     index: number;
+    autofocus: boolean;
     _input: HTMLInputElement;
     _spans: NodeListOf<HTMLSpanElement>;
     current: number;
@@ -12,7 +13,8 @@ export declare class SplitInput extends STD {
     render(): import("lit-html").TemplateResult<1>;
     firstUpdated(): void;
     _handleInput(e: InputEvent): void;
-    focu(i?: number): void;
+    focus(): void;
+    focusOne(i?: number): void;
     blur(i?: number): void;
     reset(): void;
 }

package/out/src/input-form/split-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"split-input.d.ts","sourceRoot":"","sources":["../../../src/input-form/split-input.ts"],"names":[],"mappings":"AACA,OAAO,GAAG,MAAM,UAAU,CAAC;AAC3B,qBACa,UAAW,SAAQ,GAAG;IACjC,MAAM,CAAC,MAAM,yFA4CP;IACM,IAAI,SAAM;IACV,KAAK,SAAM;IACK,GAAG,SAAK;IACxB,KAAK,SAAM;IACP,MAAM,EAAE,gBAAgB,CAAC;IACvB,MAAM,EAAE,UAAU,CAAC,eAAe,CAAC,CAAC;IACtD,OAAO,EAAE,MAAM,CAAK;IACpB,YAAY,EAAE,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,CAAM;IACxC,MAAM;IAMN,YAAY;IAgBZ,YAAY,CAAC,CAAC,EAAE,UAAU;IA4B1B,IAAI,CAAC,CAAC,SAAe;IAOrB,IAAI,CAAC,CAAC,SAAe;IAIrB,KAAK;CASN;AACD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
+{"version":3,"file":"split-input.d.ts","sourceRoot":"","sources":["../../../src/input-form/split-input.ts"],"names":[],"mappings":"AACA,OAAO,GAAG,MAAM,UAAU,CAAC;AAC3B,qBACa,UAAW,SAAQ,GAAG;IACjC,MAAM,CAAC,MAAM,yFA4CP;IACM,IAAI,SAAM;IACV,KAAK,SAAM;IACK,GAAG,SAAK;IACxB,KAAK,SAAM;IACM,SAAS,UAAS;IAC/B,MAAM,EAAE,gBAAgB,CAAC;IACvB,MAAM,EAAE,UAAU,CAAC,eAAe,CAAC,CAAC;IACtD,OAAO,EAAE,MAAM,CAAK;IACpB,YAAY,EAAE,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,CAAM;IACxC,MAAM;IAMN,YAAY;IAiBZ,YAAY,CAAC,CAAC,EAAE,UAAU;IA4B1B,KAAK;IAGL,QAAQ,CAAC,CAAC,SAAe;IAOzB,IAAI,CAAC,CAAC,SAAe;IAIrB,KAAK;CASN;AACD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}

package/out/src/input-form/split-input.js

@@ -13,6 +13,7 @@ let SplitInput = class SplitInput extends STD {
         this.value = "";
         this.max = 6;
         this.index = -1;
+        this.autofocus = false;
         this.current = 0;
         this.currentValue = [];
     }
@@ -23,12 +24,13 @@ let SplitInput = class SplitInput extends STD {
 </div></main>`;
     }
     firstUpdated() {
+        this._focusCheck();
         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) => {
             span.addEventListener('click', () => {
                 this.current = index;
-                this.focu();
+                this.focusOne();
                 this._input.focus();
             });
         });
@@ -61,7 +63,7 @@ let SplitInput = class SplitInput extends STD {
                 this.current += 1;
             }
         }
-        this.focu();
+        this.focus();
         this._spans.forEach((span, index) => {
             span.querySelector('i').innerText = this.currentValue[index] || '';
         });
@@ -69,7 +71,10 @@ let SplitInput = class SplitInput extends STD {
         this.dispatchEvent(new CustomEvent('input', { detail: this.value, bubbles: true, composed: true }));
         this.dispatchEvent(new CustomEvent('change', { detail: this.value, composed: true }));
     }
-    focu(i = this.current) {
+    focus() {
+        this.focusOne();
+    }
+    focusOne(i = this.current) {
         var _a;
         this._spans.forEach((span) => {
             span.classList.remove('focus');
@@ -149,6 +154,9 @@ __decorate([
 __decorate([
     property()
 ], SplitInput.prototype, "index", void 0);
+__decorate([
+    property({ type: Boolean })
+], SplitInput.prototype, "autofocus", void 0);
 __decorate([
     query('input')
 ], SplitInput.prototype, "_input", void 0);

package/out/src/input-form/std.d.ts

@@ -1,15 +1,19 @@
-import { CSSResultGroup, STD } from "../deps.js";
-export default class InputFormSTD extends STD {
+import { GLOBSTD } from "../deps.js";
+export default class InputFormSTD extends GLOBSTD {
     name: string;
     value: any;
     def: string;
     _input: HTMLInputElement;
     compositing: boolean;
-    static styles: CSSResultGroup[];
+    autofocus: boolean;
+    static styles: import("@lit/reactive-element/css-tag").CSSResultGroup[];
     namevalue(): any[];
     reset(): void;
     _handleInput(e: any): void;
     connectedCallback(): void;
     _compositionCheck(): void;
+    _focusCheck(): void;
+    focus(options?: FocusOptions): void;
+    firstUpdated(): void;
 }
 //# sourceMappingURL=std.d.ts.map

package/out/src/input-form/std.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"std.d.ts","sourceRoot":"","sources":["../../../src/input-form/std.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,GAAG,EAAe,MAAM,YAAY,CAAC;AAC9D,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,GAAG;IAC3C,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,GAAG,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,gBAAgB,CAAC;IACzB,WAAW,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,MAAM,mBAgBZ;IACD,SAAS;IAGT,KAAK;IAIL,YAAY,CAAC,CAAC,EAAE,GAAG;IAOnB,iBAAiB;IAKjB,iBAAiB;CAUlB"}
+{"version":3,"file":"std.d.ts","sourceRoot":"","sources":["../../../src/input-form/std.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAe,MAAM,YAAY,CAAC;AAClD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,OAAO;IAC/C,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,GAAG,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,gBAAgB,CAAC;IACzB,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,MAAM,2DAgBZ;IACD,SAAS;IAGT,KAAK;IAIL,YAAY,CAAC,CAAC,EAAE,GAAG;IAOnB,iBAAiB;IAKjB,iBAAiB;IAUjB,WAAW;IAKX,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY;IAG5B,YAAY;CAIb"}

package/out/src/input-form/std.js

@@ -1,5 +1,5 @@
-import { STD, css, cssvar } from "../deps.js";
-export default class InputFormSTD extends STD {
+import { GLOBSTD, css, cssvar } from "../deps.js";
+export default class InputFormSTD extends GLOBSTD {
     namevalue() {
         return [this.name, this.value];
     }
@@ -12,8 +12,8 @@ export default class InputFormSTD extends STD {
         this.value = e.target.value;
         if (this.compositing)
             return;
-        this.dispatchEvent(new CustomEvent('input', { detail: this.value, bubbles: true, composed: true }));
-        this.dispatchEvent(new CustomEvent('change', { detail: this.value, composed: true }));
+        this.dispatchEvent(new CustomEvent("input", { detail: this.value, bubbles: true, composed: true }));
+        this.dispatchEvent(new CustomEvent("change", { detail: this.value, composed: true }));
     }
     connectedCallback() {
         super.connectedCallback();
@@ -32,8 +32,21 @@ export default class InputFormSTD extends STD {
             this._handleInput(e);
         });
     }
+    _focusCheck() {
+        if (this.autofocus) {
+            this.focus();
+        }
+    }
+    focus(options) {
+        var _a;
+        (_a = this._input) === null || _a === void 0 ? void 0 : _a.focus(options);
+    }
+    firstUpdated() {
+        this._focusCheck();
+        this._compositionCheck();
+    }
 }
-InputFormSTD.styles = [STD.styles, css `
+InputFormSTD.styles = [GLOBSTD.styles, css `
 :host{
   ${cssvar}--text:rgb(240 240 240);
   ${cssvar}--input-outline: rgb(25 130 180);

package/out/src/items/index.d.ts

@@ -2,6 +2,7 @@ export * from "./alert-item.js";
 export * from "./avatar-anchor.js";
 export * from "./base-button.js";
 export * from "./dialog-item.js";
+export * from "./link-a.js";
 export * from "./load-track.js";
 export * from "./super-a.js";
 //# sourceMappingURL=index.d.ts.map

package/out/src/items/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/items/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/items/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC"}

package/out/src/items/index.js

@@ -2,5 +2,6 @@ export * from "./alert-item.js";
 export * from "./avatar-anchor.js";
 export * from "./base-button.js";
 export * from "./dialog-item.js";
+export * from "./link-a.js";
 export * from "./load-track.js";
 export * from "./super-a.js";

package/out/src/items/link-a.d.ts

@@ -0,0 +1,19 @@
+import { SuperAnchor } from "./super-a.js";
+export declare class LinkAnchor extends SuperAnchor {
+    active: string;
+    replace: boolean;
+    static styles: import("lit").CSSResult;
+    firstUpdated(): void;
+    useActive(): void;
+    _handleClick(e: MouseEvent): void;
+    pushState(url?: string): void;
+    replaceState(url?: string): void;
+    static pushState(data: any, unused: string, url?: string): void;
+    static replaceState(data: any, unused: string, url?: string): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'link-a': LinkAnchor;
+    }
+}
+//# sourceMappingURL=link-a.d.ts.map

package/out/src/items/link-a.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-a.d.ts","sourceRoot":"","sources":["../../../src/items/link-a.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAE3C,qBACa,UAAW,SAAQ,WAAW;IAC7B,MAAM,SAAM;IACK,OAAO,UAAS;IAC7C,MAAM,CAAC,MAAM,0BAqBV;IACH,YAAY;IAMZ,SAAS;IAUT,YAAY,CAAC,CAAC,EAAE,UAAU;IAY1B,SAAS,CAAC,GAAG,SAAY;IAIzB,YAAY,CAAC,GAAG,SAAY;IAI5B,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM;IAIxD,MAAM,CAAC,YAAY,CAAC,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM;CAI5D;AACD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,QAAQ,EAAE,UAAU,CAAC;KACtB;CACF"}

package/out/src/items/link-a.js

@@ -0,0 +1,96 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var LinkAnchor_1;
+import { css, property, define } from "../deps.js";
+import { SuperAnchor } from "./super-a.js";
+import { RouteView } from "../view/route-view.js";
+let LinkAnchor = LinkAnchor_1 = class LinkAnchor extends SuperAnchor {
+    constructor() {
+        super(...arguments);
+        this.active = "";
+        this.replace = false;
+    }
+    firstUpdated() {
+        this.shadowRoot.querySelector("a").addEventListener("click", this._handleClick.bind(this));
+        if (this.active) {
+            window.addEventListener("popstate", this.useActive.bind(this));
+        }
+    }
+    useActive() {
+        const url = new URL(this.href, window.location.href);
+        if (url.origin === window.location.origin) {
+            if (url.pathname === window.location.pathname) {
+                this.classList.add(this.active);
+            }
+            else {
+                this.classList.remove(this.active);
+            }
+        }
+    }
+    _handleClick(e) {
+        if (this.target !== "_self")
+            return;
+        const url = new URL(this.href, window.location.href);
+        if (url.origin === window.location.origin) {
+            e.preventDefault();
+            if (this.replace) {
+                this.replaceState();
+            }
+            else {
+                this.pushState();
+            }
+        }
+    }
+    pushState(url = this.href) {
+        LinkAnchor_1.pushState(null, "", url);
+        this.active && this.useActive();
+    }
+    replaceState(url = this.href) {
+        LinkAnchor_1.replaceState(null, "", url);
+        this.active && this.useActive();
+    }
+    static pushState(data, unused, url) {
+        history.pushState(data, unused, url);
+        RouteView.updateAll();
+    }
+    static replaceState(data, unused, url) {
+        history.replaceState(data, unused, url);
+        RouteView.updateAll();
+    }
+};
+LinkAnchor.styles = css `
+  :host{
+    display: inline-block;
+    color:currentColor;
+    text-decoration: none;
+    cursor: default;
+  }
+  :host([href]){
+    cursor: pointer;
+  }
+  a{
+    width: 100%;
+    display: flex;
+    color: inherit;
+    text-decoration: inherit;
+    justify-content: space-between;
+    align-items: center;
+  }
+  i{
+    display: inline-flex;
+    border-radius: 20%;
+  }`;
+__decorate([
+    property()
+], LinkAnchor.prototype, "active", void 0);
+__decorate([
+    property({ type: Boolean })
+], LinkAnchor.prototype, "replace", void 0);
+LinkAnchor = LinkAnchor_1 = __decorate([
+    define('link-a')
+], LinkAnchor);
+export { LinkAnchor };

package/out/src/items/std.d.ts

@@ -1,4 +1,4 @@
-import { STD } from "../deps.js";
-export default class ItemsSTD extends STD {
+import { GLOBSTD } from "../deps.js";
+export default class ItemsSTD extends GLOBSTD {
 }
 //# sourceMappingURL=std.d.ts.map

package/out/src/items/std.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"std.d.ts","sourceRoot":"","sources":["../../../src/items/std.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AACjC,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,GAAG;CAAI"}
+{"version":3,"file":"std.d.ts","sourceRoot":"","sources":["../../../src/items/std.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,OAAO;CAAI"}

package/out/src/items/std.js

@@ -1,3 +1,3 @@
-import { STD } from "../deps.js";
-export default class ItemsSTD extends STD {
+import { GLOBSTD } from "../deps.js";
+export default class ItemsSTD extends GLOBSTD {
 }

package/out/src/items/super-a.d.ts

@@ -2,11 +2,9 @@ import STD from "./std.js";
 export declare class SuperAnchor extends STD {
     href: string;
     target: string;
-    active: string;
     arrow: string;
     static styles: import("lit").CSSResult;
     render(): import("lit-html").TemplateResult<1>;
-    firstUpdated(): void;
     _arrowSwitcher(): import("lit-html").TemplateResult<1>;
 }
 declare global {

package/out/src/items/super-a.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"super-a.d.ts","sourceRoot":"","sources":["../../../src/items/super-a.ts"],"names":[],"mappings":"AACA,OAAO,GAAG,MAAM,UAAU,CAAC;AAC3B,qBACa,WAAY,SAAQ,GAAG;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IAC1B,MAAM,CAAC,MAAM,0BAuCV;IACH,MAAM;IAMN,YAAY;IAUZ,cAAc;CAYf;AACD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,WAAW,CAAC;KACxB;CACF"}
+{"version":3,"file":"super-a.d.ts","sourceRoot":"","sources":["../../../src/items/super-a.ts"],"names":[],"mappings":"AACA,OAAO,GAAG,MAAM,UAAU,CAAC;AAC3B,qBACa,WAAY,SAAQ,GAAG;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,SAAW;IACjB,KAAK,EAAE,MAAM,CAAC;IAC1B,MAAM,CAAC,MAAM,0BAuCV;IACH,MAAM;IAMN,cAAc;CAYf;AACD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,WAAW,CAAC;KACxB;CACF"}

package/out/src/items/super-a.js

@@ -7,23 +7,16 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { html, css, property, ifDefined, define } from "../deps.js";
 import STD from "./std.js";
 let SuperAnchor = class SuperAnchor extends STD {
+    constructor() {
+        super(...arguments);
+        this.target = "_self";
+    }
     render() {
         return html `<a href=${ifDefined(this.href)} target=${this.target}>
   <slot name="pre"></slot><slot></slot><slot name="suf"></slot>
   <i style="font-style:normal"><slot name="icon"></slot>${this._arrowSwitcher()}</i>
 </a>`;
     }
-    firstUpdated() {
-        if (this.active && this.href) {
-            const x = new URL(this.href, location.href);
-            if (x.hostname === location.hostname && x.pathname === location.pathname) {
-                this.classList.add(this.active);
-            }
-            else {
-                this.classList.remove(this.active);
-            }
-        }
-    }
     _arrowSwitcher() {
         switch (this.arrow) {
             case "delta":
@@ -83,9 +76,6 @@ __decorate([
 __decorate([
     property()
 ], SuperAnchor.prototype, "target", void 0);
-__decorate([
-    property()
-], SuperAnchor.prototype, "active", void 0);
 __decorate([
     property()
 ], SuperAnchor.prototype, "arrow", void 0);

package/out/src/layout/nav-layout.js

@@ -18,7 +18,7 @@ let NavLayout = class NavLayout extends STD {
         return html `<nav>
   <h1>
     <slot name="host"></slot>
-    <a href="/">${this.host}</a>${this.subhead && html `<span class="sub"></span><div>${this.subhead}</div>`}
+    <a href="/">${this.host}</a>${this.subhead && html `<span></span><div>${this.subhead}</div>`}
   </h1>
   <div>
     ${this.opt()}

package/out/src/layout/std.d.ts

@@ -1,5 +1,5 @@
-import { STD } from "../deps.js";
-export default class LayoutSTD extends STD {
+import { GLOBSTD } from "../deps.js";
+export default class LayoutSTD extends GLOBSTD {
 }
 export declare const navstyle: import("lit").CSSResult;
 //# sourceMappingURL=std.d.ts.map

package/out/src/layout/std.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"std.d.ts","sourceRoot":"","sources":["../../../src/layout/std.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAe,MAAM,YAAY,CAAC;AAC9C,MAAM,CAAC,OAAO,OAAO,SAAU,SAAQ,GAAG;CAAI;AAC9C,eAAO,MAAM,QAAQ,yBAIpB,CAAC"}
+{"version":3,"file":"std.d.ts","sourceRoot":"","sources":["../../../src/layout/std.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAe,MAAM,YAAY,CAAC;AAClD,MAAM,CAAC,OAAO,OAAO,SAAU,SAAQ,OAAO;CAAI;AAClD,eAAO,MAAM,QAAQ,yBAIpB,CAAC"}

package/out/src/layout/std.js

@@ -1,5 +1,5 @@
-import { STD, css, cssvar } from "../deps.js";
-export default class LayoutSTD extends STD {
+import { GLOBSTD, css, cssvar } from "../deps.js";
+export default class LayoutSTD extends GLOBSTD {
 }
 export const navstyle = css `
 ${cssvar}--nav-text: rgb(240 240 240);

package/out/src/view/index.d.ts

@@ -1,5 +1,6 @@
 export * from "./details-expand.js";
 export * from "./down-drop.js";
 export * from "./menu-list.js";
+export * from "./route-view.js";
 export * from "./scroll-x.js";
 //# sourceMappingURL=index.d.ts.map

package/out/src/view/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/view/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/view/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC"}