From 5a999b8e4c0399518fd67d4eb718cc228ff52998 Mon Sep 17 00:00:00 2001 From: Igor Milly Date: Thu, 17 Mar 2022 13:29:56 +0100 Subject: [PATCH] feat(config): add scroll strategy provider module extra config (#555) --- .../src/config/nx-scroll-strategy.helpers.ts | 38 ++++++++++++++++++- .../src/config/nx-scroll-strategy.models.ts | 14 +++++++ .../src/config/nx-scroll-strategy.module.ts | 6 +++ 3 files changed, 57 insertions(+), 1 deletion(-) diff --git a/projects/ng-aquila/src/config/nx-scroll-strategy.helpers.ts b/projects/ng-aquila/src/config/nx-scroll-strategy.helpers.ts index 70a4eff9c..69db73bbb 100644 --- a/projects/ng-aquila/src/config/nx-scroll-strategy.helpers.ts +++ b/projects/ng-aquila/src/config/nx-scroll-strategy.helpers.ts @@ -1,10 +1,13 @@ import { Overlay, ScrollStrategy } from '@angular/cdk/overlay'; -import { FactoryProvider } from '@angular/core'; +import { FactoryProvider, InjectionToken } from '@angular/core'; import { NX_AUTOCOMPLETE_SCROLL_STRATEGY } from '@aposin/ng-aquila/autocomplete'; import { NX_CONTEXT_MENU_SCROLL_STRATEGY } from '@aposin/ng-aquila/context-menu'; import { NX_DATEPICKER_SCROLL_STRATEGY } from '@aposin/ng-aquila/datefield'; import { NX_DROPDOWN_SCROLL_STRATEGY } from '@aposin/ng-aquila/dropdown'; +import { NX_MODAL_SCROLL_STRATEGY } from '@aposin/ng-aquila/modal'; import { NX_NOTIFICATION_PANEL_SCROLL_STRATEGY } from '@aposin/ng-aquila/notification-panel'; +import { NX_OVERLAY_SCROLL_STRATEGY } from '@aposin/ng-aquila/overlay'; +import { NX_POPOVER_SCROLL_STRATEGY } from '@aposin/ng-aquila/popover'; import { NxScrollStrategy, NxScrollStrategyDefaultConfig, NxScrollStrategyFactoryConfig, NxScrollStrategyOptions } from './nx-scroll-strategy.models'; @@ -32,6 +35,7 @@ export function getScrollStrategyDefaultProviders(config: NxScrollStrategyDefaul { provide: NX_DATEPICKER_SCROLL_STRATEGY, useFactory: getFactoryFnByDefaultConfig(config, 'datepicker'), deps: [Overlay] }, { provide: NX_DROPDOWN_SCROLL_STRATEGY, useFactory: getFactoryFnByDefaultConfig(config, 'dropdown'), deps: [Overlay] }, { provide: NX_NOTIFICATION_PANEL_SCROLL_STRATEGY, useFactory: getFactoryFnByDefaultConfig(config, 'notificationPanel'), deps: [Overlay] }, + ...getExtraProvidersByDefaultConfig(config), ]; } @@ -43,6 +47,14 @@ function getFactoryFnByDefaultConfig( return (overlay: Overlay) => getScrollStrategyFactory(componentConfig.scrollStrategy, overlay, componentConfig.scrollStrategyOptions); } +function getExtraProvidersByDefaultConfig(config: NxScrollStrategyDefaultConfig): FactoryProvider[] { + return Object.entries(config.extraComponents ?? {}).map(([componentName, { scrollStrategy, scrollStrategyOptions }]) => ({ + provide: getInjectionToken(componentName), + useFactory: (overlay: Overlay) => getScrollStrategyFactory(scrollStrategy, overlay, scrollStrategyOptions), + deps: [Overlay], + })); +} + /** Return an array of scroll strategy providers based on the provided factory config. */ export function getScrollStrategyFactoryProviders(config: NxScrollStrategyFactoryConfig): FactoryProvider[] { return [ @@ -51,6 +63,7 @@ export function getScrollStrategyFactoryProviders(config: NxScrollStrategyFactor { provide: NX_DATEPICKER_SCROLL_STRATEGY, useFactory: getFactoryFnByFactoryConfig(config, 'datepicker'), deps: [Overlay] }, { provide: NX_DROPDOWN_SCROLL_STRATEGY, useFactory: getFactoryFnByFactoryConfig(config, 'dropdown'), deps: [Overlay] }, { provide: NX_NOTIFICATION_PANEL_SCROLL_STRATEGY, useFactory: getFactoryFnByFactoryConfig(config, 'notificationPanel'), deps: [Overlay] }, + ...getExtraProvidersByFactoryConfig(config), ]; } @@ -60,3 +73,26 @@ function getFactoryFnByFactoryConfig( ): (overlay: Overlay) => () => ScrollStrategy { return (config.overrides?.[componentName] ?? config).scrollStrategyFactory; } + +function getExtraProvidersByFactoryConfig(config: NxScrollStrategyFactoryConfig): FactoryProvider[] { + return Object.entries(config.extraComponents ?? {}).map(([componentName, { scrollStrategyFactory }]) => ({ + provide: getInjectionToken(componentName), + useFactory: scrollStrategyFactory, + deps: [Overlay], + })); +} + +function getInjectionToken(componentName: string): InjectionToken<() => ScrollStrategy> { + switch (componentName) { + case 'dialog': + return NX_MODAL_SCROLL_STRATEGY; + case 'overlay': + return NX_OVERLAY_SCROLL_STRATEGY; + case 'popover': + return NX_POPOVER_SCROLL_STRATEGY; + // case 'tooltip': + // return NX_TOOLTIP_SCROLL_STRATEGY; + default: + throw new Error(`Injection token for ${componentName} scroll strategy not recognized.`); + } +} diff --git a/projects/ng-aquila/src/config/nx-scroll-strategy.models.ts b/projects/ng-aquila/src/config/nx-scroll-strategy.models.ts index 6aa2357e9..e3b4ea16a 100644 --- a/projects/ng-aquila/src/config/nx-scroll-strategy.models.ts +++ b/projects/ng-aquila/src/config/nx-scroll-strategy.models.ts @@ -22,6 +22,13 @@ export interface NxScrollStrategyDefaultConfig { dropdown?: Pick; notificationPanel?: Pick; }; + /** Configure default behavior for additional overlay-based component types. */ + extraComponents?: { + dialog?: Pick; + overlay?: Pick; + popover?: Pick; + // tooltip?: Pick; + }; } /** Scroll strategy factory creator function. */ @@ -39,4 +46,11 @@ export interface NxScrollStrategyFactoryConfig { dropdown?: Pick; notificationPanel?: Pick; }; + /** Configure default behavior for additional overlay-based component types. */ + extraComponents?: { + dialog?: Pick; + overlay?: Pick; + popover?: Pick; + // tooltip?: Pick; + }; } diff --git a/projects/ng-aquila/src/config/nx-scroll-strategy.module.ts b/projects/ng-aquila/src/config/nx-scroll-strategy.module.ts index eb1600613..26956fa3e 100644 --- a/projects/ng-aquila/src/config/nx-scroll-strategy.module.ts +++ b/projects/ng-aquila/src/config/nx-scroll-strategy.module.ts @@ -12,6 +12,12 @@ import { NxScrollStrategyDefaultConfig, NxScrollStrategyFactoryConfig } from './ * - dropdown * - notification-panel * + * These components will be affected only if configured separately in the `extraComponents` property: + * + * - dialog + * - overlay + * - popover + * * @example * NxScrollStrategyModule.withConfig({ * scrollStrategy: 'close',