@genesislcap/foundation-ui 15.8.1-PTC-0.1 → 15.8.2

package/dist/dts/icon/icon.d.ts

@@ -20,18 +20,7 @@ export declare class Icon extends FoundationElement {
     uuid: UUID;
     tooltipId: string;
     tooltip: string;
-    tooltipChanged(): void;
     isError: boolean;
-    /**
-     * The tooltip element is portaled to `document.body` rather than rendered inside this
-     * component. In place, it inherits the stacking context of whatever hosts the icon — in
-     * virtualized lists (e.g. AG Grid rows are absolutely-positioned, transformed siblings)
-     * the next sibling paints over the tooltip no matter its z-index. The host is positioned
-     * from the anchor's `getBoundingClientRect()` (see {@link Icon.positionTooltipElement});
-     * the tooltip's internal anchored region cannot be relied on for placement because
-     * `tagFor(AnchoredRegion)` does not resolve for the subclassed genesis components.
-     */
-    private tooltipElement;
     name: IconName;
     nameChanged(oldValue: string, newValue: string): void;
     size: FaSize;
@@ -42,9 +31,6 @@ export declare class Icon extends FoundationElement {
     disconnectedCallback(): void;
     getDefaultTooltipConfig(): void;
     loadIcon(): void;
-    private ensureTooltipElement;
-    private positionTooltipElement;
-    private removeTooltipElement;
 }
 /**
  * The Foundation Icon

package/dist/dts/icon/icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/icon/icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,QAAQ,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAClG,OAAO,EAAE,IAAI,EAAE,MAAM,+BAA+B,CAAC;AAErD,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAU/D,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC;AAG/B,eAAO,MAAM,2BAA2B,EAAE,cAGzC,CAAC;AAEF,eAAO,MAAM,iBAAiB,IAAK,CAAC;AAEpC,oBAAY,iBAAiB;IAC3B,KAAK,QAAQ;IACb,OAAO,QAAQ;IACf,KAAK,QAAQ;CACd;AAED,eAAO,MAAM,kBAAkB,EAAG,IAAa,CAAC;AAEhD,eAAO,MAAM,YAAY,sIAmBf,CAAC;AAEX,MAAM,MAAM,MAAM,GAAG,CAAC,OAAO,YAAY,CAAC,CAAC,MAAM,CAAC,CAAC;AAcnD;;GAEG;AACH,qBAAa,IAAK,SAAQ,iBAAiB;IAC7B,QAAQ,EAAE,WAAW,CAAC;IAC5B,IAAI,EAAE,IAAI,CAAC;IACkB,SAAS,EAAE,MAAM,CAAC;IAC/C,OAAO,EAAE,MAAM,CAAC;IACtB,cAAc;IAOiC,OAAO,EAAE,OAAO,CAAS;IAExE;;;;;;;;OAQG;IACH,OAAO,CAAC,cAAc,CAAwB;IAExC,IAAI,EAAE,QAAQ,CAAC;IACrB,WAAW,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM;IAIxC,IAAI,EAAE,MAAM,CAAQ;IAC1B,WAAW,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM;IAIxC,OAAO,EAAE,SAAS,CAAW;IACnC,cAAc,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM;IAIjD,iBAAiB;IAMjB,oBAAoB;IAMpB,uBAAuB;IAQhB,QAAQ;IA0Bf,OAAO,CAAC,oBAAoB;IA4B5B,OAAO,CAAC,sBAAsB,CAO5B;IAEF,OAAO,CAAC,oBAAoB;CAY7B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,oTAMzB,CAAC"}
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/icon/icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,QAAQ,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAClG,OAAO,EAAE,IAAI,EAAE,MAAM,+BAA+B,CAAC;AAErD,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAI/D,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC;AAG/B,eAAO,MAAM,2BAA2B,EAAE,cAGzC,CAAC;AAEF,eAAO,MAAM,iBAAiB,IAAK,CAAC;AAEpC,oBAAY,iBAAiB;IAC3B,KAAK,QAAQ;IACb,OAAO,QAAQ;IACf,KAAK,QAAQ;CACd;AAED,eAAO,MAAM,kBAAkB,EAAG,IAAa,CAAC;AAEhD,eAAO,MAAM,YAAY,sIAmBf,CAAC;AAEX,MAAM,MAAM,MAAM,GAAG,CAAC,OAAO,YAAY,CAAC,CAAC,MAAM,CAAC,CAAC;AAEnD;;GAEG;AACH,qBAAa,IAAK,SAAQ,iBAAiB;IAC7B,QAAQ,EAAE,WAAW,CAAC;IAC5B,IAAI,EAAE,IAAI,CAAC;IACkB,SAAS,EAAE,MAAM,CAAC;IAC/C,OAAO,EAAE,MAAM,CAAC;IACyB,OAAO,EAAE,OAAO,CAAS;IAElE,IAAI,EAAE,QAAQ,CAAC;IACrB,WAAW,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM;IAIxC,IAAI,EAAE,MAAM,CAAQ;IAC1B,WAAW,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM;IAIxC,OAAO,EAAE,SAAS,CAAW;IACnC,cAAc,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM;IAIjD,iBAAiB;IAMjB,oBAAoB;IAKpB,uBAAuB;IAQhB,QAAQ;CAwBhB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,oTAMzB,CAAC"}

package/dist/dts/icon/icon.styles.d.ts

@@ -1,19 +1,4 @@
 import type { ElementStyles } from '@microsoft/fast-element';
 import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
 export declare const foundationIconStyles: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ElementStyles;
-/**
- * Class name marking icon tooltips portaled to `document.body`.
- *
- * @public
- */
-export declare const iconTooltipPortalClassName = "foundation-icon-tooltip";
-/**
- * Document-level styles for icon tooltips. The icon portals its tooltip element to
- * `document.body` (so it cannot be painted over by absolutely-positioned siblings of
- * its host, e.g. virtualized grid rows), which places the tooltip and its content
- * outside the icon's shadow root — these rules therefore target it from the document.
- *
- * @public
- */
-export declare const iconTooltipPortalStyles = "\n  .foundation-icon-tooltip {\n    position: fixed;\n    top: 0;\n    left: 0;\n    z-index: 999;\n    width: 300px;\n    contain: unset;\n  }\n\n  .foundation-icon-tooltip::part(tooltip) {\n    padding: calc(var(--design-unit) * 4px);\n    background-color: color-mix(in srgb, var(--neutral-layer-4), #000 10%);\n    border: 1px solid var(--neutral-layer-3);\n    text-align: left;\n    color: var(--neutral-foreground-hint);\n    box-shadow: 0 4px 10px rgb(0 0 0 / 35%);\n    font-size: var(--type-ramp-minus-1-font-size);\n  }\n\n  .foundation-icon-tooltip .tooltip-title {\n    color: var(--neutral-fill-strong-hover);\n    margin: 0;\n  }\n\n  .foundation-icon-tooltip .tooltip-description {\n    margin-top: calc(var(--design-unit) * 2px);\n    margin-bottom: 0;\n    font-size: var(--type-ramp-base-font-size);\n  }\n\n  .foundation-icon-tooltip .tooltip-second-title-margin {\n    margin-top: calc(var(--design-unit) * 2px);\n  }\n\n  .foundation-icon-tooltip .tooltip-list-padding {\n    margin: 0;\n    padding: 0 0 0 calc(var(--design-unit) * 4px);\n  }\n\n  .foundation-icon-tooltip a,\n  .foundation-icon-tooltip a:active,\n  .foundation-icon-tooltip a:visited {\n    color: var(--accent-foreground-rest);\n    text-decoration: none;\n  }\n\n  .foundation-icon-tooltip .warning {\n    background: var(--warning-color);\n    color: #000;\n  }\n\n  .foundation-icon-tooltip .info {\n    margin-top: calc(var(--design-unit) * 2px);\n    padding: 20px;\n    margin-bottom: 20px;\n    height: auto;\n    box-sizing: border-box;\n  }\n";
 //# sourceMappingURL=icon.styles.d.ts.map

package/dist/dts/icon/icon.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon.styles.d.ts","sourceRoot":"","sources":["../../../src/icon/icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAE7D,OAAO,KAAK,EACV,wBAAwB,EACxB,2BAA2B,EAC5B,MAAM,4BAA4B,CAAC;AAGpC,eAAO,MAAM,oBAAoB,GAC/B,SAAS,wBAAwB,EACjC,YAAY,2BAA2B,KACtC,aAkBF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,0BAA0B,4BAA4B,CAAC;AAEpE;;;;;;;GAOG;AACH,eAAO,MAAM,uBAAuB,4gDA2DnC,CAAC"}
+{"version":3,"file":"icon.styles.d.ts","sourceRoot":"","sources":["../../../src/icon/icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAE7D,OAAO,KAAK,EACV,wBAAwB,EACxB,2BAA2B,EAC5B,MAAM,4BAA4B,CAAC;AAGpC,eAAO,MAAM,oBAAoB,GAC/B,SAAS,wBAAwB,EACjC,YAAY,2BAA2B,KACtC,aA2EF,CAAC"}

package/dist/dts/icon/icon.template.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon.template.d.ts","sourceRoot":"","sources":["../../../src/icon/icon.template.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAI5D,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAEnC,eAAO,MAAM,eAAe,GAAI,QAAQ,MAAM,KAAG,YAYhD,CAAC;AAEF,eAAO,MAAM,sBAAsB,yBAElC,CAAC"}
+{"version":3,"file":"icon.template.d.ts","sourceRoot":"","sources":["../../../src/icon/icon.template.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAI5D,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAEnC,eAAO,MAAM,eAAe,GAAI,QAAQ,MAAM,KAAG,YAsBhD,CAAC;AAEF,eAAO,MAAM,sBAAsB,yBAElC,CAAC"}

package/dist/dts/react.d.ts

@@ -133,23 +133,23 @@ interface HTMLWCProps extends React.AriaAttributes {
   onInput?(e: Event): void;
 }
 
-export declare const Accordion: React.ForwardRefExoticComponent<
+export declare const AccordionItem: React.ForwardRefExoticComponent<
   React.PropsWithChildren<
-    Omit<PublicOf<AccordionWC>, 'children' | 'style'> &
+    Omit<PublicOf<AccordionItemWC>, 'children' | 'style'> &
     HTMLWCProps & {
     }
-  > & React.RefAttributes<AccordionWC>
+  > & React.RefAttributes<AccordionItemWC>
 >;
-export type AccordionRef = AccordionWC;
+export type AccordionItemRef = AccordionItemWC;
 
-export declare const AccordionItem: React.ForwardRefExoticComponent<
+export declare const Accordion: React.ForwardRefExoticComponent<
   React.PropsWithChildren<
-    Omit<PublicOf<AccordionItemWC>, 'children' | 'style'> &
+    Omit<PublicOf<AccordionWC>, 'children' | 'style'> &
     HTMLWCProps & {
     }
-  > & React.RefAttributes<AccordionItemWC>
+  > & React.RefAttributes<AccordionWC>
 >;
-export type AccordionItemRef = AccordionItemWC;
+export type AccordionRef = AccordionWC;
 
 export declare const ActionsMenu: React.ForwardRefExoticComponent<
   React.PropsWithChildren<

package/dist/dts/search-bar/search-bar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"search-bar.d.ts","sourceRoot":"","sources":["../../../src/search-bar/search-bar.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAG1D,OAAO,EACL,eAAe,EACf,cAAc,EAGf,MAAM,oBAAoB,CAAC;AAE5B;;;;GAIG;AACH,qBAAa,SAAU,SAAQ,iBAAiB;IACvC,QAAQ,EAAE,iBAAiB,CAAC;IACvB,mBAAmB,MAAC;IAEpB,OAAO,EAAE,eAAe,EAAE,CAAC;IAE3B,UAAU,EAAE,MAAM,CAAM;IAE9B,UAAU,EAAE,MAAM,CAAa;IAC/B,SAAS,EAAE,MAAM,CAAoB;IACrC,QAAQ,EAAE,QAAQ,CAAkB;IAEpC,WAAW,EAAE,MAAM,CAA4B;IAC/C,QAAQ,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACmD,WAAW,EAAE,OAAO,CAAQ;IAEtE,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,cAAc,EAAE,CAAM;IACvC,eAAe,EAAE,eAAe,EAAE,CAAC;IAExC,kBAAkB,EAAE,cAAc,CAAC;IAE1C;;;OAGG;IACI,KAAK;IAUZ;;;OAGG;IACI,WAAW,IAAI,IAAI;IAI1B;;OAEG;IACH,IAAI,mBAAmB,IAAI,OAAO,CAMjC;IAED;;;OAGG;IACH,IAAI,mBAAmB,IAAI,OAAO,CAOjC;IAED;;;;OAIG;IACH,eAAe,CAAC,MAAM,EAAE,eAAe,GAAG,OAAO;IAUjD,sBAAsB;IAItB,cAAc;IAId,OAAO,CAAC,oBAAoB;IAarB,YAAY;IAMZ,aAAa;IAyCb,YAAY,CAAC,KAAK,EAAE,cAAc;IAkBlC,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM;IAM7C,cAAc,CAAC,MAAM,EAAE,GAAG;IAKpB,YAAY;IAazB,OAAO,CAAC,qBAAqB;IAU7B,OAAO,CAAC,kBAAkB,CAExB;IAEF,OAAO,CAAC,wBAAwB,CAQ9B;CACH;AAGD,eAAO,MAAM,gCAAgC,EAAE,cAA0B,CAAC;AAE1E,eAAO,MAAM,sBAAsB,IAAK,CAAC;AAEzC;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB;;;;;;;;;;oBAM9B,CAAC"}
+{"version":3,"file":"search-bar.d.ts","sourceRoot":"","sources":["../../../src/search-bar/search-bar.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAG1D,OAAO,EACL,eAAe,EACf,cAAc,EAGf,MAAM,oBAAoB,CAAC;AAE5B;;;;GAIG;AACH,qBAAa,SAAU,SAAQ,iBAAiB;IACvC,QAAQ,EAAE,iBAAiB,CAAC;IACvB,mBAAmB,MAAC;IAEpB,OAAO,EAAE,eAAe,EAAE,CAAC;IAE3B,UAAU,EAAE,MAAM,CAAM;IAE9B,UAAU,EAAE,MAAM,CAAa;IAC/B,SAAS,EAAE,MAAM,CAAoB;IACrC,QAAQ,EAAE,QAAQ,CAAkB;IAEpC,WAAW,EAAE,MAAM,CAA4B;IAC/C,QAAQ,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACmD,WAAW,EAAE,OAAO,CAAQ;IAEtE,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,cAAc,EAAE,CAAM;IACvC,eAAe,EAAE,eAAe,EAAE,CAAC;IAExC,kBAAkB,EAAE,cAAc,CAAC;IAE1C;;;OAGG;IACI,KAAK;IAUZ;;;OAGG;IACI,WAAW,IAAI,IAAI;IAI1B;;OAEG;IACH,IAAI,mBAAmB,IAAI,OAAO,CAMjC;IAED;;;OAGG;IACH,IAAI,mBAAmB,IAAI,OAAO,CAOjC;IAED;;;;OAIG;IACH,eAAe,CAAC,MAAM,EAAE,eAAe,GAAG,OAAO;IAUjD,sBAAsB;IAItB,cAAc;IAId,OAAO,CAAC,oBAAoB;IAarB,YAAY;IAMZ,aAAa;IAyCb,YAAY,CAAC,KAAK,EAAE,cAAc;IAqBlC,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM;IAM7C,cAAc,CAAC,MAAM,EAAE,GAAG;IAKpB,YAAY;IAazB,OAAO,CAAC,qBAAqB;IAU7B,OAAO,CAAC,kBAAkB,CAExB;IAEF,OAAO,CAAC,wBAAwB,CAQ9B;CACH;AAGD,eAAO,MAAM,gCAAgC,EAAE,cAA0B,CAAC;AAE1E,eAAO,MAAM,sBAAsB,IAAK,CAAC;AAEzC;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB;;;;;;;;;;oBAM9B,CAAC"}

package/dist/esm/icon/icon.js

@@ -3,8 +3,7 @@ import { findIconDefinition, icon } from '@fortawesome/fontawesome-svg-core';
 import { UUID } from '@genesislcap/foundation-utils';
 import { attr, observable } from '@microsoft/fast-element';
 import { FoundationElement } from '@microsoft/fast-foundation';
-import { getPrefix } from '../utils';
-import { foundationIconStyles as styles, iconTooltipPortalClassName, iconTooltipPortalStyles, } from './icon.styles';
+import { foundationIconStyles as styles } from './icon.styles';
 import { foundationIconTemplate as template } from './icon.template';
 // explicitly declaring for extensibility
 export const foundationIconShadowOptions = {
@@ -39,16 +38,6 @@ export const faSizeValues = [
     'stack-1x',
     'stack-2x',
 ];
-const tooltipPortalStylesId = 'foundation-icon-tooltip-styles';
-const ensureTooltipPortalStyles = (document) => {
-    if (document.getElementById(tooltipPortalStylesId)) {
-        return;
-    }
-    const style = document.createElement('style');
-    style.id = tooltipPortalStylesId;
-    style.textContent = iconTooltipPortalStyles;
-    document.head.append(style);
-};
 /**
  * @tagname %%prefix%%-icon
  */
@@ -56,32 +45,8 @@ export class Icon extends FoundationElement {
     constructor() {
         super(...arguments);
         this.isError = false;
-        /**
-         * The tooltip element is portaled to `document.body` rather than rendered inside this
-         * component. In place, it inherits the stacking context of whatever hosts the icon — in
-         * virtualized lists (e.g. AG Grid rows are absolutely-positioned, transformed siblings)
-         * the next sibling paints over the tooltip no matter its z-index. The host is positioned
-         * from the anchor's `getBoundingClientRect()` (see {@link Icon.positionTooltipElement});
-         * the tooltip's internal anchored region cannot be relied on for placement because
-         * `tagFor(AnchoredRegion)` does not resolve for the subclassed genesis components.
-         */
-        this.tooltipElement = null;
         this.size = 'sm';
         this.variant = 'solid';
-        this.positionTooltipElement = () => {
-            if (!this.tooltipElement || !this.iElement) {
-                return;
-            }
-            const anchorRect = this.iElement.getBoundingClientRect();
-            this.tooltipElement.style.top = `${anchorRect.top}px`;
-            this.tooltipElement.style.left = `${anchorRect.right}px`;
-        };
-    }
-    tooltipChanged() {
-        if (!this.$fastController.isConnected) {
-            return;
-        }
-        this.tooltip ? this.loadIcon() : this.removeTooltipElement();
     }
     nameChanged(oldValue, newValue) {
         newValue ? this.loadIcon() : '';
@@ -99,7 +64,6 @@ export class Icon extends FoundationElement {
     disconnectedCallback() {
         super.disconnectedCallback();
         this.iElement.replaceChildren();
-        this.removeTooltipElement();
     }
     getDefaultTooltipConfig() {
         if (!this.name) {
@@ -117,7 +81,6 @@ export class Icon extends FoundationElement {
                 this.tooltipId = this.uuid.createId();
             }
             this.getDefaultTooltipConfig();
-            this.ensureTooltipElement();
         }
         const iconDefinition = findIconDefinition({
             prefix: FaPrefixFromStyle[this.variant],
@@ -129,44 +92,6 @@ export class Icon extends FoundationElement {
             Array.from(faIcon.node).map((n) => this.iElement.appendChild(n));
         }
     }
-    ensureTooltipElement() {
-        if (!this.$fastController.isConnected || !this.iElement) {
-            return;
-        }
-        if (!this.tooltipElement) {
-            ensureTooltipPortalStyles(document);
-            const tooltipElement = document.createElement(`${getPrefix(this)}-tooltip`);
-            tooltipElement.classList.add(iconTooltipPortalClassName);
-            document.body.append(tooltipElement);
-            this.tooltipElement = tooltipElement;
-            // Reposition just before FASTTooltip's own (delayed) show logic runs, so the
-            // bubble is placed from the anchor's current viewport position even after the
-            // icon has moved (scrolled grid, resized layout).
-            this.iElement.addEventListener('mouseover', this.positionTooltipElement, { passive: true });
-            this.iElement.addEventListener('focusin', this.positionTooltipElement, { passive: true });
-        }
-        // Anchor by element reference, assigned only after the tooltip is connected:
-        // FASTTooltip's connectedCallback re-resolves the `anchor` id within the tooltip's own
-        // root node, which cannot reach this icon's shadow root and would clobber an earlier value.
-        this.tooltipElement.anchorElement = this.iElement;
-        // Raw HTML on purpose: the previous inline template interpolated the tooltip string as
-        // markup, and consumers (e.g. foundation-forms) pass rich HTML tooltips.
-        this.tooltipElement.innerHTML = this.tooltip;
-        this.positionTooltipElement();
-    }
-    removeTooltipElement() {
-        var _a, _b;
-        if (!this.tooltipElement) {
-            return;
-        }
-        (_a = this.iElement) === null || _a === void 0 ? void 0 : _a.removeEventListener('mouseover', this.positionTooltipElement);
-        (_b = this.iElement) === null || _b === void 0 ? void 0 : _b.removeEventListener('focusin', this.positionTooltipElement);
-        // Clearing the anchor while still connected detaches the hover/focus
-        // listeners FASTTooltip registered on the anchor element.
-        this.tooltipElement.anchorElement = null;
-        this.tooltipElement.remove();
-        this.tooltipElement = null;
-    }
 }
 __decorate([
     observable

package/dist/esm/icon/icon.styles.js

@@ -18,32 +18,15 @@ export const foundationIconStyles = (context, definition) => css `
   .error-tooltip {
     color: var(--error-color);
   }
-`;
-/**
- * Class name marking icon tooltips portaled to `document.body`.
- *
- * @public
- */
-export const iconTooltipPortalClassName = 'foundation-icon-tooltip';
-/**
- * Document-level styles for icon tooltips. The icon portals its tooltip element to
- * `document.body` (so it cannot be painted over by absolutely-positioned siblings of
- * its host, e.g. virtualized grid rows), which places the tooltip and its content
- * outside the icon's shadow root — these rules therefore target it from the document.
- *
- * @public
- */
-export const iconTooltipPortalStyles = `
-  .${iconTooltipPortalClassName} {
-    position: fixed;
-    top: 0;
-    left: 0;
+
+  .tooltip-element {
+    position: absolute;
     z-index: 999;
     width: 300px;
     contain: unset;
   }
 
-  .${iconTooltipPortalClassName}::part(tooltip) {
+  .tooltip-element::part(tooltip) {
     padding: calc(var(--design-unit) * 4px);
     background-color: color-mix(in srgb, var(--neutral-layer-4), #000 10%);
     border: 1px solid var(--neutral-layer-3);
@@ -53,39 +36,39 @@ export const iconTooltipPortalStyles = `
     font-size: var(--type-ramp-minus-1-font-size);
   }
 
-  .${iconTooltipPortalClassName} .tooltip-title {
+  .tooltip-title {
     color: var(--neutral-fill-strong-hover);
     margin: 0;
   }
 
-  .${iconTooltipPortalClassName} .tooltip-description {
+  .tooltip-description {
     margin-top: calc(var(--design-unit) * 2px);
     margin-bottom: 0;
     font-size: var(--type-ramp-base-font-size);
   }
 
-  .${iconTooltipPortalClassName} .tooltip-second-title-margin {
+  .tooltip-second-title-margin {
     margin-top: calc(var(--design-unit) * 2px);
   }
 
-  .${iconTooltipPortalClassName} .tooltip-list-padding {
+  .tooltip-list-padding {
     margin: 0;
     padding: 0 0 0 calc(var(--design-unit) * 4px);
   }
 
-  .${iconTooltipPortalClassName} a,
-  .${iconTooltipPortalClassName} a:active,
-  .${iconTooltipPortalClassName} a:visited {
+  a,
+  a:active,
+  a:visited {
     color: var(--accent-foreground-rest);
     text-decoration: none;
   }
 
-  .${iconTooltipPortalClassName} .warning {
+  .warning {
     background: var(--warning-color);
     color: #000;
   }
 
-  .${iconTooltipPortalClassName} .info {
+  .info {
     margin-top: calc(var(--design-unit) * 2px);
     padding: 20px;
     margin-bottom: 20px;

package/dist/esm/icon/icon.template.js

@@ -1,4 +1,4 @@
-import { html, ref } from '@microsoft/fast-element';
+import { html, ref, when } from '@microsoft/fast-element';
 import { classNames } from '@microsoft/fast-web-utilities';
 import { getPrefix } from '../utils';
 export const getPrefixedIcon = (prefix) => html `
@@ -11,6 +11,13 @@ export const getPrefixedIcon = (prefix) => html `
     >
       <slot></slot>
     </i>
+    ${when((x) => x.tooltip, html `
+        <${prefix}-tooltip part="tooltip" class="tooltip-element" show anchor="${(x) => x.tooltipId}">
+          ${(x) => html `
+            ${x.tooltip}
+          `}
+        </${prefix}-tooltip>
+      `)}
   </template>
 `;
 export const foundationIconTemplate = html `

package/dist/esm/search-bar/search-bar.js

@@ -151,6 +151,9 @@ export class SearchBar extends FoundationElement {
         if ((newText === null || newText === void 0 ? void 0 : newText.length) >= this.minlength) {
             this.combobox.value = newText;
             this.searchTerm = newText;
+            if (this.options) {
+                this.filterSelectedOptions(newText);
+            }
             this.combobox.open = true;
         }
         this.loading = false;

package/dist/foundation-ui.api.json

@@ -53600,37 +53600,6 @@
               "isProtected": false,
               "isAbstract": false
             },
-            {
-              "kind": "Method",
-              "canonicalReference": "@genesislcap/foundation-ui!Icon#tooltipChanged:member(1)",
-              "docComment": "",
-              "excerptTokens": [
-                {
-                  "kind": "Content",
-                  "text": "tooltipChanged(): "
-                },
-                {
-                  "kind": "Content",
-                  "text": "void"
-                },
-                {
-                  "kind": "Content",
-                  "text": ";"
-                }
-              ],
-              "isStatic": false,
-              "returnTypeTokenRange": {
-                "startIndex": 1,
-                "endIndex": 2
-              },
-              "releaseTag": "Public",
-              "isProtected": false,
-              "overloadIndex": 1,
-              "parameters": [],
-              "isOptional": false,
-              "isAbstract": false,
-              "name": "tooltipChanged"
-            },
             {
               "kind": "Property",
               "canonicalReference": "@genesislcap/foundation-ui!Icon#tooltipId:member",
@@ -53794,60 +53763,6 @@
           },
           "implementsTokenRanges": []
         },
-        {
-          "kind": "Variable",
-          "canonicalReference": "@genesislcap/foundation-ui!iconTooltipPortalClassName:var",
-          "docComment": "/**\n * Class name marking icon tooltips portaled to `document.body`.\n *\n * @public\n */\n",
-          "excerptTokens": [
-            {
-              "kind": "Content",
-              "text": "iconTooltipPortalClassName = "
-            },
-            {
-              "kind": "Content",
-              "text": "\"foundation-icon-tooltip\""
-            }
-          ],
-          "fileUrlPath": "src/icon/icon.styles.ts",
-          "initializerTokenRange": {
-            "startIndex": 1,
-            "endIndex": 2
-          },
-          "isReadonly": true,
-          "releaseTag": "Public",
-          "name": "iconTooltipPortalClassName",
-          "variableTypeTokenRange": {
-            "startIndex": 0,
-            "endIndex": 0
-          }
-        },
-        {
-          "kind": "Variable",
-          "canonicalReference": "@genesislcap/foundation-ui!iconTooltipPortalStyles:var",
-          "docComment": "/**\n * Document-level styles for icon tooltips. The icon portals its tooltip element to `document.body` (so it cannot be painted over by absolutely-positioned siblings of its host, e.g. virtualized grid rows), which places the tooltip and its content outside the icon's shadow root — these rules therefore target it from the document.\n *\n * @public\n */\n",
-          "excerptTokens": [
-            {
-              "kind": "Content",
-              "text": "iconTooltipPortalStyles = "
-            },
-            {
-              "kind": "Content",
-              "text": "\"\\n  .foundation-icon-tooltip {\\n    position: fixed;\\n    top: 0;\\n    left: 0;\\n    z-index: 999;\\n    width: 300px;\\n    contain: unset;\\n  }\\n\\n  .foundation-icon-tooltip::part(tooltip) {\\n    padding: calc(var(--design-unit) * 4px);\\n    background-color: color-mix(in srgb, var(--neutral-layer-4), #000 10%);\\n    border: 1px solid var(--neutral-layer-3);\\n    text-align: left;\\n    color: var(--neutral-foreground-hint);\\n    box-shadow: 0 4px 10px rgb(0 0 0 / 35%);\\n    font-size: var(--type-ramp-minus-1-font-size);\\n  }\\n\\n  .foundation-icon-tooltip .tooltip-title {\\n    color: var(--neutral-fill-strong-hover);\\n    margin: 0;\\n  }\\n\\n  .foundation-icon-tooltip .tooltip-description {\\n    margin-top: calc(var(--design-unit) * 2px);\\n    margin-bottom: 0;\\n    font-size: var(--type-ramp-base-font-size);\\n  }\\n\\n  .foundation-icon-tooltip .tooltip-second-title-margin {\\n    margin-top: calc(var(--design-unit) * 2px);\\n  }\\n\\n  .foundation-icon-tooltip .tooltip-list-padding {\\n    margin: 0;\\n    padding: 0 0 0 calc(var(--design-unit) * 4px);\\n  }\\n\\n  .foundation-icon-tooltip a,\\n  .foundation-icon-tooltip a:active,\\n  .foundation-icon-tooltip a:visited {\\n    color: var(--accent-foreground-rest);\\n    text-decoration: none;\\n  }\\n\\n  .foundation-icon-tooltip .warning {\\n    background: var(--warning-color);\\n    color: #000;\\n  }\\n\\n  .foundation-icon-tooltip .info {\\n    margin-top: calc(var(--design-unit) * 2px);\\n    padding: 20px;\\n    margin-bottom: 20px;\\n    height: auto;\\n    box-sizing: border-box;\\n  }\\n\""
-            }
-          ],
-          "fileUrlPath": "src/icon/icon.styles.ts",
-          "initializerTokenRange": {
-            "startIndex": 1,
-            "endIndex": 2
-          },
-          "isReadonly": true,
-          "releaseTag": "Public",
-          "name": "iconTooltipPortalStyles",
-          "variableTypeTokenRange": {
-            "startIndex": 0,
-            "endIndex": 0
-          }
-        },
         {
           "kind": "Variable",
           "canonicalReference": "@genesislcap/foundation-ui!INPUT_MIN_LENGTH:var",

package/dist/foundation-ui.d.ts

@@ -5346,18 +5346,7 @@ export declare class Icon extends FoundationElement {
     uuid: UUID;
     tooltipId: string;
     tooltip: string;
-    tooltipChanged(): void;
     isError: boolean;
-    /**
-     * The tooltip element is portaled to `document.body` rather than rendered inside this
-     * component. In place, it inherits the stacking context of whatever hosts the icon — in
-     * virtualized lists (e.g. AG Grid rows are absolutely-positioned, transformed siblings)
-     * the next sibling paints over the tooltip no matter its z-index. The host is positioned
-     * from the anchor's `getBoundingClientRect()` (see {@link Icon.positionTooltipElement});
-     * the tooltip's internal anchored region cannot be relied on for placement because
-     * `tagFor(AnchoredRegion)` does not resolve for the subclassed genesis components.
-     */
-    private tooltipElement;
     name: IconName;
     nameChanged(oldValue: string, newValue: string): void;
     size: FaSize;
@@ -5368,32 +5357,12 @@ export declare class Icon extends FoundationElement {
     disconnectedCallback(): void;
     getDefaultTooltipConfig(): void;
     loadIcon(): void;
-    private ensureTooltipElement;
-    private positionTooltipElement;
-    private removeTooltipElement;
 }
 
 export { IconName }
 
 export { IconStyle }
 
-/**
- * Class name marking icon tooltips portaled to `document.body`.
- *
- * @public
- */
-export declare const iconTooltipPortalClassName = "foundation-icon-tooltip";
-
-/**
- * Document-level styles for icon tooltips. The icon portals its tooltip element to
- * `document.body` (so it cannot be painted over by absolutely-positioned siblings of
- * its host, e.g. virtualized grid rows), which places the tooltip and its content
- * outside the icon's shadow root — these rules therefore target it from the document.
- *
- * @public
- */
-export declare const iconTooltipPortalStyles = "\n  .foundation-icon-tooltip {\n    position: fixed;\n    top: 0;\n    left: 0;\n    z-index: 999;\n    width: 300px;\n    contain: unset;\n  }\n\n  .foundation-icon-tooltip::part(tooltip) {\n    padding: calc(var(--design-unit) * 4px);\n    background-color: color-mix(in srgb, var(--neutral-layer-4), #000 10%);\n    border: 1px solid var(--neutral-layer-3);\n    text-align: left;\n    color: var(--neutral-foreground-hint);\n    box-shadow: 0 4px 10px rgb(0 0 0 / 35%);\n    font-size: var(--type-ramp-minus-1-font-size);\n  }\n\n  .foundation-icon-tooltip .tooltip-title {\n    color: var(--neutral-fill-strong-hover);\n    margin: 0;\n  }\n\n  .foundation-icon-tooltip .tooltip-description {\n    margin-top: calc(var(--design-unit) * 2px);\n    margin-bottom: 0;\n    font-size: var(--type-ramp-base-font-size);\n  }\n\n  .foundation-icon-tooltip .tooltip-second-title-margin {\n    margin-top: calc(var(--design-unit) * 2px);\n  }\n\n  .foundation-icon-tooltip .tooltip-list-padding {\n    margin: 0;\n    padding: 0 0 0 calc(var(--design-unit) * 4px);\n  }\n\n  .foundation-icon-tooltip a,\n  .foundation-icon-tooltip a:active,\n  .foundation-icon-tooltip a:visited {\n    color: var(--accent-foreground-rest);\n    text-decoration: none;\n  }\n\n  .foundation-icon-tooltip .warning {\n    background: var(--warning-color);\n    color: #000;\n  }\n\n  .foundation-icon-tooltip .info {\n    margin-top: calc(var(--design-unit) * 2px);\n    padding: 20px;\n    margin-bottom: 20px;\n    height: auto;\n    box-sizing: border-box;\n  }\n";
-
 export declare const INPUT_MIN_LENGTH = 3;
 
 export declare const inputControls: ElementStyles;

package/dist/react.cjs

@@ -113,14 +113,14 @@ function _mergeRefs(...refs) {
   };
 }
 
-const Accordion = React.forwardRef(function Accordion(props, ref) {
+const AccordionItem = React.forwardRef(function AccordionItem(props, ref) {
   const { children, ...rest } = props;
-  return React.createElement(customElements.getName(AccordionWC) ?? '%%prefix%%-accordion', { ...rest, ref }, children);
+  return React.createElement(customElements.getName(AccordionItemWC) ?? '%%prefix%%-accordion-item', { ...rest, ref }, children);
 });
 
-const AccordionItem = React.forwardRef(function AccordionItem(props, ref) {
+const Accordion = React.forwardRef(function Accordion(props, ref) {
   const { children, ...rest } = props;
-  return React.createElement(customElements.getName(AccordionItemWC) ?? '%%prefix%%-accordion-item', { ...rest, ref }, children);
+  return React.createElement(customElements.getName(AccordionWC) ?? '%%prefix%%-accordion', { ...rest, ref }, children);
 });
 
 const ActionsMenu = React.forwardRef(function ActionsMenu(props, ref) {
@@ -1143,8 +1143,8 @@ const WeeklyRecurrence = React.forwardRef(function WeeklyRecurrence(props, ref)
 });
 
 module.exports = {
-  Accordion,
   AccordionItem,
+  Accordion,
   ActionsMenu,
   AiCriteriaSearch,
   AiIndicator,

package/dist/react.mjs

@@ -111,14 +111,14 @@ function _mergeRefs(...refs) {
   };
 }
 
-export const Accordion = React.forwardRef(function Accordion(props, ref) {
+export const AccordionItem = React.forwardRef(function AccordionItem(props, ref) {
   const { children, ...rest } = props;
-  return React.createElement(customElements.getName(AccordionWC) ?? '%%prefix%%-accordion', { ...rest, ref }, children);
+  return React.createElement(customElements.getName(AccordionItemWC) ?? '%%prefix%%-accordion-item', { ...rest, ref }, children);
 });
 
-export const AccordionItem = React.forwardRef(function AccordionItem(props, ref) {
+export const Accordion = React.forwardRef(function Accordion(props, ref) {
   const { children, ...rest } = props;
-  return React.createElement(customElements.getName(AccordionItemWC) ?? '%%prefix%%-accordion-item', { ...rest, ref }, children);
+  return React.createElement(customElements.getName(AccordionWC) ?? '%%prefix%%-accordion', { ...rest, ref }, children);
 });
 
 export const ActionsMenu = React.forwardRef(function ActionsMenu(props, ref) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/foundation-ui",
   "description": "Genesis Foundation UI",
-  "version": "15.8.1-PTC-0.1",
+  "version": "15.8.2",
   "sideEffects": false,
   "license": "SEE LICENSE IN license.txt",
   "main": "dist/esm/index.js",
@@ -85,13 +85,13 @@
     }
   },
   "devDependencies": {
-    "@genesislcap/foundation-testing": "15.8.1-PTC-0.1",
-    "@genesislcap/genx": "15.8.1-PTC-0.1",
-    "@genesislcap/rollup-builder": "15.8.1-PTC-0.1",
-    "@genesislcap/ts-builder": "15.8.1-PTC-0.1",
-    "@genesislcap/uvu-playwright-builder": "15.8.1-PTC-0.1",
-    "@genesislcap/vite-builder": "15.8.1-PTC-0.1",
-    "@genesislcap/webpack-builder": "15.8.1-PTC-0.1",
+    "@genesislcap/foundation-testing": "15.8.2",
+    "@genesislcap/genx": "15.8.2",
+    "@genesislcap/rollup-builder": "15.8.2",
+    "@genesislcap/ts-builder": "15.8.2",
+    "@genesislcap/uvu-playwright-builder": "15.8.2",
+    "@genesislcap/vite-builder": "15.8.2",
+    "@genesislcap/webpack-builder": "15.8.2",
     "copyfiles": "^2.4.1"
   },
   "dependencies": {
@@ -100,16 +100,16 @@
     "@fortawesome/free-regular-svg-icons": "^6.2.1",
     "@fortawesome/free-solid-svg-icons": "^6.2.1",
     "@genesiscommunitysuccess/analyzer-import-alias-plugin": "^5.0.3",
-    "@genesislcap/expression-builder": "15.8.1-PTC-0.1",
-    "@genesislcap/foundation-ai": "15.8.1-PTC-0.1",
-    "@genesislcap/foundation-comms": "15.8.1-PTC-0.1",
-    "@genesislcap/foundation-criteria": "15.8.1-PTC-0.1",
-    "@genesislcap/foundation-errors": "15.8.1-PTC-0.1",
-    "@genesislcap/foundation-events": "15.8.1-PTC-0.1",
-    "@genesislcap/foundation-logger": "15.8.1-PTC-0.1",
-    "@genesislcap/foundation-notifications": "15.8.1-PTC-0.1",
-    "@genesislcap/foundation-user": "15.8.1-PTC-0.1",
-    "@genesislcap/foundation-utils": "15.8.1-PTC-0.1",
+    "@genesislcap/expression-builder": "15.8.2",
+    "@genesislcap/foundation-ai": "15.8.2",
+    "@genesislcap/foundation-comms": "15.8.2",
+    "@genesislcap/foundation-criteria": "15.8.2",
+    "@genesislcap/foundation-errors": "15.8.2",
+    "@genesislcap/foundation-events": "15.8.2",
+    "@genesislcap/foundation-logger": "15.8.2",
+    "@genesislcap/foundation-notifications": "15.8.2",
+    "@genesislcap/foundation-user": "15.8.2",
+    "@genesislcap/foundation-utils": "15.8.2",
     "@microsoft/fast-colors": "5.3.1",
     "@microsoft/fast-components": "2.30.6",
     "@microsoft/fast-element": "1.14.0",
@@ -142,5 +142,5 @@
       "require": "./dist/react.cjs"
     }
   },
-  "gitHead": "d3b158d9e91f31fc6a248b8b75d7c8f8d5589bc6"
+  "gitHead": "c62567e4acee7219798579d18a023be909bdd0a0"
 }