npm - @ngneers/controls - Versions diffs - 0.0.1-pre5 → 0.0.1-pre7 - Mend

@ngneers/controls 0.0.1-pre5 → 0.0.1-pre7

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 (168) hide show

package/fesm2022/ngneers-controls-popover.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { output, model, input, booleanAttribute, contentChild, viewChild, computed, signal, inject, Injector, untracked, ChangeDetectionStrategy, Component } from '@angular/core';
+import { output, model, input, booleanAttribute, contentChild, viewChild, computed, signal, inject, Injector, ChangeDetectorRef, untracked, ChangeDetectionStrategy, Component } from '@angular/core';
 import { toPopoverCloseBy, autoPositionElement } from '@ngneers/controls/api/ng';
 import { NgnBase, NgnPt, provideSelf } from '@ngneers/controls/base';
 import { NgnDefer } from '@ngneers/controls/defer';
@@ -24,37 +24,38 @@ class NgnPopover extends NgnBase {
      *
      * You probably want to react to openChange events from outside to update your variable accordingly.
      */
-    open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
+    open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
     /**
      * The element to which the popover is anchored.
      */
-    anchor = input.required(...(ngDevMode ? [{ debugName: "anchor" }] : []));
+    anchor = input.required(...(ngDevMode ? [{ debugName: "anchor" }] : /* istanbul ignore next */ []));
     /**
      * The popover options.
      */
-    options = input(...(ngDevMode ? [undefined, { debugName: "options" }] : []));
+    options = input(...(ngDevMode ? [undefined, { debugName: "options" }] : /* istanbul ignore next */ []));
     /**
      * Set to true for scrollable/shrink-able content
      */
-    hasShrinkableContent = input(false, { ...(ngDevMode ? { debugName: "hasShrinkableContent" } : {}), transform: booleanAttribute });
+    hasShrinkableContent = input(false, { ...(ngDevMode ? { debugName: "hasShrinkableContent" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /**
      * How the drawer closes depending on user interaction.
      * @default 'any'
      */
-    closeBy = input('any', ...(ngDevMode ? [{ debugName: "closeBy" }] : []));
-    lazyContent = contentChild('lazy', ...(ngDevMode ? [{ debugName: "lazyContent" }] : []));
+    closeBy = input('any', ...(ngDevMode ? [{ debugName: "closeBy" }] : /* istanbul ignore next */ []));
+    lazyContent = contentChild('lazy', ...(ngDevMode ? [{ debugName: "lazyContent" }] : /* istanbul ignore next */ []));
     _content = viewChild.required('content');
-    closeByPopover = computed(() => toPopoverCloseBy(this.closeBy()), ...(ngDevMode ? [{ debugName: "closeByPopover" }] : []));
-    isFullyClosed = signal(true, ...(ngDevMode ? [{ debugName: "isFullyClosed" }] : []));
+    closeByPopover = computed(() => toPopoverCloseBy(this.closeBy()), ...(ngDevMode ? [{ debugName: "closeByPopover" }] : /* istanbul ignore next */ []));
+    isFullyClosed = signal(true, ...(ngDevMode ? [{ debugName: "isFullyClosed" }] : /* istanbul ignore next */ []));
     _skipEmitCloseEvent = false;
     _triggeredByInput = false;
     appliedOptions = computed(() => ({
         cache: false,
         ...this.options(),
-    }), ...(ngDevMode ? [{ debugName: "appliedOptions" }] : []));
+    }), ...(ngDevMode ? [{ debugName: "appliedOptions" }] : /* istanbul ignore next */ []));
     _injector = inject(Injector);
+    _cdr = inject(ChangeDetectorRef);
     _popoverRef = viewChild.required('popover');
-    _popover = computed(() => this._popoverRef().nativeElement, ...(ngDevMode ? [{ debugName: "_popover" }] : []));
+    _popover = computed(() => this._popoverRef().nativeElement, ...(ngDevMode ? [{ debugName: "_popover" }] : /* istanbul ignore next */ []));
     _autoPos = computedWithPrevious(prev => {
         prev?.stop();
         const popoverEl = this._popover();
@@ -92,8 +93,12 @@ class NgnPopover extends NgnBase {
                 return;
             }
             this._triggeredByInput = false;
-            this._autoPos()?.start();
-            this._popover().togglePopover(true);
+            this.isFullyClosed.set(false);
+            this._cdr.detectChanges();
+            requestAnimationFrame(() => {
+                this._autoPos()?.start();
+                this._popover().togglePopover(true);
+            });
         });
     }
     /**
@@ -151,10 +156,10 @@ class NgnPopover extends NgnBase {
             this.isFullyClosed.set(false);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgnPopover, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.0", type: NgnPopover, isStandalone: true, selector: "ngn-popover", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, anchor: { classPropertyName: "anchor", publicName: "anchor", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, hasShrinkableContent: { classPropertyName: "hasShrinkableContent", publicName: "hasShrinkableContent", isSignal: true, isRequired: false, transformFunction: null }, closeBy: { classPropertyName: "closeBy", publicName: "closeBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", closing: "closing", open: "openChange" }, host: { listeners: { "click": "$event.stopPropagation()" } }, providers: [provideSelf(NgnPopover)], queries: [{ propertyName: "lazyContent", first: true, predicate: ["lazy"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "_content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "_popoverRef", first: true, predicate: ["popover"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\r\n  [ptInt]=\"this\"\r\n  [ptClass]=\"'root'\"\r\n  #popover\r\n  [attr.popover]=\"closeByPopover()\"\r\n  (toggle)=\"onToggle($event)\"\r\n  [style.min-height]=\"\r\n    hasShrinkableContent()\r\n      ? (this.appliedOptions().sizeConstraints?.minHeight ?? null)\r\n      : 'fit-content'\r\n  \"\r\n>\r\n  <div\r\n    #content\r\n    [ptInt]=\"this\"\r\n    [ptClass]=\"{\r\n      content: true,\r\n      'content-closing': !this.open() && !this.isFullyClosed(),\r\n    }\"\r\n    [style.min-height]=\"hasShrinkableContent() ? null : 'fit-content'\"\r\n  >\r\n    <ngn-defer\r\n      [lazyContent]=\"lazyContent()\"\r\n      [open]=\"open() || !isFullyClosed()\"\r\n      [cache]=\"appliedOptions().cache\"\r\n    >\r\n      <ng-content></ng-content>\r\n    </ngn-defer>\r\n  </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass"] }, { kind: "component", type: NgnDefer, selector: "ngn-defer", inputs: ["lazyContent", "lazyContentContext", "open", "lazy", "cache", "hiddenOnClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnPopover, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.10", type: NgnPopover, isStandalone: true, selector: "ngn-popover", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, anchor: { classPropertyName: "anchor", publicName: "anchor", isSignal: true, isRequired: true, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, hasShrinkableContent: { classPropertyName: "hasShrinkableContent", publicName: "hasShrinkableContent", isSignal: true, isRequired: false, transformFunction: null }, closeBy: { classPropertyName: "closeBy", publicName: "closeBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", closing: "closing", open: "openChange" }, host: { listeners: { "click": "$event.stopPropagation()" } }, providers: [provideSelf(NgnPopover)], queries: [{ propertyName: "lazyContent", first: true, predicate: ["lazy"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "_content", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "_popoverRef", first: true, predicate: ["popover"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\r\n  [ptInt]=\"this\"\r\n  [ptClass]=\"'root'\"\r\n  #popover\r\n  [attr.popover]=\"closeByPopover()\"\r\n  (toggle)=\"onToggle($event)\"\r\n  [style.min-height]=\"\r\n    hasShrinkableContent()\r\n      ? (this.appliedOptions().sizeConstraints?.minHeight ?? null)\r\n      : 'fit-content'\r\n  \"\r\n>\r\n  <div\r\n    #content\r\n    [ptInt]=\"this\"\r\n    [ptClass]=\"{\r\n      content: true,\r\n      'content-closing': !this.open() && !this.isFullyClosed(),\r\n    }\"\r\n    [style.min-height]=\"hasShrinkableContent() ? null : 'fit-content'\"\r\n  >\r\n    <ngn-defer\r\n      [lazyContent]=\"lazyContent()\"\r\n      [open]=\"open() || !isFullyClosed()\"\r\n      [cache]=\"appliedOptions().cache\"\r\n    >\r\n      <ng-content></ng-content>\r\n    </ngn-defer>\r\n  </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass"] }, { kind: "component", type: NgnDefer, selector: "ngn-defer", inputs: ["lazyContent", "lazyContentContext", "open", "lazy", "cache", "hiddenOnClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgnPopover, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnPopover, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ngn-popover', imports: [NgnPt, NgnDefer], providers: [provideSelf(NgnPopover)], host: {
                         '(click)': '$event.stopPropagation()',

package/fesm2022/ngneers-controls-popover.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ngneers-controls-popover.mjs","sources":["../../src/popover/popover.ts","../../src/popover/popover.html","../../src/popover/ngneers-controls-popover.ts"],"sourcesContent":["import {\r\n booleanAttribute,\r\n Component,\r\n computed,\r\n contentChild,\r\n ElementRef,\r\n inject,\r\n Injector,\r\n input,\r\n model,\r\n output,\r\n signal,\r\n TemplateRef,\r\n untracked,\r\n viewChild,\r\n ChangeDetectionStrategy,\r\n} from '@angular/core';\r\nimport {\r\n type PopoverCloseBy,\r\n toPopoverCloseBy,\r\n autoPositionElement,\r\n type AutoPositioningHandle,\r\n type Openable,\r\n type Anchor,\r\n} from '@ngneers/controls/api/ng';\r\nimport { NgnBase, provideSelf, NgnPt } from '@ngneers/controls/base';\r\nimport { NgnDefer } from '@ngneers/controls/defer';\r\nimport { computedWithPrevious, explicitAfterRenderEffect } from '@ngneers/controls/utils-ng';\r\nimport { popoverControlTemplate } from '@ngneers/controls-themes/templates/popover';\r\n\r\nimport type { PopoverOptions } from './types';\r\n\r\n/*\r\n @category control\r\n /\r\n@Component({\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n selector: 'ngn-popover',\r\n templateUrl: './popover.html',\r\n imports: [NgnPt, NgnDefer],\r\n providers: [provideSelf(NgnPopover)],\r\n host: {\r\n '(click)': '$event.stopPropagation()',\r\n },\r\n})\r\nexport class NgnPopover extends NgnBase<'popover'> implements Openable {\r\n protected readonly theme = this.injectThemeTemplate(popoverControlTemplate);\r\n\r\n /\r\n Emits when the popover has fully closed.\r\n /\r\n public readonly closed = output();\r\n /\r\n Emits when the popover is closed.\r\n /\r\n public readonly closing = output();\r\n /\r\n Shows or hides the popover.\r\n \r\n You probably want to react to openChange events from outside to update your variable accordingly.\r\n /\r\n public readonly open = model<boolean>(false);\r\n /\r\n The element to which the popover is anchored.\r\n /\r\n public readonly anchor = input.required<Anchor>();\r\n /\r\n The popover options.\r\n /\r\n public readonly options = input<PopoverOptions>();\r\n /\r\n Set to true for scrollable/shrink-able content\r\n /\r\n public readonly hasShrinkableContent = input(false, { transform: booleanAttribute });\r\n /\r\n How the drawer closes depending on user interaction.\r\n * @default 'any'\r\n /\r\n public readonly closeBy = input<PopoverCloseBy>('any');\r\n\r\n protected readonly lazyContent = contentChild<TemplateRef<unknown>>('lazy');\r\n protected readonly _content = viewChild.required<ElementRef<HTMLElement>>('content');\r\n protected readonly closeByPopover = computed(() => toPopoverCloseBy(this.closeBy()));\r\n protected readonly isFullyClosed = signal(true);\r\n\r\n private _skipEmitCloseEvent = false;\r\n private _triggeredByInput = false;\r\n\r\n protected readonly appliedOptions = computed(() => ({\r\n cache: false,\r\n ...this.options(),\r\n }));\r\n\r\n private readonly _injector = inject(Injector);\r\n private readonly _popoverRef = viewChild.required<ElementRef<HTMLElement>>('popover');\r\n private readonly _popover = computed(() => this._popoverRef().nativeElement);\r\n private readonly _autoPos = computedWithPrevious<AutoPositioningHandle \| undefined>(prev => {\r\n prev?.stop();\r\n const popoverEl = this._popover();\r\n if (!popoverEl) {\r\n return undefined;\r\n }\r\n return autoPositionElement(this.anchor(), popoverEl, {\r\n injector: this._injector,\r\n stopped: true,\r\n sizeConstraints: this.appliedOptions()?.sizeConstraints,\r\n placement: this.appliedOptions()?.placement,\r\n offset: this.appliedOptions()?.padding,\r\n hasShrinkableContent: this.hasShrinkableContent(),\r\n });\r\n });\r\n\r\n constructor() {\r\n super();\r\n\r\n explicitAfterRenderEffect([this.open], ([open]) => {\r\n if (!open) {\r\n this._triggeredByInput = true;\r\n this.hide();\r\n }\r\n if (open) {\r\n this._triggeredByInput = true;\r\n this.show();\r\n }\r\n });\r\n }\r\n\r\n /\r\n Opens the drawer. Alternatively, you can also set the `open` input to `true`.\r\n /\r\n public show() {\r\n untracked(() => {\r\n if (this.open() && !this._triggeredByInput) {\r\n return;\r\n }\r\n this._triggeredByInput = false;\r\n this._autoPos()?.start();\r\n this._popover().togglePopover(true);\r\n });\r\n }\r\n\r\n /\r\n Closes the drawer. Alternatively, you can also set the `open` input to `false`.\r\n /\r\n public hide(emitCloseEvent = true) {\r\n untracked(() => {\r\n if (!this.open() && !this._triggeredByInput) {\r\n return;\r\n }\r\n this._triggeredByInput = false;\r\n this._skipEmitCloseEvent = !emitCloseEvent;\r\n this._autoPos()?.stop();\r\n this._popover().togglePopover(false);\r\n });\r\n }\r\n\r\n /\r\n Toggles the drawer open or closed. Alternatively, you can also set the `open` input accordingly.\r\n /\r\n public toggle() {\r\n if (untracked(this.open)) {\r\n this.hide();\r\n } else {\r\n this.show();\r\n }\r\n }\r\n\r\n protected onToggle(event: Event) {\r\n const evt = event as ToggleEvent;\r\n if (evt.newState === 'closed') {\r\n this.open.set(false);\r\n\r\n if (this._skipEmitCloseEvent) {\r\n this._skipEmitCloseEvent = false;\r\n } else {\r\n this.closing.emit();\r\n }\r\n this._autoPos()?.stop();\r\n\r\n requestAnimationFrame(() => {\r\n const allAnimationsDone = Promise.all(\r\n this._content()\r\n .nativeElement.getAnimations()\r\n .map(x => x.finished)\r\n );\r\n allAnimationsDone\r\n .then(() => {\r\n this.isFullyClosed.set(true);\r\n this.closed.emit();\r\n })\r\n .catch(() => {\r\n // ignore cancelled animation\r\n });\r\n });\r\n } else {\r\n this.open.set(true);\r\n this.isFullyClosed.set(false);\r\n }\r\n }\r\n}\r\n","<div\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'root'\"\r\n #popover\r\n [attr.popover]=\"closeByPopover()\"\r\n (toggle)=\"onToggle($event)\"\r\n [style.min-height]=\"\r\n hasShrinkableContent()\r\n ? (this.appliedOptions().sizeConstraints?.minHeight ?? null)\r\n : 'fit-content'\r\n \"\r\n>\r\n <div\r\n #content\r\n [ptInt]=\"this\"\r\n [ptClass]=\"{\r\n content: true,\r\n 'content-closing': !this.open() && !this.isFullyClosed(),\r\n }\"\r\n [style.min-height]=\"hasShrinkableContent() ? null : 'fit-content'\"\r\n >\r\n <ngn-defer\r\n [lazyContent]=\"lazyContent()\"\r\n [open]=\"open() \|\| !isFullyClosed()\"\r\n [cache]=\"appliedOptions().cache\"\r\n >\r\n <ng-content></ng-content>\r\n </ngn-defer>\r\n </div>\r\n</div>\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;;;;AAgCA;;AAEG;AAWG,MAAO,UAAW,SAAQ,OAAkB,CAAA;AAC7B,IAAA,KAAK,GAAG,IAAI,CAAC,mBAAmB,CAAC,sBAAsB,CAAC;AAE3E;;AAEG;IACa,MAAM,GAAG,MAAM,EAAE;AACjC;;AAEG;IACa,OAAO,GAAG,MAAM,EAAE;AAClC;;;;AAIG;AACa,IAAA,IAAI,GAAG,KAAK,CAAU,KAAK,gDAAC;AAC5C;;AAEG;AACa,IAAA,MAAM,GAAG,KAAK,CAAC,QAAQ,iDAAU;AACjD;;AAEG;IACa,OAAO,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,SAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAkB;AACjD;;AAEG;IACa,oBAAoB,GAAG,KAAK,CAAC,KAAK,iEAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AACpF;;;AAGG;AACa,IAAA,OAAO,GAAG,KAAK,CAAiB,KAAK,mDAAC;AAEnC,IAAA,WAAW,GAAG,YAAY,CAAuB,MAAM,uDAAC;AACxD,IAAA,QAAQ,GAAG,SAAS,CAAC,QAAQ,CAA0B,SAAS,CAAC;AACjE,IAAA,cAAc,GAAG,QAAQ,CAAC,MAAM,gBAAgB,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,0DAAC;AACjE,IAAA,aAAa,GAAG,MAAM,CAAC,IAAI,yDAAC;IAEvC,mBAAmB,GAAG,KAAK;IAC3B,iBAAiB,GAAG,KAAK;AAEd,IAAA,cAAc,GAAG,QAAQ,CAAC,OAAO;AAClD,QAAA,KAAK,EAAE,KAAK;QACZ,GAAG,IAAI,CAAC,OAAO,EAAE;AAClB,KAAA,CAAC,0DAAC;AAEc,IAAA,SAAS,GAAG,MAAM,CAAC,QAAQ,CAAC;AAC5B,IAAA,WAAW,GAAG,SAAS,CAAC,QAAQ,CAA0B,SAAS,CAAC;AACpE,IAAA,QAAQ,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,WAAW,EAAE,CAAC,aAAa,oDAAC;AAC3D,IAAA,QAAQ,GAAG,oBAAoB,CAAoC,IAAI,IAAG;QACzF,IAAI,EAAE,IAAI,EAAE;AACZ,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,EAAE;QACjC,IAAI,CAAC,SAAS,EAAE;AACd,YAAA,OAAO,SAAS;QAClB;QACA,OAAO,mBAAmB,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE;YACnD,QAAQ,EAAE,IAAI,CAAC,SAAS;AACxB,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,eAAe,EAAE,IAAI,CAAC,cAAc,EAAE,EAAE,eAAe;AACvD,YAAA,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,EAAE,SAAS;AAC3C,YAAA,MAAM,EAAE,IAAI,CAAC,cAAc,EAAE,EAAE,OAAO;AACtC,YAAA,oBAAoB,EAAE,IAAI,CAAC,oBAAoB,EAAE;AAClD,SAAA,CAAC;AACJ,IAAA,CAAC,CAAC;AAEF,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;AAEP,QAAA,yBAAyB,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,KAAI;YAChD,IAAI,CAAC,IAAI,EAAE;AACT,gBAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI;gBAC7B,IAAI,CAAC,IAAI,EAAE;YACb;YACA,IAAI,IAAI,EAAE;AACR,gBAAA,IAAI,CAAC,iBAAiB,GAAG,IAAI;gBAC7B,IAAI,CAAC,IAAI,EAAE;YACb;AACF,QAAA,CAAC,CAAC;IACJ;AAEA;;AAEG;IACI,IAAI,GAAA;QACT,SAAS,CAAC,MAAK;YACb,IAAI,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE;gBAC1C;YACF;AACA,YAAA,IAAI,CAAC,iBAAiB,GAAG,KAAK;AAC9B,YAAA,IAAI,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE;YACxB,IAAI,CAAC,QAAQ,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC;AACrC,QAAA,CAAC,CAAC;IACJ;AAEA;;AAEG;IACI,IAAI,CAAC,cAAc,GAAG,IAAI,EAAA;QAC/B,SAAS,CAAC,MAAK;YACb,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE;gBAC3C;YACF;AACA,YAAA,IAAI,CAAC,iBAAiB,GAAG,KAAK;AAC9B,YAAA,IAAI,CAAC,mBAAmB,GAAG,CAAC,cAAc;AAC1C,YAAA,IAAI,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE;YACvB,IAAI,CAAC,QAAQ,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC;AACtC,QAAA,CAAC,CAAC;IACJ;AAEA;;AAEG;IACI,MAAM,GAAA;AACX,QAAA,IAAI,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;YACxB,IAAI,CAAC,IAAI,EAAE;QACb;aAAO;YACL,IAAI,CAAC,IAAI,EAAE;QACb;IACF;AAEU,IAAA,QAAQ,CAAC,KAAY,EAAA;QAC7B,MAAM,GAAG,GAAG,KAAoB;AAChC,QAAA,IAAI,GAAG,CAAC,QAAQ,KAAK,QAAQ,EAAE;AAC7B,YAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC;AAEpB,YAAA,IAAI,IAAI,CAAC,mBAAmB,EAAE;AAC5B,gBAAA,IAAI,CAAC,mBAAmB,GAAG,KAAK;YAClC;iBAAO;AACL,gBAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;YACrB;AACA,YAAA,IAAI,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE;YAEvB,qBAAqB,CAAC,MAAK;gBACzB,MAAM,iBAAiB,GAAG,OAAO,CAAC,GAAG,CACnC,IAAI,CAAC,QAAQ;qBACV,aAAa,CAAC,aAAa;qBAC3B,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CACxB;gBACD;qBACG,IAAI,CAAC,MAAK;AACT,oBAAA,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC;AAC5B,oBAAA,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;AACpB,gBAAA,CAAC;qBACA,KAAK,CAAC,MAAK;;AAEZ,gBAAA,CAAC,CAAC;AACN,YAAA,CAAC,CAAC;QACJ;aAAO;AACL,YAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC;AACnB,YAAA,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC;QAC/B;IACF;uGAzJW,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAV,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAU,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,oBAAA,EAAA,EAAA,iBAAA,EAAA,sBAAA,EAAA,UAAA,EAAA,sBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,YAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,0BAAA,EAAA,EAAA,EAAA,SAAA,EALV,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,aAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,MAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,UAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,SAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,aAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,SAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECxCtC,qyBA8BA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDSY,KAAK,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,QAAQ,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,MAAA,EAAA,OAAA,EAAA,gBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAMd,UAAU,EAAA,UAAA,EAAA,CAAA;kBAVtB,SAAS;AACS,YAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,aAAa,WAEd,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAA,SAAA,EACf,CAAC,WAAW,CAAA,UAAA,CAAY,CAAC,EAAA,IAAA,EAC9B;AACJ,wBAAA,SAAS,EAAE,0BAA0B;AACtC,qBAAA,EAAA,QAAA,EAAA,qyBAAA,EAAA;4tBAqCmE,MAAM,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,CACA,SAAS,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,CAaR,SAAS,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AE9FtF;;AAEG;;;;"}
1	+ {"version":3,"file":"ngneers-controls-popover.mjs","sources":["../../src/popover/popover.ts","../../src/popover/popover.html","../../src/popover/ngneers-controls-popover.ts"],"sourcesContent":["import {\r\n booleanAttribute,\r\n ChangeDetectorRef,\r\n Component,\r\n computed,\r\n contentChild,\r\n ElementRef,\r\n inject,\r\n Injector,\r\n input,\r\n model,\r\n output,\r\n signal,\r\n TemplateRef,\r\n untracked,\r\n viewChild,\r\n ChangeDetectionStrategy,\r\n} from '@angular/core';\r\nimport {\r\n type PopoverCloseBy,\r\n toPopoverCloseBy,\r\n autoPositionElement,\r\n type AutoPositioningHandle,\r\n type Openable,\r\n type Anchor,\r\n} from '@ngneers/controls/api/ng';\r\nimport { NgnBase, provideSelf, NgnPt } from '@ngneers/controls/base';\r\nimport { NgnDefer } from '@ngneers/controls/defer';\r\nimport { computedWithPrevious, explicitAfterRenderEffect } from '@ngneers/controls/utils-ng';\r\nimport { popoverControlTemplate } from '@ngneers/controls-themes/templates/popover';\r\n\r\nimport type { PopoverOptions } from './types';\r\n\r\n/*\r\n @category control\r\n /\r\n@Component({\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n selector: 'ngn-popover',\r\n templateUrl: './popover.html',\r\n imports: [NgnPt, NgnDefer],\r\n providers: [provideSelf(NgnPopover)],\r\n host: {\r\n '(click)': '$event.stopPropagation()',\r\n },\r\n})\r\nexport class NgnPopover extends NgnBase<'popover'> implements Openable {\r\n protected readonly theme = this.injectThemeTemplate(popoverControlTemplate);\r\n\r\n /\r\n Emits when the popover has fully closed.\r\n /\r\n public readonly closed = output();\r\n /\r\n Emits when the popover is closed.\r\n /\r\n public readonly closing = output();\r\n /\r\n Shows or hides the popover.\r\n \r\n You probably want to react to openChange events from outside to update your variable accordingly.\r\n /\r\n public readonly open = model<boolean>(false);\r\n /\r\n The element to which the popover is anchored.\r\n /\r\n public readonly anchor = input.required<Anchor>();\r\n /\r\n The popover options.\r\n /\r\n public readonly options = input<PopoverOptions>();\r\n /\r\n Set to true for scrollable/shrink-able content\r\n /\r\n public readonly hasShrinkableContent = input(false, { transform: booleanAttribute });\r\n /\r\n How the drawer closes depending on user interaction.\r\n * @default 'any'\r\n /\r\n public readonly closeBy = input<PopoverCloseBy>('any');\r\n\r\n protected readonly lazyContent = contentChild<TemplateRef<unknown>>('lazy');\r\n protected readonly _content = viewChild.required<ElementRef<HTMLElement>>('content');\r\n protected readonly closeByPopover = computed(() => toPopoverCloseBy(this.closeBy()));\r\n protected readonly isFullyClosed = signal(true);\r\n\r\n private _skipEmitCloseEvent = false;\r\n private _triggeredByInput = false;\r\n\r\n protected readonly appliedOptions = computed(() => ({\r\n cache: false,\r\n ...this.options(),\r\n }));\r\n\r\n private readonly _injector = inject(Injector);\r\n private readonly _cdr = inject(ChangeDetectorRef);\r\n private readonly _popoverRef = viewChild.required<ElementRef<HTMLElement>>('popover');\r\n private readonly _popover = computed(() => this._popoverRef().nativeElement);\r\n private readonly _autoPos = computedWithPrevious<AutoPositioningHandle \| undefined>(prev => {\r\n prev?.stop();\r\n const popoverEl = this._popover();\r\n if (!popoverEl) {\r\n return undefined;\r\n }\r\n return autoPositionElement(this.anchor(), popoverEl, {\r\n injector: this._injector,\r\n stopped: true,\r\n sizeConstraints: this.appliedOptions()?.sizeConstraints,\r\n placement: this.appliedOptions()?.placement,\r\n offset: this.appliedOptions()?.padding,\r\n hasShrinkableContent: this.hasShrinkableContent(),\r\n });\r\n });\r\n\r\n constructor() {\r\n super();\r\n\r\n explicitAfterRenderEffect([this.open], ([open]) => {\r\n if (!open) {\r\n this._triggeredByInput = true;\r\n this.hide();\r\n }\r\n if (open) {\r\n this._triggeredByInput = true;\r\n this.show();\r\n }\r\n });\r\n }\r\n\r\n /\r\n Opens the drawer. Alternatively, you can also set the `open` input to `true`.\r\n /\r\n public show() {\r\n untracked(() => {\r\n if (this.open() && !this._triggeredByInput) {\r\n return;\r\n }\r\n this._triggeredByInput = false;\r\n this.isFullyClosed.set(false);\r\n this._cdr.detectChanges();\r\n requestAnimationFrame(() => {\r\n this._autoPos()?.start();\r\n this._popover().togglePopover(true);\r\n });\r\n });\r\n }\r\n\r\n /\r\n Closes the drawer. Alternatively, you can also set the `open` input to `false`.\r\n /\r\n public hide(emitCloseEvent = true) {\r\n untracked(() => {\r\n if (!this.open() && !this._triggeredByInput) {\r\n return;\r\n }\r\n this._triggeredByInput = false;\r\n this._skipEmitCloseEvent = !emitCloseEvent;\r\n this._autoPos()?.stop();\r\n this._popover().togglePopover(false);\r\n });\r\n }\r\n\r\n /\r\n Toggles the drawer open or closed. Alternatively, you can also set the `open` input accordingly.\r\n /\r\n public toggle() {\r\n if (untracked(this.open)) {\r\n this.hide();\r\n } else {\r\n this.show();\r\n }\r\n }\r\n\r\n protected onToggle(event: Event) {\r\n const evt = event as ToggleEvent;\r\n if (evt.newState === 'closed') {\r\n this.open.set(false);\r\n\r\n if (this._skipEmitCloseEvent) {\r\n this._skipEmitCloseEvent = false;\r\n } else {\r\n this.closing.emit();\r\n }\r\n this._autoPos()?.stop();\r\n\r\n requestAnimationFrame(() => {\r\n const allAnimationsDone = Promise.all(\r\n this._content()\r\n .nativeElement.getAnimations()\r\n .map(x => x.finished)\r\n );\r\n allAnimationsDone\r\n .then(() => {\r\n this.isFullyClosed.set(true);\r\n this.closed.emit();\r\n })\r\n .catch(() => {\r\n // ignore cancelled animation\r\n });\r\n });\r\n } else {\r\n this.open.set(true);\r\n this.isFullyClosed.set(false);\r\n }\r\n }\r\n}\r\n","<div\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'root'\"\r\n #popover\r\n [attr.popover]=\"closeByPopover()\"\r\n (toggle)=\"onToggle($event)\"\r\n [style.min-height]=\"\r\n hasShrinkableContent()\r\n ? (this.appliedOptions().sizeConstraints?.minHeight ?? null)\r\n : 'fit-content'\r\n \"\r\n>\r\n <div\r\n #content\r\n [ptInt]=\"this\"\r\n [ptClass]=\"{\r\n content: true,\r\n 'content-closing': !this.open() && !this.isFullyClosed(),\r\n }\"\r\n [style.min-height]=\"hasShrinkableContent() ? null : 'fit-content'\"\r\n >\r\n <ngn-defer\r\n [lazyContent]=\"lazyContent()\"\r\n [open]=\"open() \|\| !isFullyClosed()\"\r\n [cache]=\"appliedOptions().cache\"\r\n >\r\n <ng-content></ng-content>\r\n </ngn-defer>\r\n </div>\r\n</div>\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngneers-controls-progress.mjs CHANGED Viewed

@@ -16,32 +16,32 @@ class NgnProgress extends NgnBase {
     /**
      * The current progress value (0-100).
      */
-    value = input(0, ...(ngDevMode ? [{ debugName: "value" }] : []));
+    value = input(0, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
     /**
      * Whether the progress indicator is indeterminate.
      */
-    indeterminate = input(false, { ...(ngDevMode ? { debugName: "indeterminate" } : {}), transform: booleanAttribute });
+    indeterminate = input(false, { ...(ngDevMode ? { debugName: "indeterminate" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /**
      * Whether the progress indicator is circular.
      */
-    circular = input(false, { ...(ngDevMode ? { debugName: "circular" } : {}), transform: booleanAttribute });
+    circular = input(false, { ...(ngDevMode ? { debugName: "circular" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     /**
      * Radius of the circular progress indicator (in px).
      */
-    radius = input(40, ...(ngDevMode ? [{ debugName: "radius" }] : []));
+    radius = input(40, ...(ngDevMode ? [{ debugName: "radius" }] : /* istanbul ignore next */ []));
     /**
      * Thickness of the circular progress indicator stroke (in px).
      */
-    thickness = input(8, ...(ngDevMode ? [{ debugName: "thickness" }] : []));
-    safeValue = computed(() => Math.min(Math.max(this.value(), 0), 100), ...(ngDevMode ? [{ debugName: "safeValue" }] : []));
-    safeRadius = computed(() => Math.max(this.radius(), 0), ...(ngDevMode ? [{ debugName: "safeRadius" }] : []));
-    safeThickness = computed(() => Math.max(this.thickness(), 1), ...(ngDevMode ? [{ debugName: "safeThickness" }] : []));
+    thickness = input(8, ...(ngDevMode ? [{ debugName: "thickness" }] : /* istanbul ignore next */ []));
+    safeValue = computed(() => Math.min(Math.max(this.value(), 0), 100), ...(ngDevMode ? [{ debugName: "safeValue" }] : /* istanbul ignore next */ []));
+    safeRadius = computed(() => Math.max(this.radius(), 0), ...(ngDevMode ? [{ debugName: "safeRadius" }] : /* istanbul ignore next */ []));
+    safeThickness = computed(() => Math.max(this.thickness(), 1), ...(ngDevMode ? [{ debugName: "safeThickness" }] : /* istanbul ignore next */ []));
     svgSize = computed(() => {
         // Full size of the SVG in px.
         return this.safeRadius() * 2 + this.safeThickness();
-    }, ...(ngDevMode ? [{ debugName: "svgSize" }] : []));
-    svgCenter = computed(() => this.svgSize() / 2, ...(ngDevMode ? [{ debugName: "svgCenter" }] : []));
-    circumference = computed(() => TAU * this.safeRadius(), ...(ngDevMode ? [{ debugName: "circumference" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "svgSize" }] : /* istanbul ignore next */ []));
+    svgCenter = computed(() => this.svgSize() / 2, ...(ngDevMode ? [{ debugName: "svgCenter" }] : /* istanbul ignore next */ []));
+    circumference = computed(() => TAU * this.safeRadius(), ...(ngDevMode ? [{ debugName: "circumference" }] : /* istanbul ignore next */ []));
     strokeDasharray = computed(() => {
         const circumference = this.circumference();
         // Arc length for indeterminate mode.
@@ -49,21 +49,21 @@ class NgnProgress extends NgnBase {
             return `${circumference * 0.28} ${circumference}`;
         }
         return `${circumference}`;
-    }, ...(ngDevMode ? [{ debugName: "strokeDasharray" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "strokeDasharray" }] : /* istanbul ignore next */ []));
     strokeDashoffset = computed(() => {
         const circumference = this.circumference();
         if (this.indeterminate()) {
             return `${circumference * 0.72}`;
         }
         return `${circumference * (1 - this.safeValue() / 100)}`;
-    }, ...(ngDevMode ? [{ debugName: "strokeDashoffset" }] : []));
+    }, ...(ngDevMode ? [{ debugName: "strokeDashoffset" }] : /* istanbul ignore next */ []));
     constructor() {
         super();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgnProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: NgnProgress, isStandalone: true, selector: "ngn-progress", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, circular: { classPropertyName: "circular", publicName: "circular", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, thickness: { classPropertyName: "thickness", publicName: "thickness", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar" }, properties: { "attr.aria-valuemin": "0", "attr.aria-valuemax": "100", "attr.aria-valuenow": "indeterminate() ? null : safeValue()", "style.--progress.%": "indeterminate() ? null : safeValue()" } }, providers: [provideSelf(NgnProgress)], usesInheritance: true, ngImport: i0, template: "@if (circular()) {\r\n  <svg\r\n    [attr.width]=\"svgSize()\"\r\n    [attr.height]=\"svgSize()\"\r\n    [attr.viewBox]=\"'0 0 ' + svgSize() + ' ' + svgSize()\"\r\n    [ptInt]=\"this\"\r\n    [ptClass]=\"'svg'\"\r\n  >\r\n    <circle\r\n      [attr.cx]=\"svgCenter()\"\r\n      [attr.cy]=\"svgCenter()\"\r\n      [attr.r]=\"safeRadius()\"\r\n      [attr.stroke-width]=\"safeThickness()\"\r\n      fill=\"none\"\r\n      [ptInt]=\"this\"\r\n      [ptClass]=\"'track'\"\r\n    />\r\n    <circle\r\n      [attr.cx]=\"svgCenter()\"\r\n      [attr.cy]=\"svgCenter()\"\r\n      [attr.r]=\"safeRadius()\"\r\n      [attr.stroke-width]=\"safeThickness()\"\r\n      fill=\"none\"\r\n      [attr.stroke-dasharray]=\"strokeDasharray()\"\r\n      [attr.stroke-dashoffset]=\"strokeDashoffset()\"\r\n      [ptInt]=\"this\"\r\n      [ptClass]=\"'fill'\"\r\n    />\r\n  </svg>\r\n} @else {\r\n  <div [ptInt]=\"this\" [ptClass]=\"'track'\" [style.height.px]=\"safeThickness()\">\r\n    <div [ptInt]=\"this\" [ptClass]=\"'fill'\"></div>\r\n    @if (indeterminate()) {\r\n      <div [ptInt]=\"this\" [ptClass]=\"'fill2'\"></div>\r\n    }\r\n  </div>\r\n}\r\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: NgnProgress, isStandalone: true, selector: "ngn-progress", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, circular: { classPropertyName: "circular", publicName: "circular", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, thickness: { classPropertyName: "thickness", publicName: "thickness", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar" }, properties: { "attr.aria-valuemin": "0", "attr.aria-valuemax": "100", "attr.aria-valuenow": "indeterminate() ? null : safeValue()", "style.--progress.%": "indeterminate() ? null : safeValue()" } }, providers: [provideSelf(NgnProgress)], usesInheritance: true, ngImport: i0, template: "@if (circular()) {\r\n  <svg\r\n    [attr.width]=\"svgSize()\"\r\n    [attr.height]=\"svgSize()\"\r\n    [attr.viewBox]=\"'0 0 ' + svgSize() + ' ' + svgSize()\"\r\n    [ptInt]=\"this\"\r\n    [ptClass]=\"'svg'\"\r\n  >\r\n    <circle\r\n      [attr.cx]=\"svgCenter()\"\r\n      [attr.cy]=\"svgCenter()\"\r\n      [attr.r]=\"safeRadius()\"\r\n      [attr.stroke-width]=\"safeThickness()\"\r\n      fill=\"none\"\r\n      [ptInt]=\"this\"\r\n      [ptClass]=\"'track'\"\r\n    />\r\n    <circle\r\n      [attr.cx]=\"svgCenter()\"\r\n      [attr.cy]=\"svgCenter()\"\r\n      [attr.r]=\"safeRadius()\"\r\n      [attr.stroke-width]=\"safeThickness()\"\r\n      fill=\"none\"\r\n      [attr.stroke-dasharray]=\"strokeDasharray()\"\r\n      [attr.stroke-dashoffset]=\"strokeDashoffset()\"\r\n      [ptInt]=\"this\"\r\n      [ptClass]=\"'fill'\"\r\n    />\r\n  </svg>\r\n} @else {\r\n  <div [ptInt]=\"this\" [ptClass]=\"'track'\" [style.height.px]=\"safeThickness()\">\r\n    <div [ptInt]=\"this\" [ptClass]=\"'fill'\"></div>\r\n    @if (indeterminate()) {\r\n      <div [ptInt]=\"this\" [ptClass]=\"'fill2'\"></div>\r\n    }\r\n  </div>\r\n}\r\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: NgnProgress, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnProgress, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ngn-progress', imports: [NgnPt], providers: [provideSelf(NgnProgress)], host: {
                         role: 'progressbar',

package/fesm2022/ngneers-controls-progress.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ngneers-controls-progress.mjs","sources":["../../src/progress/progress.ts","../../src/progress/progress.html","../../src/progress/ngneers-controls-progress.ts"],"sourcesContent":["import {\r\n Component,\r\n input,\r\n ChangeDetectionStrategy,\r\n computed,\r\n booleanAttribute,\r\n} from '@angular/core';\r\nimport { NgnBase, NgnPt, provideSelf } from '@ngneers/controls/base';\r\nimport { progressControlTemplate } from '@ngneers/controls-themes/templates/progress';\r\n\r\nconst TAU = Math.PI * 2;\r\n\r\n/*\r\n @category control\r\n /\r\n@Component({\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n selector: 'ngn-progress',\r\n templateUrl: './progress.html',\r\n imports: [NgnPt],\r\n providers: [provideSelf(NgnProgress)],\r\n host: {\r\n role: 'progressbar',\r\n '[attr.aria-valuemin]': '0',\r\n '[attr.aria-valuemax]': '100',\r\n '[attr.aria-valuenow]': 'indeterminate() ? null : safeValue()',\r\n '[style.--progress.%]': 'indeterminate() ? null : safeValue()',\r\n },\r\n})\r\nexport class NgnProgress extends NgnBase<'progress'> {\r\n protected readonly theme = this.injectThemeTemplate(progressControlTemplate, {\r\n root: true,\r\n indeterminate: () => this.indeterminate(),\r\n circular: () => this.circular(),\r\n });\r\n\r\n /\r\n The current progress value (0-100).\r\n /\r\n public readonly value = input<number>(0);\r\n /\r\n Whether the progress indicator is indeterminate.\r\n /\r\n public readonly indeterminate = input(false, { transform: booleanAttribute });\r\n /\r\n Whether the progress indicator is circular.\r\n /\r\n public readonly circular = input(false, { transform: booleanAttribute });\r\n\r\n /\r\n Radius of the circular progress indicator (in px).\r\n /\r\n public readonly radius = input<number>(40);\r\n\r\n /\r\n Thickness of the circular progress indicator stroke (in px).\r\n /\r\n public readonly thickness = input<number>(8);\r\n\r\n protected readonly safeValue = computed(() => Math.min(Math.max(this.value(), 0), 100));\r\n\r\n protected readonly safeRadius = computed(() => Math.max(this.radius(), 0));\r\n protected readonly safeThickness = computed(() => Math.max(this.thickness(), 1));\r\n\r\n protected readonly svgSize = computed(() => {\r\n // Full size of the SVG in px.\r\n return this.safeRadius() 2 + this.safeThickness();\r\n });\r\n\r\n protected readonly svgCenter = computed(() => this.svgSize() / 2);\r\n\r\n protected readonly circumference = computed(() => TAU * this.safeRadius());\r\n\r\n protected readonly strokeDasharray = computed(() => {\r\n const circumference = this.circumference();\r\n // Arc length for indeterminate mode.\r\n if (this.indeterminate()) {\r\n return `${circumference * 0.28} ${circumference}`;\r\n }\r\n return `${circumference}`;\r\n });\r\n\r\n protected readonly strokeDashoffset = computed(() => {\r\n const circumference = this.circumference();\r\n if (this.indeterminate()) {\r\n return `${circumference * 0.72}`;\r\n }\r\n return `${circumference * (1 - this.safeValue() / 100)}`;\r\n });\r\n\r\n constructor() {\r\n super();\r\n }\r\n}\r\n","@if (circular()) {\r\n <svg\r\n [attr.width]=\"svgSize()\"\r\n [attr.height]=\"svgSize()\"\r\n [attr.viewBox]=\"'0 0 ' + svgSize() + ' ' + svgSize()\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'svg'\"\r\n >\r\n <circle\r\n [attr.cx]=\"svgCenter()\"\r\n [attr.cy]=\"svgCenter()\"\r\n [attr.r]=\"safeRadius()\"\r\n [attr.stroke-width]=\"safeThickness()\"\r\n fill=\"none\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'track'\"\r\n />\r\n <circle\r\n [attr.cx]=\"svgCenter()\"\r\n [attr.cy]=\"svgCenter()\"\r\n [attr.r]=\"safeRadius()\"\r\n [attr.stroke-width]=\"safeThickness()\"\r\n fill=\"none\"\r\n [attr.stroke-dasharray]=\"strokeDasharray()\"\r\n [attr.stroke-dashoffset]=\"strokeDashoffset()\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'fill'\"\r\n />\r\n </svg>\r\n} @else {\r\n <div [ptInt]=\"this\" [ptClass]=\"'track'\" [style.height.px]=\"safeThickness()\">\r\n <div [ptInt]=\"this\" [ptClass]=\"'fill'\"></div>\r\n @if (indeterminate()) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'fill2'\"></div>\r\n }\r\n </div>\r\n}\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;AAUA,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC;AAEvB;;AAEG;AAeG,MAAO,WAAY,SAAQ,OAAmB,CAAA;AAC/B,IAAA,KAAK,GAAG,IAAI,CAAC,mBAAmB,CAAC,uBAAuB,EAAE;AAC3E,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,aAAa,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE;AACzC,QAAA,QAAQ,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE;AAChC,KAAA,CAAC;AAEF;;AAEG;AACa,IAAA,KAAK,GAAG,KAAK,CAAS,CAAC,~~iDAAC~~;AACxC;;AAEG;IACa,aAAa,GAAG,KAAK,CAAC,KAAK,~~0DAAI~~,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAC7E;;AAEG;IACa,QAAQ,GAAG,KAAK,CAAC,KAAK,~~qDAAI~~,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAExE;;AAEG;AACa,IAAA,MAAM,GAAG,KAAK,CAAS,EAAE,~~kDAAC~~;AAE1C;;AAEG;AACa,IAAA,SAAS,GAAG,KAAK,CAAS,CAAC,~~qDAAC~~;IAEzB,SAAS,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,WAAA,EAAA,CAAA,~~GAAA~~,EAAA,CAAA,CAAC;AAEpE,IAAA,UAAU,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,~~sDAAC~~;AACvD,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,~~yDAAC~~;AAE7D,IAAA,OAAO,GAAG,QAAQ,CAAC,MAAK;;QAEzC,OAAO,IAAI,CAAC,UAAU,EAAE,GAAG,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE;AACrD,IAAA,CAAC,~~mDAAC~~;AAEiB,IAAA,SAAS,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,~~qDAAC~~;AAE9C,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,UAAU,EAAE,~~yDAAC~~;AAEvD,IAAA,eAAe,GAAG,QAAQ,CAAC,MAAK;AACjD,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,aAAa,EAAE;;AAE1C,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE,EAAE;AACxB,YAAA,OAAO,GAAG,aAAa,GAAG,IAAI,CAAA,CAAA,EAAI,aAAa,EAAE;QACnD;QACA,OAAO,CAAA,EAAG,aAAa,CAAA,CAAE;AAC3B,IAAA,CAAC,~~2DAAC~~;AAEiB,IAAA,gBAAgB,GAAG,QAAQ,CAAC,MAAK;AAClD,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,aAAa,EAAE;AAC1C,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE,EAAE;AACxB,YAAA,OAAO,CAAA,EAAG,aAAa,GAAG,IAAI,EAAE;QAClC;AACA,QAAA,OAAO,CAAA,EAAG,aAAa,IAAI,CAAC,GAAG,IAAI,CAAC,SAAS,EAAE,GAAG,GAAG,CAAC,EAAE;AAC1D,IAAA,CAAC,~~4DAAC~~;AAEF,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;IACT;~~uGA~~/DW,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;~~2FAAX~~,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,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,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,aAAA,EAAA,EAAA,UAAA,EAAA,EAAA,oBAAA,EAAA,GAAA,EAAA,oBAAA,EAAA,KAAA,EAAA,oBAAA,EAAA,sCAAA,EAAA,oBAAA,EAAA,sCAAA,EAAA,EAAA,EAAA,SAAA,EATX,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECpBvC,onCAqCA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDlBY,KAAK,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;~~2FAUJ~~,WAAW,EAAA,UAAA,EAAA,CAAA;kBAdvB,SAAS;AACS,YAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,cAAc,EAAA,OAAA,EAEf,CAAC,KAAK,CAAC,EAAA,SAAA,EACL,CAAC,WAAW,CAAA,WAAA,CAAa,CAAC,EAAA,IAAA,EAC/B;AACJ,wBAAA,IAAI,EAAE,aAAa;AACnB,wBAAA,sBAAsB,EAAE,GAAG;AAC3B,wBAAA,sBAAsB,EAAE,KAAK;AAC7B,wBAAA,sBAAsB,EAAE,sCAAsC;AAC9D,wBAAA,sBAAsB,EAAE,sCAAsC;AAC/D,qBAAA,EAAA,QAAA,EAAA,onCAAA,EAAA;;;AE3BH;;AAEG;;;;"}
1	+ {"version":3,"file":"ngneers-controls-progress.mjs","sources":["../../src/progress/progress.ts","../../src/progress/progress.html","../../src/progress/ngneers-controls-progress.ts"],"sourcesContent":["import {\r\n Component,\r\n input,\r\n ChangeDetectionStrategy,\r\n computed,\r\n booleanAttribute,\r\n} from '@angular/core';\r\nimport { NgnBase, NgnPt, provideSelf } from '@ngneers/controls/base';\r\nimport { progressControlTemplate } from '@ngneers/controls-themes/templates/progress';\r\n\r\nconst TAU = Math.PI * 2;\r\n\r\n/*\r\n @category control\r\n /\r\n@Component({\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n selector: 'ngn-progress',\r\n templateUrl: './progress.html',\r\n imports: [NgnPt],\r\n providers: [provideSelf(NgnProgress)],\r\n host: {\r\n role: 'progressbar',\r\n '[attr.aria-valuemin]': '0',\r\n '[attr.aria-valuemax]': '100',\r\n '[attr.aria-valuenow]': 'indeterminate() ? null : safeValue()',\r\n '[style.--progress.%]': 'indeterminate() ? null : safeValue()',\r\n },\r\n})\r\nexport class NgnProgress extends NgnBase<'progress'> {\r\n protected readonly theme = this.injectThemeTemplate(progressControlTemplate, {\r\n root: true,\r\n indeterminate: () => this.indeterminate(),\r\n circular: () => this.circular(),\r\n });\r\n\r\n /\r\n The current progress value (0-100).\r\n /\r\n public readonly value = input<number>(0);\r\n /\r\n Whether the progress indicator is indeterminate.\r\n /\r\n public readonly indeterminate = input(false, { transform: booleanAttribute });\r\n /\r\n Whether the progress indicator is circular.\r\n /\r\n public readonly circular = input(false, { transform: booleanAttribute });\r\n\r\n /\r\n Radius of the circular progress indicator (in px).\r\n /\r\n public readonly radius = input<number>(40);\r\n\r\n /\r\n Thickness of the circular progress indicator stroke (in px).\r\n /\r\n public readonly thickness = input<number>(8);\r\n\r\n protected readonly safeValue = computed(() => Math.min(Math.max(this.value(), 0), 100));\r\n\r\n protected readonly safeRadius = computed(() => Math.max(this.radius(), 0));\r\n protected readonly safeThickness = computed(() => Math.max(this.thickness(), 1));\r\n\r\n protected readonly svgSize = computed(() => {\r\n // Full size of the SVG in px.\r\n return this.safeRadius() 2 + this.safeThickness();\r\n });\r\n\r\n protected readonly svgCenter = computed(() => this.svgSize() / 2);\r\n\r\n protected readonly circumference = computed(() => TAU * this.safeRadius());\r\n\r\n protected readonly strokeDasharray = computed(() => {\r\n const circumference = this.circumference();\r\n // Arc length for indeterminate mode.\r\n if (this.indeterminate()) {\r\n return `${circumference * 0.28} ${circumference}`;\r\n }\r\n return `${circumference}`;\r\n });\r\n\r\n protected readonly strokeDashoffset = computed(() => {\r\n const circumference = this.circumference();\r\n if (this.indeterminate()) {\r\n return `${circumference * 0.72}`;\r\n }\r\n return `${circumference * (1 - this.safeValue() / 100)}`;\r\n });\r\n\r\n constructor() {\r\n super();\r\n }\r\n}\r\n","@if (circular()) {\r\n <svg\r\n [attr.width]=\"svgSize()\"\r\n [attr.height]=\"svgSize()\"\r\n [attr.viewBox]=\"'0 0 ' + svgSize() + ' ' + svgSize()\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'svg'\"\r\n >\r\n <circle\r\n [attr.cx]=\"svgCenter()\"\r\n [attr.cy]=\"svgCenter()\"\r\n [attr.r]=\"safeRadius()\"\r\n [attr.stroke-width]=\"safeThickness()\"\r\n fill=\"none\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'track'\"\r\n />\r\n <circle\r\n [attr.cx]=\"svgCenter()\"\r\n [attr.cy]=\"svgCenter()\"\r\n [attr.r]=\"safeRadius()\"\r\n [attr.stroke-width]=\"safeThickness()\"\r\n fill=\"none\"\r\n [attr.stroke-dasharray]=\"strokeDasharray()\"\r\n [attr.stroke-dashoffset]=\"strokeDashoffset()\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'fill'\"\r\n />\r\n </svg>\r\n} @else {\r\n <div [ptInt]=\"this\" [ptClass]=\"'track'\" [style.height.px]=\"safeThickness()\">\r\n <div [ptInt]=\"this\" [ptClass]=\"'fill'\"></div>\r\n @if (indeterminate()) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'fill2'\"></div>\r\n }\r\n </div>\r\n}\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngneers-controls-scroll-shadow.mjs ADDED Viewed

@@ -0,0 +1,54 @@
+import * as i0 from '@angular/core';
+import { inject, ElementRef, Injector, input, afterNextRender, Directive } from '@angular/core';
+import { scrollShadowDirectiveTemplate } from '@ngneers/controls-themes/templates/api';
+import { injectThemeTemplate, abortSignalOnDestroy } from '@ngneers/controls/api/ng';
+import { toggleClass } from '@ngneers/controls/utils';
+class NgnScrollShadow {
+    theme = injectThemeTemplate(scrollShadowDirectiveTemplate);
+    _el = inject(ElementRef);
+    _injector = inject(Injector);
+    ngnScrollShadow = input('horizontal', ...(ngDevMode ? [{ debugName: "ngnScrollShadow" }] : /* istanbul ignore next */ []));
+    scrollShadowTarget = input(undefined, ...(ngDevMode ? [{ debugName: "scrollShadowTarget" }] : /* istanbul ignore next */ []));
+    constructor() {
+        afterNextRender(() => {
+            const scrollEl = this._el.nativeElement;
+            const abort = abortSignalOnDestroy({ injector: this._injector });
+            const update = () => {
+                const target = this.scrollShadowTarget() ?? scrollEl;
+                const dir = this.ngnScrollShadow();
+                if (dir === 'horizontal' || dir === 'both') {
+                    const sl = scrollEl.scrollLeft;
+                    const maxH = scrollEl.scrollWidth - scrollEl.clientWidth;
+                    toggleClass(target, this.theme.class('scrolled-start'), sl > 0);
+                    toggleClass(target, this.theme.class('scrolled-end'), maxH > 0 && sl < maxH - 1);
+                }
+                if (dir === 'vertical' || dir === 'both') {
+                    const st = scrollEl.scrollTop;
+                    const maxV = scrollEl.scrollHeight - scrollEl.clientHeight;
+                    toggleClass(target, this.theme.class('scrolled-top'), st > 0);
+                    toggleClass(target, this.theme.class('scrolled-bottom'), maxV > 0 && st < maxV - 1);
+                }
+            };
+            const ro = new ResizeObserver(update);
+            ro.observe(scrollEl);
+            abort.addEventListener('abort', () => ro.disconnect());
+            scrollEl.addEventListener('scroll', update, { passive: true, signal: abort });
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnScrollShadow, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.10", type: NgnScrollShadow, isStandalone: true, selector: "[ngnScrollShadow]", inputs: { ngnScrollShadow: { classPropertyName: "ngnScrollShadow", publicName: "ngnScrollShadow", isSignal: true, isRequired: false, transformFunction: null }, scrollShadowTarget: { classPropertyName: "scrollShadowTarget", publicName: "scrollShadowTarget", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnScrollShadow, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ngnScrollShadow]',
+                }]
+        }], ctorParameters: () => [], propDecorators: { ngnScrollShadow: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngnScrollShadow", required: false }] }], scrollShadowTarget: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollShadowTarget", required: false }] }] } });
+/**
+ * Generated bundle index. Do not edit.
+ */
+export { NgnScrollShadow };
+//# sourceMappingURL=ngneers-controls-scroll-shadow.mjs.map

package/fesm2022/ngneers-controls-scroll-shadow.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ngneers-controls-scroll-shadow.mjs","sources":["../../src/scroll-shadow/scroll-shadow.ts","../../src/scroll-shadow/ngneers-controls-scroll-shadow.ts"],"sourcesContent":["import { afterNextRender, Directive, ElementRef, inject, Injector, input } from '@angular/core';\r\nimport { scrollShadowDirectiveTemplate } from '@ngneers/controls-themes/templates/api';\r\n\r\nimport { abortSignalOnDestroy, injectThemeTemplate } from '@ngneers/controls/api/ng';\r\nimport { toggleClass } from '@ngneers/controls/utils';\r\n\r\n@Directive({\r\n selector: '[ngnScrollShadow]',\r\n})\r\nexport class NgnScrollShadow {\r\n protected readonly theme = injectThemeTemplate(scrollShadowDirectiveTemplate);\r\n private readonly _el = inject<ElementRef<HTMLElement>>(ElementRef);\r\n private readonly _injector = inject(Injector);\r\n\r\n public readonly ngnScrollShadow = input<'horizontal' | 'vertical' | 'both'>('horizontal');\r\n\r\n public readonly scrollShadowTarget = input<HTMLElement | undefined>(undefined);\r\n\r\n constructor() {\r\n afterNextRender(() => {\r\n const scrollEl = this._el.nativeElement;\r\n const abort = abortSignalOnDestroy({ injector: this._injector });\r\n\r\n const update = () => {\r\n const target = this.scrollShadowTarget() ?? scrollEl;\r\n const dir = this.ngnScrollShadow();\r\n\r\n if (dir === 'horizontal' || dir === 'both') {\r\n const sl = scrollEl.scrollLeft;\r\n const maxH = scrollEl.scrollWidth - scrollEl.clientWidth;\r\n toggleClass(target, this.theme.class('scrolled-start'), sl > 0);\r\n toggleClass(target, this.theme.class('scrolled-end'), maxH > 0 && sl < maxH - 1);\r\n }\r\n\r\n if (dir === 'vertical' || dir === 'both') {\r\n const st = scrollEl.scrollTop;\r\n const maxV = scrollEl.scrollHeight - scrollEl.clientHeight;\r\n toggleClass(target, this.theme.class('scrolled-top'), st > 0);\r\n toggleClass(target, this.theme.class('scrolled-bottom'), maxV > 0 && st < maxV - 1);\r\n }\r\n };\r\n\r\n const ro = new ResizeObserver(update);\r\n ro.observe(scrollEl);\r\n abort.addEventListener('abort', () => ro.disconnect());\r\n scrollEl.addEventListener('scroll', update, { passive: true, signal: abort });\r\n });\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}