@dereekb/dbx-web 13.0.4 → 13.0.5

package/fesm2022/dereekb-dbx-web.mjs

@@ -35,14 +35,15 @@ import { Actions, createEffect, ofType, provideEffects } from '@ngrx/effects';
 import { capitalCase } from 'change-case-all';
 import { Clipboard } from '@angular/cdk/clipboard';
 import { BlobWriter, ZipReader, BlobReader } from '@zip.js/zip.js';
+import { MediaMatcher } from '@angular/cdk/layout';
 import * as i1$3 from '@angular/material/toolbar';
 import { MatToolbarModule } from '@angular/material/toolbar';
-import { MediaMatcher } from '@angular/cdk/layout';
 import { MatTabNav, MatTabNavPanel, MatTabLink } from '@angular/material/tabs';
 import * as i1$4 from '@angular/material/sidenav';
 import { MatSidenav, MatSidenavModule } from '@angular/material/sidenav';
 import * as i1$5 from '@uirouter/angular';
 import { UIRouterModule } from '@uirouter/angular';
+import { MatAccordion, MatExpansionPanel, MatExpansionPanelHeader, MatExpansionPanelTitle, MatExpansionPanelDescription, MatExpansionPanelContent } from '@angular/material/expansion';
 import { MatRipple } from '@angular/material/core';
 import * as i1$7 from '@ngbracket/ngx-layout/grid';
 import { InfiniteScrollDirective } from 'ngx-infinite-scroll';
@@ -51,7 +52,6 @@ import * as i1$8 from '@angular/material/chips';
 import { MatChipsModule } from '@angular/material/chips';
 import * as i2$1 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import { MatExpansionPanel, MatExpansionPanelHeader, MatExpansionPanelTitle, MatExpansionPanelDescription, MatExpansionPanelContent, MatAccordion } from '@angular/material/expansion';
 
 class PopoverPositionStrategy {
     static make(overlay, elementRef, config) {
@@ -6476,6 +6476,226 @@ function dbxZipBlobPreviewEntryTreeFromEntries(entries) {
     return slashPathDirectoryTree(nodeValues);
 }
 
+const SCREEN_MEDIA_WIDTH_TYPE_SIZE_MAP = {
+    micro: 0,
+    small: 1,
+    tablet: 2,
+    large: 3,
+    full: 4
+};
+/**
+ * Compares the breakpoint with the current width and determines if it is "active" or not.
+ *
+ * The current is considered active if it is bigger or equal to the breakpoint.
+ *
+ * @param current
+ * @param breakpoint
+ */
+function screenMediaWidthTypeIsActive(current, breakpoint) {
+    return compareScreenMediaWidthTypes(current, breakpoint, (a, b) => a >= b);
+}
+function compareScreenMediaWidthTypes(a, b, compare) {
+    return compare(SCREEN_MEDIA_WIDTH_TYPE_SIZE_MAP[a], SCREEN_MEDIA_WIDTH_TYPE_SIZE_MAP[b]);
+}
+
+/**
+ * ScreenMediaService configuration.
+ */
+class DbxScreenMediaServiceConfig {
+}
+const DEFAULT_SCREEN_MEDIA_SERVICE_CONFIG = {
+    microScreenWidthMax: 360,
+    smallScreenWidthMax: 520,
+    tabletScreenWidthMax: 786,
+    largeScreenWidthMax: 1280,
+    tinyScreenHeightMax: 280
+};
+/**
+ * Service that emits the current view type based on the configuration.
+ */
+class DbxScreenMediaService {
+    _media = inject(MediaMatcher);
+    _microQuery;
+    _smallQuery;
+    _tabletQuery;
+    _largeQuery;
+    _tinyHeightQuery;
+    _updateWidth = new Subject();
+    _updateHeight = new Subject();
+    widthType$ = this._updateWidth.pipe(initialize(() => this._updateWidth.next()), throttleTime(100, undefined, { leading: true, trailing: true }), map(() => this._readWidthType()), distinctUntilChanged(), shareReplay(1));
+    heightType$ = this._updateWidth.pipe(initialize(() => this._updateHeight.next()), throttleTime(100, undefined, { leading: true, trailing: true }), map(() => this._readHeightType()), distinctUntilChanged(), shareReplay(1));
+    constructor(config) {
+        const { microScreenWidthMax, smallScreenWidthMax, tabletScreenWidthMax, largeScreenWidthMax } = config;
+        this._microQuery = this._media.matchMedia(`screen and (max-width:${microScreenWidthMax}px)`);
+        this._smallQuery = this._media.matchMedia(`screen and (max-width:${smallScreenWidthMax}px)`);
+        this._tabletQuery = this._media.matchMedia(`screen and (max-width:${tabletScreenWidthMax}px)`);
+        this._largeQuery = this._media.matchMedia(`screen and (max-width:${largeScreenWidthMax}px)`);
+        this._tinyHeightQuery = this._media.matchMedia(`screen and (max-width:${largeScreenWidthMax}px)`);
+        const widthHandler = () => this._updateWidth.next();
+        const heightHandler = () => this._updateHeight.next();
+        this._microQuery.onchange = widthHandler;
+        this._smallQuery.onchange = widthHandler;
+        this._tabletQuery.onchange = widthHandler;
+        this._largeQuery.onchange = widthHandler;
+        this._tinyHeightQuery.onchange = heightHandler;
+    }
+    destroy() {
+        this._microQuery.onchange = null;
+        this._smallQuery.onchange = null;
+        this._tabletQuery.onchange = null;
+        this._largeQuery.onchange = null;
+        this._updateWidth.complete();
+        this._updateHeight.complete();
+    }
+    /**
+     * Returns an observable that detects whether or no the current width is greater or equal to the given breakpoint.
+     *
+     * @param inputBreakpoint
+     * @returns
+     */
+    isBreakpointActive(inputBreakpoint) {
+        return combineLatest([this.widthType$, asObservable(inputBreakpoint)]).pipe(map(([current, breakpoint]) => screenMediaWidthTypeIsActive(current, breakpoint)), distinctUntilChanged(), shareReplay(1));
+    }
+    _readWidthType() {
+        let width;
+        if (this._microQuery.matches) {
+            width = 'micro';
+        }
+        else if (this._smallQuery.matches) {
+            width = 'small';
+        }
+        else if (this._tabletQuery.matches) {
+            width = 'tablet';
+        }
+        else if (this._largeQuery.matches) {
+            width = 'large';
+        }
+        else {
+            width = 'full';
+        }
+        return width;
+    }
+    _readHeightType() {
+        if (this._tinyHeightQuery) {
+            return 'tiny';
+        }
+        else {
+            return 'normal';
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxScreenMediaService, deps: [{ token: DbxScreenMediaServiceConfig }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxScreenMediaService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxScreenMediaService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [{ type: DbxScreenMediaServiceConfig, decorators: [{
+                    type: Inject,
+                    args: [DbxScreenMediaServiceConfig]
+                }] }] });
+
+/**
+ * Directive used to calculate a dynamic height for an accordion header.
+ *
+ * If the height calculates to zero or nullish/undefined no height change is applied.
+ */
+class DbxAccordionHeaderHeightDirective {
+    _screenMediaService = inject(DbxScreenMediaService);
+    /**
+     * The base height of the header.
+     */
+    dbxAccordionHeaderHeight = input(60, ...(ngDevMode ? [{ debugName: "dbxAccordionHeaderHeight" }] : []));
+    /**
+     * The amount of height to add to the header when expanded.
+     */
+    expandedHeightIncrease = input(undefined, ...(ngDevMode ? [{ debugName: "expandedHeightIncrease" }] : []));
+    /**
+     * The maximum allowed height of the header.
+     */
+    maxHeaderHeight = input(undefined, ...(ngDevMode ? [{ debugName: "maxHeaderHeight" }] : []));
+    /**
+     * Text used to help determine the height of the header.
+     *
+     * Height will stay static to the given header height when this is not set.
+     *
+     * Ignored if heightTextLines is set.
+     */
+    heightText = input(undefined, ...(ngDevMode ? [{ debugName: "heightText" }] : []));
+    /**
+     * The number of characters used for calculating a line.
+     */
+    heightTextLineLength = input(30, ...(ngDevMode ? [{ debugName: "heightTextLineLength" }] : []));
+    /**
+     * Number of lines of text to use for the height calculation.
+     */
+    heightTextLines = input(undefined, ...(ngDevMode ? [{ debugName: "heightTextLines" }] : []));
+    /**
+     * The amount of height to add for every line of text.
+     */
+    heightTextLineHeight = input(20, ...(ngDevMode ? [{ debugName: "heightTextLineHeight" }] : []));
+    /**
+     * Multiplier to apply to the height on small screens.
+     */
+    heightTextSmallScreenMultiplier = input(1.6, ...(ngDevMode ? [{ debugName: "heightTextSmallScreenMultiplier" }] : []));
+    widthTypeSignal = toSignal(this._screenMediaService.widthType$);
+    expansionPanelHeightSignal = computed(() => {
+        const baseHeight = this.dbxAccordionHeaderHeight();
+        const text = this.heightText();
+        const textLines = this.heightTextLines();
+        const textLineLength = this.heightTextLineLength();
+        const textLineHeight = this.heightTextLineHeight();
+        const maxHeaderHeight = this.maxHeaderHeight();
+        const widthType = this.widthTypeSignal();
+        const isSmallScreen = widthType === 'micro' || widthType === 'small';
+        let height;
+        // calculate lines from text content or use the provided line count
+        let lines = textLines;
+        if (text && textLines == null) {
+            const lineLength = textLineLength;
+            lines = Math.ceil(text.length / lineLength);
+        }
+        if (lines != null && lines > 0) {
+            const lineHeight = textLineHeight;
+            // on small screens text wraps more, so scale up estimated lines
+            if (isSmallScreen) {
+                const multiplier = this.heightTextSmallScreenMultiplier() ?? 1.6;
+                lines = Math.ceil(lines * multiplier);
+            }
+            height = (baseHeight ?? 60) + lines * lineHeight;
+        }
+        else {
+            height = baseHeight;
+        }
+        if (maxHeaderHeight != null && height != null && height > maxHeaderHeight) {
+            height = maxHeaderHeight;
+        }
+        return height;
+    }, ...(ngDevMode ? [{ debugName: "expansionPanelHeightSignal" }] : []));
+    expansionPanelStyleSignal = computed(() => {
+        const height = this.expansionPanelHeightSignal();
+        const expandedHeightIncrease = this.expandedHeightIncrease() ?? 0;
+        let result;
+        if (height != null && height > 0) {
+            result = {
+                '--mat-expansion-header-collapsed-state-height': `${height}px`,
+                '--mat-expansion-header-expanded-state-height': `${height + expandedHeightIncrease}px`
+            };
+        }
+        return result;
+    }, ...(ngDevMode ? [{ debugName: "expansionPanelStyleSignal" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxAccordionHeaderHeightDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: DbxAccordionHeaderHeightDirective, isStandalone: true, selector: "[dbxAccordionHeaderHeight]", inputs: { dbxAccordionHeaderHeight: { classPropertyName: "dbxAccordionHeaderHeight", publicName: "dbxAccordionHeaderHeight", isSignal: true, isRequired: false, transformFunction: null }, expandedHeightIncrease: { classPropertyName: "expandedHeightIncrease", publicName: "expandedHeightIncrease", isSignal: true, isRequired: false, transformFunction: null }, maxHeaderHeight: { classPropertyName: "maxHeaderHeight", publicName: "maxHeaderHeight", isSignal: true, isRequired: false, transformFunction: null }, heightText: { classPropertyName: "heightText", publicName: "heightText", isSignal: true, isRequired: false, transformFunction: null }, heightTextLineLength: { classPropertyName: "heightTextLineLength", publicName: "heightTextLineLength", isSignal: true, isRequired: false, transformFunction: null }, heightTextLines: { classPropertyName: "heightTextLines", publicName: "heightTextLines", isSignal: true, isRequired: false, transformFunction: null }, heightTextLineHeight: { classPropertyName: "heightTextLineHeight", publicName: "heightTextLineHeight", isSignal: true, isRequired: false, transformFunction: null }, heightTextSmallScreenMultiplier: { classPropertyName: "heightTextSmallScreenMultiplier", publicName: "heightTextSmallScreenMultiplier", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style": "expansionPanelStyleSignal()" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxAccordionHeaderHeightDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[dbxAccordionHeaderHeight]',
+                    host: {
+                        '[style]': 'expansionPanelStyleSignal()'
+                    },
+                    standalone: true
+                }]
+        }], propDecorators: { dbxAccordionHeaderHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxAccordionHeaderHeight", required: false }] }], expandedHeightIncrease: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedHeightIncrease", required: false }] }], maxHeaderHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeaderHeight", required: false }] }], heightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "heightText", required: false }] }], heightTextLineLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "heightTextLineLength", required: false }] }], heightTextLines: [{ type: i0.Input, args: [{ isSignal: true, alias: "heightTextLines", required: false }] }], heightTextLineHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "heightTextLineHeight", required: false }] }], heightTextSmallScreenMultiplier: [{ type: i0.Input, args: [{ isSignal: true, alias: "heightTextSmallScreenMultiplier", required: false }] }] } });
+
 // MARK: Injection Token
 /**
  * Injection token for the avatar context data.
@@ -7637,123 +7857,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }], ctorParameters: () => [], propDecorators: { anchorForItem: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxListItemAnchorModifier", required: false }] }] } });
 
-const SCREEN_MEDIA_WIDTH_TYPE_SIZE_MAP = {
-    micro: 0,
-    small: 1,
-    tablet: 2,
-    large: 3,
-    full: 4
-};
-/**
- * Compares the breakpoint with the current width and determines if it is "active" or not.
- *
- * The current is considered active if it is bigger or equal to the breakpoint.
- *
- * @param current
- * @param breakpoint
- */
-function screenMediaWidthTypeIsActive(current, breakpoint) {
-    return compareScreenMediaWidthTypes(current, breakpoint, (a, b) => a >= b);
-}
-function compareScreenMediaWidthTypes(a, b, compare) {
-    return compare(SCREEN_MEDIA_WIDTH_TYPE_SIZE_MAP[a], SCREEN_MEDIA_WIDTH_TYPE_SIZE_MAP[b]);
-}
-
-/**
- * ScreenMediaService configuration.
- */
-class DbxScreenMediaServiceConfig {
-}
-const DEFAULT_SCREEN_MEDIA_SERVICE_CONFIG = {
-    microScreenWidthMax: 360,
-    smallScreenWidthMax: 520,
-    tabletScreenWidthMax: 786,
-    largeScreenWidthMax: 1280,
-    tinyScreenHeightMax: 280
-};
-/**
- * Service that emits the current view type based on the configuration.
- */
-class DbxScreenMediaService {
-    _media = inject(MediaMatcher);
-    _microQuery;
-    _smallQuery;
-    _tabletQuery;
-    _largeQuery;
-    _tinyHeightQuery;
-    _updateWidth = new Subject();
-    _updateHeight = new Subject();
-    widthType$ = this._updateWidth.pipe(initialize(() => this._updateWidth.next()), throttleTime(100, undefined, { leading: true, trailing: true }), map(() => this._readWidthType()), distinctUntilChanged(), shareReplay(1));
-    heightType$ = this._updateWidth.pipe(initialize(() => this._updateHeight.next()), throttleTime(100, undefined, { leading: true, trailing: true }), map(() => this._readHeightType()), distinctUntilChanged(), shareReplay(1));
-    constructor(config) {
-        const { microScreenWidthMax, smallScreenWidthMax, tabletScreenWidthMax, largeScreenWidthMax } = config;
-        this._microQuery = this._media.matchMedia(`screen and (max-width:${microScreenWidthMax}px)`);
-        this._smallQuery = this._media.matchMedia(`screen and (max-width:${smallScreenWidthMax}px)`);
-        this._tabletQuery = this._media.matchMedia(`screen and (max-width:${tabletScreenWidthMax}px)`);
-        this._largeQuery = this._media.matchMedia(`screen and (max-width:${largeScreenWidthMax}px)`);
-        this._tinyHeightQuery = this._media.matchMedia(`screen and (max-width:${largeScreenWidthMax}px)`);
-        const widthHandler = () => this._updateWidth.next();
-        const heightHandler = () => this._updateHeight.next();
-        this._microQuery.onchange = widthHandler;
-        this._smallQuery.onchange = widthHandler;
-        this._tabletQuery.onchange = widthHandler;
-        this._largeQuery.onchange = widthHandler;
-        this._tinyHeightQuery.onchange = heightHandler;
-    }
-    destroy() {
-        this._microQuery.onchange = null;
-        this._smallQuery.onchange = null;
-        this._tabletQuery.onchange = null;
-        this._largeQuery.onchange = null;
-        this._updateWidth.complete();
-        this._updateHeight.complete();
-    }
-    /**
-     * Returns an observable that detects whether or no the current width is greater or equal to the given breakpoint.
-     *
-     * @param inputBreakpoint
-     * @returns
-     */
-    isBreakpointActive(inputBreakpoint) {
-        return combineLatest([this.widthType$, asObservable(inputBreakpoint)]).pipe(map(([current, breakpoint]) => screenMediaWidthTypeIsActive(current, breakpoint)), distinctUntilChanged(), shareReplay(1));
-    }
-    _readWidthType() {
-        let width;
-        if (this._microQuery.matches) {
-            width = 'micro';
-        }
-        else if (this._smallQuery.matches) {
-            width = 'small';
-        }
-        else if (this._tabletQuery.matches) {
-            width = 'tablet';
-        }
-        else if (this._largeQuery.matches) {
-            width = 'large';
-        }
-        else {
-            width = 'full';
-        }
-        return width;
-    }
-    _readHeightType() {
-        if (this._tinyHeightQuery) {
-            return 'tiny';
-        }
-        else {
-            return 'normal';
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxScreenMediaService, deps: [{ token: DbxScreenMediaServiceConfig }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxScreenMediaService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxScreenMediaService, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [{ type: DbxScreenMediaServiceConfig, decorators: [{
-                    type: Inject,
-                    args: [DbxScreenMediaServiceConfig]
-                }] }] });
-
 /**
  * Component that displays a navbar.
  */
@@ -9023,88 +9126,122 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                 }]
         }] });
 
-const DEFAULT_LIST_GRID_SIZE_CONFIG = {
-    columns: 'repeat(auto-fill, minmax(320px, 1fr))',
-    gap: '8px'
-};
+// MARK: DbxValueListAccordionViewContentGroupComponent
 /**
- * Optional parent directive used to control grid size.
+ * Renders a single group of items within the accordion view.
  */
-class DbxValueListGridSizeDirective {
-    gridSize = input.required({ ...(ngDevMode ? { debugName: "gridSize" } : {}), alias: 'dbxListGridSize' });
-    gridSize$ = toObservable(this.gridSize);
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridSizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: DbxValueListGridSizeDirective, isStandalone: true, selector: "[dbxListGridSize]", inputs: { gridSize: { classPropertyName: "gridSize", publicName: "dbxListGridSize", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
+class DbxValueListAccordionViewContentGroupComponent {
+    dbxValueListAccordionViewContentComponent = inject((DbxValueListAccordionViewContentComponent));
+    group = input(...(ngDevMode ? [undefined, { debugName: "group" }] : []));
+    trackByFunctionSignal = toSignal(this.dbxValueListAccordionViewContentComponent.trackBy$, { initialValue: DEFAULT_VALUE_LIST_VIEW_CONTENT_COMPONENT_TRACK_BY_FUNCTION });
+    itemsSignal = computed(() => this.group()?.items ?? [], ...(ngDevMode ? [{ debugName: "itemsSignal" }] : []));
+    headerConfigSignal = computed(() => this.group()?.headerConfig, ...(ngDevMode ? [{ debugName: "headerConfigSignal" }] : []));
+    footerConfigSignal = computed(() => this.group()?.footerConfig, ...(ngDevMode ? [{ debugName: "footerConfigSignal" }] : []));
+    cssClassSignal = computed(() => spaceSeparatedCssClasses(this.group()?.cssClasses), ...(ngDevMode ? [{ debugName: "cssClassSignal" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListAccordionViewContentGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DbxValueListAccordionViewContentGroupComponent, isStandalone: true, selector: "dbx-list-accordion-view-content-group", inputs: { group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "cssClassSignal()" }, classAttribute: "dbx-list-view-group" }, ngImport: i0, template: `
+    <div class="dbx-list-view-group-content">
+      @if (headerConfigSignal()) {
+        <div class="dbx-list-view-group-header">
+          <dbx-injection [config]="headerConfigSignal()"></dbx-injection>
+        </div>
+      }
+      @for (item of itemsSignal(); track trackByFunctionSignal()($index, item)) {
+        <div dbx-injection [config]="item.config"></div>
+      }
+      @if (footerConfigSignal()) {
+        <div class="dbx-list-view-group-footer">
+          <dbx-injection [config]="footerConfigSignal()"></dbx-injection>
+        </div>
+      }
+    </div>
+  `, isInline: true, dependencies: [{ kind: "component", type: DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridSizeDirective, decorators: [{
-            type: Directive,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListAccordionViewContentGroupComponent, decorators: [{
+            type: Component,
             args: [{
-                    selector: '[dbxListGridSize]',
+                    selector: 'dbx-list-accordion-view-content-group',
+                    template: `
+    <div class="dbx-list-view-group-content">
+      @if (headerConfigSignal()) {
+        <div class="dbx-list-view-group-header">
+          <dbx-injection [config]="headerConfigSignal()"></dbx-injection>
+        </div>
+      }
+      @for (item of itemsSignal(); track trackByFunctionSignal()($index, item)) {
+        <div dbx-injection [config]="item.config"></div>
+      }
+      @if (footerConfigSignal()) {
+        <div class="dbx-list-view-group-footer">
+          <dbx-injection [config]="footerConfigSignal()"></dbx-injection>
+        </div>
+      }
+    </div>
+  `,
+                    host: {
+                        class: 'dbx-list-view-group',
+                        '[class]': 'cssClassSignal()'
+                    },
+                    imports: [DbxInjectionComponent],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
                     standalone: true
                 }]
-        }], propDecorators: { gridSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxListGridSize", required: true }] }] } });
+        }], propDecorators: { group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: false }] }] } });
+// MARK: DbxValueListAccordionViewContentComponent
 /**
- * Content view for a DbxValueListGridView. It can be used directly in cases where the items are already configured, or want to be configured in a non-standard fashion.
+ * Content view for a DbxValueListAccordionView. Renders items inside a mat-accordion.
+ *
+ * Each item component is responsible for rendering its own mat-expansion-panel structure.
  */
-class DbxValueListGridViewContentComponent extends DbxValueListViewContentComponent {
-    _gridSizeOverride = inject(DbxValueListGridSizeDirective, { optional: true });
-    inputGridConfig = input(undefined, { ...(ngDevMode ? { debugName: "inputGridConfig" } : {}), alias: 'grid' });
-    gridConfigFromGridSizeSignal = toSignal(this._gridSizeOverride?.gridSize$ ?? of(undefined));
-    gridConfigSignal = computed(() => {
-        return mergeObjects([DEFAULT_LIST_GRID_SIZE_CONFIG, this.inputGridConfig(), this.gridConfigFromGridSizeSignal()]);
-    }, ...(ngDevMode ? [{ debugName: "gridConfigSignal" }] : []));
-    trackByFunctionSignal = toSignal(this.trackBy$, { initialValue: DEFAULT_VALUE_LIST_VIEW_CONTENT_COMPONENT_TRACK_BY_FUNCTION });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DbxValueListGridViewContentComponent, isStandalone: true, selector: "dbx-list-grid-view-content", inputs: { inputGridConfig: { classPropertyName: "inputGridConfig", publicName: "grid", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "dbx-list-grid-view" }, usesInheritance: true, ngImport: i0, template: `
-    <div [gdGap]="gridConfigSignal().gap" [gdColumns]="gridConfigSignal().columns">
-      @for (item of items(); track trackByFunctionSignal()($index, item)) {
-        <dbx-anchor class="dbx-list-grid-view-item" matRipple [matRippleDisabled]="rippleDisabledOnItem(item)" [anchor]="item.anchor" [disabled]="item.disabled" (click)="onClickItem(item)">
-          <div dbx-injection [config]="item.config"></div>
-        </dbx-anchor>
+class DbxValueListAccordionViewContentComponent extends DbxValueListViewContentComponent {
+    multi = input(...(ngDevMode ? [undefined, { debugName: "multi" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListAccordionViewContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DbxValueListAccordionViewContentComponent, isStandalone: true, selector: "dbx-list-accordion-view-content", inputs: { multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "dbx-list-accordion-view" }, usesInheritance: true, ngImport: i0, template: `
+    <mat-accordion [multi]="multi() ?? false">
+      @for (group of groupsSignal(); track group.id) {
+        <dbx-list-accordion-view-content-group [group]="group"></dbx-list-accordion-view-content-group>
       }
-    </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FlexLayoutModule }, { kind: "directive", type: i1$7.DefaultGridColumnsDirective, selector: "  [gdColumns],  [gdColumns.xs], [gdColumns.sm], [gdColumns.md], [gdColumns.lg], [gdColumns.xl],  [gdColumns.lt-sm], [gdColumns.lt-md], [gdColumns.lt-lg], [gdColumns.lt-xl],  [gdColumns.gt-xs], [gdColumns.gt-sm], [gdColumns.gt-md], [gdColumns.gt-lg]", inputs: ["gdColumns", "gdColumns.xs", "gdColumns.sm", "gdColumns.md", "gdColumns.lg", "gdColumns.xl", "gdColumns.lt-sm", "gdColumns.lt-md", "gdColumns.lt-lg", "gdColumns.lt-xl", "gdColumns.gt-xs", "gdColumns.gt-sm", "gdColumns.gt-md", "gdColumns.gt-lg"] }, { kind: "directive", type: i1$7.DefaultGridGapDirective, selector: "  [gdGap],  [gdGap.xs], [gdGap.sm], [gdGap.md], [gdGap.lg], [gdGap.xl],  [gdGap.lt-sm], [gdGap.lt-md], [gdGap.lt-lg], [gdGap.lt-xl],  [gdGap.gt-xs], [gdGap.gt-sm], [gdGap.gt-md], [gdGap.gt-lg]", inputs: ["gdGap", "gdGap.xs", "gdGap.sm", "gdGap.md", "gdGap.lg", "gdGap.xl", "gdGap.lt-sm", "gdGap.lt-md", "gdGap.lt-lg", "gdGap.lt-xl", "gdGap.gt-xs", "gdGap.gt-sm", "gdGap.gt-md", "gdGap.gt-lg"] }, { kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }, { kind: "component", type: DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    </mat-accordion>
+  `, isInline: true, dependencies: [{ kind: "directive", type: MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: DbxValueListAccordionViewContentGroupComponent, selector: "dbx-list-accordion-view-content-group", inputs: ["group"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewContentComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListAccordionViewContentComponent, decorators: [{
             type: Component,
             args: [{
-                    selector: 'dbx-list-grid-view-content',
+                    selector: 'dbx-list-accordion-view-content',
                     template: `
-    <div [gdGap]="gridConfigSignal().gap" [gdColumns]="gridConfigSignal().columns">
-      @for (item of items(); track trackByFunctionSignal()($index, item)) {
-        <dbx-anchor class="dbx-list-grid-view-item" matRipple [matRippleDisabled]="rippleDisabledOnItem(item)" [anchor]="item.anchor" [disabled]="item.disabled" (click)="onClickItem(item)">
-          <div dbx-injection [config]="item.config"></div>
-        </dbx-anchor>
+    <mat-accordion [multi]="multi() ?? false">
+      @for (group of groupsSignal(); track group.id) {
+        <dbx-list-accordion-view-content-group [group]="group"></dbx-list-accordion-view-content-group>
       }
-    </div>
+    </mat-accordion>
   `,
                     host: {
-                        class: 'dbx-list-grid-view'
+                        class: 'dbx-list-accordion-view'
                     },
                     standalone: true,
-                    imports: [FlexLayoutModule, MatRipple, DbxAnchorComponent, DbxInjectionComponent],
+                    imports: [MatAccordion, DbxValueListAccordionViewContentGroupComponent],
                     changeDetection: ChangeDetectionStrategy.OnPush
                 }]
-        }], propDecorators: { inputGridConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: false }] }] } });
-// MARK: DbxValueListGridViewComponent
+        }], propDecorators: { multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }] } });
+// MARK: DbxValueListAccordionViewComponent
 /**
- * Renders a grid view using input configuration. Requires a parent DbxListView.
+ * Renders an accordion view using input configuration. Requires a parent DbxListView.
  */
-class DbxValueListGridViewComponent extends AbstractDbxValueListViewDirective {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: DbxValueListGridViewComponent, isStandalone: true, selector: "dbx-list-grid-view", usesInheritance: true, ngImport: i0, template: `
-    <dbx-list-grid-view-content [items]="itemsSignal()" [grid]="config().grid" [emitAllClicks]="config().emitAllClicks"></dbx-list-grid-view-content>
-  `, isInline: true, dependencies: [{ kind: "component", type: DbxValueListGridViewContentComponent, selector: "dbx-list-grid-view-content", inputs: ["grid"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+class DbxValueListAccordionViewComponent extends AbstractDbxValueListViewDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListAccordionViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: DbxValueListAccordionViewComponent, isStandalone: true, selector: "dbx-list-accordion-view", usesInheritance: true, ngImport: i0, template: `
+    <dbx-list-accordion-view-content [items]="itemsSignal()" [multi]="config().multi" [emitAllClicks]="config().emitAllClicks"></dbx-list-accordion-view-content>
+  `, isInline: true, dependencies: [{ kind: "component", type: DbxValueListAccordionViewContentComponent, selector: "dbx-list-accordion-view-content", inputs: ["multi"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListAccordionViewComponent, decorators: [{
             type: Component,
             args: [{
-                    selector: 'dbx-list-grid-view',
+                    selector: 'dbx-list-accordion-view',
                     template: `
-    <dbx-list-grid-view-content [items]="itemsSignal()" [grid]="config().grid" [emitAllClicks]="config().emitAllClicks"></dbx-list-grid-view-content>
+    <dbx-list-accordion-view-content [items]="itemsSignal()" [multi]="config().multi" [emitAllClicks]="config().emitAllClicks"></dbx-list-accordion-view-content>
   `,
                     standalone: true,
-                    imports: [DbxValueListGridViewContentComponent],
+                    imports: [DbxValueListAccordionViewContentComponent],
                     changeDetection: ChangeDetectionStrategy.OnPush
                 }]
         }] });
@@ -9177,6 +9314,185 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
             type: Directive
         }], propDecorators: { valuesArray: [{ type: i0.Input, args: [{ isSignal: true, alias: "valuesArray", required: false }] }], values: [{ type: i0.Input, args: [{ isSignal: true, alias: "values", required: false }] }], clickValue: [{ type: i0.Output, args: ["clickValue"] }] } });
 
+const DEFAULT_DBX_LIST_ACCORDION_VIEW_COMPONENT_CONFIGURATION_TEMPLATE = '<dbx-list-accordion-view [config]="config"></dbx-list-accordion-view>';
+const dbxListAccordionViewComponentImportsAndExports = [DbxValueListAccordionViewComponent];
+class DbxListAccordionViewComponentImportsModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxListAccordionViewComponentImportsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.0", ngImport: i0, type: DbxListAccordionViewComponentImportsModule, imports: [DbxValueListAccordionViewComponent], exports: [DbxValueListAccordionViewComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxListAccordionViewComponentImportsModule, imports: [dbxListAccordionViewComponentImportsAndExports] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxListAccordionViewComponentImportsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    exports: dbxListAccordionViewComponentImportsAndExports,
+                    imports: dbxListAccordionViewComponentImportsAndExports
+                }]
+        }] });
+/**
+ * Abstract DbxListAccordionView implementation.
+ */
+class AbstractDbxListAccordionViewDirective extends AbstractDbxListViewDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AbstractDbxListAccordionViewDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.0", type: AbstractDbxListAccordionViewDirective, isStandalone: true, usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AbstractDbxListAccordionViewDirective, decorators: [{
+            type: Directive
+        }] });
+
+const DEFAULT_LIST_GRID_SIZE_CONFIG = {
+    columns: 'repeat(auto-fill, minmax(320px, 1fr))',
+    gap: '8px'
+};
+/**
+ * Optional parent directive used to control grid size.
+ */
+class DbxValueListGridSizeDirective {
+    gridSize = input.required({ ...(ngDevMode ? { debugName: "gridSize" } : {}), alias: 'dbxListGridSize' });
+    gridSize$ = toObservable(this.gridSize);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridSizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: DbxValueListGridSizeDirective, isStandalone: true, selector: "[dbxListGridSize]", inputs: { gridSize: { classPropertyName: "gridSize", publicName: "dbxListGridSize", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridSizeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[dbxListGridSize]',
+                    standalone: true
+                }]
+        }], propDecorators: { gridSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "dbxListGridSize", required: true }] }] } });
+// MARK: DbxValueListGridViewContentGroupComponent
+/**
+ * Renders a single group of items within the grid view.
+ */
+class DbxValueListGridViewContentGroupComponent {
+    dbxValueListGridViewContentComponent = inject((DbxValueListGridViewContentComponent));
+    group = input(...(ngDevMode ? [undefined, { debugName: "group" }] : []));
+    trackByFunctionSignal = toSignal(this.dbxValueListGridViewContentComponent.trackBy$, { initialValue: DEFAULT_VALUE_LIST_VIEW_CONTENT_COMPONENT_TRACK_BY_FUNCTION });
+    gridConfigSignal = this.dbxValueListGridViewContentComponent.gridConfigSignal;
+    itemsSignal = computed(() => this.group()?.items ?? [], ...(ngDevMode ? [{ debugName: "itemsSignal" }] : []));
+    headerConfigSignal = computed(() => this.group()?.headerConfig, ...(ngDevMode ? [{ debugName: "headerConfigSignal" }] : []));
+    footerConfigSignal = computed(() => this.group()?.footerConfig, ...(ngDevMode ? [{ debugName: "footerConfigSignal" }] : []));
+    cssClassSignal = computed(() => spaceSeparatedCssClasses(this.group()?.cssClasses), ...(ngDevMode ? [{ debugName: "cssClassSignal" }] : []));
+    onClickItem(item) {
+        this.dbxValueListGridViewContentComponent.onClickItem(item);
+    }
+    rippleDisabledOnItem(item) {
+        return this.dbxValueListGridViewContentComponent.rippleDisabledOnItem(item);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewContentGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DbxValueListGridViewContentGroupComponent, isStandalone: true, selector: "dbx-list-grid-view-content-group", inputs: { group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "cssClassSignal()" }, classAttribute: "dbx-list-view-group" }, ngImport: i0, template: `
+    <div class="dbx-list-view-group-content">
+      @if (headerConfigSignal()) {
+        <div class="dbx-list-view-group-header">
+          <dbx-injection [config]="headerConfigSignal()"></dbx-injection>
+        </div>
+      }
+      <div [gdGap]="gridConfigSignal().gap" [gdColumns]="gridConfigSignal().columns">
+        @for (item of itemsSignal(); track trackByFunctionSignal()($index, item)) {
+          <dbx-anchor class="dbx-list-grid-view-item" matRipple [matRippleDisabled]="rippleDisabledOnItem(item)" [anchor]="item.anchor" [disabled]="item.disabled" (click)="onClickItem(item)">
+            <div dbx-injection [config]="item.config"></div>
+          </dbx-anchor>
+        }
+      </div>
+      @if (footerConfigSignal()) {
+        <div class="dbx-list-view-group-footer">
+          <dbx-injection [config]="footerConfigSignal()"></dbx-injection>
+        </div>
+      }
+    </div>
+  `, isInline: true, dependencies: [{ kind: "component", type: DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }, { kind: "component", type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }, { kind: "ngmodule", type: FlexLayoutModule }, { kind: "directive", type: i1$7.DefaultGridColumnsDirective, selector: "  [gdColumns],  [gdColumns.xs], [gdColumns.sm], [gdColumns.md], [gdColumns.lg], [gdColumns.xl],  [gdColumns.lt-sm], [gdColumns.lt-md], [gdColumns.lt-lg], [gdColumns.lt-xl],  [gdColumns.gt-xs], [gdColumns.gt-sm], [gdColumns.gt-md], [gdColumns.gt-lg]", inputs: ["gdColumns", "gdColumns.xs", "gdColumns.sm", "gdColumns.md", "gdColumns.lg", "gdColumns.xl", "gdColumns.lt-sm", "gdColumns.lt-md", "gdColumns.lt-lg", "gdColumns.lt-xl", "gdColumns.gt-xs", "gdColumns.gt-sm", "gdColumns.gt-md", "gdColumns.gt-lg"] }, { kind: "directive", type: i1$7.DefaultGridGapDirective, selector: "  [gdGap],  [gdGap.xs], [gdGap.sm], [gdGap.md], [gdGap.lg], [gdGap.xl],  [gdGap.lt-sm], [gdGap.lt-md], [gdGap.lt-lg], [gdGap.lt-xl],  [gdGap.gt-xs], [gdGap.gt-sm], [gdGap.gt-md], [gdGap.gt-lg]", inputs: ["gdGap", "gdGap.xs", "gdGap.sm", "gdGap.md", "gdGap.lg", "gdGap.xl", "gdGap.lt-sm", "gdGap.lt-md", "gdGap.lt-lg", "gdGap.lt-xl", "gdGap.gt-xs", "gdGap.gt-sm", "gdGap.gt-md", "gdGap.gt-lg"] }, { kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewContentGroupComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'dbx-list-grid-view-content-group',
+                    template: `
+    <div class="dbx-list-view-group-content">
+      @if (headerConfigSignal()) {
+        <div class="dbx-list-view-group-header">
+          <dbx-injection [config]="headerConfigSignal()"></dbx-injection>
+        </div>
+      }
+      <div [gdGap]="gridConfigSignal().gap" [gdColumns]="gridConfigSignal().columns">
+        @for (item of itemsSignal(); track trackByFunctionSignal()($index, item)) {
+          <dbx-anchor class="dbx-list-grid-view-item" matRipple [matRippleDisabled]="rippleDisabledOnItem(item)" [anchor]="item.anchor" [disabled]="item.disabled" (click)="onClickItem(item)">
+            <div dbx-injection [config]="item.config"></div>
+          </dbx-anchor>
+        }
+      </div>
+      @if (footerConfigSignal()) {
+        <div class="dbx-list-view-group-footer">
+          <dbx-injection [config]="footerConfigSignal()"></dbx-injection>
+        </div>
+      }
+    </div>
+  `,
+                    host: {
+                        class: 'dbx-list-view-group',
+                        '[class]': 'cssClassSignal()'
+                    },
+                    imports: [DbxInjectionComponent, DbxAnchorComponent, FlexLayoutModule, MatRipple],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: true
+                }]
+        }], propDecorators: { group: [{ type: i0.Input, args: [{ isSignal: true, alias: "group", required: false }] }] } });
+// MARK: DbxValueListGridViewContentComponent
+/**
+ * Content view for a DbxValueListGridView. It can be used directly in cases where the items are already configured, or want to be configured in a non-standard fashion.
+ */
+class DbxValueListGridViewContentComponent extends DbxValueListViewContentComponent {
+    _gridSizeOverride = inject(DbxValueListGridSizeDirective, { optional: true });
+    inputGridConfig = input(undefined, { ...(ngDevMode ? { debugName: "inputGridConfig" } : {}), alias: 'grid' });
+    gridConfigFromGridSizeSignal = toSignal(this._gridSizeOverride?.gridSize$ ?? of(undefined));
+    gridConfigSignal = computed(() => {
+        return mergeObjects([DEFAULT_LIST_GRID_SIZE_CONFIG, this.inputGridConfig(), this.gridConfigFromGridSizeSignal()]);
+    }, ...(ngDevMode ? [{ debugName: "gridConfigSignal" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DbxValueListGridViewContentComponent, isStandalone: true, selector: "dbx-list-grid-view-content", inputs: { inputGridConfig: { classPropertyName: "inputGridConfig", publicName: "grid", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "dbx-list-grid-view" }, usesInheritance: true, ngImport: i0, template: `
+    @for (group of groupsSignal(); track group.id) {
+      <dbx-list-grid-view-content-group [group]="group"></dbx-list-grid-view-content-group>
+    }
+  `, isInline: true, dependencies: [{ kind: "component", type: DbxValueListGridViewContentGroupComponent, selector: "dbx-list-grid-view-content-group", inputs: ["group"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewContentComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'dbx-list-grid-view-content',
+                    template: `
+    @for (group of groupsSignal(); track group.id) {
+      <dbx-list-grid-view-content-group [group]="group"></dbx-list-grid-view-content-group>
+    }
+  `,
+                    host: {
+                        class: 'dbx-list-grid-view'
+                    },
+                    standalone: true,
+                    imports: [DbxValueListGridViewContentGroupComponent],
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], propDecorators: { inputGridConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "grid", required: false }] }] } });
+// MARK: DbxValueListGridViewComponent
+/**
+ * Renders a grid view using input configuration. Requires a parent DbxListView.
+ */
+class DbxValueListGridViewComponent extends AbstractDbxValueListViewDirective {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: DbxValueListGridViewComponent, isStandalone: true, selector: "dbx-list-grid-view", usesInheritance: true, ngImport: i0, template: `
+    <dbx-list-grid-view-content [items]="itemsSignal()" [grid]="config().grid" [emitAllClicks]="config().emitAllClicks"></dbx-list-grid-view-content>
+  `, isInline: true, dependencies: [{ kind: "component", type: DbxValueListGridViewContentComponent, selector: "dbx-list-grid-view-content", inputs: ["grid"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DbxValueListGridViewComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'dbx-list-grid-view',
+                    template: `
+    <dbx-list-grid-view-content [items]="itemsSignal()" [grid]="config().grid" [emitAllClicks]="config().emitAllClicks"></dbx-list-grid-view-content>
+  `,
+                    standalone: true,
+                    imports: [DbxValueListGridViewContentComponent],
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }] });
+
 const DEFAULT_DBX_LIST_GRID_VIEW_COMPONENT_CONFIGURATION_TEMPLATE = '<dbx-list-grid-view [config]="config"></dbx-list-grid-view>';
 const dbxListGridViewComponentImportsAndExports = [DbxValueListGridViewComponent];
 class DbxListGridViewComponentImportsModule {
@@ -9947,6 +10263,21 @@ class AbstractDbxValueListViewItemComponent {
     get itemValue() {
         return this.item.itemValue;
     }
+    get itemIcon() {
+        return this.item.icon;
+    }
+    get itemDisabled() {
+        return this.item.disabled;
+    }
+    get itemRippleDisabled() {
+        return this.item.rippleDisabled;
+    }
+    get itemSelected() {
+        return this.item.selected;
+    }
+    get itemAnchor() {
+        return this.item.anchor;
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AbstractDbxValueListViewItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.0", type: AbstractDbxValueListViewItemComponent, isStandalone: true, ngImport: i0 });
 }
@@ -11996,5 +12327,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { APP_POPUP_MINIMIZED_WIDTH, APP_POPUP_NORMAL_HEIGHT, APP_POPUP_NORMAL_WIDTH, AbstractDbxClipboardDirective, AbstractDbxErrorWidgetComponent, AbstractDbxFileUploadComponent, AbstractDbxHelpWidgetDirective, AbstractDbxListGridViewDirective, AbstractDbxListViewDirective, AbstractDbxListWrapperDirective, AbstractDbxPartialPresetFilterMenuDirective, AbstractDbxSegueAnchorDirective, AbstractDbxSelectionListViewDirective, AbstractDbxSelectionListWrapperDirective, AbstractDbxValueListItemModifierDirective, AbstractDbxValueListViewDirective, AbstractDbxValueListViewItemComponent, AbstractDbxWidgetComponent, AbstractDialogDirective, AbstractFilterPopoverButtonDirective, AbstractPopoverDirective, AbstractPopoverRefDirective, AbstractPopoverRefWithEventsDirective, AbstractPopupDirective, AbstractPromptConfirmDirective, CompactContextStore, CompactMode, DBX_ACTION_SNACKBAR_DEFAULTS, DBX_ACTION_SNACKBAR_SERVICE_CONFIG, DBX_AVATAR_CONTEXT_DATA_TOKEN, DBX_DARK_STYLE_CLASS_SUFFIX, DBX_HELP_WIDGET_ENTRY_DATA_TOKEN, DBX_LIST_DEFAULT_SCROLL_DISTANCE, DBX_LIST_DEFAULT_THROTTLE_SCROLL, DBX_LIST_ITEM_DEFAULT_DISABLE_FUNCTION, DBX_LIST_ITEM_DISABLE_RIPPLE_LIST_ITEM_MODIFIER_KEY, DBX_LIST_ITEM_IS_SELECTED_ITEM_MODIFIER_KEY, DBX_LIST_VIEW_DEFAULT_META_ICON, DBX_MODEL_VIEW_TRACKER_STORAGE_ACCESSOR_TOKEN, DBX_PROGRESS_BUTTON_GLOBAL_CONFIG, DBX_ROUTER_ANCHOR_COMPONENTS, DBX_ROUTER_VALUE_LIST_ITEM_MODIFIER_KEY, DBX_STYLE_DEFAULT_CONFIG_TOKEN, DBX_THEME_COLORS, DBX_THEME_COLORS_EXTRA, DBX_THEME_COLORS_EXTRA_SECONDARY, DBX_THEME_COLORS_MAIN, DBX_VALUE_LIST_VIEW_ITEM, DBX_WEB_FILE_PREVIEW_SERVICE_DEFAULT_DIALOG_WITH_COMPONENT_FUNCTION, DBX_WEB_FILE_PREVIEW_SERVICE_DEFAULT_PREVIEW_COMPONENT_FUNCTION, DBX_WEB_FILE_PREVIEW_SERVICE_ENTRIES_TOKEN, DBX_WEB_FILE_PREVIEW_SERVICE_ZIP_COMPONENT_PRESET, DBX_WEB_FILE_PREVIEW_SERVICE_ZIP_PRESET_ENTRY, DEFAULT_DBX_ERROR_SNACKBAR_CONFIG, DEFAULT_DBX_HELP_VIEW_POPOVER_KEY, DEFAULT_DBX_LINKIFY_STRING_TYPE, DEFAULT_DBX_LIST_GRID_VIEW_COMPONENT_CONFIGURATION_TEMPLATE, DEFAULT_DBX_LIST_ITEM_IS_SELECTED_FUNCTION, DEFAULT_DBX_PROMPT_CONFIRM_DIALOG_CONFIG, DEFAULT_DBX_SELECTION_VALUE_LIST_COMPONENT_CONFIGURATION_TEMPLATE, DEFAULT_DBX_SIDENAV_MENU_ICON, DEFAULT_DBX_VALUE_LIST_COMPONENT_CONFIGURATION_TEMPLATE, DEFAULT_DBX_VALUE_LIST_CONFIG_MAP_VALUES, DEFAULT_ERROR_POPOVER_KEY, DEFAULT_ERROR_WIDGET_CODE, DEFAULT_FILTER_POPOVER_KEY, DEFAULT_LIST_GRID_SIZE_CONFIG, DEFAULT_LIST_WRAPPER_COMPONENT_CONFIGURATION_TEMPLATE, DEFAULT_LOADING_PROGRESS_DIAMETER, DEFAULT_SCREEN_MEDIA_SERVICE_CONFIG, DEFAULT_SNACKBAR_DIRECTIVE_DURATION, DEFAULT_TWO_COLUMNS_MIN_RIGHT_WIDTH, DEFAULT_VALUE_LIST_VIEW_CONTENT_COMPONENT_TRACK_BY_FUNCTION, DbxActionConfirmDirective, DbxActionDialogDirective, DbxActionErrorDirective, DbxActionKeyTriggerDirective, DbxActionLoadingContextDirective, DbxActionModule, DbxActionPopoverDirective, DbxActionSnackbarComponent, DbxActionSnackbarDirective, DbxActionSnackbarErrorDirective, DbxActionSnackbarModule, DbxActionSnackbarService, DbxActionTransitionSafetyDirective, DbxActionUIRouterTransitionSafetyDialogComponent, DbxAnchorComponent, DbxAnchorContentComponent, DbxAnchorIconComponent, DbxAnchorListComponent, DbxAngularRouterSegueAnchorComponent, DbxAvatarComponent, DbxAvatarViewService, DbxAvatarViewServiceConfig, DbxBarDirective, DbxBarHeaderComponent, DbxBarLayoutModule, DbxBasicLoadingComponent, DbxBodyDirective, DbxButtonComponent, DbxButtonModule, DbxButtonSpacerDirective, DbxCardBoxComponent, DbxCardBoxContainerDirective, DbxCardBoxLayoutModule, DbxChipDirective, DbxClickToCopyTextComponent, DbxClickToCopyTextDirective, DbxColorDirective, DbxColumnLayoutModule, DbxCompactDirective, DbxCompactLayoutModule, DbxContentBorderDirective, DbxContentBoxDirective, DbxContentContainerDirective, DbxContentDirective, DbxContentElevateDirective, DbxContentLayoutModule, DbxContentPageDirective, DbxContentPitDirective, DbxDetailBlockComponent, DbxDetailBlockHeaderComponent, DbxDialogContentCloseComponent, DbxDialogContentDirective, DbxDialogContentFooterComponent, DbxDialogInteractionModule, DbxDialogModule, DbxDownloadBlobButtonComponent, DbxDownloadTextViewComponent, DbxEmbedComponent, DbxErrorComponent, DbxErrorDefaultErrorWidgetComponent, DbxErrorDetailsComponent, DbxErrorPopoverComponent, DbxErrorSnackbarComponent, DbxErrorSnackbarService, DbxErrorViewComponent, DbxErrorWidgetService, DbxErrorWidgetViewComponent, DbxFileUploadActionCompatable, DbxFileUploadActionSyncDirective, DbxFileUploadAreaComponent, DbxFileUploadButtonComponent, DbxFileUploadComponent, DbxFilterInteractionModule, DbxFilterPopoverButtonComponent, DbxFilterPopoverComponent, DbxFilterWrapperComponent, DbxFlagComponent, DbxFlagLayoutModule, DbxFlagPromptComponent, DbxFlexGroupDirective, DbxFlexLayoutModule, DbxFlexSizeDirective, DbxHelpContextDirective, DbxHelpContextService, DbxHelpViewListComponent, DbxHelpViewListEntryComponent, DbxHelpViewPopoverButtonComponent, DbxHelpViewPopoverComponent, DbxHelpWidgetService, DbxHelpWidgetServiceConfig, DbxIconButtonComponent, DbxIconButtonModule, DbxIconItemComponent, DbxIconSpacerDirective, DbxIfSidenavDisplayModeDirective, DbxIframeComponent, DbxInjectionDialogComponent, DbxInteractionModule, DbxIntroActionSectionComponent, DbxLabelBlockComponent, DbxLayoutModule, DbxLinkComponent, DbxLinkifyComponent, DbxLinkifyService, DbxLinkifyServiceConfig, DbxListComponent, DbxListEmptyContentComponent, DbxListGridViewComponentImportsModule, DbxListInternalContentDirective, DbxListItemAnchorModifierDirective, DbxListItemDisableRippleModifierDirective, DbxListItemIsSelectedModifierDirective, DbxListModifierModule, DbxListModule, DbxListTitleGroupDirective, DbxListView, DbxListViewMetaIconComponent, DbxListViewWrapper, DbxListWrapperComponentImportsModule, DbxLoadingComponent, DbxLoadingErrorDirective, DbxLoadingModule, DbxLoadingProgressComponent, DbxModelObjectStateService, actions as DbxModelStateActions, model_actions as DbxModelStateModelActions, DbxModelTrackerService, DbxModelTypesService, DbxModelViewTrackerStorage, DbxNavbarComponent, DbxNumberWithLimitComponent, DbxOneColumnComponent, DbxOneColumnLayoutModule, DbxPagebarComponent, DbxPartialPresetFilterListComponent, DbxPartialPresetFilterMenuComponent, DbxPopoverCloseButtonComponent, DbxPopoverComponent, DbxPopoverComponentController, DbxPopoverContentComponent, DbxPopoverController, DbxPopoverControlsDirective, DbxPopoverCoordinatorComponent, DbxPopoverCoordinatorService, DbxPopoverHeaderComponent, DbxPopoverInteractionContentModule, DbxPopoverInteractionModule, DbxPopoverScrollContentDirective, DbxPopoverService, DbxPopupComponent, DbxPopupComponentController, DbxPopupContentComponent, DbxPopupControlButtonsComponent, DbxPopupController, DbxPopupControlsComponent, DbxPopupCoordinatorComponent, DbxPopupCoordinatorService, DbxPopupInteractionModule, DbxPopupService, DbxPopupWindowState, DbxPresetFilterListComponent, DbxPresetFilterMenuComponent, DbxProgressBarButtonComponent, DbxProgressButtonsModule, DbxProgressSpinnerButtonComponent, DbxPromptBoxDirective, DbxPromptComponent, DbxPromptConfirm, DbxPromptConfirmButtonDirective, DbxPromptConfirmComponent, DbxPromptConfirmDialogComponent, DbxPromptConfirmDirective, DbxPromptModule, DbxPromptPageComponent, DbxReadableErrorModule, DbxResizedDirective, DbxRouterAnchorModule, DbxRouterLayoutModule, DbxRouterSidenavModule, DbxRouterWebProviderConfig, DbxScreenMediaService, DbxScreenMediaServiceConfig, DbxSectionComponent, DbxSectionHeaderComponent, DbxSectionLayoutModule, DbxSectionPageComponent, DbxSelectionValueListViewComponent, DbxSelectionValueListViewComponentImportsModule, DbxSelectionValueListViewContentComponent, DbxSetStyleDirective, DbxSidenavButtonComponent, DbxSidenavComponent, DbxSidenavPageComponent, DbxSidenavPagebarComponent, DbxSpacerDirective, DbxStepComponent, DbxStepLayoutModule, DbxStructureDirective, DbxStructureModule, DbxStyleBodyDirective, DbxStyleDirective, DbxStyleLayoutModule, DbxStyleService, DbxSubSectionComponent, DbxTextChipsComponent, DbxTextModule, DbxTwoBlockComponent, DbxTwoColumnBackDirective, DbxTwoColumnColumnHeadDirective, DbxTwoColumnComponent, DbxTwoColumnContextDirective, DbxTwoColumnFullLeftDirective, DbxTwoColumnLayoutModule, DbxTwoColumnRightComponent, DbxTwoColumnSrefDirective, DbxTwoColumnSrefShowRightDirective, DbxUIRouterSegueAnchorComponent, DbxUnitedStatesAddressComponent, DbxValueListGridSizeDirective, DbxValueListGridViewComponent, DbxValueListGridViewContentComponent, DbxValueListItemModifier, DbxValueListItemModifierDirective, DbxValueListView, DbxValueListViewComponent, DbxValueListViewComponentImportsModule, DbxValueListViewContentComponent, DbxValueListViewContentGroupComponent, DbxValueListViewGroupDelegate, DbxWebFilePreviewComponent, DbxWebFilePreviewService, DbxWebModule, DbxWidgetListGridComponent, DbxWidgetListGridViewComponent, DbxWidgetListGridViewItemComponent, DbxWidgetService, DbxWidgetViewComponent, DbxWindowKeyDownListenerDirective, DbxZipBlobPreviewComponent, DbxZipPreviewComponent, PopoverPositionStrategy, PopupGlobalPositionStrategy, SCREEN_MEDIA_WIDTH_TYPE_SIZE_MAP, SideNavDisplayMode, TRACK_BY_MODEL_ID, TRACK_BY_MODEL_KEY, TwoColumnsContextStore, UNKNOWN_ERROR_WIDGET_CODE, addConfigToValueListItems, allDbxModelViewTrackerEventModelKeys, allDbxModelViewTrackerEventSetModelKeys, catchErrorServerParams, compactModeFromInput, compareScreenMediaWidthTypes, convertServerErrorParams, convertToPOJOServerErrorResponse, convertToServerErrorResponse, copyToClipboardFunction, dbxColorBackground, dbxListGridViewComponentImportsAndExports, dbxPresetFilterMenuButtonIconObservable, dbxPresetFilterMenuButtonTextObservable, dbxStyleClassCleanSuffix, dbxValueListItemDecisionFunction, dbxZipBlobPreviewEntryTreeFromEntries, defaultDbxModelViewTrackerStorageAccessorFactory, defaultDbxValueListViewGroupDelegate, defaultDbxValueListViewGroupValuesFunction, disableRightClickInCdkBackdrop, fileAcceptFilterTypeStringArray, fileAcceptFunction, fileAcceptString, fileArrayAcceptMatchFunction, index as fromDbxModel, injectCopyToClipboardFunction, injectCopyToClipboardFunctionWithSnackbarMessage, listItemModifier, makeDbxActionSnackbarDisplayConfigGeneratorFunction, mapCompactModeObs, mapValuesToValuesListItemConfigObs, index$1 as onDbxModel, openEmbedDialog, openIframeDialog, openZipPreviewDialog, overrideClickElementEffect, provideDbxFileUploadActionCompatable, provideDbxHelpServices, provideDbxLinkify, provideDbxListView, provideDbxListViewWrapper, provideDbxModelService, provideDbxProgressButtonGlobalConfig, provideDbxPromptConfirm, provideDbxRouterWebAngularRouterProviderConfig, provideDbxRouterWebUiRouterProviderConfig, provideDbxScreenMediaService, provideDbxStyleService, provideDbxValueListView, provideDbxValueListViewGroupDelegate, provideDbxValueListViewModifier, provideDbxWebFilePreviewServiceEntries, provideTwoColumnsContext, registerHelpContextKeysWithDbxHelpContextService, resizeSignal, sanitizeDbxDialogContentConfig, screenMediaWidthTypeIsActive, trackByModelKeyRef, trackByUniqueIdentifier };
+export { APP_POPUP_MINIMIZED_WIDTH, APP_POPUP_NORMAL_HEIGHT, APP_POPUP_NORMAL_WIDTH, AbstractDbxClipboardDirective, AbstractDbxErrorWidgetComponent, AbstractDbxFileUploadComponent, AbstractDbxHelpWidgetDirective, AbstractDbxListAccordionViewDirective, AbstractDbxListGridViewDirective, AbstractDbxListViewDirective, AbstractDbxListWrapperDirective, AbstractDbxPartialPresetFilterMenuDirective, AbstractDbxSegueAnchorDirective, AbstractDbxSelectionListViewDirective, AbstractDbxSelectionListWrapperDirective, AbstractDbxValueListItemModifierDirective, AbstractDbxValueListViewDirective, AbstractDbxValueListViewItemComponent, AbstractDbxWidgetComponent, AbstractDialogDirective, AbstractFilterPopoverButtonDirective, AbstractPopoverDirective, AbstractPopoverRefDirective, AbstractPopoverRefWithEventsDirective, AbstractPopupDirective, AbstractPromptConfirmDirective, CompactContextStore, CompactMode, DBX_ACTION_SNACKBAR_DEFAULTS, DBX_ACTION_SNACKBAR_SERVICE_CONFIG, DBX_AVATAR_CONTEXT_DATA_TOKEN, DBX_DARK_STYLE_CLASS_SUFFIX, DBX_HELP_WIDGET_ENTRY_DATA_TOKEN, DBX_LIST_DEFAULT_SCROLL_DISTANCE, DBX_LIST_DEFAULT_THROTTLE_SCROLL, DBX_LIST_ITEM_DEFAULT_DISABLE_FUNCTION, DBX_LIST_ITEM_DISABLE_RIPPLE_LIST_ITEM_MODIFIER_KEY, DBX_LIST_ITEM_IS_SELECTED_ITEM_MODIFIER_KEY, DBX_LIST_VIEW_DEFAULT_META_ICON, DBX_MODEL_VIEW_TRACKER_STORAGE_ACCESSOR_TOKEN, DBX_PROGRESS_BUTTON_GLOBAL_CONFIG, DBX_ROUTER_ANCHOR_COMPONENTS, DBX_ROUTER_VALUE_LIST_ITEM_MODIFIER_KEY, DBX_STYLE_DEFAULT_CONFIG_TOKEN, DBX_THEME_COLORS, DBX_THEME_COLORS_EXTRA, DBX_THEME_COLORS_EXTRA_SECONDARY, DBX_THEME_COLORS_MAIN, DBX_VALUE_LIST_VIEW_ITEM, DBX_WEB_FILE_PREVIEW_SERVICE_DEFAULT_DIALOG_WITH_COMPONENT_FUNCTION, DBX_WEB_FILE_PREVIEW_SERVICE_DEFAULT_PREVIEW_COMPONENT_FUNCTION, DBX_WEB_FILE_PREVIEW_SERVICE_ENTRIES_TOKEN, DBX_WEB_FILE_PREVIEW_SERVICE_ZIP_COMPONENT_PRESET, DBX_WEB_FILE_PREVIEW_SERVICE_ZIP_PRESET_ENTRY, DEFAULT_DBX_ERROR_SNACKBAR_CONFIG, DEFAULT_DBX_HELP_VIEW_POPOVER_KEY, DEFAULT_DBX_LINKIFY_STRING_TYPE, DEFAULT_DBX_LIST_ACCORDION_VIEW_COMPONENT_CONFIGURATION_TEMPLATE, DEFAULT_DBX_LIST_GRID_VIEW_COMPONENT_CONFIGURATION_TEMPLATE, DEFAULT_DBX_LIST_ITEM_IS_SELECTED_FUNCTION, DEFAULT_DBX_PROMPT_CONFIRM_DIALOG_CONFIG, DEFAULT_DBX_SELECTION_VALUE_LIST_COMPONENT_CONFIGURATION_TEMPLATE, DEFAULT_DBX_SIDENAV_MENU_ICON, DEFAULT_DBX_VALUE_LIST_COMPONENT_CONFIGURATION_TEMPLATE, DEFAULT_DBX_VALUE_LIST_CONFIG_MAP_VALUES, DEFAULT_ERROR_POPOVER_KEY, DEFAULT_ERROR_WIDGET_CODE, DEFAULT_FILTER_POPOVER_KEY, DEFAULT_LIST_GRID_SIZE_CONFIG, DEFAULT_LIST_WRAPPER_COMPONENT_CONFIGURATION_TEMPLATE, DEFAULT_LOADING_PROGRESS_DIAMETER, DEFAULT_SCREEN_MEDIA_SERVICE_CONFIG, DEFAULT_SNACKBAR_DIRECTIVE_DURATION, DEFAULT_TWO_COLUMNS_MIN_RIGHT_WIDTH, DEFAULT_VALUE_LIST_VIEW_CONTENT_COMPONENT_TRACK_BY_FUNCTION, DbxAccordionHeaderHeightDirective, DbxActionConfirmDirective, DbxActionDialogDirective, DbxActionErrorDirective, DbxActionKeyTriggerDirective, DbxActionLoadingContextDirective, DbxActionModule, DbxActionPopoverDirective, DbxActionSnackbarComponent, DbxActionSnackbarDirective, DbxActionSnackbarErrorDirective, DbxActionSnackbarModule, DbxActionSnackbarService, DbxActionTransitionSafetyDirective, DbxActionUIRouterTransitionSafetyDialogComponent, DbxAnchorComponent, DbxAnchorContentComponent, DbxAnchorIconComponent, DbxAnchorListComponent, DbxAngularRouterSegueAnchorComponent, DbxAvatarComponent, DbxAvatarViewService, DbxAvatarViewServiceConfig, DbxBarDirective, DbxBarHeaderComponent, DbxBarLayoutModule, DbxBasicLoadingComponent, DbxBodyDirective, DbxButtonComponent, DbxButtonModule, DbxButtonSpacerDirective, DbxCardBoxComponent, DbxCardBoxContainerDirective, DbxCardBoxLayoutModule, DbxChipDirective, DbxClickToCopyTextComponent, DbxClickToCopyTextDirective, DbxColorDirective, DbxColumnLayoutModule, DbxCompactDirective, DbxCompactLayoutModule, DbxContentBorderDirective, DbxContentBoxDirective, DbxContentContainerDirective, DbxContentDirective, DbxContentElevateDirective, DbxContentLayoutModule, DbxContentPageDirective, DbxContentPitDirective, DbxDetailBlockComponent, DbxDetailBlockHeaderComponent, DbxDialogContentCloseComponent, DbxDialogContentDirective, DbxDialogContentFooterComponent, DbxDialogInteractionModule, DbxDialogModule, DbxDownloadBlobButtonComponent, DbxDownloadTextViewComponent, DbxEmbedComponent, DbxErrorComponent, DbxErrorDefaultErrorWidgetComponent, DbxErrorDetailsComponent, DbxErrorPopoverComponent, DbxErrorSnackbarComponent, DbxErrorSnackbarService, DbxErrorViewComponent, DbxErrorWidgetService, DbxErrorWidgetViewComponent, DbxFileUploadActionCompatable, DbxFileUploadActionSyncDirective, DbxFileUploadAreaComponent, DbxFileUploadButtonComponent, DbxFileUploadComponent, DbxFilterInteractionModule, DbxFilterPopoverButtonComponent, DbxFilterPopoverComponent, DbxFilterWrapperComponent, DbxFlagComponent, DbxFlagLayoutModule, DbxFlagPromptComponent, DbxFlexGroupDirective, DbxFlexLayoutModule, DbxFlexSizeDirective, DbxHelpContextDirective, DbxHelpContextService, DbxHelpViewListComponent, DbxHelpViewListEntryComponent, DbxHelpViewPopoverButtonComponent, DbxHelpViewPopoverComponent, DbxHelpWidgetService, DbxHelpWidgetServiceConfig, DbxIconButtonComponent, DbxIconButtonModule, DbxIconItemComponent, DbxIconSpacerDirective, DbxIfSidenavDisplayModeDirective, DbxIframeComponent, DbxInjectionDialogComponent, DbxInteractionModule, DbxIntroActionSectionComponent, DbxLabelBlockComponent, DbxLayoutModule, DbxLinkComponent, DbxLinkifyComponent, DbxLinkifyService, DbxLinkifyServiceConfig, DbxListAccordionViewComponentImportsModule, DbxListComponent, DbxListEmptyContentComponent, DbxListGridViewComponentImportsModule, DbxListInternalContentDirective, DbxListItemAnchorModifierDirective, DbxListItemDisableRippleModifierDirective, DbxListItemIsSelectedModifierDirective, DbxListModifierModule, DbxListModule, DbxListTitleGroupDirective, DbxListView, DbxListViewMetaIconComponent, DbxListViewWrapper, DbxListWrapperComponentImportsModule, DbxLoadingComponent, DbxLoadingErrorDirective, DbxLoadingModule, DbxLoadingProgressComponent, DbxModelObjectStateService, actions as DbxModelStateActions, model_actions as DbxModelStateModelActions, DbxModelTrackerService, DbxModelTypesService, DbxModelViewTrackerStorage, DbxNavbarComponent, DbxNumberWithLimitComponent, DbxOneColumnComponent, DbxOneColumnLayoutModule, DbxPagebarComponent, DbxPartialPresetFilterListComponent, DbxPartialPresetFilterMenuComponent, DbxPopoverCloseButtonComponent, DbxPopoverComponent, DbxPopoverComponentController, DbxPopoverContentComponent, DbxPopoverController, DbxPopoverControlsDirective, DbxPopoverCoordinatorComponent, DbxPopoverCoordinatorService, DbxPopoverHeaderComponent, DbxPopoverInteractionContentModule, DbxPopoverInteractionModule, DbxPopoverScrollContentDirective, DbxPopoverService, DbxPopupComponent, DbxPopupComponentController, DbxPopupContentComponent, DbxPopupControlButtonsComponent, DbxPopupController, DbxPopupControlsComponent, DbxPopupCoordinatorComponent, DbxPopupCoordinatorService, DbxPopupInteractionModule, DbxPopupService, DbxPopupWindowState, DbxPresetFilterListComponent, DbxPresetFilterMenuComponent, DbxProgressBarButtonComponent, DbxProgressButtonsModule, DbxProgressSpinnerButtonComponent, DbxPromptBoxDirective, DbxPromptComponent, DbxPromptConfirm, DbxPromptConfirmButtonDirective, DbxPromptConfirmComponent, DbxPromptConfirmDialogComponent, DbxPromptConfirmDirective, DbxPromptModule, DbxPromptPageComponent, DbxReadableErrorModule, DbxResizedDirective, DbxRouterAnchorModule, DbxRouterLayoutModule, DbxRouterSidenavModule, DbxRouterWebProviderConfig, DbxScreenMediaService, DbxScreenMediaServiceConfig, DbxSectionComponent, DbxSectionHeaderComponent, DbxSectionLayoutModule, DbxSectionPageComponent, DbxSelectionValueListViewComponent, DbxSelectionValueListViewComponentImportsModule, DbxSelectionValueListViewContentComponent, DbxSetStyleDirective, DbxSidenavButtonComponent, DbxSidenavComponent, DbxSidenavPageComponent, DbxSidenavPagebarComponent, DbxSpacerDirective, DbxStepComponent, DbxStepLayoutModule, DbxStructureDirective, DbxStructureModule, DbxStyleBodyDirective, DbxStyleDirective, DbxStyleLayoutModule, DbxStyleService, DbxSubSectionComponent, DbxTextChipsComponent, DbxTextModule, DbxTwoBlockComponent, DbxTwoColumnBackDirective, DbxTwoColumnColumnHeadDirective, DbxTwoColumnComponent, DbxTwoColumnContextDirective, DbxTwoColumnFullLeftDirective, DbxTwoColumnLayoutModule, DbxTwoColumnRightComponent, DbxTwoColumnSrefDirective, DbxTwoColumnSrefShowRightDirective, DbxUIRouterSegueAnchorComponent, DbxUnitedStatesAddressComponent, DbxValueListAccordionViewComponent, DbxValueListAccordionViewContentComponent, DbxValueListAccordionViewContentGroupComponent, DbxValueListGridSizeDirective, DbxValueListGridViewComponent, DbxValueListGridViewContentComponent, DbxValueListGridViewContentGroupComponent, DbxValueListItemModifier, DbxValueListItemModifierDirective, DbxValueListView, DbxValueListViewComponent, DbxValueListViewComponentImportsModule, DbxValueListViewContentComponent, DbxValueListViewContentGroupComponent, DbxValueListViewGroupDelegate, DbxWebFilePreviewComponent, DbxWebFilePreviewService, DbxWebModule, DbxWidgetListGridComponent, DbxWidgetListGridViewComponent, DbxWidgetListGridViewItemComponent, DbxWidgetService, DbxWidgetViewComponent, DbxWindowKeyDownListenerDirective, DbxZipBlobPreviewComponent, DbxZipPreviewComponent, PopoverPositionStrategy, PopupGlobalPositionStrategy, SCREEN_MEDIA_WIDTH_TYPE_SIZE_MAP, SideNavDisplayMode, TRACK_BY_MODEL_ID, TRACK_BY_MODEL_KEY, TwoColumnsContextStore, UNKNOWN_ERROR_WIDGET_CODE, addConfigToValueListItems, allDbxModelViewTrackerEventModelKeys, allDbxModelViewTrackerEventSetModelKeys, catchErrorServerParams, compactModeFromInput, compareScreenMediaWidthTypes, convertServerErrorParams, convertToPOJOServerErrorResponse, convertToServerErrorResponse, copyToClipboardFunction, dbxColorBackground, dbxListAccordionViewComponentImportsAndExports, dbxListGridViewComponentImportsAndExports, dbxPresetFilterMenuButtonIconObservable, dbxPresetFilterMenuButtonTextObservable, dbxStyleClassCleanSuffix, dbxValueListItemDecisionFunction, dbxZipBlobPreviewEntryTreeFromEntries, defaultDbxModelViewTrackerStorageAccessorFactory, defaultDbxValueListViewGroupDelegate, defaultDbxValueListViewGroupValuesFunction, disableRightClickInCdkBackdrop, fileAcceptFilterTypeStringArray, fileAcceptFunction, fileAcceptString, fileArrayAcceptMatchFunction, index as fromDbxModel, injectCopyToClipboardFunction, injectCopyToClipboardFunctionWithSnackbarMessage, listItemModifier, makeDbxActionSnackbarDisplayConfigGeneratorFunction, mapCompactModeObs, mapValuesToValuesListItemConfigObs, index$1 as onDbxModel, openEmbedDialog, openIframeDialog, openZipPreviewDialog, overrideClickElementEffect, provideDbxFileUploadActionCompatable, provideDbxHelpServices, provideDbxLinkify, provideDbxListView, provideDbxListViewWrapper, provideDbxModelService, provideDbxProgressButtonGlobalConfig, provideDbxPromptConfirm, provideDbxRouterWebAngularRouterProviderConfig, provideDbxRouterWebUiRouterProviderConfig, provideDbxScreenMediaService, provideDbxStyleService, provideDbxValueListView, provideDbxValueListViewGroupDelegate, provideDbxValueListViewModifier, provideDbxWebFilePreviewServiceEntries, provideTwoColumnsContext, registerHelpContextKeysWithDbxHelpContextService, resizeSignal, sanitizeDbxDialogContentConfig, screenMediaWidthTypeIsActive, trackByModelKeyRef, trackByUniqueIdentifier };
 //# sourceMappingURL=dereekb-dbx-web.mjs.map