@tartaguti/ui-components 0.1.0 → 0.3.0

package/dist/tt-key-values.js

@@ -10,6 +10,9 @@ let TTKeyValues = class TTKeyValues extends LitElement {
     constructor() {
         super(...arguments);
         this.items = [];
+        // Reflected, because the split rules are :host([layout="split"])
+        // selectors, and a selector matches an attribute, never a property.
+        this.layout = "columns";
     }
     static { this.styles = css `
     /* The browser's own [hidden] rule loses to any :host display, so a
@@ -71,8 +74,12 @@ let TTKeyValues = class TTKeyValues extends LitElement {
       text-decoration: none;
     }
 
-    dd a:hover {
-      text-decoration: underline;
+    /* Only where the pointer can hover: a tap leaves :hover on until the
+       next tap, so the link stayed underlined on a phone. */
+    @media (hover: hover) {
+      dd a:hover {
+        text-decoration: underline;
+      }
     }
 
     /*
@@ -104,6 +111,39 @@ let TTKeyValues = class TTKeyValues extends LitElement {
         margin-top: 0;
       }
     }
+
+    /*
+      Split: the label takes what is left, the value is pushed to the end.
+
+      The value column is auto, so it is as wide as its longest value and
+      no wider, and the label column (1fr) gets the rest. On a phone the
+      pair stays on one row, which is the point of this layout: the
+      numbers line up down the right edge where the eye reads them.
+
+      The label may wrap here, unlike in columns, where it is nowrap. A
+      long label wraps under itself instead of pushing the value off the
+      row, and a value too long for what remains wraps at its own end.
+
+      Each selector outranks the narrow rule's (the :host([layout])
+      part adds to it), so a split list stays split in a narrow card.
+    */
+    :host([layout="split"]) dl {
+      grid-template-columns: 1fr auto;
+      gap: var(--tt-space-2) var(--tt-space-4);
+      align-items: baseline;
+    }
+
+    :host([layout="split"]) dt {
+      margin-top: 0;
+      font-size: inherit;
+      white-space: normal;
+      overflow-wrap: break-word;
+    }
+
+    :host([layout="split"]) dd {
+      text-align: end;
+      font-variant-numeric: tabular-nums;
+    }
   `; }
     render() {
         return html `
@@ -119,6 +159,9 @@ let TTKeyValues = class TTKeyValues extends LitElement {
 __decorate([
     property({ type: Array })
 ], TTKeyValues.prototype, "items", void 0);
+__decorate([
+    property({ type: String, reflect: true })
+], TTKeyValues.prototype, "layout", void 0);
 TTKeyValues = __decorate([
     customElement("tt-key-values")
 ], TTKeyValues);

package/dist/tt-key-values.js.map

@@ -1 +1 @@
-{"version":3,"file":"tt-key-values.js","sourceRoot":"","sources":["../src/tt-key-values.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAUrD,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAEL,UAAK,GAAe,EAAE,CAAC;IA6GzB,CAAC;aA3GQ,WAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6FlB,AA7FY,CA6FX;IAEF,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,KAAK,CAAC,GAAG,CACd,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;+BACO,IAAI,CAAC,KAAK;+BACV,IAAI,CAAC,KAAK;WAC9B,CACF;;KAEJ,CAAC;IACJ,CAAC;;AA5GD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;0CACH;AAFZ,WAAW;IADvB,aAAa,CAAC,eAAe,CAAC;GAClB,WAAW,CA+GvB"}
+{"version":3,"file":"tt-key-values.js","sourceRoot":"","sources":["../src/tt-key-values.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAoBrD,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAEL,UAAK,GAAe,EAAE,CAAC;QAEvB,iEAAiE;QACjE,oEAAoE;QAEpE,WAAM,GAAoB,SAAS,CAAC;IAkJtC,CAAC;aAhJQ,WAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkIlB,AAlIY,CAkIX;IAEF,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,KAAK,CAAC,GAAG,CACd,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;+BACO,IAAI,CAAC,KAAK;+BACV,IAAI,CAAC,KAAK;WAC9B,CACF;;KAEJ,CAAC;IACJ,CAAC;;AAtJD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;0CACH;AAKvB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2CACN;AAPzB,WAAW;IADvB,aAAa,CAAC,eAAe,CAAC;GAClB,WAAW,CAyJvB"}

package/dist/tt-layout.d.ts

@@ -14,13 +14,64 @@ import { LitElement } from "lit";
 export interface MenuToggleHost extends HTMLElement {
     mobileMenuOpen?: boolean;
 }
+/**
+ * The app shell: a navbar across the top, a sidebar down the side and the
+ * page beside it, with the sidebar turning into a drawer on a phone.
+ *
+ * ---------------------------------------------------------------------
+ * TWO WAYS TO SCROLL.
+ *
+ * By default the layout is exactly one screen tall and only the content
+ * area scrolls, under a fixed bar and beside a fixed sidebar. That is
+ * the whole window, and it is what this app's own shell uses.
+ *
+ * `contained` keeps the same picture and changes who scrolls: the layout
+ * grows with its content and the PAGE scrolls, while the navbar and the
+ * sidebar stay pinned with position: sticky. Nothing is placed against
+ * the window, the phone drawer included, so a contained layout also
+ * works inside something smaller than the window: a preview, a design
+ * in the component builder, a page of documentation.
+ *
+ * ---------------------------------------------------------------------
+ * PHONE OR NOT IS ASKED OF THE LAYOUT, NOT THE WINDOW.
+ *
+ * The host is a size container, and the drawer, the navbar's menu button
+ * and the sidebar's drawer rules all ask the same container query (below
+ * 768px). A media query asks how wide the WINDOW is, which in a builder
+ * canvas drawing a 375px phone on a 1440px screen is the wrong question.
+ * The container is the host rather than an element inside it, because
+ * WebKit finds containers through the DOM tree, and the navbar and the
+ * sidebar are the host's children, not its shadow root's.
+ */
 export declare class TTLayout extends LitElement {
-    private mobileSidebarOpen;
-    private closeSidebar;
+    /**
+     * Grows with its content and lets the page scroll, with the navbar and
+     * the sidebar pinned. Reflected, because the styles match on it.
+     */
+    contained: boolean;
+    /**
+     * Whether the phone menu (the sidebar drawer) is open. The layout opens
+     * and closes it itself: the navbar's menu button, Escape, the backdrop
+     * and a click on a menu item. It announces the ones it decides with
+     * tt-menu-toggle, the same event the navbar sends for its button, so a
+     * listener on the layout hears every change once. Setting it opens or
+     * closes the drawer; on a wider screen it changes nothing.
+     *
+     * Named as on tt-navbar, whose button it keeps in step.
+     */
+    mobileMenuOpen: boolean;
+    private layoutEl?;
+    private navbarEl?;
+    private backdropEl?;
+    private settled;
+    private closeMenu;
     private handleMenuToggle;
     private handleSidebarMenu;
     private handleKeydown;
+    private barObserver?;
+    private observeBar;
     connectedCallback(): void;
+    firstUpdated(): void;
     private locked;
     private setLock;
     disconnectedCallback(): void;

package/dist/tt-layout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tt-layout.d.ts","sourceRoot":"","sources":["../src/tt-layout.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAK5C;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,qBACa,QAAS,SAAQ,UAAU;IAEtC,OAAO,CAAC,iBAAiB,CAAS;IAElC,OAAO,CAAC,YAAY;IAWpB,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,iBAAiB;IAIzB,OAAO,CAAC,aAAa,CAInB;IAEF,iBAAiB;IAQjB,OAAO,CAAC,MAAM,CAAS;IAEvB,OAAO,CAAC,OAAO;IASf,oBAAoB;IAQpB,OAAO;IAaP,MAAM,CAAC,MAAM,0BAiMX;IAEF,MAAM;CA+CP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}
+{"version":3,"file":"tt-layout.d.ts","sourceRoot":"","sources":["../src/tt-layout.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAK5C;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,qBACa,QAAS,SAAQ,UAAU;IACtC;;;OAGG;IAEH,SAAS,UAAS;IAElB;;;;;;;;;OASG;IAEH,cAAc,UAAS;IAGvB,OAAO,CAAC,QAAQ,CAAC,CAAc;IAG/B,OAAO,CAAC,QAAQ,CAAC,CAAc;IAG/B,OAAO,CAAC,UAAU,CAAC,CAAc;IAUjC,OAAO,CAAC,OAAO,CAAS;IAMxB,OAAO,CAAC,SAAS;IAqBjB,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,iBAAiB;IAIzB,OAAO,CAAC,aAAa,CAInB;IAQF,OAAO,CAAC,WAAW,CAAC,CAAiB;IAErC,OAAO,CAAC,UAAU;IAYlB,iBAAiB;IASjB,YAAY;IAYZ,OAAO,CAAC,MAAM,CAAS;IAEvB,OAAO,CAAC,OAAO;IASf,oBAAoB;IAWpB,OAAO;IAgCP,MAAM,CAAC,MAAM,0BA2RX;IAEF,MAAM;CA+CP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}

package/dist/tt-layout.js

@@ -5,23 +5,86 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { LitElement, html, css } from "lit";
-import { customElement, state } from "lit/decorators.js";
+import { customElement, property, query, state } from "lit/decorators.js";
 import { lockScroll, unlockScroll } from "./scroll-lock.js";
+/**
+ * The app shell: a navbar across the top, a sidebar down the side and the
+ * page beside it, with the sidebar turning into a drawer on a phone.
+ *
+ * ---------------------------------------------------------------------
+ * TWO WAYS TO SCROLL.
+ *
+ * By default the layout is exactly one screen tall and only the content
+ * area scrolls, under a fixed bar and beside a fixed sidebar. That is
+ * the whole window, and it is what this app's own shell uses.
+ *
+ * `contained` keeps the same picture and changes who scrolls: the layout
+ * grows with its content and the PAGE scrolls, while the navbar and the
+ * sidebar stay pinned with position: sticky. Nothing is placed against
+ * the window, the phone drawer included, so a contained layout also
+ * works inside something smaller than the window: a preview, a design
+ * in the component builder, a page of documentation.
+ *
+ * ---------------------------------------------------------------------
+ * PHONE OR NOT IS ASKED OF THE LAYOUT, NOT THE WINDOW.
+ *
+ * The host is a size container, and the drawer, the navbar's menu button
+ * and the sidebar's drawer rules all ask the same container query (below
+ * 768px). A media query asks how wide the WINDOW is, which in a builder
+ * canvas drawing a 375px phone on a 1440px screen is the wrong question.
+ * The container is the host rather than an element inside it, because
+ * WebKit finds containers through the DOM tree, and the navbar and the
+ * sidebar are the host's children, not its shadow root's.
+ */
 let TTLayout = class TTLayout extends LitElement {
     constructor() {
         super(...arguments);
-        this.mobileSidebarOpen = false;
+        /**
+         * Grows with its content and lets the page scroll, with the navbar and
+         * the sidebar pinned. Reflected, because the styles match on it.
+         */
+        this.contained = false;
+        /**
+         * Whether the phone menu (the sidebar drawer) is open. The layout opens
+         * and closes it itself: the navbar's menu button, Escape, the backdrop
+         * and a click on a menu item. It announces the ones it decides with
+         * tt-menu-toggle, the same event the navbar sends for its button, so a
+         * listener on the layout hears every change once. Setting it opens or
+         * closes the drawer; on a wider screen it changes nothing.
+         *
+         * Named as on tt-navbar, whose button it keeps in step.
+         */
+        this.mobileMenuOpen = false;
+        /*
+          False until the first two frames have been drawn, and the drawer's
+          slide is switched off until then. Firefox styles a new layout once
+          without its container query and once with it, and starts transitions
+          between the two, so on a phone the closed drawer slid out across the
+          page as it loaded.
+        */
+        this.settled = false;
         this.handleKeydown = (event) => {
-            if (event.key === "Escape" && this.mobileSidebarOpen) {
-                this.closeSidebar();
+            if (event.key === "Escape" && this.mobileMenuOpen) {
+                this.closeMenu();
             }
         };
         // Whether this element currently holds a scroll lock. The lock is
         // reference counted, so it has to release exactly what it took.
         this.locked = false;
     }
-    closeSidebar() {
-        this.mobileSidebarOpen = false;
+    /*
+      Closes the drawer for a reason the navbar did not see, and says so.
+      The navbar's own click is announced by the navbar.
+    */
+    closeMenu() {
+        if (!this.mobileMenuOpen)
+            return;
+        this.mobileMenuOpen = false;
+        this.dispatchEvent(new CustomEvent("tt-menu-toggle", {
+            detail: { open: false },
+            bubbles: true,
+            composed: true,
+        }));
     }
     /*
       Takes the state FROM the event rather than flipping independently.
@@ -31,14 +94,33 @@ let TTLayout = class TTLayout extends LitElement {
       is the single decision and the layout follows it.
     */
     handleMenuToggle(event) {
-        this.mobileSidebarOpen = event.detail.open;
+        this.mobileMenuOpen = event.detail.open;
     }
     handleSidebarMenu() {
-        this.closeSidebar();
+        this.closeMenu();
+    }
+    observeBar() {
+        if (!this.navbarEl || this.barObserver)
+            return;
+        this.barObserver = new ResizeObserver(() => {
+            // offsetHeight, not a bounding box: a scaled canvas would scale it.
+            const height = this.navbarEl?.offsetHeight ?? 0;
+            this.layoutEl?.style.setProperty("--_bar", `${height}px`);
+        });
+        this.barObserver.observe(this.navbarEl);
     }
     connectedCallback() {
         super.connectedCallback();
         window.addEventListener("keydown", this.handleKeydown);
+        // Back in the page after a move: the first render will not run again.
+        if (this.hasUpdated)
+            this.observeBar();
+    }
+    firstUpdated() {
+        this.observeBar();
+        requestAnimationFrame(() => requestAnimationFrame(() => {
+            this.settled = true;
+        }));
     }
     setLock(want) {
         if (want === this.locked)
@@ -51,11 +133,30 @@ let TTLayout = class TTLayout extends LitElement {
     }
     disconnectedCallback() {
         window.removeEventListener("keydown", this.handleKeydown);
+        this.barObserver?.disconnect();
+        this.barObserver = undefined;
         this.setLock(false);
         super.disconnectedCallback();
     }
     updated() {
-        this.setLock(this.mobileSidebarOpen);
+        /*
+          A contained layout's page is the window's scroller, so freezing it
+          while the drawer is not a drawer (a wider screen, where the menu
+          state changes nothing) would freeze the app. The backdrop shows
+          only when the drawer is one. The full-window layout scrolls its own
+          content area, so for it the page lock is harmless at any width, and
+          it keeps the rule it always had.
+        */
+        const drawer = !this.contained ||
+            (this.backdropEl !== undefined &&
+                getComputedStyle(this.backdropEl).display !== "none");
+        /*
+          Only while in the page. An update can still run after the element
+          has left it (the settle timer above, a property set late), and a
+          lock taken then is never given back: disconnectedCallback has
+          already run.
+        */
+        this.setLock(this.isConnected && this.mobileMenuOpen && drawer);
         /*
           Escape and the backdrop can also close the sidebar, and the navbar
           hears neither: its own click handler is the only thing that would
@@ -64,7 +165,7 @@ let TTLayout = class TTLayout extends LitElement {
         */
         const navbar = this.querySelector("tt-navbar");
         if (navbar)
-            navbar.mobileMenuOpen = this.mobileSidebarOpen;
+            navbar.mobileMenuOpen = this.mobileMenuOpen;
     }
     static { this.styles = css `
     /* The browser's own [hidden] rule loses to any :host display, so a
@@ -76,8 +177,12 @@ let TTLayout = class TTLayout extends LitElement {
     :host {
       display: block;
 
+      /* See "phone or not" at the top. Inline size only, so the height
+         is still whatever the content makes it. */
+      container-type: inline-size;
+
       height: 100vh;
-      height: 100dvh;
+      height: var(--tt-viewport-height, 100dvh);
 
       background: var(--tt-background);
       color: var(--tt-foreground);
@@ -156,17 +261,69 @@ let TTLayout = class TTLayout extends LitElement {
       display: none;
     }
 
-    /* Mobile */
+    /* ---- contained: the page scrolls ----
+
+       At least one screen tall and otherwise as tall as its content. The
+       bar is pinned by the sticky wrapper above; the sidebar is pinned
+       just under it and is exactly the rest of the screen, so its footer
+       sits on the bottom edge however long or short the page is, and its
+       own menu scrolls. The body must not clip (overflow: hidden would
+       make it the scroller the sidebar sticks to, and it never scrolls),
+       and must not stretch the sidebar to the page's height. */
+
+    :host([contained]) {
+      height: auto;
+    }
+
+    :host([contained]) .layout {
+      height: auto;
+      min-height: var(--tt-viewport-height, 100dvh);
+    }
+
+    :host([contained]) .body {
+      align-items: flex-start;
+      overflow: visible;
+    }
+
+    :host([contained]) .sidebar {
+      position: sticky;
+      top: var(--_bar, 0px);
+      height: calc(var(--tt-viewport-height, 100dvh) - var(--_bar, 0px));
+    }
+
+    /* What goes in a contained layout is a designed screen (a page
+       header, a grid, a card), not one tt-page that spaces its own
+       children, so the content area spaces them, as a page would. */
+    :host([contained]) .content {
+      display: flex;
+      flex-direction: column;
+      gap: var(--tt-space-6);
+
+      overflow: visible;
+      scrollbar-gutter: auto;
+    }
+
+    :host([contained]) .content ::slotted(*) {
+      min-width: 0;
+    }
+
+    /* ---- phones ----
 
-    @media (max-width: 768px) {
-      :host {
+       The host's own height is the one rule that cannot follow the
+       container query (a container cannot query itself), so it asks the
+       window. For the full-window layout the two are the same width. */
+
+    @media (width < 768px) {
+      :host(:not([contained])) {
         height: auto;
         min-height: 100dvh;
       }
+    }
 
+    @container (width < 768px) {
       .layout {
         height: auto;
-        min-height: 100dvh;
+        min-height: var(--tt-viewport-height, 100dvh);
       }
 
       .body {
@@ -198,12 +355,12 @@ let TTLayout = class TTLayout extends LitElement {
       .sidebar {
         position: fixed;
 
-        top: 60px;
+        top: var(--_bar, 60px);
         left: 0;
         bottom: 0;
 
         width: 220px;
-        max-width: 82vw;
+        max-width: 82cqi;
 
         z-index: var(--tt-z-drawer);
 
@@ -218,18 +375,23 @@ let TTLayout = class TTLayout extends LitElement {
         */
         visibility: hidden;
 
-        transition:
-          transform var(--tt-duration-slow) var(--tt-ease-out),
-          visibility 0s linear var(--tt-duration-slow);
-
         box-shadow: var(--tt-elevation-3);
 
         will-change: transform;
       }
 
+      .settled .sidebar {
+        transition:
+          transform var(--tt-duration-slow) var(--tt-ease-out),
+          visibility 0s linear var(--tt-duration-slow);
+      }
+
       .sidebar.open {
         transform: translateX(0);
         visibility: visible;
+      }
+
+      .settled .sidebar.open {
         transition: transform var(--tt-duration-slow) var(--tt-ease-out);
       }
 
@@ -257,12 +419,41 @@ let TTLayout = class TTLayout extends LitElement {
 
         opacity: 1;
       }
-    }
 
+      /*
+        Contained, nothing may be fixed to the window: in a preview or a
+        builder canvas the window is not the screen being drawn. So the
+        drawer and the backdrop are STICKY instead, pinned under the bar
+        exactly where fixed would put them, and a negative bottom margin
+        as tall as they are takes them out of the flow, so the content
+        starts where they do. They stay in the layout and follow the
+        page as it scrolls.
+
+        A contained layout pads its content on every side: what goes in
+        it is a designed screen, not a tt-page that brings its own
+        gutter. A phone's gap is a step smaller, like its gutter.
+      */
+      :host([contained]) .content {
+        padding: var(--tt-space-4);
+        gap: var(--tt-space-4);
+      }
+
+      :host([contained]) .sidebar,
+      :host([contained]) .backdrop {
+        --_screen: calc(var(--tt-viewport-height, 100dvh) - var(--_bar, 0px));
+
+        position: sticky;
+        top: var(--_bar, 0px);
+        bottom: auto;
+
+        height: var(--_screen);
+        margin-bottom: calc(-1 * var(--_screen));
+      }
+    }
   `; }
     render() {
         return html `
-      <div class="layout" part="layout">
+      <div class="layout ${this.settled ? "settled" : ""}" part="layout">
 
         <!-- Navbar -->
 
@@ -276,8 +467,8 @@ let TTLayout = class TTLayout extends LitElement {
         <!-- Backdrop -->
 
         <div
-          class="backdrop ${this.mobileSidebarOpen ? "show" : ""}"
-          @click=${this.closeSidebar}
+          class="backdrop ${this.mobileMenuOpen ? "show" : ""}"
+          @click=${this.closeMenu}
         ></div>
 
         <!-- Main body -->
@@ -288,7 +479,7 @@ let TTLayout = class TTLayout extends LitElement {
 
           <aside
             part="sidebar"
-            class="sidebar ${this.mobileSidebarOpen ? "open" : ""}"
+            class="sidebar ${this.mobileMenuOpen ? "open" : ""}"
           >
             <slot
               name="sidebar"
@@ -308,9 +499,24 @@ let TTLayout = class TTLayout extends LitElement {
     `;
     }
 };
+__decorate([
+    property({ type: Boolean, reflect: true })
+], TTLayout.prototype, "contained", void 0);
+__decorate([
+    property({ type: Boolean, attribute: "mobile-menu-open" })
+], TTLayout.prototype, "mobileMenuOpen", void 0);
+__decorate([
+    query(".layout")
+], TTLayout.prototype, "layoutEl", void 0);
+__decorate([
+    query(".navbar")
+], TTLayout.prototype, "navbarEl", void 0);
+__decorate([
+    query(".backdrop")
+], TTLayout.prototype, "backdropEl", void 0);
 __decorate([
     state()
-], TTLayout.prototype, "mobileSidebarOpen", void 0);
+], TTLayout.prototype, "settled", void 0);
 TTLayout = __decorate([
     customElement("tt-layout")
 ], TTLayout);

package/dist/tt-layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"tt-layout.js","sourceRoot":"","sources":["../src/tt-layout.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEzD,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAmBrD,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IAAjC;;QAEG,sBAAiB,GAAG,KAAK,CAAC;QAqB1B,kBAAa,GAAG,CAAC,KAAoB,EAAE,EAAE;YAC/C,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,IAAI,CAAC,iBAAiB,EAAE,CAAC;gBACrD,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,CAAC;QACH,CAAC,CAAC;QAQF,kEAAkE;QAClE,gEAAgE;QACxD,WAAM,GAAG,KAAK,CAAC;IAkRzB,CAAC;IAnTS,YAAY;QAClB,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;IACjC,CAAC;IAED;;;;;;MAME;IACM,gBAAgB,CAAC,KAAkB;QACzC,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;IAC7C,CAAC;IAEO,iBAAiB;QACvB,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAQD,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IACzD,CAAC;IAMO,OAAO,CAAC,IAAa;QAC3B,IAAI,IAAI,KAAK,IAAI,CAAC,MAAM;YAAE,OAAO;QAEjC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QAEnB,IAAI,IAAI;YAAE,UAAU,EAAE,CAAC;;YAClB,YAAY,EAAE,CAAC;IACtB,CAAC;IAED,oBAAoB;QAClB,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QAE1D,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QAEpB,KAAK,CAAC,oBAAoB,EAAE,CAAC;IAC/B,CAAC;IAED,OAAO;QACL,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;QAErC;;;;;UAKE;QACF,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,CAAiB,WAAW,CAAC,CAAC;QAC/D,IAAI,MAAM;YAAE,MAAM,CAAC,cAAc,GAAG,IAAI,CAAC,iBAAiB,CAAC;IAC7D,CAAC;aAEM,WAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiMlB,AAjMY,CAiMX;IAEF,MAAM;QACJ,OAAO,IAAI,CAAA;;;;;;;;8BAQe,IAAI,CAAC,gBAAgB;;;;;;;4BAOvB,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE;mBAC7C,IAAI,CAAC,YAAY;;;;;;;;;;;6BAWP,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE;;;;+BAIlC,IAAI,CAAC,iBAAiB;;;;;;;;;;;;;KAahD,CAAC;IACJ,CAAC;;AApTO;IADP,KAAK,EAAE;mDAC0B;AAFvB,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAuTpB"}
+{"version":3,"file":"tt-layout.js","sourceRoot":"","sources":["../src/tt-layout.ts"],"names":[],"mappings":"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"}

package/dist/tt-modal.d.ts

@@ -1,8 +1,12 @@
 import { LitElement } from "lit";
 import type { PropertyValues } from "lit";
 import "./tt-icon.js";
+import type { TTStrings } from "./strings.js";
 export type ModalSize = "small" | "medium" | "large";
 export declare class TTModal extends LitElement {
+    /** This component's own text, over setStrings() (see strings.ts). */
+    strings: Partial<TTStrings>;
+    private text;
     open: boolean;
     heading: string;
     size: ModalSize;

package/dist/tt-modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tt-modal.d.ts","sourceRoot":"","sources":["../src/tt-modal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAC5C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAO1C,OAAO,cAAc,CAAC;AAEtB,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAErD,qBACa,OAAQ,SAAQ,UAAU;IAIrC,IAAI,UAAS;IAKb,OAAO,SAAM;IAGb,IAAI,EAAE,SAAS,CAAY;IAS3B,UAAU,UAAS;IAInB,OAAO,UAAS;IAEhB,OAAO,CAAC,WAAW,CAA4B;IAQtC,OAAO,CAAC,OAAO,CAAS;IACjC,OAAO,CAAC,UAAU,CAAC,CAAa;IAEhC,OAAO,CAAC,UAAU;IAelB,OAAO,CAAC,mBAAmB;IAM3B,OAAO,CAAC,iBAAiB;IAQzB,iBAAiB;IAWjB,OAAO,CAAC,MAAM,CAAS;IAEvB,OAAO,CAAC,OAAO;IASf,oBAAoB;IAapB,UAAU,CAAC,OAAO,EAAE,cAAc;IAYlC,OAAO,CAAC,OAAO,EAAE,cAAc;IA2D/B,OAAO,CAAC,aAAa,CA4BnB;IAEF,MAAM,CAAC,MAAM,0BAwSX;IAEF,MAAM;CAmDP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
+{"version":3,"file":"tt-modal.d.ts","sourceRoot":"","sources":["../src/tt-modal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAC5C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAO1C,OAAO,cAAc,CAAC;AAEtB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAErD,qBACa,OAAQ,SAAQ,UAAU;IACrC,qEAAqE;IACrC,OAAO,EAAE,OAAO,CAAC,SAAS,CAAC,CAAM;IAEjE,OAAO,CAAC,IAAI,CAA+B;IAK3C,IAAI,UAAS;IAKb,OAAO,SAAM;IAGb,IAAI,EAAE,SAAS,CAAY;IAS3B,UAAU,UAAS;IAInB,OAAO,UAAS;IAEhB,OAAO,CAAC,WAAW,CAA4B;IAQtC,OAAO,CAAC,OAAO,CAAS;IACjC,OAAO,CAAC,UAAU,CAAC,CAAa;IAEhC,OAAO,CAAC,UAAU;IAelB,OAAO,CAAC,mBAAmB;IAM3B,OAAO,CAAC,iBAAiB;IAQzB,iBAAiB;IAWjB,OAAO,CAAC,MAAM,CAAS;IAEvB,OAAO,CAAC,OAAO;IASf,oBAAoB;IAapB,UAAU,CAAC,OAAO,EAAE,cAAc;IAYlC,OAAO,CAAC,OAAO,EAAE,cAAc;IA2D/B,OAAO,CAAC,aAAa,CA4BnB;IAEF,MAAM,CAAC,MAAM,0BA2SX;IAEF,MAAM;CAmDP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}

package/dist/tt-modal.js

@@ -10,9 +10,13 @@ import { lockScroll, unlockScroll } from "./scroll-lock.js";
 import { deepActiveElement, pushOverlay, removeOverlay, isTopOverlay, trapTab } from "./overlay.js";
 import { afterTransitions } from "./motion.js";
 import "./tt-icon.js";
+import { StringsController } from "./strings.js";
 let TTModal = class TTModal extends LitElement {
     constructor() {
         super(...arguments);
+        /** This component's own text, over setStrings() (see strings.ts). */
+        this.strings = {};
+        this.text = new StringsController(this);
         // Reflected, like open on tt-drawer and every other disclosure, so
         // tt-modal[open] works as a selector.
         this.open = false;
@@ -400,9 +404,12 @@ let TTModal = class TTModal extends LitElement {
         color var(--tt-duration-normal) var(--tt-ease);
     }
 
-    .close:hover {
-      background: var(--tt-accent);
-      color: var(--_foreground);
+    /* Only where a pointer can hover: a tap would leave this on. */
+    @media (hover: hover) {
+      .close:hover {
+        background: var(--tt-accent);
+        color: var(--_foreground);
+      }
     }
 
     .close:focus-visible {
@@ -507,7 +514,7 @@ let TTModal = class TTModal extends LitElement {
                   <button
                     part="close"
                     class="close"
-                    aria-label="Close"
+                    aria-label=${this.text.get("close")}
                     @click=${this.closeModal}
                   >
                     <tt-icon name="x" size="16px"></tt-icon>
@@ -528,6 +535,9 @@ let TTModal = class TTModal extends LitElement {
     `;
     }
 };
+__decorate([
+    property({ attribute: false })
+], TTModal.prototype, "strings", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], TTModal.prototype, "open", void 0);

package/dist/tt-modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"tt-modal.js","sourceRoot":"","sources":["../src/tt-modal.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"tt-modal.js","sourceRoot":"","sources":["../src/tt-modal.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACpG,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,cAAc,CAAC;AACtB,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAM1C,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,UAAU;IAAhC;;QACL,qEAAqE;QACrC,YAAO,GAAuB,EAAE,CAAC;QAEzD,SAAI,GAAG,IAAI,iBAAiB,CAAC,IAAI,CAAC,CAAC;QAE3C,mEAAmE;QACnE,sCAAsC;QAEtC,SAAI,GAAG,KAAK,CAAC;QAEb,oEAAoE;QACpE,gEAAgE;QAEhE,YAAO,GAAG,EAAE,CAAC;QAGb,SAAI,GAAc,QAAQ,CAAC;QAE3B;;;;;UAKE;QAEF,eAAU,GAAG,KAAK,CAAC;QAEnB,4EAA4E;QAE5E,YAAO,GAAG,KAAK,CAAC;QAER,gBAAW,GAAuB,IAAI,CAAC;QAE/C;;;;;UAKE;QACe,YAAO,GAAG,KAAK,CAAC;QAyCjC,kEAAkE;QAClE,gEAAgE;QACxD,WAAM,GAAG,KAAK,CAAC;QA+Ff,kBAAa,GAAG,CAAC,KAAoB,EAAE,EAAE;YAC/C,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO;gBAAE,OAAO;YAEvC,oEAAoE;YACpE,4CAA4C;YAC5C,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;gBAAE,OAAO;YAEhC,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;gBAC3B,4DAA4D;gBAC5D,+DAA+D;gBAC/D,sCAAsC;gBACtC,IAAI,KAAK,CAAC,gBAAgB;oBAAE,OAAO;gBACnC,IAAI,CAAC,UAAU,EAAE,CAAC;gBAClB,OAAO;YACT,CAAC;YAED;;;;;;;cAOE;YACF,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,EAAE,CAAC;gBACxB,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;gBACxD,IAAI,MAAM;oBAAE,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;YACrC,CAAC;QACH,CAAC,CAAC;IAkWJ,CAAC;IArgBS,UAAU;QAChB,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QAElB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,UAAU,EAAE;YAC1B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACf,CAAC,CACH,CAAC;IACJ,CAAC;IAEO,mBAAmB,CAAC,KAAiB;QAC3C,IAAI,KAAK,CAAC,MAAM,KAAK,KAAK,CAAC,aAAa,EAAE,CAAC;YACzC,IAAI,CAAC,UAAU,EAAE,CAAC;QACpB,CAAC;IACH,CAAC;IAEO,iBAAiB,CAAC,KAAY;QACpC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;QAE3C,IAAI,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,EAAE,CAAC;YACtC,IAAI,CAAC,UAAU,EAAE,CAAC;QACpB,CAAC;IACH,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QAEvD,2DAA2D;QAC3D,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,UAAU;YAAE,WAAW,CAAC,IAAI,CAAC,CAAC;IACvE,CAAC;IAMO,OAAO,CAAC,IAAa;QAC3B,IAAI,IAAI,KAAK,IAAI,CAAC,MAAM;YAAE,OAAO;QAEjC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QAEnB,IAAI,IAAI;YAAE,UAAU,EAAE,CAAC;;YAClB,YAAY,EAAE,CAAC;IACtB,CAAC;IAED,oBAAoB;QAClB,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QAE1D,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACpB,aAAa,CAAC,IAAI,CAAC,CAAC;QAEpB,oEAAoE;QACpE,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC;QACpB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QAErB,KAAK,CAAC,oBAAoB,EAAE,CAAC;IAC/B,CAAC;IAED,UAAU,CAAC,OAAuB;QAChC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,OAAO;YAAE,OAAO;QAEjD,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,uEAAuE;YACvE,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC;YACpB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACvB,CAAC;aAAM,IAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC;YACxC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACtB,CAAC;IACH,CAAC;IAED,OAAO,CAAC,OAAuB;QAC7B,wEAAwE;QACxE,0DAA0D;QAC1D,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YAC3C,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC;YAC7B,IAAI,CAAC,UAAU,GAAG,gBAAgB,CAChC,CAAC,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,EAAE,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,EAC/D,GAAG,EAAE;gBACH,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;gBAC5B,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;YACvB,CAAC,CACF,CAAC;QACJ,CAAC;QAED,IAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YACzC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAExB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;gBACd,WAAW,CAAC,IAAI,CAAC,CAAC;gBAClB,gEAAgE;gBAChE,kBAAkB;gBAClB,IAAI,CAAC,WAAW,GAAG,iBAAiB,EAAwB,CAAC;gBAE7D;;;;;;kBAME;gBACF,IAAI,CAAC,UAAU,EAAE,aAAa,CAAc,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;gBAE/D;;;;;;;;;;kBAUE;gBACF,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAElC,aAAa,CAAC,CAAC;gBACjB,IAAI,SAAS,EAAE,CAAC;oBACd,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE;wBAClD,IAAI,IAAI,CAAC,IAAI;4BAAE,SAAS,CAAC,KAAK,EAAE,CAAC;oBACnC,CAAC,CAAC,CAAC;gBACL,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,aAAa,CAAC,IAAI,CAAC,CAAC;gBACpB,IAAI,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE,CAAC;gBAC5B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;YAC1B,CAAC;QACH,CAAC;IACH,CAAC;aAgCM,WAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2SlB,AA3SY,CA2SX;IAEF,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YACjD,OAAO,IAAI,CAAA,EAAE,CAAC;QAChB,CAAC;QAED,OAAO,IAAI,CAAA;;0BAEW,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,OAAO;YAC7D,CAAC,CAAC,SAAS;YACX,CAAC,CAAC,EAAE;iBACG,IAAI,CAAC,OAAO;iBACZ,IAAI,CAAC,mBAAmB;;;;yBAIhB,IAAI,CAAC,IAAI;;uBAEX,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;4BAC1B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE;;;;wCAIxB,IAAI,CAAC,OAAO;;;;cAItC,CAAC,IAAI,CAAC,UAAU;YAChB,CAAC,CAAC,IAAI,CAAA;;;;iCAIa,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC;6BAC1B,IAAI,CAAC,UAAU;;;;iBAI3B;YACH,CAAC,CAAC,IAAI;;;;;;;mDAO+B,IAAI,CAAC,iBAAiB;;;;;KAKpE,CAAC;IACJ,CAAC;;AA7iB+B;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;wCAAkC;AAOjE;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCAC9B;AAKb;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCACd;AAGb;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCACA;AAS3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2CACT;AAInB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCACZ;AAUC;IAAhB,KAAK,EAAE;wCAAyB;AAxCtB,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CAgjBnB"}