@tylertech/forge 3.12.1 → 3.13.1

package/esm/expansion-panel/expansion-panel-adapter.d.ts

@@ -4,9 +4,11 @@
  * License: Apache-2.0
  */
 import { BaseAdapter, IBaseAdapter } from '../core/base/base-adapter';
+import { IOpenIconComponent } from '../open-icon';
 import { IExpansionPanelComponent } from './expansion-panel';
 export interface IExpansionPanelAdapter extends IBaseAdapter {
     readonly triggerElement?: HTMLElement | null;
+    readonly openIcon?: IOpenIconComponent | null;
     setAnimationCompleteListener(listener: () => void): void;
     addContentSlotListener(listener: EventListener): void;
     addHeaderListener(type: keyof HTMLElementEventMap, listener: EventListener): void;
@@ -20,6 +22,8 @@ export interface IExpansionPanelAdapter extends IBaseAdapter {
     animationEnd(): void;
     setTriggerElementById(id: string): void;
     setTriggerElement(el?: HTMLElement | null): void;
+    setOpenIconById(id: string): void;
+    setOpenIcon(openIcon?: IOpenIconComponent | null): void;
     setContentId(): void;
     updateAriaControls(): void;
     updateAriaExpanded(open: boolean): void;
@@ -32,15 +36,18 @@ export declare class ExpansionPanelAdapter extends BaseAdapter<IExpansionPanelCo
     private _defaultSlotElement;
     private _triggerListenerController;
     private _triggerElement?;
+    private _openIcon?;
     private _transitionStartListener;
     private _transitionEndListener;
     private _transitionCompleteListener;
     constructor(component: IExpansionPanelComponent);
     get triggerElement(): HTMLElement | null | undefined;
+    get openIcon(): IOpenIconComponent | null | undefined;
     private get _slottedContentElement();
     private set _slottedContentId(value);
     private get _slottedContentId();
     setTriggerElementById(id: string): void;
+    setOpenIconById(id: string): void;
     setAnimationCompleteListener(listener: () => void): void;
     addContentSlotListener(listener: EventListener): void;
     addHeaderListener(type: keyof HTMLElementEventMap, listener: EventListener): void;
@@ -55,9 +62,11 @@ export declare class ExpansionPanelAdapter extends BaseAdapter<IExpansionPanelCo
     animationStart(): void;
     animationEnd(): void;
     setTriggerElement(el: HTMLElement | null): void;
+    setOpenIcon(openIcon: IOpenIconComponent | null): void;
     setContentId(): void;
     updateAriaControls(): void;
     updateAriaExpanded(open: boolean): void;
     detachTriggerAria(): void;
     private _getTriggerElementById;
+    private _getOpenIconElementById;
 }

package/esm/expansion-panel/expansion-panel-adapter.js

@@ -5,6 +5,7 @@
  */
 import { getShadowElement, randomChars, toggleAttribute } from '@tylertech/forge-core';
 import { BaseAdapter } from '../core/base/base-adapter';
+import { OPEN_ICON_CONSTANTS } from '../open-icon';
 import { EXPANSION_PANEL_CONSTANTS } from './expansion-panel-constants';
 export class ExpansionPanelAdapter extends BaseAdapter {
     constructor(component) {
@@ -19,6 +20,9 @@ export class ExpansionPanelAdapter extends BaseAdapter {
     get triggerElement() {
         return this._triggerElement;
     }
+    get openIcon() {
+        return this._openIcon;
+    }
     get _slottedContentElement() {
         return this._defaultSlotElement.assignedElements({ flatten: true })[0];
     }
@@ -31,6 +35,9 @@ export class ExpansionPanelAdapter extends BaseAdapter {
     setTriggerElementById(id) {
         this._triggerElement = this._getTriggerElementById(id);
     }
+    setOpenIconById(id) {
+        this._openIcon = this._getOpenIconElementById(id);
+    }
     setAnimationCompleteListener(listener) {
         this._transitionCompleteListener = listener;
         this._contentElement.addEventListener('transitionstart', this._transitionStartListener);
@@ -52,9 +59,14 @@ export class ExpansionPanelAdapter extends BaseAdapter {
         this._triggerElement?.addEventListener(type, listener, { signal: this._triggerListenerController.signal });
     }
     tryToggleOpenIcon(value) {
-        const openIconElement = this._component.querySelector(EXPANSION_PANEL_CONSTANTS.selectors.OPEN_ICON);
-        if (openIconElement) {
-            openIconElement.open = value;
+        const internalOpenIcon = this._component.querySelector(EXPANSION_PANEL_CONSTANTS.selectors.OPEN_ICON);
+        const triggerOpenIcon = this._triggerElement?.querySelector(OPEN_ICON_CONSTANTS.elementName);
+        const externalOpenIcon = this._openIcon;
+        const openIcons = [internalOpenIcon, triggerOpenIcon, externalOpenIcon];
+        for (const openIcon of openIcons) {
+            if (openIcon) {
+                openIcon.open = value;
+            }
         }
     }
     setContentVisibility(visible) {
@@ -80,6 +92,9 @@ export class ExpansionPanelAdapter extends BaseAdapter {
     setTriggerElement(el) {
         this._triggerElement = el;
     }
+    setOpenIcon(openIcon) {
+        this._openIcon = openIcon;
+    }
     setContentId() {
         if (!this._slottedContentId) {
             this._slottedContentId = `forge-expansion-panel-content-${randomChars()}`;
@@ -108,4 +123,17 @@ export class ExpansionPanelAdapter extends BaseAdapter {
             return null;
         }
     }
+    _getOpenIconElementById(id) {
+        if (id && this.isConnected) {
+            const rootNode = this._component.getRootNode();
+            const el = rootNode.getElementById(id);
+            if (el?.tagName.toLocaleLowerCase() === OPEN_ICON_CONSTANTS.elementName) {
+                return el;
+            }
+            return null;
+        }
+        else {
+            return null;
+        }
+    }
 }

package/esm/expansion-panel/expansion-panel-constants.d.ts

@@ -10,6 +10,7 @@ export declare const EXPANSION_PANEL_CONSTANTS: {
         ORIENTATION: string;
         ANIMATION_TYPE: string;
         TRIGGER: string;
+        OPEN_ICON: string;
     };
     attributes: {
         OPENING: string;
@@ -17,6 +18,7 @@ export declare const EXPANSION_PANEL_CONSTANTS: {
         ORIENTATION: string;
         ANIMATION_TYPE: string;
         TRIGGER: string;
+        OPEN_ICON: string;
     };
     classes: {
         HIDDEN: string;

package/esm/expansion-panel/expansion-panel-constants.js

@@ -10,7 +10,8 @@ const observedAttributes = {
     OPEN: 'open',
     ORIENTATION: 'orientation',
     ANIMATION_TYPE: 'animation-type',
-    TRIGGER: 'trigger'
+    TRIGGER: 'trigger',
+    OPEN_ICON: 'open-icon'
 };
 const attributes = {
     ...observedAttributes,

package/esm/expansion-panel/expansion-panel-core.d.ts

@@ -3,6 +3,7 @@
  * Copyright Tyler Technologies, Inc. 
  * License: Apache-2.0
  */
+import { IOpenIconComponent } from '../open-icon';
 import { IExpansionPanelAdapter } from './expansion-panel-adapter';
 import { ExpansionPanelAnimationType, ExpansionPanelOrientation } from './expansion-panel-constants';
 export interface IExpansionPanelCore {
@@ -19,6 +20,7 @@ export declare class ExpansionPanelCore implements IExpansionPanelCore {
     private _orientation;
     private _animationType;
     private _trigger;
+    private _openIcon;
     private _clickListener;
     private _keydownListener;
     private _keyupListener;
@@ -30,6 +32,7 @@ export declare class ExpansionPanelCore implements IExpansionPanelCore {
     private _handleContentSlotChange;
     private _clearTrigger;
     private _syncTrigger;
+    private _syncOpenIcon;
     private _onClick;
     private _onKeydown;
     private _onKeyup;
@@ -49,4 +52,8 @@ export declare class ExpansionPanelCore implements IExpansionPanelCore {
     set trigger(value: string);
     get triggerElement(): HTMLElement | null | undefined;
     set triggerElement(el: HTMLElement | null | undefined);
+    get openIcon(): string;
+    set openIcon(value: string);
+    get openIconElement(): IOpenIconComponent | null | undefined;
+    set openIconElement(openIcon: IOpenIconComponent | null | undefined);
 }

package/esm/expansion-panel/expansion-panel-core.js

@@ -12,6 +12,7 @@ export class ExpansionPanelCore {
         this._orientation = 'vertical';
         this._animationType = 'default';
         this._trigger = '';
+        this._openIcon = '';
         this._clickListener = this._onClick.bind(this);
         this._keydownListener = this._onKeydown.bind(this);
         this._keyupListener = this._onKeyup.bind(this);
@@ -27,11 +28,13 @@ export class ExpansionPanelCore {
         this._adapter.setContentId();
         await frame();
         this._syncTrigger();
+        this._syncOpenIcon();
     }
     destroy() {
         this._adapter.detachTriggerAria();
         this._adapter.removeTriggerListeners();
         this._adapter.setTriggerElement(undefined);
+        this._adapter.setOpenIcon(undefined);
     }
     _handleContentSlotChange() {
         this._adapter.setContentId();
@@ -58,6 +61,16 @@ export class ExpansionPanelCore {
         this._adapter.addTriggerListener('keydown', this._keydownListener);
         this._adapter.addTriggerListener('keyup', this._keyupListener);
     }
+    _syncOpenIcon() {
+        if (!this._adapter.openIcon?.isConnected) {
+            if (this._openIcon) {
+                this._adapter.setOpenIconById(this._openIcon);
+            }
+            else {
+                this._adapter.setOpenIcon(undefined);
+            }
+        }
+    }
     _onClick(evt) {
         this._tryToggle(evt);
     }
@@ -162,4 +175,21 @@ export class ExpansionPanelCore {
             this._syncTrigger();
         }
     }
+    get openIcon() {
+        return this._openIcon;
+    }
+    set openIcon(value) {
+        if (this._openIcon !== value) {
+            this._openIcon = value;
+            this._syncOpenIcon();
+        }
+    }
+    get openIconElement() {
+        return this._adapter.openIcon;
+    }
+    set openIconElement(openIcon) {
+        if (this._adapter.openIcon !== openIcon) {
+            this._adapter.setOpenIcon(openIcon);
+        }
+    }
 }

package/esm/expansion-panel/expansion-panel.d.ts

@@ -5,12 +5,15 @@
  */
 import { BaseComponent, IBaseComponent } from '../core/base/base-component';
 import { ExpansionPanelAnimationType, ExpansionPanelOrientation, emulateUserToggle } from './expansion-panel-constants';
+import { IOpenIconComponent } from '../open-icon';
 export interface IExpansionPanelComponent extends IBaseComponent {
     open: boolean;
     orientation: ExpansionPanelOrientation;
     animationType: ExpansionPanelAnimationType;
     trigger: string;
     triggerElement: HTMLElement | null;
+    openIcon: string;
+    openIconElement: IOpenIconComponent | null;
     toggle(): void;
     [emulateUserToggle](open: boolean): void;
 }
@@ -31,13 +34,16 @@ declare global {
  * @property {boolean} [open=false] - Whether the panel is open or closed.
  * @property {ExpansionPanelOrientation} [orientation="vertical"] - The orientation of the panel.
  * @property {ExpansionPanelAnimationType} [animationType="default"] - The type of animation to use when opening/closing the panel.
- * @property {string} trigger - The id of the element that the expansion panel should be toggled by.
- * @property {HTMLElement | null} triggerElement - The element that the expansion panel should be toggled by.
+ * @property {string} trigger - The id of the button that the expansion panel should be toggled by.
+ * @property {HTMLElement | null} triggerElement - The button that the expansion panel should be toggled by.
+ * @property {string} openIcon - The id of the `<forge-open-icon>` that the expansion panel should toggle.
+ * @property {IOpenIconComponent | null} openIconElement - The `<forge-open-icon>` that the expansion panel should toggle.
  *
  * @attribute {boolean} [open=false] - Whether the panel is open or closed.
  * @attribute {ExpansionPanelOrientation} [orientation="vertical"] - The orientation of the panel.
  * @attribute {ExpansionPanelAnimationType} [animation-type="default"] - The type of animation to use when opening/closing the panel.
- * @attribute {string} [trigger] - The id of the button that the expansion panel is associated with.
+ * @attribute {string} [trigger] - The id of the button that the expansion panel should be toggled by.
+ * @attribute {string} [open-icon] - The id of the `<forge-open-icon>` that the expansion panel should toggle.
  *
  * @fires {CustomEvent<boolean>} forge-expansion-panel-toggle - Event fired when the panel is toggled open or closed.
  * @fires {CustomEvent<boolean>} forge-expansion-panel-animation-complete - Event fired when the panel has finished animating when toggling.
@@ -68,6 +74,8 @@ export declare class ExpansionPanelComponent extends BaseComponent implements IE
     animationType: ExpansionPanelAnimationType;
     trigger: string;
     triggerElement: HTMLElement | null;
+    openIcon: string;
+    openIconElement: IOpenIconComponent | null;
     /**
      * Toggles the open state of the panel.
      */

package/esm/expansion-panel/expansion-panel.js

@@ -19,13 +19,16 @@ const styles = ':host{display:block}:host([hidden]){display:none}.forge-expansio
  * @property {boolean} [open=false] - Whether the panel is open or closed.
  * @property {ExpansionPanelOrientation} [orientation="vertical"] - The orientation of the panel.
  * @property {ExpansionPanelAnimationType} [animationType="default"] - The type of animation to use when opening/closing the panel.
- * @property {string} trigger - The id of the element that the expansion panel should be toggled by.
- * @property {HTMLElement | null} triggerElement - The element that the expansion panel should be toggled by.
+ * @property {string} trigger - The id of the button that the expansion panel should be toggled by.
+ * @property {HTMLElement | null} triggerElement - The button that the expansion panel should be toggled by.
+ * @property {string} openIcon - The id of the `<forge-open-icon>` that the expansion panel should toggle.
+ * @property {IOpenIconComponent | null} openIconElement - The `<forge-open-icon>` that the expansion panel should toggle.
  *
  * @attribute {boolean} [open=false] - Whether the panel is open or closed.
  * @attribute {ExpansionPanelOrientation} [orientation="vertical"] - The orientation of the panel.
  * @attribute {ExpansionPanelAnimationType} [animation-type="default"] - The type of animation to use when opening/closing the panel.
- * @attribute {string} [trigger] - The id of the button that the expansion panel is associated with.
+ * @attribute {string} [trigger] - The id of the button that the expansion panel should be toggled by.
+ * @attribute {string} [open-icon] - The id of the `<forge-open-icon>` that the expansion panel should toggle.
  *
  * @fires {CustomEvent<boolean>} forge-expansion-panel-toggle - Event fired when the panel is toggled open or closed.
  * @fires {CustomEvent<boolean>} forge-expansion-panel-animation-complete - Event fired when the panel has finished animating when toggling.
@@ -72,6 +75,10 @@ let ExpansionPanelComponent = class ExpansionPanelComponent extends BaseComponen
                 break;
             case EXPANSION_PANEL_CONSTANTS.observedAttributes.TRIGGER:
                 this.trigger = newValue;
+                break;
+            case EXPANSION_PANEL_CONSTANTS.observedAttributes.OPEN_ICON:
+                this.openIcon = newValue;
+                break;
         }
     }
     /**
@@ -108,6 +115,12 @@ __decorate([
 __decorate([
     coreProperty()
 ], ExpansionPanelComponent.prototype, "triggerElement", void 0);
+__decorate([
+    coreProperty()
+], ExpansionPanelComponent.prototype, "openIcon", void 0);
+__decorate([
+    coreProperty()
+], ExpansionPanelComponent.prototype, "openIconElement", void 0);
 ExpansionPanelComponent = __decorate([
     customElement({
         name: EXPANSION_PANEL_CONSTANTS.elementName

package/esm/index.d.ts

@@ -68,6 +68,7 @@ export * from './time-picker';
 export * from './toast';
 export * from './toolbar';
 export * from './tooltip';
+export * from './tree';
 export * from './utils';
 export * from './view-switcher';
 /**

package/esm/index.js

@@ -73,6 +73,7 @@ import { defineTimePickerComponent } from './time-picker';
 import { defineToastComponent } from './toast';
 import { defineToolbarComponent } from './toolbar';
 import { defineTooltipComponent } from './tooltip';
+import { defineTreeComponent, defineTreeItemComponent } from './tree';
 import { defineViewComponent, defineViewSwitcherComponent } from './view-switcher';
 /**
  * Deprecated imports
@@ -144,6 +145,7 @@ export * from './time-picker';
 export * from './toast';
 export * from './toolbar';
 export * from './tooltip';
+export * from './tree';
 export * from './utils';
 export * from './view-switcher';
 /**
@@ -236,6 +238,8 @@ export function defineComponents() {
     defineToastComponent();
     defineToolbarComponent();
     defineTooltipComponent();
+    defineTreeComponent();
+    defineTreeItemComponent();
     defineViewComponent();
     defineViewSwitcherComponent();
 }

package/esm/paginator/paginator-adapter.d.ts

@@ -74,4 +74,5 @@ export declare class PaginatorAdapter extends BaseAdapter<IPaginatorComponent> i
     setFocus(options?: FocusOptions): void;
     tryDisableFields(fieldsToDisable: PaginatorFieldIdentifier[]): void;
     private _tryFocus;
+    private _setButtonEnabled;
 }

package/esm/paginator/paginator-adapter.js

@@ -73,16 +73,16 @@ export class PaginatorAdapter extends BaseAdapter {
         this._lastPageButton.addEventListener('click', listener);
     }
     setFirstPageButtonEnabled(enabled) {
-        this._firstPageButton.disabled = !enabled;
+        this._setButtonEnabled(this._firstPageButton, enabled);
     }
     setPreviousPageButtonEnabled(enabled) {
-        this._previousPageButton.disabled = !enabled;
+        this._setButtonEnabled(this._previousPageButton, enabled);
     }
     setNextPageButtonEnabled(enabled) {
-        this._nextPageButton.disabled = !enabled;
+        this._setButtonEnabled(this._nextPageButton, enabled);
     }
     setLastPageButtonEnabled(enabled) {
-        this._lastPageButton.disabled = !enabled;
+        this._setButtonEnabled(this._lastPageButton, enabled);
     }
     setPageSizeSelectEnabled(enabled) {
         this._pageSizeSelect.disabled = !enabled;
@@ -111,4 +111,15 @@ export class PaginatorAdapter extends BaseAdapter {
             }
         }
     }
+    _setButtonEnabled(btn, enabled) {
+        if (enabled) {
+            btn.removeAttribute('disabled');
+            btn.setAttribute('tabindex', '0');
+        }
+        else {
+            btn.setAttribute('disabled', 'true');
+            btn.setAttribute('tabindex', '-1');
+            btn.blur();
+        }
+    }
 }

package/esm/split-view/split-view-panel/split-view-panel.js

@@ -14,7 +14,7 @@ import { IconComponent, IconRegistry } from '../../icon';
 import { StateLayerComponent } from '../../state-layer';
 import { FocusIndicatorComponent } from '../../focus-indicator';
 const template = '<template><div class=\"forge-split-view-panel\" id=\"root\" part=\"root\"><div class=\"forge-split-view-panel__handle\" id=\"handle\" part=\"handle\" role=\"separator\" aria-controls=\"content\" aria-grabbed=\"false\" tabindex=\"0\"><forge-icon class=\"forge-split-view-panel__icon\" id=\"icon\" part=\"icon\"></forge-icon><forge-state-layer target=\"handle\" id=\"state-layer\" exportparts=\"surface:state-layer\"></forge-state-layer><forge-focus-indicator inward target=\"handle\" part=\"focus-indicator\"></forge-focus-indicator></div><div class=\"forge-split-view-panel__content\" id=\"content\" part=\"content\" role=\"group\"><slot></slot></div></div></template>';
-const styles = '.forge-split-view-panel{display:flex;width:100%;height:100%;overflow:hidden}.forge-split-view-panel__handle{color:var(--forge-theme-text-medium,rgba(0,0,0,.6));background-color:var(--forge-theme-outline,#e0e0e0);position:relative;display:flex;flex-shrink:0;justify-content:center;align-items:center;outline:0}.forge-split-view-panel__content{flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:u92tejo;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u92tejo{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;animation-name:u92tekj;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u92tekj{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:u92telg;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u92telg{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{animation-direction:reverse}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;animation-name:u92temf;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u92temf{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{animation-direction:reverse}.forge-split-view-panel[orientation=vertical]{min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:u92ten2;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u92ten2{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;animation-name:u92tenj;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u92tenj{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:u92teo3;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u92teo3{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{animation-direction:reverse}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;animation-name:u92teoz;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes u92teoz{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{animation-direction:reverse}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}forge-focus-indicator{--forge-focus-indicator-active-width:2px}';
+const styles = '.forge-split-view-panel{display:flex;width:100%;height:100%;overflow:hidden}.forge-split-view-panel__handle{color:var(--forge-theme-text-medium,rgba(0,0,0,.6));background-color:var(--forge-theme-outline,#e0e0e0);position:relative;display:flex;flex-shrink:0;justify-content:center;align-items:center;outline:0}.forge-split-view-panel__content{flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:ub0puv4;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ub0puv4{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;animation-name:ub0puvk;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ub0puvk{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:ub0puvr;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ub0puvr{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{animation-direction:reverse}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;animation-name:ub0puw1;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ub0puw1{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{animation-direction:reverse}.forge-split-view-panel[orientation=vertical]{min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:ub0puwd;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ub0puwd{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;animation-name:ub0puwx;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ub0puwx{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:ub0puxl;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ub0puxl{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{animation-direction:reverse}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;animation-name:ub0puxv;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes ub0puxv{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{animation-direction:reverse}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}forge-focus-indicator{--forge-focus-indicator-active-width:2px}';
 /**
  * @tag forge-split-view-panel
  *

package/esm/tree/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @license
+ * Copyright Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+export * from './tree';
+export * from './tree-item';

package/esm/tree/index.js

@@ -0,0 +1,7 @@
+/**
+ * @license
+ * Copyright Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+export * from './tree';
+export * from './tree-item';

package/esm/tree/tree/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @license
+ * Copyright Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+export * from './tree';
+export declare function defineTreeComponent(): void;

package/esm/tree/tree/index.js

@@ -0,0 +1,11 @@
+/**
+ * @license
+ * Copyright Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { tryDefine } from '@tylertech/forge-core';
+import { TreeComponent } from './tree';
+export * from './tree';
+export function defineTreeComponent() {
+    tryDefine('forge-tree', TreeComponent);
+}

package/esm/tree/tree/tree-selection-controller.d.ts

@@ -0,0 +1,104 @@
+/**
+ * @license
+ * Copyright Tyler Technologies, Inc. 
+ * License: Apache-2.0
+ */
+import { ReactiveController } from 'lit';
+import { TreeItemComponent } from '../tree-item';
+import { TreeComponent } from './tree';
+export interface ITreeItemSnapshot {
+    el: TreeItemComponent;
+    indeterminate: boolean;
+    open: boolean;
+    selected: boolean;
+}
+export declare class TreeSelectionController implements ReactiveController {
+    /**
+     * The tree component that the controller is attached to.
+     */
+    host: TreeComponent;
+    /**
+     * An array containing all selected tree items.
+     */
+    items: TreeItemComponent[];
+    /**
+     * An array containing the values of all selected tree items.
+     */
+    get value(): unknown[];
+    set value(value: unknown[]);
+    private _itemsBeingToggled;
+    private _updateListener;
+    constructor(host: TreeComponent);
+    hostConnected(): void;
+    hostDisconnected(): void;
+    /**
+     * Deselects items that are not allowed for a given selection mode
+     */
+    cleanup(): void;
+    /**
+     * Selects or deselects a tree item.
+     * @param item The tree item to toggle.
+     * @param force If true, the item will be selected. If false, the item will be deselected.
+     */
+    toggle(item: TreeItemComponent, force?: boolean): void;
+    /**
+     * Selects all tree items between the last selected item and the given item.
+     * @param item The end item to extend the selection to.
+     */
+    extend(item: TreeItemComponent): void;
+    /**
+     * Selects all tree items.
+     */
+    selectAll(): void;
+    /**
+     * Updates other items when an item is updated outside of the tree's interaction handlers.
+     * @param evt The update event emitted from a tree item.
+     */
+    private _handleUpdateEvent;
+    /**
+     * Selects or deselects the given tree item and updates the list of selected items to reflect
+     * the change.
+     * @param item The item to select or deselect.
+     * @param changes The original state of all changed tree items.
+     */
+    private _updateSelectionsFromItem;
+    /**
+     * Sets the selected state of all children of the given item.
+     * @param item The item that was selected or deselected.
+     * @param changes The original state of all changed tree items.
+     * @returns The updated snapshot of all changed tree items.
+     */
+    private _updateDescendentSelections;
+    /**
+     * Sets ancestor items of the given item to selected, deselected, or indeterminate based on the
+     * state of the item.
+     * @param item The item that was selected or deselected.
+     * @param changes The original state of all changed tree items.
+     * @return The updated snapshot of all changed tree items.
+     */
+    private _updateAncestorSelections;
+    /**
+     * Adds a tree item to a snapshot of all changed tree items.
+     * @param item The tree item.
+     * @param snapshot The snapshot of all changed tree items.
+     * @param options Properties of the tree item to change if it already exists in the snapshot.
+     */
+    private _addToSnapshot;
+    /**
+     * Restores the state of all changed tree items from a snapshot.
+     * @param snapshot An array containing the original state of all changed tree items.
+     */
+    private _restoreSnapshot;
+    /**
+     * Clears the indeterminate state of all tree items.
+     * @param items An optional array of items to clear the indeterminate state of.
+     */
+    private _clearIndeterminate;
+    /**
+     * Sets a tree item's selected state and adds it to the set of items being toggled to prevent the
+     * event from being handled twice.
+     * @param item The item to select or deselect.
+     * @param force If true, the item will be selected. If false, the item will be deselected.
+     */
+    private _selectItem;
+}