@vendure/admin-ui 2.3.1 → 2.3.3

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.
@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
2
2
  import { Injectable, Component, isDevMode, Inject, HostListener, ViewChild, EventEmitter, Input, Output, Directive, ChangeDetectionStrategy, Optional, ContentChild, Pipe, HostBinding, Injector, APP_INITIALIZER, NgModule, ChangeDetectorRef, ViewContainerRef, ViewChildren, forwardRef, TemplateRef, SkipSelf, inject, ContentChildren, ElementRef, Self, CUSTOM_ELEMENTS_SCHEMA, DestroyRef, InjectionToken } from '@angular/core';
3
3
  import * as i2 from '@angular/common';
4
4
  import { DOCUMENT, CommonModule, PlatformLocation } from '@angular/common';
5
- import { concatMap, bufferCount, map, filter, distinctUntilChanged, skip, takeUntil, tap, take, finalize, switchMap, mergeMap, startWith, mapTo, catchError, shareReplay, throttleTime, scan, debounceTime, delay, bufferWhen, delayWhen } from 'rxjs/operators';
5
+ import { concatMap, bufferCount, map, filter, distinctUntilChanged, skip, takeUntil, tap, take, finalize, switchMap, mergeMap, startWith, catchError, shareReplay, throttleTime, scan, debounceTime, mapTo, delay, bufferWhen, delayWhen } from 'rxjs/operators';
6
6
  import * as i1 from 'apollo-angular';
7
7
  import { gql, ApolloModule, APOLLO_OPTIONS } from 'apollo-angular';
8
8
  import { pick } from '@vendure/common/lib/pick';
@@ -7203,9 +7203,9 @@ class Alert {
7203
7203
  this.hasRun$ = new BehaviorSubject(false);
7204
7204
  this.data$ = new BehaviorSubject(undefined);
7205
7205
  if (this.config.recheck) {
7206
- this.config.recheck(this.context).subscribe(() => this.runCheck());
7206
+ this.subscription = this.config.recheck(this.context).subscribe(() => this.runCheck());
7207
7207
  }
7208
- this.activeAlert$ = combineLatest(this.data$, this.hasRun$).pipe(map(([data, hasRun]) => {
7208
+ this.activeAlert$ = combineLatest([this.data$, this.hasRun$]).pipe(map(([data, hasRun]) => {
7209
7209
  if (!data) {
7210
7210
  return;
7211
7211
  }
@@ -7242,6 +7242,11 @@ class Alert {
7242
7242
  }
7243
7243
  this.hasRun$.next(false);
7244
7244
  }
7245
+ destroy() {
7246
+ if (this.subscription) {
7247
+ this.subscription.unsubscribe();
7248
+ }
7249
+ }
7245
7250
  }
7246
7251
  class AlertsService {
7247
7252
  constructor(permissionsService, injector, dataService, notificationService, modalService) {
@@ -7283,6 +7288,11 @@ class AlertsService {
7283
7288
  this.alertsMap.forEach(config => config.runCheck());
7284
7289
  }
7285
7290
  }
7291
+ clearAlerts() {
7292
+ this.alertsMap.forEach(alert => alert.destroy());
7293
+ this.alertsMap.clear();
7294
+ this.configUpdated.next();
7295
+ }
7286
7296
  createContext() {
7287
7297
  return {
7288
7298
  injector: this.injector,
@@ -7626,7 +7636,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
7626
7636
  }], ctorParameters: () => [{ type: AlertsService }] });
7627
7637
 
7628
7638
  // Auto-generated by the set-version.js script.
7629
- const ADMIN_UI_VERSION = '2.3.1';
7639
+ const ADMIN_UI_VERSION = '2.3.3';
7630
7640
 
7631
7641
  /* eslint-disable @angular-eslint/directive-selector */
7632
7642
  class FormFieldControlDirective {
@@ -8188,11 +8198,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
8188
8198
  * This service handles logic relating to authentication of the current user.
8189
8199
  */
8190
8200
  class AuthService {
8191
- constructor(localStorageService, dataService, serverConfigService, permissionsService) {
8201
+ constructor(localStorageService, dataService, serverConfigService, permissionsService, alertService) {
8192
8202
  this.localStorageService = localStorageService;
8193
8203
  this.dataService = dataService;
8194
8204
  this.serverConfigService = serverConfigService;
8195
8205
  this.permissionsService = permissionsService;
8206
+ this.alertService = alertService;
8196
8207
  }
8197
8208
  /**
8198
8209
  * Attempts to log in via the REST login endpoint and updates the app
@@ -8235,7 +8246,9 @@ class AuthService {
8235
8246
  else {
8236
8247
  return [];
8237
8248
  }
8238
- }), mapTo(true));
8249
+ }), tap(() => {
8250
+ this.alertService.clearAlerts();
8251
+ }), map(() => true));
8239
8252
  }
8240
8253
  /**
8241
8254
  * Checks the app state to see if the user is already logged in,
@@ -8273,7 +8286,7 @@ class AuthService {
8273
8286
  return of(false);
8274
8287
  }
8275
8288
  }));
8276
- }), mapTo(true), catchError(err => of(false)));
8289
+ }), map(() => true), catchError(err => of(false)));
8277
8290
  }
8278
8291
  getActiveChannel(userChannels) {
8279
8292
  const lastActiveChannelToken = this.localStorageService.get('activeChannelToken');
@@ -8289,7 +8302,7 @@ class AuthService {
8289
8302
  setChannelToken(userChannels) {
8290
8303
  this.localStorageService.set('activeChannelToken', this.getActiveChannel(userChannels).token);
8291
8304
  }
8292
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AuthService, deps: [{ token: LocalStorageService }, { token: DataService }, { token: ServerConfigService }, { token: PermissionsService }], target: i0.ɵɵFactoryTarget.Injectable }); }
8305
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AuthService, deps: [{ token: LocalStorageService }, { token: DataService }, { token: ServerConfigService }, { token: PermissionsService }, { token: AlertsService }], target: i0.ɵɵFactoryTarget.Injectable }); }
8293
8306
  static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AuthService, providedIn: 'root' }); }
8294
8307
  }
8295
8308
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AuthService, decorators: [{
@@ -8297,7 +8310,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
8297
8310
  args: [{
8298
8311
  providedIn: 'root',
8299
8312
  }]
8300
- }], ctorParameters: () => [{ type: LocalStorageService }, { type: DataService }, { type: ServerConfigService }, { type: PermissionsService }] });
8313
+ }], ctorParameters: () => [{ type: LocalStorageService }, { type: DataService }, { type: ServerConfigService }, { type: PermissionsService }, { type: AlertsService }] });
8301
8314
 
8302
8315
  class BreadcrumbService {
8303
8316
  constructor(router, route, dataService) {
@@ -9572,11 +9585,11 @@ class AppShellComponent {
9572
9585
  });
9573
9586
  }
9574
9587
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppShellComponent, deps: [{ token: AuthService }, { token: DataService }, { token: i1$1.Router }, { token: I18nService }, { token: ModalService }, { token: LocalStorageService }, { token: BreadcrumbService }, { token: LocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
9575
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: AppShellComponent, selector: "vdr-app-shell", ngImport: i0, template: "<div class=\"app-container\" [dir]=\"direction$ | async\">\r\n <div class=\"left-nav\" [class.expanded]=\"mainNavExpanded$ | async\">\r\n <div class=\"branding\">\r\n <a [routerLink]=\"['/']\" *ngIf=\"!hideVendureBranding\"\r\n ><img src=\"assets/logo-top.webp\" class=\"logo\" style=\"max-width: 100px\"\r\n /></a>\r\n <div class=\"collapse-menu\">\r\n <button class=\"\" (click)=\"collapseNav()\">\r\n <clr-icon shape=\"window-close\" size=\"24\"></clr-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"mx-4\">\r\n <vdr-channel-switcher *vdrIfMultichannel></vdr-channel-switcher>\r\n </div>\r\n <div class=\"main-nav-container\">\r\n <vdr-main-nav (itemClick)=\"collapseNav()\"></vdr-main-nav>\r\n </div>\r\n <div class=\"settings-nav-container\">\r\n <hr />\r\n <vdr-main-nav displayMode=\"settings\" (itemClick)=\"collapseNav()\"></vdr-main-nav>\r\n </div>\r\n <div class=\"mx-2 flex center mb-1\" [class.mt-2]=\"hideVersion && !devMode\">\r\n <div *ngIf=\"!hideVersion\" class=\"version\">\r\n v{{ version }}\r\n </div>\r\n <vdr-dropdown *ngIf=\"devMode\">\r\n <button class=\"icon-button dev-mode-button\" vdrDropdownTrigger title=\"DEV MODE\">\r\n <clr-icon shape=\"code\" size=\"24\"></clr-icon> DEV MODE\r\n </button>\r\n <vdr-dropdown-menu>\r\n <div class=\"px-2 py-1\">\r\n <div>Version: {{ version }}</div>\r\n <div>View UI extension points: <kbd>CTRL + U</kbd></div>\r\n </div>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n </div>\r\n </div>\r\n\r\n <div class=\"surface\">\r\n <div class=\"content-container\">\r\n <div class=\"top-bar\">\r\n <div class=\"expand-menu mr-1\">\r\n <button class=\"\" (click)=\"expandNav()\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke-width=\"1.5\"\r\n stroke=\"currentColor\"\r\n class=\"bars\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5\"\r\n />\r\n </svg>\r\n </button>\r\n </div>\r\n <div>\r\n <vdr-breadcrumb></vdr-breadcrumb>\r\n </div>\r\n <div class=\"universal-search flex-spacer\"></div>\r\n <div class=\"mx-1\">\r\n <vdr-alerts></vdr-alerts>\r\n </div>\r\n <div>\r\n <vdr-user-menu\r\n [userName]=\"userName$ | async\"\r\n [uiLanguageAndLocale]=\"uiLanguageAndLocale$ | async\"\r\n [availableLanguages]=\"availableLanguages\"\r\n (selectUiLanguage)=\"selectUiLanguage()\"\r\n (logOut)=\"logOut()\"\r\n ></vdr-user-menu>\r\n </div>\r\n </div>\r\n <div class=\"content-area\"><router-outlet></router-outlet></div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".app-container{display:flex;height:100vh;overflow:hidden}.left-nav{background-color:var(--color-left-nav-bg);color:var(--color-left-nav-text);display:flex;flex-direction:column;overflow:hidden;height:100%;border-inline-end:1px solid var(--color-weight-150);z-index:2;width:var(--left-nav-width);max-width:var(--left-nav-width)}@media screen and (max-width: 992px){.left-nav.expanded{position:fixed;inset:0;width:100%;max-width:100%;animation:fade-in .2s ease-in-out forwards}}.version{color:var(--color-grey-300)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media screen and (min-width: 992px){.expand-menu,.collapse-menu{display:none}}.expand-menu button,.collapse-menu button{border:none;padding:calc(var(--space-unit) * 1) calc(var(--space-unit) * 2);background-color:var(--color-page-header-item-bg);border-radius:var(--border-radius-lg);color:var(--color-text-100);display:flex;align-items:center;justify-content:center}.expand-menu .bars,.collapse-menu .bars{width:24px;height:24px}.collapse-menu button{height:40px;background-color:var(--color-weight-200)}.main-nav-container{overflow:auto;flex:1}.settings-nav-container{margin:calc(var(--space-unit) * 3) 0 -10px 0}.settings-nav-container hr{margin:0 calc(var(--space-unit) * 4);margin-bottom:calc(var(--space-unit) * 4);border:1px solid var(--color-weight-150);box-shadow:0 1px 0 var(--color-weight-100)}.logo{max-width:100%}.wordmark{font-weight:700;margin-inline-start:12px;font-size:24px;color:var(--color-primary-500)}@media screen and (max-width: 992px){.wordmark{display:none}}.surface{display:flex;flex-direction:column;flex:1;background-color:var(--color-surface-bg)}.content-container{overflow:auto;min-height:100vh;display:flex;flex-direction:column}.branding{display:flex;align-items:center;justify-content:space-between;min-width:0;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 4);padding-inline-end:calc(var(--space-unit) * 1.5)}@media screen and (min-width: 992px){.branding{padding:calc(var(--space-unit) * 4)}}.top-bar{width:100%;display:flex;align-items:center;justify-content:space-between;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 1);background-color:var(--color-page-header)}@media screen and (min-width: 992px){.top-bar{padding:calc(var(--space-unit) * 4);padding-inline-start:var(--surface-margin-left)}}.header-actions{align-items:center}.content-area{position:relative;margin-inline-end:auto;flex:1;display:block;width:100%}.dev-mode-button{opacity:.7;font-size:12px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: IfMultichannelDirective, selector: "[vdrIfMultichannel]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: UserMenuComponent, selector: "vdr-user-menu", inputs: ["userName", "availableLanguages", "uiLanguageAndLocale"], outputs: ["logOut", "selectUiLanguage"] }, { kind: "component", type: MainNavComponent, selector: "vdr-main-nav", inputs: ["displayMode"], outputs: ["itemClick"] }, { kind: "component", type: BreadcrumbComponent, selector: "vdr-breadcrumb" }, { kind: "component", type: ChannelSwitcherComponent, selector: "vdr-channel-switcher" }, { kind: "component", type: AlertsComponent, selector: "vdr-alerts" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] }); }
9588
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: AppShellComponent, selector: "vdr-app-shell", ngImport: i0, template: "<div class=\"app-container\" [dir]=\"direction$ | async\">\r\n <div class=\"left-nav\" [class.expanded]=\"mainNavExpanded$ | async\">\r\n <div class=\"branding\">\r\n <a [routerLink]=\"['/']\" *ngIf=\"!hideVendureBranding\"\r\n ><img src=\"assets/logo-top.webp\" class=\"logo\" style=\"max-width: 100px\"\r\n /></a>\r\n <div class=\"collapse-menu\">\r\n <button class=\"\" (click)=\"collapseNav()\">\r\n <clr-icon shape=\"window-close\" size=\"24\"></clr-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"mx-4\">\r\n <vdr-channel-switcher *vdrIfMultichannel></vdr-channel-switcher>\r\n </div>\r\n <div class=\"main-nav-container\">\r\n <vdr-main-nav (itemClick)=\"collapseNav()\"></vdr-main-nav>\r\n </div>\r\n <div class=\"settings-nav-container\">\r\n <hr />\r\n <vdr-main-nav displayMode=\"settings\" (itemClick)=\"collapseNav()\"></vdr-main-nav>\r\n </div>\r\n <div class=\"mx-2 flex center mb-1\" [class.mt-2]=\"hideVersion && !devMode\">\r\n <div *ngIf=\"!hideVersion\" class=\"version\">\r\n v{{ version }}\r\n </div>\r\n <vdr-dropdown *ngIf=\"devMode\">\r\n <button class=\"icon-button dev-mode-button\" vdrDropdownTrigger title=\"DEV MODE\">\r\n <clr-icon shape=\"code\" size=\"24\"></clr-icon> DEV MODE\r\n </button>\r\n <vdr-dropdown-menu>\r\n <div class=\"px-2 py-1\">\r\n <div>Version: {{ version }}</div>\r\n <div>View UI extension points: <kbd>CTRL + U</kbd></div>\r\n </div>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n </div>\r\n </div>\r\n\r\n <div class=\"surface\">\r\n <div class=\"content-container\">\r\n <div class=\"top-bar\">\r\n <div class=\"expand-menu mr-1\">\r\n <button class=\"\" (click)=\"expandNav()\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke-width=\"1.5\"\r\n stroke=\"currentColor\"\r\n class=\"bars\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5\"\r\n />\r\n </svg>\r\n </button>\r\n </div>\r\n <div>\r\n <vdr-breadcrumb></vdr-breadcrumb>\r\n </div>\r\n <div class=\"universal-search flex-spacer\"></div>\r\n <div class=\"mx-1\">\r\n <vdr-alerts></vdr-alerts>\r\n </div>\r\n <div>\r\n <vdr-user-menu\r\n [userName]=\"userName$ | async\"\r\n [uiLanguageAndLocale]=\"uiLanguageAndLocale$ | async\"\r\n [availableLanguages]=\"availableLanguages\"\r\n (selectUiLanguage)=\"selectUiLanguage()\"\r\n (logOut)=\"logOut()\"\r\n />\r\n </div>\r\n </div>\r\n <div class=\"content-area\"><router-outlet></router-outlet></div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".app-container{display:flex;height:100vh;overflow:hidden}.left-nav{background-color:var(--color-left-nav-bg);color:var(--color-left-nav-text);display:flex;flex-direction:column;overflow:hidden;height:100%;border-inline-end:1px solid var(--color-weight-150);z-index:2;width:var(--left-nav-width);max-width:var(--left-nav-width)}@media screen and (max-width: 992px){.left-nav.expanded{position:fixed;inset:0;width:100%;max-width:100%;animation:fade-in .2s ease-in-out forwards}}.version{color:var(--color-grey-300)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media screen and (min-width: 992px){.expand-menu,.collapse-menu{display:none}}.expand-menu button,.collapse-menu button{border:none;padding:calc(var(--space-unit) * 1) calc(var(--space-unit) * 2);background-color:var(--color-page-header-item-bg);border-radius:var(--border-radius-lg);color:var(--color-text-100);display:flex;align-items:center;justify-content:center}.expand-menu .bars,.collapse-menu .bars{width:24px;height:24px}.collapse-menu button{height:40px;background-color:var(--color-weight-200)}.main-nav-container{overflow:auto;flex:1}.settings-nav-container{margin:calc(var(--space-unit) * 3) 0 -10px 0}.settings-nav-container hr{margin:0 calc(var(--space-unit) * 4);margin-bottom:calc(var(--space-unit) * 4);border:1px solid var(--color-weight-150);box-shadow:0 1px 0 var(--color-weight-100)}.logo{max-width:100%}.wordmark{font-weight:700;margin-inline-start:12px;font-size:24px;color:var(--color-primary-500)}@media screen and (max-width: 992px){.wordmark{display:none}}.surface{display:flex;flex-direction:column;flex:1;background-color:var(--color-surface-bg)}.content-container{overflow:auto;min-height:100vh;display:flex;flex-direction:column}.branding{display:flex;align-items:center;justify-content:space-between;min-width:0;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 4);padding-inline-end:calc(var(--space-unit) * 1.5)}@media screen and (min-width: 992px){.branding{padding:calc(var(--space-unit) * 4)}}.top-bar{width:100%;display:flex;align-items:center;justify-content:space-between;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 1);background-color:var(--color-page-header)}@media screen and (min-width: 992px){.top-bar{padding:calc(var(--space-unit) * 4);padding-inline-start:var(--surface-margin-left)}}.header-actions{align-items:center}.content-area{position:relative;margin-inline-end:auto;flex:1;display:block;width:100%}.dev-mode-button{opacity:.7;font-size:12px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: IfMultichannelDirective, selector: "[vdrIfMultichannel]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: UserMenuComponent, selector: "vdr-user-menu", inputs: ["userName", "availableLanguages", "uiLanguageAndLocale"], outputs: ["logOut", "selectUiLanguage"] }, { kind: "component", type: MainNavComponent, selector: "vdr-main-nav", inputs: ["displayMode"], outputs: ["itemClick"] }, { kind: "component", type: BreadcrumbComponent, selector: "vdr-breadcrumb" }, { kind: "component", type: ChannelSwitcherComponent, selector: "vdr-channel-switcher" }, { kind: "component", type: AlertsComponent, selector: "vdr-alerts" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] }); }
9576
9589
  }
9577
9590
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: AppShellComponent, decorators: [{
9578
9591
  type: Component,
9579
- args: [{ selector: 'vdr-app-shell', template: "<div class=\"app-container\" [dir]=\"direction$ | async\">\r\n <div class=\"left-nav\" [class.expanded]=\"mainNavExpanded$ | async\">\r\n <div class=\"branding\">\r\n <a [routerLink]=\"['/']\" *ngIf=\"!hideVendureBranding\"\r\n ><img src=\"assets/logo-top.webp\" class=\"logo\" style=\"max-width: 100px\"\r\n /></a>\r\n <div class=\"collapse-menu\">\r\n <button class=\"\" (click)=\"collapseNav()\">\r\n <clr-icon shape=\"window-close\" size=\"24\"></clr-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"mx-4\">\r\n <vdr-channel-switcher *vdrIfMultichannel></vdr-channel-switcher>\r\n </div>\r\n <div class=\"main-nav-container\">\r\n <vdr-main-nav (itemClick)=\"collapseNav()\"></vdr-main-nav>\r\n </div>\r\n <div class=\"settings-nav-container\">\r\n <hr />\r\n <vdr-main-nav displayMode=\"settings\" (itemClick)=\"collapseNav()\"></vdr-main-nav>\r\n </div>\r\n <div class=\"mx-2 flex center mb-1\" [class.mt-2]=\"hideVersion && !devMode\">\r\n <div *ngIf=\"!hideVersion\" class=\"version\">\r\n v{{ version }}\r\n </div>\r\n <vdr-dropdown *ngIf=\"devMode\">\r\n <button class=\"icon-button dev-mode-button\" vdrDropdownTrigger title=\"DEV MODE\">\r\n <clr-icon shape=\"code\" size=\"24\"></clr-icon> DEV MODE\r\n </button>\r\n <vdr-dropdown-menu>\r\n <div class=\"px-2 py-1\">\r\n <div>Version: {{ version }}</div>\r\n <div>View UI extension points: <kbd>CTRL + U</kbd></div>\r\n </div>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n </div>\r\n </div>\r\n\r\n <div class=\"surface\">\r\n <div class=\"content-container\">\r\n <div class=\"top-bar\">\r\n <div class=\"expand-menu mr-1\">\r\n <button class=\"\" (click)=\"expandNav()\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke-width=\"1.5\"\r\n stroke=\"currentColor\"\r\n class=\"bars\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5\"\r\n />\r\n </svg>\r\n </button>\r\n </div>\r\n <div>\r\n <vdr-breadcrumb></vdr-breadcrumb>\r\n </div>\r\n <div class=\"universal-search flex-spacer\"></div>\r\n <div class=\"mx-1\">\r\n <vdr-alerts></vdr-alerts>\r\n </div>\r\n <div>\r\n <vdr-user-menu\r\n [userName]=\"userName$ | async\"\r\n [uiLanguageAndLocale]=\"uiLanguageAndLocale$ | async\"\r\n [availableLanguages]=\"availableLanguages\"\r\n (selectUiLanguage)=\"selectUiLanguage()\"\r\n (logOut)=\"logOut()\"\r\n ></vdr-user-menu>\r\n </div>\r\n </div>\r\n <div class=\"content-area\"><router-outlet></router-outlet></div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".app-container{display:flex;height:100vh;overflow:hidden}.left-nav{background-color:var(--color-left-nav-bg);color:var(--color-left-nav-text);display:flex;flex-direction:column;overflow:hidden;height:100%;border-inline-end:1px solid var(--color-weight-150);z-index:2;width:var(--left-nav-width);max-width:var(--left-nav-width)}@media screen and (max-width: 992px){.left-nav.expanded{position:fixed;inset:0;width:100%;max-width:100%;animation:fade-in .2s ease-in-out forwards}}.version{color:var(--color-grey-300)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media screen and (min-width: 992px){.expand-menu,.collapse-menu{display:none}}.expand-menu button,.collapse-menu button{border:none;padding:calc(var(--space-unit) * 1) calc(var(--space-unit) * 2);background-color:var(--color-page-header-item-bg);border-radius:var(--border-radius-lg);color:var(--color-text-100);display:flex;align-items:center;justify-content:center}.expand-menu .bars,.collapse-menu .bars{width:24px;height:24px}.collapse-menu button{height:40px;background-color:var(--color-weight-200)}.main-nav-container{overflow:auto;flex:1}.settings-nav-container{margin:calc(var(--space-unit) * 3) 0 -10px 0}.settings-nav-container hr{margin:0 calc(var(--space-unit) * 4);margin-bottom:calc(var(--space-unit) * 4);border:1px solid var(--color-weight-150);box-shadow:0 1px 0 var(--color-weight-100)}.logo{max-width:100%}.wordmark{font-weight:700;margin-inline-start:12px;font-size:24px;color:var(--color-primary-500)}@media screen and (max-width: 992px){.wordmark{display:none}}.surface{display:flex;flex-direction:column;flex:1;background-color:var(--color-surface-bg)}.content-container{overflow:auto;min-height:100vh;display:flex;flex-direction:column}.branding{display:flex;align-items:center;justify-content:space-between;min-width:0;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 4);padding-inline-end:calc(var(--space-unit) * 1.5)}@media screen and (min-width: 992px){.branding{padding:calc(var(--space-unit) * 4)}}.top-bar{width:100%;display:flex;align-items:center;justify-content:space-between;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 1);background-color:var(--color-page-header)}@media screen and (min-width: 992px){.top-bar{padding:calc(var(--space-unit) * 4);padding-inline-start:var(--surface-margin-left)}}.header-actions{align-items:center}.content-area{position:relative;margin-inline-end:auto;flex:1;display:block;width:100%}.dev-mode-button{opacity:.7;font-size:12px}\n"] }]
9592
+ args: [{ selector: 'vdr-app-shell', template: "<div class=\"app-container\" [dir]=\"direction$ | async\">\r\n <div class=\"left-nav\" [class.expanded]=\"mainNavExpanded$ | async\">\r\n <div class=\"branding\">\r\n <a [routerLink]=\"['/']\" *ngIf=\"!hideVendureBranding\"\r\n ><img src=\"assets/logo-top.webp\" class=\"logo\" style=\"max-width: 100px\"\r\n /></a>\r\n <div class=\"collapse-menu\">\r\n <button class=\"\" (click)=\"collapseNav()\">\r\n <clr-icon shape=\"window-close\" size=\"24\"></clr-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"mx-4\">\r\n <vdr-channel-switcher *vdrIfMultichannel></vdr-channel-switcher>\r\n </div>\r\n <div class=\"main-nav-container\">\r\n <vdr-main-nav (itemClick)=\"collapseNav()\"></vdr-main-nav>\r\n </div>\r\n <div class=\"settings-nav-container\">\r\n <hr />\r\n <vdr-main-nav displayMode=\"settings\" (itemClick)=\"collapseNav()\"></vdr-main-nav>\r\n </div>\r\n <div class=\"mx-2 flex center mb-1\" [class.mt-2]=\"hideVersion && !devMode\">\r\n <div *ngIf=\"!hideVersion\" class=\"version\">\r\n v{{ version }}\r\n </div>\r\n <vdr-dropdown *ngIf=\"devMode\">\r\n <button class=\"icon-button dev-mode-button\" vdrDropdownTrigger title=\"DEV MODE\">\r\n <clr-icon shape=\"code\" size=\"24\"></clr-icon> DEV MODE\r\n </button>\r\n <vdr-dropdown-menu>\r\n <div class=\"px-2 py-1\">\r\n <div>Version: {{ version }}</div>\r\n <div>View UI extension points: <kbd>CTRL + U</kbd></div>\r\n </div>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n </div>\r\n </div>\r\n\r\n <div class=\"surface\">\r\n <div class=\"content-container\">\r\n <div class=\"top-bar\">\r\n <div class=\"expand-menu mr-1\">\r\n <button class=\"\" (click)=\"expandNav()\">\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke-width=\"1.5\"\r\n stroke=\"currentColor\"\r\n class=\"bars\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5\"\r\n />\r\n </svg>\r\n </button>\r\n </div>\r\n <div>\r\n <vdr-breadcrumb></vdr-breadcrumb>\r\n </div>\r\n <div class=\"universal-search flex-spacer\"></div>\r\n <div class=\"mx-1\">\r\n <vdr-alerts></vdr-alerts>\r\n </div>\r\n <div>\r\n <vdr-user-menu\r\n [userName]=\"userName$ | async\"\r\n [uiLanguageAndLocale]=\"uiLanguageAndLocale$ | async\"\r\n [availableLanguages]=\"availableLanguages\"\r\n (selectUiLanguage)=\"selectUiLanguage()\"\r\n (logOut)=\"logOut()\"\r\n />\r\n </div>\r\n </div>\r\n <div class=\"content-area\"><router-outlet></router-outlet></div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".app-container{display:flex;height:100vh;overflow:hidden}.left-nav{background-color:var(--color-left-nav-bg);color:var(--color-left-nav-text);display:flex;flex-direction:column;overflow:hidden;height:100%;border-inline-end:1px solid var(--color-weight-150);z-index:2;width:var(--left-nav-width);max-width:var(--left-nav-width)}@media screen and (max-width: 992px){.left-nav.expanded{position:fixed;inset:0;width:100%;max-width:100%;animation:fade-in .2s ease-in-out forwards}}.version{color:var(--color-grey-300)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media screen and (min-width: 992px){.expand-menu,.collapse-menu{display:none}}.expand-menu button,.collapse-menu button{border:none;padding:calc(var(--space-unit) * 1) calc(var(--space-unit) * 2);background-color:var(--color-page-header-item-bg);border-radius:var(--border-radius-lg);color:var(--color-text-100);display:flex;align-items:center;justify-content:center}.expand-menu .bars,.collapse-menu .bars{width:24px;height:24px}.collapse-menu button{height:40px;background-color:var(--color-weight-200)}.main-nav-container{overflow:auto;flex:1}.settings-nav-container{margin:calc(var(--space-unit) * 3) 0 -10px 0}.settings-nav-container hr{margin:0 calc(var(--space-unit) * 4);margin-bottom:calc(var(--space-unit) * 4);border:1px solid var(--color-weight-150);box-shadow:0 1px 0 var(--color-weight-100)}.logo{max-width:100%}.wordmark{font-weight:700;margin-inline-start:12px;font-size:24px;color:var(--color-primary-500)}@media screen and (max-width: 992px){.wordmark{display:none}}.surface{display:flex;flex-direction:column;flex:1;background-color:var(--color-surface-bg)}.content-container{overflow:auto;min-height:100vh;display:flex;flex-direction:column}.branding{display:flex;align-items:center;justify-content:space-between;min-width:0;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 4);padding-inline-end:calc(var(--space-unit) * 1.5)}@media screen and (min-width: 992px){.branding{padding:calc(var(--space-unit) * 4)}}.top-bar{width:100%;display:flex;align-items:center;justify-content:space-between;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 1);background-color:var(--color-page-header)}@media screen and (min-width: 992px){.top-bar{padding:calc(var(--space-unit) * 4);padding-inline-start:var(--surface-margin-left)}}.header-actions{align-items:center}.content-area{position:relative;margin-inline-end:auto;flex:1;display:block;width:100%}.dev-mode-button{opacity:.7;font-size:12px}\n"] }]
9580
9593
  }], ctorParameters: () => [{ type: AuthService }, { type: DataService }, { type: i1$1.Router }, { type: I18nService }, { type: ModalService }, { type: LocalStorageService }, { type: BreadcrumbService }, { type: LocalizationService }] });
9581
9594
 
9582
9595
  class SettingsNavComponent extends BaseNavComponent {