@ifsworld/granite-components 11.2.0 → 11.4.0

package/fesm2022/ifsworld-granite-components.mjs

@@ -4,7 +4,7 @@ import * as i1$1 from '@angular/common';
 import { CommonModule, DOCUMENT } from '@angular/common';
 import { coerceNumberProperty, coerceBooleanProperty } from '@angular/cdk/coercion';
 import { Subject, BehaviorSubject, combineLatest, Subscription, merge, of, asapScheduler, fromEvent } from 'rxjs';
-import { takeUntil, filter, map, startWith, switchMap, take, delay } from 'rxjs/operators';
+import { takeUntil, filter, map, startWith, switchMap, take, delay, debounceTime } from 'rxjs/operators';
 import { ComponentHarness, HarnessPredicate, TestKey } from '@angular/cdk/testing';
 import * as i1$2 from '@angular/cdk/overlay';
 import { OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
@@ -19,6 +19,8 @@ import * as i2 from '@angular/cdk/collections';
 import { SelectionModel } from '@angular/cdk/collections';
 import * as i2$1 from '@angular/forms';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import * as i3$1 from '@ifsworld/granite-components/tooltip';
+import { GraniteTooltipModule } from '@ifsworld/granite-components/tooltip';
 
 class GraniteArrangeGridItemComponent {
     constructor(element) {
@@ -870,6 +872,10 @@ class _MenuBaseComponent {
          * Event emitted when the menu is closed
          */
         this.closed = new EventEmitter();
+        /**
+         * Event emitted when the menu is opened
+         */
+        this.opened = new EventEmitter();
         /**
          * Used for locating the panel in tests and setting the aria-control attribute
          * for the menu trigger.
@@ -1139,7 +1145,7 @@ class _MenuBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: _MenuBaseComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: _MenuBaseComponent, inputs: { xPosition: "xPosition", yPosition: "yPosition", title: "title", closeLabel: "closeLabel", openOnHover: "openOnHover" }, outputs: { closed: "closed" }, queries: [{ propertyName: "_allItems", predicate: GraniteMenuItemComponent, descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: _MenuBaseComponent, inputs: { xPosition: "xPosition", yPosition: "yPosition", title: "title", closeLabel: "closeLabel", openOnHover: "openOnHover" }, outputs: { closed: "closed", opened: "opened" }, queries: [{ propertyName: "_allItems", predicate: GraniteMenuItemComponent, descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: _MenuBaseComponent, decorators: [{
             type: Directive
@@ -1161,6 +1167,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 args: [GraniteMenuItemComponent, { descendants: true }]
             }], closed: [{
                 type: Output
+            }], opened: [{
+                type: Output
             }] } });
 
 class GraniteMenuTouchCloseComponent {
@@ -1486,6 +1494,7 @@ class GraniteMenuTriggerForDirective {
         if (this._isMenuOpen) {
             return;
         }
+        this.openedEvent();
         this._checkMenu();
         this.menu.parentMenu = this.triggersSubmenu()
             ? this._parentMenu
@@ -1555,6 +1564,15 @@ class GraniteMenuTriggerForDirective {
         this._setIsMenuOpen(true);
         this.menu.focusFirstItem(this._openedBy || 'program');
     }
+    /** Emits an eventtype when the menu is opened */
+    openedEvent() {
+        if (this._openedBy === 'touch' || this._openedBy === 'mouse') {
+            this.menu.opened.emit('click');
+        }
+        else {
+            this.menu.opened.emit('keydown');
+        }
+    }
     /** Whether the menu triggers a sub-menu or a top-level one. */
     triggersSubmenu() {
         return !!(this._menuItemInstance && this._parentMenu);
@@ -3907,28 +3925,107 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }]
         }] });
 
+class GraniteHideOnOverflowDirective {
+    constructor(_elementRef, renderer) {
+        this._elementRef = _elementRef;
+        this.renderer = renderer;
+    }
+    ngAfterViewInit() {
+        this.hideOnOverflow();
+        this.observeResize();
+        this.observeContentChange();
+    }
+    ngOnDestroy() {
+        this.unObserveResize();
+        this.unObserveContentChange();
+    }
+    hideOnOverflow() {
+        const element = this._elementRef?.nativeElement;
+        if (element) {
+            const contentWidth = element.scrollWidth;
+            const containerWidth = element.clientWidth;
+            if (contentWidth > containerWidth) {
+                this.renderer.setStyle(element, 'visibility', 'hidden');
+            }
+            else {
+                this.renderer.removeStyle(element, 'visibility');
+            }
+        }
+    }
+    observeResize() {
+        if (window.ResizeObserver) {
+            const element = this._elementRef?.nativeElement;
+            if (element) {
+                this.resizeObserver = new ResizeObserver(() => this.hideOnOverflow());
+                this.resizeObserver.observe(element);
+            }
+        }
+        else {
+            this.subscribeToResize();
+        }
+    }
+    unObserveResize() {
+        if (this.resizeObserver) {
+            this.resizeObserver.disconnect();
+        }
+        if (this.resizeSubscription) {
+            this.resizeSubscription.unsubscribe();
+        }
+    }
+    subscribeToResize() {
+        this.resizeSubscription = fromEvent(window, 'resize')
+            .pipe(debounceTime(1000))
+            .subscribe(() => this.hideOnOverflow());
+    }
+    observeContentChange() {
+        const element = this._elementRef?.nativeElement;
+        if (element) {
+            this.mutationObserver = new MutationObserver(() => this.hideOnOverflow());
+            this.mutationObserver.observe(element, {
+                childList: true,
+                subtree: true,
+                characterData: true,
+            });
+        }
+    }
+    unObserveContentChange() {
+        if (this.mutationObserver) {
+            this.mutationObserver.disconnect();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteHideOnOverflowDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: GraniteHideOnOverflowDirective, selector: "[graniteHideOnOverflow]", exportAs: ["graniteHideOnOverflow"], ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteHideOnOverflowDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[graniteHideOnOverflow]',
+                    exportAs: 'graniteHideOnOverflow',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; } });
+
 class GraniteProgressBarComponent {
     constructor() {
         this.progressBarData = [];
         this.showLabel = false;
         this.DEFAULT_TOTAL = 100;
-        this.DEFAULT_BACKGROUND = '--granite-color-background-hover';
-        this.DEFAULT_STACK_COLOR = '--granite-color-signal-ok';
+        this.DEFAULT_BACKGROUND = '--granite-color-background-selected';
+        this.DEFAULT_STACK_COLOR = '--granite-color-categorical-3';
         this.DEFAULT_COLOR = '--granite-color-text';
         this.total = this.DEFAULT_TOTAL;
     }
     getBackgroundColor() {
         return this.getColorVar(this.DEFAULT_BACKGROUND);
     }
-    getStackColor(color) {
+    getFontColor(color) {
         return color
             ? this.getColorVar(color)
-            : this.getColorVar(this.DEFAULT_STACK_COLOR);
+            : this.getColorVar(this.DEFAULT_COLOR);
     }
-    getFontColor(color) {
+    getStackColor(color) {
         return color
             ? this.getColorVar(color)
-            : this.getColorVar(this.DEFAULT_COLOR);
+            : this.getColorVar(this.DEFAULT_STACK_COLOR);
     }
     getColorVar(color) {
         return color?.startsWith('--granite') ? `var(${color})` : color;
@@ -3956,31 +4053,17 @@ class GraniteProgressBarComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GraniteProgressBarComponent, selector: "granite-progress-bar", inputs: { progressBarData: "progressBarData", showLabel: "showLabel" }, exportAs: ["graniteProgressBar"], usesOnChanges: true, ngImport: i0, template: "<div\n  role=\"progressbar\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  class=\"progress\"\n  [style.background-color]=\"getBackgroundColor()\"\n>\n  <div\n    *ngFor=\"let bar of progressBarData; let i = index\"\n    [style.background-color]=\"getStackColor(bar.backgroundColor)\"\n    [style.width]=\"getStringOfWidth(getWidth(bar.value))\"\n    [style.color]=\"getFontColor(bar.foregroundColor)\"\n    [title]=\"bar.label\"\n    class=\"progress-bar\"\n  >\n    <label *ngIf=\"showLabel\">{{ bar.valueLabel }}</label>\n  </div>\n</div>\n", styles: [":host{width:100%;height:.5rem;line-height:.5rem;box-sizing:border-box;font-size:.25rem;border-radius:var(--granite-radius-s)}.progress{display:flex;width:inherit;height:inherit;overflow:hidden;border-radius:inherit;background-color:var(--granite-color-background-hover)}.progress-bar{display:flex;align-items:center;box-sizing:border-box;width:inherit;height:inherit;line-height:inherit;font-size:inherit;vertical-align:middle;text-overflow:ellipsis;white-space:nowrap;color:var(--granite-color-text);overflow:hidden;text-align:center;justify-content:center}.progress-bar:last-child{justify-content:flex-end;padding-inline-end:var(--granite-spacing-16)}.progress-bar:first-child{justify-content:flex-start;padding-inline-start:var(--granite-spacing-16)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GraniteProgressBarComponent, selector: "granite-progress-bar", inputs: { progressBarData: "progressBarData", showLabel: "showLabel" }, exportAs: ["graniteProgressBar"], usesOnChanges: true, ngImport: i0, template: "<div\n  role=\"progressbar\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  class=\"progress\"\n  [style.background-color]=\"getBackgroundColor()\"\n>\n  <div\n    *ngFor=\"let bar of progressBarData; let i = index\"\n    [style.background-color]=\"getStackColor(bar.backgroundColor)\"\n    [style.width]=\"getStringOfWidth(getWidth(bar.value))\"\n    [style.color]=\"getFontColor(bar.foregroundColor)\"\n    [graniteTooltipTriggerFor]=\"tooltip\"\n    class=\"progress-bar\"\n  >\n    <label *ngIf=\"showLabel\" graniteHideOnOverflow>{{ bar.valueLabel }}</label>\n    <granite-tooltip #tooltip> {{ bar.valueLabel }} </granite-tooltip>\n  </div>\n</div>\n", styles: [":host{width:100%;height:.5rem;line-height:.5rem;box-sizing:border-box;border-radius:var(--granite-radius-s);font-size:.25rem}.progress{display:flex;width:inherit;height:inherit;overflow:hidden;border-radius:inherit;background-color:var(--granite-color-background-selected)}.progress-bar{display:flex;align-items:center;box-sizing:border-box;width:inherit;height:inherit;line-height:inherit;font-size:inherit;vertical-align:middle;text-overflow:ellipsis;white-space:nowrap;color:var(--granite-color-text);overflow:hidden;text-align:center;justify-content:center}.progress-bar label{width:100%}.progress-bar:last-child{justify-content:flex-end;text-align:end;padding-inline-end:var(--granite-spacing-16)}.progress-bar:first-child{justify-content:flex-start;text-align:start;padding-inline-start:var(--granite-spacing-16)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: GraniteHideOnOverflowDirective, selector: "[graniteHideOnOverflow]", exportAs: ["graniteHideOnOverflow"] }, { kind: "component", type: i3$1.GraniteTooltipComponent, selector: "granite-tooltip" }, { kind: "directive", type: i3$1.GraniteTooltipTriggerForDirective, selector: "[graniteTooltipTriggerFor]", inputs: ["graniteTooltipTriggerFor", "hideDelay", "showDelay", "showOnKeyboardFocus", "showOnClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'granite-progress-bar', exportAs: 'graniteProgressBar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  role=\"progressbar\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  class=\"progress\"\n  [style.background-color]=\"getBackgroundColor()\"\n>\n  <div\n    *ngFor=\"let bar of progressBarData; let i = index\"\n    [style.background-color]=\"getStackColor(bar.backgroundColor)\"\n    [style.width]=\"getStringOfWidth(getWidth(bar.value))\"\n    [style.color]=\"getFontColor(bar.foregroundColor)\"\n    [title]=\"bar.label\"\n    class=\"progress-bar\"\n  >\n    <label *ngIf=\"showLabel\">{{ bar.valueLabel }}</label>\n  </div>\n</div>\n", styles: [":host{width:100%;height:.5rem;line-height:.5rem;box-sizing:border-box;font-size:.25rem;border-radius:var(--granite-radius-s)}.progress{display:flex;width:inherit;height:inherit;overflow:hidden;border-radius:inherit;background-color:var(--granite-color-background-hover)}.progress-bar{display:flex;align-items:center;box-sizing:border-box;width:inherit;height:inherit;line-height:inherit;font-size:inherit;vertical-align:middle;text-overflow:ellipsis;white-space:nowrap;color:var(--granite-color-text);overflow:hidden;text-align:center;justify-content:center}.progress-bar:last-child{justify-content:flex-end;padding-inline-end:var(--granite-spacing-16)}.progress-bar:first-child{justify-content:flex-start;padding-inline-start:var(--granite-spacing-16)}\n"] }]
+            args: [{ selector: 'granite-progress-bar', exportAs: 'graniteProgressBar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  role=\"progressbar\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"100\"\n  class=\"progress\"\n  [style.background-color]=\"getBackgroundColor()\"\n>\n  <div\n    *ngFor=\"let bar of progressBarData; let i = index\"\n    [style.background-color]=\"getStackColor(bar.backgroundColor)\"\n    [style.width]=\"getStringOfWidth(getWidth(bar.value))\"\n    [style.color]=\"getFontColor(bar.foregroundColor)\"\n    [graniteTooltipTriggerFor]=\"tooltip\"\n    class=\"progress-bar\"\n  >\n    <label *ngIf=\"showLabel\" graniteHideOnOverflow>{{ bar.valueLabel }}</label>\n    <granite-tooltip #tooltip> {{ bar.valueLabel }} </granite-tooltip>\n  </div>\n</div>\n", styles: [":host{width:100%;height:.5rem;line-height:.5rem;box-sizing:border-box;border-radius:var(--granite-radius-s);font-size:.25rem}.progress{display:flex;width:inherit;height:inherit;overflow:hidden;border-radius:inherit;background-color:var(--granite-color-background-selected)}.progress-bar{display:flex;align-items:center;box-sizing:border-box;width:inherit;height:inherit;line-height:inherit;font-size:inherit;vertical-align:middle;text-overflow:ellipsis;white-space:nowrap;color:var(--granite-color-text);overflow:hidden;text-align:center;justify-content:center}.progress-bar label{width:100%}.progress-bar:last-child{justify-content:flex-end;text-align:end;padding-inline-end:var(--granite-spacing-16)}.progress-bar:first-child{justify-content:flex-start;text-align:start;padding-inline-start:var(--granite-spacing-16)}\n"] }]
         }], propDecorators: { progressBarData: [{
                 type: Input
             }], showLabel: [{
                 type: Input
             }] } });
 
-class GraniteProgressBarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarModule, declarations: [GraniteProgressBarComponent], imports: [CommonModule], exports: [GraniteProgressBarComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarModule, imports: [CommonModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [GraniteProgressBarComponent],
-                    exports: [GraniteProgressBarComponent],
-                    imports: [CommonModule],
-                }]
-        }] });
-
 /**
  * Directive used to tell components and their sub components that client output
  * should be adapted for desktop devices like personal computers.
@@ -4091,10 +4174,12 @@ class GraniteCoreModule {
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: GraniteCoreModule, declarations: [ClientOutputDesktopDirective,
             ClientOutputTouchDirective,
             ClientInputDesktopDirective,
-            ClientInputTouchDirective], exports: [ClientOutputDesktopDirective,
+            ClientInputTouchDirective,
+            GraniteHideOnOverflowDirective], exports: [ClientOutputDesktopDirective,
             ClientOutputTouchDirective,
             ClientInputDesktopDirective,
-            ClientInputTouchDirective] }); }
+            ClientInputTouchDirective,
+            GraniteHideOnOverflowDirective] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteCoreModule }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteCoreModule, decorators: [{
@@ -4105,16 +4190,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         ClientOutputTouchDirective,
                         ClientInputDesktopDirective,
                         ClientInputTouchDirective,
+                        GraniteHideOnOverflowDirective,
                     ],
                     exports: [
                         ClientOutputDesktopDirective,
                         ClientOutputTouchDirective,
                         ClientInputDesktopDirective,
                         ClientInputTouchDirective,
+                        GraniteHideOnOverflowDirective,
                     ],
                 }]
         }] });
 
+class GraniteProgressBarModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarModule, declarations: [GraniteProgressBarComponent], imports: [CommonModule, GraniteCoreModule, GraniteTooltipModule], exports: [GraniteProgressBarComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarModule, imports: [CommonModule, GraniteCoreModule, GraniteTooltipModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GraniteProgressBarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [GraniteProgressBarComponent],
+                    exports: [GraniteProgressBarComponent],
+                    imports: [CommonModule, GraniteCoreModule, GraniteTooltipModule],
+                }]
+        }] });
+
 class GraniteTitlePipe {
     transform(value) {
         const words = value.split(/(?=[A-Z ])/);
@@ -4311,5 +4412,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ButtonSelectors, ClientInputDesktopDirective, ClientInputTouchDirective, ClientOutputDesktopDirective, ClientOutputTouchDirective, GRANITE_CLIENT_INPUT, GRANITE_CLIENT_OUTPUT, GraniteAnchorComponent, GraniteArrangeGridComponent, GraniteArrangeGridItemComponent, GraniteArrangeGridModule, GraniteArrangeGridOrientation, GraniteBadgeComponent, GraniteBadgeHarness, GraniteBadgeModule, GraniteButtonComponent, GraniteButtonModule, GraniteCardActionsComponent, GraniteCardAvatarComponent, GraniteCardBodyComponent, GraniteCardComponent, GraniteCardContentComponent, GraniteCardFooterComponent, GraniteCardHeaderComponent, GraniteCardHeaderSubTitleComponent, GraniteCardHeaderTitleComponent, GraniteCardListComponent, GraniteCardListModule, GraniteCheckboxComponent, GraniteCheckboxGroupComponent, GraniteCheckboxModule, GraniteChipComponent, GraniteChipInputDirective, GraniteChipListComponent, GraniteChipSelectionChangeEvent, GraniteChipsModule, GraniteCoreModule, GraniteDividerDirective, GraniteGridComponent, GraniteGridItemComponent, GraniteGridModule, GraniteIconComponent, GraniteIconModule, GraniteInputFieldComponent, GraniteInputFieldModule, GraniteLabelComponent, GraniteLabelModule, GraniteMenuComponent, GraniteMenuHarness, GraniteMenuItemComponent, GraniteMenuItemHarness, GraniteMenuModule, GraniteMenuTouchCloseComponent, GraniteMenuTouchTitleItemComponent, GraniteMenuTriggerForDirective, GraniteProgressBarComponent, GraniteProgressBarModule, GraniteRadioButtonComponent, GraniteRadioButtonModule, GraniteRadioGroupComponent, GraniteTitleDirective, GraniteTitlePipe, GraniteToggleSwitchComponent, GraniteToggleSwitchModule, PurePipesModule, deviceDesktop, deviceTouch, disabledMixin, graniteMenuDesktopAnimations, graniteMenuTouchAnimations };
+export { ButtonSelectors, ClientInputDesktopDirective, ClientInputTouchDirective, ClientOutputDesktopDirective, ClientOutputTouchDirective, GRANITE_CLIENT_INPUT, GRANITE_CLIENT_OUTPUT, GraniteAnchorComponent, GraniteArrangeGridComponent, GraniteArrangeGridItemComponent, GraniteArrangeGridModule, GraniteArrangeGridOrientation, GraniteBadgeComponent, GraniteBadgeHarness, GraniteBadgeModule, GraniteButtonComponent, GraniteButtonModule, GraniteCardActionsComponent, GraniteCardAvatarComponent, GraniteCardBodyComponent, GraniteCardComponent, GraniteCardContentComponent, GraniteCardFooterComponent, GraniteCardHeaderComponent, GraniteCardHeaderSubTitleComponent, GraniteCardHeaderTitleComponent, GraniteCardListComponent, GraniteCardListModule, GraniteCheckboxComponent, GraniteCheckboxGroupComponent, GraniteCheckboxModule, GraniteChipComponent, GraniteChipInputDirective, GraniteChipListComponent, GraniteChipSelectionChangeEvent, GraniteChipsModule, GraniteCoreModule, GraniteDividerDirective, GraniteGridComponent, GraniteGridItemComponent, GraniteGridModule, GraniteHideOnOverflowDirective, GraniteIconComponent, GraniteIconModule, GraniteInputFieldComponent, GraniteInputFieldModule, GraniteLabelComponent, GraniteLabelModule, GraniteMenuComponent, GraniteMenuHarness, GraniteMenuItemComponent, GraniteMenuItemHarness, GraniteMenuModule, GraniteMenuTouchCloseComponent, GraniteMenuTouchTitleItemComponent, GraniteMenuTriggerForDirective, GraniteProgressBarComponent, GraniteProgressBarModule, GraniteRadioButtonComponent, GraniteRadioButtonModule, GraniteRadioGroupComponent, GraniteTitleDirective, GraniteTitlePipe, GraniteToggleSwitchComponent, GraniteToggleSwitchModule, PurePipesModule, deviceDesktop, deviceTouch, disabledMixin, graniteMenuDesktopAnimations, graniteMenuTouchAnimations };
 //# sourceMappingURL=ifsworld-granite-components.mjs.map