@api-client/ui 0.5.31 → 0.5.33

package/build/src/core/renderer/ApplicationRenderer.d.ts

@@ -1,10 +1,11 @@
 import type { Application } from '../Application.js';
 import type { Activity } from '../Activity.js';
-import { Renderer, renderFn } from './Renderer.js';
+import { Renderer } from './Renderer.js';
 export declare class ApplicationRenderer extends Renderer {
     protected app: Application;
     renderedFirst: WeakMap<Application | Activity, boolean>;
     constructor(app: Application);
-    [renderFn](): void;
+    private _handleFirstRender;
+    protected renderer(): void;
 }
 //# sourceMappingURL=ApplicationRenderer.d.ts.map

package/build/src/core/renderer/ApplicationRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ApplicationRenderer.d.ts","sourceRoot":"","sources":["../../../../src/core/renderer/ApplicationRenderer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AACpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAGlD,qBAAa,mBAAoB,SAAQ,QAAQ;IAGnC,SAAS,CAAC,GAAG,EAAE,WAAW;IAFtC,aAAa,EAAE,OAAO,CAAC,WAAW,GAAG,QAAQ,EAAE,OAAO,CAAC,CAAA;gBAEjC,GAAG,EAAE,WAAW;IAKtC,CAAC,QAAQ,CAAC,IAAI,IAAI;CA0CnB"}
+{"version":3,"file":"ApplicationRenderer.d.ts","sourceRoot":"","sources":["../../../../src/core/renderer/ApplicationRenderer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AACpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAGxC,qBAAa,mBAAoB,SAAQ,QAAQ;IAGnC,SAAS,CAAC,GAAG,EAAE,WAAW;IAFtC,aAAa,EAAE,OAAO,CAAC,WAAW,GAAG,QAAQ,EAAE,OAAO,CAAC,CAAA;gBAEjC,GAAG,EAAE,WAAW;IAKtC,OAAO,CAAC,kBAAkB;IAU1B,SAAS,CAAC,QAAQ,IAAI,IAAI;CA4B3B"}

package/build/src/core/renderer/ApplicationRenderer.js

@@ -1,5 +1,4 @@
-import { render } from 'lit';
-import { Renderer, renderFn } from './Renderer.js';
+import { Renderer } from './Renderer.js';
 import { ModalActivity } from '../ModalActivity.js';
 export class ApplicationRenderer extends Renderer {
     app;
@@ -9,48 +8,40 @@ export class ApplicationRenderer extends Renderer {
         this.app = app;
         this.renderedFirst = new WeakMap();
     }
-    [renderFn]() {
-        const { app, renderRoot } = this;
-        let host;
-        let root = renderRoot;
-        let content;
-        const activity = app.manager.getTopActivity();
-        if (activity) {
-            host = activity;
-            if (activity.renderRoot) {
-                root = activity.renderRoot;
-            }
-            if (activity instanceof ModalActivity) {
-                content = activity.renderDialog();
-            }
-            else {
-                content = activity.render();
+    _handleFirstRender(target, clearRoot, root) {
+        if (!this.renderedFirst.has(target)) {
+            this.renderedFirst.set(target, true);
+            if (clearRoot) {
+                this._clearRoot(root);
             }
+            queueMicrotask(() => target.onFirstRender());
+        }
+    }
+    renderer() {
+        const { app, renderRoot: defaultRenderRoot } = this;
+        const activity = app.manager.getTopActivity();
+        const host = activity || app;
+        const root = activity?.renderRoot || defaultRenderRoot;
+        let content;
+        if (activity instanceof ModalActivity) {
+            content = activity.renderDialog();
         }
         else {
-            host = app;
-            content = app.render();
+            content = host.render();
         }
         if (!root) {
             // eslint-disable-next-line no-console
             console.warn(`The "renderRoot" is not set up.`);
             return;
         }
-        if (!this.renderedFirst.has(app)) {
-            this.renderedFirst.set(app, true);
-            Array.from(root.childNodes).forEach((node) => root.parentNode?.removeChild(node));
-            setTimeout(() => app.onFirstRender());
-        }
-        // host might !== app
-        if (!this.renderedFirst.has(host)) {
-            setTimeout(() => host.onFirstRender());
+        this._handleFirstRender(app, true, root);
+        if (!this.firstRendered) {
+            this.firstRenderedFlag = true;
         }
-        const litPart = root;
-        if (litPart._$litPart$ && litPart._$litPart$.options) {
-            litPart._$litPart$.options.host = host;
+        if (host !== app) {
+            this._handleFirstRender(host, false, root);
         }
-        render(content, root, { host });
-        this.resolveUpdatePromise();
+        this._render(content, root, host);
         this.app.onRendered();
     }
 }

package/build/src/core/renderer/ApplicationRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ApplicationRenderer.js","sourceRoot":"","sources":["../../../../src/core/renderer/ApplicationRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAW,MAAM,EAAsC,MAAM,KAAK,CAAA;AAGzE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAEnD,MAAM,OAAO,mBAAoB,SAAQ,QAAQ;IAGzB;IAFtB,aAAa,CAA0C;IAEvD,YAAsB,GAAgB;QACpC,KAAK,EAAE,CAAA;QADa,QAAG,GAAH,GAAG,CAAa;QAEpC,IAAI,CAAC,aAAa,GAAG,IAAI,OAAO,EAAE,CAAA;IACpC,CAAC;IAED,CAAC,QAAQ,CAAC;QACR,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,GAAG,IAAI,CAAA;QAChC,IAAI,IAA4B,CAAA;QAChC,IAAI,IAAI,GAAuB,UAAU,CAAA;QACzC,IAAI,OAAwC,CAAA;QAC5C,MAAM,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAC,cAAc,EAAE,CAAA;QAC7C,IAAI,QAAQ,EAAE,CAAC;YACb,IAAI,GAAG,QAAQ,CAAA;YACf,IAAI,QAAQ,CAAC,UAAU,EAAE,CAAC;gBACxB,IAAI,GAAG,QAAQ,CAAC,UAAU,CAAA;YAC5B,CAAC;YACD,IAAI,QAAQ,YAAY,aAAa,EAAE,CAAC;gBACtC,OAAO,GAAG,QAAQ,CAAC,YAAY,EAAE,CAAA;YACnC,CAAC;iBAAM,CAAC;gBACN,OAAO,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAA;YAC7B,CAAC;QACH,CAAC;aAAM,CAAC;YACN,IAAI,GAAG,GAAG,CAAA;YACV,OAAO,GAAG,GAAG,CAAC,MAAM,EAAE,CAAA;QACxB,CAAC;QACD,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,sCAAsC;YACtC,OAAO,CAAC,IAAI,CAAC,iCAAiC,CAAC,CAAA;YAC/C,OAAM;QACR,CAAC;QACD,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;YACjC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,CAAA;YACjC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC,CAAA;YACjF,UAAU,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC,CAAA;QACvC,CAAC;QACD,qBAAqB;QACrB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;YAClC,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAA;QACxC,CAAC;QACD,MAAM,OAAO,GAAG,IAA+C,CAAA;QAC/D,IAAI,OAAO,CAAC,UAAU,IAAI,OAAO,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;YACrD,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,GAAG,IAAI,CAAA;QACxC,CAAC;QACD,MAAM,CAAC,OAAO,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,CAAA;QAC/B,IAAI,CAAC,oBAAoB,EAAE,CAAA;QAC3B,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,CAAA;IACvB,CAAC;CACF","sourcesContent":["import { nothing, render, type RootPart, type TemplateResult } from 'lit'\nimport type { Application } from '../Application.js'\nimport type { Activity } from '../Activity.js'\nimport { Renderer, renderFn } from './Renderer.js'\nimport { ModalActivity } from '../ModalActivity.js'\n\nexport class ApplicationRenderer extends Renderer {\n  renderedFirst: WeakMap<Application | Activity, boolean>\n\n  constructor(protected app: Application) {\n    super()\n    this.renderedFirst = new WeakMap()\n  }\n\n  [renderFn](): void {\n    const { app, renderRoot } = this\n    let host: Application | Activity\n    let root: HTMLElement | null = renderRoot\n    let content: TemplateResult | typeof nothing\n    const activity = app.manager.getTopActivity()\n    if (activity) {\n      host = activity\n      if (activity.renderRoot) {\n        root = activity.renderRoot\n      }\n      if (activity instanceof ModalActivity) {\n        content = activity.renderDialog()\n      } else {\n        content = activity.render()\n      }\n    } else {\n      host = app\n      content = app.render()\n    }\n    if (!root) {\n      // eslint-disable-next-line no-console\n      console.warn(`The \"renderRoot\" is not set up.`)\n      return\n    }\n    if (!this.renderedFirst.has(app)) {\n      this.renderedFirst.set(app, true)\n      Array.from(root.childNodes).forEach((node) => root.parentNode?.removeChild(node))\n      setTimeout(() => app.onFirstRender())\n    }\n    // host might !== app\n    if (!this.renderedFirst.has(host)) {\n      setTimeout(() => host.onFirstRender())\n    }\n    const litPart = root as HTMLElement & { _$litPart$?: RootPart }\n    if (litPart._$litPart$ && litPart._$litPart$.options) {\n      litPart._$litPart$.options.host = host\n    }\n    render(content, root, { host })\n    this.resolveUpdatePromise()\n    this.app.onRendered()\n  }\n}\n"]}
+{"version":3,"file":"ApplicationRenderer.js","sourceRoot":"","sources":["../../../../src/core/renderer/ApplicationRenderer.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAEnD,MAAM,OAAO,mBAAoB,SAAQ,QAAQ;IAGzB;IAFtB,aAAa,CAA0C;IAEvD,YAAsB,GAAgB;QACpC,KAAK,EAAE,CAAA;QADa,QAAG,GAAH,GAAG,CAAa;QAEpC,IAAI,CAAC,aAAa,GAAG,IAAI,OAAO,EAAE,CAAA;IACpC,CAAC;IAEO,kBAAkB,CAAC,MAA8B,EAAE,SAAkB,EAAE,IAAiB;QAC9F,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;YACpC,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,MAAM,EAAE,IAAI,CAAC,CAAA;YACpC,IAAI,SAAS,EAAE,CAAC;gBACd,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;YACvB,CAAC;YACD,cAAc,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC,CAAA;QAC9C,CAAC;IACH,CAAC;IAES,QAAQ;QAChB,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,iBAAiB,EAAE,GAAG,IAAI,CAAA;QACnD,MAAM,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAC,cAAc,EAAE,CAAA;QAE7C,MAAM,IAAI,GAA2B,QAAQ,IAAI,GAAG,CAAA;QACpD,MAAM,IAAI,GAAuB,QAAQ,EAAE,UAAU,IAAI,iBAAiB,CAAA;QAE1E,IAAI,OAAwC,CAAA;QAC5C,IAAI,QAAQ,YAAY,aAAa,EAAE,CAAC;YACtC,OAAO,GAAG,QAAQ,CAAC,YAAY,EAAE,CAAA;QACnC,CAAC;aAAM,CAAC;YACN,OAAO,GAAG,IAAI,CAAC,MAAM,EAAE,CAAA;QACzB,CAAC;QACD,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,sCAAsC;YACtC,OAAO,CAAC,IAAI,CAAC,iCAAiC,CAAC,CAAA;YAC/C,OAAM;QACR,CAAC;QACD,IAAI,CAAC,kBAAkB,CAAC,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,CAAA;QACxC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;YACxB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAA;QAC/B,CAAC;QACD,IAAI,IAAI,KAAK,GAAG,EAAE,CAAC;YACjB,IAAI,CAAC,kBAAkB,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,CAAA;QAC5C,CAAC;QACD,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,CAAA;QACjC,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,CAAA;IACvB,CAAC;CACF","sourcesContent":["import { nothing, type TemplateResult } from 'lit'\nimport type { Application } from '../Application.js'\nimport type { Activity } from '../Activity.js'\nimport { Renderer } from './Renderer.js'\nimport { ModalActivity } from '../ModalActivity.js'\n\nexport class ApplicationRenderer extends Renderer {\n  renderedFirst: WeakMap<Application | Activity, boolean>\n\n  constructor(protected app: Application) {\n    super()\n    this.renderedFirst = new WeakMap()\n  }\n\n  private _handleFirstRender(target: Application | Activity, clearRoot: boolean, root: HTMLElement): void {\n    if (!this.renderedFirst.has(target)) {\n      this.renderedFirst.set(target, true)\n      if (clearRoot) {\n        this._clearRoot(root)\n      }\n      queueMicrotask(() => target.onFirstRender())\n    }\n  }\n\n  protected renderer(): void {\n    const { app, renderRoot: defaultRenderRoot } = this\n    const activity = app.manager.getTopActivity()\n\n    const host: Application | Activity = activity || app\n    const root: HTMLElement | null = activity?.renderRoot || defaultRenderRoot\n\n    let content: TemplateResult | typeof nothing\n    if (activity instanceof ModalActivity) {\n      content = activity.renderDialog()\n    } else {\n      content = host.render()\n    }\n    if (!root) {\n      // eslint-disable-next-line no-console\n      console.warn(`The \"renderRoot\" is not set up.`)\n      return\n    }\n    this._handleFirstRender(app, true, root)\n    if (!this.firstRendered) {\n      this.firstRenderedFlag = true\n    }\n    if (host !== app) {\n      this._handleFirstRender(host, false, root)\n    }\n    this._render(content, root, host)\n    this.app.onRendered()\n  }\n}\n"]}

package/build/src/core/renderer/FragmentRenderer.d.ts

@@ -1,8 +1,8 @@
 import type { Fragment } from '../Fragment.js';
-import { Renderer, renderFn } from './Renderer.js';
+import { Renderer } from './Renderer.js';
 export declare class FragmentRenderer extends Renderer {
     protected fragment: Fragment;
     constructor(fragment: Fragment);
-    [renderFn](): void;
+    protected renderer(): void;
 }
 //# sourceMappingURL=FragmentRenderer.d.ts.map

package/build/src/core/renderer/FragmentRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FragmentRenderer.d.ts","sourceRoot":"","sources":["../../../../src/core/renderer/FragmentRenderer.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAElD,qBAAa,gBAAiB,SAAQ,QAAQ;IAChC,SAAS,CAAC,QAAQ,EAAE,QAAQ;gBAAlB,QAAQ,EAAE,QAAQ;IAIxC,CAAC,QAAQ,CAAC,IAAI,IAAI;CAuBnB"}
+{"version":3,"file":"FragmentRenderer.d.ts","sourceRoot":"","sources":["../../../../src/core/renderer/FragmentRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAExC,qBAAa,gBAAiB,SAAQ,QAAQ;IAChC,SAAS,CAAC,QAAQ,EAAE,QAAQ;gBAAlB,QAAQ,EAAE,QAAQ;IAIxC,SAAS,CAAC,QAAQ,IAAI,IAAI;CAe3B"}

package/build/src/core/renderer/FragmentRenderer.js

@@ -1,34 +1,24 @@
-import { render } from 'lit';
-import { Renderer, renderFn } from './Renderer.js';
+import { Renderer } from './Renderer.js';
 export class FragmentRenderer extends Renderer {
     fragment;
     constructor(fragment) {
         super();
         this.fragment = fragment;
     }
-    [renderFn]() {
+    renderer() {
         const root = this.renderRoot;
         if (!root) {
             // return quietly. Fragments can be rendered directly.
             return;
         }
-        const fragment = this.fragment;
-        const host = fragment.getSingleVisibleFragment() || fragment;
+        const host = this.fragment.getSingleVisibleFragment() ?? this.fragment;
         if (!this.firstRendered) {
             this.firstRenderedFlag = true;
             // cleanup any pre-existing content.
-            Array.from(root.childNodes).forEach((node) => root.parentNode?.removeChild(node));
-            setTimeout(() => host.onFirstRender());
+            this._clearRoot(root);
+            queueMicrotask(() => host.onFirstRender());
         }
-        const litPart = root;
-        if (litPart._$litPart$) {
-            ;
-            litPart._$litPart$.options.host = host;
-        }
-        // console.log(host, root)
-        render(host.render(), root, { host });
-        this.resolveUpdatePromise();
-        // this.app.onRendered()
+        this._render(host.render(), root, host);
     }
 }
 //# sourceMappingURL=FragmentRenderer.js.map

package/build/src/core/renderer/FragmentRenderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"FragmentRenderer.js","sourceRoot":"","sources":["../../../../src/core/renderer/FragmentRenderer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAA2B,MAAM,KAAK,CAAA;AAErD,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAElD,MAAM,OAAO,gBAAiB,SAAQ,QAAQ;IACtB;IAAtB,YAAsB,QAAkB;QACtC,KAAK,EAAE,CAAA;QADa,aAAQ,GAAR,QAAQ,CAAU;IAExC,CAAC;IAED,CAAC,QAAQ,CAAC;QACR,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAA;QAC5B,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,sDAAsD;YACtD,OAAM;QACR,CAAC;QACD,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAA;QAC9B,MAAM,IAAI,GAAG,QAAQ,CAAC,wBAAwB,EAAE,IAAI,QAAQ,CAAA;QAC5D,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;YACxB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAA;YAC7B,oCAAoC;YACpC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC,CAAA;YACjF,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAA;QACxC,CAAC;QACD,MAAM,OAAO,GAAG,IAA0D,CAAA;QAC1E,IAAI,OAAO,CAAC,UAAU,EAAE,CAAC;YACvB,CAAC;YAAC,OAAO,CAAC,UAAU,CAAC,OAAyB,CAAC,IAAI,GAAG,IAAI,CAAA;QAC5D,CAAC;QACD,0BAA0B;QAC1B,MAAM,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,CAAA;QACrC,IAAI,CAAC,oBAAoB,EAAE,CAAA;QAC3B,wBAAwB;IAC1B,CAAC;CACF","sourcesContent":["import { render, RenderOptions, RootPart } from 'lit'\nimport type { Fragment } from '../Fragment.js'\nimport { Renderer, renderFn } from './Renderer.js'\n\nexport class FragmentRenderer extends Renderer {\n  constructor(protected fragment: Fragment) {\n    super()\n  }\n\n  [renderFn](): void {\n    const root = this.renderRoot\n    if (!root) {\n      // return quietly. Fragments can be rendered directly.\n      return\n    }\n    const fragment = this.fragment\n    const host = fragment.getSingleVisibleFragment() || fragment\n    if (!this.firstRendered) {\n      this.firstRenderedFlag = true\n      // cleanup any pre-existing content.\n      Array.from(root.childNodes).forEach((node) => root.parentNode?.removeChild(node))\n      setTimeout(() => host.onFirstRender())\n    }\n    const litPart = root as unknown as HTMLElement & { _$litPart$?: RootPart }\n    if (litPart._$litPart$) {\n      ;(litPart._$litPart$.options as RenderOptions).host = host\n    }\n    // console.log(host, root)\n    render(host.render(), root, { host })\n    this.resolveUpdatePromise()\n    // this.app.onRendered()\n  }\n}\n"]}
+{"version":3,"file":"FragmentRenderer.js","sourceRoot":"","sources":["../../../../src/core/renderer/FragmentRenderer.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAExC,MAAM,OAAO,gBAAiB,SAAQ,QAAQ;IACtB;IAAtB,YAAsB,QAAkB;QACtC,KAAK,EAAE,CAAA;QADa,aAAQ,GAAR,QAAQ,CAAU;IAExC,CAAC;IAES,QAAQ;QAChB,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAA;QAC5B,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,sDAAsD;YACtD,OAAM;QACR,CAAC;QACD,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,wBAAwB,EAAE,IAAI,IAAI,CAAC,QAAQ,CAAA;QACtE,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;YACxB,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAA;YAC7B,oCAAoC;YACpC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;YACrB,cAAc,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAA;QAC5C,CAAC;QACD,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,CAAA;IACzC,CAAC;CACF","sourcesContent":["import type { Fragment } from '../Fragment.js'\nimport { Renderer } from './Renderer.js'\n\nexport class FragmentRenderer extends Renderer {\n  constructor(protected fragment: Fragment) {\n    super()\n  }\n\n  protected renderer(): void {\n    const root = this.renderRoot\n    if (!root) {\n      // return quietly. Fragments can be rendered directly.\n      return\n    }\n    const host = this.fragment.getSingleVisibleFragment() ?? this.fragment\n    if (!this.firstRendered) {\n      this.firstRenderedFlag = true\n      // cleanup any pre-existing content.\n      this._clearRoot(root)\n      queueMicrotask(() => host.onFirstRender())\n    }\n    this._render(host.render(), root, host)\n  }\n}\n"]}

package/build/src/core/renderer/Renderer.d.ts

@@ -1,8 +1,8 @@
+import { type TemplateResult, type nothing } from 'lit';
 export declare enum RenderingState {
     Idle = 0,
     Rendering = 1
 }
-export declare const renderFn: unique symbol;
 /**
  * A class that manages rendering of the application screen.
  */
@@ -17,25 +17,54 @@ export declare abstract class Renderer {
      */
     get updateComplete(): Promise<void> | undefined;
     /**
-     * Sets the root element where the application will be rendered.
-     * @param renderRoot The root element or its selector.
+     * Sets the root element where the application or activity will be rendered.
+     *
+     * @param renderRoot - The root element or a CSS selector string for the element.
+     * If a string is provided, it will be queried from the document.
      */
     setRenderRoot(renderRoot: HTMLElement | string): void;
     /**
-     * Requests an update of the application UI. This will call the `render()` method
-     * and update the DOM.
+     * Requests an update of the UI. Schedules a render if one is not already pending.
+     *
+     * This will call the `renderer()` method and update the DOM in the next animation frame.
+     * Ensures only one render is scheduled at a time.
      */
     requestUpdate(): void;
     protected firstRenderedFlag: boolean;
     /**
-     * Determines whether the initial render had run and the `onFirstRender()`
-     * function was called.
+     * Indicates whether the initial render has occurred and `onFirstRender()` was called.
      */
     get firstRendered(): boolean;
     /**
-     * Manages the rendering of the UI.
+     * Returns the current rendering state.
+     *
+     * @returns The current rendering state.
+     */
+    get state(): RenderingState;
+    /**
+     * Abstract method that must be implemented by subclasses to perform the actual rendering logic.
+     *
+     * Called by `requestUpdate()` when a render is scheduled.
+     */
+    protected abstract renderer(): void;
+    /**
+     * Resolves the update promise if one is pending, indicating that rendering has finished.
      */
-    abstract [renderFn](): void;
     protected resolveUpdatePromise(): void;
+    /**
+     * Renders the given Lit template into the specified root element, setting the host context.
+     *
+     * @param content - The Lit template or `nothing` to render.
+     * @param root - The root HTMLElement to render into.
+     * @param host - The host object for Lit's context (usually the Application or Activity).
+     */
+    protected _render(content: TemplateResult | typeof nothing, root: HTMLElement, host: object): void;
+    /**
+     * Removes all child nodes from the given root element.
+     *
+     * Uses `replaceChildren()` for efficient DOM cleanup.
+     * @param root - The root HTMLElement to clear.
+     */
+    protected _clearRoot(root: HTMLElement): void;
 }
 //# sourceMappingURL=Renderer.d.ts.map

package/build/src/core/renderer/Renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../../../src/core/renderer/Renderer.ts"],"names":[],"mappings":"AAAA,oBAAY,cAAc;IACxB,IAAI,IAAA;IACJ,SAAS,IAAA;CACV;AAED,eAAO,MAAM,QAAQ,eAAqB,CAAA;AAE1C;;GAEG;AACH,8BAAsB,QAAQ;;IAC5B;;OAEG;IACH,UAAU,EAAE,WAAW,GAAG,IAAI,CAAO;IAErC;;OAEG;IACH,IAAI,cAAc,IAAI,OAAO,CAAC,IAAI,CAAC,GAAG,SAAS,CAE9C;IAED;;;OAGG;IACH,aAAa,CAAC,UAAU,EAAE,WAAW,GAAG,MAAM,GAAG,IAAI;IAQrD;;;OAGG;IACH,aAAa,IAAI,IAAI;IAerB,SAAS,CAAC,iBAAiB,UAAQ;IAEnC;;;OAGG;IACH,IAAI,aAAa,IAAI,OAAO,CAE3B;IAsBD;;OAEG;IACH,QAAQ,CAAC,CAAC,QAAQ,CAAC,IAAI,IAAI;IAS3B,SAAS,CAAC,oBAAoB,IAAI,IAAI;CAUvC"}
+{"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../../../src/core/renderer/Renderer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,cAAc,EAAE,KAAK,OAAO,EAAE,MAAM,KAAK,CAAA;AAE9E,oBAAY,cAAc;IACxB,IAAI,IAAA;IACJ,SAAS,IAAA;CACV;AAED;;GAEG;AACH,8BAAsB,QAAQ;;IAC5B;;OAEG;IACH,UAAU,EAAE,WAAW,GAAG,IAAI,CAAO;IAErC;;OAEG;IACH,IAAI,cAAc,IAAI,OAAO,CAAC,IAAI,CAAC,GAAG,SAAS,CAE9C;IAED;;;;;OAKG;IACH,aAAa,CAAC,UAAU,EAAE,WAAW,GAAG,MAAM,GAAG,IAAI;IAQrD;;;;;OAKG;IACH,aAAa,IAAI,IAAI;IAerB,SAAS,CAAC,iBAAiB,UAAQ;IAEnC;;OAEG;IACH,IAAI,aAAa,IAAI,OAAO,CAE3B;IAOD;;;;OAIG;IACH,IAAI,KAAK,IAAI,cAAc,CAE1B;IAiBD;;;;OAIG;IACH,SAAS,CAAC,QAAQ,CAAC,QAAQ,IAAI,IAAI;IAanC;;OAEG;IACH,SAAS,CAAC,oBAAoB,IAAI,IAAI;IAWtC;;;;;;OAMG;IACH,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,OAAO,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IASlG;;;;;OAKG;IACH,SAAS,CAAC,UAAU,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI;CAI9C"}

package/build/src/core/renderer/Renderer.js

@@ -1,9 +1,9 @@
+import { render } from 'lit';
 export var RenderingState;
 (function (RenderingState) {
     RenderingState[RenderingState["Idle"] = 0] = "Idle";
     RenderingState[RenderingState["Rendering"] = 1] = "Rendering";
 })(RenderingState || (RenderingState = {}));
-export const renderFn = Symbol('renderFn');
 /**
  * A class that manages rendering of the application screen.
  */
@@ -19,8 +19,10 @@ export class Renderer {
         return this.#updateComplete;
     }
     /**
-     * Sets the root element where the application will be rendered.
-     * @param renderRoot The root element or its selector.
+     * Sets the root element where the application or activity will be rendered.
+     *
+     * @param renderRoot - The root element or a CSS selector string for the element.
+     * If a string is provided, it will be queried from the document.
      */
     setRenderRoot(renderRoot) {
         if (typeof renderRoot === 'string') {
@@ -31,8 +33,10 @@ export class Renderer {
         }
     }
     /**
-     * Requests an update of the application UI. This will call the `render()` method
-     * and update the DOM.
+     * Requests an update of the UI. Schedules a render if one is not already pending.
+     *
+     * This will call the `renderer()` method and update the DOM in the next animation frame.
+     * Ensures only one render is scheduled at a time.
      */
     requestUpdate() {
         if (this.#renderingState !== RenderingState.Idle) {
@@ -44,14 +48,13 @@ export class Renderer {
             this.#setUpdatePromise();
         }
         requestAnimationFrame(() => {
-            this[renderFn]();
+            this.renderer();
             this.#renderingState = RenderingState.Idle;
         });
     }
     firstRenderedFlag = false;
     /**
-     * Determines whether the initial render had run and the `onFirstRender()`
-     * function was called.
+     * Indicates whether the initial render has occurred and `onFirstRender()` was called.
      */
     get firstRendered() {
         return this.firstRenderedFlag;
@@ -60,6 +63,14 @@ export class Renderer {
      * A flag used to determine in which rendering state the UI is.
      */
     #renderingState = RenderingState.Idle;
+    /**
+     * Returns the current rendering state.
+     *
+     * @returns The current rendering state.
+     */
+    get state() {
+        return this.#renderingState;
+    }
     /**
      * A flag that helps to determine whether the `updateComplete` is setup.
      */
@@ -72,12 +83,19 @@ export class Renderer {
      * The resolver to call when the update completes.
      */
     #updateResolver;
+    /**
+     * Sets up the promise that will be resolved when the next render completes.
+     * Used for tracking asynchronous rendering.
+     */
     #setUpdatePromise() {
         this.#updateComplete = new Promise((resolve) => {
             this.#updateResolver = resolve;
             this.#hasPendingUpdatePromise = true;
         });
     }
+    /**
+     * Resolves the update promise if one is pending, indicating that rendering has finished.
+     */
     resolveUpdatePromise() {
         if (!this.#hasPendingUpdatePromise) {
             return;
@@ -88,5 +106,30 @@ export class Renderer {
             resolver();
         }
     }
+    /**
+     * Renders the given Lit template into the specified root element, setting the host context.
+     *
+     * @param content - The Lit template or `nothing` to render.
+     * @param root - The root HTMLElement to render into.
+     * @param host - The host object for Lit's context (usually the Application or Activity).
+     */
+    _render(content, root, host) {
+        const litPart = root;
+        if (litPart._$litPart$ && litPart._$litPart$.options) {
+            litPart._$litPart$.options.host = host;
+        }
+        render(content, root, { host });
+        this.resolveUpdatePromise();
+    }
+    /**
+     * Removes all child nodes from the given root element.
+     *
+     * Uses `replaceChildren()` for efficient DOM cleanup.
+     * @param root - The root HTMLElement to clear.
+     */
+    _clearRoot(root) {
+        // Using replaceChildren() is a modern and clean way to clear a node's children.
+        root.replaceChildren();
+    }
 }
 //# sourceMappingURL=Renderer.js.map

package/build/src/core/renderer/Renderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Renderer.js","sourceRoot":"","sources":["../../../../src/core/renderer/Renderer.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,cAGX;AAHD,WAAY,cAAc;IACxB,mDAAI,CAAA;IACJ,6DAAS,CAAA;AACX,CAAC,EAHW,cAAc,KAAd,cAAc,QAGzB;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,UAAU,CAAC,CAAA;AAE1C;;GAEG;AACH,MAAM,OAAgB,QAAQ;IAC5B;;OAEG;IACH,UAAU,GAAuB,IAAI,CAAA;IAErC;;OAEG;IACH,IAAI,cAAc;QAChB,OAAO,IAAI,CAAC,eAAe,CAAA;IAC7B,CAAC;IAED;;;OAGG;IACH,aAAa,CAAC,UAAgC;QAC5C,IAAI,OAAO,UAAU,KAAK,QAAQ,EAAE,CAAC;YACnC,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAc,UAAU,CAAC,CAAA;QACnE,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,UAAU,GAAG,UAAU,CAAA;QAC9B,CAAC;IACH,CAAC;IAED;;;OAGG;IACH,aAAa;QACX,IAAI,IAAI,CAAC,eAAe,KAAK,cAAc,CAAC,IAAI,EAAE,CAAC;YACjD,kCAAkC;YAClC,OAAM;QACR,CAAC;QACD,IAAI,CAAC,eAAe,GAAG,cAAc,CAAC,SAAS,CAAA;QAC/C,IAAI,CAAC,IAAI,CAAC,wBAAwB,EAAE,CAAC;YACnC,IAAI,CAAC,iBAAiB,EAAE,CAAA;QAC1B,CAAC;QACD,qBAAqB,CAAC,GAAG,EAAE;YACzB,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAA;YAChB,IAAI,CAAC,eAAe,GAAG,cAAc,CAAC,IAAI,CAAA;QAC5C,CAAC,CAAC,CAAA;IACJ,CAAC;IAES,iBAAiB,GAAG,KAAK,CAAA;IAEnC;;;OAGG;IACH,IAAI,aAAa;QACf,OAAO,IAAI,CAAC,iBAAiB,CAAA;IAC/B,CAAC;IAED;;OAEG;IACH,eAAe,GAAG,cAAc,CAAC,IAAI,CAAA;IAErC;;OAEG;IACH,wBAAwB,GAAG,KAAK,CAAA;IAEhC;;OAEG;IACH,eAAe,CAAgB;IAE/B;;OAEG;IACH,eAAe,CAAc;IAO7B,iBAAiB;QACf,IAAI,CAAC,eAAe,GAAG,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,EAAE;YACnD,IAAI,CAAC,eAAe,GAAG,OAAO,CAAA;YAC9B,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAA;QACtC,CAAC,CAAC,CAAA;IACJ,CAAC;IAES,oBAAoB;QAC5B,IAAI,CAAC,IAAI,CAAC,wBAAwB,EAAE,CAAC;YACnC,OAAM;QACR,CAAC;QACD,IAAI,CAAC,wBAAwB,GAAG,KAAK,CAAA;QACrC,MAAM,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAA;QACrC,IAAI,QAAQ,EAAE,CAAC;YACb,QAAQ,EAAE,CAAA;QACZ,CAAC;IACH,CAAC;CACF","sourcesContent":["export enum RenderingState {\n  Idle,\n  Rendering,\n}\n\nexport const renderFn = Symbol('renderFn')\n\n/**\n * A class that manages rendering of the application screen.\n */\nexport abstract class Renderer {\n  /**\n   * The root element where the activity or fragment will be rendered.\n   */\n  renderRoot: HTMLElement | null = null\n\n  /**\n   * @type A promise resolved when the render finished.\n   */\n  get updateComplete(): Promise<void> | undefined {\n    return this.#updateComplete\n  }\n\n  /**\n   * Sets the root element where the application will be rendered.\n   * @param renderRoot The root element or its selector.\n   */\n  setRenderRoot(renderRoot: HTMLElement | string): void {\n    if (typeof renderRoot === 'string') {\n      this.renderRoot = document.querySelector<HTMLElement>(renderRoot)\n    } else {\n      this.renderRoot = renderRoot\n    }\n  }\n\n  /**\n   * Requests an update of the application UI. This will call the `render()` method\n   * and update the DOM.\n   */\n  requestUpdate(): void {\n    if (this.#renderingState !== RenderingState.Idle) {\n      // An update is already scheduled.\n      return\n    }\n    this.#renderingState = RenderingState.Rendering\n    if (!this.#hasPendingUpdatePromise) {\n      this.#setUpdatePromise()\n    }\n    requestAnimationFrame(() => {\n      this[renderFn]()\n      this.#renderingState = RenderingState.Idle\n    })\n  }\n\n  protected firstRenderedFlag = false\n\n  /**\n   * Determines whether the initial render had run and the `onFirstRender()`\n   * function was called.\n   */\n  get firstRendered(): boolean {\n    return this.firstRenderedFlag\n  }\n\n  /**\n   * A flag used to determine in which rendering state the UI is.\n   */\n  #renderingState = RenderingState.Idle\n\n  /**\n   * A flag that helps to determine whether the `updateComplete` is setup.\n   */\n  #hasPendingUpdatePromise = false\n\n  /**\n   * A hidden value for the `updateComplete` getter.\n   */\n  #updateComplete?: Promise<void>\n\n  /**\n   * The resolver to call when the update completes.\n   */\n  #updateResolver?: () => void;\n\n  /**\n   * Manages the rendering of the UI.\n   */\n  abstract [renderFn](): void\n\n  #setUpdatePromise(): void {\n    this.#updateComplete = new Promise<void>((resolve) => {\n      this.#updateResolver = resolve\n      this.#hasPendingUpdatePromise = true\n    })\n  }\n\n  protected resolveUpdatePromise(): void {\n    if (!this.#hasPendingUpdatePromise) {\n      return\n    }\n    this.#hasPendingUpdatePromise = false\n    const resolver = this.#updateResolver\n    if (resolver) {\n      resolver()\n    }\n  }\n}\n"]}
+{"version":3,"file":"Renderer.js","sourceRoot":"","sources":["../../../../src/core/renderer/Renderer.ts"],"names":[],"mappings":"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","sourcesContent":["import { render, type RootPart, type TemplateResult, type nothing } from 'lit'\n\nexport enum RenderingState {\n  Idle,\n  Rendering,\n}\n\n/**\n * A class that manages rendering of the application screen.\n */\nexport abstract class Renderer {\n  /**\n   * The root element where the activity or fragment will be rendered.\n   */\n  renderRoot: HTMLElement | null = null\n\n  /**\n   * @type A promise resolved when the render finished.\n   */\n  get updateComplete(): Promise<void> | undefined {\n    return this.#updateComplete\n  }\n\n  /**\n   * Sets the root element where the application or activity will be rendered.\n   *\n   * @param renderRoot - The root element or a CSS selector string for the element.\n   * If a string is provided, it will be queried from the document.\n   */\n  setRenderRoot(renderRoot: HTMLElement | string): void {\n    if (typeof renderRoot === 'string') {\n      this.renderRoot = document.querySelector<HTMLElement>(renderRoot)\n    } else {\n      this.renderRoot = renderRoot\n    }\n  }\n\n  /**\n   * Requests an update of the UI. Schedules a render if one is not already pending.\n   *\n   * This will call the `renderer()` method and update the DOM in the next animation frame.\n   * Ensures only one render is scheduled at a time.\n   */\n  requestUpdate(): void {\n    if (this.#renderingState !== RenderingState.Idle) {\n      // An update is already scheduled.\n      return\n    }\n    this.#renderingState = RenderingState.Rendering\n    if (!this.#hasPendingUpdatePromise) {\n      this.#setUpdatePromise()\n    }\n    requestAnimationFrame(() => {\n      this.renderer()\n      this.#renderingState = RenderingState.Idle\n    })\n  }\n\n  protected firstRenderedFlag = false\n\n  /**\n   * Indicates whether the initial render has occurred and `onFirstRender()` was called.\n   */\n  get firstRendered(): boolean {\n    return this.firstRenderedFlag\n  }\n\n  /**\n   * A flag used to determine in which rendering state the UI is.\n   */\n  #renderingState = RenderingState.Idle\n\n  /**\n   * Returns the current rendering state.\n   *\n   * @returns The current rendering state.\n   */\n  get state(): RenderingState {\n    return this.#renderingState\n  }\n\n  /**\n   * A flag that helps to determine whether the `updateComplete` is setup.\n   */\n  #hasPendingUpdatePromise = false\n\n  /**\n   * A hidden value for the `updateComplete` getter.\n   */\n  #updateComplete?: Promise<void>\n\n  /**\n   * The resolver to call when the update completes.\n   */\n  #updateResolver?: () => void\n\n  /**\n   * Abstract method that must be implemented by subclasses to perform the actual rendering logic.\n   *\n   * Called by `requestUpdate()` when a render is scheduled.\n   */\n  protected abstract renderer(): void\n\n  /**\n   * Sets up the promise that will be resolved when the next render completes.\n   * Used for tracking asynchronous rendering.\n   */\n  #setUpdatePromise(): void {\n    this.#updateComplete = new Promise<void>((resolve) => {\n      this.#updateResolver = resolve\n      this.#hasPendingUpdatePromise = true\n    })\n  }\n\n  /**\n   * Resolves the update promise if one is pending, indicating that rendering has finished.\n   */\n  protected resolveUpdatePromise(): void {\n    if (!this.#hasPendingUpdatePromise) {\n      return\n    }\n    this.#hasPendingUpdatePromise = false\n    const resolver = this.#updateResolver\n    if (resolver) {\n      resolver()\n    }\n  }\n\n  /**\n   * Renders the given Lit template into the specified root element, setting the host context.\n   *\n   * @param content - The Lit template or `nothing` to render.\n   * @param root - The root HTMLElement to render into.\n   * @param host - The host object for Lit's context (usually the Application or Activity).\n   */\n  protected _render(content: TemplateResult | typeof nothing, root: HTMLElement, host: object): void {\n    const litPart = root as HTMLElement & { _$litPart$?: RootPart }\n    if (litPart._$litPart$ && litPart._$litPart$.options) {\n      litPart._$litPart$.options.host = host\n    }\n    render(content, root, { host })\n    this.resolveUpdatePromise()\n  }\n\n  /**\n   * Removes all child nodes from the given root element.\n   *\n   * Uses `replaceChildren()` for efficient DOM cleanup.\n   * @param root - The root HTMLElement to clear.\n   */\n  protected _clearRoot(root: HTMLElement): void {\n    // Using replaceChildren() is a modern and clean way to clear a node's children.\n    root.replaceChildren()\n  }\n}\n"]}

package/build/src/elements/navigation/internals/Navigation.d.ts

@@ -0,0 +1,68 @@
+import { LitElement, type TemplateResult } from 'lit';
+import type NavigationItem from './NavigationItem.js';
+import { AriaCurrent } from '../../../types/aria.js';
+/**
+ * NavigationList
+ *
+ * A semantic, accessible navigation container for `ui-navigation-item` elements.
+ * Handles keyboard navigation (roving tabindex), focus management, and ARIA roles.
+ *
+ * ## Usage Example
+ *
+ * ```html
+ * <ui-navigation aria-label="Main navigation" current="page">
+ *   <ui-navigation-item selected>
+ *     <span slot="icon" aria-hidden="true">🏠</span>
+ *     Home
+ *   </ui-navigation-item>
+ *   <ui-navigation-item>
+ *     <span slot="icon" aria-hidden="true">🔍</span>
+ *     Search
+ *   </ui-navigation-item>
+ *   <ui-navigation-item>
+ *     <span slot="icon" aria-hidden="true">📁</span>
+ *     Files
+ *   </ui-navigation-item>
+ *   <ui-navigation-item iconOnly disabled aria-disabled="true" tabindex="-1">
+ *     <span slot="icon" aria-hidden="true">⚙️</span>
+ *   </ui-navigation-item>
+ * </ui-navigation>
+ * ```
+ *
+ * @slot - Place `ui-navigation-item` elements as direct children.
+ * @fires select - Dispatched when an item is selected via click or keyboard.
+ *                 The `detail` object contains the selected `item`.
+ */
+export default class Navigation extends LitElement {
+    /**
+     * Orientation of the navigation: 'horizontal' or 'vertical'.
+     * @attribute
+     */
+    accessor orientation: 'horizontal' | 'vertical';
+    /**
+     * The current item in the navigation, used for ARIA attributes.
+     * Can be 'page', 'step', 'location', 'date', 'time', 'true', 'false', or ''.
+     * @attribute
+     */
+    accessor current: AriaCurrent;
+    /**
+     * Query all ui-navigation-item children
+     */
+    accessor _items: NavigationItem[];
+    render(): TemplateResult;
+    constructor();
+    firstUpdated(): void;
+    private _onSlotChange;
+    /**
+     * Sets the initial `tabindex` for the items. The first selected item,
+     * or the first item if none are selected, receives `tabindex="0"`.
+     * All other items receive `tabindex="-1"`.
+     */
+    private _setTabIndexes;
+    private _getEnabledItems;
+    private _onClick;
+    private _selectItem;
+    private _updateFocus;
+    private _onKeyDown;
+}
+//# sourceMappingURL=Navigation.d.ts.map

package/build/src/elements/navigation/internals/Navigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Navigation.d.ts","sourceRoot":"","sources":["../../../../../src/elements/navigation/internals/Navigation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAA;AAE3D,OAAO,KAAK,cAAc,MAAM,qBAAqB,CAAA;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAEpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,UAAU;IAChD;;;OAGG;IACwC,QAAQ,CAAC,WAAW,EAAE,YAAY,GAAG,UAAU,CAAa;IAEvG;;;;OAIG;IACwC,QAAQ,CAAC,OAAO,EAAE,WAAW,CAAK;IAE7E;;OAEG;IACuC,QAAQ,CAAC,MAAM,EAAG,cAAc,EAAE,CAAA;IAEnE,MAAM,IAAI,cAAc;;IAcxB,YAAY;IAIrB,OAAO,CAAC,aAAa,CAEpB;IAED;;;;OAIG;IACH,OAAO,CAAC,cAAc;IAatB,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,QAAQ,CAMf;IAED,OAAO,CAAC,WAAW;IA0BnB,OAAO,CAAC,YAAY;IAKpB,OAAO,CAAC,UAAU;CAyCnB"}