ngwr 7.0.0 → 7.1.0

package/fesm2022/ngwr-calendar-heatmap.mjs

@@ -129,10 +129,10 @@ class WrCalendarHeatmap {
             return 0.75;
         return 1;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCalendarHeatmap, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCalendarHeatmap, isStandalone: true, selector: "wr-calendar-heatmap", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, weeks: { classPropertyName: "weeks", publicName: "weeks", isSignal: true, isRequired: false, transformFunction: null }, cellSize: { classPropertyName: "cellSize", publicName: "cellSize", isSignal: true, isRequired: false, transformFunction: null }, cellGap: { classPropertyName: "cellGap", publicName: "cellGap", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, emptyColor: { classPropertyName: "emptyColor", publicName: "emptyColor", isSignal: true, isRequired: false, transformFunction: null }, showLabels: { classPropertyName: "showLabels", publicName: "showLabels", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-calendar-heatmap" }, ngImport: i0, template: "<div\n  class=\"wr-calendar-heatmap__grid\"\n  [style.--wr-heatmap-cell-size.px]=\"cellSize()\"\n  [style.--wr-heatmap-cell-gap.px]=\"cellGap()\"\n  [style.--wr-heatmap-columns]=\"columnCount()\"\n>\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__weekdays\">\n      @for (label of weekdayLabels; track $index) {\n        <span class=\"wr-calendar-heatmap__weekday\">{{ label }}</span>\n      }\n    </div>\n  }\n\n  <div class=\"wr-calendar-heatmap__cells\">\n    @for (cell of cells(); track cell.iso) {\n      <span\n        class=\"wr-calendar-heatmap__cell\"\n        [style.background]=\"colorFor(cell.intensity)\"\n        [style.opacity]=\"opacityFor(cell.intensity)\"\n        [style.grid-column]=\"cell.week + 1\"\n        [style.grid-row]=\"cell.day + 1\"\n        [title]=\"`${cell.iso}: ${cell.value}`\"\n      ></span>\n    }\n  </div>\n\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__months\">\n      @for (m of monthLabels(); track $index) {\n        <span class=\"wr-calendar-heatmap__month\" [style.grid-column]=\"m.week + 1\">{{ m.label }}</span>\n      }\n    </div>\n  }\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCalendarHeatmap, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrCalendarHeatmap, isStandalone: true, selector: "wr-calendar-heatmap", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, endDate: { classPropertyName: "endDate", publicName: "endDate", isSignal: true, isRequired: false, transformFunction: null }, weeks: { classPropertyName: "weeks", publicName: "weeks", isSignal: true, isRequired: false, transformFunction: null }, cellSize: { classPropertyName: "cellSize", publicName: "cellSize", isSignal: true, isRequired: false, transformFunction: null }, cellGap: { classPropertyName: "cellGap", publicName: "cellGap", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, emptyColor: { classPropertyName: "emptyColor", publicName: "emptyColor", isSignal: true, isRequired: false, transformFunction: null }, showLabels: { classPropertyName: "showLabels", publicName: "showLabels", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-calendar-heatmap" }, ngImport: i0, template: "<div\n  class=\"wr-calendar-heatmap__grid\"\n  [style.--wr-heatmap-cell-size.px]=\"cellSize()\"\n  [style.--wr-heatmap-cell-gap.px]=\"cellGap()\"\n  [style.--wr-heatmap-columns]=\"columnCount()\"\n>\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__weekdays\">\n      @for (label of weekdayLabels; track $index) {\n        <span class=\"wr-calendar-heatmap__weekday\">{{ label }}</span>\n      }\n    </div>\n  }\n\n  <div class=\"wr-calendar-heatmap__cells\">\n    @for (cell of cells(); track cell.iso) {\n      <span\n        class=\"wr-calendar-heatmap__cell\"\n        [style.background]=\"colorFor(cell.intensity)\"\n        [style.opacity]=\"opacityFor(cell.intensity)\"\n        [style.grid-column]=\"cell.week + 1\"\n        [style.grid-row]=\"cell.day + 1\"\n        [title]=\"`${cell.iso}: ${cell.value}`\"\n      ></span>\n    }\n  </div>\n\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__months\">\n      @for (m of monthLabels(); track $index) {\n        <span class=\"wr-calendar-heatmap__month\" [style.grid-column]=\"m.week + 1\">{{ m.label }}</span>\n      }\n    </div>\n  }\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCalendarHeatmap, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCalendarHeatmap, decorators: [{
             type: Component,
             args: [{ selector: 'wr-calendar-heatmap', encapsulation: ViewEncapsulation.None, host: { class: 'wr-calendar-heatmap' }, template: "<div\n  class=\"wr-calendar-heatmap__grid\"\n  [style.--wr-heatmap-cell-size.px]=\"cellSize()\"\n  [style.--wr-heatmap-cell-gap.px]=\"cellGap()\"\n  [style.--wr-heatmap-columns]=\"columnCount()\"\n>\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__weekdays\">\n      @for (label of weekdayLabels; track $index) {\n        <span class=\"wr-calendar-heatmap__weekday\">{{ label }}</span>\n      }\n    </div>\n  }\n\n  <div class=\"wr-calendar-heatmap__cells\">\n    @for (cell of cells(); track cell.iso) {\n      <span\n        class=\"wr-calendar-heatmap__cell\"\n        [style.background]=\"colorFor(cell.intensity)\"\n        [style.opacity]=\"opacityFor(cell.intensity)\"\n        [style.grid-column]=\"cell.week + 1\"\n        [style.grid-row]=\"cell.day + 1\"\n        [title]=\"`${cell.iso}: ${cell.value}`\"\n      ></span>\n    }\n  </div>\n\n  @if (showLabels()) {\n    <div class=\"wr-calendar-heatmap__months\">\n      @for (m of monthLabels(); track $index) {\n        <span class=\"wr-calendar-heatmap__month\" [style.grid-column]=\"m.week + 1\">{{ m.label }}</span>\n      }\n    </div>\n  }\n</div>\n" }]
         }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], endDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "endDate", required: false }] }], weeks: [{ type: i0.Input, args: [{ isSignal: true, alias: "weeks", required: false }] }], cellSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellSize", required: false }] }], cellGap: [{ type: i0.Input, args: [{ isSignal: true, alias: "cellGap", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], emptyColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyColor", required: false }] }], showLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabels", required: false }] }] } });

package/fesm2022/ngwr-calendar.mjs

@@ -382,10 +382,10 @@ class WrCalendar {
     trackByTime(_, date) {
         return date.getTime();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCalendar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCalendar, isStandalone: true, selector: "wr-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", range: "rangeChange" }, host: { attributes: { "role": "grid" }, listeners: { "keydown": "onKeyDown($event)" }, properties: { "class": "classes()" } }, ngImport: i0, template: "<div class=\"wr-calendar__header\">\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--prev\"\n    [attr.aria-label]=\"\n      viewMode() === 'year' ? 'Previous 12 years' : viewMode() === 'month' ? 'Previous year' : 'Previous month'\n    \"\n    [disabled]=\"disabled()\"\n    (click)=\"prev()\"\n  >\n    \u2039\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__label\"\n    aria-live=\"polite\"\n    [disabled]=\"disabled() || viewMode() === 'year'\"\n    (click)=\"onLabelClick()\"\n  >\n    {{ headerLabel() }}\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--next\"\n    [attr.aria-label]=\"viewMode() === 'year' ? 'Next 12 years' : viewMode() === 'month' ? 'Next year' : 'Next month'\"\n    [disabled]=\"disabled()\"\n    (click)=\"next()\"\n  >\n    \u203A\n  </button>\n</div>\n\n@switch (viewMode()) {\n  @case ('day') {\n    <div class=\"wr-calendar__weekdays\" role=\"row\">\n      @for (name of weekdayNames(); track name) {\n        <span class=\"wr-calendar__weekday\" role=\"columnheader\">{{ name }}</span>\n      }\n    </div>\n\n    <div class=\"wr-calendar__grid\" (mouseleave)=\"onCellLeave()\">\n      @for (week of weeks(); track $index) {\n        <div class=\"wr-calendar__week\" role=\"row\">\n          @for (day of week; track trackByTime($index, day)) {\n            <button\n              type=\"button\"\n              class=\"wr-calendar__day\"\n              role=\"gridcell\"\n              [class.wr-calendar__day--today]=\"isToday(day)\"\n              [class.wr-calendar__day--out-of-month]=\"isOutOfMonth(day)\"\n              [class.wr-calendar__day--selected]=\"isSelected(day)\"\n              [class.wr-calendar__day--in-range]=\"isInRange(day)\"\n              [class.wr-calendar__day--range-preview]=\"isInRangePreview(day)\"\n              [class.wr-calendar__day--focused]=\"isFocused(day)\"\n              [disabled]=\"isDisabled(day)\"\n              [attr.tabindex]=\"isFocused(day) ? 0 : -1\"\n              [attr.aria-selected]=\"isSelected(day)\"\n              [attr.aria-disabled]=\"isDisabled(day)\"\n              (click)=\"onCellClick(day)\"\n              (mouseenter)=\"onCellEnter(day)\"\n            >\n              {{ day.getDate() }}\n            </button>\n          }\n        </div>\n      }\n    </div>\n  }\n\n  @case ('month') {\n    <div class=\"wr-calendar__months\" role=\"grid\">\n      @for (name of monthsView(); track name) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"gridcell\"\n          [class.wr-calendar__chip--current]=\"isMonthCurrent($index)\"\n          [class.wr-calendar__chip--selected]=\"isMonthSelected($index)\"\n          [disabled]=\"isMonthDisabled($index)\"\n          [attr.aria-selected]=\"isMonthSelected($index)\"\n          [attr.aria-disabled]=\"isMonthDisabled($index)\"\n          (click)=\"onMonthSelect($index)\"\n        >\n          {{ name }}\n        </button>\n      }\n    </div>\n  }\n\n  @case ('year') {\n    <div class=\"wr-calendar__years\" role=\"grid\">\n      @for (year of yearsView(); track year) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"gridcell\"\n          [class.wr-calendar__chip--current]=\"isYearCurrent(year)\"\n          [class.wr-calendar__chip--selected]=\"isYearSelected(year)\"\n          [disabled]=\"isYearDisabled(year)\"\n          [attr.aria-selected]=\"isYearSelected(year)\"\n          [attr.aria-disabled]=\"isYearDisabled(year)\"\n          (click)=\"onYearSelect(year)\"\n        >\n          {{ year }}\n        </button>\n      }\n    </div>\n  }\n}\n", encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCalendar, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrCalendar, isStandalone: true, selector: "wr-calendar", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", range: "rangeChange" }, host: { attributes: { "role": "grid" }, listeners: { "keydown": "onKeyDown($event)" }, properties: { "class": "classes()" } }, ngImport: i0, template: "<div class=\"wr-calendar__header\">\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--prev\"\n    [attr.aria-label]=\"\n      viewMode() === 'year' ? 'Previous 12 years' : viewMode() === 'month' ? 'Previous year' : 'Previous month'\n    \"\n    [disabled]=\"disabled()\"\n    (click)=\"prev()\"\n  >\n    \u2039\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__label\"\n    aria-live=\"polite\"\n    [disabled]=\"disabled() || viewMode() === 'year'\"\n    (click)=\"onLabelClick()\"\n  >\n    {{ headerLabel() }}\n  </button>\n  <button\n    type=\"button\"\n    class=\"wr-calendar__nav wr-calendar__nav--next\"\n    [attr.aria-label]=\"viewMode() === 'year' ? 'Next 12 years' : viewMode() === 'month' ? 'Next year' : 'Next month'\"\n    [disabled]=\"disabled()\"\n    (click)=\"next()\"\n  >\n    \u203A\n  </button>\n</div>\n\n@switch (viewMode()) {\n  @case ('day') {\n    <div class=\"wr-calendar__weekdays\" role=\"row\">\n      @for (name of weekdayNames(); track name) {\n        <span class=\"wr-calendar__weekday\" role=\"columnheader\">{{ name }}</span>\n      }\n    </div>\n\n    <div class=\"wr-calendar__grid\" (mouseleave)=\"onCellLeave()\">\n      @for (week of weeks(); track $index) {\n        <div class=\"wr-calendar__week\" role=\"row\">\n          @for (day of week; track trackByTime($index, day)) {\n            <button\n              type=\"button\"\n              class=\"wr-calendar__day\"\n              role=\"gridcell\"\n              [class.wr-calendar__day--today]=\"isToday(day)\"\n              [class.wr-calendar__day--out-of-month]=\"isOutOfMonth(day)\"\n              [class.wr-calendar__day--selected]=\"isSelected(day)\"\n              [class.wr-calendar__day--in-range]=\"isInRange(day)\"\n              [class.wr-calendar__day--range-preview]=\"isInRangePreview(day)\"\n              [class.wr-calendar__day--focused]=\"isFocused(day)\"\n              [disabled]=\"isDisabled(day)\"\n              [attr.tabindex]=\"isFocused(day) ? 0 : -1\"\n              [attr.aria-selected]=\"isSelected(day)\"\n              [attr.aria-disabled]=\"isDisabled(day)\"\n              (click)=\"onCellClick(day)\"\n              (mouseenter)=\"onCellEnter(day)\"\n            >\n              {{ day.getDate() }}\n            </button>\n          }\n        </div>\n      }\n    </div>\n  }\n\n  @case ('month') {\n    <div class=\"wr-calendar__months\" role=\"grid\">\n      @for (name of monthsView(); track name) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"gridcell\"\n          [class.wr-calendar__chip--current]=\"isMonthCurrent($index)\"\n          [class.wr-calendar__chip--selected]=\"isMonthSelected($index)\"\n          [disabled]=\"isMonthDisabled($index)\"\n          [attr.aria-selected]=\"isMonthSelected($index)\"\n          [attr.aria-disabled]=\"isMonthDisabled($index)\"\n          (click)=\"onMonthSelect($index)\"\n        >\n          {{ name }}\n        </button>\n      }\n    </div>\n  }\n\n  @case ('year') {\n    <div class=\"wr-calendar__years\" role=\"grid\">\n      @for (year of yearsView(); track year) {\n        <button\n          type=\"button\"\n          class=\"wr-calendar__chip\"\n          role=\"gridcell\"\n          [class.wr-calendar__chip--current]=\"isYearCurrent(year)\"\n          [class.wr-calendar__chip--selected]=\"isYearSelected(year)\"\n          [disabled]=\"isYearDisabled(year)\"\n          [attr.aria-selected]=\"isYearSelected(year)\"\n          [attr.aria-disabled]=\"isYearDisabled(year)\"\n          (click)=\"onYearSelect(year)\"\n        >\n          {{ year }}\n        </button>\n      }\n    </div>\n  }\n}\n", encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCalendar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCalendar, decorators: [{
             type: Component,
             args: [{ selector: 'wr-calendar', encapsulation: ViewEncapsulation.None, host: {
                         '[class]': 'classes()',

package/fesm2022/ngwr-card.mjs

@@ -53,10 +53,10 @@ class WrCard {
         return parts.join(' ');
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCard, isStandalone: true, selector: "wr-card", inputs: { bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, hoverable: { classPropertyName: "hoverable", publicName: "hoverable", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "attr.aria-busy": "loading() ? true : null" } }, ngImport: i0, template: "<ng-content select=\"wr-card-header\" />\n<div class=\"wr-card__body\"><ng-content /></div>\n<ng-content select=\"wr-card-footer\" />\n@if (loading()) {\n  <div class=\"wr-card__loading\" aria-hidden=\"true\">\n    <span class=\"wr-card__spinner\"></span>\n  </div>\n}\n", styles: [":root{--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #f51c6a;--wr-color-secondary-rgb: 245, 28, 106;--wr-color-secondary-contrast: #ffffff;--wr-color-secondary-dark: rgb(237.0569620253, 10.4430379747, 91.8987341772);--wr-color-secondary-darker: rgb(212.6329113924, 9.3670886076, 82.4303797468);--wr-color-secondary-light: rgb(246.0759493671, 52.4240506329, 122.0316455696);--wr-color-secondary-lighter: rgb(247.1518987342, 76.8481012658, 138.0632911392);--wr-color-success: #00a400;--wr-color-success-rgb: 0, 164, 0;--wr-color-success-contrast: #ffffff;--wr-color-success-dark: rgb(0, 138.5, 0);--wr-color-success-darker: #007100;--wr-color-success-light: rgb(0, 189.5, 0);--wr-color-success-lighter: #00d700;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #171616;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #fa383e;--wr-color-danger-rgb: 250, 56, 62;--wr-color-danger-contrast: #ffffff;--wr-color-danger-dark: rgb(249.375, 31.125, 37.875);--wr-color-danger-darker: rgb(248.75, 6.25, 13.75);--wr-color-danger-light: rgb(250.625, 80.875, 86.125);--wr-color-danger-lighter: rgb(251.25, 105.75, 110.25);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #171616;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #8594a4;--wr-color-medium-rgb: 133, 148, 164;--wr-color-medium-contrast: #ffffff;--wr-color-medium-dark: rgb(118.3943661972, 135.1901408451, 153.1056338028);--wr-color-medium-darker: rgb(105.0985915493, 122.4225352113, 140.9014084507);--wr-color-medium-light: rgb(147.6056338028, 160.8098591549, 174.8943661972);--wr-color-medium-lighter: rgb(162.2112676056, 173.6197183099, 185.7887323944);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-medium: #9aa6b8;--wr-color-medium-rgb: 154, 166, 184;--wr-color-primary: #5b85ff;--wr-color-primary-rgb: 91, 133, 255;--wr-color-primary-light: #7a9eff;--wr-color-primary-dark: #2f56c9;--wr-color-primary-lighter: #99b6ff;--wr-color-primary-darker: #1f3a99;--wr-color-success: #34c759;--wr-color-success-rgb: 52, 199, 89;--wr-color-warning: #ffcc33;--wr-color-warning-rgb: 255, 204, 51;--wr-color-danger: #ff5c5c;--wr-color-danger-rgb: 255, 92, 92;--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-sidebar__entry:focus-visible,.wr-sidebar__item:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-anchor__link:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-collapse__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-mention__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-segmented__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-back-top:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-stepper__step:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-toast__close:focus-visible,.wr-toast__copy:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-window__chrome-action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-dropdown-item:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-card{--wr-card-bg: var(--wr-color-white);--wr-card-color: var(--wr-color-dark);--wr-card-border: var(--wr-color-light);--wr-card-radius: var(--wr-border-radius-base);--wr-card-padding-y: 1rem;--wr-card-padding-x: 1.25rem;--wr-card-shadow: var(--wr-shadow-xs);--wr-card-shadow-hover: var(--wr-shadow-overlay);position:relative;display:flex;flex-direction:column;background:var(--wr-card-bg);color:var(--wr-card-color);border-radius:var(--wr-card-radius)}@supports (corner-shape: squircle){.wr-card{corner-shape:squircle;border-radius:calc(var(--wr-card-radius) * 1.85)}}.wr-card{box-shadow:var(--wr-card-shadow);font-family:var(--wr-font-family-base);transition:box-shadow var(--wr-transition-base),transform var(--wr-transition-base)}.wr-card--bordered{border:1px solid var(--wr-card-border)}.wr-card--hoverable{cursor:pointer}.wr-card--hoverable:hover{box-shadow:var(--wr-card-shadow-hover);transform:translateY(-1px)}.wr-card--compact{--wr-card-padding-y: .5rem;--wr-card-padding-x: .75rem}.wr-card--loading .wr-card__body{opacity:.6}.wr-card__header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:var(--wr-card-padding-y) var(--wr-card-padding-x);border-bottom:1px solid var(--wr-card-border);font-weight:500}.wr-card__body{flex:1 1 auto;padding:var(--wr-card-padding-y) var(--wr-card-padding-x)}.wr-card__footer{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;padding:var(--wr-card-padding-y) var(--wr-card-padding-x);border-top:1px solid var(--wr-card-border)}.wr-card__loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:var(--wr-card-radius)}@supports (corner-shape: squircle){.wr-card__loading{corner-shape:squircle;border-radius:calc(var(--wr-card-radius) * 1.85)}}.wr-card__loading{background:#ffffff80;pointer-events:none}.wr-card__spinner{width:1.5rem;height:1.5rem;border:2px solid rgb(var(--wr-color-medium-rgb)/30%);border-top-color:var(--wr-color-primary);border-radius:50%;animation:wr-card-spin .7s linear infinite}@keyframes wr-card-spin{to{transform:rotate(360deg)}}\n"], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrCard, isStandalone: true, selector: "wr-card", inputs: { bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, hoverable: { classPropertyName: "hoverable", publicName: "hoverable", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, compact: { classPropertyName: "compact", publicName: "compact", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "attr.aria-busy": "loading() ? true : null" } }, ngImport: i0, template: "<ng-content select=\"wr-card-header\" />\n<div class=\"wr-card__body\"><ng-content /></div>\n<ng-content select=\"wr-card-footer\" />\n@if (loading()) {\n  <div class=\"wr-card__loading\" aria-hidden=\"true\">\n    <span class=\"wr-card__spinner\"></span>\n  </div>\n}\n", styles: [":root{--wr-color-white: #ffffff;--wr-color-white-rgb: 255, 255, 255;--wr-color-black: #000000;--wr-color-black-rgb: 0, 0, 0;--wr-color-backdrop-rgb: 0, 0, 0;--wr-color-primary: #3969e2;--wr-color-primary-rgb: 57, 105, 226;--wr-color-primary-contrast: #ffffff;--wr-color-primary-dark: rgb(34.7577092511, 88.1497797357, 222.7422907489);--wr-color-primary-darker: rgb(29.6387665198, 78.6960352423, 202.3612334802);--wr-color-primary-light: rgb(79.2422907489, 121.8502202643, 229.2577092511);--wr-color-primary-lighter: rgb(101.4845814978, 138.7004405286, 232.5154185022);--wr-color-secondary: #f51c6a;--wr-color-secondary-rgb: 245, 28, 106;--wr-color-secondary-contrast: #ffffff;--wr-color-secondary-dark: rgb(237.0569620253, 10.4430379747, 91.8987341772);--wr-color-secondary-darker: rgb(212.6329113924, 9.3670886076, 82.4303797468);--wr-color-secondary-light: rgb(246.0759493671, 52.4240506329, 122.0316455696);--wr-color-secondary-lighter: rgb(247.1518987342, 76.8481012658, 138.0632911392);--wr-color-success: #00a400;--wr-color-success-rgb: 0, 164, 0;--wr-color-success-contrast: #ffffff;--wr-color-success-dark: rgb(0, 138.5, 0);--wr-color-success-darker: #007100;--wr-color-success-light: rgb(0, 189.5, 0);--wr-color-success-lighter: #00d700;--wr-color-warning: #ffba00;--wr-color-warning-rgb: 255, 186, 0;--wr-color-warning-contrast: #171616;--wr-color-warning-dark: rgb(229.5, 167.4, 0);--wr-color-warning-darker: rgb(204, 148.8, 0);--wr-color-warning-light: rgb(255, 192.9, 25.5);--wr-color-warning-lighter: rgb(255, 199.8, 51);--wr-color-danger: #fa383e;--wr-color-danger-rgb: 250, 56, 62;--wr-color-danger-contrast: #ffffff;--wr-color-danger-dark: rgb(249.375, 31.125, 37.875);--wr-color-danger-darker: rgb(248.75, 6.25, 13.75);--wr-color-danger-light: rgb(250.625, 80.875, 86.125);--wr-color-danger-lighter: rgb(251.25, 105.75, 110.25);--wr-color-light: #cbd5e1;--wr-color-light-rgb: 203, 213, 225;--wr-color-light-contrast: #171616;--wr-color-light-dark: rgb(186.8292682927, 199.9390243902, 215.6707317073);--wr-color-light-darker: rgb(170.6585365854, 186.8780487805, 206.3414634146);--wr-color-light-light: rgb(219.1707317073, 226.0609756098, 234.3292682927);--wr-color-light-lighter: rgb(235.3414634146, 239.1219512195, 243.6585365854);--wr-color-medium: #8594a4;--wr-color-medium-rgb: 133, 148, 164;--wr-color-medium-contrast: #ffffff;--wr-color-medium-dark: rgb(118.3943661972, 135.1901408451, 153.1056338028);--wr-color-medium-darker: rgb(105.0985915493, 122.4225352113, 140.9014084507);--wr-color-medium-light: rgb(147.6056338028, 160.8098591549, 174.8943661972);--wr-color-medium-lighter: rgb(162.2112676056, 173.6197183099, 185.7887323944);--wr-color-dark: #0f172a;--wr-color-dark-rgb: 15, 23, 42;--wr-color-dark-contrast: #ffffff;--wr-color-dark-dark: rgb(8.2894736842, 12.7105263158, 23.2105263158);--wr-color-dark-darker: rgb(1.5789473684, 2.4210526316, 4.4210526316);--wr-color-dark-light: rgb(21.7105263158, 33.2894736842, 60.7894736842);--wr-color-dark-lighter: rgb(28.4210526316, 43.5789473684, 79.5789473684)}:root{--wr-border-radius-sm: .375rem;--wr-border-radius-base: .625rem;--wr-border-radius-lg: 1rem;--wr-border-radius-pill: 50rem;--wr-ease-linear: linear;--wr-ease-out: cubic-bezier(.16, 1, .3, 1);--wr-ease-in: cubic-bezier(.7, 0, .84, 0);--wr-ease-in-out: cubic-bezier(.65, 0, .35, 1);--wr-ease-spring: cubic-bezier(.34, 1.56, .64, 1);--wr-duration-fast: .1s;--wr-duration-base: .15s;--wr-duration-slow: .3s;--wr-duration-slower: .5s;--wr-transition-short: var(--wr-duration-fast) var(--wr-ease-out);--wr-transition-base: var(--wr-duration-base) var(--wr-ease-linear);--wr-transition-long: var(--wr-duration-slow) var(--wr-ease-out);--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 5%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 15%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 12%), 0 2px 4px rgb(0 0 0 / 6%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 18%);--wr-shadow-modal: 0 20px 48px rgb(0 0 0 / 25%);--wr-z-overlay: 1000;--wr-z-window: 1100;--wr-z-top: 9999;--wr-overlay-duration: var(--wr-duration-base);--wr-overlay-ease: var(--wr-ease-out);--wr-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;--wr-font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--wr-text-xs: .75rem;--wr-text-sm: .875rem;--wr-text-base: 1rem;--wr-text-lg: 1.125rem;--wr-text-xl: 1.25rem;--wr-text-2xl: 1.5rem;--wr-text-3xl: 1.875rem;--wr-text-4xl: 2.25rem;--wr-text-5xl: 3rem;--wr-font-weight-thin: 200;--wr-font-weight-light: 300;--wr-font-weight-regular: 400;--wr-font-weight-medium: 500;--wr-font-weight-semibold: 600;--wr-font-weight-bold: 700;--wr-font-weight-extrabold: 800;--wr-leading-none: 1;--wr-leading-tight: 1.25;--wr-leading-snug: 1.375;--wr-leading-normal: 1.5;--wr-leading-relaxed: 1.625;--wr-leading-loose: 2;--wr-tracking-tighter: -.05em;--wr-tracking-tight: -.025em;--wr-tracking-normal: 0;--wr-tracking-wide: .025em;--wr-tracking-wider: .05em;--wr-tracking-widest: .1em}@keyframes wr-overlay-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}[data-theme=dark]{--wr-color-white: #0b1120;--wr-color-white-rgb: 11, 17, 32;--wr-color-dark: #e6ebf3;--wr-color-dark-rgb: 230, 235, 243;--wr-color-dark-contrast: #0b1120;--wr-color-white-contrast: #e6ebf3;--wr-color-light: #262f44;--wr-color-light-rgb: 38, 47, 68;--wr-color-light-contrast: #e6ebf3;--wr-color-light-lighter: #1a2236;--wr-color-light-darker: #3a4661;--wr-color-medium: #9aa6b8;--wr-color-medium-rgb: 154, 166, 184;--wr-color-primary: #5b85ff;--wr-color-primary-rgb: 91, 133, 255;--wr-color-primary-light: #7a9eff;--wr-color-primary-dark: #2f56c9;--wr-color-primary-lighter: #99b6ff;--wr-color-primary-darker: #1f3a99;--wr-color-success: #34c759;--wr-color-success-rgb: 52, 199, 89;--wr-color-warning: #ffcc33;--wr-color-warning-rgb: 255, 204, 51;--wr-color-danger: #ff5c5c;--wr-color-danger-rgb: 255, 92, 92;--wr-shadow-xs: 0 1px 2px rgb(0 0 0 / 35%);--wr-shadow-sm: 0 2px 8px rgb(0 0 0 / 45%);--wr-shadow-overlay: 0 8px 24px rgb(0 0 0 / 50%), 0 2px 4px rgb(0 0 0 / 35%);--wr-shadow-float: 0 8px 24px rgb(0 0 0 / 55%);--wr-shadow-modal: 0 24px 56px rgb(0 0 0 / 60%);color-scheme:dark}.wr-tabs__tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-sidebar__entry:focus-visible,.wr-sidebar__item:focus-visible,.wr-sidebar__group-toggle:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-anchor__link:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-collapse__header:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-command-palette__option:focus-visible,.wr-command-palette__panel input:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-mention__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-segmented__option:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-back-top:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-carousel__nav:focus-visible,.wr-carousel__dot:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-speed-dial__trigger:focus-visible,.wr-speed-dial__action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-stepper__step:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-toast__close:focus-visible,.wr-toast__copy:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-window__chrome-action:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-date-picker__trigger:focus-visible,.wr-time-picker__step:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-dropdown-item:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.25)}.wr-card{--wr-card-bg: var(--wr-color-white);--wr-card-color: var(--wr-color-dark);--wr-card-border: var(--wr-color-light);--wr-card-radius: var(--wr-border-radius-base);--wr-card-padding-y: 1rem;--wr-card-padding-x: 1.25rem;--wr-card-shadow: var(--wr-shadow-xs);--wr-card-shadow-hover: var(--wr-shadow-overlay);position:relative;display:flex;flex-direction:column;background:var(--wr-card-bg);color:var(--wr-card-color);border-radius:var(--wr-card-radius)}@supports (corner-shape: squircle){.wr-card{corner-shape:squircle;border-radius:calc(var(--wr-card-radius) * 1.85)}}.wr-card{box-shadow:var(--wr-card-shadow);font-family:var(--wr-font-family-base);transition:box-shadow var(--wr-transition-base),transform var(--wr-transition-base)}.wr-card--bordered{border:1px solid var(--wr-card-border)}.wr-card--hoverable{cursor:pointer}.wr-card--hoverable:hover{box-shadow:var(--wr-card-shadow-hover);transform:translateY(-1px)}.wr-card--compact{--wr-card-padding-y: .5rem;--wr-card-padding-x: .75rem}.wr-card--loading .wr-card__body{opacity:.6}.wr-card__header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:var(--wr-card-padding-y) var(--wr-card-padding-x);border-bottom:1px solid var(--wr-card-border);font-weight:500}.wr-card__body{flex:1 1 auto;padding:var(--wr-card-padding-y) var(--wr-card-padding-x)}.wr-card__footer{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;padding:var(--wr-card-padding-y) var(--wr-card-padding-x);border-top:1px solid var(--wr-card-border)}.wr-card__loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:var(--wr-card-radius)}@supports (corner-shape: squircle){.wr-card__loading{corner-shape:squircle;border-radius:calc(var(--wr-card-radius) * 1.85)}}.wr-card__loading{background:#ffffff80;pointer-events:none}.wr-card__spinner{width:1.5rem;height:1.5rem;border:2px solid rgb(var(--wr-color-medium-rgb)/30%);border-top-color:var(--wr-color-primary);border-radius:50%;animation:wr-card-spin .7s linear infinite}@keyframes wr-card-spin{to{transform:rotate(360deg)}}\n"], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCard, decorators: [{
             type: Component,
             args: [{ selector: 'wr-card', encapsulation: ViewEncapsulation.None, host: {
                         '[class]': 'classes()',
@@ -65,10 +65,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
         }], propDecorators: { bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], hoverable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverable", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], compact: [{ type: i0.Input, args: [{ isSignal: true, alias: "compact", required: false }] }] } });
 /** Header slot — projects content under `.wr-card__header`. */
 class WrCardHeader {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCardHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", type: WrCardHeader, isStandalone: true, selector: "wr-card-header", host: { classAttribute: "wr-card__header" }, ngImport: i0, template: `<ng-content />`, isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCardHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.2", type: WrCardHeader, isStandalone: true, selector: "wr-card-header", host: { classAttribute: "wr-card__header" }, ngImport: i0, template: `<ng-content />`, isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCardHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCardHeader, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-card-header',
@@ -79,10 +79,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
         }] });
 /** Footer slot — projects content under `.wr-card__footer`. */
 class WrCardFooter {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCardFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", type: WrCardFooter, isStandalone: true, selector: "wr-card-footer", host: { classAttribute: "wr-card__footer" }, ngImport: i0, template: `<ng-content />`, isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCardFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.2", type: WrCardFooter, isStandalone: true, selector: "wr-card-footer", host: { classAttribute: "wr-card__footer" }, ngImport: i0, template: `<ng-content />`, isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCardFooter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCardFooter, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-card-footer',

package/fesm2022/ngwr-carousel.mjs

@@ -13,10 +13,10 @@ import { ViewEncapsulation, Component, model, input, contentChildren, computed,
  * project — image, card, video, anything.
  */
 class WrCarouselSlide {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCarouselSlide, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", type: WrCarouselSlide, isStandalone: true, selector: "wr-carousel-slide", host: { attributes: { "role": "group", "aria-roledescription": "slide" }, classAttribute: "wr-carousel-slide" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCarouselSlide, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.2", type: WrCarouselSlide, isStandalone: true, selector: "wr-carousel-slide", host: { attributes: { "role": "group", "aria-roledescription": "slide" }, classAttribute: "wr-carousel-slide" }, ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCarouselSlide, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCarouselSlide, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-carousel-slide',
@@ -112,10 +112,10 @@ class WrCarousel {
     prev() {
         this.goTo(this.active() - 1);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCarousel, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCarousel, isStandalone: true, selector: "wr-carousel", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, showArrows: { classPropertyName: "showArrows", publicName: "showArrows", isSignal: true, isRequired: false, transformFunction: null }, showDots: { classPropertyName: "showDots", publicName: "showDots", isSignal: true, isRequired: false, transformFunction: null }, autoplay: { classPropertyName: "autoplay", publicName: "autoplay", isSignal: true, isRequired: false, transformFunction: null }, intervalMs: { classPropertyName: "intervalMs", publicName: "intervalMs", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { active: "activeChange" }, host: { classAttribute: "wr-carousel" }, queries: [{ propertyName: "slides", predicate: WrCarouselSlide, isSignal: true }], ngImport: i0, template: "<div\n  class=\"wr-carousel__viewport\"\n  aria-roledescription=\"carousel\"\n  (mouseenter)=\"onMouseEnter()\"\n  (mouseleave)=\"onMouseLeave()\"\n>\n  <div class=\"wr-carousel__track\" [style.transform]=\"trackStyle()\">\n    <ng-content />\n  </div>\n</div>\n\n@if (showArrows() && count() > 1) {\n  <button type=\"button\" class=\"wr-carousel__nav wr-carousel__nav--prev\" aria-label=\"Previous slide\" (click)=\"prev()\">\n    <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" aria-hidden=\"true\">\n      <path d=\"M9 2 L4 7 L9 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n    </svg>\n  </button>\n  <button type=\"button\" class=\"wr-carousel__nav wr-carousel__nav--next\" aria-label=\"Next slide\" (click)=\"next()\">\n    <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" aria-hidden=\"true\">\n      <path d=\"M5 2 L10 7 L5 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n    </svg>\n  </button>\n}\n\n@if (showDots() && count() > 1) {\n  <div class=\"wr-carousel__dots\" role=\"group\" aria-label=\"Carousel pagination\">\n    @for (slide of slides(); track $index) {\n      <button\n        type=\"button\"\n        class=\"wr-carousel__dot\"\n        [class.wr-carousel__dot--active]=\"$index === active()\"\n        [attr.aria-current]=\"$index === active() ? 'true' : null\"\n        [attr.aria-label]=\"`Go to slide ${$index + 1}`\"\n        (click)=\"goTo($index)\"\n      ></button>\n    }\n  </div>\n}\n", encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCarousel, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrCarousel, isStandalone: true, selector: "wr-carousel", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, showArrows: { classPropertyName: "showArrows", publicName: "showArrows", isSignal: true, isRequired: false, transformFunction: null }, showDots: { classPropertyName: "showDots", publicName: "showDots", isSignal: true, isRequired: false, transformFunction: null }, autoplay: { classPropertyName: "autoplay", publicName: "autoplay", isSignal: true, isRequired: false, transformFunction: null }, intervalMs: { classPropertyName: "intervalMs", publicName: "intervalMs", isSignal: true, isRequired: false, transformFunction: null }, loop: { classPropertyName: "loop", publicName: "loop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { active: "activeChange" }, host: { classAttribute: "wr-carousel" }, queries: [{ propertyName: "slides", predicate: WrCarouselSlide, isSignal: true }], ngImport: i0, template: "<div\n  class=\"wr-carousel__viewport\"\n  aria-roledescription=\"carousel\"\n  (mouseenter)=\"onMouseEnter()\"\n  (mouseleave)=\"onMouseLeave()\"\n>\n  <div class=\"wr-carousel__track\" [style.transform]=\"trackStyle()\">\n    <ng-content />\n  </div>\n</div>\n\n@if (showArrows() && count() > 1) {\n  <button type=\"button\" class=\"wr-carousel__nav wr-carousel__nav--prev\" aria-label=\"Previous slide\" (click)=\"prev()\">\n    <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" aria-hidden=\"true\">\n      <path d=\"M9 2 L4 7 L9 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n    </svg>\n  </button>\n  <button type=\"button\" class=\"wr-carousel__nav wr-carousel__nav--next\" aria-label=\"Next slide\" (click)=\"next()\">\n    <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" aria-hidden=\"true\">\n      <path d=\"M5 2 L10 7 L5 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n    </svg>\n  </button>\n}\n\n@if (showDots() && count() > 1) {\n  <div class=\"wr-carousel__dots\" role=\"group\" aria-label=\"Carousel pagination\">\n    @for (slide of slides(); track $index) {\n      <button\n        type=\"button\"\n        class=\"wr-carousel__dot\"\n        [class.wr-carousel__dot--active]=\"$index === active()\"\n        [attr.aria-current]=\"$index === active() ? 'true' : null\"\n        [attr.aria-label]=\"`Go to slide ${$index + 1}`\"\n        (click)=\"goTo($index)\"\n      ></button>\n    }\n  </div>\n}\n", encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCarousel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCarousel, decorators: [{
             type: Component,
             args: [{ selector: 'wr-carousel', encapsulation: ViewEncapsulation.None, host: { class: 'wr-carousel' }, template: "<div\n  class=\"wr-carousel__viewport\"\n  aria-roledescription=\"carousel\"\n  (mouseenter)=\"onMouseEnter()\"\n  (mouseleave)=\"onMouseLeave()\"\n>\n  <div class=\"wr-carousel__track\" [style.transform]=\"trackStyle()\">\n    <ng-content />\n  </div>\n</div>\n\n@if (showArrows() && count() > 1) {\n  <button type=\"button\" class=\"wr-carousel__nav wr-carousel__nav--prev\" aria-label=\"Previous slide\" (click)=\"prev()\">\n    <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" aria-hidden=\"true\">\n      <path d=\"M9 2 L4 7 L9 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n    </svg>\n  </button>\n  <button type=\"button\" class=\"wr-carousel__nav wr-carousel__nav--next\" aria-label=\"Next slide\" (click)=\"next()\">\n    <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" aria-hidden=\"true\">\n      <path d=\"M5 2 L10 7 L5 12\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n    </svg>\n  </button>\n}\n\n@if (showDots() && count() > 1) {\n  <div class=\"wr-carousel__dots\" role=\"group\" aria-label=\"Carousel pagination\">\n    @for (slide of slides(); track $index) {\n      <button\n        type=\"button\"\n        class=\"wr-carousel__dot\"\n        [class.wr-carousel__dot--active]=\"$index === active()\"\n        [attr.aria-current]=\"$index === active() ? 'true' : null\"\n        [attr.aria-label]=\"`Go to slide ${$index + 1}`\"\n        (click)=\"goTo($index)\"\n      ></button>\n    }\n  </div>\n}\n" }]
         }], ctorParameters: () => [], propDecorators: { active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }, { type: i0.Output, args: ["activeChange"] }], showArrows: [{ type: i0.Input, args: [{ isSignal: true, alias: "showArrows", required: false }] }], showDots: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDots", required: false }] }], autoplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoplay", required: false }] }], intervalMs: [{ type: i0.Input, args: [{ isSignal: true, alias: "intervalMs", required: false }] }], loop: [{ type: i0.Input, args: [{ isSignal: true, alias: "loop", required: false }] }], slides: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => WrCarouselSlide), { isSignal: true }] }] } });

package/fesm2022/ngwr-cascader.mjs

@@ -250,8 +250,8 @@ class WrCascader {
         this.overlayRef.dispose();
         this.overlayRef = null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCascader, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCascader, isStandalone: true, selector: "wr-cascader", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, changeOnSelect: { classPropertyName: "changeOnSelect", publicName: "changeOnSelect", isSignal: true, isRequired: false, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCascader, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrCascader, isStandalone: true, selector: "wr-cascader", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, changeOnSelect: { classPropertyName: "changeOnSelect", publicName: "changeOnSelect", isSignal: true, isRequired: false, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 // eslint-disable-next-line @angular-eslint/no-forward-ref
@@ -260,7 +260,7 @@ class WrCascader {
             },
         ], viewQueries: [{ propertyName: "panelTpl", first: true, predicate: ["panelTpl"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"wr-cascader__trigger\"\n  role=\"combobox\"\n  [disabled]=\"isDisabled()\"\n  [attr.aria-haspopup]=\"'menu'\"\n  [attr.aria-expanded]=\"open()\"\n  [attr.aria-controls]=\"panelId\"\n  (click)=\"onTriggerClick()\"\n  (blur)=\"onTouched()\"\n>\n  @if (displayLabel(); as label) {\n    <span class=\"wr-cascader__value\">{{ label }}</span>\n  } @else {\n    <span class=\"wr-cascader__placeholder\">{{ placeholder() }}</span>\n  }\n\n  @if (clearable() && hasSelection() && !isDisabled()) {\n    <span\n      class=\"wr-cascader__clear\"\n      role=\"button\"\n      aria-label=\"Clear selection\"\n      tabindex=\"-1\"\n      (click)=\"clearSelection($event)\"\n      (keydown.enter)=\"clearSelection($event)\"\n      (keydown.space)=\"clearSelection($event)\"\n    >\n      <svg\n        class=\"wr-icon__svg\"\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=\"M18 6 6 18\" />\n        <path d=\"m6 6 12 12\" />\n      </svg>\n    </span>\n  }\n\n  <svg\n    class=\"wr-icon__svg wr-cascader__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=\"m6 9 6 6 6-6\" />\n  </svg>\n</button>\n\n<ng-template #panelTpl>\n  <div class=\"wr-cascader-panel\" role=\"menu\" [attr.id]=\"panelId\">\n    @for (col of columns(); track $index; let colIndex = $index) {\n      <ul class=\"wr-cascader__col\" role=\"menu\">\n        @for (opt of col; track opt.value) {\n          <li\n            class=\"wr-cascader__opt\"\n            role=\"menuitem\"\n            [class.wr-cascader__opt--active]=\"isActiveAt(colIndex, opt.value)\"\n            [class.wr-cascader__opt--disabled]=\"opt.disabled\"\n            [attr.tabindex]=\"opt.disabled ? -1 : 0\"\n            [attr.aria-disabled]=\"opt.disabled ? true : null\"\n            (click)=\"onOptionClick(colIndex, opt, $event)\"\n            (keydown.enter)=\"onOptionClick(colIndex, opt, $event)\"\n            (keydown.space)=\"onOptionClick(colIndex, opt, $event)\"\n          >\n            <span class=\"wr-cascader__opt-label\">{{ opt.label }}</span>\n            @if (opt.children?.length) {\n              <svg\n                class=\"wr-icon__svg wr-cascader__opt-arrow\"\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          </li>\n        }\n      </ul>\n    }\n  </div>\n</ng-template>\n", styles: [".wr-cascader{--wr-cascader-color: var(--wr-color-dark);--wr-cascader-bg: var(--wr-color-white);--wr-cascader-border: var(--wr-color-light);--wr-cascader-radius: var(--wr-border-radius-base);--wr-cascader-padding-y: .4375rem;--wr-cascader-padding-x: .75rem;--wr-cascader-font-size: .875rem;--wr-cascader-line-height: 1.25rem;--wr-cascader-col-width: 12rem;--wr-cascader-max-height: 16rem;display:inline-flex;vertical-align:middle}.wr-cascader--disabled{--wr-cascader-color: var(--wr-color-medium);--wr-cascader-bg: rgba(var(--wr-color-light-rgb), .35)}.wr-cascader__trigger{display:inline-flex;align-items:center;gap:.5rem;width:100%;min-width:12rem;appearance:none;background:var(--wr-cascader-bg);color:var(--wr-cascader-color);border:1px solid var(--wr-cascader-border);border-radius:var(--wr-cascader-radius);padding:var(--wr-cascader-padding-y) var(--wr-cascader-padding-x);font-family:var(--wr-font-family-base);font-size:var(--wr-cascader-font-size);line-height:var(--wr-cascader-line-height);cursor:pointer;text-align:left;transition:border-color var(--wr-transition-base),box-shadow var(--wr-transition-base)}.wr-cascader__trigger:focus-visible{outline:none;border-color:var(--wr-color-primary);box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.15)}.wr-cascader__trigger:disabled{cursor:not-allowed}.wr-cascader--open .wr-cascader__trigger{border-color:var(--wr-color-primary);box-shadow:0 0 0 3px rgba(var(--wr-color-primary-rgb),.15)}.wr-cascader__value,.wr-cascader__placeholder{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wr-cascader__placeholder{color:rgba(var(--wr-color-medium-rgb),.85)}.wr-cascader__chevron{--wr-icon-size: 1rem;flex:0 0 auto;color:var(--wr-color-medium);transition:transform var(--wr-transition-base)}.wr-cascader--open .wr-cascader__chevron{transform:rotate(180deg)}.wr-cascader__clear{--wr-icon-size: .875rem;display:inline-flex;align-items:center;justify-content:center;width:1.125rem;height:1.125rem;border-radius:999px;color:var(--wr-color-medium);cursor:pointer;transition:background .12s ease,color .12s ease}.wr-cascader__clear:hover{background:rgba(var(--wr-color-dark-rgb),.06);color:var(--wr-color-dark)}.wr-cascader-overlay{padding-top:.25rem}.wr-cascader-panel{display:flex;background:var(--wr-color-white);border:1px solid var(--wr-color-light);border-radius:var(--wr-border-radius-base);box-shadow:var(--wr-shadow-overlay);font-family:var(--wr-font-family-base);font-size:.875rem;overflow:hidden}.wr-cascader-panel .wr-cascader__col{list-style:none;margin:0;padding:.25rem 0;width:var(--wr-cascader-col-width, 12rem);max-height:var(--wr-cascader-max-height, 16rem);overflow-y:auto}.wr-cascader-panel .wr-cascader__col+.wr-cascader__col{border-left:1px solid var(--wr-color-light)}.wr-cascader-panel .wr-cascader__opt{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;color:var(--wr-color-dark);cursor:pointer;transition:background .12s ease}.wr-cascader-panel .wr-cascader__opt:hover{background:rgba(var(--wr-color-light-rgb),.5)}.wr-cascader-panel .wr-cascader__opt--active{background:rgba(var(--wr-color-primary-rgb),.08);color:var(--wr-color-primary)}.wr-cascader-panel .wr-cascader__opt--disabled{color:var(--wr-color-medium);cursor:not-allowed;opacity:.55}.wr-cascader-panel .wr-cascader__opt--disabled:hover{background:transparent}.wr-cascader-panel .wr-cascader__opt-label{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wr-cascader-panel .wr-cascader__opt-arrow{--wr-icon-size: .875rem;flex:0 0 auto;color:var(--wr-color-medium)}\n"], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCascader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCascader, decorators: [{
             type: Component,
             args: [{ selector: 'wr-cascader', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, providers: [
                         {

package/fesm2022/ngwr-checkbox.mjs

@@ -129,8 +129,8 @@ class WrCheckbox {
     onInputBlur() {
         this.onTouched();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCheckbox, isStandalone: true, selector: "wr-checkbox", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrCheckbox, isStandalone: true, selector: "wr-checkbox", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 // eslint-disable-next-line @angular-eslint/no-forward-ref
@@ -139,7 +139,7 @@ class WrCheckbox {
             },
         ], ngImport: i0, template: "<label class=\"wr-checkbox__label\" [for]=\"id()\">\n  <input\n    class=\"wr-checkbox__input\"\n    type=\"checkbox\"\n    [id]=\"id()\"\n    [checked]=\"checked()\"\n    [disabled]=\"effectiveDisabled()\"\n    (change)=\"onInputChange($event)\"\n    (blur)=\"onInputBlur()\"\n  />\n\n  <span class=\"wr-checkbox__box\" aria-hidden=\"true\">\n    @if (icon(); as iconName) {\n      <wr-icon class=\"wr-checkbox__icon\" [name]=\"iconName\" />\n    } @else {\n      <svg viewBox=\"0 0 16 16\" class=\"wr-checkbox__mark\">\n        <polyline\n          points=\"3.5 8.5 6.5 11.5 12.5 5\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n        />\n      </svg>\n    }\n  </span>\n\n  <span class=\"wr-checkbox__text\">\n    <ng-content />\n  </span>\n</label>\n", dependencies: [{ kind: "component", type: WrIcon, selector: "wr-icon", inputs: ["name"] }], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCheckbox, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCheckbox, decorators: [{
             type: Component,
             args: [{ selector: 'wr-checkbox', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, imports: [WrIcon], providers: [
                         {
@@ -215,8 +215,8 @@ class WrCheckboxGroup {
     setDisabledState(isDisabled) {
         this.disabledFromCva.set(coerceBooleanProperty(isDisabled));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCheckboxGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: WrCheckboxGroup, isStandalone: true, selector: "wr-checkbox-group", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, classAttribute: "wr-checkbox-group" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCheckboxGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.2", type: WrCheckboxGroup, isStandalone: true, selector: "wr-checkbox-group", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, classAttribute: "wr-checkbox-group" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 // eslint-disable-next-line @angular-eslint/no-forward-ref
@@ -230,7 +230,7 @@ class WrCheckboxGroup {
             },
         ], ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCheckboxGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCheckboxGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-checkbox-group',

package/fesm2022/ngwr-circular-text.mjs

@@ -149,10 +149,10 @@ class WrCircularText {
         this.rotation = this.spinEl().nativeElement.animate([{ transform: 'rotate(0deg)' }, { transform: 'rotate(360deg)' }], { duration: newDurMs, iterations: Infinity, easing: 'linear' });
         this.rotation.currentTime = ratio * newDurMs;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCircularText, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCircularText, isStandalone: true, selector: "wr-circular-text", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, spinDuration: { classPropertyName: "spinDuration", publicName: "spinDuration", isSignal: true, isRequired: false, transformFunction: null }, onHover: { classPropertyName: "onHover", publicName: "onHover", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.wr-circular-text--bonkers": "onHover() === 'goBonkers'" }, classAttribute: "wr-circular-text" }, viewQueries: [{ propertyName: "spinEl", first: true, predicate: ["spin"], descendants: true, isSignal: true }], ngImport: i0, template: "<span class=\"wr-circular-text__spin\" #spin>\n  @for (c of chars(); track $index) {\n    <span class=\"wr-circular-text__char\" [style.transform]=\"c.transform\">{{ c.ch }}</span>\n  }\n</span>\n", styles: [".wr-circular-text{--wr-circular-text-size: 12rem;--wr-circular-text-radius: calc(var(--wr-circular-text-size) / 2);position:relative;display:inline-block;width:var(--wr-circular-text-size);height:var(--wr-circular-text-size);border-radius:50%;font-weight:700;text-align:center;-webkit-user-select:none;user-select:none;transition:transform .6s cubic-bezier(.2,.9,.3,1.4)}.wr-circular-text__spin{position:absolute;inset:0;will-change:transform}.wr-circular-text__char{position:absolute;top:50%;left:50%;display:inline-block;margin-left:-.5em;margin-top:-.5em;line-height:1}.wr-circular-text--bonkers:hover{transform:scale(.8)}\n"], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCircularText, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrCircularText, isStandalone: true, selector: "wr-circular-text", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: true, transformFunction: null }, spinDuration: { classPropertyName: "spinDuration", publicName: "spinDuration", isSignal: true, isRequired: false, transformFunction: null }, onHover: { classPropertyName: "onHover", publicName: "onHover", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.wr-circular-text--bonkers": "onHover() === 'goBonkers'" }, classAttribute: "wr-circular-text" }, viewQueries: [{ propertyName: "spinEl", first: true, predicate: ["spin"], descendants: true, isSignal: true }], ngImport: i0, template: "<span class=\"wr-circular-text__spin\" #spin>\n  @for (c of chars(); track $index) {\n    <span class=\"wr-circular-text__char\" [style.transform]=\"c.transform\">{{ c.ch }}</span>\n  }\n</span>\n", styles: [".wr-circular-text{--wr-circular-text-size: 12rem;--wr-circular-text-radius: calc(var(--wr-circular-text-size) / 2);position:relative;display:inline-block;width:var(--wr-circular-text-size);height:var(--wr-circular-text-size);border-radius:50%;font-weight:700;text-align:center;-webkit-user-select:none;user-select:none;transition:transform .6s cubic-bezier(.2,.9,.3,1.4)}.wr-circular-text__spin{position:absolute;inset:0;will-change:transform}.wr-circular-text__char{position:absolute;top:50%;left:50%;display:inline-block;margin-left:-.5em;margin-top:-.5em;line-height:1}.wr-circular-text--bonkers:hover{transform:scale(.8)}\n"], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCircularText, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCircularText, decorators: [{
             type: Component,
             args: [{ selector: 'wr-circular-text', encapsulation: ViewEncapsulation.None, host: {
                         class: 'wr-circular-text',

package/fesm2022/ngwr-click-spark.mjs

@@ -144,10 +144,10 @@ class WrClickSpark {
         raf = requestAnimationFrame(draw);
         this.destroyRef.onDestroy(() => cancelAnimationFrame(raf));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrClickSpark, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.1", type: WrClickSpark, isStandalone: true, selector: "wr-click-spark", inputs: { sparkColor: { classPropertyName: "sparkColor", publicName: "sparkColor", isSignal: true, isRequired: false, transformFunction: null }, sparkSize: { classPropertyName: "sparkSize", publicName: "sparkSize", isSignal: true, isRequired: false, transformFunction: null }, sparkRadius: { classPropertyName: "sparkRadius", publicName: "sparkRadius", isSignal: true, isRequired: false, transformFunction: null }, sparkCount: { classPropertyName: "sparkCount", publicName: "sparkCount", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, easing: { classPropertyName: "easing", publicName: "easing", isSignal: true, isRequired: false, transformFunction: null }, extraScale: { classPropertyName: "extraScale", publicName: "extraScale", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" }, classAttribute: "wr-click-spark" }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["canvas"], descendants: true, isSignal: true }], ngImport: i0, template: "<canvas #canvas class=\"wr-click-spark__canvas\"></canvas>\n<ng-content />\n", styles: [".wr-click-spark{position:relative;display:block}.wr-click-spark__canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:1}\n"], encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrClickSpark, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.2", type: WrClickSpark, isStandalone: true, selector: "wr-click-spark", inputs: { sparkColor: { classPropertyName: "sparkColor", publicName: "sparkColor", isSignal: true, isRequired: false, transformFunction: null }, sparkSize: { classPropertyName: "sparkSize", publicName: "sparkSize", isSignal: true, isRequired: false, transformFunction: null }, sparkRadius: { classPropertyName: "sparkRadius", publicName: "sparkRadius", isSignal: true, isRequired: false, transformFunction: null }, sparkCount: { classPropertyName: "sparkCount", publicName: "sparkCount", isSignal: true, isRequired: false, transformFunction: null }, duration: { classPropertyName: "duration", publicName: "duration", isSignal: true, isRequired: false, transformFunction: null }, easing: { classPropertyName: "easing", publicName: "easing", isSignal: true, isRequired: false, transformFunction: null }, extraScale: { classPropertyName: "extraScale", publicName: "extraScale", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" }, classAttribute: "wr-click-spark" }, viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["canvas"], descendants: true, isSignal: true }], ngImport: i0, template: "<canvas #canvas class=\"wr-click-spark__canvas\"></canvas>\n<ng-content />\n", styles: [".wr-click-spark{position:relative;display:block}.wr-click-spark__canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:1}\n"], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrClickSpark, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrClickSpark, decorators: [{
             type: Component,
             args: [{ selector: 'wr-click-spark', encapsulation: ViewEncapsulation.None, host: {
                         class: 'wr-click-spark',

package/fesm2022/ngwr-clipboard.mjs

@@ -115,10 +115,10 @@ class WrClipboard {
             this.doc.body.removeChild(node);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrClipboard, deps: [], target: i0.ɵɵFactoryTarget.Service });
-    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.0.1", ngImport: i0, type: WrClipboard });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrClipboard, deps: [], target: i0.ɵɵFactoryTarget.Service });
+    static ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.0.2", ngImport: i0, type: WrClipboard });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrClipboard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrClipboard, decorators: [{
             type: Service
         }] });
 

package/fesm2022/ngwr-collapse.mjs

@@ -94,10 +94,10 @@ class WrCollapse {
             return;
         this.open.update(v => !v);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCollapse, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: WrCollapse, isStandalone: true, selector: "wr-collapse", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"wr-collapse__header\"\n  [attr.aria-expanded]=\"open()\"\n  [attr.aria-controls]=\"bodyId\"\n  [disabled]=\"disabled()\"\n  (click)=\"toggle()\"\n>\n  <span class=\"wr-collapse__title\">{{ title() }}</span>\n  <svg\n    class=\"wr-icon__svg wr-collapse__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=\"m6 9 6 6 6-6\" />\n  </svg>\n</button>\n\n<div\n  class=\"wr-collapse__body\"\n  [attr.id]=\"bodyId\"\n  [class.wr-collapse__body--open]=\"open()\"\n  [attr.aria-hidden]=\"!open()\"\n  [attr.inert]=\"!open() ? '' : null\"\n>\n  <div class=\"wr-collapse__content\">\n    <div class=\"wr-collapse__inner\">\n      <ng-content />\n    </div>\n  </div>\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCollapse, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.2", type: WrCollapse, isStandalone: true, selector: "wr-collapse", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { properties: { "class": "classes()" } }, ngImport: i0, template: "<button\n  type=\"button\"\n  class=\"wr-collapse__header\"\n  [attr.aria-expanded]=\"open()\"\n  [attr.aria-controls]=\"bodyId\"\n  [disabled]=\"disabled()\"\n  (click)=\"toggle()\"\n>\n  <span class=\"wr-collapse__title\">{{ title() }}</span>\n  <svg\n    class=\"wr-icon__svg wr-collapse__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=\"m6 9 6 6 6-6\" />\n  </svg>\n</button>\n\n<div\n  class=\"wr-collapse__body\"\n  [attr.id]=\"bodyId\"\n  [class.wr-collapse__body--open]=\"open()\"\n  [attr.aria-hidden]=\"!open()\"\n  [attr.inert]=\"!open() ? '' : null\"\n>\n  <div class=\"wr-collapse__content\">\n    <div class=\"wr-collapse__inner\">\n      <ng-content />\n    </div>\n  </div>\n</div>\n", encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCollapse, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCollapse, decorators: [{
             type: Component,
             args: [{ selector: 'wr-collapse', encapsulation: ViewEncapsulation.None, host: { '[class]': 'classes()' }, template: "<button\n  type=\"button\"\n  class=\"wr-collapse__header\"\n  [attr.aria-expanded]=\"open()\"\n  [attr.aria-controls]=\"bodyId\"\n  [disabled]=\"disabled()\"\n  (click)=\"toggle()\"\n>\n  <span class=\"wr-collapse__title\">{{ title() }}</span>\n  <svg\n    class=\"wr-icon__svg wr-collapse__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=\"m6 9 6 6 6-6\" />\n  </svg>\n</button>\n\n<div\n  class=\"wr-collapse__body\"\n  [attr.id]=\"bodyId\"\n  [class.wr-collapse__body--open]=\"open()\"\n  [attr.aria-hidden]=\"!open()\"\n  [attr.inert]=\"!open() ? '' : null\"\n>\n  <div class=\"wr-collapse__content\">\n    <div class=\"wr-collapse__inner\">\n      <ng-content />\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
@@ -132,8 +132,8 @@ class WrCollapseGroup {
                 member.close();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCollapseGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.1", type: WrCollapseGroup, isStandalone: true, selector: "wr-collapse-group", inputs: { accordion: { classPropertyName: "accordion", publicName: "accordion", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-collapse-group" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCollapseGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.2", type: WrCollapseGroup, isStandalone: true, selector: "wr-collapse-group", inputs: { accordion: { classPropertyName: "accordion", publicName: "accordion", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "wr-collapse-group" }, providers: [
             {
                 provide: WR_COLLAPSE_GROUP,
                 // eslint-disable-next-line @angular-eslint/no-forward-ref
@@ -141,7 +141,7 @@ class WrCollapseGroup {
             },
         ], ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCollapseGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCollapseGroup, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-collapse-group',
@@ -198,8 +198,8 @@ class WrAccordion {
                 member.close();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", type: WrAccordion, isStandalone: true, selector: "wr-accordion", host: { classAttribute: "wr-collapse-group wr-collapse-group--accordion" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrAccordion, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.2", type: WrAccordion, isStandalone: true, selector: "wr-accordion", host: { classAttribute: "wr-collapse-group wr-collapse-group--accordion" }, providers: [
             {
                 provide: WR_COLLAPSE_GROUP,
                 // eslint-disable-next-line @angular-eslint/no-forward-ref
@@ -207,7 +207,7 @@ class WrAccordion {
             },
         ], ngImport: i0, template: '<ng-content />', isInline: true, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrAccordion, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrAccordion, decorators: [{
             type: Component,
             args: [{
                     selector: 'wr-accordion',

package/fesm2022/ngwr-color-picker.mjs

@@ -468,8 +468,8 @@ class WrColorPicker {
         this.a.set(hsv.a);
         this.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", 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 }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "style.--wr-color-picker-hue": "hueCss()", "style.--wr-color-picker-rgb": "rgbCss()" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrColorPicker, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", 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 }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "style.--wr-color-picker-hue": "hueCss()", "style.--wr-color-picker-rgb": "rgbCss()" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 // eslint-disable-next-line @angular-eslint/no-forward-ref
@@ -478,7 +478,7 @@ class WrColorPicker {
             },
         ], ngImport: i0, template: "<div class=\"wr-color-picker__sv\" (pointerdown)=\"onPointerDown($event, 'sv')\">\n  <span class=\"wr-color-picker__thumb\" [style.left.%]=\"svThumbX()\" [style.top.%]=\"svThumbY()\"></span>\n</div>\n\n<div class=\"wr-color-picker__slider wr-color-picker__slider--hue\" (pointerdown)=\"onPointerDown($event, 'hue')\">\n  <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.left.%]=\"hueThumbX()\"></span>\n</div>\n\n@if (alpha()) {\n  <div class=\"wr-color-picker__slider wr-color-picker__slider--alpha\" (pointerdown)=\"onPointerDown($event, 'alpha')\">\n    <span class=\"wr-color-picker__thumb wr-color-picker__thumb--slider\" [style.left.%]=\"alphaThumbX()\"></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]=\"effectiveDisabled()\"\n          (input)=\"onHexInput($event)\"\n          (blur)=\"onHexBlur()\"\n        />\n        <span class=\"wr-color-picker__field-label\">HEX</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]=\"effectiveDisabled()\"\n          (input)=\"onRgbChannel('r', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">R</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]=\"effectiveDisabled()\"\n          (input)=\"onRgbChannel('g', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">G</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]=\"effectiveDisabled()\"\n          (input)=\"onRgbChannel('b', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">B</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]=\"effectiveDisabled()\"\n            (input)=\"onAlphaPercent($event)\"\n          />\n          <span class=\"wr-color-picker__field-label\">A%</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]=\"effectiveDisabled()\"\n          (input)=\"onHslChannel('h', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">H</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]=\"effectiveDisabled()\"\n          (input)=\"onHslChannel('s', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">S%</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]=\"effectiveDisabled()\"\n          (input)=\"onHslChannel('l', $event)\"\n        />\n        <span class=\"wr-color-picker__field-label\">L%</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]=\"effectiveDisabled()\"\n            (input)=\"onAlphaPercent($event)\"\n          />\n          <span class=\"wr-color-picker__field-label\">A%</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]=\"effectiveDisabled()\"\n        (click)=\"onSwatchClick(color)\"\n      ></button>\n    }\n  </div>\n}\n", dependencies: [{ kind: "component", type: WrSegmented, selector: "wr-segmented", inputs: ["options", "value", "disabled"], outputs: ["valueChange"] }, { kind: "pipe", type: DecimalPipe, name: "number" }], encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrColorPicker, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrColorPicker, decorators: [{
             type: Component,
             args: [{ selector: 'wr-color-picker', encapsulation: ViewEncapsulation.None, host: {
                         '[class]': 'classes()',
@@ -627,10 +627,10 @@ class WrColorPickerTrigger {
             this.overlayRef = null;
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.1", 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()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrColorPickerTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", 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()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrColorPickerTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrColorPickerTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[wrColorPickerTrigger]',

package/fesm2022/ngwr-command-palette.mjs

@@ -243,10 +243,10 @@ class WrCommandPalette {
         if (this.closeOnPick())
             this.close();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: WrCommandPalette, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: WrCommandPalette, isStandalone: true, selector: "wr-command-palette", inputs: { 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 } }, 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 class=\"wr-command-palette\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Command palette\">\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\">esc</kbd>\n      </div>\n\n      <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n        @if (filtered().length === 0) {\n          <div class=\"wr-command-palette__empty\">{{ resolvedEmpty() }}</div>\n        } @else {\n          @for (bucket of buckets(); track bucket.title) {\n            <div class=\"wr-command-palette__group\">\n              @if (bucket.title) {\n                <div class=\"wr-command-palette__group-title\">{{ bucket.title }}</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        }\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.0.2", ngImport: i0, type: WrCommandPalette, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: WrCommandPalette, isStandalone: true, selector: "wr-command-palette", inputs: { 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 } }, 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 class=\"wr-command-palette\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Command palette\">\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\">esc</kbd>\n      </div>\n\n      <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n        @if (filtered().length === 0) {\n          <div class=\"wr-command-palette__empty\">{{ resolvedEmpty() }}</div>\n        } @else {\n          @for (bucket of buckets(); track bucket.title) {\n            <div class=\"wr-command-palette__group\">\n              @if (bucket.title) {\n                <div class=\"wr-command-palette__group-title\">{{ bucket.title }}</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        }\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.0.1", ngImport: i0, type: WrCommandPalette, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: WrCommandPalette, decorators: [{
             type: Component,
             args: [{ selector: 'wr-command-palette', encapsulation: ViewEncapsulation.None, imports: [WrIcon], template: "@if (open()) {\n  <div class=\"wr-command-palette\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Command palette\">\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\">esc</kbd>\n      </div>\n\n      <div class=\"wr-command-palette__body\" role=\"listbox\" [attr.id]=\"listboxId\">\n        @if (filtered().length === 0) {\n          <div class=\"wr-command-palette__empty\">{{ resolvedEmpty() }}</div>\n        } @else {\n          @for (bucket of buckets(); track bucket.title) {\n            <div class=\"wr-command-palette__group\">\n              @if (bucket.title) {\n                <div class=\"wr-command-palette__group-title\">{{ bucket.title }}</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        }\n      </div>\n    </div>\n  </div>\n}\n" }]
         }], ctorParameters: () => [], propDecorators: { 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 }] }], picked: [{ type: i0.Output, args: ["picked"] }], inputEl: [{ type: i0.ViewChild, args: ['input', { isSignal: true }] }], panelEl: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }] } });