From ee4c8e5219582cb2a445f0011c22b815bf6a279f Mon Sep 17 00:00:00 2001
From: dpinse <dylanp2222@gmail.com>
Date: Thu, 1 Jun 2023 18:48:12 -0400
Subject: [PATCH] Update web-vault to v2023.5.0

---
 Dockerfile              |   4 +-
 patches/v2023.5.0.patch | 472 ++++++++++++++++++++++++++++++++++++++++
 2 files changed, 474 insertions(+), 2 deletions(-)
 create mode 100644 patches/v2023.5.0.patch

diff --git a/Dockerfile b/Dockerfile
index 394c175..3846393 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -28,8 +28,8 @@ USER node
 # Can be a tag, release, but prefer a commit hash because it's not changeable
 # https://github.com/bitwarden/clients/commit/${VAULT_VERSION}
 #
-# Using https://github.com/bitwarden/clients/releases/tag/web-v2023.4.2
-ARG VAULT_VERSION=b416432bce79cf6ee99adb908a5a26b66bb7869b
+# Using https://github.com/bitwarden/clients/releases/tag/web-v2023.5.0
+ARG VAULT_VERSION=7bb3f49abdbcf9dc4aed264feca822be9772fbd9
 
 WORKDIR /vault
 RUN git init
diff --git a/patches/v2023.5.0.patch b/patches/v2023.5.0.patch
new file mode 100644
index 0000000..77539e2
--- /dev/null
+++ b/patches/v2023.5.0.patch
@@ -0,0 +1,472 @@
+diff --git a/apps/web/src/404.html b/apps/web/src/404.html
+index 5a650b3673..275c34f726 100644
+--- a/apps/web/src/404.html
++++ b/apps/web/src/404.html
+@@ -28,7 +28,7 @@
+       <div class="container inner banner">
+         <div class="row align-items-center">
+           <div class="col brand">
+-            <i class="bwi bwi-shield"></i>&nbsp; <strong>bit</strong>warden
++            <i class="bwi bwi-shield"></i>&nbsp; <strong>Vault</strong>warden
+           </div>
+         </div>
+       </div>
+@@ -42,11 +42,10 @@
+         </a>
+       </p>
+       <p>
+-        You can <a href="/">return to the web vault</a>, check our
+-        <a href="https://status.bitwarden.com/">status page</a> or
+-        <a href="https://bitwarden.com/contact/">contact us</a>.
++        You can <a href="/">return to the web vault</a>, or
++        <a href="https://github.com/dani-garcia/vaultwarden">contact us</a>.
+       </p>
+     </div>
+-    <div class="container footer text-muted content">© Copyright 2023 Bitwarden, Inc.</div>
++    <div class="container footer text-muted content">Vaultwarden (unofficial Bitwarden&reg; server)</div>
+   </body>
+ </html>
+diff --git a/apps/web/src/app/admin-console/organizations/create/organization-information.component.html b/apps/web/src/app/admin-console/organizations/create/organization-information.component.html
+index 6029cfd833..04324b7d19 100644
+--- a/apps/web/src/app/admin-console/organizations/create/organization-information.component.html
++++ b/apps/web/src/app/admin-console/organizations/create/organization-information.component.html
+@@ -12,7 +12,7 @@
+       <input bitInput type="text" formControlName="name" />
+     </bit-form-field>
+     <bit-form-field class="tw-w-1/2">
+-      <bit-label>{{ "billingEmail" | i18n }}</bit-label>
++      <bit-label>{{ "email" | i18n }}</bit-label>
+       <input bitInput type="email" formControlName="billingEmail" />
+     </bit-form-field>
+     <bit-form-field class="tw-w-1/2" *ngIf="isProvider">
+diff --git a/apps/web/src/app/admin-console/organizations/settings/account.component.html b/apps/web/src/app/admin-console/organizations/settings/account.component.html
+index 096ae89015..d7f1b9356a 100644
+--- a/apps/web/src/app/admin-console/organizations/settings/account.component.html
++++ b/apps/web/src/app/admin-console/organizations/settings/account.component.html
+@@ -30,7 +30,7 @@
+         />
+       </div>
+       <div class="form-group">
+-        <label for="billingEmail">{{ "billingEmail" | i18n }}</label>
++        <label for="billingEmail">{{ "email" | i18n }}</label>
+         <input
+           id="billingEmail"
+           class="form-control"
+diff --git a/apps/web/src/app/app.component.ts b/apps/web/src/app/app.component.ts
+index 6826da0467..5f5d1e964b 100644
+--- a/apps/web/src/app/app.component.ts
++++ b/apps/web/src/app/app.component.ts
+@@ -172,6 +172,10 @@ export class AppComponent implements OnDestroy, OnInit {
+             break;
+           }
+           case "showToast":
++            if (typeof message.text === "string" && typeof crypto.subtle === 'undefined') {
++              message.title="This browser requires HTTPS to use the web vault";
++              message.text="Check the Vaultwarden wiki for details on how to enable it";
++            }
+             this.showToast(message);
+             break;
+           case "setFullWidth":
+diff --git a/apps/web/src/app/billing/organizations/organization-billing-history-view.component.ts b/apps/web/src/app/billing/organizations/organization-billing-history-view.component.ts
+index 22cea10acb..22bb116c1c 100644
+--- a/apps/web/src/app/billing/organizations/organization-billing-history-view.component.ts
++++ b/apps/web/src/app/billing/organizations/organization-billing-history-view.component.ts
+@@ -45,7 +45,7 @@ export class OrgBillingHistoryViewComponent implements OnInit, OnDestroy {
+       return;
+     }
+     this.loading = true;
+-    this.billing = await this.organizationApiService.getBilling(this.organizationId);
++    this.billing = null
+     this.loading = false;
+   }
+ }
+diff --git a/apps/web/src/app/core/init.service.ts b/apps/web/src/app/core/init.service.ts
+index 1ecd7d3fef..0dd5f049c7 100644
+--- a/apps/web/src/app/core/init.service.ts
++++ b/apps/web/src/app/core/init.service.ts
+@@ -37,11 +37,23 @@ export class InitService {
+   ) {}
+ 
+   init() {
++    function getBaseUrl() {
++      // If the base URL is `https://vaultwarden.example.com/base/path/`,
++      // `window.location.href` should have one of the following forms:
++      //
++      // - `https://vaultwarden.example.com/base/path/`
++      // - `https://vaultwarden.example.com/base/path/#/some/route[?queryParam=...]`
++      //
++      // We want to get to just `https://vaultwarden.example.com/base/path`.
++      let baseUrl = window.location.href;
++      baseUrl = baseUrl.replace(/#.*/, '');  // Strip off `#` and everything after.
++      baseUrl = baseUrl.replace(/\/+$/, ''); // Trim any trailing `/` chars.
++      return baseUrl;
++    }
+     return async () => {
+       await this.stateService.init();
+ 
+-      const urls = process.env.URLS as Urls;
+-      urls.base ??= this.win.location.origin;
++      const urls = {base: getBaseUrl()};
+       this.environmentService.setUrls(urls);
+ 
+       setTimeout(() => this.notificationsService.init(), 3000);
+diff --git a/apps/web/src/app/core/router.service.ts b/apps/web/src/app/core/router.service.ts
+index aa9041875a..6809363759 100644
+--- a/apps/web/src/app/core/router.service.ts
++++ b/apps/web/src/app/core/router.service.ts
+@@ -23,7 +23,7 @@ export class RouterService {
+       .subscribe((event: NavigationEnd) => {
+         this.currentUrl = event.url;
+ 
+-        let title = i18nService.t("pageTitle", "Bitwarden");
++        let title = i18nService.t("pageTitle", "Vaultwarden");
+         let child = this.activatedRoute.firstChild;
+         while (child.firstChild) {
+           child = child.firstChild;
+diff --git a/apps/web/src/app/core/web-platform-utils.service.ts b/apps/web/src/app/core/web-platform-utils.service.ts
+index 302d030217..64a59b47bd 100644
+--- a/apps/web/src/app/core/web-platform-utils.service.ts
++++ b/apps/web/src/app/core/web-platform-utils.service.ts
+@@ -194,15 +194,15 @@ export class WebPlatformUtilsService implements PlatformUtilsService {
+   }
+ 
+   isDev(): boolean {
+-    return process.env.NODE_ENV === "development";
++    return false;
+   }
+ 
+   isSelfHost(): boolean {
+-    return WebPlatformUtilsService.isSelfHost();
++    return false;
+   }
+ 
+   static isSelfHost(): boolean {
+-    return process.env.ENV.toString() === "selfhosted";
++    return false;
+   }
+ 
+   copyToClipboard(text: string, options?: any): void | boolean {
+diff --git a/apps/web/src/app/layouts/footer.component.html b/apps/web/src/app/layouts/footer.component.html
+index 8cacb4ceb..37d7cfb03 100644
+--- a/apps/web/src/app/layouts/footer.component.html
++++ b/apps/web/src/app/layouts/footer.component.html
+@@ -1,6 +1,6 @@
+ <div class="container footer text-muted">
+   <div class="row">
+-    <div class="col">&copy; {{ year }} Bitwarden Inc.</div>
++    <div class="col">Vaultwarden (unofficial Bitwarden&reg; server)</div>
+     <div class="col text-center"></div>
+     <div class="col text-right">
+       {{ "versionNumber" | i18n : version }}
+diff --git a/apps/web/src/app/layouts/frontend-layout.component.html b/apps/web/src/app/layouts/frontend-layout.component.html
+index bd26ed943..fb59dba5d 100644
+--- a/apps/web/src/app/layouts/frontend-layout.component.html
++++ b/apps/web/src/app/layouts/frontend-layout.component.html
+@@ -1,34 +1,5 @@
+ <router-outlet></router-outlet>
+ <div class="container my-5 text-muted text-center">
+-  <div class="tw-mb-1">
+-    <bit-menu #environmentOptions>
+-      <a bitMenuItem href="https://vault.bitwarden.com" class="pr-4">
+-        <i
+-          class="bwi bwi-fw bwi-sm bwi-check pb-1"
+-          aria-hidden="true"
+-          [style.visibility]="isEuServer ? 'hidden' : 'visible'"
+-        ></i>
+-        <img src="../../images/us_flag.png" alt="" class="pb-1 mr-1" />
+-        {{ "us" | i18n }}
+-      </a>
+-      <a bitMenuItem href="https://vault.bitwarden.eu" class="pr-4" *ngIf="euServerFlagEnabled">
+-        <i
+-          class="bwi bwi-fw bwi-sm bwi-check pb-1"
+-          aria-hidden="true"
+-          [style.visibility]="isEuServer ? 'visible' : 'hidden'"
+-        ></i>
+-        <img src="../../images/eu_flag.png" alt="" class="pb-1 mr-1" />
+-        {{ "eu" | i18n }}
+-      </a>
+-    </bit-menu>
+-    {{ "region" | i18n }}:
+-    <a [routerLink]="[]" [bitMenuTriggerFor]="environmentOptions">
+-      <b>{{ isEuServer ? ("eu" | i18n) : ("us" | i18n) }}</b
+-      ><i class="bwi bwi-fw bwi-sm bwi-angle-down" aria-hidden="true"></i>
+-    </a>
+-    <br />
+-  </div>
+-
+-  &copy; {{ year }} Bitwarden Inc. <br />
++  Vaultwarden (unofficial Bitwarden&reg; server)<br />
+   {{ "versionNumber" | i18n : version }}
+ </div>
+diff --git a/apps/web/src/app/layouts/navbar.component.html b/apps/web/src/app/layouts/navbar.component.html
+index 0f13d7dde..88698b00e 100644
+--- a/apps/web/src/app/layouts/navbar.component.html
++++ b/apps/web/src/app/layouts/navbar.component.html
+@@ -1,6 +1,6 @@
+ <nav class="navbar navbar-expand navbar-dark" [ngClass]="{ 'nav-background-alt': selfHosted }">
+   <div class="container">
+-    <a class="navbar-brand" routerLink="/" appA11yTitle="{{ 'pageTitle' | i18n : 'Bitwarden' }}">
++    <a class="navbar-brand" routerLink="/" appA11yTitle="{{ 'pageTitle' | i18n : 'Vaultwarden' }}">
+       <i class="bwi bwi-shield" aria-hidden="true"></i>
+     </a>
+     <div class="collapse navbar-collapse">
+@@ -75,7 +75,7 @@
+               <i class="bwi bwi-fw bwi-user" aria-hidden="true"></i>
+               {{ "accountSettings" | i18n }}
+             </a>
+-            <a bitMenuItem href="https://bitwarden.com/help/" target="_blank" rel="noopener">
++            <a bitMenuItem href="https://github.com/dani-garcia/vaultwarden/" target="_blank" rel="noopener">
+               <i class="bwi bwi-fw bwi-question-circle" aria-hidden="true"></i>
+               {{ "getHelp" | i18n }}
+             </a>
+diff --git a/apps/web/src/app/settings/settings.component.ts b/apps/web/src/app/settings/settings.component.ts
+index c65f22b00d..7a01fd8f78 100644
+--- a/apps/web/src/app/settings/settings.component.ts
++++ b/apps/web/src/app/settings/settings.component.ts
+@@ -55,10 +55,6 @@ export class SettingsComponent implements OnInit, OnDestroy {
+     this.hasFamilySponsorshipAvailable = await this.organizationService.canManageSponsorships();
+     const hasPremiumFromOrg = await this.stateService.getHasPremiumFromOrganization();
+     let billing = null;
+-    if (!this.selfHosted) {
+-      billing = await this.apiService.getUserBillingHistory();
+-    }
+-    this.hideSubscription =
+-      !this.premium && hasPremiumFromOrg && (this.selfHosted || billing?.hasNoHistory);
++    this.hideSubscription = true;
+   }
+ }
+diff --git a/apps/web/src/app/tools/generator.component.ts b/apps/web/src/app/tools/generator.component.ts
+index 22a99e03fa..423b022b8d 100644
+--- a/apps/web/src/app/tools/generator.component.ts
++++ b/apps/web/src/app/tools/generator.component.ts
+@@ -40,7 +40,7 @@ export class GeneratorComponent extends BaseGeneratorComponent {
+       route,
+       window
+     );
+-    if (platformUtilsService.isSelfHost()) {
++    if (true) {
+       // Allow only valid email forwarders for self host
+       this.forwardOptions = this.forwardOptions.filter((forwarder) => forwarder.validForSelfHosted);
+     }
+diff --git a/apps/web/src/app/tools/send/access.component.html b/apps/web/src/app/tools/send/access.component.html
+index 634d0bbf40..0d4e97a2a9 100644
+--- a/apps/web/src/app/tools/send/access.component.html
++++ b/apps/web/src/app/tools/send/access.component.html
+@@ -137,15 +137,6 @@
+     <div class="col-12 text-center mt-5 text-muted">
+       <p class="mb-0">
+         {{ "sendAccessTaglineProductDesc" | i18n }}<br />
+-        {{ "sendAccessTaglineLearnMore" | i18n }}
+-        <a href="https://www.bitwarden.com/products/send?source=web-vault" target="_blank"
+-          >Bitwarden Send</a
+-        >
+-        {{ "sendAccessTaglineOr" | i18n }}
+-        <a href="https://vault.bitwarden.com/#/register" target="_blank">{{
+-          "sendAccessTaglineSignUp" | i18n
+-        }}</a>
+-        {{ "sendAccessTaglineTryToday" | i18n }}
+       </p>
+     </div>
+   </div>
+diff --git a/apps/web/src/app/vault/individual-vault/vault.component.ts b/apps/web/src/app/vault/individual-vault/vault.component.ts
+index c779418009..25a3b04c88 100644
+--- a/apps/web/src/app/vault/individual-vault/vault.component.ts
++++ b/apps/web/src/app/vault/individual-vault/vault.component.ts
+@@ -175,11 +175,7 @@ export class VaultComponent implements OnInit, OnDestroy {
+ 
+   async ngOnInit() {
+     this.showBrowserOutdated = window.navigator.userAgent.indexOf("MSIE") !== -1;
+-    this.trashCleanupWarning = this.i18nService.t(
+-      this.platformUtilsService.isSelfHost()
+-        ? "trashCleanupWarningSelfHosted"
+-        : "trashCleanupWarning"
+-    );
++    this.trashCleanupWarning =this.i18nService.t("trashCleanupWarningSelfHosted");
+ 
+     const firstSetup$ = this.route.queryParams.pipe(
+       first(),
+diff --git a/apps/web/src/app/vault/org-vault/vault.component.ts b/apps/web/src/app/vault/org-vault/vault.component.ts
+index fce2097a58..26de4ef006 100644
+--- a/apps/web/src/app/vault/org-vault/vault.component.ts
++++ b/apps/web/src/app/vault/org-vault/vault.component.ts
+@@ -165,11 +165,7 @@ export class VaultComponent implements OnInit, OnDestroy {
+   ) {}
+ 
+   async ngOnInit() {
+-    this.trashCleanupWarning = this.i18nService.t(
+-      this.platformUtilsService.isSelfHost()
+-        ? "trashCleanupWarningSelfHosted"
+-        : "trashCleanupWarning"
+-    );
++    this.trashCleanupWarning = this.i18nService.t("trashCleanupWarningSelfHosted");
+ 
+     const filter$ = this.routedVaultFilterService.filter$;
+     const organizationId$ = filter$.pipe(
+diff --git a/apps/web/src/app/auth/settings/two-factor-authenticator.component.ts b/apps/web/src/app/auth/settings/two-factor-authenticator.component.ts
+index a75d2ebd2..65813f2ed 100644
+--- a/apps/web/src/app/auth/settings/two-factor-authenticator.component.ts
++++ b/apps/web/src/app/auth/settings/two-factor-authenticator.component.ts
+@@ -109,11 +109,11 @@ export class TwoFactorAuthenticatorComponent
+       new window.QRious({
+         element: document.getElementById("qr"),
+         value:
+-          "otpauth://totp/Bitwarden:" +
++          "otpauth://totp/Vaultwarden:" +
+           Utils.encodeRFC3986URIComponent(email) +
+           "?secret=" +
+           encodeURIComponent(this.key) +
+-          "&issuer=Bitwarden",
++          "&issuer=Vaultwarden",
+         size: 160,
+       });
+     }, 100);
+diff --git a/apps/web/src/index.html b/apps/web/src/index.html
+index 63d4e72c09..68b6ada007 100644
+--- a/apps/web/src/index.html
++++ b/apps/web/src/index.html
+@@ -5,7 +5,7 @@
+     <meta name="viewport" content="width=1010" />
+     <meta name="theme-color" content="#175DDC" />
+ 
+-    <title page-title>Bitwarden Web Vault</title>
++    <title page-title>Vaultwarden Web Vault</title>
+ 
+     <link rel="apple-touch-icon" sizes="180x180" href="images/icons/apple-touch-icon.png" />
+     <link rel="icon" type="image/png" sizes="32x32" href="images/icons/favicon-32x32.png" />
+diff --git a/apps/web/src/manifest.json b/apps/web/src/manifest.json
+index 92a1204c60..5a10dc9ae9 100644
+--- a/apps/web/src/manifest.json
++++ b/apps/web/src/manifest.json
+@@ -1,5 +1,5 @@
+ {
+-  "name": "Bitwarden Vault",
++  "name": "Vaultwarden Web Vault",
+   "icons": [
+     {
+       "src": "images/icons/android-chrome-192x192.png",
+@@ -12,6 +12,6 @@
+       "type": "image/png"
+     }
+   ],
+-  "theme_color": "#175DDC",
+-  "background_color": "#175DDC"
++  "theme_color": "#ffffff",
++  "background_color": "#ffffff"
+ }
+diff --git a/apps/web/src/scss/styles.scss b/apps/web/src/scss/styles.scss
+index 0003f521c7..32ecf5112e 100644
+--- a/apps/web/src/scss/styles.scss
++++ b/apps/web/src/scss/styles.scss
+@@ -58,3 +58,62 @@
+ @import "./tables";
+ @import "./toasts";
+ @import "./vault-filters";
++
++/**** START Vaultwarden CHANGES ****/
++/* This combines all selectors extending it into one */
++%vw-hide { display: none !important; }
++
++/* This allows searching for the combined style in the browsers dev-tools (look into the head tag) */
++#vw-hide,head { @extend %vw-hide; }
++
++/* Hide the Billing Page tab */
++bit-tab-link[route="billing"] { @extend %vw-hide; }
++
++/* Hide any link pointing to Free Bitwarden Families */
++a[href$="/settings/sponsored-families"] { @extend %vw-hide; }
++
++/* Hide the `Enterprise Single Sign-On` button on the login page */
++a[routerlink="/sso"] { @extend %vw-hide; }
++
++/* Hide Two-Factor menu in Organization settings */
++app-org-settings a[href$="/settings/two-factor"] { @extend %vw-hide; }
++
++/* Hide Business Owned checkbox */
++app-org-info > form:nth-child(1) > div:nth-child(3) { @extend %vw-hide; }
++
++/* Hide organization plans */
++app-organization-plans > form > div.form-check { @extend %vw-hide; }
++app-organization-plans > form > h2.mt-5 { @extend %vw-hide; }
++
++/* Hide the `This account is owned by a business` checkbox and label */
++#ownedBusiness, label[for^=ownedBusiness] { @extend %vw-hide; }
++
++/* Hide External Id field for Collections */
++app-collection-add-edit form div.form-group:nth-child(2) { @extend %vw-hide; }
++
++/* Hide the radio button and label for the `Custom` org user type */
++#userTypeCustom, label[for^=userTypeCustom] { @extend %vw-hide; }
++
++/* Hide Business Name and Identifier */
++app-org-account form div.form-group:nth-child(3) { @extend %vw-hide; }
++app-org-account form div.form-group:nth-child(4) { @extend %vw-hide; }
++
++/* Hide Tax Info and Form in Organization settings */
++app-org-account > div.secondary-header:nth-child(3) { @extend %vw-hide; }
++app-org-account > div.secondary-header:nth-child(3) + p { @extend %vw-hide; }
++app-org-account > div.secondary-header:nth-child(3) + p + form { @extend %vw-hide; }
++
++/* Hide Device Verification form at the Two Step Login screen */
++app-security > app-two-factor-setup > form { @extend %vw-hide; }
++
++/* Replace the Bitwarden Shield at the top left with a Vaultwarden icon */
++.bwi-shield:before {
++  content: '' !important;
++  width: 32px !important;
++  height: 40px !important;
++  display: block !important;
++  background-image: url(../images/icon-white.png) !important;
++  background-repeat: no-repeat;
++  background-position-y: bottom;
++}
++/**** END Vaultwarden CHANGES ****/
+diff --git a/libs/angular/src/components/register.component.ts b/libs/angular/src/components/register.component.ts
+index cb5ba243d..2fd685f13 100644
+--- a/libs/angular/src/components/register.component.ts
++++ b/libs/angular/src/components/register.component.ts
+@@ -37,7 +37,7 @@ export class RegisterComponent extends CaptchaProtectedComponent implements OnIn
+   showPassword = false;
+   formPromise: Promise<RegisterResponse>;
+   referenceData: ReferenceEventRequest;
+-  showTerms = true;
++  showTerms = false;
+   showErrorSummary = false;
+   passwordStrengthResult: any;
+   characterMinimumMessage: string;
+@@ -95,7 +95,7 @@ export class RegisterComponent extends CaptchaProtectedComponent implements OnIn
+     protected dialogService: DialogServiceAbstraction
+   ) {
+     super(environmentService, i18nService, platformUtilsService);
+-    this.showTerms = !platformUtilsService.isSelfHost();
++    this.showTerms = false;
+     this.characterMinimumMessage = this.i18nService.t("characterMinimum", this.minimumLength);
+   }
+ 
+@@ -104,6 +104,14 @@ export class RegisterComponent extends CaptchaProtectedComponent implements OnIn
+   }
+ 
+   async submit(showToast = true) {
++      if (typeof crypto.subtle === 'undefined') {
++        this.platformUtilsService.showToast(
++          "error",
++          "This browser requires HTTPS to use the web vault",
++          "Check the Vaultwarden wiki for details on how to enable it"
++        );
++        return;
++      }
+     let email = this.formGroup.value.email;
+     email = email.trim().toLowerCase();
+     let name = this.formGroup.value.name;
+diff --git a/libs/components/src/menu/menu.component.html b/libs/components/src/menu/menu.component.html
+index d175a3fe3b..9f3150c3f6 100644
+--- a/libs/components/src/menu/menu.component.html
++++ b/libs/components/src/menu/menu.component.html
+@@ -1,7 +1,7 @@
+ <ng-template>
+   <div
+     (click)="closed.emit()"
+-    class="tw-flex tw-shrink-0 tw-flex-col tw-rounded tw-border tw-border-solid tw-border-secondary-500 tw-bg-background tw-bg-clip-padding tw-py-2"
++    class="tw-flex tw-shrink-0 tw-flex-col tw-rounded tw-border tw-border-solid tw-border-secondary-500 tw-bg-background tw-bg-clip-padding tw-py-2 tw-overflow-x-auto"
+     [attr.role]="ariaRole"
+     [attr.aria-label]="ariaLabel"
+     cdkTrapFocus