@vendure/admin-ui 1.4.2 → 1.4.6

package/fesm2015/vendure-admin-ui-core.js

@@ -5769,9 +5769,11 @@ AuthService.ctorParameters = () => [
     { type: ServerConfigService }
 ];
 
+/** @dynamic */
 class I18nService {
-    constructor(ngxTranslate) {
+    constructor(ngxTranslate, document) {
         this.ngxTranslate = ngxTranslate;
+        this.document = document;
         this._availableLanguages = [];
     }
     get availableLanguages() {
@@ -5787,7 +5789,11 @@ class I18nService {
      * Set the UI language
      */
     setLanguage(language) {
+        var _a;
         this.ngxTranslate.use(language);
+        if ((_a = this.document) === null || _a === void 0 ? void 0 : _a.documentElement) {
+            this.document.documentElement.lang = language;
+        }
     }
     /**
      * Set the available UI languages
@@ -5802,14 +5808,15 @@ class I18nService {
         return this.ngxTranslate.instant(key, params);
     }
 }
-I18nService.ɵprov = i0.ɵɵdefineInjectable({ factory: function I18nService_Factory() { return new I18nService(i0.ɵɵinject(i1$1.TranslateService)); }, token: I18nService, providedIn: "root" });
+I18nService.ɵprov = i0.ɵɵdefineInjectable({ factory: function I18nService_Factory() { return new I18nService(i0.ɵɵinject(i1$1.TranslateService), i0.ɵɵinject(i1.DOCUMENT)); }, token: I18nService, providedIn: "root" });
 I18nService.decorators = [
     { type: Injectable, args: [{
                 providedIn: 'root',
             },] }
 ];
 I18nService.ctorParameters = () => [
-    { type: TranslateService }
+    { type: TranslateService },
+    { type: Document, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
 ];
 
 /**
@@ -7188,8 +7195,8 @@ class MainNavComponent {
 MainNavComponent.decorators = [
     { type: Component, args: [{
                 selector: 'vdr-main-nav',
-                template: "<nav class=\"sidenav\" [clr-nav-level]=\"2\">\r\n    <section class=\"sidenav-content\">\r\n        <ng-container *ngFor=\"let section of navBuilderService.navMenuConfig$ | async\">\r\n            <section\r\n                class=\"nav-group\"\r\n                [attr.data-section-id]=\"section.id\"\r\n                [class.collapsible]=\"section.collapsible\"\r\n                *ngIf=\"shouldDisplayLink(section)\"\r\n            >\r\n                <vdr-ui-extension-point [locationId]=\"section.id\" api=\"navMenu\" [topPx]=\"-6\" [leftPx]=\"8\">\r\n                    <ng-container *ngIf=\"navBuilderService.sectionBadges[section.id] | async as sectionBadge\">\r\n                        <vdr-status-badge\r\n                            *ngIf=\"sectionBadge !== 'none'\"\r\n                            [type]=\"sectionBadge\"\r\n                        ></vdr-status-badge>\r\n                    </ng-container>\r\n                    <input [id]=\"section.id\" type=\"checkbox\" [checked]=\"section.collapsedByDefault\" />\r\n                    <label [for]=\"section.id\">{{ section.label | translate }}</label>\r\n                    <ul class=\"nav-list\">\r\n                        <ng-container *ngFor=\"let item of section.items\">\r\n                            <li *ngIf=\"shouldDisplayLink(item)\">\r\n                                <a\r\n                                    class=\"nav-link\"\r\n                                    [attr.data-item-id]=\"section.id\"\r\n                                    [routerLink]=\"getRouterLink(item)\"\r\n                                    routerLinkActive=\"active\"\r\n                                >\r\n                                    <ng-container *ngIf=\"item.statusBadge | async as itemBadge\">\r\n                                        <vdr-status-badge\r\n                                            *ngIf=\"itemBadge.type !== 'none'\"\r\n                                            [type]=\"itemBadge.type\"\r\n                                        ></vdr-status-badge>\r\n                                    </ng-container>\r\n                                    <clr-icon [attr.shape]=\"item.icon || 'block'\" size=\"20\"></clr-icon>\r\n                                    {{ item.label | translate }}\r\n                                </a>\r\n                            </li>\r\n                        </ng-container>\r\n                    </ul>\r\n                </vdr-ui-extension-point>\r\n            </section>\r\n        </ng-container>\r\n    </section>\r\n</nav>\r\n",
-                styles: [":host{order:-1;background-color:var(--clr-nav-background-color)}nav.sidenav{height:100%;width:10.8rem;border-right-color:var(--clr-sidenav-border-color)}.nav-list clr-icon{margin-right:12px}.nav-group,.nav-link{position:relative}.nav-group vdr-status-badge{left:10px;top:6px}.nav-link vdr-status-badge{left:25px;top:3px}\n"]
+                template: "<nav class=\"sidenav\" [clr-nav-level]=\"2\">\r\n    <section class=\"sidenav-content\">\r\n        <ng-container *ngFor=\"let section of navBuilderService.navMenuConfig$ | async\">\r\n            <section\r\n                class=\"nav-group\"\r\n                [attr.data-section-id]=\"section.id\"\r\n                [class.collapsible]=\"section.collapsible\"\r\n                *ngIf=\"shouldDisplayLink(section)\"\r\n            >\r\n                <vdr-ui-extension-point [locationId]=\"section.id\" api=\"navMenu\" [topPx]=\"-6\" [leftPx]=\"8\">\r\n                    <ng-container *ngIf=\"navBuilderService.sectionBadges[section.id] | async as sectionBadge\">\r\n                        <vdr-status-badge\r\n                            *ngIf=\"sectionBadge !== 'none'\"\r\n                            [type]=\"sectionBadge\"\r\n                        ></vdr-status-badge>\r\n                    </ng-container>\r\n                    <input [id]=\"section.id\" type=\"checkbox\" [checked]=\"section.collapsedByDefault\" />\r\n                    <label class=\"nav-group-header\" [for]=\"section.id\">{{ section.label | translate }}</label>\r\n                    <ul class=\"nav-list\">\r\n                        <ng-container *ngFor=\"let item of section.items\">\r\n                            <li *ngIf=\"shouldDisplayLink(item)\">\r\n                                <a\r\n                                    class=\"nav-link\"\r\n                                    [attr.data-item-id]=\"section.id\"\r\n                                    [routerLink]=\"getRouterLink(item)\"\r\n                                    routerLinkActive=\"active\"\r\n                                >\r\n                                    <ng-container *ngIf=\"item.statusBadge | async as itemBadge\">\r\n                                        <vdr-status-badge\r\n                                            *ngIf=\"itemBadge.type !== 'none'\"\r\n                                            [type]=\"itemBadge.type\"\r\n                                        ></vdr-status-badge>\r\n                                    </ng-container>\r\n                                    <clr-icon [attr.shape]=\"item.icon || 'block'\" size=\"20\"></clr-icon>\r\n                                    {{ item.label | translate }}\r\n                                </a>\r\n                            </li>\r\n                        </ng-container>\r\n                    </ul>\r\n                </vdr-ui-extension-point>\r\n            </section>\r\n        </ng-container>\r\n    </section>\r\n</nav>\r\n",
+                styles: [":host{order:-1;background-color:var(--clr-nav-background-color)}nav.sidenav{height:100%;width:10.8rem;border-right-color:var(--clr-sidenav-border-color)}.sidenav .nav-group .nav-list{margin:0}.sidenav .nav-group .nav-group-header{margin:0;line-height:1.2}.sidenav .nav-group .nav-link{display:inline-flex;line-height:1rem;padding-right:.6rem}.nav-list clr-icon{flex-shrink:0;margin-right:12px}.nav-group{-webkit-hyphens:auto;hyphens:auto}.nav-group,.nav-link{position:relative}.nav-group vdr-status-badge{left:10px;top:6px}.nav-link vdr-status-badge{left:25px;top:3px}\n"]
             },] }
 ];
 MainNavComponent.ctorParameters = () => [
@@ -8788,7 +8795,7 @@ SelectFormInputComponent.id = 'select-form-input';
 SelectFormInputComponent.decorators = [
     { type: Component, args: [{
                 selector: 'vdr-select-form-input',
-                template: "<select clrSelect [formControl]=\"formControl\" [vdrDisabled]=\"readonly\">\r\n    <option *ngIf=\"config.nullable\" [ngValue]=\"null\"></option>\r\n    <option *ngFor=\"let option of options\" [value]=\"option.value\">\r\n        {{ (option | customFieldLabel) || option.label || option.value }}\r\n    </option>\r\n</select>\r\n",
+                template: "<select clrSelect [formControl]=\"formControl\" [vdrDisabled]=\"readonly\">\r\n    <option *ngIf=\"config.nullable\" [ngValue]=\"null\"></option>\r\n    <option *ngFor=\"let option of options\" [ngValue]=\"option.value\">\r\n        {{ (option | customFieldLabel) || option.label || option.value }}\r\n    </option>\r\n</select>\r\n",
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: ["select{width:100%}\n"]
             },] }
@@ -12856,7 +12863,7 @@ class ProsemirrorService {
     }
     getStateFromText(text) {
         const div = document.createElement('div');
-        div.innerHTML = text;
+        div.innerHTML = text !== null && text !== void 0 ? text : '';
         return EditorState.create({
             doc: DOMParser.fromSchema(this.mySchema).parse(div),
             plugins: this.configurePlugins({ schema: this.mySchema, floatingMenu: false }),
@@ -14088,7 +14095,7 @@ class AssetPreviewPipe {
         if (!asset) {
             return '';
         }
-        if (!asset.preview || typeof asset.preview !== 'string') {
+        if (asset.preview == null || typeof asset.preview !== 'string') {
             throw new Error(`Expected an Asset, got ${JSON.stringify(asset)}`);
         }
         const fp = asset.focalPoint ? `&fpx=${asset.focalPoint.x}&fpy=${asset.focalPoint.y}` : '';
@@ -14340,6 +14347,28 @@ class LocaleBasePipe {
             this.subscription.unsubscribe();
         }
     }
+    /**
+     * Returns the active locale after attempting to ensure that the locale string
+     * is valid for the Intl API.
+     */
+    getActiveLocale(localeOverride) {
+        var _a;
+        const locale = typeof localeOverride === 'string' ? localeOverride : (_a = this.locale) !== null && _a !== void 0 ? _a : 'en';
+        const hyphenated = locale === null || locale === void 0 ? void 0 : locale.replace(/_/g, '-');
+        // Check for a double-region string, containing 2 region codes like
+        // pt-BR-BR, which is invalid. In this case, the second region is used
+        // and the first region discarded. This would only ever be an issue for
+        // those languages where the translation file itself encodes the region,
+        // as in pt_BR & pt_PT.
+        const matches = hyphenated === null || hyphenated === void 0 ? void 0 : hyphenated.match(/^([a-zA-Z_-]+)(-[A-Z][A-Z])(-[A-Z][A-z])$/);
+        if (matches === null || matches === void 0 ? void 0 : matches.length) {
+            const overriddenLocale = matches[1] + matches[3];
+            return overriddenLocale;
+        }
+        else {
+            return hyphenated;
+        }
+    }
 }
 LocaleBasePipe.decorators = [
     { type: Injectable }
@@ -14365,7 +14394,7 @@ class LocaleCurrencyNamePipe extends LocaleBasePipe {
         super(dataService, changeDetectorRef);
     }
     transform(value, display = 'full', locale) {
-        var _a, _b;
+        var _a;
         if (value == null || value === '') {
             return '';
         }
@@ -14374,7 +14403,7 @@ class LocaleCurrencyNamePipe extends LocaleBasePipe {
         }
         let name = '';
         let symbol = '';
-        const activeLocale = typeof locale === 'string' ? locale : (_a = this.locale) !== null && _a !== void 0 ? _a : 'en';
+        const activeLocale = this.getActiveLocale(locale);
         // Awaiting TS types for this API: https://github.com/microsoft/TypeScript/pull/44022/files
         const DisplayNames = Intl.DisplayNames;
         if (display === 'full' || display === 'name') {
@@ -14388,7 +14417,7 @@ class LocaleCurrencyNamePipe extends LocaleBasePipe {
                 currency: value,
                 currencyDisplay: 'symbol',
             }).formatToParts();
-            symbol = ((_b = parts.find(p => p.type === 'currency')) === null || _b === void 0 ? void 0 : _b.value) || value;
+            symbol = ((_a = parts.find(p => p.type === 'currency')) === null || _a === void 0 ? void 0 : _a.value) || value;
         }
         return display === 'full' ? `${name} (${symbol})` : display === 'name' ? name : symbol;
     }
@@ -14423,7 +14452,7 @@ class LocaleCurrencyPipe extends LocaleBasePipe {
     transform(value, ...args) {
         const [currencyCode, locale] = args;
         if (typeof value === 'number' && typeof currencyCode === 'string') {
-            const activeLocale = typeof locale === 'string' ? locale : this.locale;
+            const activeLocale = this.getActiveLocale(locale);
             const majorUnits = value / 100;
             return new Intl.NumberFormat(activeLocale, { style: 'currency', currency: currencyCode }).format(majorUnits);
         }
@@ -14460,7 +14489,7 @@ class LocaleDatePipe extends LocaleBasePipe {
     transform(value, ...args) {
         const [format, locale] = args;
         if (this.locale || typeof locale === 'string') {
-            const activeLocale = typeof locale === 'string' ? locale : this.locale;
+            const activeLocale = this.getActiveLocale(locale);
             const date = value instanceof Date ? value : typeof value === 'string' ? new Date(value) : undefined;
             if (date) {
                 const options = this.getOptionsForFormat(typeof format === 'string' ? format : 'medium');
@@ -14534,14 +14563,13 @@ class LocaleLanguageNamePipe extends LocaleBasePipe {
         super(dataService, changeDetectorRef);
     }
     transform(value, locale) {
-        var _a;
         if (value == null || value === '') {
             return '';
         }
         if (typeof value !== 'string') {
             return `Invalid language code "${value}"`;
         }
-        const activeLocale = typeof locale === 'string' ? locale : (_a = this.locale) !== null && _a !== void 0 ? _a : 'en';
+        const activeLocale = this.getActiveLocale(locale);
         // Awaiting TS types for this API: https://github.com/microsoft/TypeScript/pull/44022/files
         const DisplayNames = Intl.DisplayNames;
         try {
@@ -14579,14 +14607,13 @@ class LocaleRegionNamePipe extends LocaleBasePipe {
         super(dataService, changeDetectorRef);
     }
     transform(value, locale) {
-        var _a;
         if (value == null || value === '') {
             return '';
         }
         if (typeof value !== 'string') {
             return `Invalid region code "${value}"`;
         }
-        const activeLocale = typeof locale === 'string' ? locale : (_a = this.locale) !== null && _a !== void 0 ? _a : 'en';
+        const activeLocale = this.getActiveLocale(locale);
         // Awaiting TS types for this API: https://github.com/microsoft/TypeScript/pull/44022/files
         const DisplayNames = Intl.DisplayNames;
         try {
@@ -15154,12 +15181,12 @@ class BaseDetailComponent {
         return this.detailForm && this.detailForm.pristine;
     }
     setCustomFieldFormValues(customFields, formGroup, entity, currentTranslation) {
-        var _a, _b;
+        var _a, _b, _c;
         for (const fieldDef of customFields) {
             const key = fieldDef.name;
             const value = fieldDef.type === 'localeString'
-                ? (_a = currentTranslation.customFields) === null || _a === void 0 ? void 0 : _a[key]
-                : (_b = entity.customFields) === null || _b === void 0 ? void 0 : _b[key];
+                ? (_b = (_a = currentTranslation) === null || _a === void 0 ? void 0 : _a.customFields) === null || _b === void 0 ? void 0 : _b[key]
+                : (_c = entity.customFields) === null || _c === void 0 ? void 0 : _c[key];
             const control = formGroup === null || formGroup === void 0 ? void 0 : formGroup.get(key);
             if (control) {
                 control.patchValue(value);
@@ -15493,7 +15520,7 @@ function patchObject(obj, patch) {
 }
 
 // Auto-generated by the set-version.js script.
-const ADMIN_UI_VERSION = '1.4.2';
+const ADMIN_UI_VERSION = '1.4.6';
 
 /**
  * Responsible for registering dashboard widget components and querying for layouts.