@dereekb/dbx-firebase 13.5.1 → 13.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -834,7 +834,7 @@ class DbxFirebaseLoginButtonComponent {
834
834
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: DbxFirebaseLoginButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
835
835
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: DbxFirebaseLoginButtonComponent, isStandalone: true, selector: "dbx-firebase-login-button", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { config: "configChange" }, host: { classAttribute: "dbx-firebase-login-button" }, ngImport: i0, template: `
836
836
  <ng-container dbxAction [dbxActionHandler]="handleAction" [dbxActionSuccessHandler]="onActionSuccess" [dbxActionConfirm]="confirmConfigSignal()" [dbxActionConfirmSkip]="!confirmConfigSignal()">
837
- <dbx-button dbxActionButton [customTextColor]="buttonTextColorSignal()" [customButtonColor]="buttonColorSignal()" [raised]="true" [color]="colorSignal()">
837
+ <dbx-button dbxActionButton [customTextColor]="buttonTextColorSignal()" [customButtonColor]="buttonColorSignal()" [raised]="true" [color]="colorSignal()" [attr.aria-label]="textSignal()">
838
838
  <div class="dbx-firebase-login-button-content">
839
839
  <span class="dbx-firebase-login-button-icon dbx-icon-spacer">
840
840
  @if (iconUrlSignal()) {
@@ -856,7 +856,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImpor
856
856
  selector: 'dbx-firebase-login-button',
857
857
  template: `
858
858
  <ng-container dbxAction [dbxActionHandler]="handleAction" [dbxActionSuccessHandler]="onActionSuccess" [dbxActionConfirm]="confirmConfigSignal()" [dbxActionConfirmSkip]="!confirmConfigSignal()">
859
- <dbx-button dbxActionButton [customTextColor]="buttonTextColorSignal()" [customButtonColor]="buttonColorSignal()" [raised]="true" [color]="colorSignal()">
859
+ <dbx-button dbxActionButton [customTextColor]="buttonTextColorSignal()" [customButtonColor]="buttonColorSignal()" [raised]="true" [color]="colorSignal()" [attr.aria-label]="textSignal()">
860
860
  <div class="dbx-firebase-login-button-content">
861
861
  <span class="dbx-firebase-login-button-icon dbx-icon-spacer">
862
862
  @if (iconUrlSignal()) {
@@ -1226,11 +1226,11 @@ class DbxFirebaseLoginEmailContentComponent {
1226
1226
  this.doneOrCancelled.next(false);
1227
1227
  }
1228
1228
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: DbxFirebaseLoginEmailContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1229
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: DbxFirebaseLoginEmailContentComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<div class=\"dbx-firebase-login-email-content\">\n @switch (emailModeSignal()) {\n @case ('login') {\n <ng-container *ngTemplateOutlet=\"loginView\"></ng-container>\n }\n @case ('recover') {\n <ng-container *ngTemplateOutlet=\"resetPassword\"></ng-container>\n }\n @case ('recoversent') {\n <ng-container *ngTemplateOutlet=\"resetPasswordSent\"></ng-container>\n }\n }\n</div>\n\n<!-- Login View -->\n<ng-template #loginView>\n <ng-container dbxAction [dbxActionHandler]=\"handleLoginAction\">\n <dbx-firebase-email-form [config]=\"formConfig\" dbxActionForm [dbxFormSource]=\"emailFormValueSignal()\"></dbx-firebase-email-form>\n @if (isLoginMode) {\n <div class=\"dbx-firebase-login-email-forgot-prompt\">\n <dbx-link [anchor]=\"forgotAnchor\">Forgot Password?</dbx-link>\n </div>\n }\n <div class=\"dbx-flex\">\n <dbx-button class=\"dbx-button-wide\" [text]=\"buttonText\" [raised]=\"true\" color=\"primary\" dbxActionButton></dbx-button>\n <dbx-button-spacer></dbx-button-spacer>\n <span class=\"dbx-spacer\"></span>\n <button mat-flat-button (click)=\"onCancel()\">Cancel</button>\n </div>\n <dbx-error dbxActionError></dbx-error>\n </ng-container>\n</ng-template>\n\n<!-- Reset Password View -->\n<ng-template #resetPassword>\n <div class=\"dbx-firebase-login-email-content-recovery\" dbxAction [dbxActionHandler]=\"handleRecoveryAction\" [dbxActionSuccessHandler]=\"handleRecoverySuccess\">\n <dbx-firebase-email-recovery-form dbxActionForm [dbxFormSource]=\"recoveryFormValueSignal()\"></dbx-firebase-email-recovery-form>\n <p class=\"dbx-hint\">An email will be sent to the above address to help you reset your password.</p>\n <div class=\"dbx-flex\">\n <dbx-button class=\"dbx-button-wide\" text=\"Send Recovery Email\" [raised]=\"true\" color=\"primary\" dbxActionButton></dbx-button>\n <span class=\"dbx-spacer\"></span>\n <button mat-flat-button (click)=\"onCancelReset()\">Cancel Recovery</button>\n </div>\n <dbx-error dbxActionError></dbx-error>\n </div>\n</ng-template>\n\n<!-- Reset Password Sent -->\n<ng-template #resetPasswordSent>\n <div class=\"dbx-firebase-login-email-content-recovery-sent\">\n <p class=\"dbx-hint\">A recovery email was sent to the specified address. Please check your email for next steps.</p>\n <button mat-raised-button (click)=\"clickedRecoveryAcknowledged()\">Ok</button>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DbxErrorComponent, selector: "dbx-error", inputs: ["error", "iconOnly"], outputs: ["popoverOpened"] }, { kind: "component", type: DbxLinkComponent, selector: "dbx-link", inputs: ["ref", "href", "anchor"] }, { kind: "directive", type: DbxActionErrorDirective, selector: "[dbxActionError]" }, { kind: "directive", type: DbxActionFormDirective, selector: "[dbxActionForm]", inputs: ["dbxActionFormDisabledOnWorking", "dbxActionFormIsValid", "dbxActionFormIsEqual", "dbxActionFormIsModified", "dbxActionFormMapValue"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: DbxActionModule }, { kind: "directive", type: i2.DbxActionDirective, selector: "dbx-action,[dbxAction]", exportAs: ["action", "dbxAction"] }, { kind: "directive", type: i2.DbxActionHandlerDirective, selector: "[dbxActionHandler]", inputs: ["dbxActionHandler"] }, { kind: "directive", type: i2.DbxActionSuccessHandlerDirective, selector: "[dbxActionSuccessHandler]", inputs: ["dbxActionSuccessHandler"] }, { kind: "directive", type: i2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "customButtonColor", "customTextColor", "customSpinnerColor", "basic", "tonal", "raised", "stroked", "flat", "iconOnly", "fab", "allowClickPropagation", "mode"] }, { kind: "directive", type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "component", type: DbxFirebaseEmailFormComponent, selector: "dbx-firebase-email-form" }, { kind: "component", type: DbxFirebaseEmailRecoveryFormComponent, selector: "dbx-firebase-email-recovery-form" }, { kind: "directive", type: DbxFormSourceDirective, selector: "[dbxFormSource]", inputs: ["dbxFormSourceMode", "dbxFormSource"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1229
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: DbxFirebaseLoginEmailContentComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<div class=\"dbx-firebase-login-email-content\" aria-live=\"polite\">\n @switch (emailModeSignal()) {\n @case ('login') {\n <ng-container *ngTemplateOutlet=\"loginView\"></ng-container>\n }\n @case ('recover') {\n <ng-container *ngTemplateOutlet=\"resetPassword\"></ng-container>\n }\n @case ('recoversent') {\n <ng-container *ngTemplateOutlet=\"resetPasswordSent\"></ng-container>\n }\n }\n</div>\n\n<!-- Login View -->\n<ng-template #loginView>\n <ng-container dbxAction [dbxActionHandler]=\"handleLoginAction\">\n <dbx-firebase-email-form [config]=\"formConfig\" dbxActionForm [dbxFormSource]=\"emailFormValueSignal()\"></dbx-firebase-email-form>\n @if (isLoginMode) {\n <div class=\"dbx-firebase-login-email-forgot-prompt\">\n <dbx-link [anchor]=\"forgotAnchor\">Forgot Password?</dbx-link>\n </div>\n }\n <div class=\"dbx-flex\">\n <dbx-button class=\"dbx-button-wide\" [text]=\"buttonText\" [raised]=\"true\" color=\"primary\" dbxActionButton></dbx-button>\n <dbx-button-spacer></dbx-button-spacer>\n <span class=\"dbx-spacer\"></span>\n <button mat-flat-button (click)=\"onCancel()\">Cancel</button>\n </div>\n <dbx-error dbxActionError></dbx-error>\n </ng-container>\n</ng-template>\n\n<!-- Reset Password View -->\n<ng-template #resetPassword>\n <div class=\"dbx-firebase-login-email-content-recovery\" dbxAction [dbxActionHandler]=\"handleRecoveryAction\" [dbxActionSuccessHandler]=\"handleRecoverySuccess\">\n <dbx-firebase-email-recovery-form dbxActionForm [dbxFormSource]=\"recoveryFormValueSignal()\"></dbx-firebase-email-recovery-form>\n <p class=\"dbx-hint\">An email will be sent to the above address to help you reset your password.</p>\n <div class=\"dbx-flex\">\n <dbx-button class=\"dbx-button-wide\" text=\"Send Recovery Email\" [raised]=\"true\" color=\"primary\" dbxActionButton></dbx-button>\n <span class=\"dbx-spacer\"></span>\n <button mat-flat-button (click)=\"onCancelReset()\">Cancel Recovery</button>\n </div>\n <dbx-error dbxActionError></dbx-error>\n </div>\n</ng-template>\n\n<!-- Reset Password Sent -->\n<ng-template #resetPasswordSent>\n <div class=\"dbx-firebase-login-email-content-recovery-sent\" role=\"status\">\n <p class=\"dbx-hint\">A recovery email was sent to the specified address. Please check your email for next steps.</p>\n <button mat-raised-button (click)=\"clickedRecoveryAcknowledged()\">Ok</button>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: DbxErrorComponent, selector: "dbx-error", inputs: ["error", "iconOnly"], outputs: ["popoverOpened"] }, { kind: "component", type: DbxLinkComponent, selector: "dbx-link", inputs: ["ref", "href", "anchor"] }, { kind: "directive", type: DbxActionErrorDirective, selector: "[dbxActionError]" }, { kind: "directive", type: DbxActionFormDirective, selector: "[dbxActionForm]", inputs: ["dbxActionFormDisabledOnWorking", "dbxActionFormIsValid", "dbxActionFormIsEqual", "dbxActionFormIsModified", "dbxActionFormMapValue"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$3.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: DbxActionModule }, { kind: "directive", type: i2.DbxActionDirective, selector: "dbx-action,[dbxAction]", exportAs: ["action", "dbxAction"] }, { kind: "directive", type: i2.DbxActionHandlerDirective, selector: "[dbxActionHandler]", inputs: ["dbxActionHandler"] }, { kind: "directive", type: i2.DbxActionSuccessHandlerDirective, selector: "[dbxActionSuccessHandler]", inputs: ["dbxActionSuccessHandler"] }, { kind: "directive", type: i2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["bar", "type", "buttonStyle", "color", "spinnerColor", "customButtonColor", "customTextColor", "customSpinnerColor", "basic", "tonal", "raised", "stroked", "flat", "iconOnly", "fab", "allowClickPropagation", "mode"] }, { kind: "directive", type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "component", type: DbxFirebaseEmailFormComponent, selector: "dbx-firebase-email-form" }, { kind: "component", type: DbxFirebaseEmailRecoveryFormComponent, selector: "dbx-firebase-email-recovery-form" }, { kind: "directive", type: DbxFormSourceDirective, selector: "[dbxFormSource]", inputs: ["dbxFormSourceMode", "dbxFormSource"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1230
1230
  }
1231
1231
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: DbxFirebaseLoginEmailContentComponent, decorators: [{
1232
1232
  type: Component,
1233
- args: [{ imports: [NgTemplateOutlet, DbxErrorComponent, DbxLinkComponent, DbxActionErrorDirective, DbxActionFormDirective, MatButtonModule, DbxActionModule, DbxButtonComponent, DbxButtonSpacerDirective, DbxFirebaseEmailFormComponent, DbxFirebaseEmailRecoveryFormComponent, DbxFormSourceDirective], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"dbx-firebase-login-email-content\">\n @switch (emailModeSignal()) {\n @case ('login') {\n <ng-container *ngTemplateOutlet=\"loginView\"></ng-container>\n }\n @case ('recover') {\n <ng-container *ngTemplateOutlet=\"resetPassword\"></ng-container>\n }\n @case ('recoversent') {\n <ng-container *ngTemplateOutlet=\"resetPasswordSent\"></ng-container>\n }\n }\n</div>\n\n<!-- Login View -->\n<ng-template #loginView>\n <ng-container dbxAction [dbxActionHandler]=\"handleLoginAction\">\n <dbx-firebase-email-form [config]=\"formConfig\" dbxActionForm [dbxFormSource]=\"emailFormValueSignal()\"></dbx-firebase-email-form>\n @if (isLoginMode) {\n <div class=\"dbx-firebase-login-email-forgot-prompt\">\n <dbx-link [anchor]=\"forgotAnchor\">Forgot Password?</dbx-link>\n </div>\n }\n <div class=\"dbx-flex\">\n <dbx-button class=\"dbx-button-wide\" [text]=\"buttonText\" [raised]=\"true\" color=\"primary\" dbxActionButton></dbx-button>\n <dbx-button-spacer></dbx-button-spacer>\n <span class=\"dbx-spacer\"></span>\n <button mat-flat-button (click)=\"onCancel()\">Cancel</button>\n </div>\n <dbx-error dbxActionError></dbx-error>\n </ng-container>\n</ng-template>\n\n<!-- Reset Password View -->\n<ng-template #resetPassword>\n <div class=\"dbx-firebase-login-email-content-recovery\" dbxAction [dbxActionHandler]=\"handleRecoveryAction\" [dbxActionSuccessHandler]=\"handleRecoverySuccess\">\n <dbx-firebase-email-recovery-form dbxActionForm [dbxFormSource]=\"recoveryFormValueSignal()\"></dbx-firebase-email-recovery-form>\n <p class=\"dbx-hint\">An email will be sent to the above address to help you reset your password.</p>\n <div class=\"dbx-flex\">\n <dbx-button class=\"dbx-button-wide\" text=\"Send Recovery Email\" [raised]=\"true\" color=\"primary\" dbxActionButton></dbx-button>\n <span class=\"dbx-spacer\"></span>\n <button mat-flat-button (click)=\"onCancelReset()\">Cancel Recovery</button>\n </div>\n <dbx-error dbxActionError></dbx-error>\n </div>\n</ng-template>\n\n<!-- Reset Password Sent -->\n<ng-template #resetPasswordSent>\n <div class=\"dbx-firebase-login-email-content-recovery-sent\">\n <p class=\"dbx-hint\">A recovery email was sent to the specified address. Please check your email for next steps.</p>\n <button mat-raised-button (click)=\"clickedRecoveryAcknowledged()\">Ok</button>\n </div>\n</ng-template>\n" }]
1233
+ args: [{ imports: [NgTemplateOutlet, DbxErrorComponent, DbxLinkComponent, DbxActionErrorDirective, DbxActionFormDirective, MatButtonModule, DbxActionModule, DbxButtonComponent, DbxButtonSpacerDirective, DbxFirebaseEmailFormComponent, DbxFirebaseEmailRecoveryFormComponent, DbxFormSourceDirective], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"dbx-firebase-login-email-content\" aria-live=\"polite\">\n @switch (emailModeSignal()) {\n @case ('login') {\n <ng-container *ngTemplateOutlet=\"loginView\"></ng-container>\n }\n @case ('recover') {\n <ng-container *ngTemplateOutlet=\"resetPassword\"></ng-container>\n }\n @case ('recoversent') {\n <ng-container *ngTemplateOutlet=\"resetPasswordSent\"></ng-container>\n }\n }\n</div>\n\n<!-- Login View -->\n<ng-template #loginView>\n <ng-container dbxAction [dbxActionHandler]=\"handleLoginAction\">\n <dbx-firebase-email-form [config]=\"formConfig\" dbxActionForm [dbxFormSource]=\"emailFormValueSignal()\"></dbx-firebase-email-form>\n @if (isLoginMode) {\n <div class=\"dbx-firebase-login-email-forgot-prompt\">\n <dbx-link [anchor]=\"forgotAnchor\">Forgot Password?</dbx-link>\n </div>\n }\n <div class=\"dbx-flex\">\n <dbx-button class=\"dbx-button-wide\" [text]=\"buttonText\" [raised]=\"true\" color=\"primary\" dbxActionButton></dbx-button>\n <dbx-button-spacer></dbx-button-spacer>\n <span class=\"dbx-spacer\"></span>\n <button mat-flat-button (click)=\"onCancel()\">Cancel</button>\n </div>\n <dbx-error dbxActionError></dbx-error>\n </ng-container>\n</ng-template>\n\n<!-- Reset Password View -->\n<ng-template #resetPassword>\n <div class=\"dbx-firebase-login-email-content-recovery\" dbxAction [dbxActionHandler]=\"handleRecoveryAction\" [dbxActionSuccessHandler]=\"handleRecoverySuccess\">\n <dbx-firebase-email-recovery-form dbxActionForm [dbxFormSource]=\"recoveryFormValueSignal()\"></dbx-firebase-email-recovery-form>\n <p class=\"dbx-hint\">An email will be sent to the above address to help you reset your password.</p>\n <div class=\"dbx-flex\">\n <dbx-button class=\"dbx-button-wide\" text=\"Send Recovery Email\" [raised]=\"true\" color=\"primary\" dbxActionButton></dbx-button>\n <span class=\"dbx-spacer\"></span>\n <button mat-flat-button (click)=\"onCancelReset()\">Cancel Recovery</button>\n </div>\n <dbx-error dbxActionError></dbx-error>\n </div>\n</ng-template>\n\n<!-- Reset Password Sent -->\n<ng-template #resetPasswordSent>\n <div class=\"dbx-firebase-login-email-content-recovery-sent\" role=\"status\">\n <p class=\"dbx-hint\">A recovery email was sent to the specified address. Please check your email for next steps.</p>\n <button mat-raised-button (click)=\"clickedRecoveryAcknowledged()\">Ok</button>\n </div>\n</ng-template>\n" }]
1234
1234
  }] });
1235
1235
 
1236
1236
  /**
@@ -1546,6 +1546,21 @@ class DbxFirebaseLoginListComponent {
1546
1546
  providerTypes = input(...(ngDevMode ? [undefined, { debugName: "providerTypes" }] : /* istanbul ignore next */ []));
1547
1547
  omitProviderTypes = input(...(ngDevMode ? [undefined, { debugName: "omitProviderTypes" }] : /* istanbul ignore next */ []));
1548
1548
  providerCategories = input(...(ngDevMode ? [undefined, { debugName: "providerCategories" }] : /* istanbul ignore next */ []));
1549
+ loginModeAriaLabelSignal = computed(() => {
1550
+ switch (this.loginMode()) {
1551
+ case 'register':
1552
+ return 'Registration options';
1553
+ case 'link':
1554
+ return 'Link account options';
1555
+ case 'unlink':
1556
+ return 'Unlink account options';
1557
+ default:
1558
+ return 'Login options';
1559
+ }
1560
+ }, ...(ngDevMode ? [{ debugName: "loginModeAriaLabelSignal" }] : /* istanbul ignore next */ []));
1561
+ get loginModeAriaLabel() {
1562
+ return this.loginModeAriaLabelSignal();
1563
+ }
1549
1564
  providerTypesSignal = computed(() => {
1550
1565
  const providerTypes = this.providerTypes();
1551
1566
  const omitProviderTypes = this.omitProviderTypes();
@@ -1593,9 +1608,9 @@ class DbxFirebaseLoginListComponent {
1593
1608
  return providers.map(mapFn);
1594
1609
  }, ...(ngDevMode ? [{ debugName: "providersInjectionConfigsSignal" }] : /* istanbul ignore next */ []));
1595
1610
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: DbxFirebaseLoginListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1596
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: DbxFirebaseLoginListComponent, isStandalone: true, selector: "dbx-firebase-login-list", inputs: { loginMode: { classPropertyName: "loginMode", publicName: "loginMode", isSignal: true, isRequired: false, transformFunction: null }, providerTypes: { classPropertyName: "providerTypes", publicName: "providerTypes", isSignal: true, isRequired: false, transformFunction: null }, omitProviderTypes: { classPropertyName: "omitProviderTypes", publicName: "omitProviderTypes", isSignal: true, isRequired: false, transformFunction: null }, providerCategories: { classPropertyName: "providerCategories", publicName: "providerCategories", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "dbx-firebase-login-list dbx-button-column" }, ngImport: i0, template: `
1611
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: DbxFirebaseLoginListComponent, isStandalone: true, selector: "dbx-firebase-login-list", inputs: { loginMode: { classPropertyName: "loginMode", publicName: "loginMode", isSignal: true, isRequired: false, transformFunction: null }, providerTypes: { classPropertyName: "providerTypes", publicName: "providerTypes", isSignal: true, isRequired: false, transformFunction: null }, omitProviderTypes: { classPropertyName: "omitProviderTypes", publicName: "omitProviderTypes", isSignal: true, isRequired: false, transformFunction: null }, providerCategories: { classPropertyName: "providerCategories", publicName: "providerCategories", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "list" }, properties: { "attr.aria-label": "loginModeAriaLabel" }, classAttribute: "dbx-firebase-login-list dbx-button-column" }, ngImport: i0, template: `
1597
1612
  @for (config of providersInjectionConfigsSignal(); track config.loginMethodType) {
1598
- <div class="dbx-firebase-login-item">
1613
+ <div class="dbx-firebase-login-item" role="listitem">
1599
1614
  <dbx-injection [config]="config"></dbx-injection>
1600
1615
  </div>
1601
1616
  }
@@ -1607,13 +1622,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImpor
1607
1622
  selector: 'dbx-firebase-login-list',
1608
1623
  template: `
1609
1624
  @for (config of providersInjectionConfigsSignal(); track config.loginMethodType) {
1610
- <div class="dbx-firebase-login-item">
1625
+ <div class="dbx-firebase-login-item" role="listitem">
1611
1626
  <dbx-injection [config]="config"></dbx-injection>
1612
1627
  </div>
1613
1628
  }
1614
1629
  `,
1615
1630
  host: {
1616
- class: 'dbx-firebase-login-list dbx-button-column'
1631
+ class: 'dbx-firebase-login-list dbx-button-column',
1632
+ role: 'list',
1633
+ '[attr.aria-label]': 'loginModeAriaLabel'
1617
1634
  },
1618
1635
  standalone: true,
1619
1636
  imports: [DbxInjectionComponent]
@@ -5662,7 +5679,7 @@ class DbxFirebaseNotificationItemListViewItemComponent extends AbstractDbxValueL
5662
5679
  }
5663
5680
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: DbxFirebaseNotificationItemListViewItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
5664
5681
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.3", type: DbxFirebaseNotificationItemListViewItemComponent, isStandalone: true, selector: "ng-component", usesInheritance: true, ngImport: i0, template: `
5665
- <div class="dbx-list-item-padded dbx-list-two-line-item dbx-firebase-notificationitem-list-view-item">
5682
+ <div class="dbx-list-item-padded dbx-list-two-line-item dbx-firebase-notificationitem-list-view-item" role="article" [attr.aria-label]="subject">
5666
5683
  <div class="item-left">
5667
5684
  <span class="notificationitem-subject">{{ subject }}</span>
5668
5685
  <span class="notificationitem-message item-details">{{ message | cutText: 90 }}</span>
@@ -5675,7 +5692,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImpor
5675
5692
  type: Component,
5676
5693
  args: [{
5677
5694
  template: `
5678
- <div class="dbx-list-item-padded dbx-list-two-line-item dbx-firebase-notificationitem-list-view-item">
5695
+ <div class="dbx-list-item-padded dbx-list-two-line-item dbx-firebase-notificationitem-list-view-item" role="article" [attr.aria-label]="subject">
5679
5696
  <div class="item-left">
5680
5697
  <span class="notificationitem-subject">{{ subject }}</span>
5681
5698
  <span class="notificationitem-message item-details">{{ message | cutText: 90 }}</span>
@@ -5697,11 +5714,11 @@ class DbxFirebaseNotificationItemContentComponent {
5697
5714
  message = input(...(ngDevMode ? [undefined, { debugName: "message" }] : /* istanbul ignore next */ []));
5698
5715
  date = input(...(ngDevMode ? [undefined, { debugName: "date" }] : /* istanbul ignore next */ []));
5699
5716
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: DbxFirebaseNotificationItemContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
5700
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: DbxFirebaseNotificationItemContentComponent, isStandalone: true, selector: "dbx-firebase-notificationitem-content", inputs: { subject: { classPropertyName: "subject", publicName: "subject", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"dbx-firebase-notificationitem-content\">\n <div class=\"notificationitem-header dbx-pb2\">\n @if (subject()) {\n <div class=\"notificationitem-subject dbx-pb1\">{{ subject() }}</div>\n }\n <ng-content select=\"[header]\"></ng-content>\n @if (date()) {\n <div class=\"notificationitem-date dbx-label dbx-small\">{{ date() | date: 'medium' }}</div>\n }\n </div>\n <ng-content select=\"[premessage]\"></ng-content>\n <div class=\"notificationitem-message\">{{ message() }}</div>\n <ng-content></ng-content>\n</div>\n", styles: [".dbx-firebase-notificationitem-content .notificationitem-subject{font-size:1.25em}\n"], dependencies: [{ kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
5717
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: DbxFirebaseNotificationItemContentComponent, isStandalone: true, selector: "dbx-firebase-notificationitem-content", inputs: { subject: { classPropertyName: "subject", publicName: "subject", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"dbx-firebase-notificationitem-content\" role=\"article\" [attr.aria-label]=\"subject()\">\n <div class=\"notificationitem-header dbx-pb2\">\n @if (subject()) {\n <div class=\"notificationitem-subject dbx-pb1\">{{ subject() }}</div>\n }\n <ng-content select=\"[header]\"></ng-content>\n @if (date()) {\n <div class=\"notificationitem-date dbx-label dbx-small\">{{ date() | date: 'medium' }}</div>\n }\n </div>\n <ng-content select=\"[premessage]\"></ng-content>\n <div class=\"notificationitem-message\">{{ message() }}</div>\n <ng-content></ng-content>\n</div>\n", styles: [".dbx-firebase-notificationitem-content .notificationitem-subject{font-size:1.25em}\n"], dependencies: [{ kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
5701
5718
  }
5702
5719
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: DbxFirebaseNotificationItemContentComponent, decorators: [{
5703
5720
  type: Component,
5704
- args: [{ selector: 'dbx-firebase-notificationitem-content', imports: [DatePipe], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"dbx-firebase-notificationitem-content\">\n <div class=\"notificationitem-header dbx-pb2\">\n @if (subject()) {\n <div class=\"notificationitem-subject dbx-pb1\">{{ subject() }}</div>\n }\n <ng-content select=\"[header]\"></ng-content>\n @if (date()) {\n <div class=\"notificationitem-date dbx-label dbx-small\">{{ date() | date: 'medium' }}</div>\n }\n </div>\n <ng-content select=\"[premessage]\"></ng-content>\n <div class=\"notificationitem-message\">{{ message() }}</div>\n <ng-content></ng-content>\n</div>\n", styles: [".dbx-firebase-notificationitem-content .notificationitem-subject{font-size:1.25em}\n"] }]
5721
+ args: [{ selector: 'dbx-firebase-notificationitem-content', imports: [DatePipe], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"dbx-firebase-notificationitem-content\" role=\"article\" [attr.aria-label]=\"subject()\">\n <div class=\"notificationitem-header dbx-pb2\">\n @if (subject()) {\n <div class=\"notificationitem-subject dbx-pb1\">{{ subject() }}</div>\n }\n <ng-content select=\"[header]\"></ng-content>\n @if (date()) {\n <div class=\"notificationitem-date dbx-label dbx-small\">{{ date() | date: 'medium' }}</div>\n }\n </div>\n <ng-content select=\"[premessage]\"></ng-content>\n <div class=\"notificationitem-message\">{{ message() }}</div>\n <ng-content></ng-content>\n</div>\n", styles: [".dbx-firebase-notificationitem-content .notificationitem-subject{font-size:1.25em}\n"] }]
5705
5722
  }], propDecorators: { subject: [{ type: i0.Input, args: [{ isSignal: true, alias: "subject", required: false }] }], message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: false }] }], date: [{ type: i0.Input, args: [{ isSignal: true, alias: "date", required: false }] }] } });
5706
5723
 
5707
5724
  /**
@@ -5933,7 +5950,7 @@ class DbxFirebaseNotificationItemStorePopoverButtonComponent extends AbstractPop
5933
5950
  }
5934
5951
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: DbxFirebaseNotificationItemStorePopoverButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
5935
5952
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.3", type: DbxFirebaseNotificationItemStorePopoverButtonComponent, isStandalone: true, selector: "dbx-firebase-notification-item-store-popover-button", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
5936
- <dbx-icon-button #button (buttonClick)="showNotificationsPopover()" icon="notifications"></dbx-icon-button>
5953
+ <dbx-icon-button #button (buttonClick)="showNotificationsPopover()" icon="notifications" aria-label="Notifications"></dbx-icon-button>
5937
5954
  `, isInline: true, dependencies: [{ kind: "component", type: DbxIconButtonComponent, selector: "dbx-icon-button" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
5938
5955
  }
5939
5956
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: DbxFirebaseNotificationItemStorePopoverButtonComponent, decorators: [{
@@ -5941,7 +5958,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImpor
5941
5958
  args: [{
5942
5959
  selector: 'dbx-firebase-notification-item-store-popover-button',
5943
5960
  template: `
5944
- <dbx-icon-button #button (buttonClick)="showNotificationsPopover()" icon="notifications"></dbx-icon-button>
5961
+ <dbx-icon-button #button (buttonClick)="showNotificationsPopover()" icon="notifications" aria-label="Notifications"></dbx-icon-button>
5945
5962
  `,
5946
5963
  standalone: true,
5947
5964
  imports: [DbxIconButtonComponent],