@vendure/admin-ui 2.1.1 → 2.1.3

package/fesm2022/vendure-admin-ui-core.mjs

@@ -5994,6 +5994,10 @@ function addCustomFields(documentNode, customFields) {
             // so we treat it as an alias
             entityType = 'Address';
         }
+        if (entityType === 'Country') {
+            // Country is an alias of Region
+            entityType = 'Region';
+        }
         const customFieldsForType = customFields[entityType];
         if (customFieldsForType && customFieldsForType.length) {
             fragmentDef.selectionSet.selections.push({
@@ -7143,7 +7147,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImpor
         }], ctorParameters: function () { return [{ type: AlertsService }]; } });
 
 // Auto-generated by the set-version.js script.
-const ADMIN_UI_VERSION = '2.1.1';
+const ADMIN_UI_VERSION = '2.1.3';
 
 /* eslint-disable @angular-eslint/directive-selector */
 class FormFieldControlDirective {
@@ -13741,11 +13745,11 @@ class TabbedCustomFieldsComponent {
             .map(([tabName, customFields]) => ({ tabName, customFields }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: TabbedCustomFieldsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: { entityName: "entityName", customFields: "customFields", customFieldsFormGroup: "customFieldsFormGroup", readonly: "readonly", compact: "compact", showLabel: "showLabel" }, ngImport: i0, template: "<ng-container *ngIf=\"1 < tabbedCustomFields.length; else singleGroup\">\r\n    <clr-tabs>\r\n        <clr-tab *ngFor=\"let group of tabbedCustomFields\">\r\n            <button clrTabLink>\r\n                {{\r\n                    group.tabName === defaultTabName\r\n                        ? ('common.general' | translate)\r\n                        : (group.tabName | translate)\r\n                }}\r\n            </button>\r\n            <clr-tab-content *clrIfActive>\r\n                <div class=\"mt-2 form-grid\">\r\n                    <ng-container *ngFor=\"let customField of group.customFields\">\r\n                        <vdr-custom-field-control\r\n                            *ngIf=\"customFieldIsSet(customField.name)\"\r\n                            [entityName]=\"entityName\"\r\n                            [class.form-grid-span]=\"componentShouldSpanGrid(customField)\"\r\n                            [customFieldsFormGroup]=\"customFieldsFormGroup\"\r\n                            [customField]=\"customField\"\r\n                            [readonly]=\"readonly\"\r\n                            [compact]=\"compact\"\r\n                            [showLabel]=\"showLabel\"\r\n                        ></vdr-custom-field-control>\r\n                    </ng-container>\r\n                </div>\r\n            </clr-tab-content>\r\n        </clr-tab>\r\n    </clr-tabs>\r\n</ng-container>\r\n<ng-template #singleGroup>\r\n    <div class=\"form-grid\">\r\n        <ng-container *ngFor=\"let customField of tabbedCustomFields[0]?.customFields\">\r\n            <vdr-custom-field-control\r\n                *ngIf=\"customFieldIsSet(customField.name)\"\r\n                [entityName]=\"entityName\"\r\n                [class.form-grid-span]=\"componentShouldSpanGrid(customField)\"\r\n                [customFieldsFormGroup]=\"customFieldsFormGroup\"\r\n                [customField]=\"customField\"\r\n                [readonly]=\"readonly\"\r\n                [compact]=\"compact\"\r\n                [showLabel]=\"showLabel\"\r\n            ></vdr-custom-field-control>\r\n        </ng-container>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:contents}::ng-deep clr-tabs .btn.btn-link{box-shadow:none}\n"], dependencies: [{ kind: "directive", type: i1$3.ClrIfActive, selector: "[clrIfActive]", inputs: ["clrIfActive"], outputs: ["clrIfActiveChange"] }, { kind: "component", type: i1$3.ClrTabContent, selector: "clr-tab-content", inputs: ["id"] }, { kind: "component", type: i1$3.ClrTab, selector: "clr-tab" }, { kind: "component", type: i1$3.ClrTabs, selector: "clr-tabs", inputs: ["clrLayout"] }, { kind: "directive", type: i1$3.ClrTabLink, selector: "[clrTabLink]", inputs: ["id", "clrTabLinkInOverflow"] }, { kind: "directive", type: i1$3.ÇlrTabsWillyWonka, selector: "clr-tabs" }, { kind: "directive", type: i1$3.ÇlrActiveOompaLoompa, selector: "[clrTabLink], clr-tab-content" }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CustomFieldControlComponent, selector: "vdr-custom-field-control", inputs: ["entityName", "customFieldsFormGroup", "customField", "compact", "showLabel", "readonly"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: { entityName: "entityName", customFields: "customFields", customFieldsFormGroup: "customFieldsFormGroup", readonly: "readonly", compact: "compact", showLabel: "showLabel" }, ngImport: i0, template: "<ng-container *ngIf=\"1 < tabbedCustomFields.length; else singleGroup\">\r\n    <clr-tabs>\r\n        <clr-tab *ngFor=\"let group of tabbedCustomFields\">\r\n            <button clrTabLink>\r\n                {{\r\n                    group.tabName === defaultTabName\r\n                        ? ('common.general' | translate)\r\n                        : (group.tabName | translate)\r\n                }}\r\n            </button>\r\n            <clr-tab-content *clrIfActive>\r\n                <div class=\"mt-2 form-grid\">\r\n                    <ng-container *ngFor=\"let customField of group.customFields\">\r\n                        <vdr-custom-field-control\r\n                            *ngIf=\"customFieldIsSet(customField.name)\"\r\n                            [entityName]=\"entityName\"\r\n                            [class.form-grid-span]=\"componentShouldSpanGrid(customField)\"\r\n                            [customFieldsFormGroup]=\"customFieldsFormGroup\"\r\n                            [customField]=\"customField\"\r\n                            [readonly]=\"readonly\"\r\n                            [compact]=\"compact\"\r\n                            [showLabel]=\"showLabel\"\r\n                        ></vdr-custom-field-control>\r\n                    </ng-container>\r\n                </div>\r\n            </clr-tab-content>\r\n        </clr-tab>\r\n    </clr-tabs>\r\n</ng-container>\r\n<ng-template #singleGroup>\r\n    <div class=\"form-grid\">\r\n        <ng-container *ngFor=\"let customField of tabbedCustomFields[0]?.customFields\">\r\n            <vdr-custom-field-control\r\n                *ngIf=\"customFieldIsSet(customField.name)\"\r\n                [entityName]=\"entityName\"\r\n                [class.form-grid-span]=\"componentShouldSpanGrid(customField)\"\r\n                [customFieldsFormGroup]=\"customFieldsFormGroup\"\r\n                [customField]=\"customField\"\r\n                [readonly]=\"readonly\"\r\n                [compact]=\"compact\"\r\n                [showLabel]=\"showLabel\"\r\n            ></vdr-custom-field-control>\r\n        </ng-container>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "directive", type: i1$3.ClrIfActive, selector: "[clrIfActive]", inputs: ["clrIfActive"], outputs: ["clrIfActiveChange"] }, { kind: "component", type: i1$3.ClrTabContent, selector: "clr-tab-content", inputs: ["id"] }, { kind: "component", type: i1$3.ClrTab, selector: "clr-tab" }, { kind: "component", type: i1$3.ClrTabs, selector: "clr-tabs", inputs: ["clrLayout"] }, { kind: "directive", type: i1$3.ClrTabLink, selector: "[clrTabLink]", inputs: ["id", "clrTabLinkInOverflow"] }, { kind: "directive", type: i1$3.ÇlrTabsWillyWonka, selector: "clr-tabs" }, { kind: "directive", type: i1$3.ÇlrActiveOompaLoompa, selector: "[clrTabLink], clr-tab-content" }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CustomFieldControlComponent, selector: "vdr-custom-field-control", inputs: ["entityName", "customFieldsFormGroup", "customField", "compact", "showLabel", "readonly"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: TabbedCustomFieldsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-tabbed-custom-fields', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"1 < tabbedCustomFields.length; else singleGroup\">\r\n    <clr-tabs>\r\n        <clr-tab *ngFor=\"let group of tabbedCustomFields\">\r\n            <button clrTabLink>\r\n                {{\r\n                    group.tabName === defaultTabName\r\n                        ? ('common.general' | translate)\r\n                        : (group.tabName | translate)\r\n                }}\r\n            </button>\r\n            <clr-tab-content *clrIfActive>\r\n                <div class=\"mt-2 form-grid\">\r\n                    <ng-container *ngFor=\"let customField of group.customFields\">\r\n                        <vdr-custom-field-control\r\n                            *ngIf=\"customFieldIsSet(customField.name)\"\r\n                            [entityName]=\"entityName\"\r\n                            [class.form-grid-span]=\"componentShouldSpanGrid(customField)\"\r\n                            [customFieldsFormGroup]=\"customFieldsFormGroup\"\r\n                            [customField]=\"customField\"\r\n                            [readonly]=\"readonly\"\r\n                            [compact]=\"compact\"\r\n                            [showLabel]=\"showLabel\"\r\n                        ></vdr-custom-field-control>\r\n                    </ng-container>\r\n                </div>\r\n            </clr-tab-content>\r\n        </clr-tab>\r\n    </clr-tabs>\r\n</ng-container>\r\n<ng-template #singleGroup>\r\n    <div class=\"form-grid\">\r\n        <ng-container *ngFor=\"let customField of tabbedCustomFields[0]?.customFields\">\r\n            <vdr-custom-field-control\r\n                *ngIf=\"customFieldIsSet(customField.name)\"\r\n                [entityName]=\"entityName\"\r\n                [class.form-grid-span]=\"componentShouldSpanGrid(customField)\"\r\n                [customFieldsFormGroup]=\"customFieldsFormGroup\"\r\n                [customField]=\"customField\"\r\n                [readonly]=\"readonly\"\r\n                [compact]=\"compact\"\r\n                [showLabel]=\"showLabel\"\r\n            ></vdr-custom-field-control>\r\n        </ng-container>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:contents}::ng-deep clr-tabs .btn.btn-link{box-shadow:none}\n"] }]
+            args: [{ selector: 'vdr-tabbed-custom-fields', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"1 < tabbedCustomFields.length; else singleGroup\">\r\n    <clr-tabs>\r\n        <clr-tab *ngFor=\"let group of tabbedCustomFields\">\r\n            <button clrTabLink>\r\n                {{\r\n                    group.tabName === defaultTabName\r\n                        ? ('common.general' | translate)\r\n                        : (group.tabName | translate)\r\n                }}\r\n            </button>\r\n            <clr-tab-content *clrIfActive>\r\n                <div class=\"mt-2 form-grid\">\r\n                    <ng-container *ngFor=\"let customField of group.customFields\">\r\n                        <vdr-custom-field-control\r\n                            *ngIf=\"customFieldIsSet(customField.name)\"\r\n                            [entityName]=\"entityName\"\r\n                            [class.form-grid-span]=\"componentShouldSpanGrid(customField)\"\r\n                            [customFieldsFormGroup]=\"customFieldsFormGroup\"\r\n                            [customField]=\"customField\"\r\n                            [readonly]=\"readonly\"\r\n                            [compact]=\"compact\"\r\n                            [showLabel]=\"showLabel\"\r\n                        ></vdr-custom-field-control>\r\n                    </ng-container>\r\n                </div>\r\n            </clr-tab-content>\r\n        </clr-tab>\r\n    </clr-tabs>\r\n</ng-container>\r\n<ng-template #singleGroup>\r\n    <div class=\"form-grid\">\r\n        <ng-container *ngFor=\"let customField of tabbedCustomFields[0]?.customFields\">\r\n            <vdr-custom-field-control\r\n                *ngIf=\"customFieldIsSet(customField.name)\"\r\n                [entityName]=\"entityName\"\r\n                [class.form-grid-span]=\"componentShouldSpanGrid(customField)\"\r\n                [customFieldsFormGroup]=\"customFieldsFormGroup\"\r\n                [customField]=\"customField\"\r\n                [readonly]=\"readonly\"\r\n                [compact]=\"compact\"\r\n                [showLabel]=\"showLabel\"\r\n            ></vdr-custom-field-control>\r\n        </ng-container>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:contents}\n"] }]
         }], propDecorators: { entityName: [{
                 type: Input
             }], customFields: [{
@@ -18681,11 +18685,11 @@ class RadioCardFieldsetComponent {
         this.focussedId = item && this.idFn(item);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: RadioCardFieldsetComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: RadioCardFieldsetComponent, selector: "vdr-radio-card-fieldset", inputs: { selectedItemId: "selectedItemId", idFn: "idFn" }, outputs: { selectItem: "selectItem" }, usesOnChanges: true, ngImport: i0, template: `<fieldset><ng-content></ng-content></fieldset> `, isInline: true, styles: ["fieldset{display:flex;align-items:flex-start}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: RadioCardFieldsetComponent, selector: "vdr-radio-card-fieldset", inputs: { selectedItemId: "selectedItemId", idFn: "idFn" }, outputs: { selectItem: "selectItem" }, usesOnChanges: true, ngImport: i0, template: `<fieldset><ng-content></ng-content></fieldset> `, isInline: true, styles: ["fieldset{display:flex;align-items:flex-start;overflow-x:auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: RadioCardFieldsetComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-radio-card-fieldset', template: `<fieldset><ng-content></ng-content></fieldset> `, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["fieldset{display:flex;align-items:flex-start}\n"] }]
+            args: [{ selector: 'vdr-radio-card-fieldset', template: `<fieldset><ng-content></ng-content></fieldset> `, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["fieldset{display:flex;align-items:flex-start;overflow-x:auto}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { selectedItemId: [{
                 type: Input
             }], idFn: [{
@@ -21529,6 +21533,8 @@ function addActionBarItem(config) {
  *
  * @example
  * ```ts title="providers.ts"
+ * import { addNavMenuSection } from '\@vendure/admin-ui/core';
+ *
  * export default [
  *     addNavMenuSection({
  *         id: 'reports',
@@ -21564,6 +21570,8 @@ function addNavMenuSection(config, before) {
  *
  * @example
  * ```ts title="providers.ts"
+ * import { addNavMenuItem } from '\@vendure/admin-ui/core';
+ *
  * export default [
  *     addNavMenuItem({
  *         id: 'reviews',
@@ -21573,7 +21581,7 @@ function addNavMenuSection(config, before) {
  *     },
  *     'marketing'),
  * ];
- * ``
+ * ```
  *
  * @docsCategory nav-menu
  */
@@ -22132,6 +22140,14 @@ function registerRouteComponent(options) {
     const { query, entityKey, variables, getBreadcrumbs } = options;
     const breadcrumbSubject$ = new BehaviorSubject(options.breadcrumb ?? '');
     const titleSubject$ = new BehaviorSubject(options.title);
+    if (getBreadcrumbs != null && (query == null || entityKey == null)) {
+        console.error([
+            `[${options.path ?? 'custom'} route] When using the "getBreadcrumbs" option, the "query" and "entityKey" options must also be provided.`,
+            ``,
+            `Alternatively, use the "breadcrumb" option instead, or use the "PageMetadataService" inside your Angular component`,
+            `or the "usePageMetadata" React hook to set the breadcrumb.`,
+        ].join('\n'));
+    }
     const resolveFn = query && entityKey
         ? createBaseDetailResolveFn({
             query,
@@ -22157,7 +22173,7 @@ function registerRouteComponent(options) {
         data: {
             breadcrumb: breadcrumbSubject$,
             ...(options.routeConfig?.data ?? {}),
-            ...(getBreadcrumbs
+            ...(getBreadcrumbs && query && entityKey
                 ? {
                     breadcrumb: data => data.detail.entity.pipe(map((entity) => getBreadcrumbs(entity))),
                 }