ngwr 14.0.0 → 14.0.1

package/fesm2022/ngwr-color-picker.mjs

@@ -798,10 +798,10 @@ class WrColorPicker {
         this.a.set(hsv.a);
         this.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrColorPicker, isStandalone: true, selector: "wr-color-picker", inputs: { alpha: { classPropertyName: "alpha", publicName: "alpha", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touch: "touch" }, host: { properties: { "class": "classes()", "style.--wr-color-picker-hue": "hueCss()", "style.--wr-color-picker-rgb": "rgbCss()" } }, providers: [{ provide: WR_FORM_FIELD, useValue: null }], ngImport: i0, template: "<!--\n  `role=\"group\"` rather than `role=\"slider\"`, because this surface holds TWO\n  values and a slider has one `aria-valuenow`; and rather than\n  `role=\"application\"`, which would switch the reader out of its own browse mode\n  for the whole subtree \u2014 the call `wr-image-cropper` already made. A group has\n  no value of its own, so the two percentages ride in its accessible name, which\n  is where a reader querying the focused element finds them.\n-->\n<div\n  class=\"wr-color-picker__sv\"\n  role=\"group\"\n  [attr.aria-label]=\"resolvedAreaLabel()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n  [attr.aria-describedby]=\"fieldAria.describedBy()\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event, 'sv')\"\n  (keydown)=\"onAreaKeydown($event)\"\n  (blur)=\"onSurfaceBlur()\"\n>\n  <span class=\"wr-color-picker__thumb\" [style.left.%]=\"svThumbX()\" [style.top.%]=\"svThumbY()\"></span>\n</div>\n\n<div\n  class=\"wr-color-picker__slider wr-color-picker__slider--hue\"\n  role=\"slider\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"360\"\n  [attr.aria-label]=\"resolvedHueLabel()\"\n  [attr.aria-valuenow]=\"hueValue()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-readonly]=\"readonly() || null\"\n  [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n  [attr.aria-describedby]=\"fieldAria.describedBy()\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event, 'hue')\"\n  (keydown)=\"onSliderKeydown($event, 'hue')\"\n  (blur)=\"onSurfaceBlur()\"\n>\n  <!--\n    `inset-inline-start`, not `left`: this is a one-value track, so it mirrors\n    under `dir=\"rtl\"` the way `wr-slider` does. The SV thumb above keeps `left` \u2014\n    the canvas is a picture and does not flip.\n  -->\n  <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.inset-inline-start.%]=\"hueThumbX()\"></span>\n</div>\n\n@if (alpha()) {\n  <div\n    class=\"wr-color-picker__slider wr-color-picker__slider--alpha\"\n    role=\"slider\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-label]=\"resolvedAlphaLabel()\"\n    [attr.aria-valuenow]=\"alphaPercent()\"\n    [attr.aria-valuetext]=\"`${alphaPercent()}%`\"\n    [attr.aria-disabled]=\"disabled() || null\"\n    [attr.aria-readonly]=\"readonly() || null\"\n    [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n    [attr.aria-describedby]=\"fieldAria.describedBy()\"\n    [attr.tabindex]=\"disabled() ? -1 : 0\"\n    (pointerdown)=\"onPointerDown($event, 'alpha')\"\n    (keydown)=\"onSliderKeydown($event, 'alpha')\"\n    (blur)=\"onSurfaceBlur()\"\n  >\n    <span\n      class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\"\n      [style.inset-inline-start.%]=\"alphaThumbX()\"\n    ></span>\n  </div>\n}\n\n<div class=\"wr-color-picker__chrome\">\n  <span class=\"wr-color-picker__preview\" [style.background]=\"hex()\"></span>\n  <wr-segmented\n    class=\"wr-color-picker__tabs\"\n    [options]=\"tabOptions()\"\n    [value]=\"activeTab()\"\n    (valueChange)=\"onTabChange($event)\"\n  />\n</div>\n\n@switch (activeTab()) {\n  @case ('hex') {\n    <div class=\"wr-color-picker__inputs wr-color-picker__inputs--hex\">\n      <label class=\"wr-color-picker__field wr-color-picker__field--wide\">\n        <input\n          type=\"text\"\n          spellcheck=\"false\"\n          autocomplete=\"off\"\n          [value]=\"hexInput()\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onHexInput($event)\"\n          (blur)=\"onHexBlur()\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelHexLabel() }}</span>\n      </label>\n    </div>\n  }\n  @case ('rgb') {\n    <div class=\"wr-color-picker__inputs\">\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"255\"\n          [value]=\"rgb().r\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onRgbChannel('r', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelRedLabel() }}</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"255\"\n          [value]=\"rgb().g\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onRgbChannel('g', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelGreenLabel() }}</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"255\"\n          [value]=\"rgb().b\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onRgbChannel('b', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelBlueLabel() }}</span>\n      </label>\n      @if (alpha()) {\n        <label class=\"wr-color-picker__field\">\n          <input\n            type=\"number\"\n            min=\"0\"\n            max=\"100\"\n            [value]=\"alphaPercent()\"\n            [disabled]=\"disabled()\"\n            [readonly]=\"readonly()\"\n            (input)=\"onAlphaPercent($event)\"\n          />\n          <span class=\"wr-color-picker__field-label\">{{ channelAlphaLabel() }}</span>\n        </label>\n      }\n    </div>\n  }\n  @case ('hsl') {\n    <div class=\"wr-color-picker__inputs\">\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"360\"\n          [value]=\"hslView().h | number: '1.0-0'\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onHslChannel('h', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelHueLabel() }}</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"100\"\n          [value]=\"hslView().s * 100 | number: '1.0-0'\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onHslChannel('s', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelSaturationLabel() }}</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"100\"\n          [value]=\"hslView().l * 100 | number: '1.0-0'\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onHslChannel('l', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelLightnessLabel() }}</span>\n      </label>\n      @if (alpha()) {\n        <label class=\"wr-color-picker__field\">\n          <input\n            type=\"number\"\n            min=\"0\"\n            max=\"100\"\n            [value]=\"alphaPercent()\"\n            [disabled]=\"disabled()\"\n            [readonly]=\"readonly()\"\n            (input)=\"onAlphaPercent($event)\"\n          />\n          <span class=\"wr-color-picker__field-label\">{{ channelAlphaLabel() }}</span>\n        </label>\n      }\n    </div>\n  }\n}\n\n@if (swatches().length > 0) {\n  <div class=\"wr-color-picker__swatches\">\n    @for (color of swatches(); track color) {\n      <button\n        type=\"button\"\n        class=\"wr-color-picker__swatch\"\n        [style.background]=\"color\"\n        [attr.aria-label]=\"color\"\n        [disabled]=\"disabled() || readonly()\"\n        (click)=\"onSwatchClick(color)\"\n      ></button>\n    }\n  </div>\n}\n", dependencies: [{ kind: "component", type: WrSegmented, selector: "wr-segmented", inputs: ["options", "value", "disabled", "readonly", "size"], outputs: ["valueChange", "touch"] }, { kind: "pipe", type: DecimalPipe, name: "number" }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrColorPicker, isStandalone: true, selector: "wr-color-picker", inputs: { alpha: { classPropertyName: "alpha", publicName: "alpha", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touch: "touch" }, host: { properties: { "class": "classes()", "style.--wr-color-picker-hue": "hueCss()", "style.--wr-color-picker-rgb": "rgbCss()" } }, providers: [{ provide: WR_FORM_FIELD, useValue: null }], ngImport: i0, template: "<!--\n  `role=\"group\"` rather than `role=\"slider\"`, because this surface holds TWO\n  values and a slider has one `aria-valuenow`; and rather than\n  `role=\"application\"`, which would switch the reader out of its own browse mode\n  for the whole subtree \u2014 the call `wr-image-cropper` already made. A group has\n  no value of its own, so the two percentages ride in its accessible name, which\n  is where a reader querying the focused element finds them.\n-->\n<div\n  class=\"wr-color-picker__sv\"\n  role=\"group\"\n  [attr.aria-label]=\"resolvedAreaLabel()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n  [attr.aria-describedby]=\"fieldAria.describedBy()\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event, 'sv')\"\n  (keydown)=\"onAreaKeydown($event)\"\n  (blur)=\"onSurfaceBlur()\"\n>\n  <span class=\"wr-color-picker__thumb\" [style.left.%]=\"svThumbX()\" [style.top.%]=\"svThumbY()\"></span>\n</div>\n\n<div\n  class=\"wr-color-picker__slider wr-color-picker__slider--hue\"\n  role=\"slider\"\n  aria-valuemin=\"0\"\n  aria-valuemax=\"360\"\n  [attr.aria-label]=\"resolvedHueLabel()\"\n  [attr.aria-valuenow]=\"hueValue()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.aria-readonly]=\"readonly() || null\"\n  [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n  [attr.aria-describedby]=\"fieldAria.describedBy()\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event, 'hue')\"\n  (keydown)=\"onSliderKeydown($event, 'hue')\"\n  (blur)=\"onSurfaceBlur()\"\n>\n  <!--\n    `inset-inline-start`, not `left`: this is a one-value track, so it mirrors\n    under `dir=\"rtl\"` the way `wr-slider` does. The SV thumb above keeps `left` \u2014\n    the canvas is a picture and does not flip.\n  -->\n  <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.inset-inline-start.%]=\"hueThumbX()\"></span>\n</div>\n\n@if (alpha()) {\n  <div\n    class=\"wr-color-picker__slider wr-color-picker__slider--alpha\"\n    role=\"slider\"\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n    [attr.aria-label]=\"resolvedAlphaLabel()\"\n    [attr.aria-valuenow]=\"alphaPercent()\"\n    [attr.aria-valuetext]=\"`${alphaPercent()}%`\"\n    [attr.aria-disabled]=\"disabled() || null\"\n    [attr.aria-readonly]=\"readonly() || null\"\n    [attr.aria-invalid]=\"fieldAria.ariaInvalid()\"\n    [attr.aria-describedby]=\"fieldAria.describedBy()\"\n    [attr.tabindex]=\"disabled() ? -1 : 0\"\n    (pointerdown)=\"onPointerDown($event, 'alpha')\"\n    (keydown)=\"onSliderKeydown($event, 'alpha')\"\n    (blur)=\"onSurfaceBlur()\"\n  >\n    <span\n      class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\"\n      [style.inset-inline-start.%]=\"alphaThumbX()\"\n    ></span>\n  </div>\n}\n\n<div class=\"wr-color-picker__chrome\">\n  <span class=\"wr-color-picker__preview\" [style.background]=\"hex()\"></span>\n  <wr-segmented\n    class=\"wr-color-picker__tabs\"\n    [options]=\"tabOptions()\"\n    [value]=\"activeTab()\"\n    (valueChange)=\"onTabChange($event)\"\n  />\n</div>\n\n@switch (activeTab()) {\n  @case ('hex') {\n    <div class=\"wr-color-picker__inputs wr-color-picker__inputs--hex\">\n      <label class=\"wr-color-picker__field wr-color-picker__field--wide\">\n        <input\n          type=\"text\"\n          spellcheck=\"false\"\n          autocomplete=\"off\"\n          [value]=\"hexInput()\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onHexInput($event)\"\n          (blur)=\"onHexBlur()\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelHexLabel() }}</span>\n      </label>\n    </div>\n  }\n  @case ('rgb') {\n    <div class=\"wr-color-picker__inputs\">\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"255\"\n          [value]=\"rgb().r\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onRgbChannel('r', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelRedLabel() }}</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"255\"\n          [value]=\"rgb().g\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onRgbChannel('g', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelGreenLabel() }}</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"255\"\n          [value]=\"rgb().b\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onRgbChannel('b', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelBlueLabel() }}</span>\n      </label>\n      @if (alpha()) {\n        <label class=\"wr-color-picker__field\">\n          <input\n            type=\"number\"\n            min=\"0\"\n            max=\"100\"\n            [value]=\"alphaPercent()\"\n            [disabled]=\"disabled()\"\n            [readonly]=\"readonly()\"\n            (input)=\"onAlphaPercent($event)\"\n          />\n          <span class=\"wr-color-picker__field-label\">{{ channelAlphaLabel() }}</span>\n        </label>\n      }\n    </div>\n  }\n  @case ('hsl') {\n    <div class=\"wr-color-picker__inputs\">\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"360\"\n          [value]=\"hslView().h | number: '1.0-0'\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onHslChannel('h', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelHueLabel() }}</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"100\"\n          [value]=\"hslView().s * 100 | number: '1.0-0'\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onHslChannel('s', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelSaturationLabel() }}</span>\n      </label>\n      <label class=\"wr-color-picker__field\">\n        <input\n          type=\"number\"\n          min=\"0\"\n          max=\"100\"\n          [value]=\"hslView().l * 100 | number: '1.0-0'\"\n          [disabled]=\"disabled()\"\n          [readonly]=\"readonly()\"\n          (input)=\"onHslChannel('l', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">{{ channelLightnessLabel() }}</span>\n      </label>\n      @if (alpha()) {\n        <label class=\"wr-color-picker__field\">\n          <input\n            type=\"number\"\n            min=\"0\"\n            max=\"100\"\n            [value]=\"alphaPercent()\"\n            [disabled]=\"disabled()\"\n            [readonly]=\"readonly()\"\n            (input)=\"onAlphaPercent($event)\"\n          />\n          <span class=\"wr-color-picker__field-label\">{{ channelAlphaLabel() }}</span>\n        </label>\n      }\n    </div>\n  }\n}\n\n@if (swatches().length > 0) {\n  <div class=\"wr-color-picker__swatches\">\n    @for (color of swatches(); track color) {\n      <button\n        type=\"button\"\n        class=\"wr-color-picker__swatch\"\n        [style.background]=\"color\"\n        [attr.aria-label]=\"color\"\n        [disabled]=\"disabled() || readonly()\"\n        (click)=\"onSwatchClick(color)\"\n      ></button>\n    }\n  </div>\n}\n", dependencies: [{ kind: "component", type: WrSegmented, selector: "wr-segmented", inputs: ["options", "value", "disabled", "readonly", "size"], outputs: ["valueChange", "touch"] }, { kind: "pipe", type: DecimalPipe, name: "number" }], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrColorPicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrColorPicker, decorators: [{
             type: Component,
             args: [{ selector: 'wr-color-picker', encapsulation: ViewEncapsulation.None, host: {
                         '[class]': 'classes()',
@@ -970,10 +970,10 @@ class WrColorPickerTrigger {
             this.overlayRef = null;
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.4", type: WrColorPickerTrigger, isStandalone: true, selector: "[wrColorPickerTrigger]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, alpha: { classPropertyName: "alpha", publicName: "alpha", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", opened: "opened", closed: "closed" }, host: { listeners: { "click": "toggle()" }, properties: { "attr.aria-haspopup": "\"dialog\"", "attr.aria-expanded": "isOpen()", "attr.aria-controls": "isOpen() ? panelId : null", "attr.aria-disabled": "disabled() ? true : null" } }, exportAs: ["wrColorPickerTrigger"], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.5", type: WrColorPickerTrigger, isStandalone: true, selector: "[wrColorPickerTrigger]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, alpha: { classPropertyName: "alpha", publicName: "alpha", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", opened: "opened", closed: "closed" }, host: { listeners: { "click": "toggle()" }, properties: { "attr.aria-haspopup": "\"dialog\"", "attr.aria-expanded": "isOpen()", "attr.aria-controls": "isOpen() ? panelId : null", "attr.aria-disabled": "disabled() ? true : null" } }, exportAs: ["wrColorPickerTrigger"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrColorPickerTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrColorPickerTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[wrColorPickerTrigger]',

package/fesm2022/ngwr-command-palette.mjs

@@ -344,10 +344,10 @@ class WrCommandPalette {
         if (this.closeOnPick())
             this.close();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCommandPalette, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrCommandPalette, isStandalone: true, selector: "wr-command-palette", inputs: { paletteLabel: { classPropertyName: "paletteLabel", publicName: "paletteLabel", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, closeOnPick: { classPropertyName: "closeOnPick", publicName: "closeOnPick", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", picked: "picked" }, viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, isSignal: true }, { propertyName: "panelEl", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (open()) {\n  <div\n    class=\"wr-command-palette\"\n    [class.wr-command-palette--sheet]=\"presentAsSheet()\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    [attr.aria-label]=\"resolvedPaletteLabel()\"\n  >\n    <!-- Backdrop captures clicks to close. Not focusable \u2014 keyboard users use\n         Esc on the panel below. -->\n\n    <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n    <!-- Keydown is delegated from the search input; tabindex enables Esc when\n         the input is unfocused. -->\n    <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n      <div class=\"wr-command-palette__search\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n          <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n          <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n        </svg>\n        <input\n          #input\n          type=\"text\"\n          role=\"combobox\"\n          autocomplete=\"off\"\n          spellcheck=\"false\"\n          aria-autocomplete=\"list\"\n          [attr.aria-controls]=\"listboxId\"\n          [attr.aria-expanded]=\"true\"\n          [attr.aria-activedescendant]=\"activeOptionId() || null\"\n          [placeholder]=\"resolvedPlaceholder()\"\n          [value]=\"query()\"\n          (input)=\"onQueryInput($event)\"\n        />\n        <kbd class=\"wr-command-palette__hint\">{{ resolvedEscHint() }}</kbd>\n      </div>\n\n      <!-- The empty row sits OUTSIDE the listbox below, and is a live region.\n           A listbox may only own `option` and `group` children \u2014 the same rule\n           the buckets already follow \u2014 so this row inside it was an\n           `aria-required-children` critical for every query that matched\n           nothing, and an empty listbox on its own is not. `role=\"status\"` also\n           gets the message spoken while focus stays in the search input. -->\n      @if (filtered().length === 0) {\n        <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedEmpty() }}</div>\n      }\n\n      <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n        @for (bucket of buckets(); track bucket.title; let groupIndex = $index) {\n          <!-- A listbox may only own `option` and `group` children, so a titled\n               bucket is a labelled group and an untitled one leaves the tree with\n               `role=\"none\"`, promoting its options to the listbox's own. -->\n          <div\n            class=\"wr-command-palette__group\"\n            [attr.role]=\"bucket.title ? 'group' : 'none'\"\n            [attr.aria-labelledby]=\"bucket.title ? groupTitleId(groupIndex) : null\"\n          >\n            @if (bucket.title) {\n              <div class=\"wr-command-palette__group-title\" [attr.id]=\"groupTitleId(groupIndex)\">\n                {{ bucket.title }}\n              </div>\n            }\n            @for (item of bucket.items; track item.id) {\n              <div\n                class=\"wr-command-palette__option\"\n                role=\"option\"\n                [attr.id]=\"optionId(indexOf(item))\"\n                [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n                [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n                (mouseenter)=\"onItemHover(item)\"\n                (mousedown)=\"onItemClick(item, $event)\"\n              >\n                @if (item.icon) {\n                  <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n                } @else {\n                  <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n                }\n                <div class=\"wr-command-palette__option-body\">\n                  <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n                  @if (item.description) {\n                    <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n                  }\n                </div>\n                @if (item.shortcut) {\n                  <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n                }\n              </div>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCommandPalette, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrCommandPalette, isStandalone: true, selector: "wr-command-palette", inputs: { paletteLabel: { classPropertyName: "paletteLabel", publicName: "paletteLabel", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, emptyText: { classPropertyName: "emptyText", publicName: "emptyText", isSignal: true, isRequired: false, transformFunction: null }, closeOnPick: { classPropertyName: "closeOnPick", publicName: "closeOnPick", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", picked: "picked" }, viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, isSignal: true }, { propertyName: "panelEl", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (open()) {\n  <div\n    class=\"wr-command-palette\"\n    [class.wr-command-palette--sheet]=\"presentAsSheet()\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    [attr.aria-label]=\"resolvedPaletteLabel()\"\n  >\n    <!-- Backdrop captures clicks to close. Not focusable \u2014 keyboard users use\n         Esc on the panel below. -->\n\n    <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n    <!-- Keydown is delegated from the search input; tabindex enables Esc when\n         the input is unfocused. -->\n    <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n      <div class=\"wr-command-palette__search\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n          <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n          <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n        </svg>\n        <input\n          #input\n          type=\"text\"\n          role=\"combobox\"\n          autocomplete=\"off\"\n          spellcheck=\"false\"\n          aria-autocomplete=\"list\"\n          [attr.aria-controls]=\"listboxId\"\n          [attr.aria-expanded]=\"true\"\n          [attr.aria-activedescendant]=\"activeOptionId() || null\"\n          [placeholder]=\"resolvedPlaceholder()\"\n          [value]=\"query()\"\n          (input)=\"onQueryInput($event)\"\n        />\n        <kbd class=\"wr-command-palette__hint\">{{ resolvedEscHint() }}</kbd>\n      </div>\n\n      <!-- The empty row sits OUTSIDE the listbox below, and is a live region.\n           A listbox may only own `option` and `group` children \u2014 the same rule\n           the buckets already follow \u2014 so this row inside it was an\n           `aria-required-children` critical for every query that matched\n           nothing, and an empty listbox on its own is not. `role=\"status\"` also\n           gets the message spoken while focus stays in the search input. -->\n      @if (filtered().length === 0) {\n        <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedEmpty() }}</div>\n      }\n\n      <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n        @for (bucket of buckets(); track bucket.title; let groupIndex = $index) {\n          <!-- A listbox may only own `option` and `group` children, so a titled\n               bucket is a labelled group and an untitled one leaves the tree with\n               `role=\"none\"`, promoting its options to the listbox's own. -->\n          <div\n            class=\"wr-command-palette__group\"\n            [attr.role]=\"bucket.title ? 'group' : 'none'\"\n            [attr.aria-labelledby]=\"bucket.title ? groupTitleId(groupIndex) : null\"\n          >\n            @if (bucket.title) {\n              <div class=\"wr-command-palette__group-title\" [attr.id]=\"groupTitleId(groupIndex)\">\n                {{ bucket.title }}\n              </div>\n            }\n            @for (item of bucket.items; track item.id) {\n              <div\n                class=\"wr-command-palette__option\"\n                role=\"option\"\n                [attr.id]=\"optionId(indexOf(item))\"\n                [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n                [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n                (mouseenter)=\"onItemHover(item)\"\n                (mousedown)=\"onItemClick(item, $event)\"\n              >\n                @if (item.icon) {\n                  <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n                } @else {\n                  <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n                }\n                <div class=\"wr-command-palette__option-body\">\n                  <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n                  @if (item.description) {\n                    <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n                  }\n                </div>\n                @if (item.shortcut) {\n                  <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n                }\n              </div>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCommandPalette, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCommandPalette, decorators: [{
             type: Component,
             args: [{ selector: 'wr-command-palette', encapsulation: ViewEncapsulation.None, imports: [WrIcon], template: "@if (open()) {\n  <div\n    class=\"wr-command-palette\"\n    [class.wr-command-palette--sheet]=\"presentAsSheet()\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    [attr.aria-label]=\"resolvedPaletteLabel()\"\n  >\n    <!-- Backdrop captures clicks to close. Not focusable \u2014 keyboard users use\n         Esc on the panel below. -->\n\n    <div class=\"wr-command-palette__backdrop\" aria-hidden=\"true\" (click)=\"onBackdropClick()\"></div>\n\n    <!-- Keydown is delegated from the search input; tabindex enables Esc when\n         the input is unfocused. -->\n    <div #panel class=\"wr-command-palette__panel\" tabindex=\"-1\" (keydown)=\"onKeydown($event)\">\n      <div class=\"wr-command-palette__search\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n          <circle cx=\"7\" cy=\"7\" r=\"5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" />\n          <path d=\"M11 11 L14 14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" />\n        </svg>\n        <input\n          #input\n          type=\"text\"\n          role=\"combobox\"\n          autocomplete=\"off\"\n          spellcheck=\"false\"\n          aria-autocomplete=\"list\"\n          [attr.aria-controls]=\"listboxId\"\n          [attr.aria-expanded]=\"true\"\n          [attr.aria-activedescendant]=\"activeOptionId() || null\"\n          [placeholder]=\"resolvedPlaceholder()\"\n          [value]=\"query()\"\n          (input)=\"onQueryInput($event)\"\n        />\n        <kbd class=\"wr-command-palette__hint\">{{ resolvedEscHint() }}</kbd>\n      </div>\n\n      <!-- The empty row sits OUTSIDE the listbox below, and is a live region.\n           A listbox may only own `option` and `group` children \u2014 the same rule\n           the buckets already follow \u2014 so this row inside it was an\n           `aria-required-children` critical for every query that matched\n           nothing, and an empty listbox on its own is not. `role=\"status\"` also\n           gets the message spoken while focus stays in the search input. -->\n      @if (filtered().length === 0) {\n        <div class=\"wr-command-palette__empty\" role=\"status\">{{ resolvedEmpty() }}</div>\n      }\n\n      <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n        @for (bucket of buckets(); track bucket.title; let groupIndex = $index) {\n          <!-- A listbox may only own `option` and `group` children, so a titled\n               bucket is a labelled group and an untitled one leaves the tree with\n               `role=\"none\"`, promoting its options to the listbox's own. -->\n          <div\n            class=\"wr-command-palette__group\"\n            [attr.role]=\"bucket.title ? 'group' : 'none'\"\n            [attr.aria-labelledby]=\"bucket.title ? groupTitleId(groupIndex) : null\"\n          >\n            @if (bucket.title) {\n              <div class=\"wr-command-palette__group-title\" [attr.id]=\"groupTitleId(groupIndex)\">\n                {{ bucket.title }}\n              </div>\n            }\n            @for (item of bucket.items; track item.id) {\n              <div\n                class=\"wr-command-palette__option\"\n                role=\"option\"\n                [attr.id]=\"optionId(indexOf(item))\"\n                [class.wr-command-palette__option--active]=\"indexOf(item) === activeIndex()\"\n                [attr.aria-selected]=\"indexOf(item) === activeIndex()\"\n                (mouseenter)=\"onItemHover(item)\"\n                (mousedown)=\"onItemClick(item, $event)\"\n              >\n                @if (item.icon) {\n                  <wr-icon class=\"wr-command-palette__option-icon\" [name]=\"item.icon\" size=\"16\" />\n                } @else {\n                  <span class=\"wr-command-palette__option-icon\" aria-hidden=\"true\"></span>\n                }\n                <div class=\"wr-command-palette__option-body\">\n                  <div class=\"wr-command-palette__option-label\">{{ item.label }}</div>\n                  @if (item.description) {\n                    <div class=\"wr-command-palette__option-description\">{{ item.description }}</div>\n                  }\n                </div>\n                @if (item.shortcut) {\n                  <kbd class=\"wr-command-palette__option-shortcut\">{{ item.shortcut }}</kbd>\n                }\n              </div>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  </div>\n}\n" }]
         }], ctorParameters: () => [], propDecorators: { paletteLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "paletteLabel", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], emptyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyText", required: false }] }], closeOnPick: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnPick", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], picked: [{ type: i0.Output, args: ["picked"] }], inputEl: [{ type: i0.ViewChild, args: ['input', { isSignal: true }] }], panelEl: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }] } });

package/fesm2022/ngwr-compare.mjs

@@ -211,10 +211,10 @@ class WrCompare {
     inlineFraction(clientX, rect) {
         return this.rtl() ? (rect.right - clientX) / rect.width : (clientX - rect.left) / rect.width;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCompare, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrCompare, isStandalone: true, selector: "wr-compare", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, showHandle: { classPropertyName: "showHandle", publicName: "showHandle", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minPosition: { classPropertyName: "minPosition", publicName: "minPosition", isSignal: true, isRequired: false, transformFunction: null }, maxPosition: { classPropertyName: "maxPosition", publicName: "maxPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { position: "positionChange" }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "<div\n  class=\"wr-compare__surface\"\n  role=\"slider\"\n  [attr.aria-label]=\"resolvedAriaLabel()\"\n  [attr.aria-orientation]=\"orientation()\"\n  [attr.aria-valuemin]=\"minPosition()\"\n  [attr.aria-valuemax]=\"maxPosition()\"\n  [attr.aria-valuenow]=\"position()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event)\"\n  (pointermove)=\"onPointerMove($event)\"\n  (pointerup)=\"onPointerUp($event)\"\n  (pointercancel)=\"onPointerUp($event)\"\n  (keydown)=\"onKeydown($event)\"\n>\n  <div class=\"wr-compare__layers\">\n    <div class=\"wr-compare__layer wr-compare__layer--before\">\n      <ng-content select=\"[wrCompareBefore]\" />\n    </div>\n    <div class=\"wr-compare__layer wr-compare__layer--after\" [style.clip-path]=\"clipPath()\">\n      <ng-content select=\"[wrCompareAfter]\" />\n    </div>\n  </div>\n\n  <div\n    class=\"wr-compare__divider\"\n    [style.left.%]=\"orientation() === 'horizontal' ? dividerLeft() : null\"\n    [style.top.%]=\"orientation() === 'vertical' ? position() : null\"\n    aria-hidden=\"true\"\n  >\n    @if (showHandle()) {\n      <span class=\"wr-compare__handle\">\n        @if (orientation() === 'horizontal') {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M5 4 L1 8 L5 12 M11 4 L15 8 L11 12\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        } @else {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M4 5 L8 1 L12 5 M4 11 L8 15 L12 11\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        }\n      </span>\n    }\n  </div>\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCompare, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrCompare, isStandalone: true, selector: "wr-compare", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, showHandle: { classPropertyName: "showHandle", publicName: "showHandle", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minPosition: { classPropertyName: "minPosition", publicName: "minPosition", isSignal: true, isRequired: false, transformFunction: null }, maxPosition: { classPropertyName: "maxPosition", publicName: "maxPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { position: "positionChange" }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "<div\n  class=\"wr-compare__surface\"\n  role=\"slider\"\n  [attr.aria-label]=\"resolvedAriaLabel()\"\n  [attr.aria-orientation]=\"orientation()\"\n  [attr.aria-valuemin]=\"minPosition()\"\n  [attr.aria-valuemax]=\"maxPosition()\"\n  [attr.aria-valuenow]=\"position()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event)\"\n  (pointermove)=\"onPointerMove($event)\"\n  (pointerup)=\"onPointerUp($event)\"\n  (pointercancel)=\"onPointerUp($event)\"\n  (keydown)=\"onKeydown($event)\"\n>\n  <div class=\"wr-compare__layers\">\n    <div class=\"wr-compare__layer wr-compare__layer--before\">\n      <ng-content select=\"[wrCompareBefore]\" />\n    </div>\n    <div class=\"wr-compare__layer wr-compare__layer--after\" [style.clip-path]=\"clipPath()\">\n      <ng-content select=\"[wrCompareAfter]\" />\n    </div>\n  </div>\n\n  <div\n    class=\"wr-compare__divider\"\n    [style.left.%]=\"orientation() === 'horizontal' ? dividerLeft() : null\"\n    [style.top.%]=\"orientation() === 'vertical' ? position() : null\"\n    aria-hidden=\"true\"\n  >\n    @if (showHandle()) {\n      <span class=\"wr-compare__handle\">\n        @if (orientation() === 'horizontal') {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M5 4 L1 8 L5 12 M11 4 L15 8 L11 12\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        } @else {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M4 5 L8 1 L12 5 M4 11 L8 15 L12 11\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        }\n      </span>\n    }\n  </div>\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCompare, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCompare, decorators: [{
             type: Component,
             args: [{ selector: 'wr-compare', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, template: "<div\n  class=\"wr-compare__surface\"\n  role=\"slider\"\n  [attr.aria-label]=\"resolvedAriaLabel()\"\n  [attr.aria-orientation]=\"orientation()\"\n  [attr.aria-valuemin]=\"minPosition()\"\n  [attr.aria-valuemax]=\"maxPosition()\"\n  [attr.aria-valuenow]=\"position()\"\n  [attr.aria-disabled]=\"disabled() || null\"\n  [attr.tabindex]=\"disabled() ? -1 : 0\"\n  (pointerdown)=\"onPointerDown($event)\"\n  (pointermove)=\"onPointerMove($event)\"\n  (pointerup)=\"onPointerUp($event)\"\n  (pointercancel)=\"onPointerUp($event)\"\n  (keydown)=\"onKeydown($event)\"\n>\n  <div class=\"wr-compare__layers\">\n    <div class=\"wr-compare__layer wr-compare__layer--before\">\n      <ng-content select=\"[wrCompareBefore]\" />\n    </div>\n    <div class=\"wr-compare__layer wr-compare__layer--after\" [style.clip-path]=\"clipPath()\">\n      <ng-content select=\"[wrCompareAfter]\" />\n    </div>\n  </div>\n\n  <div\n    class=\"wr-compare__divider\"\n    [style.left.%]=\"orientation() === 'horizontal' ? dividerLeft() : null\"\n    [style.top.%]=\"orientation() === 'vertical' ? position() : null\"\n    aria-hidden=\"true\"\n  >\n    @if (showHandle()) {\n      <span class=\"wr-compare__handle\">\n        @if (orientation() === 'horizontal') {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M5 4 L1 8 L5 12 M11 4 L15 8 L11 12\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        } @else {\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n            <path\n              d=\"M4 5 L8 1 L12 5 M4 11 L8 15 L12 11\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"1.5\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n            />\n          </svg>\n        }\n      </span>\n    }\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }, { type: i0.Output, args: ["positionChange"] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], showHandle: [{ type: i0.Input, args: [{ isSignal: true, alias: "showHandle", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], minPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "minPosition", required: false }] }], maxPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxPosition", required: false }] }] } });

package/fesm2022/ngwr-confetti.mjs

@@ -170,10 +170,10 @@ class WrConfetti {
             this.rafId = null;
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrConfetti, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.4", ngImport: i0, type: WrConfetti });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrConfetti, deps: [], target: i0.ɵɵFactoryTarget.Service });
+    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.5", ngImport: i0, type: WrConfetti });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrConfetti, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrConfetti, decorators: [{
             type: Service
         }], ctorParameters: () => [] });
 

package/fesm2022/ngwr-context-menu.mjs

@@ -499,10 +499,10 @@ class WrContextMenuItem {
     isRtl() {
         return this.dir?.value === 'rtl';
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrContextMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrContextMenuItem, isStandalone: true, selector: "wr-context-menu-item", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, submenu: { classPropertyName: "submenu", publicName: "submenu", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "menuitem" }, listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave($event)", "click": "onClick()", "keydown.enter": "activate($event)", "keydown.space": "activate($event)", "keydown.arrowRight": "onArrowRight($event)", "keydown.arrowLeft": "onArrowLeft($event)" }, properties: { "class": "classes()", "attr.tabindex": "-1", "attr.aria-disabled": "disabled() ? true : null", "attr.aria-haspopup": "submenu() ? \"menu\" : null", "attr.aria-expanded": "submenu() ? (submenuOpen ? \"true\" : \"false\") : null", "attr.aria-controls": "submenuId()" } }, ngImport: i0, template: "@if (icon(); as name) {\n  <wr-icon class=\"wr-context-menu-item__icon\" [name]=\"name\" size=\"14\" />\n}\n<span class=\"wr-context-menu-item__label\"><ng-content /></span>\n@if (submenu()) {\n  <svg\n    class=\"wr-icon__svg wr-context-menu-item__chevron\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    stroke-width=\"2\"\n    stroke-linecap=\"round\"\n    stroke-linejoin=\"round\"\n    aria-hidden=\"true\"\n  >\n    <path d=\"m9 18 6-6-6-6\" />\n  </svg>\n}\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrContextMenuItem, isStandalone: true, selector: "wr-context-menu-item", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, submenu: { classPropertyName: "submenu", publicName: "submenu", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "menuitem" }, listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave($event)", "click": "onClick()", "keydown.enter": "activate($event)", "keydown.space": "activate($event)", "keydown.arrowRight": "onArrowRight($event)", "keydown.arrowLeft": "onArrowLeft($event)" }, properties: { "class": "classes()", "attr.tabindex": "-1", "attr.aria-disabled": "disabled() ? true : null", "attr.aria-haspopup": "submenu() ? \"menu\" : null", "attr.aria-expanded": "submenu() ? (submenuOpen ? \"true\" : \"false\") : null", "attr.aria-controls": "submenuId()" } }, ngImport: i0, template: "@if (icon(); as name) {\n  <wr-icon class=\"wr-context-menu-item__icon\" [name]=\"name\" size=\"14\" />\n}\n<span class=\"wr-context-menu-item__label\"><ng-content /></span>\n@if (submenu()) {\n  <svg\n    class=\"wr-icon__svg wr-context-menu-item__chevron\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    stroke-width=\"2\"\n    stroke-linecap=\"round\"\n    stroke-linejoin=\"round\"\n    aria-hidden=\"true\"\n  >\n    <path d=\"m9 18 6-6-6-6\" />\n  </svg>\n}\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrContextMenuItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuItem, decorators: [{
             type: Component,
             args: [{ selector: 'wr-context-menu-item', encapsulation: ViewEncapsulation.None, host: {
                         role: 'menuitem',
@@ -1040,10 +1040,10 @@ class WrContextMenu {
             this.closeOverlay();
         }, WrContextMenu.LEAVE_DELAY);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrContextMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.4", type: WrContextMenu, isStandalone: true, selector: "[wrContextMenu]", inputs: { menu: { classPropertyName: "menu", publicName: "wrContextMenu", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "contextmenu": "onContextMenu($event)", "pointerdown": "onPointerDown($event)", "pointermove": "onPointerMove($event)", "pointerup": "onPointerUp()", "pointercancel": "onPointerUp()" }, properties: { "attr.aria-controls": "openMenuId()" }, classAttribute: "wr-context-menu-host" }, exportAs: ["wrContextMenuTrigger"], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.5", type: WrContextMenu, isStandalone: true, selector: "[wrContextMenu]", inputs: { menu: { classPropertyName: "menu", publicName: "wrContextMenu", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "contextmenu": "onContextMenu($event)", "pointerdown": "onPointerDown($event)", "pointermove": "onPointerMove($event)", "pointerup": "onPointerUp()", "pointercancel": "onPointerUp()" }, properties: { "attr.aria-controls": "openMenuId()" }, classAttribute: "wr-context-menu-host" }, exportAs: ["wrContextMenuTrigger"], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrContextMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenu, decorators: [{
             type: Directive,
             args: [{
                     selector: '[wrContextMenu]',
@@ -1089,10 +1089,10 @@ class WrContextMenuPanel {
     /** The internal template the directive portals into the overlay. @internal */
     contentTpl = viewChild.required(TemplateRef, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "contentTpl" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrContextMenuPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.4", type: WrContextMenuPanel, isStandalone: true, selector: "wr-context-menu", host: { properties: { "style.display": "'none'" } }, viewQueries: [{ propertyName: "contentTpl", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], exportAs: ["wrContextMenu"], ngImport: i0, template: '<ng-template><div class="wr-context-menu" role="menu"><ng-content /></div></ng-template>', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.5", type: WrContextMenuPanel, isStandalone: true, selector: "wr-context-menu", host: { properties: { "style.display": "'none'" } }, viewQueries: [{ propertyName: "contentTpl", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], exportAs: ["wrContextMenu"], ngImport: i0, template: '<ng-template><div class="wr-context-menu" role="menu"><ng-content /></div></ng-template>', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrContextMenuPanel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuPanel, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-context-menu',
@@ -1129,10 +1129,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
  * ```
  */
 class WrContextMenuDivider {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrContextMenuDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.4", type: WrContextMenuDivider, isStandalone: true, selector: "wr-context-menu-divider", host: { attributes: { "role": "separator", "aria-orientation": "horizontal" }, classAttribute: "wr-context-menu-divider" }, ngImport: i0, template: '', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuDivider, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: WrContextMenuDivider, isStandalone: true, selector: "wr-context-menu-divider", host: { attributes: { "role": "separator", "aria-orientation": "horizontal" }, classAttribute: "wr-context-menu-divider" }, ngImport: i0, template: '', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrContextMenuDivider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrContextMenuDivider, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-context-menu-divider',

package/fesm2022/ngwr-cookie.mjs

@@ -129,10 +129,10 @@ class WrCookie {
         for (const k of this.keys())
             this.remove(k);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCookie, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.4", ngImport: i0, type: WrCookie });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCookie, deps: [], target: i0.ɵɵFactoryTarget.Service });
+    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.5", ngImport: i0, type: WrCookie });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCookie, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCookie, decorators: [{
             type: Service
         }] });
 

package/fesm2022/ngwr-counter.mjs

@@ -185,10 +185,10 @@ class WrCounter {
             return Math.floor(mod + 1e-9);
         return mod;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCounter, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: WrCounter, isStandalone: true, selector: "wr-counter", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, decimals: { classPropertyName: "decimals", publicName: "decimals", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, grouping: { classPropertyName: "grouping", publicName: "grouping", isSignal: true, isRequired: false, transformFunction: null }, minIntegerDigits: { classPropertyName: "minIntegerDigits", publicName: "minIntegerDigits", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-counter" }, ngImport: i0, template: "@if (mode() === 'tween') {\n  <span class=\"wr-counter__tween\">{{ prefix() }}{{ tweenText() }}{{ suffix() }}</span>\n} @else {\n  <span class=\"wr-counter__sr-only\">{{ odoText() }}</span>\n  <span class=\"wr-counter__odo\" aria-hidden=\"true\">\n    @if (prefix()) {\n      <span class=\"wr-counter__static\">{{ prefix() }}</span>\n    }\n    @for (cell of cells(); track $index) {\n      @if (cell.kind === 'digit') {\n        <span class=\"wr-counter__digit\">\n          <span class=\"wr-counter__strip\" [style.transform]=\"`translateY(-${cell.fraction}em)`\">\n            <span>0</span><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span\n            ><span>7</span><span>8</span><span>9</span>\n          </span>\n        </span>\n      } @else {\n        <span class=\"wr-counter__static\">{{ cell.char }}</span>\n      }\n    }\n    @if (suffix()) {\n      <span class=\"wr-counter__static\">{{ suffix() }}</span>\n    }\n  </span>\n}\n", encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCounter, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: WrCounter, isStandalone: true, selector: "wr-counter", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, decimals: { classPropertyName: "decimals", publicName: "decimals", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, grouping: { classPropertyName: "grouping", publicName: "grouping", isSignal: true, isRequired: false, transformFunction: null }, minIntegerDigits: { classPropertyName: "minIntegerDigits", publicName: "minIntegerDigits", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-counter" }, ngImport: i0, template: "@if (mode() === 'tween') {\n  <span class=\"wr-counter__tween\">{{ prefix() }}{{ tweenText() }}{{ suffix() }}</span>\n} @else {\n  <span class=\"wr-counter__sr-only\">{{ odoText() }}</span>\n  <span class=\"wr-counter__odo\" aria-hidden=\"true\">\n    @if (prefix()) {\n      <span class=\"wr-counter__static\">{{ prefix() }}</span>\n    }\n    @for (cell of cells(); track $index) {\n      @if (cell.kind === 'digit') {\n        <span class=\"wr-counter__digit\">\n          <span class=\"wr-counter__strip\" [style.transform]=\"`translateY(-${cell.fraction}em)`\">\n            <span>0</span><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span\n            ><span>7</span><span>8</span><span>9</span>\n          </span>\n        </span>\n      } @else {\n        <span class=\"wr-counter__static\">{{ cell.char }}</span>\n      }\n    }\n    @if (suffix()) {\n      <span class=\"wr-counter__static\">{{ suffix() }}</span>\n    }\n  </span>\n}\n", encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCounter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCounter, decorators: [{
             type: Component,
             args: [{ selector: 'wr-counter', encapsulation: ViewEncapsulation.None, host: { class: 'wr-counter' }, template: "@if (mode() === 'tween') {\n  <span class=\"wr-counter__tween\">{{ prefix() }}{{ tweenText() }}{{ suffix() }}</span>\n} @else {\n  <span class=\"wr-counter__sr-only\">{{ odoText() }}</span>\n  <span class=\"wr-counter__odo\" aria-hidden=\"true\">\n    @if (prefix()) {\n      <span class=\"wr-counter__static\">{{ prefix() }}</span>\n    }\n    @for (cell of cells(); track $index) {\n      @if (cell.kind === 'digit') {\n        <span class=\"wr-counter__digit\">\n          <span class=\"wr-counter__strip\" [style.transform]=\"`translateY(-${cell.fraction}em)`\">\n            <span>0</span><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span\n            ><span>7</span><span>8</span><span>9</span>\n          </span>\n        </span>\n      } @else {\n        <span class=\"wr-counter__static\">{{ cell.char }}</span>\n      }\n    }\n    @if (suffix()) {\n      <span class=\"wr-counter__static\">{{ suffix() }}</span>\n    }\n  </span>\n}\n" }]
         }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], duration: [{ type: i0.Input, args: [{ isSignal: true, alias: "duration", required: false }] }], decimals: [{ type: i0.Input, args: [{ isSignal: true, alias: "decimals", required: false }] }], prefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "prefix", required: false }] }], suffix: [{ type: i0.Input, args: [{ isSignal: true, alias: "suffix", required: false }] }], grouping: [{ type: i0.Input, args: [{ isSignal: true, alias: "grouping", required: false }] }], minIntegerDigits: [{ type: i0.Input, args: [{ isSignal: true, alias: "minIntegerDigits", required: false }] }] } });
@@ -444,10 +444,10 @@ class WrCountUp {
             this.delayTimer = undefined;
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCountUp, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.4", type: WrCountUp, isStandalone: true, selector: "wr-count-up", inputs: { from: { classPropertyName: "from", publicName: "from", isSignal: true, isRequired: false, transformFunction: null }, to: { classPropertyName: "to", publicName: "to", isSignal: true, isRequired: true, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, delay: { classPropertyName: "delay", publicName: "delay", isSignal: true, isRequired: false, transformFunction: null }, easing: { classPropertyName: "easing", publicName: "easing", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, decimals: { classPropertyName: "decimals", publicName: "decimals", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, grouping: { classPropertyName: "grouping", publicName: "grouping", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { started: "started", completed: "completed" }, host: { classAttribute: "wr-count-up" }, ngImport: i0, template: `{{ prefix() }}{{ formatted() }}{{ suffix() }}`, isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCountUp, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.5", type: WrCountUp, isStandalone: true, selector: "wr-count-up", inputs: { from: { classPropertyName: "from", publicName: "from", isSignal: true, isRequired: false, transformFunction: null }, to: { classPropertyName: "to", publicName: "to", isSignal: true, isRequired: true, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, delay: { classPropertyName: "delay", publicName: "delay", isSignal: true, isRequired: false, transformFunction: null }, easing: { classPropertyName: "easing", publicName: "easing", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, decimals: { classPropertyName: "decimals", publicName: "decimals", isSignal: true, isRequired: false, transformFunction: null }, prefix: { classPropertyName: "prefix", publicName: "prefix", isSignal: true, isRequired: false, transformFunction: null }, suffix: { classPropertyName: "suffix", publicName: "suffix", isSignal: true, isRequired: false, transformFunction: null }, grouping: { classPropertyName: "grouping", publicName: "grouping", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { started: "started", completed: "completed" }, host: { classAttribute: "wr-count-up" }, ngImport: i0, template: `{{ prefix() }}{{ formatted() }}{{ suffix() }}`, isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrCountUp, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrCountUp, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-count-up',

package/fesm2022/ngwr-date-adapters-fns.mjs

@@ -216,10 +216,10 @@ class WrDateFnsAdapter extends WrDateAdapter {
             out.push(formatter.format(new Date(2024, i, 15)));
         return out;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrDateFnsAdapter, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.4", ngImport: i0, type: WrDateFnsAdapter });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrDateFnsAdapter, deps: [], target: i0.ɵɵFactoryTarget.Service });
+    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.5", ngImport: i0, type: WrDateFnsAdapter });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrDateFnsAdapter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrDateFnsAdapter, decorators: [{
             type: Service
         }], ctorParameters: () => [] });
 

package/fesm2022/ngwr-date-adapters-luxon.mjs

@@ -212,10 +212,10 @@ class WrLuxonAdapter extends WrDateAdapter {
     getMonthNames(style) {
         return Info.months(style, { locale: this.locale });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrLuxonAdapter, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.4", ngImport: i0, type: WrLuxonAdapter });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrLuxonAdapter, deps: [], target: i0.ɵɵFactoryTarget.Service });
+    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.5", ngImport: i0, type: WrLuxonAdapter });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: WrLuxonAdapter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: WrLuxonAdapter, decorators: [{
             type: Service
         }] });