@onecx/angular-accelerator 8.2.2 → 8.3.1

package/assets/styles.scss

@@ -2,4 +2,6 @@
 
 @import '/node_modules/primeflex/primeflex.scss';
 
-@import '../src/lib/directives/loading-indicator.directive.scss';
+@import '../src/lib/directives/loading-indicator.directive.scss';
+
+@import '../src/lib/directives/content.directive.scss'; 

package/fesm2022/onecx-angular-accelerator.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
-import { inject, ElementRef, input, effect, Directive, signal, Renderer2, ViewContainerRef, TemplateRef, DestroyRef, computed, HostListener, EventEmitter, Output, OutputEmitterRef, assertInInjectionContext, NgZone, Injectable, Injector, LOCALE_ID, Pipe, model, output, contentChild, ViewChild, ViewEncapsulation, Component, contentChildren, viewChild, Input, ChangeDetectorRef, viewChildren, untracked, ChangeDetectionStrategy, Type, NgModule, APP_INITIALIZER } from '@angular/core';
+import { inject, ElementRef, input, effect, Directive, signal, Renderer2, ViewContainerRef, TemplateRef, DestroyRef, computed, HostListener, EventEmitter, Output, OutputEmitterRef, assertInInjectionContext, NgZone, Injectable, Injector, LOCALE_ID, Pipe, model, output, contentChild, ViewChild, ViewEncapsulation, Component, contentChildren, viewChild, untracked, Input, ChangeDetectorRef, viewChildren, ChangeDetectionStrategy, Type, NgModule, APP_INITIALIZER } from '@angular/core';
 import { toObservable, takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
 import { UserService, AppStateService, ConfigurationService, CONFIG_KEY, ShellCapabilityService, Capability, AppConfigService } from '@onecx/angular-integration-interface';
-import { HAS_PERMISSION_CHECKER, SKIP_STYLE_SCOPING, getScopeIdentifier, dataStyleIdKey, dataNoPortalLayoutStylesKey, MultiLanguageMissingTranslationHandler, providePermissionChecker, provideTranslationPathFromMeta, provideMultiLanguageIdentifier, provideTranslationConnectionService } from '@onecx/angular-utils';
+import { HAS_PERMISSION_CHECKER, SKIP_STYLE_SCOPING, getScopeIdentifier, dataStyleIdKey, dataNoPortalLayoutStylesKey, MultiLanguageMissingTranslationHandler, localeLoaders, DynamicLocaleId, providePermissionChecker, provideTranslationPathFromMeta, provideMultiLanguageIdentifier, provideTranslationConnectionService } from '@onecx/angular-utils';
 import { switchMap, of, from, take, map, BehaviorSubject, filter, concat, tap, combineLatest, mergeMap, startWith, debounceTime, firstValueFrom, ReplaySubject, timestamp, isObservable, withLatestFrom, Subject, skip } from 'rxjs';
 import { createLoggerFactory, Topic, getLocation, isValidDate, getUTCDateWithoutTimezoneIssues } from '@onecx/accelerator';
 import { HttpClient } from '@angular/common/http';
@@ -12,7 +12,7 @@ import { LiveAnnouncer } from '@angular/cdk/a11y';
 import * as i8 from '@ngx-translate/core';
 import { TranslateService, TranslatePipe, TranslateModule } from '@ngx-translate/core';
 import * as i1 from '@angular/common';
-import { DatePipe, DecimalPipe, CurrencyPipe, formatDate, CommonModule } from '@angular/common';
+import { DatePipe, DecimalPipe, CurrencyPipe, formatDate, registerLocaleData, CommonModule } from '@angular/common';
 import * as i2$1 from 'primeng/button';
 import { ButtonModule } from 'primeng/button';
 import * as i5 from 'primeng/skeleton';
@@ -174,7 +174,7 @@ class OcxContentDirective {
     }
     addContentStyles() {
         const addClasses = (classes) => this.el.nativeElement.classList.add(...classes);
-        addClasses(['card']);
+        addClasses(['ocx-card']);
     }
     prependTitle() {
         const titleElementId = this.titleElementId();
@@ -1038,11 +1038,11 @@ class SearchHeaderComponent {
         this.visibleFormControls = contentChildren(FormControlName, { ...(ngDevMode ? { debugName: "visibleFormControls" } : {}), descendants: true });
         this.searchParameterFields = viewChild('searchParameterFields', ...(ngDevMode ? [{ debugName: "searchParameterFields" }] : []));
         this.hasAdvanced = signal(false, ...(ngDevMode ? [{ debugName: "hasAdvanced" }] : []));
-        this.simpleAdvancedAction = signal({
+        this.simpleAdvancedAction = {
             id: 'simpleAdvancedButton',
             actionCallback: () => this.toggleViewMode(),
             show: 'always',
-        }, ...(ngDevMode ? [{ debugName: "simpleAdvancedAction" }] : []));
+        };
         this.headerActions = signal([], ...(ngDevMode ? [{ debugName: "headerActions" }] : []));
         this.searchButtonsReversed$ = of(null);
         this.fieldValues$ = combineLatest([
@@ -1055,12 +1055,22 @@ class SearchHeaderComponent {
         this.searchConfigChangedSlotEmitter = new EventEmitter();
         effect(() => {
             const viewMode = this.viewMode();
-            this.viewModeChanged?.emit(viewMode);
-            this.componentStateChanged.emit({
-                activeViewMode: viewMode,
+            untracked(() => {
+                this.viewModeChanged?.emit(viewMode);
+                this.componentStateChanged.emit({
+                    activeViewMode: viewMode,
+                });
+            });
+        });
+        // Update header actions whenever view mode, advanced availability or actions input changes
+        effect(() => {
+            this.viewMode();
+            this.hasAdvanced();
+            this.actions();
+            untracked(() => {
+                this.updateHeaderActions();
+                setTimeout(() => this.addKeyUpEventListener());
             });
-            this.updateHeaderActions();
-            setTimeout(() => this.addKeyUpEventListener());
         });
         this.announceSearchResults();
         const configurationService = inject(ConfigurationService);
@@ -1084,7 +1094,7 @@ class SearchHeaderComponent {
     updateHeaderActions() {
         const headerActions = [];
         if (this.hasAdvanced()) {
-            const simpleAdvancedAction = this.simpleAdvancedAction();
+            const simpleAdvancedAction = this.simpleAdvancedAction;
             simpleAdvancedAction.labelKey =
                 this.viewMode() === 'basic'
                     ? 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.ADVANCED.TEXT'
@@ -1126,7 +1136,9 @@ class SearchHeaderComponent {
             else {
                 announmentKey = 'OCX_SEARCH_HEADER.ANNOUNCEMENTS.RESULTS_FOUND';
             }
-            firstValueFrom(this.translate.get(announmentKey, { count: !this.loading() && this.searchResultsCount() ? this.searchResultsCount() : null })).then((translatedText) => {
+            firstValueFrom(this.translate.get(announmentKey, {
+                count: !this.loading() && this.searchResultsCount() ? this.searchResultsCount() : null,
+            })).then((translatedText) => {
                 this.liveAnnouncer.announce(translatedText, 'polite');
             });
         });
@@ -5763,38 +5775,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
                 }]
         }] });
 
-/**
- * @deprecated Use DynamicLocaleId from @onecx/angular-utils instead
- */
-class DynamicLocaleId {
-    constructor(userService) {
-        this.userService = userService;
-        Object.getOwnPropertyNames(String.prototype).forEach((k) => {
-            if (k != 'valueOf' && k != 'length') {
-                ;
-                this[k] = function (...args) {
-                    const str = this.valueOf();
-                    return str[k](...args);
-                };
-            }
-        });
-    }
-    valueOf() {
-        return this.userService.lang$.getValue();
-    }
-    get length() {
-        return this.valueOf().length;
-    }
-}
-
 const LIB_NAME = '@onecx/angular-accelerator';
-const LIB_VERSION = '8.2.2';
+const LIB_VERSION = '8.3.1';
 
 class AngularAcceleratorMissingTranslationHandler extends MultiLanguageMissingTranslationHandler {
 }
 function appInitializer(userService) {
     return async () => {
-        await firstValueFrom(userService.lang$.pipe(skip(1)));
+        const lang = await firstValueFrom(userService.lang$.pipe(skip(1)));
+        try {
+            await localeLoaders[lang]?.().then(data => registerLocaleData(data.default ?? data));
+        }
+        catch (error) {
+            console.warn(`Could not load locale data for '${lang}'. Angular pipes may not format correctly.`, error);
+        }
     };
 }
 class AngularAcceleratorModule {
@@ -6122,7 +6116,7 @@ function _hasShowTime(datePickers, formKey) {
 /**
  * Safely builds the search criteria based on form values
  * @param formRawValue the raw value of the form to use
- * @param datePickers a list of primeng datePickers of the form (use `@ViewChildren(DatePicker) datePickers!: QueryList<DatePicker>;`)
+ * @param datePickers a list of primeng datePickers of the form (use `viewChildren` to get list of datePickers)
  * @param parameters {@link BuildSearchCriteriaParameters}  to use when building the search criteria
  * @returns the search criteria as a partial of T (T = type of the search criteria)
  */