@ni/nimble-components 17.0.7 → 17.1.0

package/dist/esm/all-components.d.ts

@@ -5,6 +5,8 @@
  */
 import './anchor';
 import './anchor-button';
+import './anchor-tab';
+import './anchor-tabs';
 import './anchored-region';
 import './breadcrumb';
 import './breadcrumb-item';

package/dist/esm/all-components.js

@@ -5,6 +5,8 @@
  */
 import './anchor';
 import './anchor-button';
+import './anchor-tab';
+import './anchor-tabs';
 import './anchored-region';
 import './breadcrumb';
 import './breadcrumb-item';

package/dist/esm/all-components.js.map

@@ -1 +1 @@
-{"version":3,"file":"all-components.js","sourceRoot":"","sources":["../../src/all-components.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,UAAU,CAAC;AAClB,OAAO,iBAAiB,CAAC;AACzB,OAAO,mBAAmB,CAAC;AAC3B,OAAO,cAAc,CAAC;AACtB,OAAO,mBAAmB,CAAC;AAC3B,OAAO,UAAU,CAAC;AAClB,OAAO,eAAe,CAAC;AACvB,OAAO,YAAY,CAAC;AACpB,OAAO,YAAY,CAAC;AACpB,OAAO,UAAU,CAAC;AAClB,OAAO,UAAU,CAAC;AAClB,OAAO,mBAAmB,CAAC;AAC3B,OAAO,eAAe,CAAC;AACvB,OAAO,QAAQ,CAAC;AAChB,OAAO,eAAe,CAAC;AACvB,OAAO,aAAa,CAAC;AACrB,OAAO,gBAAgB,CAAC;AACxB,OAAO,SAAS,CAAC;AACjB,OAAO,eAAe,CAAC;AACvB,OAAO,UAAU,CAAC;AAClB,OAAO,WAAW,CAAC;AACnB,OAAO,UAAU,CAAC;AAClB,OAAO,OAAO,CAAC;AACf,OAAO,aAAa,CAAC;AACrB,OAAO,SAAS,CAAC;AACjB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,QAAQ,CAAC;AAChB,OAAO,gBAAgB,CAAC;AACxB,OAAO,aAAa,CAAC;AACrB,OAAO,cAAc,CAAC;AACtB,OAAO,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;AACzB,OAAO,WAAW,CAAC;AACnB,OAAO,WAAW,CAAC;AACnB,OAAO,aAAa,CAAC;AACrB,OAAO,aAAa,CAAC;AACrB,OAAO,aAAa,CAAC"}
+{"version":3,"file":"all-components.js","sourceRoot":"","sources":["../../src/all-components.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,UAAU,CAAC;AAClB,OAAO,iBAAiB,CAAC;AACzB,OAAO,cAAc,CAAC;AACtB,OAAO,eAAe,CAAC;AACvB,OAAO,mBAAmB,CAAC;AAC3B,OAAO,cAAc,CAAC;AACtB,OAAO,mBAAmB,CAAC;AAC3B,OAAO,UAAU,CAAC;AAClB,OAAO,eAAe,CAAC;AACvB,OAAO,YAAY,CAAC;AACpB,OAAO,YAAY,CAAC;AACpB,OAAO,UAAU,CAAC;AAClB,OAAO,UAAU,CAAC;AAClB,OAAO,mBAAmB,CAAC;AAC3B,OAAO,eAAe,CAAC;AACvB,OAAO,QAAQ,CAAC;AAChB,OAAO,eAAe,CAAC;AACvB,OAAO,aAAa,CAAC;AACrB,OAAO,gBAAgB,CAAC;AACxB,OAAO,SAAS,CAAC;AACjB,OAAO,eAAe,CAAC;AACvB,OAAO,UAAU,CAAC;AAClB,OAAO,WAAW,CAAC;AACnB,OAAO,UAAU,CAAC;AAClB,OAAO,OAAO,CAAC;AACf,OAAO,aAAa,CAAC;AACrB,OAAO,SAAS,CAAC;AACjB,OAAO,qBAAqB,CAAC;AAC7B,OAAO,QAAQ,CAAC;AAChB,OAAO,gBAAgB,CAAC;AACxB,OAAO,aAAa,CAAC;AACrB,OAAO,cAAc,CAAC;AACtB,OAAO,kBAAkB,CAAC;AAC1B,OAAO,iBAAiB,CAAC;AACzB,OAAO,WAAW,CAAC;AACnB,OAAO,WAAW,CAAC;AACnB,OAAO,aAAa,CAAC;AACrB,OAAO,aAAa,CAAC;AACrB,OAAO,aAAa,CAAC"}

package/dist/esm/anchor-tab/index.d.ts

@@ -0,0 +1,20 @@
+import { FoundationElementDefinition, StartEndOptions } from '@microsoft/fast-foundation';
+import { AnchorBase } from '../anchor-base';
+declare global {
+    interface HTMLElementTagNameMap {
+        'nimble-anchor-tab': AnchorTab;
+    }
+}
+export declare type TabOptions = FoundationElementDefinition & StartEndOptions;
+/**
+ * A nimble-styled link tab
+ */
+export declare class AnchorTab extends AnchorBase {
+    /**
+     * When true, the control will be immutable by user interaction. See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled | disabled HTML attribute} for more information.
+     * @public
+     * @remarks
+     * HTML Attribute: disabled
+     */
+    disabled: boolean;
+}

package/dist/esm/anchor-tab/index.js

@@ -0,0 +1,31 @@
+import { __decorate } from "tslib";
+import { attr } from '@microsoft/fast-element';
+import { DesignSystem } from '@microsoft/fast-foundation';
+import { AnchorBase } from '../anchor-base';
+import { styles } from './styles';
+import { template } from './template';
+/**
+ * A nimble-styled link tab
+ */
+export class AnchorTab extends AnchorBase {
+    constructor() {
+        super(...arguments);
+        /**
+         * When true, the control will be immutable by user interaction. See {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled | disabled HTML attribute} for more information.
+         * @public
+         * @remarks
+         * HTML Attribute: disabled
+         */
+        this.disabled = false;
+    }
+}
+__decorate([
+    attr({ mode: 'boolean' })
+], AnchorTab.prototype, "disabled", void 0);
+const nimbleAnchorTab = AnchorTab.compose({
+    baseName: 'anchor-tab',
+    template,
+    styles
+});
+DesignSystem.getOrCreate().withPrefix('nimble').register(nimbleAnchorTab());
+//# sourceMappingURL=index.js.map

package/dist/esm/anchor-tab/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/anchor-tab/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EACH,YAAY,EAGf,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAUtC;;GAEG;AACH,MAAM,OAAO,SAAU,SAAQ,UAAU;IAAzC;;QACI;;;;;WAKG;QAEI,aAAQ,GAAG,KAAK,CAAC;IAC5B,CAAC;CAAA;AADG;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;2CACF;AAG5B,MAAM,eAAe,GAAG,SAAS,CAAC,OAAO,CAAC;IACtC,QAAQ,EAAE,YAAY;IACtB,QAAQ;IACR,MAAM;CACT,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,eAAe,EAAE,CAAC,CAAC"}

package/dist/esm/anchor-tab/styles.js

@@ -0,0 +1,13 @@
+import { css } from '@microsoft/fast-element';
+import { styles as tabStyles } from '../patterns/tab/styles';
+export const styles = css `
+    ${tabStyles}
+
+    a {
+        text-decoration: none;
+        color: inherit;
+        cursor: inherit;
+        outline: none;
+    }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/anchor-tab/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-tab/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAE7D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,SAAS;;;;;;;;CAQd,CAAC"}

package/dist/esm/anchor-tab/template.d.ts

@@ -0,0 +1,4 @@
+import { ViewTemplate } from '@microsoft/fast-element';
+import type { FoundationElementTemplate } from '@microsoft/fast-foundation';
+import type { AnchorTab, TabOptions } from '.';
+export declare const template: FoundationElementTemplate<ViewTemplate<AnchorTab>, TabOptions>;

package/dist/esm/anchor-tab/template.js

@@ -0,0 +1,19 @@
+import { html } from '@microsoft/fast-element';
+export const template = () => html `
+    <template slot="anchortab" role="tab" aria-disabled="${x => x.disabled}">
+        <a
+            download="${x => x.download}"
+            href=${x => (x.disabled ? null : x.href)}
+            hreflang="${x => x.hreflang}"
+            ping="${x => x.ping}"
+            referrerpolicy="${x => x.referrerpolicy}"
+            rel="${x => x.rel}"
+            target="${x => x.target}"
+            type="${x => x.type}"
+            tabindex="-1"
+        >
+            <slot></slot>
+        </a>
+    </template>
+`;
+//# sourceMappingURL=template.js.map

package/dist/esm/anchor-tab/template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/anchor-tab/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAgB,MAAM,yBAAyB,CAAC;AAI7D,MAAM,CAAC,MAAM,QAAQ,GAGjB,GAAG,EAAE,CAAC,IAAI,CAAW;2DACkC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ;;wBAElD,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ;mBACpB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;wBAC5B,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ;oBACnB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;8BACD,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc;mBAChC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG;sBACP,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM;oBACf,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI;;;;;;CAM9B,CAAC"}

package/dist/esm/anchor-tabs/index.d.ts

@@ -0,0 +1,58 @@
+import { StartEndOptions, FoundationElementDefinition, FoundationElement } from '@microsoft/fast-foundation';
+declare global {
+    interface HTMLElementTagNameMap {
+        'nimble-anchor-tabs': AnchorTabs;
+    }
+}
+export declare type TabsOptions = FoundationElementDefinition & StartEndOptions;
+/**
+ * A nimble-styled set of anchor tabs
+ */
+export declare class AnchorTabs extends FoundationElement {
+    /**
+     * The id of the active tab
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: activeid
+     */
+    activeid?: string;
+    /**
+     * @internal
+     */
+    tabs: HTMLElement[];
+    /**
+     * A reference to the active tab
+     * @public
+     */
+    activetab?: HTMLElement;
+    /**
+     * A reference to the tablist div
+     * @internal
+     */
+    tablist: HTMLElement;
+    private tabIds;
+    /**
+     * @internal
+     */
+    activeidChanged(_oldValue: string, _newValue: string): void;
+    /**
+     * @internal
+     */
+    tabsChanged(): void;
+    /**
+     * @internal
+     */
+    connectedCallback(): void;
+    private readonly isDisabledElement;
+    private readonly isFocusableElement;
+    private readonly setTabs;
+    private getTabIds;
+    private readonly handleTabClick;
+    private readonly handleTabKeyDown;
+    private focusFirstOrLast;
+    private readonly adjustForward;
+    private readonly adjustBackward;
+    private readonly focusTabByIndex;
+    private getTabAnchor;
+}

package/dist/esm/anchor-tabs/index.js

@@ -0,0 +1,214 @@
+import { __decorate } from "tslib";
+// Based on:
+// https://github.com/microsoft/fast/blob/6bce27d0b2d654650b8751bf055f5e3b5a4f9250/packages/web-components/fast-foundation/src/tabs/tabs.ts
+// The code is heavily modified such that a diff against the original is useless.
+// Primary differences are:
+// - Reimplemented active tab indicator and removed attribute to disable it
+// - Separated tab focus and tab selection, i.e. can focus a different tab than the selected one
+// - Removed everything related to tab panels
+// - Removed support for vertical tab orientation
+// - Removed change event
+// - Conforms to our linter rules
+import { attr, observable } from '@microsoft/fast-element';
+import { keyArrowLeft, keyArrowRight, keyEnd, keyEnter, keyHome, keySpace, uniqueId } from '@microsoft/fast-web-utilities';
+import { DesignSystem, StartEnd, applyMixins, FoundationElement } from '@microsoft/fast-foundation';
+import { styles } from './styles';
+import { template } from './template';
+/**
+ * A nimble-styled set of anchor tabs
+ */
+export class AnchorTabs extends FoundationElement {
+    constructor() {
+        super(...arguments);
+        this.tabIds = [];
+        this.isDisabledElement = (el) => {
+            return el.getAttribute('aria-disabled') === 'true';
+        };
+        this.isFocusableElement = (el) => {
+            return !this.isDisabledElement(el);
+        };
+        this.setTabs = () => {
+            const gridHorizontalProperty = 'gridColumn';
+            const gridVerticalProperty = 'gridRow';
+            this.activetab = undefined;
+            let firstFocusableTab;
+            this.tabs.forEach((tab, index) => {
+                const tabId = this.tabIds[index];
+                const isActiveTab = this.activeid === tabId;
+                if (!firstFocusableTab && this.isFocusableElement(tab)) {
+                    firstFocusableTab = tab;
+                }
+                const isTabStop = this.activeid === tabId && this.isFocusableElement(tab);
+                tab.setAttribute('id', tabId);
+                tab.setAttribute('aria-selected', isActiveTab ? 'true' : 'false');
+                tab.removeEventListener('click', this.handleTabClick);
+                tab.addEventListener('click', this.handleTabClick);
+                tab.removeEventListener('keydown', this.handleTabKeyDown);
+                tab.addEventListener('keydown', this.handleTabKeyDown);
+                tab.setAttribute('tabindex', isTabStop ? '0' : '-1');
+                if (isActiveTab) {
+                    this.activetab = tab;
+                }
+                tab.style[gridVerticalProperty] = '';
+                tab.style[gridHorizontalProperty] = `${index + 1}`;
+            });
+            if (firstFocusableTab
+                && (!this.activetab || !this.isFocusableElement(this.activetab))) {
+                firstFocusableTab.setAttribute('tabindex', '0');
+            }
+        };
+        this.handleTabClick = (event) => {
+            const selectedTab = event.currentTarget;
+            if (selectedTab.nodeType === 1
+                && this.isFocusableElement(selectedTab)) {
+                this.tabs.forEach((tab) => {
+                    tab.setAttribute('tabindex', tab === selectedTab ? '0' : '-1');
+                });
+            }
+        };
+        this.handleTabKeyDown = (event) => {
+            let anchor;
+            switch (event.key) {
+                case keyArrowLeft:
+                    event.preventDefault();
+                    this.adjustBackward();
+                    break;
+                case keyArrowRight:
+                    event.preventDefault();
+                    this.adjustForward();
+                    break;
+                case keyHome:
+                    event.preventDefault();
+                    this.focusFirstOrLast(false);
+                    break;
+                case keyEnd:
+                    event.preventDefault();
+                    this.focusFirstOrLast(true);
+                    break;
+                case keySpace:
+                case keyEnter:
+                    event.preventDefault();
+                    this.getTabAnchor(event.target).click();
+                    break;
+                case 'ContextMenu':
+                    event.preventDefault();
+                    anchor = this.getTabAnchor(event.target);
+                    anchor.focus();
+                    anchor.dispatchEvent(new KeyboardEvent('keydown', {
+                        key: event.key,
+                        bubbles: false
+                    }));
+                    break;
+                default:
+                // do nothing
+            }
+        };
+        this.adjustForward = () => {
+            const group = this.tabs;
+            let index = 0;
+            const focusedTab = group.find(x => x === document.activeElement);
+            index = focusedTab ? group.indexOf(focusedTab) + 1 : 1;
+            if (index === group.length) {
+                index = 0;
+            }
+            while (index < group.length && group.length > 1) {
+                if (this.isFocusableElement(group[index])) {
+                    this.focusTabByIndex(group, index);
+                    break;
+                }
+                else if (focusedTab && index === group.indexOf(focusedTab)) {
+                    break;
+                }
+                else if (index + 1 >= group.length) {
+                    index = 0;
+                }
+                else {
+                    index += 1;
+                }
+            }
+        };
+        this.adjustBackward = () => {
+            const group = this.tabs;
+            let index = 0;
+            const focusedTab = group.find(x => x === document.activeElement);
+            index = focusedTab ? group.indexOf(focusedTab) - 1 : 0;
+            index = index < 0 ? group.length - 1 : index;
+            while (index >= 0 && group.length > 1) {
+                if (this.isFocusableElement(group[index])) {
+                    this.focusTabByIndex(group, index);
+                    break;
+                }
+                else if (index - 1 < 0) {
+                    index = group.length - 1;
+                }
+                else {
+                    index -= 1;
+                }
+            }
+        };
+        this.focusTabByIndex = (group, index) => {
+            const focusedTab = group[index];
+            focusedTab.focus();
+            this.tabs.forEach((tab) => {
+                tab.setAttribute('tabindex', tab === focusedTab ? '0' : '-1');
+            });
+        };
+    }
+    /**
+     * @internal
+     */
+    activeidChanged(_oldValue, _newValue) {
+        if (this.$fastController.isConnected) {
+            this.setTabs();
+        }
+    }
+    /**
+     * @internal
+     */
+    tabsChanged() {
+        if (this.$fastController.isConnected) {
+            this.tabIds = this.getTabIds();
+            this.setTabs();
+        }
+    }
+    /**
+     * @internal
+     */
+    connectedCallback() {
+        super.connectedCallback();
+        this.tabIds = this.getTabIds();
+    }
+    getTabIds() {
+        return this.tabs.map((tab) => {
+            return tab.getAttribute('id') ?? `tab-${uniqueId()}`;
+        });
+    }
+    focusFirstOrLast(focusLast) {
+        const focusableTabs = this.tabs.filter(t => !this.isDisabledElement(t));
+        const focusableIndex = focusLast ? focusableTabs.length - 1 : 0;
+        const index = this.tabs.indexOf(focusableTabs[focusableIndex]);
+        if (index > -1) {
+            this.focusTabByIndex(this.tabs, index);
+        }
+    }
+    getTabAnchor(tab) {
+        return tab.shadowRoot.querySelector('a');
+    }
+}
+__decorate([
+    attr
+], AnchorTabs.prototype, "activeid", void 0);
+__decorate([
+    observable
+], AnchorTabs.prototype, "tabs", void 0);
+applyMixins(AnchorTabs, StartEnd);
+const nimbleAnchorTabs = AnchorTabs.compose({
+    baseName: 'anchor-tabs',
+    template,
+    styles,
+    shadowOptions: {
+        delegatesFocus: false
+    }
+});
+DesignSystem.getOrCreate().withPrefix('nimble').register(nimbleAnchorTabs());
+//# sourceMappingURL=index.js.map

package/dist/esm/anchor-tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/anchor-tabs/index.ts"],"names":[],"mappings":"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"}

package/dist/esm/anchor-tabs/styles.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("@microsoft/fast-element").ElementStyles;

package/dist/esm/anchor-tabs/styles.js

@@ -0,0 +1,20 @@
+import { css } from '@microsoft/fast-element';
+import { display } from '@microsoft/fast-foundation';
+export const styles = css `
+    ${display('grid')}
+
+    :host {
+        box-sizing: border-box;
+        grid-template-columns: auto auto 1fr;
+        grid-template-rows: auto 1fr;
+    }
+
+    .tablist {
+        display: grid;
+        grid-template-rows: auto auto;
+        grid-template-columns: auto;
+        width: max-content;
+        align-self: end;
+    }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/esm/anchor-tabs/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/anchor-tabs/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,MAAM,CAAC;;;;;;;;;;;;;;;CAepB,CAAC"}

package/dist/esm/anchor-tabs/template.d.ts

@@ -0,0 +1,4 @@
+import { ViewTemplate } from '@microsoft/fast-element';
+import { FoundationElementTemplate } from '@microsoft/fast-foundation';
+import type { AnchorTabs, TabsOptions } from '.';
+export declare const template: FoundationElementTemplate<ViewTemplate<AnchorTabs>, TabsOptions>;

package/dist/esm/anchor-tabs/template.js

@@ -0,0 +1,10 @@
+import { html, ref, slotted } from '@microsoft/fast-element';
+import { endSlotTemplate, startSlotTemplate } from '@microsoft/fast-foundation';
+export const template = (context, definition) => html `
+    ${startSlotTemplate(context, definition)}
+    <div ${ref('tablist')} class="tablist" part="tablist" role="tablist">
+        <slot name="anchortab" ${slotted('tabs')}></slot>
+    </div>
+    ${endSlotTemplate(context, definition)}
+`;
+//# sourceMappingURL=template.js.map

package/dist/esm/anchor-tabs/template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../src/anchor-tabs/template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAAgB,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EACH,eAAe,EAEf,iBAAiB,EACpB,MAAM,4BAA4B,CAAC;AAGpC,MAAM,CAAC,MAAM,QAAQ,GAGjB,CAAC,OAAO,EAAE,UAAU,EAAE,EAAE,CAAC,IAAI,CAAY;MACvC,iBAAiB,CAAC,OAAO,EAAE,UAAU,CAAC;WACjC,GAAG,CAAC,SAAS,CAAC;iCACQ,OAAO,CAAC,MAAM,CAAC;;MAE1C,eAAe,CAAC,OAAO,EAAE,UAAU,CAAC;CACzC,CAAC"}

package/dist/esm/patterns/tab/styles.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("@microsoft/fast-element").ElementStyles;

package/dist/esm/{tab → patterns/tab}/styles.js

@@ -1,7 +1,7 @@
 import { css } from '@microsoft/fast-element';
 import { display } from '@microsoft/fast-foundation';
-import { bodyFont, borderHoverColor, borderWidth, bodyFontColor, bodyDisabledFontColor, controlHeight, fillHoverColor, fillHoverSelectedColor, standardPadding, smallDelay } from '../theme-provider/design-tokens';
-import { focusVisible } from '../utilities/style/focus';
+import { bodyFont, borderHoverColor, borderWidth, bodyFontColor, bodyDisabledFontColor, controlHeight, fillHoverColor, fillHoverSelectedColor, standardPadding, smallDelay } from '../../theme-provider/design-tokens';
+import { focusVisible } from '../../utilities/style/focus';
 export const styles = css `
     ${display('inline-flex')}
 
@@ -24,12 +24,12 @@ export const styles = css `
         background-color: ${fillHoverColor};
     }
 
-    :host(:focus) {
-        outline: none;
+    :host(:hover[aria-selected='true']) {
+        background-color: ${fillHoverSelectedColor};
     }
 
-    :host(:focus:hover) {
-        background-color: ${fillHoverSelectedColor};
+    :host(:focus) {
+        outline: none;
     }
 
     :host(${focusVisible}) {
@@ -46,7 +46,7 @@ export const styles = css `
         background: none;
     }
 
-    slot {
+    slot:not([name]) {
         display: block;
         padding: calc(${standardPadding} / 2) ${standardPadding}
             calc(${standardPadding} / 2 - ${borderWidth});
@@ -93,8 +93,18 @@ export const styles = css `
         }
     }
 
+    :host(${focusVisible})::after {
+        width: 100%;
+        border-bottom-width: var(--ni-private-focus-indicator-width);
+    }
+
     :host([aria-selected='true'])::after {
         width: 100%;
+        border-bottom-width: var(--ni-private-active-indicator-width);
+    }
+
+    :host([aria-selected='true'][disabled])::after {
+        border-bottom-color: rgba(${borderHoverColor}, 0.3);
     }
 `;
 //# sourceMappingURL=styles.js.map

package/dist/esm/patterns/tab/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/patterns/tab/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,qBAAqB,EACrB,aAAa,EACb,cAAc,EACd,sBAAsB,EACtB,eAAe,EACf,UAAU,EACb,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAE3D,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;;;gBAKZ,QAAQ;kBACN,aAAa;iBACd,aAAa;;;;;;;;;;;4BAWF,cAAc;;;;4BAId,sBAAsB;;;;;;;YAOtC,YAAY;;;;;;;;;;iBAUP,qBAAqB;;;;;;wBAMd,eAAe,SAAS,eAAe;mBAC5C,eAAe,UAAU,WAAW;;;;;;;;;;;;yBAY9B,gBAAgB;;4BAEb,UAAU;;;;;;;;;YAS1B,YAAY;;;;;;;;;;yBAUC,gBAAgB;;4BAEb,UAAU;;;;;;;;;YAS1B,YAAY;;;;;;;;;;;oCAWY,gBAAgB;;CAEnD,CAAC"}

package/dist/esm/tab/index.js

@@ -1,5 +1,5 @@
 import { DesignSystem, Tab as FoundationTab, tabTemplate as template } from '@microsoft/fast-foundation';
-import { styles } from './styles';
+import { styles } from '../patterns/tab/styles';
 /**
  * A nimble-styled HTML tab
  */

package/dist/esm/tab/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tab/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,YAAY,EACZ,GAAG,IAAI,aAAa,EACpB,WAAW,IAAI,QAAQ,EAC1B,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAQlC;;GAEG;AACH,MAAM,OAAO,GAAI,SAAQ,aAAa;CAAG;AAEzC,MAAM,SAAS,GAAG,GAAG,CAAC,OAAO,CAAC;IAC1B,QAAQ,EAAE,KAAK;IACf,SAAS,EAAE,aAAa;IACxB,QAAQ;IACR,MAAM;CACT,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,SAAS,EAAE,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tab/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACH,YAAY,EACZ,GAAG,IAAI,aAAa,EACpB,WAAW,IAAI,QAAQ,EAC1B,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAQhD;;GAEG;AACH,MAAM,OAAO,GAAI,SAAQ,aAAa;CAAG;AAEzC,MAAM,SAAS,GAAG,GAAG,CAAC,OAAO,CAAC;IAC1B,QAAQ,EAAE,KAAK;IACf,SAAS,EAAE,aAAa;IACxB,QAAQ;IACR,MAAM;CACT,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,SAAS,EAAE,CAAC,CAAC"}

package/dist/esm/wafer-map/types.d.ts

@@ -21,6 +21,7 @@ export interface WaferMapDie {
     value: string;
     x: number;
     y: number;
+    metadata?: unknown;
 }
 export interface WaferMapColorScale {
     colors: string[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ni/nimble-components",
-  "version": "17.0.7",
+  "version": "17.1.0",
   "description": "Styled web components for the NI Nimble Design System",
   "scripts": {
     "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook",

package/dist/esm/tab/styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/tab/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EACH,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,qBAAqB,EACrB,aAAa,EACb,cAAc,EACd,sBAAsB,EACtB,eAAe,EACf,UAAU,EACb,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAExD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,aAAa,CAAC;;;;;gBAKZ,QAAQ;kBACN,aAAa;iBACd,aAAa;;;;;;;;;;;4BAWF,cAAc;;;;;;;;4BAQd,sBAAsB;;;YAGtC,YAAY;;;;;;;;;;iBAUP,qBAAqB;;;;;;wBAMd,eAAe,SAAS,eAAe;mBAC5C,eAAe,UAAU,WAAW;;;;;;;;;;;;yBAY9B,gBAAgB;;4BAEb,UAAU;;;;;;;;;YAS1B,YAAY;;;;;;;;;;yBAUC,gBAAgB;;4BAEb,UAAU;;;;;;;;;;;;CAYrC,CAAC"}