@tylertech/forge 2.0.0

package/esm/accordion/accordion.d.ts

@@ -0,0 +1,30 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { BaseComponent, IBaseComponent } from '../core/base/base-component';
+export interface IAccordionComponent extends IBaseComponent {
+    panelSelector: string;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'forge-accordion': IAccordionComponent;
+    }
+}
+/**
+ * The custom element class behind the `<forge-accordion>` web component.
+ *
+ * This component is intended to wrap and orchestrate child expansion panels
+ * so that only one expansion panel is open at a time.
+ */
+export declare class AccordionComponent extends BaseComponent implements IAccordionComponent {
+    static get observedAttributes(): string[];
+    private _foundation;
+    constructor();
+    initializedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
+    /** Gets/sets the selector to use for finding the child expansion panels. Defaults to searching the direct children for `<forge-expansion-panel>` elements. */
+    panelSelector: string;
+}

package/esm/accordion/accordion.js

@@ -0,0 +1,52 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { __decorate } from "tslib";
+import { CustomElement, FoundationProperty } from '@tylertech/forge-core';
+import { BaseComponent } from '../core/base/base-component';
+import { ExpansionPanelComponent } from '../expansion-panel';
+import { AccordionAdapter } from './accordion-adapter';
+import { ACCORDION_CONSTANTS } from './accordion-constants';
+import { AccordionFoundation } from './accordion-foundation';
+/**
+ * The custom element class behind the `<forge-accordion>` web component.
+ *
+ * This component is intended to wrap and orchestrate child expansion panels
+ * so that only one expansion panel is open at a time.
+ */
+let AccordionComponent = class AccordionComponent extends BaseComponent {
+    constructor() {
+        super();
+        this._foundation = new AccordionFoundation(new AccordionAdapter(this));
+    }
+    static get observedAttributes() {
+        return [
+            ACCORDION_CONSTANTS.attributes.PANEL_SELECTOR
+        ];
+    }
+    initializedCallback() {
+        this._foundation.initialize();
+    }
+    disconnectedCallback() {
+        this._foundation.disconnect();
+    }
+    attributeChangedCallback(name, oldValue, newValue) {
+        switch (name) {
+            case ACCORDION_CONSTANTS.attributes.PANEL_SELECTOR:
+                this.panelSelector = newValue;
+                break;
+        }
+    }
+};
+__decorate([
+    FoundationProperty()
+], AccordionComponent.prototype, "panelSelector", void 0);
+AccordionComponent = __decorate([
+    CustomElement({
+        name: ACCORDION_CONSTANTS.elementName,
+        dependencies: [ExpansionPanelComponent]
+    })
+], AccordionComponent);
+export { AccordionComponent };

package/esm/accordion/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+export * from './accordion-adapter';
+export * from './accordion-constants';
+export * from './accordion-foundation';
+export * from './accordion';
+export declare function defineAccordionComponent(): void;

package/esm/accordion/index.js

@@ -0,0 +1,14 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { defineCustomElement } from '@tylertech/forge-core';
+import { AccordionComponent } from './accordion';
+export * from './accordion-adapter';
+export * from './accordion-constants';
+export * from './accordion-foundation';
+export * from './accordion';
+export function defineAccordionComponent() {
+    defineCustomElement(AccordionComponent);
+}

package/esm/app-bar/app-bar-adapter.d.ts

@@ -0,0 +1,43 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { BaseAdapter, IBaseAdapter } from '../core/base/base-adapter';
+import { IAppBarComponent } from './app-bar';
+export interface IAppBarAdapter extends IBaseAdapter {
+    setTitleText(value: string): void;
+    setDense(value: boolean): void;
+    setRaised(value: boolean): void;
+    setFixed(value: boolean): void;
+    addBottomClass(name: string): void;
+    removeBottomClass(name: string): void;
+    addBottomSlotListener(listener: (evt: Event) => void): void;
+    addCenterSlotListener(listener: (evt: Event) => void): void;
+    setCenterSlotVisibility(): void;
+}
+/**
+ * Provides facilities for interacting with the internal DOM of `AppBarComponent`.
+ */
+export declare class AppBarAdapter extends BaseAdapter<IAppBarComponent> implements IAppBarAdapter {
+    private _rootElement;
+    private _titleElement;
+    private _bottomElement;
+    private _bottomSlotElement;
+    private _centerSlotElement;
+    private _centerSectionElement;
+    constructor(component: IAppBarComponent);
+    /**
+     * Sets the title text value.
+     * @param {string} value The title text.
+     */
+    setTitleText(value: string): void;
+    setDense(value: boolean): void;
+    setRaised(value: boolean): void;
+    setFixed(value: boolean): void;
+    addBottomClass(name: string): void;
+    removeBottomClass(name: string): void;
+    addBottomSlotListener(listener: (evt: Event) => void): void;
+    addCenterSlotListener(listener: (evt: Event) => void): void;
+    setCenterSlotVisibility(): void;
+}

package/esm/app-bar/app-bar-adapter.js

@@ -0,0 +1,60 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { getShadowElement, toggleClass } from '@tylertech/forge-core';
+import { BaseAdapter } from '../core/base/base-adapter';
+import { APP_BAR_CONSTANTS } from './app-bar-constants';
+/**
+ * Provides facilities for interacting with the internal DOM of `AppBarComponent`.
+ */
+export class AppBarAdapter extends BaseAdapter {
+    constructor(component) {
+        super(component);
+        this._rootElement = getShadowElement(component, APP_BAR_CONSTANTS.selectors.ROOT);
+        this._titleElement = getShadowElement(component, APP_BAR_CONSTANTS.selectors.TITLE);
+        this._bottomElement = getShadowElement(component, APP_BAR_CONSTANTS.selectors.BOTTOM);
+        this._bottomSlotElement = getShadowElement(component, APP_BAR_CONSTANTS.selectors.BOTTOM_SLOT);
+        this._centerSlotElement = getShadowElement(component, APP_BAR_CONSTANTS.selectors.CENTER_SLOT);
+        this._centerSectionElement = getShadowElement(component, APP_BAR_CONSTANTS.selectors.CENTER_SECTION);
+    }
+    /**
+     * Sets the title text value.
+     * @param {string} value The title text.
+     */
+    setTitleText(value) {
+        this._titleElement.textContent = value;
+    }
+    setDense(value) {
+        toggleClass(this._rootElement, value, APP_BAR_CONSTANTS.classes.DENSE);
+    }
+    setRaised(value) {
+        toggleClass(this._rootElement, value, APP_BAR_CONSTANTS.classes.RAISED);
+    }
+    setFixed(value) {
+        toggleClass(this._rootElement, value, APP_BAR_CONSTANTS.classes.FIXED);
+    }
+    addBottomClass(name) {
+        this._bottomElement.classList.add(name);
+    }
+    removeBottomClass(name) {
+        this._bottomElement.classList.remove(name);
+    }
+    addBottomSlotListener(listener) {
+        this._bottomSlotElement.addEventListener('slotchange', listener);
+    }
+    addCenterSlotListener(listener) {
+        this._centerSlotElement.addEventListener('slotchange', listener);
+    }
+    setCenterSlotVisibility() {
+        if (this._centerSlotElement.assignedNodes().length) {
+            this._centerSectionElement.style.removeProperty('display');
+            this._rootElement.classList.remove(APP_BAR_CONSTANTS.classes.NO_CENTER);
+        }
+        else {
+            this._centerSectionElement.style.display = 'none';
+            this._rootElement.classList.add(APP_BAR_CONSTANTS.classes.NO_CENTER);
+        }
+    }
+}

package/esm/app-bar/app-bar-constants.d.ts

@@ -0,0 +1,33 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+export declare const elementName: keyof HTMLElementTagNameMap;
+export declare const APP_BAR_CONSTANTS: {
+    elementName: "forge-app-bar";
+    selectors: {
+        ROOT: string;
+        TITLE: string;
+        BOTTOM: string;
+        BOTTOM_SLOT: string;
+        CENTER_SLOT: string;
+        CENTER_SECTION: string;
+        FIXED: string;
+        RAISED: string;
+    };
+    attributes: {
+        TITLE_TEXT: string;
+        FIXED: string;
+        RAISED: string;
+        THEME: string;
+    };
+    classes: {
+        DENSE: string;
+        FIXED: string;
+        RAISED: string;
+        ROW: string;
+        TITLE_INTERACTABLE: string;
+        NO_CENTER: string;
+    };
+};

package/esm/app-bar/app-bar-constants.js

@@ -0,0 +1,37 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { COMPONENT_NAME_PREFIX } from '../constants';
+export const elementName = `${COMPONENT_NAME_PREFIX}app-bar`;
+const classes = {
+    DENSE: 'forge-app-bar--dense',
+    FIXED: 'forge-app-bar--fixed',
+    RAISED: 'forge-app-bar--raised',
+    ROW: 'forge-app-bar__row',
+    TITLE_INTERACTABLE: 'forge-app-bar__title--interactable',
+    NO_CENTER: 'forge-app-bar--no-center'
+};
+const selectors = {
+    ROOT: '.forge-app-bar',
+    TITLE: '.forge-app-bar__title',
+    BOTTOM: '.forge-app-bar__bottom',
+    BOTTOM_SLOT: 'slot[name=bottom]',
+    CENTER_SLOT: 'slot[name=center]',
+    CENTER_SECTION: '#center-section',
+    FIXED: `.${classes.FIXED}`,
+    RAISED: `.${classes.RAISED}`
+};
+const attributes = {
+    TITLE_TEXT: 'title-text',
+    FIXED: 'fixed',
+    RAISED: 'raised',
+    THEME: 'theme'
+};
+export const APP_BAR_CONSTANTS = {
+    elementName,
+    selectors,
+    attributes,
+    classes
+};

package/esm/app-bar/app-bar-foundation.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { ICustomElementFoundation } from '@tylertech/forge-core';
+import { IAppBarAdapter } from './app-bar-adapter';
+export interface IAppBarFoundation extends ICustomElementFoundation {
+    titleText: string;
+    fixed: boolean;
+    raised: boolean;
+}
+/**
+ * Provides facilities and helper methods for creating an app-bar component.
+ */
+export declare class AppBarFoundation implements IAppBarFoundation {
+    private _adapter;
+    private _titleText;
+    private _fixed;
+    private _raised;
+    private _bottomSlotListener;
+    private _centerSlotListener;
+    constructor(_adapter: IAppBarAdapter);
+    initialize(): void;
+    private _onBottomSlotChanged;
+    private _onCenterSlotChanged;
+    /** Gets/sets the title text. */
+    get titleText(): string;
+    set titleText(value: string);
+    /** Gets/sets the fixed state. */
+    get fixed(): boolean;
+    set fixed(value: boolean);
+    get raised(): boolean;
+    set raised(value: boolean);
+}

package/esm/app-bar/app-bar-foundation.js

@@ -0,0 +1,70 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { APP_BAR_CONSTANTS } from './app-bar-constants';
+/**
+ * Provides facilities and helper methods for creating an app-bar component.
+ */
+export class AppBarFoundation {
+    constructor(_adapter) {
+        this._adapter = _adapter;
+        this._fixed = false;
+        this._raised = true;
+        this._bottomSlotListener = evt => this._onBottomSlotChanged(evt);
+        this._centerSlotListener = evt => this._onCenterSlotChanged(evt);
+    }
+    initialize() {
+        this._adapter.setTitleText(this._titleText);
+        this._adapter.addBottomSlotListener(this._bottomSlotListener);
+        this._adapter.addCenterSlotListener(this._centerSlotListener);
+        this._adapter.setCenterSlotVisibility();
+        this._adapter.setRaised(this._raised);
+        this._adapter.setFixed(this._fixed);
+    }
+    _onBottomSlotChanged(evt) {
+        const slotElement = evt.target;
+        if (slotElement.assignedNodes().length) {
+            this._adapter.addBottomClass(APP_BAR_CONSTANTS.classes.ROW);
+        }
+        else {
+            this._adapter.removeBottomClass(APP_BAR_CONSTANTS.classes.ROW);
+        }
+    }
+    _onCenterSlotChanged(evt) {
+        this._adapter.setCenterSlotVisibility();
+    }
+    /** Gets/sets the title text. */
+    get titleText() {
+        return this._titleText;
+    }
+    set titleText(value) {
+        if (this._titleText !== value) {
+            this._titleText = value;
+            this._adapter.setTitleText(this._titleText);
+            this._adapter.setHostAttribute(APP_BAR_CONSTANTS.attributes.TITLE_TEXT, value);
+        }
+    }
+    /** Gets/sets the fixed state. */
+    get fixed() {
+        return this._fixed;
+    }
+    set fixed(value) {
+        if (this._fixed !== value) {
+            this._fixed = value;
+            this._adapter.setFixed(this._fixed);
+            this._adapter.setHostAttribute(APP_BAR_CONSTANTS.attributes.FIXED, this._fixed.toString());
+        }
+    }
+    get raised() {
+        return this._raised;
+    }
+    set raised(value) {
+        if (this._raised !== value) {
+            this._raised = value;
+            this._adapter.setRaised(value);
+            this._adapter.setHostAttribute(APP_BAR_CONSTANTS.attributes.RAISED, this._raised.toString());
+        }
+    }
+}

package/esm/app-bar/app-bar.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { BaseComponent, IBaseComponent } from '../core/base/base-component';
+export interface IAppBarComponent extends IBaseComponent {
+    titleText: string;
+    fixed: boolean;
+    raised: boolean;
+    theme: string | null;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'forge-app-bar': IAppBarComponent;
+    }
+}
+/** The web component class behind the <forge-app-bar> custom element. */
+export declare class AppBarComponent extends BaseComponent implements IAppBarComponent {
+    static get observedAttributes(): string[];
+    private _foundation;
+    constructor();
+    initializedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
+    /** Gets/sets the title text. */
+    titleText: string;
+    /** Gets/sets the fixed variant. */
+    fixed: boolean;
+    /** Gets/sets the raised state. */
+    raised: boolean;
+    /** Convenience property to allow for easily getting/setting the theme color from JavaScript. */
+    get theme(): string | null;
+    set theme(value: string | null);
+}

package/esm/app-bar/app-bar.js

@@ -0,0 +1,71 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { __decorate } from "tslib";
+import { CustomElement, attachShadowTemplate, coerceBoolean, FoundationProperty } from '@tylertech/forge-core';
+import { AppBarAdapter } from './app-bar-adapter';
+import { AppBarFoundation } from './app-bar-foundation';
+import { APP_BAR_CONSTANTS } from './app-bar-constants';
+import { BaseComponent } from '../core/base/base-component';
+const template = '<template><header class=\"forge-app-bar\" part=\"root\"><div class=\"forge-app-bar__row\" part=\"row\"><section class=\"forge-app-bar__section forge-app-bar__section--align-start\" part=\"section-start\"><slot name=\"start\"></slot><slot name=\"logo\"></slot><slot name=\"title\"><h1 class=\"forge-app-bar__title\" part=\"title\"></h1></slot></section><section id=\"center-section\" class=\"forge-app-bar__section forge-app-bar__section--align-center\" part=\"section-center\"><slot name=\"center\"></slot></section><section class=\"forge-app-bar__section forge-app-bar__section--align-end\" part=\"section-end\"><slot name=\"end\"></slot></section></div><div class=\"forge-app-bar__bottom\" part=\"bottom\"><slot name=\"bottom\"></slot></div></header></template>';
+const styles = '.forge-app-bar{color:#fff;color:var(--forge-app-bar-theme-on-background,#fff);background-color:#283593;background-color:var(--forge-app-bar-theme-background,#283593);z-index:4;z-index:var(--forge-z-index-header,4);background-size:cover;background-position:center;display:grid;grid-template-rows:1fr auto;grid-template-columns:minmax(0,1fr);position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;-webkit-transition:-webkit-box-shadow .2s linear;transition:-webkit-box-shadow .2s linear;transition:box-shadow .2s linear;transition:box-shadow .2s linear,-webkit-box-shadow .2s linear}.forge-app-bar__row{display:grid;grid-template-columns:1fr 1fr 1fr;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:56px}.forge-app-bar--no-center .forge-app-bar__row{grid-template-columns:1fr auto}.forge-app-bar__section{display:-webkit-inline-box;display:inline-flex;-webkit-box-flex:1;flex:1 1 auto;-webkit-box-align:center;align-items:center;min-width:0;padding:0 4px;height:56px;-webkit-box-sizing:border-box;box-sizing:border-box}.forge-app-bar__section--align-start{-webkit-box-pack:start;justify-content:flex-start;-webkit-box-ordinal-group:0;order:-1;grid-column:1}.forge-app-bar__section--align-center{grid-column:2;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center}.forge-app-bar__section--align-end{-webkit-box-pack:end;justify-content:flex-end;-webkit-box-ordinal-group:2;order:1;grid-column:3}.forge-app-bar--no-center .forge-app-bar__section--align-end{grid-column:2}.forge-app-bar ::slotted([slot=logo]){color:#fff;color:var(--forge-app-bar-theme-on-background,#fff);display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;margin:0 8px;font-size:3rem;overflow:visible}.forge-app-bar ::slotted([slot=profile]){margin-left:4px}.forge-app-bar ::slotted([slot=title]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-headline5-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1.5rem;font-size:var(--mdc-typography-headline5-font-size, 1.5rem);line-height:2rem;line-height:var(--mdc-typography-headline5-line-height, 2rem);font-weight:400;font-weight:var(--mdc-typography-headline5-font-weight,400);letter-spacing:normal;letter-spacing:var(--mdc-typography-headline5-letter-spacing, normal);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-headline5-text-decoration,inherit);text-decoration:var(--mdc-typography-headline5-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline5-text-transform,inherit);color:#fff;color:var(--forge-app-bar-theme-on-background,#fff);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:8px;padding-right:8px}.forge-app-bar slot[name=user-action]{display:-webkit-inline-box;display:inline-flex;margin-right:24px}.forge-app-bar__title{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-headline5-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1.5rem;font-size:var(--mdc-typography-headline5-font-size, 1.5rem);line-height:2rem;line-height:var(--mdc-typography-headline5-line-height, 2rem);font-weight:400;font-weight:var(--mdc-typography-headline5-font-weight,400);letter-spacing:normal;letter-spacing:var(--mdc-typography-headline5-letter-spacing, normal);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-headline5-text-decoration,inherit);text-decoration:var(--mdc-typography-headline5-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline5-text-transform,inherit);color:#fff;color:var(--forge-app-bar-theme-on-background,#fff);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:8px;padding-right:8px}.forge-app-bar__title--interactable:hover{background-color:rgba(255,255,255,.12);border-radius:4px;cursor:pointer}.forge-app-bar__title--interactable:active{background-color:rgba(255,255,255,.24)}.forge-app-bar__bottom{padding:0 4px;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;height:auto!important;overflow:hidden;grid-row:2}.forge-app-bar--fixed{-webkit-transition:-webkit-box-shadow .2s linear;transition:-webkit-box-shadow .2s linear;transition:box-shadow .2s linear;transition:box-shadow .2s linear,-webkit-box-shadow .2s linear}.forge-app-bar--raised{box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)}:host{z-index:4;z-index:var(--forge-z-index-header,4);position:relative;display:block;contain:layout style;--mdc-theme-text-secondary-on-background:var(--forge-app-bar-theme-secondary-on-background, rgba(255, 255, 255, 0.54));--mdc-theme-text-secondary-on-light:var(--forge-app-bar-theme-secondary-on-background, rgba(255, 255, 255, 0.54));--mdc-theme-text-disabled-on-background:var(--forge-app-bar-theme-disabled-on-background, rgba(255, 255, 255, 0.38));--mdc-theme-text-disabled-on-light:var(--forge-app-bar-theme-disabled-on-light, rgba(255, 255, 255, 0.12))}:host ::slotted(:not(forge-button)){--mdc-theme-on-primary:var(--forge-app-bar-theme-on-background, #ffffff);--mdc-theme-on-surface:var(--forge-app-bar-theme-on-background, #ffffff)}:host ::slotted(forge-tab-bar){--mdc-theme-primary:var(--forge-app-bar-theme-on-background, #ffffff)}:host ::slotted(forge-button:not([type])),:host ::slotted(forge-button[type=outlined]){--mdc-theme-primary:var(--forge-app-bar-theme-on-background, rgba(255, 255, 255, 0.87))}:host([hidden]){display:none}:host([theme=white]){--forge-app-bar-theme-background:#ffffff;--forge-app-bar-theme-on-background:rgba(0, 0, 0, 0.87);--forge-app-bar-theme-secondary-on-background:rgba(0, 0, 0, 0.54);--forge-app-bar-theme-disabled-on-background:rgba(0, 0, 0, 0.38);--forge-app-bar-theme-disabled-on-light:rgba(0, 0, 0, 0.12)}';
+/** The web component class behind the <forge-app-bar> custom element. */
+let AppBarComponent = class AppBarComponent extends BaseComponent {
+    constructor() {
+        super();
+        attachShadowTemplate(this, template, styles);
+        this._foundation = new AppBarFoundation(new AppBarAdapter(this));
+    }
+    static get observedAttributes() {
+        return [
+            APP_BAR_CONSTANTS.attributes.TITLE_TEXT,
+            APP_BAR_CONSTANTS.attributes.FIXED,
+            APP_BAR_CONSTANTS.attributes.RAISED
+        ];
+    }
+    initializedCallback() {
+        this._foundation.initialize();
+    }
+    attributeChangedCallback(name, oldValue, newValue) {
+        switch (name) {
+            case APP_BAR_CONSTANTS.attributes.TITLE_TEXT:
+                this.titleText = newValue;
+                break;
+            case APP_BAR_CONSTANTS.attributes.FIXED:
+                this.fixed = coerceBoolean(newValue);
+                break;
+            case APP_BAR_CONSTANTS.attributes.RAISED:
+                this.raised = coerceBoolean(newValue);
+                break;
+        }
+    }
+    /** Convenience property to allow for easily getting/setting the theme color from JavaScript. */
+    get theme() {
+        return this.getAttribute(APP_BAR_CONSTANTS.attributes.THEME) || null;
+    }
+    set theme(value) {
+        if (value) {
+            this.setAttribute(APP_BAR_CONSTANTS.attributes.THEME, value);
+        }
+        else {
+            this.removeAttribute(APP_BAR_CONSTANTS.attributes.THEME);
+        }
+    }
+};
+__decorate([
+    FoundationProperty()
+], AppBarComponent.prototype, "titleText", void 0);
+__decorate([
+    FoundationProperty()
+], AppBarComponent.prototype, "fixed", void 0);
+__decorate([
+    FoundationProperty()
+], AppBarComponent.prototype, "raised", void 0);
+AppBarComponent = __decorate([
+    CustomElement({
+        name: APP_BAR_CONSTANTS.elementName
+    })
+], AppBarComponent);
+export { AppBarComponent };

package/esm/app-bar/help-button/app-bar-help-button-adapter.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { BaseAdapter, IBaseAdapter } from '../../core/base/base-adapter';
+import { IMenuOption } from '../../menu';
+import { IAppBarHelpButtonComponent } from './app-bar-help-button';
+export interface IAppBarHelpButtonAdapter extends IBaseAdapter {
+    initialize(): void;
+    setMenuOptions(options: IMenuOption[]): void;
+}
+export declare class AppBarHelpButtonAdapter extends BaseAdapter<IAppBarHelpButtonComponent> implements IAppBarHelpButtonAdapter {
+    private _menuElement;
+    constructor(component: IAppBarHelpButtonComponent);
+    initialize(): void;
+    setMenuOptions(options: IMenuOption[]): void;
+}

package/esm/app-bar/help-button/app-bar-help-button-adapter.js

@@ -0,0 +1,19 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { getLightElement } from '@tylertech/forge-core';
+import { BaseAdapter } from '../../core/base/base-adapter';
+import { MENU_CONSTANTS } from '../../menu';
+export class AppBarHelpButtonAdapter extends BaseAdapter {
+    constructor(component) {
+        super(component);
+    }
+    initialize() {
+        this._menuElement = getLightElement(this._component, MENU_CONSTANTS.elementName);
+    }
+    setMenuOptions(options) {
+        this._menuElement.options = options;
+    }
+}

package/esm/app-bar/help-button/app-bar-help-button-constants.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+export declare const APP_BAR_HELP_BUTTON_CONSTANTS: {
+    elementName: "forge-app-bar-help-button";
+};

package/esm/app-bar/help-button/app-bar-help-button-constants.js

@@ -0,0 +1,10 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { COMPONENT_NAME_PREFIX } from '../../constants';
+const elementName = `${COMPONENT_NAME_PREFIX}app-bar-help-button`;
+export const APP_BAR_HELP_BUTTON_CONSTANTS = {
+    elementName
+};

package/esm/app-bar/help-button/app-bar-help-button-foundation.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { ICustomElementFoundation } from '@tylertech/forge-core';
+import { IMenuOption } from '../../menu';
+import { IAppBarHelpButtonAdapter } from './app-bar-help-button-adapter';
+export interface IAppBarHelpButtonFoundation extends ICustomElementFoundation {
+    options: IMenuOption[];
+}
+export declare class AppBarHelpButtonFoundation implements IAppBarHelpButtonFoundation {
+    private _adapter;
+    private _options;
+    private _isInitialized;
+    constructor(_adapter: IAppBarHelpButtonAdapter);
+    initialize(): void;
+    disconnect(): void;
+    get options(): IMenuOption[];
+    set options(value: IMenuOption[]);
+}

package/esm/app-bar/help-button/app-bar-help-button-foundation.js

@@ -0,0 +1,29 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+export class AppBarHelpButtonFoundation {
+    constructor(_adapter) {
+        this._adapter = _adapter;
+        this._options = [];
+        this._isInitialized = false;
+    }
+    initialize() {
+        this._adapter.initialize();
+        this._adapter.setMenuOptions(this._options);
+        this._isInitialized = true;
+    }
+    disconnect() {
+        this._isInitialized = false;
+    }
+    get options() {
+        return this._options;
+    }
+    set options(value) {
+        this._options = value.map(o => (Object.assign({}, o)));
+        if (this._isInitialized) {
+            this._adapter.setMenuOptions(value);
+        }
+    }
+}

package/esm/app-bar/help-button/app-bar-help-button.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @license
+ * Copyright 2022 Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { IMenuOption } from '../../menu';
+import { BaseComponent, IBaseComponent } from '../../core/base/base-component';
+export interface IAppBarHelpButtonComponent extends IBaseComponent {
+    options: IMenuOption[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'forge-app-bar-help-button': IAppBarHelpButtonComponent;
+    }
+}
+export declare class AppBarHelpButtonComponent extends BaseComponent implements IAppBarHelpButtonComponent {
+    private _foundation;
+    constructor();
+    initializedCallback(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    options: IMenuOption[];
+}