npm - @ngstarter-ui/components - Versions diffs - 21.0.25 → 21.0.26 - Mend

@ngstarter-ui/components 21.0.25 → 21.0.26

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.

Files changed (8) hide show

package/ai/component-registry.json +67 -13
package/fesm2022/ngstarter-ui-components-notifications.mjs +53 -26
package/fesm2022/ngstarter-ui-components-notifications.mjs.map +1 -1
package/fesm2022/ngstarter-ui-components-tree.mjs +851 -36
package/fesm2022/ngstarter-ui-components-tree.mjs.map +1 -1
package/package.json +1 -1
package/types/ngstarter-ui-components-notifications.d.ts +21 -8
package/types/ngstarter-ui-components-tree.d.ts +148 -24

package/ai/component-registry.json CHANGED Viewed

@@ -6225,6 +6225,7 @@
       "exportedSymbols": [
         "Notification",
         "NotificationActor",
+        "NotificationActorLike",
         "NotificationAvatarDirective",
         "NotificationContent",
         "NotificationControlsDefDirective",
@@ -6242,12 +6243,15 @@
         "notifications",
         "static"
       ],
-      "outputs": [],
+      "outputs": [
+        "notificationClick"
+      ],
       "cssTokens": [
         "--ngs-color-neutral-900",
         "--ngs-color-neutral-950",
         "--ngs-color-on-surface",
         "--ngs-color-on-surface-variant",
+        "--ngs-color-primary",
         "--ngs-color-surface-container",
         "--ngs-color-surface-container-low",
         "--ngs-color-surface-container-lowest",
@@ -6261,7 +6265,8 @@
         "--ngs-notification-is-unread-hover-bg",
         "--ngs-notification-list-gap",
         "--ngs-notification-padding",
-        "--ngs-notification-radius"
+        "--ngs-notification-radius",
+        "--ngs-radius-xl"
       ],
       "example": null
     },
@@ -10001,21 +10006,30 @@
       "useWhen": "Use ngs-tree when users need to inspect or navigate hierarchical data where parent and child levels matter: folders and files, categories, permissions, taxonomies, organization structures, nested settings, product/entity hierarchies, and other expandable trees. Use dataSource with childrenAccessor for nested/static data, or treeControl with a custom DataSource for flat trees and dynamic loading. Define node templates with *ngsTreeNodeDef and use when for different node types. Use ngsTreeNodePadding for indentation and ngsTreeNodeToggle for expand/collapse controls. Use ProgressBar or Skeleton inside node templates when children load on demand. Do not use Tree for a simple vertical collection; use List. Do not use it for primary application navigation; use Sidebar, Sidenav, Navigation, or RailNav. Do not use it for FAQ or settings sections; use ExpansionPanel. Do not use it for dense row data with columns, sorting, filters, or bulk actions; use Table or DataView. Do not use it for step-by-step workflows; use Stepper.",
       "exampleTopics": [
         "Basic tree",
+        "Selectable tree",
+        "Checkable tree",
+        "Draggable tree",
         "Tree with dynamic data"
       ],
-      "minimalExample": "<ngs-tree #tree [dataSource]=\"dataSource\" [childrenAccessor]=\"childrenAccessor\">\n  <!-- This is the tree node template for leaf nodes -->\n  <ngs-tree-node *ngsTreeNodeDef=\"let node\" ngsTreeNodePadding>\n    <!-- use a disabled button to provide padding for tree leaf -->\n    <button ngsIconButton disabled></button>\n    {{node.name}}\n  </ngs-tree-node>\n  <!-- This is the tree node template for expandable nodes -->\n  <ngs-tree-node *ngsTreeNodeDef=\"let node;when: hasChild\"\n                 ngsTreeNodePadding ngsTreeNodeToggle\n                 [cdkTreeNodeTypeaheadLabel]=\"node.name\">\n    <button ngsIconButton ngsTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\n      @if (tree.isExpanded(node)) {\n        <ngs-icon name=\"fluent:chevron-down-24-regular\" class=\"size-4\"/>\n      } @else {\n        <ngs-icon name=\"fluent:chevron-right-24-regular\" class=\"size-4\"/>\n      }\n    </button>\n    {{node.name}}\n  </ngs-tree-node>\n</ngs-tree>",
+      "minimalExample": "<ngs-tree #tree [dataSource]=\"dataSource\" [childrenAccessor]=\"childrenAccessor\">\n  <!-- This is the tree node template for leaf nodes -->\n  <ngs-tree-node *ngsTreeNodeDef=\"let node\" ngsTreeNodePadding>\n    <!-- use a disabled button to provide padding for tree leaf -->\n    <button ngsIconButton disabled></button>\n    {{node.name}}\n  </ngs-tree-node>\n  <!-- This is the tree node template for expandable nodes -->\n  <ngs-tree-node *ngsTreeNodeDef=\"let node;when: hasChild\"\n                 ngsTreeNodePadding\n                 [cdkTreeNodeTypeaheadLabel]=\"node.name\">\n    <button ngsIconButton ngsTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\n      @if (tree.isExpanded(node)) {\n        <ngs-icon name=\"fluent:chevron-down-24-regular\" class=\"size-4\"/>\n      } @else {\n        <ngs-icon name=\"fluent:chevron-right-24-regular\" class=\"size-4\"/>\n      }\n    </button>\n    {{node.name}}\n  </ngs-tree-node>\n</ngs-tree>",
       "exampleFiles": [
         {
           "name": "basic-tree-example",
           "title": "Basic tree",
           "file": "projects/docs/src/app/components/tree/_examples/basic-tree-example/basic-tree-example.html",
-          "source": "<ngs-tree #tree [dataSource]=\"dataSource\" [childrenAccessor]=\"childrenAccessor\">\n  <!-- This is the tree node template for leaf nodes -->\n  <ngs-tree-node *ngsTreeNodeDef=\"let node\" ngsTreeNodePadding>\n    <!-- use a disabled button to provide padding for tree leaf -->\n    <button ngsIconButton disabled></button>\n    {{node.name}}\n  </ngs-tree-node>\n  <!-- This is the tree node template for expandable nodes -->\n  <ngs-tree-node *ngsTreeNodeDef=\"let node;when: hasChild\"\n                 ngsTreeNodePadding ngsTreeNodeToggle\n                 [cdkTreeNodeTypeaheadLabel]=\"node.name\">\n    <button ngsIconButton ngsTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\n      @if (tree.isExpanded(node)) {\n        <ngs-icon name=\"fluent:chevron-down-24-regular\" class=\"size-4\"/>\n      } @else {\n        <ngs-icon name=\"fluent:chevron-right-24-regular\" class=\"size-4\"/>\n      }\n    </button>\n    {{node.name}}\n  </ngs-tree-node>\n</ngs-tree>"
+          "source": "<ngs-tree #tree [dataSource]=\"dataSource\" [childrenAccessor]=\"childrenAccessor\">\n  <!-- This is the tree node template for leaf nodes -->\n  <ngs-tree-node *ngsTreeNodeDef=\"let node\" ngsTreeNodePadding>\n    <!-- use a disabled button to provide padding for tree leaf -->\n    <button ngsIconButton disabled></button>\n    {{node.name}}\n  </ngs-tree-node>\n  <!-- This is the tree node template for expandable nodes -->\n  <ngs-tree-node *ngsTreeNodeDef=\"let node;when: hasChild\"\n                 ngsTreeNodePadding\n                 [cdkTreeNodeTypeaheadLabel]=\"node.name\">\n    <button ngsIconButton ngsTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\n      @if (tree.isExpanded(node)) {\n        <ngs-icon name=\"fluent:chevron-down-24-regular\" class=\"size-4\"/>\n      } @else {\n        <ngs-icon name=\"fluent:chevron-right-24-regular\" class=\"size-4\"/>\n      }\n    </button>\n    {{node.name}}\n  </ngs-tree-node>\n</ngs-tree>"
+        },
+        {
+          "name": "checkable-tree-example",
+          "title": "Checkable tree",
+          "file": "projects/docs/src/app/components/tree/_examples/checkable-tree-example/checkable-tree-example.html",
+          "source": "<ngs-tree #tree\n          [dataSource]=\"dataSource\"\n          [childrenAccessor]=\"childrenAccessor\"\n          [trackBy]=\"trackByName\"\n          (checkedChange)=\"checkedValues = $event\"\n          checkable>\n  <ngs-tree-node *ngsTreeNodeDef=\"let node\"\n                 ngsTreeNodePadding\n                 [value]=\"node.name\"\n                 [disabled]=\"!!node.disabled\">\n    <button ngsIconButton disabled></button>\n    {{node.name}}\n  </ngs-tree-node>\n  <ngs-tree-node *ngsTreeNodeDef=\"let node; when: hasChild\"\n                 ngsTreeNodePadding\n                 [value]=\"node.name\"\n                 [disabled]=\"!!node.disabled\"\n                 [cdkTreeNodeTypeaheadLabel]=\"node.name\">\n    <button ngsIconButton ngsTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\n      @if (tree.isExpanded(node)) {\n        <ngs-icon name=\"fluent:chevron-down-24-regular\" class=\"size-4\"/>\n      } @else {\n        <ngs-icon name=\"fluent:chevron-right-24-regular\" class=\"size-4\"/>\n      }\n    </button>\n    {{node.name}}\n  </ngs-tree-node>\n</ngs-tree>\n<p class=\"tree-example-state\">\n  Checked: {{checkedValues.length ? checkedValues.join(', ') : 'None'}}\n</p>"
         },
         {
-          "name": "tree-with-dynamic-data-example",
-          "title": "Tree with dynamic data",
-          "file": "projects/docs/src/app/components/tree/_examples/tree-with-dynamic-data-example/tree-with-dynamic-data-example.html",
-          "source": "<ngs-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n  <ngs-tree-node *ngsTreeNodeDef=\"let node\" ngsTreeNodePadding>\n    <button ngsIconButton disabled></button>\n    {{node.item}}\n  </ngs-tree-node>\n  <ngs-tree-node *ngsTreeNodeDef=\"let node; when: hasChild\" ngsTreeNodePadding ngsTreeNodeToggle\n                 [cdkTreeNodeTypeaheadLabel]=\"node.item\">\n    <button ngsIconButton\n            [attr.aria-label]=\"'Toggle ' + node.item\" ngsTreeNodeToggle>\n      @if (treeControl.isExpanded(node)) {\n        <ngs-icon name=\"fluent:chevron-down-24-regular\" class=\"size-4\"/>\n      } @else {\n        <ngs-icon name=\"fluent:chevron-right-24-regular\" class=\"size-4\"/>\n      }\n    </button>\n    {{node.item}}\n    @if (node.isLoading()) {\n      <ngs-progress-bar mode=\"indeterminate\" class=\"ms-3\"/>\n    }\n  </ngs-tree-node>\n</ngs-tree>"
+          "name": "draggable-tree-example",
+          "title": "Draggable tree",
+          "file": "projects/docs/src/app/components/tree/_examples/draggable-tree-example/draggable-tree-example.html",
+          "source": "<ngs-tree #tree\n          [dataSource]=\"dataSource\"\n          [childrenAccessor]=\"childrenAccessor\"\n          [trackBy]=\"trackByName\"\n          (nodeDrop)=\"onNodeDrop($event)\"\n          draggable>\n  <ngs-tree-node *ngsTreeNodeDef=\"let node\" ngsTreeNodePadding [value]=\"node.name\">\n    <button ngsIconButton disabled></button>\n    {{node.name}}\n  </ngs-tree-node>\n  <ngs-tree-node *ngsTreeNodeDef=\"let node; when: hasChild\"\n                 ngsTreeNodePadding\n                 [value]=\"node.name\"\n                 [cdkTreeNodeTypeaheadLabel]=\"node.name\">\n    <button ngsIconButton ngsTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\n      @if (tree.isExpanded(node)) {\n        <ngs-icon name=\"fluent:chevron-down-24-regular\" class=\"size-4\"/>\n      } @else {\n        <ngs-icon name=\"fluent:chevron-right-24-regular\" class=\"size-4\"/>\n      }\n    </button>\n    {{node.name}}\n  </ngs-tree-node>\n</ngs-tree>\n<p class=\"tree-example-state\">\n  {{dropMessage}}\n</p>"
         }
       ],
       "previewAsset": "projects/components/tree/preview.svg",
@@ -10033,12 +10047,17 @@
         "Tree",
         "TreeNode",
         "TreeNodeDef",
+        "TreeNodeDrop",
+        "TreeNodeDropPosition",
         "TreeNodeOutlet",
         "TreeNodePadding",
         "TreeNodeToggle"
       ],
       "inputs": [
+        "checkable",
+        "childrenKey",
         "disabled",
+        "draggable",
         "ngsNestedTreeNode",
         "ngsTreeNode",
         "ngsTreeNodeDefWhen",
@@ -10046,20 +10065,55 @@
         "ngsTreeNodePaddingIndent",
         "ngsTreeNodeToggleRecursive",
         "recursive",
+        "selectable",
         "tabIndex",
+        "value",
         "when"
       ],
       "outputs": [
         "activation",
-        "expandedChange"
+        "checkedChange",
+        "expandedChange",
+        "selectedChange"
       ],
       "cssTokens": [
+        "--ngs-checkbox-gap",
+        "--ngs-color-neutral",
+        "--ngs-color-primary",
+        "--ngs-nav-item-active-bg",
+        "--ngs-nav-item-active-color",
+        "--ngs-nav-item-color",
+        "--ngs-nav-item-font-size",
+        "--ngs-nav-item-gap",
+        "--ngs-nav-item-height",
+        "--ngs-nav-item-hover-bg",
+        "--ngs-nav-item-hover-color",
+        "--ngs-nav-item-padding",
+        "--ngs-nav-item-radius",
         "--ngs-tree-container-background-color",
+        "--ngs-tree-gap",
+        "--ngs-tree-node-active-bg",
+        "--ngs-tree-node-active-color",
+        "--ngs-tree-node-checkbox-gap",
+        "--ngs-tree-node-color",
+        "--ngs-tree-node-disabled-opacity",
+        "--ngs-tree-node-drop-line-color",
+        "--ngs-tree-node-drop-line-radius",
+        "--ngs-tree-node-drop-line-size",
+        "--ngs-tree-node-drop-target-bg",
+        "--ngs-tree-node-drop-target-color",
+        "--ngs-tree-node-drop-target-outline",
+        "--ngs-tree-node-drop-target-outline-offset",
+        "--ngs-tree-node-font-size",
+        "--ngs-tree-node-gap",
+        "--ngs-tree-node-hover-bg",
+        "--ngs-tree-node-hover-color",
+        "--ngs-tree-node-line-color",
         "--ngs-tree-node-min-height",
-        "--ngs-tree-node-text-color",
-        "--ngs-tree-node-text-font",
-        "--ngs-tree-node-text-size",
-        "--ngs-tree-node-text-weight"
+        "--ngs-tree-node-padding",
+        "--ngs-tree-node-radius",
+        "--ngs-tree-node-title-font-size",
+        "--ngs-tree-padding"
       ],
       "example": null
     },

package/fesm2022/ngstarter-ui-components-notifications.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, TemplateRef, input, Directive, contentChildren, contentChild, booleanAttribute, Component, ElementRef } from '@angular/core';
+import { inject, TemplateRef, input, Directive, contentChildren, contentChild, booleanAttribute, output, computed, ChangeDetectionStrategy, Component, ElementRef } from '@angular/core';
 import { NgTemplateOutlet } from '@angular/common';
 import { Skeleton } from '@ngstarter-ui/components/skeleton';
@@ -34,35 +34,62 @@ class NotificationList {
     controlsDef = contentChild(NotificationControlsDefDirective, ...(ngDevMode ? [{ debugName: "controlsDef" }] : /* istanbul ignore next */ []));
     notifications = input([], ...(ngDevMode ? [{ debugName: "notifications" }] : /* istanbul ignore next */ []));
     static = input(true, { ...(ngDevMode ? { debugName: "static" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    _initialized = false;
-    _defsMap = new Map();
-    get controlsTpl() {
-        return this.controlsDef()?.templateRef;
-    }
-    ngAfterContentInit() {
+    notificationClick = output();
+    _initialized = true;
+    _defsMap = computed(() => {
+        const defsMap = new Map();
         this.defs().forEach((def) => {
-            this._defsMap.set(def.ngsNotificationDef(), def.templateRef);
+            defsMap.set(def.ngsNotificationDef(), def.templateRef);
         });
-        this._initialized = true;
+        return defsMap;
+    }, ...(ngDevMode ? [{ debugName: "_defsMap" }] : /* istanbul ignore next */ []));
+    get controlsTpl() {
+        return this.controlsDef()?.templateRef;
     }
     getNotificationTemplate(type) {
-        if (!this._defsMap.has(type)) {
+        const defsMap = this._defsMap();
+        if (!defsMap.has(type)) {
             throw new Error(`Invalid type "${type}" for notification def`);
         }
-        return this._defsMap.get(type);
+        return defsMap.get(type);
+    }
+    handleNotificationClick(notification, event) {
+        if (!this.static() && !this.isEventFromInteractiveElement(event)) {
+            this.notificationClick.emit(notification);
+        }
+    }
+    handleNotificationKeydown(notification, event) {
+        if (this.static() || this.isEventFromInteractiveElement(event)) {
+            return;
+        }
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            this.notificationClick.emit(notification);
+        }
+    }
+    stopControlsEvent(event) {
+        event.stopPropagation();
+    }
+    isEventFromInteractiveElement(event) {
+        const target = event.target;
+        if (!(target instanceof HTMLElement)) {
+            return false;
+        }
+        return !!target.closest('a,button,input,select,textarea,[role="link"],[role="menuitem"],.controls');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationList, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: NotificationList, isStandalone: true, selector: "ngs-notification-list", inputs: { notifications: { classPropertyName: "notifications", publicName: "notifications", isSignal: true, isRequired: false, transformFunction: null }, static: { classPropertyName: "static", publicName: "static", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-static": "static()" }, classAttribute: "ngs-notification-list" }, queries: [{ propertyName: "defs", predicate: NotificationDefDirective, isSignal: true }, { propertyName: "controlsDef", first: true, predicate: NotificationControlsDefDirective, descendants: true, isSignal: true }], exportAs: ["ngsNotificationList"], ngImport: i0, template: "@if (_initialized) {\n  @for (notification of notifications(); track notification) {\n    <div class=\"notification\">\n      <ng-container [ngTemplateOutlet]=\"getNotificationTemplate(notification.type)\"\n                    [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n      @if (controlsDef()) {\n        <div class=\"controls\">\n          <ng-container [ngTemplateOutlet]=\"controlsTpl\"\n                        [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n        </div>\n      }\n    </div>\n  }\n}\n", styles: [":host{--ngs-notification-list-gap: calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;gap:var(--ngs-notification-list-gap)}:host .notification{position:relative}:host .controls{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: NotificationList, isStandalone: true, selector: "ngs-notification-list", inputs: { notifications: { classPropertyName: "notifications", publicName: "notifications", isSignal: true, isRequired: false, transformFunction: null }, static: { classPropertyName: "static", publicName: "static", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { notificationClick: "notificationClick" }, host: { attributes: { "role": "list" }, properties: { "class.is-static": "static()" }, classAttribute: "ngs-notification-list" }, queries: [{ propertyName: "defs", predicate: NotificationDefDirective, isSignal: true }, { propertyName: "controlsDef", first: true, predicate: NotificationControlsDefDirective, descendants: true, isSignal: true }], exportAs: ["ngsNotificationList"], ngImport: i0, template: "@if (_initialized) {\n  @for (notification of notifications(); track $index) {\n    <div class=\"notification\"\n         role=\"listitem\"\n         [class.is-interactive]=\"!static()\"\n         [attr.tabindex]=\"static() ? null : 0\"\n         (click)=\"handleNotificationClick(notification, $event)\"\n         (keydown)=\"handleNotificationKeydown(notification, $event)\">\n      <ng-container [ngTemplateOutlet]=\"getNotificationTemplate(notification.type)\"\n                    [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n      @if (controlsDef()) {\n        <div class=\"controls\"\n             (click)=\"stopControlsEvent($event)\"\n             (keydown)=\"stopControlsEvent($event)\">\n          <ng-container [ngTemplateOutlet]=\"controlsTpl\"\n                        [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n        </div>\n      }\n    </div>\n  }\n}\n", styles: [":host{--ngs-notification-list-gap: calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;gap:var(--ngs-notification-list-gap)}:host .notification{position:relative}:host .notification.is-interactive{outline:none}:host .notification.is-interactive:focus-visible{outline:2px solid var(--ngs-color-primary);outline-offset:calc(var(--spacing, .25rem) * 1);border-radius:var(--ngs-notification-radius, var(--ngs-radius-xl))}:host .controls{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationList, decorators: [{
             type: Component,
             args: [{ selector: 'ngs-notification-list', exportAs: 'ngsNotificationList', imports: [
                         NgTemplateOutlet
-                    ], host: {
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         'class': 'ngs-notification-list',
-                        '[class.is-static]': 'static()'
-                    }, template: "@if (_initialized) {\n  @for (notification of notifications(); track notification) {\n    <div class=\"notification\">\n      <ng-container [ngTemplateOutlet]=\"getNotificationTemplate(notification.type)\"\n                    [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n      @if (controlsDef()) {\n        <div class=\"controls\">\n          <ng-container [ngTemplateOutlet]=\"controlsTpl\"\n                        [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n        </div>\n      }\n    </div>\n  }\n}\n", styles: [":host{--ngs-notification-list-gap: calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;gap:var(--ngs-notification-list-gap)}:host .notification{position:relative}:host .controls{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
-        }], propDecorators: { defs: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => NotificationDefDirective), { isSignal: true }] }], controlsDef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NotificationControlsDefDirective), { isSignal: true }] }], notifications: [{ type: i0.Input, args: [{ isSignal: true, alias: "notifications", required: false }] }], static: [{ type: i0.Input, args: [{ isSignal: true, alias: "static", required: false }] }] } });
+                        '[class.is-static]': 'static()',
+                        'role': 'list'
+                    }, template: "@if (_initialized) {\n  @for (notification of notifications(); track $index) {\n    <div class=\"notification\"\n         role=\"listitem\"\n         [class.is-interactive]=\"!static()\"\n         [attr.tabindex]=\"static() ? null : 0\"\n         (click)=\"handleNotificationClick(notification, $event)\"\n         (keydown)=\"handleNotificationKeydown(notification, $event)\">\n      <ng-container [ngTemplateOutlet]=\"getNotificationTemplate(notification.type)\"\n                    [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n      @if (controlsDef()) {\n        <div class=\"controls\"\n             (click)=\"stopControlsEvent($event)\"\n             (keydown)=\"stopControlsEvent($event)\">\n          <ng-container [ngTemplateOutlet]=\"controlsTpl\"\n                        [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n        </div>\n      }\n    </div>\n  }\n}\n", styles: [":host{--ngs-notification-list-gap: calc(var(--spacing, .25rem) * 6);display:flex;flex-direction:column;gap:var(--ngs-notification-list-gap)}:host .notification{position:relative}:host .notification.is-interactive{outline:none}:host .notification.is-interactive:focus-visible{outline:2px solid var(--ngs-color-primary);outline-offset:calc(var(--spacing, .25rem) * 1);border-radius:var(--ngs-notification-radius, var(--ngs-radius-xl))}:host .controls{position:absolute;inset-inline-end:calc(var(--spacing, .25rem) * 1);top:calc(var(--spacing, .25rem) * 1)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
+        }], propDecorators: { defs: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => NotificationDefDirective), { isSignal: true }] }], controlsDef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NotificationControlsDefDirective), { isSignal: true }] }], notifications: [{ type: i0.Input, args: [{ isSignal: true, alias: "notifications", required: false }] }], static: [{ type: i0.Input, args: [{ isSignal: true, alias: "static", required: false }] }], notificationClick: [{ type: i0.Output, args: ["notificationClick"] }] } });
 class NotificationSkeleton {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationSkeleton, deps: [], target: i0.ɵɵFactoryTarget.Component });
@@ -79,11 +106,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
 class NotificationTime {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationTime, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: NotificationTime, isStandalone: true, selector: "ngs-notification-time,[ngs-notification-time]", host: { classAttribute: "ngs-notification-time" }, exportAs: ["ngsNotificationTime"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{font-size:var(--ngs-font-size-xs);color:var(--ngs-color-on-surface-variant)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: NotificationTime, isStandalone: true, selector: "ngs-notification-time,[ngs-notification-time]", host: { classAttribute: "ngs-notification-time" }, exportAs: ["ngsNotificationTime"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{font-size:var(--ngs-font-size-xs);color:var(--ngs-color-on-surface-variant)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationTime, decorators: [{
             type: Component,
-            args: [{ selector: 'ngs-notification-time,[ngs-notification-time]', exportAs: 'ngsNotificationTime', imports: [], host: {
+            args: [{ selector: 'ngs-notification-time,[ngs-notification-time]', exportAs: 'ngsNotificationTime', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         'class': 'ngs-notification-time'
                     }, template: "<ng-content/>\n", styles: [":host{font-size:var(--ngs-font-size-xs);color:var(--ngs-color-on-surface-variant)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
         }] });
@@ -94,11 +121,11 @@ class NotificationActor {
         return this.elementRef.nativeElement.tagName === 'A';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationActor, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: NotificationActor, isStandalone: true, selector: "ngs-notification-actor,[ngs-notification-actor]", host: { properties: { "class.as-link": "asLink" }, classAttribute: "ngs-notification-actor" }, ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:inline-block;font-weight:600;color:var(--ngs-color-on-surface);font-size:var(--ngs-font-size-sm)}:host.as-link:hover{cursor:pointer;text-decoration:underline}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: NotificationActor, isStandalone: true, selector: "ngs-notification-actor,[ngs-notification-actor]", host: { properties: { "class.as-link": "asLink" }, classAttribute: "ngs-notification-actor" }, ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:inline-block;font-weight:600;color:var(--ngs-color-on-surface);font-size:var(--ngs-font-size-sm)}:host.as-link:hover{cursor:pointer;text-decoration:underline}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationActor, decorators: [{
             type: Component,
-            args: [{ selector: 'ngs-notification-actor,[ngs-notification-actor]', imports: [], host: {
+            args: [{ selector: 'ngs-notification-actor,[ngs-notification-actor]', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         'class': 'ngs-notification-actor',
                         '[class.as-link]': 'asLink'
                     }, template: "<ng-content/>\n", styles: [":host{display:inline-block;font-weight:600;color:var(--ngs-color-on-surface);font-size:var(--ngs-font-size-sm)}:host.as-link:hover{cursor:pointer;text-decoration:underline}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
@@ -106,11 +133,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
 class NotificationMessage {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationMessage, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: NotificationMessage, isStandalone: true, selector: "ngs-notification-message", host: { classAttribute: "ngs-notification-message" }, exportAs: ["ngsNotificationMessage"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{font-size:var(--ngs-font-size-sm)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: NotificationMessage, isStandalone: true, selector: "ngs-notification-message", host: { classAttribute: "ngs-notification-message" }, exportAs: ["ngsNotificationMessage"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{font-size:var(--ngs-font-size-sm)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationMessage, decorators: [{
             type: Component,
-            args: [{ selector: 'ngs-notification-message', exportAs: 'ngsNotificationMessage', imports: [], host: {
+            args: [{ selector: 'ngs-notification-message', exportAs: 'ngsNotificationMessage', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         'class': 'ngs-notification-message'
                     }, template: "<ng-content/>\n", styles: [":host{font-size:var(--ngs-font-size-sm)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
         }] });
@@ -118,11 +145,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
 class Notification {
     isUnread = input(false, { ...(ngDevMode ? { debugName: "isUnread" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Notification, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: Notification, isStandalone: true, selector: "ngs-notification,[ngs-notification]", inputs: { isUnread: { classPropertyName: "isUnread", publicName: "isUnread", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-unread": "isUnread()" }, classAttribute: "ngs-notification" }, exportAs: ["ngsNotification"], ngImport: i0, template: "<div class=\"avatar\">\n  <ng-content select=\"[ngsNotificationAvatar]\"/>\n</div>\n<div class=\"grow\">\n  <span class=\"message\">\n    <ng-content select=\"ngs-notification-message,[ngs-notification-message]\"/>\n  </span>\n  <div class=\"content\">\n    <ng-content select=\"ngs-notification-content,[ngs-notification-content]\"/>\n  </div>\n  <ng-content select=\"ngs-notification-time,[ngs-notification-time]\"/>\n</div>\n", styles: [":host{--ngs-notification-padding: calc(var(--spacing, .25rem) * 5);--ngs-notification-gap: calc(var(--spacing, .25rem) * 4);--ngs-notification-bg: var(--ngs-color-surface-container-lowest);--ngs-notification-hover-bg: var(--ngs-color-surface-container-low);--ngs-notification-is-unread-bg: var(--ngs-color-surface-container-low);--ngs-notification-is-unread-hover-bg: var(--ngs-color-surface-container);--ngs-notification-radius: .75rem;display:flex;width:100%;position:relative;border-radius:var(--ngs-notification-radius);gap:var(--ngs-notification-gap);padding:var(--ngs-notification-padding)}:host .avatar{position:relative}:host .avatar:empty{display:none}:host .actor:empty{display:none}:host .message:empty{display:none}:host-context(ngs-notification-list.is-static){cursor:auto}:host-context(ngs-notification-list){background:var(--ngs-notification-bg);cursor:pointer}:host-context(ngs-notification-list).is-unread{background:var(--ngs-notification-is-unread-bg)}:host-context(ngs-notification-list:not(.is-static)):hover{background:var(--ngs-notification-hover-bg)}:host-context(ngs-notification-list:not(.is-static)).is-unread:hover{background:var(--ngs-notification-is-unread-hover-bg)}:host-context(html.dark){--ngs-notification-is-unread-bg: var(--ngs-color-neutral-950);--ngs-notification-is-unread-hover-bg: var(--ngs-color-neutral-900)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: Notification, isStandalone: true, selector: "ngs-notification,[ngs-notification]", inputs: { isUnread: { classPropertyName: "isUnread", publicName: "isUnread", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-unread": "isUnread()" }, classAttribute: "ngs-notification" }, exportAs: ["ngsNotification"], ngImport: i0, template: "<div class=\"avatar\">\n  <ng-content select=\"[ngsNotificationAvatar]\"/>\n</div>\n<div class=\"grow\">\n  <span class=\"message\">\n    <ng-content select=\"ngs-notification-message,[ngs-notification-message]\"/>\n  </span>\n  <div class=\"content\">\n    <ng-content select=\"ngs-notification-content,[ngs-notification-content]\"/>\n  </div>\n  <ng-content select=\"ngs-notification-time,[ngs-notification-time]\"/>\n</div>\n", styles: [":host{--ngs-notification-padding: calc(var(--spacing, .25rem) * 5);--ngs-notification-gap: calc(var(--spacing, .25rem) * 4);--ngs-notification-bg: var(--ngs-color-surface-container-lowest);--ngs-notification-hover-bg: var(--ngs-color-surface-container-low);--ngs-notification-is-unread-bg: var(--ngs-color-surface-container-low);--ngs-notification-is-unread-hover-bg: var(--ngs-color-surface-container);--ngs-notification-radius: .75rem;display:flex;width:100%;position:relative;border-radius:var(--ngs-notification-radius);gap:var(--ngs-notification-gap);padding:var(--ngs-notification-padding)}:host .avatar{position:relative}:host .avatar:empty{display:none}:host .actor:empty{display:none}:host .message:empty{display:none}:host-context(ngs-notification-list.is-static){cursor:auto}:host-context(ngs-notification-list){background:var(--ngs-notification-bg);cursor:pointer}:host-context(ngs-notification-list).is-unread{background:var(--ngs-notification-is-unread-bg)}:host-context(ngs-notification-list:not(.is-static)):hover{background:var(--ngs-notification-hover-bg)}:host-context(ngs-notification-list:not(.is-static)).is-unread:hover{background:var(--ngs-notification-is-unread-hover-bg)}:host-context(html.dark){--ngs-notification-is-unread-bg: var(--ngs-color-neutral-950);--ngs-notification-is-unread-hover-bg: var(--ngs-color-neutral-900)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Notification, decorators: [{
             type: Component,
-            args: [{ selector: 'ngs-notification,[ngs-notification]', exportAs: 'ngsNotification', imports: [], host: {
+            args: [{ selector: 'ngs-notification,[ngs-notification]', exportAs: 'ngsNotification', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         'class': 'ngs-notification',
                         '[class.is-unread]': 'isUnread()'
                     }, template: "<div class=\"avatar\">\n  <ng-content select=\"[ngsNotificationAvatar]\"/>\n</div>\n<div class=\"grow\">\n  <span class=\"message\">\n    <ng-content select=\"ngs-notification-message,[ngs-notification-message]\"/>\n  </span>\n  <div class=\"content\">\n    <ng-content select=\"ngs-notification-content,[ngs-notification-content]\"/>\n  </div>\n  <ng-content select=\"ngs-notification-time,[ngs-notification-time]\"/>\n</div>\n", styles: [":host{--ngs-notification-padding: calc(var(--spacing, .25rem) * 5);--ngs-notification-gap: calc(var(--spacing, .25rem) * 4);--ngs-notification-bg: var(--ngs-color-surface-container-lowest);--ngs-notification-hover-bg: var(--ngs-color-surface-container-low);--ngs-notification-is-unread-bg: var(--ngs-color-surface-container-low);--ngs-notification-is-unread-hover-bg: var(--ngs-color-surface-container);--ngs-notification-radius: .75rem;display:flex;width:100%;position:relative;border-radius:var(--ngs-notification-radius);gap:var(--ngs-notification-gap);padding:var(--ngs-notification-padding)}:host .avatar{position:relative}:host .avatar:empty{display:none}:host .actor:empty{display:none}:host .message:empty{display:none}:host-context(ngs-notification-list.is-static){cursor:auto}:host-context(ngs-notification-list){background:var(--ngs-notification-bg);cursor:pointer}:host-context(ngs-notification-list).is-unread{background:var(--ngs-notification-is-unread-bg)}:host-context(ngs-notification-list:not(.is-static)):hover{background:var(--ngs-notification-hover-bg)}:host-context(ngs-notification-list:not(.is-static)).is-unread:hover{background:var(--ngs-notification-is-unread-hover-bg)}:host-context(html.dark){--ngs-notification-is-unread-bg: var(--ngs-color-neutral-950);--ngs-notification-is-unread-hover-bg: var(--ngs-color-neutral-900)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
@@ -130,11 +157,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
 class NotificationContent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: NotificationContent, isStandalone: true, selector: "ngs-notification-content,[ngs-notification-content]", host: { classAttribute: "ngs-notification-content" }, exportAs: ["ngsNotificationContent"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{--ngs-notification-content-margin: calc(var(--spacing, .25rem) * 1.5) 0 calc(var(--spacing, .25rem) * 1.5) 0;display:block;margin:var(--ngs-notification-content-margin)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: NotificationContent, isStandalone: true, selector: "ngs-notification-content,[ngs-notification-content]", host: { classAttribute: "ngs-notification-content" }, exportAs: ["ngsNotificationContent"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{--ngs-notification-content-margin: calc(var(--spacing, .25rem) * 1.5) 0 calc(var(--spacing, .25rem) * 1.5) 0;display:block;margin:var(--ngs-notification-content-margin)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: NotificationContent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngs-notification-content,[ngs-notification-content]', exportAs: 'ngsNotificationContent', imports: [], host: {
+            args: [{ selector: 'ngs-notification-content,[ngs-notification-content]', exportAs: 'ngsNotificationContent', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         'class': 'ngs-notification-content'
                     }, template: "<ng-content/>\n", styles: [":host{--ngs-notification-content-margin: calc(var(--spacing, .25rem) * 1.5) 0 calc(var(--spacing, .25rem) * 1.5) 0;display:block;margin:var(--ngs-notification-content-margin)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
         }] });

package/fesm2022/ngstarter-ui-components-notifications.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ngstarter-ui-components-notifications.mjs","sources":["../../../projects/components/notifications/src/notification-def.directive.ts","../../../projects/components/notifications/src/notification-controls-def.directive.ts","../../../projects/components/notifications/src/notification-list/notification-list.ts","../../../projects/components/notifications/src/notification-list/notification-list.html","../../../projects/components/notifications/src/notification-skeleton/notification-skeleton.ts","../../../projects/components/notifications/src/notification-skeleton/notification-skeleton.html","../../../projects/components/notifications/src/notification-time/notification-time.ts","../../../projects/components/notifications/src/notification-time/notification-time.html","../../../projects/components/notifications/src/notification-actor/notification-actor.ts","../../../projects/components/notifications/src/notification-actor/notification-actor.html","../../../projects/components/notifications/src/notification-message/notification-message.ts","../../../projects/components/notifications/src/notification-message/notification-message.html","../../../projects/components/notifications/src/notification/notification.ts","../../../projects/components/notifications/src/notification/notification.html","../../../projects/components/notifications/src/notification-content/notification-content.ts","../../../projects/components/notifications/src/notification-content/notification-content.html","../../../projects/components/notifications/src/notification-props.directive.ts","../../../projects/components/notifications/src/notification-avatar.directive.ts","../../../projects/components/notifications/ngstarter-ui-components-notifications.ts"],"sourcesContent":["import { Directive, inject, input, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsNotificationDef]',\n standalone: true\n})\nexport class NotificationDefDirective {\n readonly templateRef = inject(TemplateRef);\n ngsNotificationDef = input.required<string>();\n}\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsNotificationControlsDef]',\n})\nexport class NotificationControlsDefDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import {\n AfterContentInit, booleanAttribute,\n Component,\n contentChild,\n contentChildren,\n input,\n TemplateRef\n} from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { NotificationDefDirective } from '../notification-def.directive';\nimport { NotificationControlsDefDirective } from '../notification-controls-def.directive';\nimport { NotificationInterface } from '../types';\n\n@Component({\n selector: 'ngs-notification-list',\n exportAs: 'ngsNotificationList',\n imports: [\n NgTemplateOutlet\n ],\n templateUrl: './notification-list.html',\n styleUrl: './notification-list.scss',\n host: {\n 'class': 'ngs-notification-list',\n '[class.is-static]': 'static()'\n }\n})\nexport class NotificationList<T extends NotificationInterface> implements AfterContentInit {\n readonly defs = contentChildren(NotificationDefDirective);\n readonly controlsDef = contentChild(NotificationControlsDefDirective);\n\n notifications = input<T[]>([]);\n static = input(true, {\n transform: booleanAttribute\n });\n\n protected _initialized = false;\n protected _defsMap = new Map<string, TemplateRef<any>>();\n\n get controlsTpl(): TemplateRef<any> {\n return this.controlsDef()?.templateRef as TemplateRef<any>;\n }\n\n ngAfterContentInit() {\n this.defs().forEach((def: NotificationDefDirective) => {\n this._defsMap.set(def.ngsNotificationDef(), def.templateRef);\n });\n this._initialized = true;\n }\n\n getNotificationTemplate(type: string): TemplateRef<any> {\n if (!this._defsMap.has(type)) {\n throw new Error(`Invalid type \"${type}\" for notification def`);\n }\n\n return this._defsMap.get(type) as TemplateRef<any>;\n }\n}\n","@if (_initialized) {\n @for (notification of notifications(); track notification) {\n <div class=\"notification\">\n <ng-container [ngTemplateOutlet]=\"getNotificationTemplate(notification.type)\"\n [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n @if (controlsDef()) {\n <div class=\"controls\">\n <ng-container [ngTemplateOutlet]=\"controlsTpl\"\n [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n </div>\n }\n </div>\n }\n}\n","import { Component } from '@angular/core';\nimport { Skeleton } from '@ngstarter-ui/components/skeleton';\n\n@Component({\n selector: 'ngs-notification-skeleton',\n exportAs: 'ngsNotificationSkeleton',\n imports: [\n Skeleton\n ],\n templateUrl: './notification-skeleton.html',\n styleUrl: './notification-skeleton.scss',\n host: {\n 'class': 'ngs-notification-skeleton',\n }\n})\nexport class NotificationSkeleton {\n\n}\n","<div class=\"flex gap-3\">\n <ngs-skeleton roundedFull class=\"size-11\"/>\n <div class=\"grow flex flex-col gap-2\">\n <ngs-skeleton class=\"h-16\"/>\n <ngs-skeleton class=\"w-20 h-3\"/>\n </div>\n</div>\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification-time,[ngs-notification-time]',\n exportAs: 'ngsNotificationTime',\n imports: [],\n templateUrl: './notification-time.html',\n styleUrl: './notification-time.scss',\n host: {\n 'class': 'ngs-notification-time'\n }\n})\nexport class NotificationTime {\n\n}\n","<ng-content/>\n","import { Component, ElementRef, inject } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification-actor,[ngs-notification-actor]',\n imports: [],\n templateUrl: './notification-actor.html',\n styleUrl: './notification-actor.scss',\n host: {\n 'class': 'ngs-notification-actor',\n '[class.as-link]': 'asLink'\n }\n})\nexport class NotificationActor {\n private elementRef = inject(ElementRef);\n\n protected get asLink() {\n return (this.elementRef.nativeElement as HTMLElement).tagName === 'A';\n }\n}\n","<ng-content/>\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification-message',\n exportAs: 'ngsNotificationMessage',\n imports: [],\n templateUrl: './notification-message.html',\n styleUrl: './notification-message.scss',\n host: {\n 'class': 'ngs-notification-message'\n }\n})\nexport class NotificationMessage {\n\n}\n","<ng-content/>\n","import { booleanAttribute, Component, input } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification,[ngs-notification]',\n exportAs: 'ngsNotification',\n imports: [],\n templateUrl: './notification.html',\n styleUrl: './notification.scss',\n host: {\n 'class': 'ngs-notification',\n '[class.is-unread]': 'isUnread()'\n }\n})\nexport class Notification {\n isUnread = input(false, {\n transform: booleanAttribute\n });\n}\n","<div class=\"avatar\">\n <ng-content select=\"[ngsNotificationAvatar]\"/>\n</div>\n<div class=\"grow\">\n <span class=\"message\">\n <ng-content select=\"ngs-notification-message,[ngs-notification-message]\"/>\n </span>\n <div class=\"content\">\n <ng-content select=\"ngs-notification-content,[ngs-notification-content]\"/>\n </div>\n <ng-content select=\"ngs-notification-time,[ngs-notification-time]\"/>\n</div>\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification-content,[ngs-notification-content]',\n exportAs: 'ngsNotificationContent',\n imports: [],\n templateUrl: './notification-content.html',\n styleUrl: './notification-content.scss',\n host: {\n 'class': 'ngs-notification-content'\n }\n})\nexport class NotificationContent {\n\n}\n","<ng-content/>\n","import { booleanAttribute, Directive, input } from '@angular/core';\n\n@Directive({\n selector: '[ngsNotificationProps]',\n exportAs: 'ngsNotificationProps',\n standalone: true,\n host: {\n 'class': 'ngs-notification-props',\n '[class.is-unread]': 'isUnread()',\n }\n})\nexport class NotificationPropsDirective {\n isUnread = input(false, {\n transform: booleanAttribute\n });\n}\n","import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[ngsNotificationAvatar]',\n exportAs: 'ngsNotificationAvatar',\n host: {\n 'class': 'ngs-notification-avatar'\n }\n})\nexport class NotificationAvatarDirective {\n}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"ngstarter-ui-components-notifications.mjs","sources":["../../../projects/components/notifications/src/notification-def.directive.ts","../../../projects/components/notifications/src/notification-controls-def.directive.ts","../../../projects/components/notifications/src/notification-list/notification-list.ts","../../../projects/components/notifications/src/notification-list/notification-list.html","../../../projects/components/notifications/src/notification-skeleton/notification-skeleton.ts","../../../projects/components/notifications/src/notification-skeleton/notification-skeleton.html","../../../projects/components/notifications/src/notification-time/notification-time.ts","../../../projects/components/notifications/src/notification-time/notification-time.html","../../../projects/components/notifications/src/notification-actor/notification-actor.ts","../../../projects/components/notifications/src/notification-actor/notification-actor.html","../../../projects/components/notifications/src/notification-message/notification-message.ts","../../../projects/components/notifications/src/notification-message/notification-message.html","../../../projects/components/notifications/src/notification/notification.ts","../../../projects/components/notifications/src/notification/notification.html","../../../projects/components/notifications/src/notification-content/notification-content.ts","../../../projects/components/notifications/src/notification-content/notification-content.html","../../../projects/components/notifications/src/notification-props.directive.ts","../../../projects/components/notifications/src/notification-avatar.directive.ts","../../../projects/components/notifications/ngstarter-ui-components-notifications.ts"],"sourcesContent":["import { Directive, inject, input, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsNotificationDef]',\n standalone: true\n})\nexport class NotificationDefDirective {\n readonly templateRef = inject(TemplateRef);\n ngsNotificationDef = input.required<string>();\n}\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsNotificationControlsDef]',\n})\nexport class NotificationControlsDefDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n contentChild,\n contentChildren,\n input,\n output,\n TemplateRef\n} from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { NotificationDefDirective } from '../notification-def.directive';\nimport { NotificationControlsDefDirective } from '../notification-controls-def.directive';\nimport { NotificationInterface } from '../types';\n\n@Component({\n selector: 'ngs-notification-list',\n exportAs: 'ngsNotificationList',\n imports: [\n NgTemplateOutlet\n ],\n templateUrl: './notification-list.html',\n styleUrl: './notification-list.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'class': 'ngs-notification-list',\n '[class.is-static]': 'static()',\n 'role': 'list'\n }\n})\nexport class NotificationList<T extends NotificationInterface> {\n readonly defs = contentChildren(NotificationDefDirective);\n readonly controlsDef = contentChild(NotificationControlsDefDirective);\n\n notifications = input<T[]>([]);\n static = input(true, {\n transform: booleanAttribute\n });\n\n readonly notificationClick = output<T>();\n\n protected _initialized = true;\n protected readonly _defsMap = computed(() => {\n const defsMap = new Map<string, TemplateRef<any>>();\n\n this.defs().forEach((def: NotificationDefDirective) => {\n defsMap.set(def.ngsNotificationDef(), def.templateRef);\n });\n\n return defsMap;\n });\n\n get controlsTpl(): TemplateRef<any> {\n return this.controlsDef()?.templateRef as TemplateRef<any>;\n }\n\n getNotificationTemplate(type: string): TemplateRef<any> {\n const defsMap = this._defsMap();\n\n if (!defsMap.has(type)) {\n throw new Error(`Invalid type \"${type}\" for notification def`);\n }\n\n return defsMap.get(type) as TemplateRef<any>;\n }\n\n protected handleNotificationClick(notification: T, event: Event) {\n if (!this.static() && !this.isEventFromInteractiveElement(event)) {\n this.notificationClick.emit(notification);\n }\n }\n\n protected handleNotificationKeydown(notification: T, event: KeyboardEvent) {\n if (this.static() \|\| this.isEventFromInteractiveElement(event)) {\n return;\n }\n\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n this.notificationClick.emit(notification);\n }\n }\n\n protected stopControlsEvent(event: Event) {\n event.stopPropagation();\n }\n\n private isEventFromInteractiveElement(event: Event): boolean {\n const target = event.target;\n\n if (!(target instanceof HTMLElement)) {\n return false;\n }\n\n return !!target.closest('a,button,input,select,textarea,[role=\"link\"],[role=\"menuitem\"],.controls');\n }\n}\n","@if (_initialized) {\n @for (notification of notifications(); track $index) {\n <div class=\"notification\"\n role=\"listitem\"\n [class.is-interactive]=\"!static()\"\n [attr.tabindex]=\"static() ? null : 0\"\n (click)=\"handleNotificationClick(notification, $event)\"\n (keydown)=\"handleNotificationKeydown(notification, $event)\">\n <ng-container [ngTemplateOutlet]=\"getNotificationTemplate(notification.type)\"\n [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n @if (controlsDef()) {\n <div class=\"controls\"\n (click)=\"stopControlsEvent($event)\"\n (keydown)=\"stopControlsEvent($event)\">\n <ng-container [ngTemplateOutlet]=\"controlsTpl\"\n [ngTemplateOutletContext]=\"{ $implicit: notification }\" />\n </div>\n }\n </div>\n }\n}\n","import { Component } from '@angular/core';\nimport { Skeleton } from '@ngstarter-ui/components/skeleton';\n\n@Component({\n selector: 'ngs-notification-skeleton',\n exportAs: 'ngsNotificationSkeleton',\n imports: [\n Skeleton\n ],\n templateUrl: './notification-skeleton.html',\n styleUrl: './notification-skeleton.scss',\n host: {\n 'class': 'ngs-notification-skeleton',\n }\n})\nexport class NotificationSkeleton {\n\n}\n","<div class=\"flex gap-3\">\n <ngs-skeleton roundedFull class=\"size-11\"/>\n <div class=\"grow flex flex-col gap-2\">\n <ngs-skeleton class=\"h-16\"/>\n <ngs-skeleton class=\"w-20 h-3\"/>\n </div>\n</div>\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification-time,[ngs-notification-time]',\n exportAs: 'ngsNotificationTime',\n imports: [],\n templateUrl: './notification-time.html',\n styleUrl: './notification-time.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'class': 'ngs-notification-time'\n }\n})\nexport class NotificationTime {\n\n}\n","<ng-content/>\n","import { ChangeDetectionStrategy, Component, ElementRef, inject } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification-actor,[ngs-notification-actor]',\n imports: [],\n templateUrl: './notification-actor.html',\n styleUrl: './notification-actor.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'class': 'ngs-notification-actor',\n '[class.as-link]': 'asLink'\n }\n})\nexport class NotificationActor {\n private elementRef = inject(ElementRef);\n\n protected get asLink() {\n return (this.elementRef.nativeElement as HTMLElement).tagName === 'A';\n }\n}\n","<ng-content/>\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification-message',\n exportAs: 'ngsNotificationMessage',\n imports: [],\n templateUrl: './notification-message.html',\n styleUrl: './notification-message.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'class': 'ngs-notification-message'\n }\n})\nexport class NotificationMessage {\n\n}\n","<ng-content/>\n","import { booleanAttribute, ChangeDetectionStrategy, Component, input } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification,[ngs-notification]',\n exportAs: 'ngsNotification',\n imports: [],\n templateUrl: './notification.html',\n styleUrl: './notification.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'class': 'ngs-notification',\n '[class.is-unread]': 'isUnread()'\n }\n})\nexport class Notification {\n isUnread = input(false, {\n transform: booleanAttribute\n });\n}\n","<div class=\"avatar\">\n <ng-content select=\"[ngsNotificationAvatar]\"/>\n</div>\n<div class=\"grow\">\n <span class=\"message\">\n <ng-content select=\"ngs-notification-message,[ngs-notification-message]\"/>\n </span>\n <div class=\"content\">\n <ng-content select=\"ngs-notification-content,[ngs-notification-content]\"/>\n </div>\n <ng-content select=\"ngs-notification-time,[ngs-notification-time]\"/>\n</div>\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-notification-content,[ngs-notification-content]',\n exportAs: 'ngsNotificationContent',\n imports: [],\n templateUrl: './notification-content.html',\n styleUrl: './notification-content.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'class': 'ngs-notification-content'\n }\n})\nexport class NotificationContent {\n\n}\n","<ng-content/>\n","import { booleanAttribute, Directive, input } from '@angular/core';\n\n@Directive({\n selector: '[ngsNotificationProps]',\n exportAs: 'ngsNotificationProps',\n standalone: true,\n host: {\n 'class': 'ngs-notification-props',\n '[class.is-unread]': 'isUnread()',\n }\n})\nexport class NotificationPropsDirective {\n isUnread = input(false, {\n transform: booleanAttribute\n });\n}\n","import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[ngsNotificationAvatar]',\n exportAs: 'ngsNotificationAvatar',\n host: {\n 'class': 'ngs-notification-avatar'\n }\n})\nexport class NotificationAvatarDirective {\n}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;MAMa,wBAAwB,CAAA;AAC1B,IAAA,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC;AAC1C,IAAA,kBAAkB,GAAG,KAAK,CAAC,QAAQ,wFAAU;uGAFlC,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAxB,wBAAwB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAA,EAAA,oBAAA,EAAA,UAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAxB,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAJpC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,sBAAsB;AAChC,oBAAA,UAAU,EAAE;AACb,iBAAA;;;MCAY,gCAAgC,CAAA;AAClC,IAAA,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC;uGAD/B,gCAAgC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAhC,gCAAgC,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,8BAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAhC,gCAAgC,EAAA,UAAA,EAAA,CAAA;kBAH5C,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,8BAA8B;AACzC,iBAAA;;;MC2BY,gBAAgB,CAAA;AAClB,IAAA,IAAI,GAAG,eAAe,CAAC,wBAAwB,2EAAC;AAChD,IAAA,WAAW,GAAG,YAAY,CAAC,gCAAgC,kFAAC;AAErE,IAAA,aAAa,GAAG,KAAK,CAAM,EAAE,oFAAC;IAC9B,MAAM,GAAG,KAAK,CAAC,IAAI,8EACjB,SAAS,EAAE,gBAAgB,EAAA,CAC3B;IAEO,iBAAiB,GAAG,MAAM,EAAK;IAE9B,YAAY,GAAG,IAAI;AACV,IAAA,QAAQ,GAAG,QAAQ,CAAC,MAAK;AAC1C,QAAA,MAAM,OAAO,GAAG,IAAI,GAAG,EAA4B;QAEnD,IAAI,CAAC,IAAI,EAAE,CAAC,OAAO,CAAC,CAAC,GAA6B,KAAI;AACpD,YAAA,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,kBAAkB,EAAE,EAAE,GAAG,CAAC,WAAW,CAAC;AACxD,QAAA,CAAC,CAAC;AAEF,QAAA,OAAO,OAAO;AAChB,IAAA,CAAC,+EAAC;AAEF,IAAA,IAAI,WAAW,GAAA;AACb,QAAA,OAAO,IAAI,CAAC,WAAW,EAAE,EAAE,WAA+B;IAC5D;AAEA,IAAA,uBAAuB,CAAC,IAAY,EAAA;AAClC,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,EAAE;QAE/B,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;AACtB,YAAA,MAAM,IAAI,KAAK,CAAC,iBAAiB,IAAI,CAAA,sBAAA,CAAwB,CAAC;QAChE;AAEA,QAAA,OAAO,OAAO,CAAC,GAAG,CAAC,IAAI,CAAqB;IAC9C;IAEU,uBAAuB,CAAC,YAAe,EAAE,KAAY,EAAA;AAC7D,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,6BAA6B,CAAC,KAAK,CAAC,EAAE;AAChE,YAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC;QAC3C;IACF;IAEU,yBAAyB,CAAC,YAAe,EAAE,KAAoB,EAAA;AACvE,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE,IAAI,IAAI,CAAC,6BAA6B,CAAC,KAAK,CAAC,EAAE;YAC9D;QACF;AAEA,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC9C,KAAK,CAAC,cAAc,EAAE;AACtB,YAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC;QAC3C;IACF;AAEU,IAAA,iBAAiB,CAAC,KAAY,EAAA;QACtC,KAAK,CAAC,eAAe,EAAE;IACzB;AAEQ,IAAA,6BAA6B,CAAC,KAAY,EAAA;AAChD,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM;AAE3B,QAAA,IAAI,EAAE,MAAM,YAAY,WAAW,CAAC,EAAE;AACpC,YAAA,OAAO,KAAK;QACd;QAEA,OAAO,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,0EAA0E,CAAC;IACrG;uGAjEW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,ojBACK,wBAAwB,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,aAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EACpB,gCAAgC,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECjCtE,84BAqBA,yqBDDI,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAWP,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAf5B,SAAS;+BACE,uBAAuB,EAAA,QAAA,EACvB,qBAAqB,EAAA,OAAA,EACtB;wBACP;qBACD,EAAA,eAAA,EAGgB,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,OAAO,EAAE,uBAAuB;AAChC,wBAAA,mBAAmB,EAAE,UAAU;AAC/B,wBAAA,MAAM,EAAE;AACT,qBAAA,EAAA,QAAA,EAAA,84BAAA,EAAA,MAAA,EAAA,CAAA,inBAAA,CAAA,EAAA;AAG+B,SAAA,CAAA,EAAA,cAAA,EAAA,EAAA,IAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,UAAA,CAAA,MAAA,wBAAwB,6FACpB,gCAAgC,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,eAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,QAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,iBAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;MElBzD,oBAAoB,CAAA;uGAApB,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAApB,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,2BAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,2BAAA,EAAA,EAAA,QAAA,EAAA,CAAA,yBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECfjC,yNAOA,EAAA,MAAA,EAAA,CAAA,8FAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDAI,QAAQ,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,aAAA,CAAA,EAAA,QAAA,EAAA,CAAA,aAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAQC,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAZhC,SAAS;+BACE,2BAA2B,EAAA,QAAA,EAC3B,yBAAyB,EAAA,OAAA,EAC1B;wBACP;qBACD,EAAA,IAAA,EAGK;AACJ,wBAAA,OAAO,EAAE,2BAA2B;AACrC,qBAAA,EAAA,QAAA,EAAA,yNAAA,EAAA,MAAA,EAAA,CAAA,8FAAA,CAAA,EAAA;;;MEAU,gBAAgB,CAAA;uGAAhB,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,+LCb7B,iBACA,EAAA,MAAA,EAAA,CAAA,yJAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FDYa,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAX5B,SAAS;+BACE,+CAA+C,EAAA,QAAA,EAC/C,qBAAqB,EAAA,OAAA,EACtB,EAAE,mBAGM,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,OAAO,EAAE;AACV,qBAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,yJAAA,CAAA,EAAA;;;MEEU,iBAAiB,CAAA;AACpB,IAAA,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;AAEvC,IAAA,IAAc,MAAM,GAAA;QAClB,OAAQ,IAAI,CAAC,UAAU,CAAC,aAA6B,CAAC,OAAO,KAAK,GAAG;IACvE;uGALW,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAjB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,0MCb9B,iBACA,EAAA,MAAA,EAAA,CAAA,mPAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FDYa,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAX7B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,iDAAiD,WAClD,EAAE,EAAA,eAAA,EAGM,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,OAAO,EAAE,wBAAwB;AACjC,wBAAA,iBAAiB,EAAE;AACpB,qBAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,mPAAA,CAAA,EAAA;;;MEEU,mBAAmB,CAAA;uGAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAnB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,gLCbhC,iBACA,EAAA,MAAA,EAAA,CAAA,+GAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FDYa,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAX/B,SAAS;+BACE,0BAA0B,EAAA,QAAA,EAC1B,wBAAwB,EAAA,OAAA,EACzB,EAAE,mBAGM,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,OAAO,EAAE;AACV,qBAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,+GAAA,CAAA,EAAA;;;MEGU,YAAY,CAAA;IACvB,QAAQ,GAAG,KAAK,CAAC,KAAK,gFACpB,SAAS,EAAE,gBAAgB,EAAA,CAC3B;uGAHS,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAZ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,0WCdzB,8aAYA,EAAA,MAAA,EAAA,CAAA,+4CAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FDEa,YAAY,EAAA,UAAA,EAAA,CAAA;kBAZxB,SAAS;+BACE,qCAAqC,EAAA,QAAA,EACrC,iBAAiB,EAAA,OAAA,EAClB,EAAE,mBAGM,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,OAAO,EAAE,kBAAkB;AAC3B,wBAAA,mBAAmB,EAAE;AACtB,qBAAA,EAAA,QAAA,EAAA,8aAAA,EAAA,MAAA,EAAA,CAAA,+4CAAA,CAAA,EAAA;;;MECU,mBAAmB,CAAA;uGAAnB,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAnB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,2MCbhC,iBACA,EAAA,MAAA,EAAA,CAAA,sPAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FDYa,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAX/B,SAAS;+BACE,qDAAqD,EAAA,QAAA,EACrD,wBAAwB,EAAA,OAAA,EACzB,EAAE,mBAGM,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC;AACJ,wBAAA,OAAO,EAAE;AACV,qBAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,CAAA,sPAAA,CAAA,EAAA;;;MEAU,0BAA0B,CAAA;IACrC,QAAQ,GAAG,KAAK,CAAC,KAAK,gFACpB,SAAS,EAAE,gBAAgB,EAAA,CAC3B;uGAHS,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAA1B,0BAA0B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,wBAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,EAAA,cAAA,EAAA,wBAAA,EAAA,EAAA,QAAA,EAAA,CAAA,sBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAA1B,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBATtC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,wBAAwB;AAClC,oBAAA,QAAQ,EAAE,sBAAsB;AAChC,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACJ,wBAAA,OAAO,EAAE,wBAAwB;AACjC,wBAAA,mBAAmB,EAAE,YAAY;AAClC;AACF,iBAAA;;;MCDY,2BAA2B,CAAA;uGAA3B,2BAA2B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAA3B,2BAA2B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,yBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,yBAAA,EAAA,EAAA,QAAA,EAAA,CAAA,uBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAA3B,2BAA2B,EAAA,UAAA,EAAA,CAAA;kBAPvC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,yBAAyB;AACnC,oBAAA,QAAQ,EAAE,uBAAuB;AACjC,oBAAA,IAAI,EAAE;AACJ,wBAAA,OAAO,EAAE;AACV;AACF,iBAAA;;;ACRD;;AAEG;;;;"}