@datarailsshared/datarailsshared 1.5.548 → 1.5.553

package/fesm2022/datarailsshared-datarailsshared.mjs

@@ -3074,12 +3074,13 @@ function DrToggleButtonComponent_ng_container_1_div_1_Template(rf, ctx) { if (rf
     const item_r1 = i0.ɵɵnextContext().$implicit;
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵclassProp("selected", item_r1[ctx_r2.bindValue] === ctx_r2.selectedValue || item_r1 === ctx_r2.selectedValue)("disabled", item_r1.disabled);
+    i0.ɵɵattribute("data-analytics", ctx_r2.getDataAnalyticsTag(item_r1));
     i0.ɵɵadvance(1);
     i0.ɵɵtextInterpolate1(" ", item_r1[ctx_r2.bindLabel] || item_r1.name || item_r1, " ");
 } }
 function DrToggleButtonComponent_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DrToggleButtonComponent_ng_container_1_div_1_Template, 2, 5, "div", 2);
+    i0.ɵɵtemplate(1, DrToggleButtonComponent_ng_container_1_div_1_Template, 2, 6, "div", 2);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const item_r1 = ctx.$implicit;
@@ -3125,8 +3126,15 @@ class DrToggleButtonComponent {
         this.onTouched();
         this.cdr.markForCheck();
     }
+    getDataAnalyticsTag(item) {
+        if (!this.dataAnalytics) {
+            return null;
+        }
+        const value = this.bindValue ? item[this.bindValue] : item;
+        return this.dataAnalytics + '_' + String(value).toLowerCase().replace(/ /g, '-');
+    }
     /** @nocollapse */ static { this.ɵfac = function DrToggleButtonComponent_Factory(t) { return new (t || DrToggleButtonComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrToggleButtonComponent, selectors: [["dr-toggle-button"]], inputs: { items: "items", bindLabel: "bindLabel", bindValue: "bindValue", bindHidden: "bindHidden", mode: "mode", selectedValue: "selectedValue", disabled: "disabled" }, features: [i0.ɵɵProvidersFeature([{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => DrToggleButtonComponent)), multi: true }])], decls: 2, vars: 4, consts: [[1, "toggle-container"], [4, "ngFor", "ngForOf"], ["class", "toggle-container__item", 3, "selected", "disabled", "click", 4, "ngIf"], [1, "toggle-container__item", 3, "click"]], template: function DrToggleButtonComponent_Template(rf, ctx) { if (rf & 1) {
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: DrToggleButtonComponent, selectors: [["dr-toggle-button"]], inputs: { items: "items", bindLabel: "bindLabel", bindValue: "bindValue", bindHidden: "bindHidden", mode: "mode", selectedValue: "selectedValue", disabled: "disabled", dataAnalytics: ["data-analytics", "dataAnalytics"] }, features: [i0.ɵɵProvidersFeature([{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => DrToggleButtonComponent)), multi: true }])], decls: 2, vars: 4, consts: [[1, "toggle-container"], [4, "ngFor", "ngForOf"], ["class", "toggle-container__item", 3, "selected", "disabled", "click", 4, "ngIf"], [1, "toggle-container__item", 3, "click"]], template: function DrToggleButtonComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵtemplate(1, DrToggleButtonComponent_ng_container_1_Template, 2, 1, "ng-container", 1);
             i0.ɵɵelementEnd();
@@ -3139,7 +3147,7 @@ class DrToggleButtonComponent {
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrToggleButtonComponent, [{
         type: Component,
-        args: [{ selector: 'dr-toggle-button', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => DrToggleButtonComponent)), multi: true }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"toggle-container\" [class.disabled]=\"_disabled\" [attr.mode]=\"mode\">\n    <ng-container *ngFor=\"let item of items\">\n        <div\n            *ngIf=\"item && !item[bindHidden]\"\n            class=\"toggle-container__item\"\n            [class.selected]=\"item[bindValue] === selectedValue || item === selectedValue\"\n            [class.disabled]=\"item.disabled\"\n            (click)=\"setValue(item)\">\n            {{ item[bindLabel] || item.name || item }}\n        </div>\n    </ng-container>\n</div>\n", styles: [":host{display:flex}.toggle-container{display:flex;flex-wrap:nowrap;box-sizing:border-box;border-radius:20px;height:28px;font-family:Poppins,sans-serif}.toggle-container.disabled{pointer-events:none}.toggle-container__item{height:28px;display:flex;align-items:center;justify-content:center;padding:4px 16px;border-radius:20px;margin:-1px;cursor:pointer;font-weight:400;font-size:12px;line-height:20px;white-space:nowrap;color:#4e566c;box-sizing:border-box}.toggle-container__item.selected{background:#f2f2fb!important;border:1px solid #7f7fdd!important;color:#25258c!important}.toggle-container__item.disabled{pointer-events:none;cursor:default;background:#f0f1f4;color:#9ea1aa;border:1px solid #c3c4ce}.toggle-container[mode~=default]{background:#f6f7f8;border:1px solid #c3c4ce}.toggle-container[mode~=dotted] .toggle-container__item{padding:2px 8px;border:1px solid #9ea1aa;border-radius:18px;margin-left:4px;color:#0c142b}.toggle-container[mode~=dotted] .toggle-container__item:hover{background:#f0f1f4}.toggle-container[mode~=dotted] .toggle-container__item:hover .toggle-container[mode~=dotted] .toggle-container__item.selected{background:unset}.toggle-container[mode~=dotted] .toggle-container__item:first-child{margin-left:0}\n"] }]
+        args: [{ selector: 'dr-toggle-button', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => DrToggleButtonComponent)), multi: true }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"toggle-container\" [class.disabled]=\"_disabled\" [attr.mode]=\"mode\">\n    <ng-container *ngFor=\"let item of items\">\n        <div\n            *ngIf=\"item && !item[bindHidden]\"\n            class=\"toggle-container__item\"\n            [class.selected]=\"item[bindValue] === selectedValue || item === selectedValue\"\n            [class.disabled]=\"item.disabled\"\n            (click)=\"setValue(item)\"\n            [attr.data-analytics]=\"getDataAnalyticsTag(item)\">\n            {{ item[bindLabel] || item.name || item }}\n        </div>\n    </ng-container>\n</div>\n", styles: [":host{display:flex}.toggle-container{display:flex;flex-wrap:nowrap;box-sizing:border-box;border-radius:20px;height:28px;font-family:Poppins,sans-serif}.toggle-container.disabled{pointer-events:none}.toggle-container__item{height:28px;display:flex;align-items:center;justify-content:center;padding:4px 16px;border-radius:20px;margin:-1px;cursor:pointer;font-weight:400;font-size:12px;line-height:20px;white-space:nowrap;color:#4e566c;box-sizing:border-box}.toggle-container__item.selected{background:#f2f2fb!important;border:1px solid #7f7fdd!important;color:#25258c!important}.toggle-container__item.disabled{pointer-events:none;cursor:default;background:#f0f1f4;color:#9ea1aa;border:1px solid #c3c4ce}.toggle-container[mode~=default]{background:#f6f7f8;border:1px solid #c3c4ce}.toggle-container[mode~=dotted] .toggle-container__item{padding:2px 8px;border:1px solid #9ea1aa;border-radius:18px;margin-left:4px;color:#0c142b}.toggle-container[mode~=dotted] .toggle-container__item:hover{background:#f0f1f4}.toggle-container[mode~=dotted] .toggle-container__item:hover .toggle-container[mode~=dotted] .toggle-container__item.selected{background:unset}.toggle-container[mode~=dotted] .toggle-container__item:first-child{margin-left:0}\n"] }]
     }], function () { return [{ type: i0.ChangeDetectorRef }]; }, { items: [{
             type: Input
         }], bindLabel: [{
@@ -3154,6 +3162,9 @@ class DrToggleButtonComponent {
             type: Input
         }], disabled: [{
             type: Input
+        }], dataAnalytics: [{
+            type: Input,
+            args: [{ alias: 'data-analytics' }]
         }] }); })();
 
 function ListTagComponent_div_1_Template(rf, ctx) { if (rf & 1) {
@@ -12683,9 +12694,9 @@ class BottomPositionStrategy {
 
 const _c0 = ["handleRef"];
 function DrawerContainer_div_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "div", 2, 3);
+    i0.ɵɵelement(0, "div", 3, 4);
 } }
-function DrawerContainer_ng_template_1_Template(rf, ctx) { }
+function DrawerContainer_ng_template_2_Template(rf, ctx) { }
 /**
  * Internal component that wraps user-provided drawer content.
  * @docs-private
@@ -12807,12 +12818,14 @@ class DrawerContainer extends CdkDialogContainer {
             i0.ɵɵattribute("role", ctx._config.role)("aria-modal", ctx._config.isModal)("aria-label", ctx._config.ariaLabel);
             i0.ɵɵsyntheticHostProperty("@state", ctx._animationState);
             i0.ɵɵclassMap(ctx._drawerPosition);
-        } }, standalone: true, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵStandaloneFeature], decls: 2, vars: 1, consts: [["class", "handle", 4, "ngIf"], ["cdkPortalOutlet", ""], [1, "handle"], ["handleRef", ""]], template: function DrawerContainer_Template(rf, ctx) { if (rf & 1) {
+        } }, standalone: true, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵStandaloneFeature], decls: 3, vars: 1, consts: [["class", "handle", 4, "ngIf"], [1, "dr-drawer-container__wrapper"], ["cdkPortalOutlet", ""], [1, "handle"], ["handleRef", ""]], template: function DrawerContainer_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, DrawerContainer_div_0_Template, 2, 0, "div", 0);
-            i0.ɵɵtemplate(1, DrawerContainer_ng_template_1_Template, 0, 0, "ng-template", 1);
+            i0.ɵɵelementStart(1, "div", 1);
+            i0.ɵɵtemplate(2, DrawerContainer_ng_template_2_Template, 0, 0, "ng-template", 2);
+            i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx._config.position === "bottom");
-        } }, dependencies: [PortalModule, i4.CdkPortalOutlet, DialogModule, MatCommonModule, CommonModule, i1.NgIf], styles: [".dr-drawer-container{display:block;width:100%;overflow:auto;outline:0;box-sizing:border-box;background-color:#fff;box-shadow:0 4px 14px #d8d9de80}.cdk-high-contrast-active .dr-drawer-container{outline:1px solid}.handle{position:relative;height:24px;cursor:pointer}.handle:after{content:\"\";position:absolute;top:16px;left:50%;transform:translate(-50%,-50%);background-color:#dfe0e3;height:4px;width:64px;border-radius:16px}.dr-drawer-right{transform:translate(100%);border-top-left-radius:16px;border-bottom-left-radius:16px}.dr-drawer-left{transform:translate(-100%);border-top-right-radius:16px;border-bottom-right-radius:16px}.dr-drawer-bottom{transform:translateY(100%);border-top-left-radius:16px;border-top-right-radius:16px}.dr-drawer-top{transform:translateY(-100%);border-bottom-left-radius:16px;border-bottom-right-radius:16px}\n"], encapsulation: 2, data: { animation: [drDrawerAnimations.drawerState] } }); }
+        } }, dependencies: [PortalModule, i4.CdkPortalOutlet, DialogModule, MatCommonModule, CommonModule, i1.NgIf], styles: [".dr-drawer-container{display:flex;flex-direction:column;width:100%;overflow:auto;outline:0;box-sizing:border-box;background-color:#fff;box-shadow:0 4px 14px #d8d9de80}.dr-drawer-container__wrapper{flex:1;overflow:auto}.cdk-high-contrast-active .dr-drawer-container{outline:1px solid}.handle{position:relative;height:24px;cursor:pointer}.handle:after{content:\"\";position:absolute;top:16px;left:50%;transform:translate(-50%,-50%);background-color:#dfe0e3;height:4px;width:64px;border-radius:16px}.dr-drawer-right{transform:translate(100%);border-top-left-radius:16px;border-bottom-left-radius:16px}.dr-drawer-left{transform:translate(-100%);border-top-right-radius:16px;border-bottom-right-radius:16px}.dr-drawer-bottom{transform:translateY(100%);border-top-left-radius:16px;border-top-right-radius:16px}.dr-drawer-top{transform:translateY(-100%);border-bottom-left-radius:16px;border-bottom-right-radius:16px}\n"], encapsulation: 2, data: { animation: [drDrawerAnimations.drawerState] } }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrawerContainer, [{
         type: Component,
@@ -12827,7 +12840,7 @@ class DrawerContainer extends CdkDialogContainer {
                     '[@state]': '_animationState',
                     '(@state.start)': '_onAnimationStart($event)',
                     '(@state.done)': '_onAnimationDone($event)',
-                }, standalone: true, imports: [PortalModule, DialogModule, MatCommonModule, CommonModule], template: "<div *ngIf=\"_config.position === 'bottom'\" #handleRef class=\"handle\"></div>\n<ng-template cdkPortalOutlet></ng-template>\n", styles: [".dr-drawer-container{display:block;width:100%;overflow:auto;outline:0;box-sizing:border-box;background-color:#fff;box-shadow:0 4px 14px #d8d9de80}.cdk-high-contrast-active .dr-drawer-container{outline:1px solid}.handle{position:relative;height:24px;cursor:pointer}.handle:after{content:\"\";position:absolute;top:16px;left:50%;transform:translate(-50%,-50%);background-color:#dfe0e3;height:4px;width:64px;border-radius:16px}.dr-drawer-right{transform:translate(100%);border-top-left-radius:16px;border-bottom-left-radius:16px}.dr-drawer-left{transform:translate(-100%);border-top-right-radius:16px;border-bottom-right-radius:16px}.dr-drawer-bottom{transform:translateY(100%);border-top-left-radius:16px;border-top-right-radius:16px}.dr-drawer-top{transform:translateY(-100%);border-bottom-left-radius:16px;border-bottom-right-radius:16px}\n"] }]
+                }, standalone: true, imports: [PortalModule, DialogModule, MatCommonModule, CommonModule], template: "<div *ngIf=\"_config.position === 'bottom'\" #handleRef class=\"handle\"></div>\n<div class=\"dr-drawer-container__wrapper\">\n    <ng-template cdkPortalOutlet></ng-template>\n</div>\n", styles: [".dr-drawer-container{display:flex;flex-direction:column;width:100%;overflow:auto;outline:0;box-sizing:border-box;background-color:#fff;box-shadow:0 4px 14px #d8d9de80}.dr-drawer-container__wrapper{flex:1;overflow:auto}.cdk-high-contrast-active .dr-drawer-container{outline:1px solid}.handle{position:relative;height:24px;cursor:pointer}.handle:after{content:\"\";position:absolute;top:16px;left:50%;transform:translate(-50%,-50%);background-color:#dfe0e3;height:4px;width:64px;border-radius:16px}.dr-drawer-right{transform:translate(100%);border-top-left-radius:16px;border-bottom-left-radius:16px}.dr-drawer-left{transform:translate(-100%);border-top-right-radius:16px;border-bottom-right-radius:16px}.dr-drawer-bottom{transform:translateY(100%);border-top-left-radius:16px;border-top-right-radius:16px}.dr-drawer-top{transform:translateY(-100%);border-bottom-left-radius:16px;border-bottom-right-radius:16px}\n"] }]
     }], function () { return [{ type: i0.ElementRef }, { type: i1$8.FocusTrapFactory }, { type: Document, decorators: [{
                 type: Optional
             }, {
@@ -12881,6 +12894,8 @@ class DrawerRef {
         });
         _ref.overlayRef.detachments().subscribe(() => {
             this._ref.close(this._result);
+            this._afterDismissed.next(this._result);
+            this._afterDismissed.complete();
         });
         merge$1(this.backdropClick(), this.keydownEvents().pipe(filter((event) => event.keyCode === ESCAPE))).subscribe((event) => {
             if (!this.disableClose && (event.type !== 'keydown' || !hasModifierKey(event))) {
@@ -12894,6 +12909,8 @@ class DrawerRef {
      * @param result Data to be passed back to the drawer opener.
      */
     dismiss(result) {
+        this._afterDismissed.next(result);
+        this._afterDismissed.complete();
         if (this.containerInstance && !this._afterDismissed.closed) {
             // Transition the backdrop in parallel to the drawer.
             this.containerInstance._animationStateChanged
@@ -12914,8 +12931,12 @@ class DrawerRef {
             this.containerInstance = null;
         }
     }
-    /** Gets an observable that is notified when the drawer is finished closing. */
+    /** Gets an observable that is notified when the drawer is dismissed. */
     afterDismissed() {
+        return this._afterDismissed;
+    }
+    /** Gets an observable that is notified when the drawer is finished closing. */
+    afterClosed() {
         return this._ref.closed;
     }
     /** Gets an observable that is notified when the drawer has opened and appeared. */