@api-client/ui 0.5.39 → 0.5.40

package/build/src/demo/DemoPage.js

@@ -1,175 +0,0 @@
-import { __esDecorate, __runInitializers } from "tslib";
-import { html } from 'lit';
-import { RenderableMixin } from '../mixins/RenderableMixin.js';
-import reactive from '../decorators/reactive.js';
-import styles from './DemoStyles.js';
-import { RouteMixin } from '../mixins/RouteMixin.js';
-import * as MonacoLoader from '../monaco/loader.js';
-import typography from '../styles/m3/typography.module.js';
-import surface from '../styles/m3/surface.module.js';
-import { adaptStatic } from '../decorators/styles.js';
-import '../md/icons/ui-icon.js';
-import '../md/button/ui-button.js';
-const Base = RenderableMixin(RouteMixin(EventTarget));
-/**
- * A base class for demo pages in the API Client ecosystem.
- */
-let DemoPage = (() => {
-    let _classSuper = Base;
-    let _staticExtraInitializers = [];
-    let _static_get_styles_decorators;
-    let _componentName_decorators;
-    let _componentName_initializers = [];
-    let _componentName_extraInitializers = [];
-    let _darkThemeActive_decorators;
-    let _darkThemeActive_initializers = [];
-    let _darkThemeActive_extraInitializers = [];
-    return class DemoPage extends _classSuper {
-        static {
-            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
-            _static_get_styles_decorators = [adaptStatic];
-            _componentName_decorators = [reactive()];
-            _darkThemeActive_decorators = [reactive()];
-            __esDecorate(this, null, _static_get_styles_decorators, { kind: "getter", name: "styles", static: true, private: false, access: { has: obj => "styles" in obj, get: obj => obj.styles }, metadata: _metadata }, null, _staticExtraInitializers);
-            __esDecorate(this, null, _componentName_decorators, { kind: "accessor", name: "componentName", static: false, private: false, access: { has: obj => "componentName" in obj, get: obj => obj.componentName, set: (obj, value) => { obj.componentName = value; } }, metadata: _metadata }, _componentName_initializers, _componentName_extraInitializers);
-            __esDecorate(this, null, _darkThemeActive_decorators, { kind: "accessor", name: "darkThemeActive", static: false, private: false, access: { has: obj => "darkThemeActive" in obj, get: obj => obj.darkThemeActive, set: (obj, value) => { obj.darkThemeActive = value; } }, metadata: _metadata }, _darkThemeActive_initializers, _darkThemeActive_extraInitializers);
-            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
-            __runInitializers(this, _staticExtraInitializers);
-        }
-        static get styles() {
-            return [typography, styles, surface];
-        }
-        #componentName_accessor_storage = __runInitializers(this, _componentName_initializers, ''
-        /**
-         * Determines whether the initial render had run and the `firstRender()`
-         * function was called.
-         */
-        );
-        /**
-         * Component name rendered in the header section.
-         */
-        get componentName() { return this.#componentName_accessor_storage; }
-        set componentName(value) { this.#componentName_accessor_storage = value; }
-        #firstRendered_accessor_storage = (__runInitializers(this, _componentName_extraInitializers), false);
-        /**
-         * Determines whether the initial render had run and the `firstRender()`
-         * function was called.
-         */
-        get firstRendered() { return this.#firstRendered_accessor_storage; }
-        set firstRendered(value) { this.#firstRendered_accessor_storage = value; }
-        #darkThemeActive_accessor_storage = __runInitializers(this, _darkThemeActive_initializers, false
-        /**
-         * For some demo pages, whether the user is authenticated in the store.
-         */
-        );
-        /**
-         * Whether or not the dark theme is active
-         */
-        get darkThemeActive() { return this.#darkThemeActive_accessor_storage; }
-        set darkThemeActive(value) { this.#darkThemeActive_accessor_storage = value; }
-        /**
-         * For some demo pages, whether the user is authenticated in the store.
-         */
-        authenticated = (__runInitializers(this, _darkThemeActive_extraInitializers), false);
-        constructor() {
-            super();
-            this.handleMediaQuery = this.handleMediaQuery.bind(this);
-            this.initMediaQueries();
-            document.body.classList.add('demo');
-        }
-        /**
-         * Initializes media queries and observers.
-         */
-        initMediaQueries() {
-            const matcher = window.matchMedia('(prefers-color-scheme: dark)');
-            if (matcher.matches) {
-                this.darkThemeActive = true;
-            }
-            this.themeActiveCallback();
-            matcher.addEventListener('change', this.handleMediaQuery);
-        }
-        handleMediaQuery(e) {
-            this.darkThemeActive = e.matches;
-            this.themeActiveCallback();
-        }
-        /**
-         * The callback is called when the `darkThemeActive` property change.
-         * Overwrite this function to change the theme of the demo page.
-         *
-         * Note, this is not called by the `darkThemeActive` setter. This is called during the
-         * initialization and then when the media query event is dispatched.
-         * Call this manually when changing this value in the child page.
-         */
-        themeActiveCallback() {
-            const { darkThemeActive } = this;
-            if (darkThemeActive) {
-                this.activateTheme('dark');
-            }
-            else {
-                this.activateTheme('light');
-            }
-        }
-        activateTheme(type) {
-            const root = document.querySelector('html');
-            if (!root) {
-                return;
-            }
-            const { classList } = root;
-            // clear all themes
-            classList.forEach((value) => {
-                if (value.startsWith('theme-')) {
-                    classList.remove(value);
-                }
-            });
-            const name = `theme-${type}`;
-            classList.add(name);
-        }
-        /**
-         * A handler for the `change` event for an element that has `checked` and `name` properties.
-         * This can be used with `ui-switch`, `ui-checkbox`, and `checkbox` elements.
-         *
-         * The `name` should correspond to a variable name to be set. The set value is the value
-         * of `checked` property read from the event's target.
-         */
-        _toggleBooleanOption(e) {
-            const { name, checked } = e.target;
-            this[name] = checked;
-        }
-        async loadMonaco() {
-            const base = new URL('/node_modules/monaco-editor/', window.location.href).toString();
-            MonacoLoader.createEnvironment(base);
-            await MonacoLoader.loadMonaco(base);
-            await MonacoLoader.monacoReady();
-        }
-        /**
-         * The page render function. Usually you don't need to use it.
-         * It renders the header template, main section, and the content.
-         */
-        pageTemplate() {
-            return html ` ${this.headerTemplate()} ${this.navigationTemplate()}
-      <main>${this.contentTemplate()}</main>`;
-        }
-        /**
-         * Call this on the top of the `render()` method to render demo navigation
-         * @returns HTML template for demo header
-         */
-        headerTemplate() {
-            const { componentName } = this;
-            return html ` <header>${componentName ? html `<h1 class="api-title">${componentName}</h1>` : ''}</header>`;
-        }
-        navigationTemplate() {
-            return html ``;
-        }
-        handleAuthenticate() {
-            // ...
-        }
-        authenticateTemplate() {
-            return html `
-      <p>Store authorization required.</p>
-      <ui-button color="filled" @click="${this.handleAuthenticate}">Authenticate</ui-button>
-    `;
-        }
-    };
-})();
-export { DemoPage };
-//# sourceMappingURL=DemoPage.js.map

package/build/src/demo/DemoPage.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DemoPage.js","sourceRoot":"","sources":["../../../src/demo/DemoPage.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, TemplateResult, CSSResult } from 'lit'\nimport { RenderableMixin } from '../mixins/RenderableMixin.js'\nimport reactive from '../decorators/reactive.js'\nimport styles from './DemoStyles.js'\nimport { RouteMixin } from '../mixins/RouteMixin.js'\nimport * as MonacoLoader from '../monaco/loader.js'\nimport typography from '../styles/m3/typography.module.js'\nimport surface from '../styles/m3/surface.module.js'\nimport type CheckboxElement from '../md/checkbox/internals/CheckboxElement.js'\nimport { adaptStatic } from '../decorators/styles.js'\n\nimport '../md/icons/ui-icon.js'\nimport '../md/button/ui-button.js'\n\nconst Base = RenderableMixin(RouteMixin(EventTarget))\n\n/**\n * A base class for demo pages in the API Client ecosystem.\n */\nexport abstract class DemoPage extends Base {\n  @adaptStatic\n  static get styles(): CSSResult[] {\n    return [typography, styles, surface]\n  }\n\n  /**\n   * Component name rendered in the header section.\n   */\n  @reactive() accessor componentName = ''\n\n  /**\n   * Determines whether the initial render had run and the `firstRender()`\n   * function was called.\n   */\n  override accessor firstRendered = false\n\n  /**\n   * Whether or not the dark theme is active\n   */\n  @reactive() accessor darkThemeActive = false\n\n  /**\n   * For some demo pages, whether the user is authenticated in the store.\n   */\n  authenticated = false\n\n  constructor() {\n    super()\n    this.handleMediaQuery = this.handleMediaQuery.bind(this)\n    this.initMediaQueries()\n\n    document.body.classList.add('demo')\n  }\n\n  /**\n   * Initializes media queries and observers.\n   */\n  initMediaQueries(): void {\n    const matcher = window.matchMedia('(prefers-color-scheme: dark)')\n    if (matcher.matches) {\n      this.darkThemeActive = true\n    }\n    this.themeActiveCallback()\n    matcher.addEventListener('change', this.handleMediaQuery)\n  }\n\n  protected handleMediaQuery(e: MediaQueryListEvent): void {\n    this.darkThemeActive = e.matches\n    this.themeActiveCallback()\n  }\n\n  /**\n   * The callback is called when the `darkThemeActive` property change.\n   * Overwrite this function to change the theme of the demo page.\n   *\n   * Note, this is not called by the `darkThemeActive` setter. This is called during the\n   * initialization and then when the media query event is dispatched.\n   * Call this manually when changing this value in the child page.\n   */\n  protected themeActiveCallback(): void {\n    const { darkThemeActive } = this\n    if (darkThemeActive) {\n      this.activateTheme('dark')\n    } else {\n      this.activateTheme('light')\n    }\n  }\n\n  protected activateTheme(type: 'light' | 'dark'): void {\n    const root = document.querySelector('html')\n    if (!root) {\n      return\n    }\n    const { classList } = root\n    // clear all themes\n    classList.forEach((value) => {\n      if (value.startsWith('theme-')) {\n        classList.remove(value)\n      }\n    })\n    const name = `theme-${type}`\n    classList.add(name)\n  }\n\n  /**\n   * A handler for the `change` event for an element that has `checked` and `name` properties.\n   * This can be used with `ui-switch`, `ui-checkbox`, and `checkbox` elements.\n   *\n   * The `name` should correspond to a variable name to be set. The set value is the value\n   * of `checked` property read from the event's target.\n   */\n  protected _toggleBooleanOption(e: Event): void {\n    const { name, checked } = e.target as CheckboxElement\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    ;(this as any)[name as string] = checked\n  }\n\n  async loadMonaco(): Promise<void> {\n    const base = new URL('/node_modules/monaco-editor/', window.location.href).toString()\n    MonacoLoader.createEnvironment(base)\n    await MonacoLoader.loadMonaco(base)\n    await MonacoLoader.monacoReady()\n  }\n\n  /**\n   * The page render function. Usually you don't need to use it.\n   * It renders the header template, main section, and the content.\n   */\n  override pageTemplate(): TemplateResult {\n    return html` ${this.headerTemplate()} ${this.navigationTemplate()}\n      <main>${this.contentTemplate()}</main>`\n  }\n\n  /**\n   * Call this on the top of the `render()` method to render demo navigation\n   * @returns HTML template for demo header\n   */\n  headerTemplate(): TemplateResult {\n    const { componentName } = this\n    return html` <header>${componentName ? html`<h1 class=\"api-title\">${componentName}</h1>` : ''}</header>`\n  }\n\n  navigationTemplate(): TemplateResult {\n    return html``\n  }\n\n  /**\n   * Abstract method. When not overriding `render()` method you can use\n   * this function to render content inside the standard API components layout.\n   *\n   * ```\n   * contentTemplate() {\n   *  return html`<p>Demo content</p>`;\n   * }\n   * ```\n   */\n  abstract contentTemplate(): TemplateResult\n\n  handleAuthenticate(): void {\n    // ...\n  }\n\n  authenticateTemplate(): TemplateResult {\n    return html`\n      <p>Store authorization required.</p>\n      <ui-button color=\"filled\" @click=\"${this.handleAuthenticate}\">Authenticate</ui-button>\n    `\n  }\n}\n"]}

package/build/src/demo/DemoStyles.d.ts

@@ -1,3 +0,0 @@
-declare const _default: import("lit").CSSResult;
-export default _default;
-//# sourceMappingURL=DemoStyles.d.ts.map

package/build/src/demo/DemoStyles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DemoStyles.d.ts","sourceRoot":"","sources":["../../../src/demo/DemoStyles.ts"],"names":[],"mappings":";AAEA,wBAyDC"}

package/build/src/demo/DemoStyles.js

@@ -1,60 +0,0 @@
-import { css } from 'lit';
-export default css `
-  :root {
-    --dot-size: 1px;
-    --dot-space: 7px;
-  }
-
-  html,
-  body {
-    margin: 0;
-    font-family: 'Roboto', 'Noto', sans-serif;
-    background-color: var(--md-sys-color-surface);
-    color: var(--md-sys-color-on-surface);
-    background-image: radial-gradient(var(--md-sys-color-inverse-on-surface) 1px, transparent 0);
-    background-size: var(--dot-space) var(--dot-space);
-  }
-
-  .demo {
-    margin: 0;
-    padding: 0;
-    min-height: 100vh;
-  }
-
-  header {
-    background-color: var(--md-sys-color-surface-variant);
-    color: var(--md-sys-color-on-surface-variant);
-    display: flex;
-    align-items: center;
-
-    max-width: 1440px;
-    margin: 20px 40px;
-    padding: 0 24px;
-    border-radius: 40px;
-
-    font-family: var(--md-sys-typescale-title-large-font);
-    font-weight: var(--md-sys-typescale-title-large-weight);
-    font-size: var(--md-sys-typescale-title-large-size);
-    letter-spacing: var(--md-sys-typescale-title-large-tracking);
-    line-height: var(--md-sys-typescale-title-large-height);
-  }
-
-  #app {
-    height: 100%;
-  }
-
-  main {
-    /* max-width: 900px;
-  margin: 40px auto; */
-    border-radius: 40px;
-    padding: 24px;
-
-    /* background-color: var(--md-sys-color-primary-container);
-  color: var(--md-sys-color-on-primary-container); */
-  }
-
-  .demo-section {
-    margin: 60px 0;
-  }
-`;
-//# sourceMappingURL=DemoStyles.js.map

package/build/src/demo/DemoStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DemoStyles.js","sourceRoot":"","sources":["../../../src/demo/DemoStyles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyDjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :root {\n    --dot-size: 1px;\n    --dot-space: 7px;\n  }\n\n  html,\n  body {\n    margin: 0;\n    font-family: 'Roboto', 'Noto', sans-serif;\n    background-color: var(--md-sys-color-surface);\n    color: var(--md-sys-color-on-surface);\n    background-image: radial-gradient(var(--md-sys-color-inverse-on-surface) 1px, transparent 0);\n    background-size: var(--dot-space) var(--dot-space);\n  }\n\n  .demo {\n    margin: 0;\n    padding: 0;\n    min-height: 100vh;\n  }\n\n  header {\n    background-color: var(--md-sys-color-surface-variant);\n    color: var(--md-sys-color-on-surface-variant);\n    display: flex;\n    align-items: center;\n\n    max-width: 1440px;\n    margin: 20px 40px;\n    padding: 0 24px;\n    border-radius: 40px;\n\n    font-family: var(--md-sys-typescale-title-large-font);\n    font-weight: var(--md-sys-typescale-title-large-weight);\n    font-size: var(--md-sys-typescale-title-large-size);\n    letter-spacing: var(--md-sys-typescale-title-large-tracking);\n    line-height: var(--md-sys-typescale-title-large-height);\n  }\n\n  #app {\n    height: 100%;\n  }\n\n  main {\n    /* max-width: 900px;\n  margin: 40px auto; */\n    border-radius: 40px;\n    padding: 24px;\n\n    /* background-color: var(--md-sys-color-primary-container);\n  color: var(--md-sys-color-on-primary-container); */\n  }\n\n  .demo-section {\n    margin: 60px 0;\n  }\n`\n"]}

package/build/test/elements/navigation/Navigation.test.d.ts

@@ -1,3 +0,0 @@
-import '../../../src/elements/navigation/ui-navigation.js';
-import '../../../src/elements/navigation/ui-navigation-item.js';
-//# sourceMappingURL=Navigation.test.d.ts.map

package/build/test/elements/navigation/Navigation.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Navigation.test.d.ts","sourceRoot":"","sources":["../../../../test/elements/navigation/Navigation.test.ts"],"names":[],"mappings":"AAEA,OAAO,mDAAmD,CAAA;AAC1D,OAAO,wDAAwD,CAAA"}

package/build/test/elements/navigation/Navigation.test.js

@@ -1,113 +0,0 @@
-import { html, fixture, assert, oneEvent, aTimeout } from '@open-wc/testing';
-import '../../../src/elements/navigation/ui-navigation.js';
-import '../../../src/elements/navigation/ui-navigation-item.js';
-describe('Navigation', () => {
-    it('renders with slot content', async () => {
-        const el = await fixture(html `
-      <ui-navigation aria-label="Main navigation">
-        <ui-navigation-item selected aria-current="page">Home</ui-navigation-item>
-        <ui-navigation-item>Search</ui-navigation-item>
-        <ui-navigation-item>Files</ui-navigation-item>
-      </ui-navigation>
-    `);
-        const nav = el.shadowRoot.querySelector('nav');
-        assert.ok(nav, 'nav element is rendered');
-        assert.equal(nav?.getAttribute('aria-label'), 'Main navigation');
-        const items = el._items;
-        assert.equal(items.length, 3);
-        assert.isTrue(items[0].selected);
-        assert.equal(items[0].getAttribute('aria-current'), 'page');
-    });
-    it('sets correct tabindex for items', async () => {
-        const el = await fixture(html `
-      <ui-navigation>
-        <ui-navigation-item selected>Home</ui-navigation-item>
-        <ui-navigation-item>Search</ui-navigation-item>
-      </ui-navigation>
-    `);
-        const items = el._items;
-        assert.equal(items[0].getAttribute('tabindex'), '0');
-        assert.equal(items[1].getAttribute('tabindex'), '-1');
-    });
-    it('selects item on click and fires select event', async () => {
-        const el = await fixture(html `
-      <ui-navigation>
-        <ui-navigation-item>Home</ui-navigation-item>
-        <ui-navigation-item>Search</ui-navigation-item>
-      </ui-navigation>
-    `);
-        const items = el._items;
-        setTimeout(() => items[1].click());
-        const ev = await oneEvent(el, 'select');
-        assert.equal(ev.detail.item, items[1]);
-        assert.isTrue(items[1].selected);
-        assert.equal(items[1].getAttribute('tabindex'), '0');
-        assert.isFalse(items[0].selected);
-        assert.equal(items[0].getAttribute('tabindex'), '-1');
-    });
-    it('handles keyboard navigation (vertical)', async () => {
-        const el = await fixture(html `
-      <ui-navigation>
-        <ui-navigation-item>Home</ui-navigation-item>
-        <ui-navigation-item>Search</ui-navigation-item>
-        <ui-navigation-item>Files</ui-navigation-item>
-      </ui-navigation>
-    `);
-        const items = el._items;
-        items[0].focus();
-        // ArrowDown moves to next
-        items[0].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown', bubbles: true }));
-        await aTimeout(0);
-        assert.dom.equal(document.activeElement, items[1]);
-        // ArrowUp wraps to last
-        items[1].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowUp', bubbles: true }));
-        await aTimeout(0);
-        assert.dom.equal(document.activeElement, items[0]);
-    });
-    it('handles keyboard navigation (horizontal)', async () => {
-        const el = await fixture(html `
-      <ui-navigation orientation="horizontal">
-        <ui-navigation-item>Home</ui-navigation-item>
-        <ui-navigation-item>Search</ui-navigation-item>
-      </ui-navigation>
-    `);
-        const items = el._items;
-        items[0].focus();
-        items[0].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight', bubbles: true }));
-        await aTimeout(0);
-        assert.dom.equal(document.activeElement, items[1]);
-        items[1].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft', bubbles: true }));
-        await aTimeout(0);
-        assert.dom.equal(document.activeElement, items[0]);
-    });
-    it('skips disabled items in navigation', async () => {
-        const el = await fixture(html `
-      <ui-navigation>
-        <ui-navigation-item>Home</ui-navigation-item>
-        <ui-navigation-item disabled>Search</ui-navigation-item>
-        <ui-navigation-item>Files</ui-navigation-item>
-      </ui-navigation>
-    `);
-        const items = el._items;
-        items[0].focus();
-        items[0].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown', bubbles: true }));
-        await aTimeout(0);
-        // Should skip disabled and go to Files
-        assert.dom.equal(document.activeElement, items[2]);
-    });
-    it('sets aria-current on selected item if current is set', async () => {
-        const el = await fixture(html `
-      <ui-navigation current="page">
-        <ui-navigation-item>Home</ui-navigation-item>
-        <ui-navigation-item>Search</ui-navigation-item>
-      </ui-navigation>
-    `);
-        const items = el._items;
-        // Simulate user selection by clicking the item (public API)
-        items[1].click();
-        await aTimeout(0);
-        assert.equal(items[1].getAttribute('aria-current'), 'page');
-        assert.isFalse(items[0].hasAttribute('aria-current'));
-    });
-});
-//# sourceMappingURL=Navigation.test.js.map

package/build/test/elements/navigation/Navigation.test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Navigation.test.js","sourceRoot":"","sources":["../../../../test/elements/navigation/Navigation.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, fixture, assert, oneEvent, aTimeout } from '@open-wc/testing'\nimport type Navigation from '../../../src/elements/navigation/internals/Navigation.js'\nimport '../../../src/elements/navigation/ui-navigation.js'\nimport '../../../src/elements/navigation/ui-navigation-item.js'\n\ndescribe('Navigation', () => {\n  it('renders with slot content', async () => {\n    const el = await fixture<Navigation>(html`\n      <ui-navigation aria-label=\"Main navigation\">\n        <ui-navigation-item selected aria-current=\"page\">Home</ui-navigation-item>\n        <ui-navigation-item>Search</ui-navigation-item>\n        <ui-navigation-item>Files</ui-navigation-item>\n      </ui-navigation>\n    `)\n    const nav = el.shadowRoot!.querySelector('nav')\n    assert.ok(nav, 'nav element is rendered')\n    assert.equal(nav?.getAttribute('aria-label'), 'Main navigation')\n    const items = el._items\n    assert.equal(items.length, 3)\n    assert.isTrue(items[0].selected)\n    assert.equal(items[0].getAttribute('aria-current'), 'page')\n  })\n\n  it('sets correct tabindex for items', async () => {\n    const el = await fixture<Navigation>(html`\n      <ui-navigation>\n        <ui-navigation-item selected>Home</ui-navigation-item>\n        <ui-navigation-item>Search</ui-navigation-item>\n      </ui-navigation>\n    `)\n    const items = el._items\n    assert.equal(items[0].getAttribute('tabindex'), '0')\n    assert.equal(items[1].getAttribute('tabindex'), '-1')\n  })\n\n  it('selects item on click and fires select event', async () => {\n    const el = await fixture<Navigation>(html`\n      <ui-navigation>\n        <ui-navigation-item>Home</ui-navigation-item>\n        <ui-navigation-item>Search</ui-navigation-item>\n      </ui-navigation>\n    `)\n    const items = el._items\n    setTimeout(() => items[1].click())\n    const ev = await oneEvent(el, 'select')\n    assert.equal(ev.detail.item, items[1])\n    assert.isTrue(items[1].selected)\n    assert.equal(items[1].getAttribute('tabindex'), '0')\n    assert.isFalse(items[0].selected)\n    assert.equal(items[0].getAttribute('tabindex'), '-1')\n  })\n\n  it('handles keyboard navigation (vertical)', async () => {\n    const el = await fixture<Navigation>(html`\n      <ui-navigation>\n        <ui-navigation-item>Home</ui-navigation-item>\n        <ui-navigation-item>Search</ui-navigation-item>\n        <ui-navigation-item>Files</ui-navigation-item>\n      </ui-navigation>\n    `)\n    const items = el._items\n    items[0].focus()\n    // ArrowDown moves to next\n    items[0].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown', bubbles: true }))\n    await aTimeout(0)\n    assert.dom.equal(document.activeElement, items[1])\n    // ArrowUp wraps to last\n    items[1].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowUp', bubbles: true }))\n    await aTimeout(0)\n    assert.dom.equal(document.activeElement, items[0])\n  })\n\n  it('handles keyboard navigation (horizontal)', async () => {\n    const el = await fixture<Navigation>(html`\n      <ui-navigation orientation=\"horizontal\">\n        <ui-navigation-item>Home</ui-navigation-item>\n        <ui-navigation-item>Search</ui-navigation-item>\n      </ui-navigation>\n    `)\n    const items = el._items\n    items[0].focus()\n    items[0].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowRight', bubbles: true }))\n    await aTimeout(0)\n    assert.dom.equal(document.activeElement, items[1])\n    items[1].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowLeft', bubbles: true }))\n    await aTimeout(0)\n    assert.dom.equal(document.activeElement, items[0])\n  })\n\n  it('skips disabled items in navigation', async () => {\n    const el = await fixture<Navigation>(html`\n      <ui-navigation>\n        <ui-navigation-item>Home</ui-navigation-item>\n        <ui-navigation-item disabled>Search</ui-navigation-item>\n        <ui-navigation-item>Files</ui-navigation-item>\n      </ui-navigation>\n    `)\n    const items = el._items\n    items[0].focus()\n    items[0].dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown', bubbles: true }))\n    await aTimeout(0)\n    // Should skip disabled and go to Files\n    assert.dom.equal(document.activeElement, items[2])\n  })\n\n  it('sets aria-current on selected item if current is set', async () => {\n    const el = await fixture<Navigation>(html`\n      <ui-navigation current=\"page\">\n        <ui-navigation-item>Home</ui-navigation-item>\n        <ui-navigation-item>Search</ui-navigation-item>\n      </ui-navigation>\n    `)\n    const items = el._items\n    // Simulate user selection by clicking the item (public API)\n    items[1].click()\n    await aTimeout(0)\n    assert.equal(items[1].getAttribute('aria-current'), 'page')\n    assert.isFalse(items[0].hasAttribute('aria-current'))\n  })\n})\n"]}

package/commitlint.config.cjs

@@ -1,2 +0,0 @@
-// eslint-disable-next-line no-undef
-module.exports = { extends: ['@commitlint/config-conventional'] }

package/demo/elements/authorization/AuthPlugin.js

@@ -1,57 +0,0 @@
-import { OAuth2Server } from 'oauth2-mock-server'
-import proxy from 'koa-proxies'
-// Using the core library here slows down loading time signoficantly
-import getPort, { portNumbers } from 'get-port'
-import { AuthProxy } from './AuthProxy.js'
-
-/** @typedef {import('@web/dev-server-core').Plugin} Plugin */
-/** @typedef {import('@web/dev-server-core').ServerStartParams} ServerStartParams */
-
-const oauth2server = new OAuth2Server()
-const authProxy = new AuthProxy()
-let oauth2env
-
-export default /** @type Plugin */ ({
-  name: 'auth',
-
-  /**
-   * @param {ServerStartParams} args
-   */
-  async serverStart(args) {
-    const port = await getPort({ port: portNumbers(8000, 8100) })
-    const proxyPort = await getPort({ port: portNumbers(8000, 8100) })
-    args.app.use(
-      proxy('/auth', {
-        target: `http://localhost:${port}`,
-        // logs: true,
-        rewrite: (path) => path.replace('/auth', ''),
-      })
-    )
-    const jwtKey = await oauth2server.issuer.keys.generate('RS256')
-    await oauth2server.start(port, 'localhost')
-    await authProxy.start(proxyPort)
-
-    oauth2env = {
-      port,
-      root: '/auth',
-      jwtKey,
-      issuer: oauth2server.issuer.url,
-      tokenProxy: `http://localhost:${proxyPort}/proxy?u=`,
-    }
-  },
-
-  async serverStop() {
-    await oauth2server.stop()
-    await authProxy.stop()
-  },
-
-  serve(context) {
-    if (context.path === '/demo/elements/authorization/env.js') {
-      const data = {
-        oauth2: oauth2env,
-      }
-      return `export default ${JSON.stringify(data)}`
-    }
-    return undefined
-  },
-})