@dereekb/dbx-web 13.8.0 → 13.9.0

package/fesm2022/dereekb-dbx-web.mjs

@@ -1168,11 +1168,10 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
     customContent = input(false, { ...(ngDevMode ? { debugName: "customContent" } : /* istanbul ignore next */ {}), transform: isDefinedAndNotFalse });
     allowClickPropagation = input(false, { ...(ngDevMode ? { debugName: "allowClickPropagation" } : /* istanbul ignore next */ {}), transform: isDefinedAndNotFalse });
     mode = input(...(ngDevMode ? [undefined, { debugName: "mode" }] : /* istanbul ignore next */ []));
-    typeSignal = computed(() => {
+    styleTypeSignal = computed(() => {
         const style = this.buttonStyle();
         let type = this.type() ?? style?.type;
         if (!type) {
-            type = 'basic';
             if (this.iconOnly()) {
                 type = 'icon';
             }
@@ -1190,7 +1189,7 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
             }
         }
         return type;
-    }, ...(ngDevMode ? [{ debugName: "typeSignal" }] : /* istanbul ignore next */ []));
+    }, ...(ngDevMode ? [{ debugName: "styleTypeSignal" }] : /* istanbul ignore next */ []));
     configSignal = computed(() => {
         // configure custom style
         const customStyle = {};
@@ -1217,7 +1216,7 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
         const fab = this.fab() || buttonStyle?.fab;
         const mode = this.mode() ?? buttonStyle?.mode;
         const working = this.workingSignal();
-        const buttonType = this.typeSignal();
+        const buttonType = this.styleTypeSignal();
         const ariaLabel = this.ariaLabel();
         const config = {
             fab,
@@ -1227,7 +1226,7 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
             customClass: 'dbx-button ' + (isIconOnlyButton ? 'dbx-button-no-text' : ''),
             text: textValue ?? '',
             hasTextContent,
-            buttonType,
+            buttonType: buttonType ?? (isIconOnlyButton ? 'icon' : 'basic'),
             buttonColor,
             barColor: 'accent',
             mode,
@@ -3103,14 +3102,27 @@ const DEFAULT_FILTER_POPOVER_BUTTON_DISPLAY_CONTENT = {
 class DbxFilterPopoverButtonComponent extends AbstractFilterPopoverButtonDirective {
     buttonElement = viewChild('button', { ...(ngDevMode ? { debugName: "buttonElement" } : /* istanbul ignore next */ {}), read: ElementRef });
     disabled = input(...(ngDevMode ? [undefined, { debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /**
+     * @deprecated Use buttonDisplayStyle instead.
+     */
     buttonDisplay = input(DEFAULT_FILTER_POPOVER_BUTTON_DISPLAY_CONTENT, { ...(ngDevMode ? { debugName: "buttonDisplay" } : /* istanbul ignore next */ {}), transform: (x) => x ?? DEFAULT_FILTER_POPOVER_BUTTON_DISPLAY_CONTENT });
+    buttonDisplayStyle = input(...(ngDevMode ? [undefined, { debugName: "buttonDisplayStyle" }] : /* istanbul ignore next */ []));
+    buttonDisplaySignal = computed(() => {
+        const pairDisplay = this.buttonDisplayStyle()?.display;
+        const directDisplay = this.buttonDisplay();
+        if (!pairDisplay && !directDisplay) {
+            return undefined;
+        }
+        return { ...pairDisplay, ...directDisplay };
+    }, ...(ngDevMode ? [{ debugName: "buttonDisplaySignal" }] : /* istanbul ignore next */ []));
+    buttonStyleSignal = computed(() => this.buttonDisplayStyle()?.style, ...(ngDevMode ? [{ debugName: "buttonStyleSignal" }] : /* istanbul ignore next */ []));
     showFilterPopover() {
         const origin = this.buttonElement()?.nativeElement;
         this.showPopover(origin);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: DbxFilterPopoverButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", type: DbxFilterPopoverButtonComponent, isStandalone: true, selector: "dbx-filter-popover-button", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, buttonDisplay: { classPropertyName: "buttonDisplay", publicName: "buttonDisplay", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
-    <dbx-button #button (buttonClick)="showFilterPopover()" [buttonDisplay]="buttonDisplay()" [disabled]="disabled()" iconOnly></dbx-button>
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", type: DbxFilterPopoverButtonComponent, isStandalone: true, selector: "dbx-filter-popover-button", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, buttonDisplay: { classPropertyName: "buttonDisplay", publicName: "buttonDisplay", isSignal: true, isRequired: false, transformFunction: null }, buttonDisplayStyle: { classPropertyName: "buttonDisplayStyle", publicName: "buttonDisplayStyle", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
+    <dbx-button #button (buttonClick)="showFilterPopover()" [buttonDisplay]="buttonDisplaySignal()" [buttonStyle]="buttonStyleSignal()" [disabled]="disabled()"></dbx-button>
   `, isInline: true, dependencies: [{ kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "customButtonColor", "customTextColor", "customSpinnerColor", "basic", "tonal", "raised", "stroked", "flat", "iconOnly", "fab", "customContent", "allowClickPropagation", "mode"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: DbxFilterPopoverButtonComponent, decorators: [{
@@ -3118,13 +3130,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
             args: [{
                     selector: 'dbx-filter-popover-button',
                     template: `
-    <dbx-button #button (buttonClick)="showFilterPopover()" [buttonDisplay]="buttonDisplay()" [disabled]="disabled()" iconOnly></dbx-button>
+    <dbx-button #button (buttonClick)="showFilterPopover()" [buttonDisplay]="buttonDisplaySignal()" [buttonStyle]="buttonStyleSignal()" [disabled]="disabled()"></dbx-button>
   `,
                     imports: [DbxButtonComponent],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     standalone: true
                 }]
-        }], propDecorators: { buttonElement: [{ type: i0.ViewChild, args: ['button', { ...{ read: ElementRef }, isSignal: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], buttonDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonDisplay", required: false }] }] } });
+        }], propDecorators: { buttonElement: [{ type: i0.ViewChild, args: ['button', { ...{ read: ElementRef }, isSignal: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], buttonDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonDisplay", required: false }] }], buttonDisplayStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonDisplayStyle", required: false }] }] } });
 
 /**
  * Wraps filter form content with apply/reset buttons, integrating with the action system.
@@ -13294,7 +13306,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
  * Default HTML template for list wrapper components. Passes through state, config, and content projection slots to a child `dbx-list`.
  */
 const DEFAULT_LIST_WRAPPER_COMPONENT_CONFIGURATION_TEMPLATE = `
-  <dbx-list [state]="currentState$" [config]="configSignal()" [hasMore]="hasMore()" [disabled]="disabled()" [selectionMode]="selectionModeSignal()">
+  <dbx-list [state]="currentState$" [config]="configSignal()" [hasMore]="hasMore()" [disabled]="disabledSignal()" [selectionMode]="selectionModeSignal()">
     <ng-content top select="[top]"></ng-content>
     <ng-content bottom select="[bottom]"></ng-content>
     <ng-content empty select="[empty]"></ng-content>
@@ -13325,7 +13337,9 @@ class AbstractDbxListWrapperDirective {
     _config = new BehaviorSubject(undefined);
     _stateOverride = new BehaviorSubject(undefined);
     _selectionModeOverride = new BehaviorSubject(undefined);
+    _disabledOverride = new BehaviorSubject(undefined);
     _selectionModeOverrideSignal = toSignal(this._selectionModeOverride.pipe(maybeValueFromObservableOrValue()));
+    _disabledOverrideSignal = toSignal(this._disabledOverride.pipe(maybeValueFromObservableOrValue()));
     hasMore = input(undefined, ...(ngDevMode ? [{ debugName: "hasMore" }] : /* istanbul ignore next */ []));
     clickItem = output();
     loadMore = output();
@@ -13335,6 +13349,9 @@ class AbstractDbxListWrapperDirective {
     selectionModeSignal = computed(() => {
         return this._selectionModeOverrideSignal() ?? this.selectionMode();
     }, ...(ngDevMode ? [{ debugName: "selectionModeSignal" }] : /* istanbul ignore next */ []));
+    disabledSignal = computed(() => {
+        return this._disabledOverrideSignal() ?? this.disabled();
+    }, ...(ngDevMode ? [{ debugName: "disabledSignal" }] : /* istanbul ignore next */ []));
     currentState$ = combineLatest([this._stateOverride, toObservable(this.state)]).pipe(map(([stateOverride, state]) => stateOverride ?? state), maybeValueFromObservableOrValue(), shareReplay(1));
     config$ = this._config.pipe(maybeValueFromObservableOrValue(), map((x) => (x ? this._buildListConfig(x) : undefined)), shareReplay(1));
     configSignal = toSignal(this.config$);
@@ -13346,6 +13363,7 @@ class AbstractDbxListWrapperDirective {
         this._config.complete();
         this._stateOverride.complete();
         this._selectionModeOverride.complete();
+        this._disabledOverride.complete();
     }
     setState(stateObs) {
         this._stateOverride.next(stateObs);
@@ -13353,6 +13371,9 @@ class AbstractDbxListWrapperDirective {
     setSelectionMode(selectionMode) {
         this._selectionModeOverride.next(selectionMode);
     }
+    setDisabled(disabled) {
+        this._disabledOverride.next(disabled);
+    }
     _buildListConfig(config) {
         return {
             ...config,
@@ -15075,7 +15096,7 @@ class DbxZipPreviewEntryListComponent extends AbstractDbxSelectionListWrapperDir
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: DbxZipPreviewEntryListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: DbxZipPreviewEntryListComponent, isStandalone: true, selector: "dbx-zip-preview-file-entry-list", providers: provideDbxListViewWrapper(DbxZipPreviewEntryListComponent), usesInheritance: true, ngImport: i0, template: "\n  <dbx-list [state]=\"currentState$\" [config]=\"configSignal()\" [hasMore]=\"hasMore()\" [disabled]=\"disabled()\" [selectionMode]=\"selectionModeSignal()\">\n    <ng-content top select=\"[top]\"></ng-content>\n    <ng-content bottom select=\"[bottom]\"></ng-content>\n    <ng-content empty select=\"[empty]\"></ng-content>\n    <ng-content emptyLoading select=\"[emptyLoading]\"></ng-content>\n    <ng-content end select=\"[end]\"></ng-content>\n  </dbx-list>", isInline: true, dependencies: [{ kind: "ngmodule", type: DbxListWrapperComponentImportsModule }, { kind: "component", type: DbxListComponent, selector: "dbx-list", inputs: ["padded", "state", "config", "disabled", "selectionMode", "hasMore"], outputs: ["contentScrolled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: DbxZipPreviewEntryListComponent, isStandalone: true, selector: "dbx-zip-preview-file-entry-list", providers: provideDbxListViewWrapper(DbxZipPreviewEntryListComponent), usesInheritance: true, ngImport: i0, template: "\n  <dbx-list [state]=\"currentState$\" [config]=\"configSignal()\" [hasMore]=\"hasMore()\" [disabled]=\"disabledSignal()\" [selectionMode]=\"selectionModeSignal()\">\n    <ng-content top select=\"[top]\"></ng-content>\n    <ng-content bottom select=\"[bottom]\"></ng-content>\n    <ng-content empty select=\"[empty]\"></ng-content>\n    <ng-content emptyLoading select=\"[emptyLoading]\"></ng-content>\n    <ng-content end select=\"[end]\"></ng-content>\n  </dbx-list>", isInline: true, dependencies: [{ kind: "ngmodule", type: DbxListWrapperComponentImportsModule }, { kind: "component", type: DbxListComponent, selector: "dbx-list", inputs: ["padded", "state", "config", "disabled", "selectionMode", "hasMore"], outputs: ["contentScrolled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: DbxZipPreviewEntryListComponent, decorators: [{
             type: Component,
@@ -15675,7 +15696,7 @@ class DbxWidgetListGridComponent extends AbstractDbxListWrapperDirective {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: DbxWidgetListGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: DbxWidgetListGridComponent, isStandalone: true, selector: "dbx-widget-grid", usesInheritance: true, ngImport: i0, template: "\n  <dbx-list [state]=\"currentState$\" [config]=\"configSignal()\" [hasMore]=\"hasMore()\" [disabled]=\"disabled()\" [selectionMode]=\"selectionModeSignal()\">\n    <ng-content top select=\"[top]\"></ng-content>\n    <ng-content bottom select=\"[bottom]\"></ng-content>\n    <ng-content empty select=\"[empty]\"></ng-content>\n    <ng-content emptyLoading select=\"[emptyLoading]\"></ng-content>\n    <ng-content end select=\"[end]\"></ng-content>\n  </dbx-list>", isInline: true, dependencies: [{ kind: "ngmodule", type: DbxListWrapperComponentImportsModule }, { kind: "component", type: DbxListComponent, selector: "dbx-list", inputs: ["padded", "state", "config", "disabled", "selectionMode", "hasMore"], outputs: ["contentScrolled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: DbxWidgetListGridComponent, isStandalone: true, selector: "dbx-widget-grid", usesInheritance: true, ngImport: i0, template: "\n  <dbx-list [state]=\"currentState$\" [config]=\"configSignal()\" [hasMore]=\"hasMore()\" [disabled]=\"disabledSignal()\" [selectionMode]=\"selectionModeSignal()\">\n    <ng-content top select=\"[top]\"></ng-content>\n    <ng-content bottom select=\"[bottom]\"></ng-content>\n    <ng-content empty select=\"[empty]\"></ng-content>\n    <ng-content emptyLoading select=\"[emptyLoading]\"></ng-content>\n    <ng-content end select=\"[end]\"></ng-content>\n  </dbx-list>", isInline: true, dependencies: [{ kind: "ngmodule", type: DbxListWrapperComponentImportsModule }, { kind: "component", type: DbxListComponent, selector: "dbx-list", inputs: ["padded", "state", "config", "disabled", "selectionMode", "hasMore"], outputs: ["contentScrolled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: DbxWidgetListGridComponent, decorators: [{
             type: Component,