@guildofgleks/ui 21.7.0 → 21.7.2

package/fesm2022/guildofgleks-ui.mjs

@@ -1074,7 +1074,7 @@ class AccordionComponent {
         handleRovingFocusKeydown(event, headers);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: AccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: AccordionComponent, isStandalone: true, selector: "gog-accordion", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, ripple: { classPropertyName: "ripple", publicName: "ripple", isSignal: true, isRequired: false, transformFunction: null }, expandFirst: { classPropertyName: "expandFirst", publicName: "expandFirst", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, skeletonCount: { classPropertyName: "skeletonCount", publicName: "skeletonCount", isSignal: true, isRequired: false, transformFunction: null }, showChevron: { classPropertyName: "showChevron", publicName: "showChevron", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null }, openIds: { classPropertyName: "openIds", publicName: "openIds", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openIds: "openIdsChange", gogToggle: "gogToggle" }, host: { properties: { "attr.aria-busy": "loading() ? \"true\" : null" }, classAttribute: "gog-accordion-host" }, queries: [{ propertyName: "headerTpl", first: true, predicate: GogAccordionHeaderDirective, descendants: true, isSignal: true }, { propertyName: "chevronTpl", first: true, predicate: GogAccordionChevronDirective, descendants: true, isSignal: true }, { propertyName: "contentTpl", first: true, predicate: GogAccordionContentDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  [class.gog-accordion--loading]=\"loading()\"\r\n  class=\"gog-accordion gog-contained-layout\"\r\n  [class]=\"sizeClass()\"\r\n>\r\n  @if (loading()) {\r\n    @for (row of skeletonRows(); track row) {\r\n      <div class=\"gog-accordion__item gog-accordion__item--skeleton\">\r\n        <div class=\"gog-accordion__header gog-accordion__header--skeleton\">\r\n          <gog-skeleton shape=\"text\" [size]=\"size()\" [width]=\"skeletonWidth(row)\" />\r\n          <!--\r\n            The chevron gets a placeholder too, so the row's silhouette is the one that arrives.\r\n            Without it the right-hand side is empty while loading and the chevron appears out of\r\n            nowhere \u2014 the shape-matching placeholder failing at the one thing it is for.\r\n          -->\r\n          @if (showChevron()) {\r\n            <span class=\"gog-accordion__chevron\" aria-hidden=\"true\">\r\n              <!--\r\n                `width=\"100%\"` rather than `[size]`: a skeleton's `size` is its *text* line\r\n                height, so a circle given one came out 18px wide and 64px tall and streaked down\r\n                the row. A circle takes its diameter from `width` and keeps itself round, so\r\n                filling the chevron's own box is what matches it.\r\n              -->\r\n              <gog-skeleton shape=\"circle\" width=\"100%\" />\r\n            </span>\r\n          }\r\n        </div>\r\n      </div>\r\n    }\r\n  } @else {\r\n    @for (item of items(); track item.id) {\r\n      <div\r\n        class=\"gog-accordion__item\"\r\n        [class.gog-accordion__item--open]=\"isOpen(item.id)\"\r\n        [class.gog-accordion__item--disabled]=\"item.disabled\"\r\n      >\r\n        <ng-template #headerButton>\r\n          <button\r\n            [id]=\"uid + '-btn-' + item.id\"\r\n            class=\"gog-accordion__header\"\r\n            [class.gog-accordion__header--chevronless]=\"!showChevron()\"\r\n            [class.gog-accordion__header--open]=\"isOpen(item.id)\"\r\n            [attr.aria-expanded]=\"isOpen(item.id)\"\r\n            [attr.aria-controls]=\"uid + '-body-' + item.id\"\r\n            [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\r\n            [disabled]=\"item.disabled || null\"\r\n            (click)=\"toggle(item)\"\r\n            (keydown)=\"onHeaderKeydown($event)\"\r\n            type=\"button\"\r\n            gogRipple\r\n            [rippleDisabled]=\"!rippleEnabled()\"\r\n          >\r\n            <span class=\"gog-accordion__header-content\">\r\n              @if (headerTpl(); as tpl) {\r\n                <ng-container\r\n                  *ngTemplateOutlet=\"\r\n                    tpl.templateRef;\r\n                    context: { $implicit: item, open: isOpen(item.id) }\r\n                  \"\r\n                />\r\n              } @else {\r\n                <span class=\"gog-accordion__title\">{{ item.title }}</span>\r\n              }\r\n            </span>\r\n            @if (showChevron()) {\r\n              <span\r\n                class=\"gog-accordion__chevron\"\r\n                [class.gog-accordion__chevron--auto-rotate]=\"!chevronTpl()\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                @if (chevronTpl(); as tpl) {\r\n                  <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                      tpl.templateRef;\r\n                      context: { $implicit: item, open: isOpen(item.id) }\r\n                    \"\r\n                  />\r\n                } @else {\r\n                  <gog-icon name=\"chevron-down\" />\r\n                }\r\n              </span>\r\n            }\r\n          </button>\r\n        </ng-template>\r\n\r\n        @if (headingLevel(); as level) {\r\n          <div role=\"heading\" [attr.aria-level]=\"level\" class=\"gog-accordion__heading\">\r\n            <ng-container [ngTemplateOutlet]=\"headerButton\" />\r\n          </div>\r\n        } @else {\r\n          <ng-container [ngTemplateOutlet]=\"headerButton\" />\r\n        }\r\n\r\n        <div\r\n          [id]=\"uid + '-body-' + item.id\"\r\n          class=\"gog-accordion__body\"\r\n          [class.gog-accordion__body--open]=\"isOpen(item.id)\"\r\n          role=\"region\"\r\n          [attr.aria-labelledby]=\"uid + '-btn-' + item.id\"\r\n          [attr.aria-hidden]=\"!isOpen(item.id)\"\r\n          [attr.inert]=\"!isOpen(item.id) ? '' : null\"\r\n        >\r\n          <div class=\"gog-accordion__body-inner\">\r\n            @if (contentTpl(); as tpl) {\r\n              <ng-container *ngTemplateOutlet=\"tpl.templateRef; context: { $implicit: item }\" />\r\n            }\r\n          </div>\r\n        </div>\r\n      </div>\r\n    }\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-accordion{display:flex;flex-direction:column;width:100%}.gog-accordion__item{border-bottom:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color)}.gog-accordion__item:first-child{border-top:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color);border-top-left-radius:var(--gog-accordion-radius);border-top-right-radius:var(--gog-accordion-radius)}.gog-accordion__item:last-child{border-bottom-left-radius:var(--gog-accordion-radius);border-bottom-right-radius:var(--gog-accordion-radius);overflow:hidden}.gog-accordion__item--disabled .gog-accordion__header{cursor:not-allowed;opacity:var(--gog-accordion-disabled-opacity)}.gog-accordion__item--disabled .gog-accordion__header:hover{color:var(--gog-accordion-text-color);background-color:var(--gog-accordion-header-bg)}.gog-accordion__heading{display:contents}.gog-accordion__header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--gog-accordion-padding-y, var(--gog-accordion-size-padding-y, var(--gog-accordion-lg-padding-y))) var(--gog-accordion-padding-x, var(--gog-accordion-size-padding-x, var(--gog-accordion-lg-padding-x)));gap:var(--gog-accordion-header-gap);background:var(--gog-accordion-header-bg);border:none;color:var(--gog-accordion-text-color);text-align:start;cursor:pointer;font-family:var(--gog-accordion-font-family);text-transform:var(--gog-accordion-header-text-transform);letter-spacing:var(--gog-accordion-letter-spacing, var(--gog-accordion-size-letter-spacing, var(--gog-accordion-lg-letter-spacing)));font-size:var(--gog-accordion-font-size, var(--gog-accordion-size-font-size, var(--gog-accordion-lg-font-size)));transition:color var(--gog-accordion-transition-duration) var(--gog-easing),background-color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header:hover{color:var(--gog-accordion-accent-color);background-color:var(--gog-accordion-hover-bg)}.gog-accordion__header:focus-visible{outline:var(--gog-accordion-focus-ring-width) solid var(--gog-accordion-hover-ring);outline-offset:calc(var(--gog-accordion-focus-ring-width) * -1)}.gog-accordion__header--open{color:var(--gog-accordion-accent-color)}.gog-accordion__title{flex:1}.gog-accordion__header-content{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--gog-accordion-content-gap, var(--gog-accordion-size-content-gap, var(--gog-accordion-lg-content-gap)));min-width:0}.gog-accordion__chevron{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--gog-accordion-chevron-size, var(--gog-accordion-size-chevron-size, var(--gog-accordion-lg-chevron-size)));height:var(--gog-accordion-chevron-size, var(--gog-accordion-size-chevron-size, var(--gog-accordion-lg-chevron-size)));font-size:var(--gog-accordion-chevron-font-size, var(--gog-accordion-size-chevron-font-size, var(--gog-accordion-lg-chevron-font-size)));color:var(--gog-accordion-border-color);transition:color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header--open .gog-accordion__chevron{color:var(--gog-accordion-accent-color)}.gog-accordion__chevron--auto-rotate{transition:transform var(--gog-accordion-chevron-transition-duration) var(--gog-easing),color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header--open .gog-accordion__chevron--auto-rotate{transform:rotate(180deg)}.gog-accordion__body{display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;border-top:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color);transition:grid-template-rows var(--gog-accordion-body-transition-duration) var(--gog-easing),opacity var(--gog-accordion-body-transition-duration) var(--gog-easing)}.gog-accordion__body--open{grid-template-rows:1fr;opacity:1}.gog-accordion__body-inner{min-height:0;overflow:hidden;border-bottom-left-radius:var(--gog-accordion-body-radius);border-bottom-right-radius:var(--gog-accordion-body-radius);padding:0 var(--gog-accordion-padding-x, var(--gog-accordion-size-padding-x, var(--gog-accordion-lg-padding-x)));background:var(--gog-accordion-body-bg);color:var(--gog-accordion-body-color);font-family:var(--gog-accordion-body-font-family);font-size:var(--gog-accordion-body-font-size, var(--gog-accordion-size-body-font-size, var(--gog-accordion-lg-body-font-size)));line-height:var(--gog-accordion-size-body-line-height, var(--gog-accordion-lg-body-line-height));transform:translateY(var(--gog-accordion-body-lift));transition:transform var(--gog-accordion-body-transition-duration) var(--gog-easing),padding var(--gog-accordion-body-transition-duration) var(--gog-easing)}.gog-accordion__body--open .gog-accordion__body-inner{padding-top:var(--gog-accordion-body-padding-top, var(--gog-accordion-size-body-padding-top, var(--gog-accordion-lg-body-padding-top)));padding-bottom:var(--gog-accordion-body-padding-bottom, var(--gog-accordion-size-body-padding-bottom, var(--gog-accordion-lg-body-padding-bottom)));transform:translateY(0)}.gog-accordion--slg{--gog-accordion-size-padding-y: var(--gog-accordion-slg-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-slg-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-slg-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-slg-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-slg-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-slg-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-slg-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-slg-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-slg-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-slg-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-slg-chevron-font-size)}.gog-accordion--md{--gog-accordion-size-padding-y: var(--gog-accordion-md-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-md-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-md-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-md-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-md-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-md-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-md-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-md-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-md-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-md-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-md-chevron-font-size)}.gog-accordion--sm{--gog-accordion-size-padding-y: var(--gog-accordion-sm-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-sm-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-sm-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-sm-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-sm-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-sm-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-sm-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-sm-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-sm-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-sm-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-sm-chevron-font-size)}.gog-accordion--xsm{--gog-accordion-size-padding-y: var(--gog-accordion-xsm-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-xsm-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-xsm-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-xsm-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-xsm-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-xsm-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-xsm-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-xsm-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-xsm-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-xsm-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-xsm-chevron-font-size)}.gog-accordion__header--skeleton{cursor:default;pointer-events:none}@media(prefers-reduced-motion:reduce){.gog-accordion__header,.gog-accordion__chevron,.gog-accordion__body,.gog-accordion__body-inner{transition:none}}\n"], dependencies: [{ kind: "directive", type: GogRippleDirective, selector: "[gogRipple]", inputs: ["rippleDisabled", "rippleCentred"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }, { kind: "component", type: SkeletonComponent, selector: "gog-skeleton", inputs: ["shape", "size", "animation", "width", "height", "lines", "rounded", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: AccordionComponent, isStandalone: true, selector: "gog-accordion", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, ripple: { classPropertyName: "ripple", publicName: "ripple", isSignal: true, isRequired: false, transformFunction: null }, expandFirst: { classPropertyName: "expandFirst", publicName: "expandFirst", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, skeletonCount: { classPropertyName: "skeletonCount", publicName: "skeletonCount", isSignal: true, isRequired: false, transformFunction: null }, showChevron: { classPropertyName: "showChevron", publicName: "showChevron", isSignal: true, isRequired: false, transformFunction: null }, headingLevel: { classPropertyName: "headingLevel", publicName: "headingLevel", isSignal: true, isRequired: false, transformFunction: null }, openIds: { classPropertyName: "openIds", publicName: "openIds", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openIds: "openIdsChange", gogToggle: "gogToggle" }, host: { properties: { "attr.aria-busy": "loading() ? \"true\" : null" }, classAttribute: "gog-accordion-host" }, queries: [{ propertyName: "headerTpl", first: true, predicate: GogAccordionHeaderDirective, descendants: true, isSignal: true }, { propertyName: "chevronTpl", first: true, predicate: GogAccordionChevronDirective, descendants: true, isSignal: true }, { propertyName: "contentTpl", first: true, predicate: GogAccordionContentDirective, descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  [class.gog-accordion--loading]=\"loading()\"\r\n  class=\"gog-accordion gog-contained-layout\"\r\n  [class]=\"sizeClass()\"\r\n>\r\n  @if (loading()) {\r\n    @for (row of skeletonRows(); track row) {\r\n      <div class=\"gog-accordion__item gog-accordion__item--skeleton\">\r\n        <div class=\"gog-accordion__header gog-accordion__header--skeleton\">\r\n          <gog-skeleton shape=\"text\" [size]=\"size()\" [width]=\"skeletonWidth(row)\" />\r\n          <!--\r\n            The chevron gets a placeholder too, so the row's silhouette is the one that arrives.\r\n            Without it the right-hand side is empty while loading and the chevron appears out of\r\n            nowhere \u2014 the shape-matching placeholder failing at the one thing it is for.\r\n          -->\r\n          @if (showChevron()) {\r\n            <span class=\"gog-accordion__chevron\" aria-hidden=\"true\">\r\n              <!--\r\n                `width=\"100%\"` rather than `[size]`: a skeleton's `size` is its *text* line\r\n                height, so a circle given one came out 18px wide and 64px tall and streaked down\r\n                the row. A circle takes its diameter from `width` and keeps itself round, so\r\n                filling the chevron's own box is what matches it.\r\n              -->\r\n              <gog-skeleton shape=\"circle\" width=\"100%\" />\r\n            </span>\r\n          }\r\n        </div>\r\n      </div>\r\n    }\r\n  } @else {\r\n    @for (item of items(); track item.id) {\r\n      <div\r\n        class=\"gog-accordion__item\"\r\n        [class.gog-accordion__item--open]=\"isOpen(item.id)\"\r\n        [class.gog-accordion__item--disabled]=\"item.disabled\"\r\n      >\r\n        <ng-template #headerButton>\r\n          <button\r\n            [id]=\"uid + '-btn-' + item.id\"\r\n            class=\"gog-accordion__header\"\r\n            [class.gog-accordion__header--chevronless]=\"!showChevron()\"\r\n            [class.gog-accordion__header--open]=\"isOpen(item.id)\"\r\n            [attr.aria-expanded]=\"isOpen(item.id)\"\r\n            [attr.aria-controls]=\"uid + '-body-' + item.id\"\r\n            [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\r\n            [disabled]=\"item.disabled || null\"\r\n            (click)=\"toggle(item)\"\r\n            (keydown)=\"onHeaderKeydown($event)\"\r\n            type=\"button\"\r\n            gogRipple\r\n            [rippleDisabled]=\"!rippleEnabled()\"\r\n          >\r\n            <span class=\"gog-accordion__header-content\">\r\n              @if (headerTpl(); as tpl) {\r\n                <ng-container\r\n                  *ngTemplateOutlet=\"\r\n                    tpl.templateRef;\r\n                    context: { $implicit: item, open: isOpen(item.id) }\r\n                  \"\r\n                />\r\n              } @else {\r\n                <span class=\"gog-accordion__title\">{{ item.title }}</span>\r\n              }\r\n            </span>\r\n            @if (showChevron()) {\r\n              <span\r\n                class=\"gog-accordion__chevron\"\r\n                [class.gog-accordion__chevron--auto-rotate]=\"!chevronTpl()\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                @if (chevronTpl(); as tpl) {\r\n                  <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                      tpl.templateRef;\r\n                      context: { $implicit: item, open: isOpen(item.id) }\r\n                    \"\r\n                  />\r\n                } @else {\r\n                  <gog-icon name=\"chevron-down\" />\r\n                }\r\n              </span>\r\n            }\r\n          </button>\r\n        </ng-template>\r\n\r\n        @if (headingLevel(); as level) {\r\n          <div role=\"heading\" [attr.aria-level]=\"level\" class=\"gog-accordion__heading\">\r\n            <ng-container [ngTemplateOutlet]=\"headerButton\" />\r\n          </div>\r\n        } @else {\r\n          <ng-container [ngTemplateOutlet]=\"headerButton\" />\r\n        }\r\n\r\n        <div\r\n          [id]=\"uid + '-body-' + item.id\"\r\n          class=\"gog-accordion__body\"\r\n          [class.gog-accordion__body--open]=\"isOpen(item.id)\"\r\n          role=\"region\"\r\n          [attr.aria-labelledby]=\"uid + '-btn-' + item.id\"\r\n          [attr.aria-hidden]=\"!isOpen(item.id)\"\r\n          [attr.inert]=\"!isOpen(item.id) ? '' : null\"\r\n        >\r\n          <div class=\"gog-accordion__body-inner\">\r\n            @if (contentTpl(); as tpl) {\r\n              <ng-container *ngTemplateOutlet=\"tpl.templateRef; context: { $implicit: item }\" />\r\n            }\r\n          </div>\r\n        </div>\r\n      </div>\r\n    }\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-accordion{display:flex;flex-direction:column;width:100%}.gog-accordion__item{border-bottom:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color)}.gog-accordion__item:first-child{border-top:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color);border-top-left-radius:var(--gog-accordion-radius);border-top-right-radius:var(--gog-accordion-radius)}.gog-accordion__item:last-child{border-bottom-left-radius:var(--gog-accordion-radius);border-bottom-right-radius:var(--gog-accordion-radius);overflow:hidden}.gog-accordion__item--disabled .gog-accordion__header{cursor:not-allowed;opacity:var(--gog-accordion-disabled-opacity)}.gog-accordion__item--disabled .gog-accordion__header:hover{color:var(--gog-accordion-text-color);background-color:var(--gog-accordion-header-bg)}.gog-accordion__heading{display:contents}.gog-accordion__header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--gog-accordion-padding-y, var(--gog-accordion-size-padding-y, var(--gog-accordion-lg-padding-y))) var(--gog-accordion-padding-x, var(--gog-accordion-size-padding-x, var(--gog-accordion-lg-padding-x)));gap:var(--gog-accordion-header-gap);background:var(--gog-accordion-header-bg);border:none;color:var(--gog-accordion-text-color);text-align:start;cursor:pointer;font-family:var(--gog-accordion-font-family);text-transform:var(--gog-accordion-header-text-transform);letter-spacing:var(--gog-accordion-letter-spacing, var(--gog-accordion-size-letter-spacing, var(--gog-accordion-lg-letter-spacing)));font-size:var(--gog-accordion-font-size, var(--gog-accordion-size-font-size, var(--gog-accordion-lg-font-size)));transition:color var(--gog-accordion-transition-duration) var(--gog-easing),background-color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header:hover{color:var(--gog-accordion-accent-color);background-color:var(--gog-accordion-hover-bg)}.gog-accordion__header:focus-visible{outline:var(--gog-accordion-focus-ring-width) solid var(--gog-accordion-hover-ring);outline-offset:calc(var(--gog-accordion-focus-ring-width) * -1)}.gog-accordion__header--open{color:var(--gog-accordion-accent-color)}.gog-accordion__title{flex:1}.gog-accordion__header-content{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--gog-accordion-content-gap, var(--gog-accordion-size-content-gap, var(--gog-accordion-lg-content-gap)));min-width:0}.gog-accordion__chevron{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--gog-accordion-chevron-size, var(--gog-accordion-size-chevron-size, var(--gog-accordion-lg-chevron-size)));height:var(--gog-accordion-chevron-size, var(--gog-accordion-size-chevron-size, var(--gog-accordion-lg-chevron-size)));font-size:var(--gog-accordion-chevron-font-size, var(--gog-accordion-size-chevron-font-size, var(--gog-accordion-lg-chevron-font-size)));color:var(--gog-accordion-border-color);transition:color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header--open .gog-accordion__chevron{color:var(--gog-accordion-accent-color)}.gog-accordion__chevron--auto-rotate{transition:transform var(--gog-accordion-chevron-transition-duration) var(--gog-easing),color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header--open .gog-accordion__chevron--auto-rotate{transform:rotate(180deg)}.gog-accordion__body{display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;border-top:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color);transition:grid-template-rows var(--gog-accordion-body-transition-duration) var(--gog-easing),opacity var(--gog-accordion-body-transition-duration) var(--gog-easing)}.gog-accordion__body--open{grid-template-rows:1fr;opacity:1}.gog-accordion__body-inner{min-height:0;overflow:hidden;border-bottom-left-radius:var(--gog-accordion-body-radius);border-bottom-right-radius:var(--gog-accordion-body-radius);padding:0 var(--gog-accordion-padding-x, var(--gog-accordion-size-padding-x, var(--gog-accordion-lg-padding-x)));background:var(--gog-accordion-body-bg);color:var(--gog-accordion-body-color);font-family:var(--gog-accordion-body-font-family);font-size:var(--gog-accordion-body-font-size, var(--gog-accordion-size-body-font-size, var(--gog-accordion-lg-body-font-size)));line-height:var(--gog-accordion-size-body-line-height, var(--gog-accordion-lg-body-line-height));transform:translateY(var(--gog-accordion-body-lift));transition:transform var(--gog-accordion-body-transition-duration) var(--gog-easing),padding var(--gog-accordion-body-transition-duration) var(--gog-easing)}.gog-accordion__body--open .gog-accordion__body-inner{padding-top:var(--gog-accordion-body-padding-top, var(--gog-accordion-size-body-padding-top, var(--gog-accordion-lg-body-padding-top)));padding-bottom:var(--gog-accordion-body-padding-bottom, var(--gog-accordion-size-body-padding-bottom, var(--gog-accordion-lg-body-padding-bottom)));transform:translateY(0)}.gog-accordion--slg{--gog-accordion-size-padding-y: var(--gog-accordion-slg-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-slg-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-slg-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-slg-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-slg-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-slg-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-slg-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-slg-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-slg-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-slg-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-slg-chevron-font-size)}.gog-accordion--md{--gog-accordion-size-padding-y: var(--gog-accordion-md-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-md-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-md-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-md-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-md-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-md-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-md-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-md-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-md-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-md-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-md-chevron-font-size)}.gog-accordion--sm{--gog-accordion-size-padding-y: var(--gog-accordion-sm-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-sm-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-sm-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-sm-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-sm-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-sm-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-sm-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-sm-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-sm-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-sm-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-sm-chevron-font-size)}.gog-accordion--xsm{--gog-accordion-size-padding-y: var(--gog-accordion-xsm-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-xsm-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-xsm-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-xsm-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-xsm-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-xsm-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-xsm-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-xsm-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-xsm-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-xsm-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-xsm-chevron-font-size)}.gog-accordion__header--skeleton{cursor:default;pointer-events:none;--gog-skeleton-base: var(--gog-border-color)}@media(prefers-reduced-motion:reduce){.gog-accordion__header,.gog-accordion__chevron,.gog-accordion__body,.gog-accordion__body-inner{transition:none}}\n"], dependencies: [{ kind: "directive", type: GogRippleDirective, selector: "[gogRipple]", inputs: ["rippleDisabled", "rippleCentred"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }, { kind: "component", type: SkeletonComponent, selector: "gog-skeleton", inputs: ["shape", "size", "animation", "width", "height", "lines", "rounded", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: AccordionComponent, decorators: [{
             type: Component,
@@ -1087,7 +1087,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
                          * already do this; see the loading-state rule in `api-design.instructions.md`.
                          */
                         '[attr.aria-busy]': 'loading() ? "true" : null',
-                    }, template: "<div\r\n  [class.gog-accordion--loading]=\"loading()\"\r\n  class=\"gog-accordion gog-contained-layout\"\r\n  [class]=\"sizeClass()\"\r\n>\r\n  @if (loading()) {\r\n    @for (row of skeletonRows(); track row) {\r\n      <div class=\"gog-accordion__item gog-accordion__item--skeleton\">\r\n        <div class=\"gog-accordion__header gog-accordion__header--skeleton\">\r\n          <gog-skeleton shape=\"text\" [size]=\"size()\" [width]=\"skeletonWidth(row)\" />\r\n          <!--\r\n            The chevron gets a placeholder too, so the row's silhouette is the one that arrives.\r\n            Without it the right-hand side is empty while loading and the chevron appears out of\r\n            nowhere \u2014 the shape-matching placeholder failing at the one thing it is for.\r\n          -->\r\n          @if (showChevron()) {\r\n            <span class=\"gog-accordion__chevron\" aria-hidden=\"true\">\r\n              <!--\r\n                `width=\"100%\"` rather than `[size]`: a skeleton's `size` is its *text* line\r\n                height, so a circle given one came out 18px wide and 64px tall and streaked down\r\n                the row. A circle takes its diameter from `width` and keeps itself round, so\r\n                filling the chevron's own box is what matches it.\r\n              -->\r\n              <gog-skeleton shape=\"circle\" width=\"100%\" />\r\n            </span>\r\n          }\r\n        </div>\r\n      </div>\r\n    }\r\n  } @else {\r\n    @for (item of items(); track item.id) {\r\n      <div\r\n        class=\"gog-accordion__item\"\r\n        [class.gog-accordion__item--open]=\"isOpen(item.id)\"\r\n        [class.gog-accordion__item--disabled]=\"item.disabled\"\r\n      >\r\n        <ng-template #headerButton>\r\n          <button\r\n            [id]=\"uid + '-btn-' + item.id\"\r\n            class=\"gog-accordion__header\"\r\n            [class.gog-accordion__header--chevronless]=\"!showChevron()\"\r\n            [class.gog-accordion__header--open]=\"isOpen(item.id)\"\r\n            [attr.aria-expanded]=\"isOpen(item.id)\"\r\n            [attr.aria-controls]=\"uid + '-body-' + item.id\"\r\n            [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\r\n            [disabled]=\"item.disabled || null\"\r\n            (click)=\"toggle(item)\"\r\n            (keydown)=\"onHeaderKeydown($event)\"\r\n            type=\"button\"\r\n            gogRipple\r\n            [rippleDisabled]=\"!rippleEnabled()\"\r\n          >\r\n            <span class=\"gog-accordion__header-content\">\r\n              @if (headerTpl(); as tpl) {\r\n                <ng-container\r\n                  *ngTemplateOutlet=\"\r\n                    tpl.templateRef;\r\n                    context: { $implicit: item, open: isOpen(item.id) }\r\n                  \"\r\n                />\r\n              } @else {\r\n                <span class=\"gog-accordion__title\">{{ item.title }}</span>\r\n              }\r\n            </span>\r\n            @if (showChevron()) {\r\n              <span\r\n                class=\"gog-accordion__chevron\"\r\n                [class.gog-accordion__chevron--auto-rotate]=\"!chevronTpl()\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                @if (chevronTpl(); as tpl) {\r\n                  <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                      tpl.templateRef;\r\n                      context: { $implicit: item, open: isOpen(item.id) }\r\n                    \"\r\n                  />\r\n                } @else {\r\n                  <gog-icon name=\"chevron-down\" />\r\n                }\r\n              </span>\r\n            }\r\n          </button>\r\n        </ng-template>\r\n\r\n        @if (headingLevel(); as level) {\r\n          <div role=\"heading\" [attr.aria-level]=\"level\" class=\"gog-accordion__heading\">\r\n            <ng-container [ngTemplateOutlet]=\"headerButton\" />\r\n          </div>\r\n        } @else {\r\n          <ng-container [ngTemplateOutlet]=\"headerButton\" />\r\n        }\r\n\r\n        <div\r\n          [id]=\"uid + '-body-' + item.id\"\r\n          class=\"gog-accordion__body\"\r\n          [class.gog-accordion__body--open]=\"isOpen(item.id)\"\r\n          role=\"region\"\r\n          [attr.aria-labelledby]=\"uid + '-btn-' + item.id\"\r\n          [attr.aria-hidden]=\"!isOpen(item.id)\"\r\n          [attr.inert]=\"!isOpen(item.id) ? '' : null\"\r\n        >\r\n          <div class=\"gog-accordion__body-inner\">\r\n            @if (contentTpl(); as tpl) {\r\n              <ng-container *ngTemplateOutlet=\"tpl.templateRef; context: { $implicit: item }\" />\r\n            }\r\n          </div>\r\n        </div>\r\n      </div>\r\n    }\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-accordion{display:flex;flex-direction:column;width:100%}.gog-accordion__item{border-bottom:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color)}.gog-accordion__item:first-child{border-top:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color);border-top-left-radius:var(--gog-accordion-radius);border-top-right-radius:var(--gog-accordion-radius)}.gog-accordion__item:last-child{border-bottom-left-radius:var(--gog-accordion-radius);border-bottom-right-radius:var(--gog-accordion-radius);overflow:hidden}.gog-accordion__item--disabled .gog-accordion__header{cursor:not-allowed;opacity:var(--gog-accordion-disabled-opacity)}.gog-accordion__item--disabled .gog-accordion__header:hover{color:var(--gog-accordion-text-color);background-color:var(--gog-accordion-header-bg)}.gog-accordion__heading{display:contents}.gog-accordion__header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--gog-accordion-padding-y, var(--gog-accordion-size-padding-y, var(--gog-accordion-lg-padding-y))) var(--gog-accordion-padding-x, var(--gog-accordion-size-padding-x, var(--gog-accordion-lg-padding-x)));gap:var(--gog-accordion-header-gap);background:var(--gog-accordion-header-bg);border:none;color:var(--gog-accordion-text-color);text-align:start;cursor:pointer;font-family:var(--gog-accordion-font-family);text-transform:var(--gog-accordion-header-text-transform);letter-spacing:var(--gog-accordion-letter-spacing, var(--gog-accordion-size-letter-spacing, var(--gog-accordion-lg-letter-spacing)));font-size:var(--gog-accordion-font-size, var(--gog-accordion-size-font-size, var(--gog-accordion-lg-font-size)));transition:color var(--gog-accordion-transition-duration) var(--gog-easing),background-color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header:hover{color:var(--gog-accordion-accent-color);background-color:var(--gog-accordion-hover-bg)}.gog-accordion__header:focus-visible{outline:var(--gog-accordion-focus-ring-width) solid var(--gog-accordion-hover-ring);outline-offset:calc(var(--gog-accordion-focus-ring-width) * -1)}.gog-accordion__header--open{color:var(--gog-accordion-accent-color)}.gog-accordion__title{flex:1}.gog-accordion__header-content{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--gog-accordion-content-gap, var(--gog-accordion-size-content-gap, var(--gog-accordion-lg-content-gap)));min-width:0}.gog-accordion__chevron{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--gog-accordion-chevron-size, var(--gog-accordion-size-chevron-size, var(--gog-accordion-lg-chevron-size)));height:var(--gog-accordion-chevron-size, var(--gog-accordion-size-chevron-size, var(--gog-accordion-lg-chevron-size)));font-size:var(--gog-accordion-chevron-font-size, var(--gog-accordion-size-chevron-font-size, var(--gog-accordion-lg-chevron-font-size)));color:var(--gog-accordion-border-color);transition:color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header--open .gog-accordion__chevron{color:var(--gog-accordion-accent-color)}.gog-accordion__chevron--auto-rotate{transition:transform var(--gog-accordion-chevron-transition-duration) var(--gog-easing),color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header--open .gog-accordion__chevron--auto-rotate{transform:rotate(180deg)}.gog-accordion__body{display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;border-top:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color);transition:grid-template-rows var(--gog-accordion-body-transition-duration) var(--gog-easing),opacity var(--gog-accordion-body-transition-duration) var(--gog-easing)}.gog-accordion__body--open{grid-template-rows:1fr;opacity:1}.gog-accordion__body-inner{min-height:0;overflow:hidden;border-bottom-left-radius:var(--gog-accordion-body-radius);border-bottom-right-radius:var(--gog-accordion-body-radius);padding:0 var(--gog-accordion-padding-x, var(--gog-accordion-size-padding-x, var(--gog-accordion-lg-padding-x)));background:var(--gog-accordion-body-bg);color:var(--gog-accordion-body-color);font-family:var(--gog-accordion-body-font-family);font-size:var(--gog-accordion-body-font-size, var(--gog-accordion-size-body-font-size, var(--gog-accordion-lg-body-font-size)));line-height:var(--gog-accordion-size-body-line-height, var(--gog-accordion-lg-body-line-height));transform:translateY(var(--gog-accordion-body-lift));transition:transform var(--gog-accordion-body-transition-duration) var(--gog-easing),padding var(--gog-accordion-body-transition-duration) var(--gog-easing)}.gog-accordion__body--open .gog-accordion__body-inner{padding-top:var(--gog-accordion-body-padding-top, var(--gog-accordion-size-body-padding-top, var(--gog-accordion-lg-body-padding-top)));padding-bottom:var(--gog-accordion-body-padding-bottom, var(--gog-accordion-size-body-padding-bottom, var(--gog-accordion-lg-body-padding-bottom)));transform:translateY(0)}.gog-accordion--slg{--gog-accordion-size-padding-y: var(--gog-accordion-slg-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-slg-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-slg-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-slg-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-slg-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-slg-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-slg-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-slg-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-slg-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-slg-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-slg-chevron-font-size)}.gog-accordion--md{--gog-accordion-size-padding-y: var(--gog-accordion-md-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-md-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-md-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-md-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-md-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-md-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-md-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-md-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-md-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-md-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-md-chevron-font-size)}.gog-accordion--sm{--gog-accordion-size-padding-y: var(--gog-accordion-sm-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-sm-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-sm-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-sm-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-sm-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-sm-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-sm-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-sm-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-sm-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-sm-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-sm-chevron-font-size)}.gog-accordion--xsm{--gog-accordion-size-padding-y: var(--gog-accordion-xsm-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-xsm-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-xsm-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-xsm-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-xsm-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-xsm-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-xsm-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-xsm-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-xsm-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-xsm-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-xsm-chevron-font-size)}.gog-accordion__header--skeleton{cursor:default;pointer-events:none}@media(prefers-reduced-motion:reduce){.gog-accordion__header,.gog-accordion__chevron,.gog-accordion__body,.gog-accordion__body-inner{transition:none}}\n"] }]
+                    }, template: "<div\r\n  [class.gog-accordion--loading]=\"loading()\"\r\n  class=\"gog-accordion gog-contained-layout\"\r\n  [class]=\"sizeClass()\"\r\n>\r\n  @if (loading()) {\r\n    @for (row of skeletonRows(); track row) {\r\n      <div class=\"gog-accordion__item gog-accordion__item--skeleton\">\r\n        <div class=\"gog-accordion__header gog-accordion__header--skeleton\">\r\n          <gog-skeleton shape=\"text\" [size]=\"size()\" [width]=\"skeletonWidth(row)\" />\r\n          <!--\r\n            The chevron gets a placeholder too, so the row's silhouette is the one that arrives.\r\n            Without it the right-hand side is empty while loading and the chevron appears out of\r\n            nowhere \u2014 the shape-matching placeholder failing at the one thing it is for.\r\n          -->\r\n          @if (showChevron()) {\r\n            <span class=\"gog-accordion__chevron\" aria-hidden=\"true\">\r\n              <!--\r\n                `width=\"100%\"` rather than `[size]`: a skeleton's `size` is its *text* line\r\n                height, so a circle given one came out 18px wide and 64px tall and streaked down\r\n                the row. A circle takes its diameter from `width` and keeps itself round, so\r\n                filling the chevron's own box is what matches it.\r\n              -->\r\n              <gog-skeleton shape=\"circle\" width=\"100%\" />\r\n            </span>\r\n          }\r\n        </div>\r\n      </div>\r\n    }\r\n  } @else {\r\n    @for (item of items(); track item.id) {\r\n      <div\r\n        class=\"gog-accordion__item\"\r\n        [class.gog-accordion__item--open]=\"isOpen(item.id)\"\r\n        [class.gog-accordion__item--disabled]=\"item.disabled\"\r\n      >\r\n        <ng-template #headerButton>\r\n          <button\r\n            [id]=\"uid + '-btn-' + item.id\"\r\n            class=\"gog-accordion__header\"\r\n            [class.gog-accordion__header--chevronless]=\"!showChevron()\"\r\n            [class.gog-accordion__header--open]=\"isOpen(item.id)\"\r\n            [attr.aria-expanded]=\"isOpen(item.id)\"\r\n            [attr.aria-controls]=\"uid + '-body-' + item.id\"\r\n            [attr.aria-disabled]=\"item.disabled ? 'true' : null\"\r\n            [disabled]=\"item.disabled || null\"\r\n            (click)=\"toggle(item)\"\r\n            (keydown)=\"onHeaderKeydown($event)\"\r\n            type=\"button\"\r\n            gogRipple\r\n            [rippleDisabled]=\"!rippleEnabled()\"\r\n          >\r\n            <span class=\"gog-accordion__header-content\">\r\n              @if (headerTpl(); as tpl) {\r\n                <ng-container\r\n                  *ngTemplateOutlet=\"\r\n                    tpl.templateRef;\r\n                    context: { $implicit: item, open: isOpen(item.id) }\r\n                  \"\r\n                />\r\n              } @else {\r\n                <span class=\"gog-accordion__title\">{{ item.title }}</span>\r\n              }\r\n            </span>\r\n            @if (showChevron()) {\r\n              <span\r\n                class=\"gog-accordion__chevron\"\r\n                [class.gog-accordion__chevron--auto-rotate]=\"!chevronTpl()\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                @if (chevronTpl(); as tpl) {\r\n                  <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                      tpl.templateRef;\r\n                      context: { $implicit: item, open: isOpen(item.id) }\r\n                    \"\r\n                  />\r\n                } @else {\r\n                  <gog-icon name=\"chevron-down\" />\r\n                }\r\n              </span>\r\n            }\r\n          </button>\r\n        </ng-template>\r\n\r\n        @if (headingLevel(); as level) {\r\n          <div role=\"heading\" [attr.aria-level]=\"level\" class=\"gog-accordion__heading\">\r\n            <ng-container [ngTemplateOutlet]=\"headerButton\" />\r\n          </div>\r\n        } @else {\r\n          <ng-container [ngTemplateOutlet]=\"headerButton\" />\r\n        }\r\n\r\n        <div\r\n          [id]=\"uid + '-body-' + item.id\"\r\n          class=\"gog-accordion__body\"\r\n          [class.gog-accordion__body--open]=\"isOpen(item.id)\"\r\n          role=\"region\"\r\n          [attr.aria-labelledby]=\"uid + '-btn-' + item.id\"\r\n          [attr.aria-hidden]=\"!isOpen(item.id)\"\r\n          [attr.inert]=\"!isOpen(item.id) ? '' : null\"\r\n        >\r\n          <div class=\"gog-accordion__body-inner\">\r\n            @if (contentTpl(); as tpl) {\r\n              <ng-container *ngTemplateOutlet=\"tpl.templateRef; context: { $implicit: item }\" />\r\n            }\r\n          </div>\r\n        </div>\r\n      </div>\r\n    }\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-accordion{display:flex;flex-direction:column;width:100%}.gog-accordion__item{border-bottom:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color)}.gog-accordion__item:first-child{border-top:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color);border-top-left-radius:var(--gog-accordion-radius);border-top-right-radius:var(--gog-accordion-radius)}.gog-accordion__item:last-child{border-bottom-left-radius:var(--gog-accordion-radius);border-bottom-right-radius:var(--gog-accordion-radius);overflow:hidden}.gog-accordion__item--disabled .gog-accordion__header{cursor:not-allowed;opacity:var(--gog-accordion-disabled-opacity)}.gog-accordion__item--disabled .gog-accordion__header:hover{color:var(--gog-accordion-text-color);background-color:var(--gog-accordion-header-bg)}.gog-accordion__heading{display:contents}.gog-accordion__header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--gog-accordion-padding-y, var(--gog-accordion-size-padding-y, var(--gog-accordion-lg-padding-y))) var(--gog-accordion-padding-x, var(--gog-accordion-size-padding-x, var(--gog-accordion-lg-padding-x)));gap:var(--gog-accordion-header-gap);background:var(--gog-accordion-header-bg);border:none;color:var(--gog-accordion-text-color);text-align:start;cursor:pointer;font-family:var(--gog-accordion-font-family);text-transform:var(--gog-accordion-header-text-transform);letter-spacing:var(--gog-accordion-letter-spacing, var(--gog-accordion-size-letter-spacing, var(--gog-accordion-lg-letter-spacing)));font-size:var(--gog-accordion-font-size, var(--gog-accordion-size-font-size, var(--gog-accordion-lg-font-size)));transition:color var(--gog-accordion-transition-duration) var(--gog-easing),background-color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header:hover{color:var(--gog-accordion-accent-color);background-color:var(--gog-accordion-hover-bg)}.gog-accordion__header:focus-visible{outline:var(--gog-accordion-focus-ring-width) solid var(--gog-accordion-hover-ring);outline-offset:calc(var(--gog-accordion-focus-ring-width) * -1)}.gog-accordion__header--open{color:var(--gog-accordion-accent-color)}.gog-accordion__title{flex:1}.gog-accordion__header-content{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--gog-accordion-content-gap, var(--gog-accordion-size-content-gap, var(--gog-accordion-lg-content-gap)));min-width:0}.gog-accordion__chevron{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--gog-accordion-chevron-size, var(--gog-accordion-size-chevron-size, var(--gog-accordion-lg-chevron-size)));height:var(--gog-accordion-chevron-size, var(--gog-accordion-size-chevron-size, var(--gog-accordion-lg-chevron-size)));font-size:var(--gog-accordion-chevron-font-size, var(--gog-accordion-size-chevron-font-size, var(--gog-accordion-lg-chevron-font-size)));color:var(--gog-accordion-border-color);transition:color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header--open .gog-accordion__chevron{color:var(--gog-accordion-accent-color)}.gog-accordion__chevron--auto-rotate{transition:transform var(--gog-accordion-chevron-transition-duration) var(--gog-easing),color var(--gog-accordion-transition-duration) var(--gog-easing)}.gog-accordion__header--open .gog-accordion__chevron--auto-rotate{transform:rotate(180deg)}.gog-accordion__body{display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;border-top:var(--gog-accordion-border-width) var(--gog-accordion-border-style) var(--gog-accordion-border-color);transition:grid-template-rows var(--gog-accordion-body-transition-duration) var(--gog-easing),opacity var(--gog-accordion-body-transition-duration) var(--gog-easing)}.gog-accordion__body--open{grid-template-rows:1fr;opacity:1}.gog-accordion__body-inner{min-height:0;overflow:hidden;border-bottom-left-radius:var(--gog-accordion-body-radius);border-bottom-right-radius:var(--gog-accordion-body-radius);padding:0 var(--gog-accordion-padding-x, var(--gog-accordion-size-padding-x, var(--gog-accordion-lg-padding-x)));background:var(--gog-accordion-body-bg);color:var(--gog-accordion-body-color);font-family:var(--gog-accordion-body-font-family);font-size:var(--gog-accordion-body-font-size, var(--gog-accordion-size-body-font-size, var(--gog-accordion-lg-body-font-size)));line-height:var(--gog-accordion-size-body-line-height, var(--gog-accordion-lg-body-line-height));transform:translateY(var(--gog-accordion-body-lift));transition:transform var(--gog-accordion-body-transition-duration) var(--gog-easing),padding var(--gog-accordion-body-transition-duration) var(--gog-easing)}.gog-accordion__body--open .gog-accordion__body-inner{padding-top:var(--gog-accordion-body-padding-top, var(--gog-accordion-size-body-padding-top, var(--gog-accordion-lg-body-padding-top)));padding-bottom:var(--gog-accordion-body-padding-bottom, var(--gog-accordion-size-body-padding-bottom, var(--gog-accordion-lg-body-padding-bottom)));transform:translateY(0)}.gog-accordion--slg{--gog-accordion-size-padding-y: var(--gog-accordion-slg-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-slg-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-slg-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-slg-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-slg-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-slg-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-slg-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-slg-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-slg-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-slg-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-slg-chevron-font-size)}.gog-accordion--md{--gog-accordion-size-padding-y: var(--gog-accordion-md-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-md-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-md-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-md-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-md-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-md-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-md-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-md-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-md-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-md-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-md-chevron-font-size)}.gog-accordion--sm{--gog-accordion-size-padding-y: var(--gog-accordion-sm-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-sm-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-sm-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-sm-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-sm-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-sm-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-sm-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-sm-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-sm-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-sm-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-sm-chevron-font-size)}.gog-accordion--xsm{--gog-accordion-size-padding-y: var(--gog-accordion-xsm-padding-y);--gog-accordion-size-padding-x: var(--gog-accordion-xsm-padding-x);--gog-accordion-size-font-size: var(--gog-accordion-xsm-font-size);--gog-accordion-size-letter-spacing: var(--gog-accordion-xsm-letter-spacing);--gog-accordion-size-content-gap: var(--gog-accordion-xsm-content-gap);--gog-accordion-size-body-font-size: var(--gog-accordion-xsm-body-font-size);--gog-accordion-size-body-line-height: var(--gog-accordion-xsm-body-line-height);--gog-accordion-size-body-padding-top: var(--gog-accordion-xsm-body-padding-top);--gog-accordion-size-body-padding-bottom: var(--gog-accordion-xsm-body-padding-bottom);--gog-accordion-size-chevron-size: var(--gog-accordion-xsm-chevron-size);--gog-accordion-size-chevron-font-size: var(--gog-accordion-xsm-chevron-font-size)}.gog-accordion__header--skeleton{cursor:default;pointer-events:none;--gog-skeleton-base: var(--gog-border-color)}@media(prefers-reduced-motion:reduce){.gog-accordion__header,.gog-accordion__chevron,.gog-accordion__body,.gog-accordion__body-inner{transition:none}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], ripple: [{ type: i0.Input, args: [{ isSignal: true, alias: "ripple", required: false }] }], expandFirst: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandFirst", required: false }] }], multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], skeletonCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "skeletonCount", required: false }] }], showChevron: [{ type: i0.Input, args: [{ isSignal: true, alias: "showChevron", required: false }] }], headingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "headingLevel", required: false }] }], openIds: [{ type: i0.Input, args: [{ isSignal: true, alias: "openIds", required: false }] }, { type: i0.Output, args: ["openIdsChange"] }], gogToggle: [{ type: i0.Output, args: ["gogToggle"] }], headerTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => GogAccordionHeaderDirective), { isSignal: true }] }], chevronTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => GogAccordionChevronDirective), { isSignal: true }] }], contentTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => GogAccordionContentDirective), { isSignal: true }] }] } });
 
 /**
@@ -5925,11 +5925,11 @@ class ToastComponent {
         return (typeof window !== 'undefined' && window.matchMedia('(prefers-reduced-motion: reduce)').matches);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ToastComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: ToastComponent, isStandalone: true, selector: "gog-toast", inputs: { toast: { classPropertyName: "toast", publicName: "toast", isSignal: true, isRequired: true, transformFunction: null }, isFront: { classPropertyName: "isFront", publicName: "isFront", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dismissed: "dismissed" }, viewQueries: [{ propertyName: "progressEl", first: true, predicate: ["progress"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  class=\"gog-toast\"\r\n  [class.gog-toast--paused]=\"isPaused()\"\r\n  [class.gog-toast--queued]=\"!isFront()\"\r\n  [class.gog-toast--success]=\"toast().type === 'success'\"\r\n  [class.gog-toast--error]=\"toast().type === 'error'\"\r\n  [class.gog-toast--warning]=\"toast().type === 'warning'\"\r\n  [class.gog-toast--info]=\"toast().type === 'info'\"\r\n  [class.gog-toast--visible]=\"visible()\"\r\n  [style.--toast-duration]=\"toast().duration + 'ms'\"\r\n  (mouseenter)=\"pauseAutoDismiss()\"\r\n  (mouseleave)=\"resumeAutoDismiss()\"\r\n  (transitionend)=\"onTransitionEnd($event)\"\r\n>\r\n  <div class=\"gog-toast__content\">\r\n    <span class=\"gog-toast__icon\" aria-hidden=\"true\">\r\n      <gog-icon [template]=\"toast().iconTemplate ?? null\" [name]=\"toast().iconName\" />\r\n    </span>\r\n    <div class=\"gog-toast__main\">\r\n      <span class=\"gog-toast__message\">{{ toast().message }}</span>\r\n      @if (hasActions()) {\r\n        <div class=\"gog-toast__actions\">\r\n          @for (action of toast().actions; track action.label) {\r\n            <gog-button\r\n              class=\"gog-toast__action\"\r\n              variant=\"ghost\"\r\n              size=\"sm\"\r\n              type=\"button\"\r\n              (gogClick)=\"runAction(action)\"\r\n            >\r\n              @if (action.iconName || action.iconTemplate) {\r\n                <gog-icon\r\n                  [template]=\"action.iconTemplate ?? null\"\r\n                  [name]=\"action.iconName ?? 'check'\"\r\n                />\r\n              }\r\n              {{ action.label }}\r\n            </gog-button>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n    <gog-button\r\n      class=\"gog-toast__close\"\r\n      variant=\"ghost\"\r\n      size=\"sm\"\r\n      type=\"button\"\r\n      [ariaLabel]=\"closeLabel\"\r\n      (gogClick)=\"close()\"\r\n    >\r\n      <gog-icon name=\"close\" />\r\n    </gog-button>\r\n  </div>\r\n  @if (!toast().isSticky) {\r\n    <span #progress class=\"gog-toast__progress\" aria-hidden=\"true\"></span>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.gog-toast{--toast-border: var(--gog-toast-type-color, var(--gog-toast-border));--toast-icon-color: var(--gog-toast-type-color, var(--gog-toast-icon-color));--toast-enter-x: var(--gog-toast-enter-distance);--toast-progress-color: var(--toast-border);--toast-stack-depth: min(var(--toast-stack-index, 0), var(--gog-toast-stack-max-depth));--toast-stack-collapsed-y: calc( var(--toast-stack-depth) * var(--gog-toast-stack-peek) * var(--toast-stack-direction, 1) );--toast-stack-expanded-y: calc( var(--toast-stack-depth) * var(--gog-toast-stack-expanded-gap) * var(--toast-stack-direction, 1) );--toast-stack-y: calc( var(--toast-stack-collapsed-y) + (var(--toast-stack-expanded-y) - var(--toast-stack-collapsed-y)) * var(--toast-stack-expanded, 0) );--toast-stack-collapsed-scale: calc( 1 - (var(--toast-stack-depth) * var(--gog-toast-stack-scale-step)) );--toast-stack-scale: calc( var(--toast-stack-collapsed-scale) + (1 - var(--toast-stack-collapsed-scale)) * var(--toast-stack-expanded, 0) );--toast-stack-collapsed-opacity: max( var(--gog-toast-stack-min-opacity), calc(1 - (var(--toast-stack-depth) * var(--gog-toast-stack-opacity-step))) );--toast-stack-opacity: calc( var(--toast-stack-collapsed-opacity) + (1 - var(--toast-stack-collapsed-opacity)) * var(--toast-stack-expanded, 0) );position:relative;z-index:calc(var(--gog-toast-base-z) - var(--toast-stack-index, 0));display:block;padding:var(--gog-toast-padding);background:var(--gog-toast-bg);border-inline-start:var(--gog-toast-accent-width) solid var(--toast-border);border-radius:var(--gog-toast-radius);color:var(--gog-toast-color);font-family:var(--gog-toast-font-family);box-shadow:var(--gog-toast-shadow);min-width:var(--gog-toast-min-width);max-width:var(--gog-toast-max-width);pointer-events:all;opacity:0;overflow:hidden;transform:translate3d(var(--toast-enter-x),var(--toast-stack-y),0) scale(var(--toast-stack-scale));transition:opacity var(--gog-toast-transition-duration) var(--gog-easing),transform var(--gog-toast-transition-duration) var(--gog-easing)}.gog-toast--visible{opacity:var(--toast-stack-opacity);transform:translate3d(0,var(--toast-stack-y),0) scale(var(--toast-stack-scale))}:host(.slide-left) .gog-toast{--toast-enter-x: calc(var(--gog-toast-enter-distance) * -1)}.gog-toast--success{--gog-toast-type-color: var(--gog-toast-success-color)}.gog-toast--error{--gog-toast-type-color: var(--gog-toast-error-color)}.gog-toast--warning{--gog-toast-type-color: var(--gog-toast-warning-color)}.gog-toast--info{--gog-toast-type-color: var(--gog-toast-info-color)}.gog-toast__icon{color:var(--toast-icon-color);font-size:var(--gog-toast-icon-size);line-height:var(--gog-toast-icon-line-height);flex-shrink:0}.gog-toast__icon gog-icon{font-size:var(--gog-toast-icon-size)}.gog-toast__content{display:flex;align-items:flex-start;gap:var(--gog-toast-content-gap)}.gog-toast__main{display:flex;flex:1;flex-direction:column;gap:var(--gog-toast-main-gap);min-width:0}.gog-toast__message{flex:1;font-size:var(--gog-toast-message-font-size);line-height:var(--gog-toast-message-line-height)}.gog-toast__actions{display:flex;flex-wrap:wrap;gap:var(--gog-toast-actions-gap)}.gog-toast__action{--gog-button-padding: var(--gog-toast-action-padding);--gog-button-font-size: var(--gog-toast-action-font-size)}.gog-toast__action gog-icon{font-size:var(--gog-toast-action-font-size)}.gog-toast__close{align-self:flex-start;flex-shrink:0;--gog-button-padding: var(--gog-toast-close-padding);--gog-button-font-size: var(--gog-toast-close-font-size)}.gog-toast__close gog-icon{font-size:var(--gog-toast-close-font-size)}.gog-toast__progress{position:absolute;inset-inline:0;bottom:0;height:var(--gog-toast-progress-height);background:color-mix(in srgb,var(--toast-progress-color) var(--gog-toast-progress-opacity),transparent);transform-origin:var(--gog-inline-start-side) center;animation:gog-toast-progress var(--toast-duration) linear forwards}.gog-toast--paused .gog-toast__progress,.gog-toast--queued .gog-toast__progress{animation-play-state:paused}@keyframes gog-toast-progress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media(prefers-reduced-motion:reduce){.gog-toast,.gog-toast__progress{transition:none;animation:none}}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "gog-button", inputs: ["variant", "size", "disabled", "fullWidth", "type", "loading", "ripple", "debounce", "ariaLabel"], outputs: ["gogClick"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: ToastComponent, isStandalone: true, selector: "gog-toast", inputs: { toast: { classPropertyName: "toast", publicName: "toast", isSignal: true, isRequired: true, transformFunction: null }, isFront: { classPropertyName: "isFront", publicName: "isFront", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dismissed: "dismissed" }, viewQueries: [{ propertyName: "progressEl", first: true, predicate: ["progress"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  class=\"gog-toast\"\r\n  [class.gog-toast--paused]=\"isPaused()\"\r\n  [class.gog-toast--queued]=\"!isFront()\"\r\n  [class.gog-toast--success]=\"toast().type === 'success'\"\r\n  [class.gog-toast--error]=\"toast().type === 'error'\"\r\n  [class.gog-toast--warning]=\"toast().type === 'warning'\"\r\n  [class.gog-toast--info]=\"toast().type === 'info'\"\r\n  [class.gog-toast--visible]=\"visible()\"\r\n  [style.--toast-duration]=\"toast().duration + 'ms'\"\r\n  (mouseenter)=\"pauseAutoDismiss()\"\r\n  (mouseleave)=\"resumeAutoDismiss()\"\r\n  (transitionend)=\"onTransitionEnd($event)\"\r\n>\r\n  <div class=\"gog-toast__content\">\r\n    <span class=\"gog-toast__icon\" aria-hidden=\"true\">\r\n      <gog-icon [template]=\"toast().iconTemplate ?? null\" [name]=\"toast().iconName\" />\r\n    </span>\r\n    <div class=\"gog-toast__main\">\r\n      <span class=\"gog-toast__message\">{{ toast().message }}</span>\r\n      @if (hasActions()) {\r\n        <div class=\"gog-toast__actions\">\r\n          @for (action of toast().actions; track action.label) {\r\n            <gog-button\r\n              class=\"gog-toast__action\"\r\n              variant=\"ghost\"\r\n              size=\"sm\"\r\n              type=\"button\"\r\n              (gogClick)=\"runAction(action)\"\r\n            >\r\n              @if (action.iconName || action.iconTemplate) {\r\n                <gog-icon\r\n                  [template]=\"action.iconTemplate ?? null\"\r\n                  [name]=\"action.iconName ?? 'check'\"\r\n                />\r\n              }\r\n              {{ action.label }}\r\n            </gog-button>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n    <gog-button\r\n      class=\"gog-toast__close\"\r\n      variant=\"ghost\"\r\n      size=\"sm\"\r\n      type=\"button\"\r\n      [ariaLabel]=\"closeLabel\"\r\n      (gogClick)=\"close()\"\r\n    >\r\n      <gog-icon name=\"close\" />\r\n    </gog-button>\r\n  </div>\r\n  @if (!toast().isSticky) {\r\n    <span #progress class=\"gog-toast__progress\" aria-hidden=\"true\"></span>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.gog-toast{--toast-border: var(--gog-toast-type-color, var(--gog-toast-border));--toast-icon-color: var(--gog-toast-type-color, var(--gog-toast-icon-color));--toast-enter-x: var(--gog-toast-enter-distance);--toast-progress-color: var(--toast-border);--toast-stack-depth: min(var(--toast-stack-index, 0), var(--gog-toast-stack-max-depth));--toast-stack-collapsed-y: calc( var(--toast-stack-depth) * var(--gog-toast-stack-peek) * var(--toast-stack-direction, 1) );--toast-stack-expanded-y: calc( var(--toast-stack-depth) * var(--gog-toast-stack-expanded-gap) * var(--toast-stack-direction, 1) );--toast-stack-y: calc( var(--toast-stack-collapsed-y) + (var(--toast-stack-expanded-y) - var(--toast-stack-collapsed-y)) * var(--toast-stack-expanded, 0) );--toast-stack-collapsed-scale: calc( 1 - (var(--toast-stack-depth) * var(--gog-toast-stack-scale-step)) );--toast-stack-scale: calc( var(--toast-stack-collapsed-scale) + (1 - var(--toast-stack-collapsed-scale)) * var(--toast-stack-expanded, 0) );--toast-stack-collapsed-opacity: max( var(--gog-toast-stack-min-opacity), calc(1 - (var(--toast-stack-depth) * var(--gog-toast-stack-opacity-step))) );--toast-stack-opacity: calc( var(--toast-stack-collapsed-opacity) + (1 - var(--toast-stack-collapsed-opacity)) * var(--toast-stack-expanded, 0) );position:relative;z-index:calc(var(--gog-toast-base-z) - var(--toast-stack-index, 0));display:block;padding:var(--gog-toast-padding);background:var(--gog-toast-bg);border-inline-start:var(--gog-toast-accent-width) solid var(--toast-border);border-radius:var(--gog-toast-radius);color:var(--gog-toast-color);font-family:var(--gog-toast-font-family);box-shadow:var(--gog-toast-shadow);min-width:var(--gog-toast-min-width);max-width:var(--gog-toast-max-width);pointer-events:all;opacity:0;overflow:hidden;transform:translate3d(var(--toast-enter-x),var(--toast-stack-y),0) scale(var(--toast-stack-scale));transition:opacity var(--gog-toast-transition-duration) var(--gog-easing),transform var(--gog-toast-transition-duration) var(--gog-easing)}.gog-toast--visible{opacity:var(--toast-stack-opacity);transform:translate3d(0,var(--toast-stack-y),0) scale(var(--toast-stack-scale))}:host(.slide-left) .gog-toast{--toast-enter-x: calc(var(--gog-toast-enter-distance) * -1)}.gog-toast--success{--gog-toast-type-color: var(--gog-toast-success-color)}.gog-toast--error{--gog-toast-type-color: var(--gog-toast-error-color)}.gog-toast--warning{--gog-toast-type-color: var(--gog-toast-warning-color)}.gog-toast--info{--gog-toast-type-color: var(--gog-toast-info-color)}.gog-toast__icon{color:var(--toast-icon-color);font-size:var(--gog-toast-icon-size);line-height:var(--gog-toast-icon-line-height);flex-shrink:0}.gog-toast__icon gog-icon{font-size:var(--gog-toast-icon-size)}.gog-toast__content{display:flex;align-items:flex-start;gap:var(--gog-toast-content-gap)}.gog-toast__main{display:flex;flex:1;flex-direction:column;gap:var(--gog-toast-main-gap);min-width:0}.gog-toast__message{flex:1;font-size:var(--gog-toast-message-font-size);line-height:var(--gog-toast-message-line-height)}.gog-toast__actions{display:flex;flex-wrap:wrap;gap:var(--gog-toast-actions-gap)}.gog-toast__action{--gog-button-padding: var(--gog-toast-action-padding);--gog-button-font-size: var(--gog-toast-action-font-size)}.gog-toast__action gog-icon{font-size:var(--gog-toast-action-font-size)}.gog-toast__close{align-self:flex-start;flex-shrink:0;--gog-button-padding: var(--gog-toast-close-padding);--gog-button-font-size: var(--gog-toast-close-font-size)}.gog-toast__close gog-icon{font-size:var(--gog-toast-close-font-size)}.gog-toast__progress{position:absolute;inset-inline:0;bottom:0;height:var(--gog-toast-progress-height);background:color-mix(in srgb,var(--toast-progress-color) var(--gog-toast-progress-opacity),transparent);transform-origin:var(--gog-inline-start-side) center;animation:gog-toast-progress var(--toast-duration) linear forwards}.gog-toast--paused .gog-toast__progress,.gog-toast--queued .gog-toast__progress{animation-play-state:paused}@keyframes gog-toast-progress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media(prefers-reduced-motion:reduce){.gog-toast{transition:none;animation:none}.gog-toast__progress{transition:none;animation-timing-function:steps(20,end)}}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "gog-button", inputs: ["variant", "size", "disabled", "fullWidth", "type", "loading", "ripple", "debounce", "ariaLabel"], outputs: ["gogClick"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: ToastComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gog-toast', imports: [ButtonComponent, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"gog-toast\"\r\n  [class.gog-toast--paused]=\"isPaused()\"\r\n  [class.gog-toast--queued]=\"!isFront()\"\r\n  [class.gog-toast--success]=\"toast().type === 'success'\"\r\n  [class.gog-toast--error]=\"toast().type === 'error'\"\r\n  [class.gog-toast--warning]=\"toast().type === 'warning'\"\r\n  [class.gog-toast--info]=\"toast().type === 'info'\"\r\n  [class.gog-toast--visible]=\"visible()\"\r\n  [style.--toast-duration]=\"toast().duration + 'ms'\"\r\n  (mouseenter)=\"pauseAutoDismiss()\"\r\n  (mouseleave)=\"resumeAutoDismiss()\"\r\n  (transitionend)=\"onTransitionEnd($event)\"\r\n>\r\n  <div class=\"gog-toast__content\">\r\n    <span class=\"gog-toast__icon\" aria-hidden=\"true\">\r\n      <gog-icon [template]=\"toast().iconTemplate ?? null\" [name]=\"toast().iconName\" />\r\n    </span>\r\n    <div class=\"gog-toast__main\">\r\n      <span class=\"gog-toast__message\">{{ toast().message }}</span>\r\n      @if (hasActions()) {\r\n        <div class=\"gog-toast__actions\">\r\n          @for (action of toast().actions; track action.label) {\r\n            <gog-button\r\n              class=\"gog-toast__action\"\r\n              variant=\"ghost\"\r\n              size=\"sm\"\r\n              type=\"button\"\r\n              (gogClick)=\"runAction(action)\"\r\n            >\r\n              @if (action.iconName || action.iconTemplate) {\r\n                <gog-icon\r\n                  [template]=\"action.iconTemplate ?? null\"\r\n                  [name]=\"action.iconName ?? 'check'\"\r\n                />\r\n              }\r\n              {{ action.label }}\r\n            </gog-button>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n    <gog-button\r\n      class=\"gog-toast__close\"\r\n      variant=\"ghost\"\r\n      size=\"sm\"\r\n      type=\"button\"\r\n      [ariaLabel]=\"closeLabel\"\r\n      (gogClick)=\"close()\"\r\n    >\r\n      <gog-icon name=\"close\" />\r\n    </gog-button>\r\n  </div>\r\n  @if (!toast().isSticky) {\r\n    <span #progress class=\"gog-toast__progress\" aria-hidden=\"true\"></span>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.gog-toast{--toast-border: var(--gog-toast-type-color, var(--gog-toast-border));--toast-icon-color: var(--gog-toast-type-color, var(--gog-toast-icon-color));--toast-enter-x: var(--gog-toast-enter-distance);--toast-progress-color: var(--toast-border);--toast-stack-depth: min(var(--toast-stack-index, 0), var(--gog-toast-stack-max-depth));--toast-stack-collapsed-y: calc( var(--toast-stack-depth) * var(--gog-toast-stack-peek) * var(--toast-stack-direction, 1) );--toast-stack-expanded-y: calc( var(--toast-stack-depth) * var(--gog-toast-stack-expanded-gap) * var(--toast-stack-direction, 1) );--toast-stack-y: calc( var(--toast-stack-collapsed-y) + (var(--toast-stack-expanded-y) - var(--toast-stack-collapsed-y)) * var(--toast-stack-expanded, 0) );--toast-stack-collapsed-scale: calc( 1 - (var(--toast-stack-depth) * var(--gog-toast-stack-scale-step)) );--toast-stack-scale: calc( var(--toast-stack-collapsed-scale) + (1 - var(--toast-stack-collapsed-scale)) * var(--toast-stack-expanded, 0) );--toast-stack-collapsed-opacity: max( var(--gog-toast-stack-min-opacity), calc(1 - (var(--toast-stack-depth) * var(--gog-toast-stack-opacity-step))) );--toast-stack-opacity: calc( var(--toast-stack-collapsed-opacity) + (1 - var(--toast-stack-collapsed-opacity)) * var(--toast-stack-expanded, 0) );position:relative;z-index:calc(var(--gog-toast-base-z) - var(--toast-stack-index, 0));display:block;padding:var(--gog-toast-padding);background:var(--gog-toast-bg);border-inline-start:var(--gog-toast-accent-width) solid var(--toast-border);border-radius:var(--gog-toast-radius);color:var(--gog-toast-color);font-family:var(--gog-toast-font-family);box-shadow:var(--gog-toast-shadow);min-width:var(--gog-toast-min-width);max-width:var(--gog-toast-max-width);pointer-events:all;opacity:0;overflow:hidden;transform:translate3d(var(--toast-enter-x),var(--toast-stack-y),0) scale(var(--toast-stack-scale));transition:opacity var(--gog-toast-transition-duration) var(--gog-easing),transform var(--gog-toast-transition-duration) var(--gog-easing)}.gog-toast--visible{opacity:var(--toast-stack-opacity);transform:translate3d(0,var(--toast-stack-y),0) scale(var(--toast-stack-scale))}:host(.slide-left) .gog-toast{--toast-enter-x: calc(var(--gog-toast-enter-distance) * -1)}.gog-toast--success{--gog-toast-type-color: var(--gog-toast-success-color)}.gog-toast--error{--gog-toast-type-color: var(--gog-toast-error-color)}.gog-toast--warning{--gog-toast-type-color: var(--gog-toast-warning-color)}.gog-toast--info{--gog-toast-type-color: var(--gog-toast-info-color)}.gog-toast__icon{color:var(--toast-icon-color);font-size:var(--gog-toast-icon-size);line-height:var(--gog-toast-icon-line-height);flex-shrink:0}.gog-toast__icon gog-icon{font-size:var(--gog-toast-icon-size)}.gog-toast__content{display:flex;align-items:flex-start;gap:var(--gog-toast-content-gap)}.gog-toast__main{display:flex;flex:1;flex-direction:column;gap:var(--gog-toast-main-gap);min-width:0}.gog-toast__message{flex:1;font-size:var(--gog-toast-message-font-size);line-height:var(--gog-toast-message-line-height)}.gog-toast__actions{display:flex;flex-wrap:wrap;gap:var(--gog-toast-actions-gap)}.gog-toast__action{--gog-button-padding: var(--gog-toast-action-padding);--gog-button-font-size: var(--gog-toast-action-font-size)}.gog-toast__action gog-icon{font-size:var(--gog-toast-action-font-size)}.gog-toast__close{align-self:flex-start;flex-shrink:0;--gog-button-padding: var(--gog-toast-close-padding);--gog-button-font-size: var(--gog-toast-close-font-size)}.gog-toast__close gog-icon{font-size:var(--gog-toast-close-font-size)}.gog-toast__progress{position:absolute;inset-inline:0;bottom:0;height:var(--gog-toast-progress-height);background:color-mix(in srgb,var(--toast-progress-color) var(--gog-toast-progress-opacity),transparent);transform-origin:var(--gog-inline-start-side) center;animation:gog-toast-progress var(--toast-duration) linear forwards}.gog-toast--paused .gog-toast__progress,.gog-toast--queued .gog-toast__progress{animation-play-state:paused}@keyframes gog-toast-progress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media(prefers-reduced-motion:reduce){.gog-toast,.gog-toast__progress{transition:none;animation:none}}\n"] }]
+            args: [{ selector: 'gog-toast', imports: [ButtonComponent, IconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  class=\"gog-toast\"\r\n  [class.gog-toast--paused]=\"isPaused()\"\r\n  [class.gog-toast--queued]=\"!isFront()\"\r\n  [class.gog-toast--success]=\"toast().type === 'success'\"\r\n  [class.gog-toast--error]=\"toast().type === 'error'\"\r\n  [class.gog-toast--warning]=\"toast().type === 'warning'\"\r\n  [class.gog-toast--info]=\"toast().type === 'info'\"\r\n  [class.gog-toast--visible]=\"visible()\"\r\n  [style.--toast-duration]=\"toast().duration + 'ms'\"\r\n  (mouseenter)=\"pauseAutoDismiss()\"\r\n  (mouseleave)=\"resumeAutoDismiss()\"\r\n  (transitionend)=\"onTransitionEnd($event)\"\r\n>\r\n  <div class=\"gog-toast__content\">\r\n    <span class=\"gog-toast__icon\" aria-hidden=\"true\">\r\n      <gog-icon [template]=\"toast().iconTemplate ?? null\" [name]=\"toast().iconName\" />\r\n    </span>\r\n    <div class=\"gog-toast__main\">\r\n      <span class=\"gog-toast__message\">{{ toast().message }}</span>\r\n      @if (hasActions()) {\r\n        <div class=\"gog-toast__actions\">\r\n          @for (action of toast().actions; track action.label) {\r\n            <gog-button\r\n              class=\"gog-toast__action\"\r\n              variant=\"ghost\"\r\n              size=\"sm\"\r\n              type=\"button\"\r\n              (gogClick)=\"runAction(action)\"\r\n            >\r\n              @if (action.iconName || action.iconTemplate) {\r\n                <gog-icon\r\n                  [template]=\"action.iconTemplate ?? null\"\r\n                  [name]=\"action.iconName ?? 'check'\"\r\n                />\r\n              }\r\n              {{ action.label }}\r\n            </gog-button>\r\n          }\r\n        </div>\r\n      }\r\n    </div>\r\n    <gog-button\r\n      class=\"gog-toast__close\"\r\n      variant=\"ghost\"\r\n      size=\"sm\"\r\n      type=\"button\"\r\n      [ariaLabel]=\"closeLabel\"\r\n      (gogClick)=\"close()\"\r\n    >\r\n      <gog-icon name=\"close\" />\r\n    </gog-button>\r\n  </div>\r\n  @if (!toast().isSticky) {\r\n    <span #progress class=\"gog-toast__progress\" aria-hidden=\"true\"></span>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";:host{display:block}.gog-toast{--toast-border: var(--gog-toast-type-color, var(--gog-toast-border));--toast-icon-color: var(--gog-toast-type-color, var(--gog-toast-icon-color));--toast-enter-x: var(--gog-toast-enter-distance);--toast-progress-color: var(--toast-border);--toast-stack-depth: min(var(--toast-stack-index, 0), var(--gog-toast-stack-max-depth));--toast-stack-collapsed-y: calc( var(--toast-stack-depth) * var(--gog-toast-stack-peek) * var(--toast-stack-direction, 1) );--toast-stack-expanded-y: calc( var(--toast-stack-depth) * var(--gog-toast-stack-expanded-gap) * var(--toast-stack-direction, 1) );--toast-stack-y: calc( var(--toast-stack-collapsed-y) + (var(--toast-stack-expanded-y) - var(--toast-stack-collapsed-y)) * var(--toast-stack-expanded, 0) );--toast-stack-collapsed-scale: calc( 1 - (var(--toast-stack-depth) * var(--gog-toast-stack-scale-step)) );--toast-stack-scale: calc( var(--toast-stack-collapsed-scale) + (1 - var(--toast-stack-collapsed-scale)) * var(--toast-stack-expanded, 0) );--toast-stack-collapsed-opacity: max( var(--gog-toast-stack-min-opacity), calc(1 - (var(--toast-stack-depth) * var(--gog-toast-stack-opacity-step))) );--toast-stack-opacity: calc( var(--toast-stack-collapsed-opacity) + (1 - var(--toast-stack-collapsed-opacity)) * var(--toast-stack-expanded, 0) );position:relative;z-index:calc(var(--gog-toast-base-z) - var(--toast-stack-index, 0));display:block;padding:var(--gog-toast-padding);background:var(--gog-toast-bg);border-inline-start:var(--gog-toast-accent-width) solid var(--toast-border);border-radius:var(--gog-toast-radius);color:var(--gog-toast-color);font-family:var(--gog-toast-font-family);box-shadow:var(--gog-toast-shadow);min-width:var(--gog-toast-min-width);max-width:var(--gog-toast-max-width);pointer-events:all;opacity:0;overflow:hidden;transform:translate3d(var(--toast-enter-x),var(--toast-stack-y),0) scale(var(--toast-stack-scale));transition:opacity var(--gog-toast-transition-duration) var(--gog-easing),transform var(--gog-toast-transition-duration) var(--gog-easing)}.gog-toast--visible{opacity:var(--toast-stack-opacity);transform:translate3d(0,var(--toast-stack-y),0) scale(var(--toast-stack-scale))}:host(.slide-left) .gog-toast{--toast-enter-x: calc(var(--gog-toast-enter-distance) * -1)}.gog-toast--success{--gog-toast-type-color: var(--gog-toast-success-color)}.gog-toast--error{--gog-toast-type-color: var(--gog-toast-error-color)}.gog-toast--warning{--gog-toast-type-color: var(--gog-toast-warning-color)}.gog-toast--info{--gog-toast-type-color: var(--gog-toast-info-color)}.gog-toast__icon{color:var(--toast-icon-color);font-size:var(--gog-toast-icon-size);line-height:var(--gog-toast-icon-line-height);flex-shrink:0}.gog-toast__icon gog-icon{font-size:var(--gog-toast-icon-size)}.gog-toast__content{display:flex;align-items:flex-start;gap:var(--gog-toast-content-gap)}.gog-toast__main{display:flex;flex:1;flex-direction:column;gap:var(--gog-toast-main-gap);min-width:0}.gog-toast__message{flex:1;font-size:var(--gog-toast-message-font-size);line-height:var(--gog-toast-message-line-height)}.gog-toast__actions{display:flex;flex-wrap:wrap;gap:var(--gog-toast-actions-gap)}.gog-toast__action{--gog-button-padding: var(--gog-toast-action-padding);--gog-button-font-size: var(--gog-toast-action-font-size)}.gog-toast__action gog-icon{font-size:var(--gog-toast-action-font-size)}.gog-toast__close{align-self:flex-start;flex-shrink:0;--gog-button-padding: var(--gog-toast-close-padding);--gog-button-font-size: var(--gog-toast-close-font-size)}.gog-toast__close gog-icon{font-size:var(--gog-toast-close-font-size)}.gog-toast__progress{position:absolute;inset-inline:0;bottom:0;height:var(--gog-toast-progress-height);background:color-mix(in srgb,var(--toast-progress-color) var(--gog-toast-progress-opacity),transparent);transform-origin:var(--gog-inline-start-side) center;animation:gog-toast-progress var(--toast-duration) linear forwards}.gog-toast--paused .gog-toast__progress,.gog-toast--queued .gog-toast__progress{animation-play-state:paused}@keyframes gog-toast-progress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media(prefers-reduced-motion:reduce){.gog-toast{transition:none;animation:none}.gog-toast__progress{transition:none;animation-timing-function:steps(20,end)}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { toast: [{ type: i0.Input, args: [{ isSignal: true, alias: "toast", required: true }] }], isFront: [{ type: i0.Input, args: [{ isSignal: true, alias: "isFront", required: false }] }], dismissed: [{ type: i0.Output, args: ["dismissed"] }], progressEl: [{ type: i0.ViewChild, args: ['progress', { isSignal: true }] }] } });
 
 const DEFAULT_DURATION = 4000;
@@ -6650,7 +6650,7 @@ class TextareaComponent {
         this._onTouched();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TextareaComponent, isStandalone: true, selector: "gog-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, errorDisplay: { classPropertyName: "errorDisplay", publicName: "errorDisplay", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, minlength: { classPropertyName: "minlength", publicName: "minlength", isSignal: true, isRequired: false, transformFunction: null }, spellcheck: { classPropertyName: "spellcheck", publicName: "spellcheck", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearAriaLabel: { classPropertyName: "clearAriaLabel", publicName: "clearAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, floatLabel: { classPropertyName: "floatLabel", publicName: "floatLabel", isSignal: true, isRequired: false, transformFunction: null }, floatLabelShowPlaceholder: { classPropertyName: "floatLabelShowPlaceholder", publicName: "floatLabelShowPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.gog-host--auto-width": "!fullWidth()" } }, viewQueries: [{ propertyName: "fieldRef", first: true, predicate: ["field"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  class=\"gog-input-wrapper gog-contained-layout\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-input-wrapper--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-input-wrapper--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-input-wrapper--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-input-wrapper--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <label class=\"gog-input__label\" [attr.for]=\"resolvedInputId()\">{{ label() }}</label>\r\n  }\r\n  <div\r\n    class=\"gog-input__field-container\"\r\n    [class.gog-input__field-container--resizable]=\"resolvedResize() !== 'none' && !isDisabled()\"\r\n    [style.--gog-textarea-resize-inset-right.px]=\"resizeInsetRight()\"\r\n    [style.--gog-textarea-resize-inset-bottom.px]=\"resizeInsetBottom()\"\r\n  >\r\n    @if (label() && isFloatLabelActive()) {\r\n      <label class=\"gog-input__label gog-input__label--float\" [attr.for]=\"resolvedInputId()\">{{\r\n        label()\r\n      }}</label>\r\n    }\r\n    <textarea\r\n      #field\r\n      class=\"gog-input__field gog-textarea__field\"\r\n      [class.gog-input__field--error]=\"hasError()\"\r\n      [class.gog-textarea__field--resize-vertical]=\"resolvedResize() === 'vertical'\"\r\n      [class.gog-textarea__field--resize-horizontal]=\"resolvedResize() === 'horizontal'\"\r\n      [class.gog-textarea__field--resize-both]=\"resolvedResize() === 'both'\"\r\n      [class.gog-textarea__field--resize-none]=\"resolvedResize() === 'none'\"\r\n      [attr.id]=\"resolvedInputId()\"\r\n      [attr.name]=\"name() || null\"\r\n      [placeholder]=\"effectivePlaceholder()\"\r\n      [rows]=\"rows()\"\r\n      [value]=\"value()\"\r\n      [disabled]=\"isDisabled()\"\r\n      [readOnly]=\"readonly()\"\r\n      [attr.maxlength]=\"maxlength()\"\r\n      [attr.minlength]=\"minlength()\"\r\n      [attr.spellcheck]=\"spellcheck()\"\r\n      [attr.aria-invalid]=\"hasError()\"\r\n      [attr.aria-describedby]=\"errorId()\"\r\n      (input)=\"onInput($event)\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n    ></textarea>\r\n    @if (showClear()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"gog-input__clear gog-textarea__clear gog-inline-center\"\r\n        [style.--gog-textarea-scrollbar-width.px]=\"scrollbarWidth()\"\r\n        [attr.aria-label]=\"resolvedClearLabel()\"\r\n        (click)=\"clearValue($event)\"\r\n      >\r\n        <gog-icon name=\"close\" />\r\n      </button>\r\n    }\r\n  </div>\r\n  @if (visibleError()) {\r\n    <span class=\"gog-input__error\" [attr.id]=\"errorId()\" role=\"alert\">{{ visibleError() }}</span>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-input-wrapper{display:flex;flex-direction:column;gap:var(--gog-input-gap);width:100%}:host(.gog-host--auto-width){width:fit-content}:host(.gog-host--auto-width) .gog-input-wrapper{width:fit-content}.gog-input__label{font-family:var(--gog-input-label-font-family);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input__field{width:100%;padding:var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x)));font-family:var(--gog-input-font-family);font-size:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-input-field-color);background-color:var(--gog-input-field-bg);border:var(--gog-input-field-border-width) var(--gog-input-field-border-style) var(--gog-input-field-border);border-radius:var(--gog-input-radius);outline:none;transition:border-color var(--gog-input-transition-duration) var(--gog-easing),box-shadow var(--gog-input-transition-duration) var(--gog-easing)}.gog-textarea__field{display:block;min-height:2.5em;line-height:1.5}.gog-textarea__field::-webkit-resizer{background:transparent}.gog-textarea__field--resize-vertical{resize:vertical}.gog-textarea__field--resize-horizontal{resize:horizontal}.gog-textarea__field--resize-both{resize:both}.gog-textarea__field--resize-none{resize:none}.gog-input__field-container{position:relative}.gog-input__field-container--resizable:after{content:\"\";position:absolute;inset-inline-end:calc(var(--gog-textarea-resize-grip-offset) + var(--gog-textarea-resize-inset-right));bottom:calc(var(--gog-textarea-resize-grip-offset) + var(--gog-textarea-resize-inset-bottom));width:var(--gog-textarea-resize-grip-size);height:var(--gog-textarea-resize-grip-size);clip-path:polygon(100% 0,100% 100%,0 100%);background-image:repeating-linear-gradient(135deg,transparent 0 var(--gog-textarea-resize-grip-stripe-gap),var(--gog-textarea-resize-grip-color) var(--gog-textarea-resize-grip-stripe-gap) calc(var(--gog-textarea-resize-grip-stripe-gap) + var(--gog-textarea-resize-grip-stripe-width)));opacity:var(--gog-textarea-resize-grip-opacity);pointer-events:none}.gog-input-wrapper--xsm{--gog-input-size-padding-y: var(--gog-field-xsm-padding-y);--gog-input-size-padding-x: var(--gog-field-xsm-padding-x);--gog-input-size-font-size: var(--gog-field-xsm-font-size)}.gog-input-wrapper--sm{--gog-input-size-padding-y: var(--gog-field-sm-padding-y);--gog-input-size-padding-x: var(--gog-field-sm-padding-x);--gog-input-size-font-size: var(--gog-field-sm-font-size)}.gog-input-wrapper--lg{--gog-input-size-padding-y: var(--gog-field-lg-padding-y);--gog-input-size-padding-x: var(--gog-field-lg-padding-x);--gog-input-size-font-size: var(--gog-field-lg-font-size)}.gog-input-wrapper--slg{--gog-input-size-padding-y: var(--gog-field-slg-padding-y);--gog-input-size-padding-x: var(--gog-field-slg-padding-x);--gog-input-size-font-size: var(--gog-field-slg-font-size)}.gog-input__field::placeholder{color:var(--gog-input-placeholder-color)}.gog-input__field:focus{border-color:var(--gog-input-focus-border);box-shadow:var(--gog-input-focus-glow)}.gog-input__field:focus-visible{outline:var(--gog-input-focus-ring-width) solid var(--gog-input-focus-border);outline-offset:var(--gog-input-focus-ring-offset)}.gog-input__field:disabled{opacity:var(--gog-input-disabled-opacity);cursor:not-allowed;resize:none}.gog-input__field--error{border-color:var(--gog-input-error-color)}.gog-input__error{font-family:var(--gog-input-font-family);font-size:var(--gog-input-error-font-size);color:var(--gog-input-error-color);margin-top:var(--gog-input-error-offset)}.gog-input__label--float{position:absolute;inset-inline-start:var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x)));top:var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y)));max-width:calc(100% - 2 * var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;color:var(--gog-input-placeholder-color);font-size:var(--gog-input-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-input-transition-duration) var(--gog-easing),font-size var(--gog-input-transition-duration) var(--gog-easing),color var(--gog-input-transition-duration) var(--gog-easing),top var(--gog-input-transition-duration) var(--gog-easing),background-color var(--gog-input-transition-duration) var(--gog-easing)}.gog-input-wrapper--float-in,.gog-input-wrapper--float-on{--gog-input-float-top-padding: calc(var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-input-float-label-reserve))}.gog-input-wrapper--float-in .gog-input__field,.gog-input-wrapper--float-on .gog-input__field{padding-top:var(--gog-input-float-top-padding)}.gog-input-wrapper--float-in .gog-input__label--float,.gog-input-wrapper--float-on .gog-input__label--float{top:var(--gog-input-float-top-padding)}.gog-input-wrapper--float-in.gog-input-wrapper--floated .gog-input__label--float{top:var(--gog-input-float-label-in-top);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input-wrapper--float-on.gog-input-wrapper--floated .gog-input__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing);background-color:var(--gog-input-float-label-on-bg, var(--gog-input-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-input-wrapper--float-over.gog-input-wrapper--floated .gog-input__label--float{top:calc(-1 * var(--gog-input-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input-wrapper--float-over .gog-input__field-container{margin-top:var(--gog-input-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-input__field,.gog-input__label--float{transition:none}}.gog-textarea__clear{position:absolute;top:var(--gog-input-clear-inset);inset-inline-end:calc(var(--gog-input-clear-inset) + var(--gog-textarea-scrollbar-width, 0px));width:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-input-clear-radius);background:transparent;color:var(--gog-input-placeholder-color);line-height:1;cursor:pointer;transition:color var(--gog-input-transition-duration) var(--gog-easing)}.gog-textarea__clear:hover{color:var(--gog-input-icon-hover-color)}.gog-textarea__clear:focus-visible{outline:var(--gog-input-icon-focus-ring-width) solid var(--gog-input-icon-hover-color);outline-offset:var(--gog-input-focus-ring-offset)}.gog-textarea__clear gog-icon{font-size:calc(var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size))) * var(--gog-textarea-clear-icon-ratio))}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TextareaComponent, isStandalone: true, selector: "gog-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, errorDisplay: { classPropertyName: "errorDisplay", publicName: "errorDisplay", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, maxlength: { classPropertyName: "maxlength", publicName: "maxlength", isSignal: true, isRequired: false, transformFunction: null }, minlength: { classPropertyName: "minlength", publicName: "minlength", isSignal: true, isRequired: false, transformFunction: null }, spellcheck: { classPropertyName: "spellcheck", publicName: "spellcheck", isSignal: true, isRequired: false, transformFunction: null }, resize: { classPropertyName: "resize", publicName: "resize", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, clearable: { classPropertyName: "clearable", publicName: "clearable", isSignal: true, isRequired: false, transformFunction: null }, clearAriaLabel: { classPropertyName: "clearAriaLabel", publicName: "clearAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, floatLabel: { classPropertyName: "floatLabel", publicName: "floatLabel", isSignal: true, isRequired: false, transformFunction: null }, floatLabelShowPlaceholder: { classPropertyName: "floatLabelShowPlaceholder", publicName: "floatLabelShowPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "class.gog-host--auto-width": "!fullWidth()" } }, viewQueries: [{ propertyName: "fieldRef", first: true, predicate: ["field"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\r\n  class=\"gog-input-wrapper gog-contained-layout\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-input-wrapper--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-input-wrapper--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-input-wrapper--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-input-wrapper--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <label class=\"gog-input__label\" [attr.for]=\"resolvedInputId()\">{{ label() }}</label>\r\n  }\r\n  <div\r\n    class=\"gog-input__field-container\"\r\n    [class.gog-input__field-container--resizable]=\"resolvedResize() !== 'none' && !isDisabled()\"\r\n    [style.--gog-textarea-resize-inset-right.px]=\"resizeInsetRight()\"\r\n    [style.--gog-textarea-resize-inset-bottom.px]=\"resizeInsetBottom()\"\r\n  >\r\n    @if (label() && isFloatLabelActive()) {\r\n      <label class=\"gog-input__label gog-input__label--float\" [attr.for]=\"resolvedInputId()\">{{\r\n        label()\r\n      }}</label>\r\n    }\r\n    <textarea\r\n      #field\r\n      class=\"gog-input__field gog-textarea__field\"\r\n      [class.gog-input__field--error]=\"hasError()\"\r\n      [class.gog-textarea__field--resize-vertical]=\"resolvedResize() === 'vertical'\"\r\n      [class.gog-textarea__field--resize-horizontal]=\"resolvedResize() === 'horizontal'\"\r\n      [class.gog-textarea__field--resize-both]=\"resolvedResize() === 'both'\"\r\n      [class.gog-textarea__field--resize-none]=\"resolvedResize() === 'none'\"\r\n      [attr.id]=\"resolvedInputId()\"\r\n      [attr.name]=\"name() || null\"\r\n      [placeholder]=\"effectivePlaceholder()\"\r\n      [rows]=\"rows()\"\r\n      [value]=\"value()\"\r\n      [disabled]=\"isDisabled()\"\r\n      [readOnly]=\"readonly()\"\r\n      [attr.maxlength]=\"maxlength()\"\r\n      [attr.minlength]=\"minlength()\"\r\n      [attr.spellcheck]=\"spellcheck()\"\r\n      [attr.aria-invalid]=\"hasError()\"\r\n      [attr.aria-describedby]=\"errorId()\"\r\n      (input)=\"onInput($event)\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n    ></textarea>\r\n    @if (showClear()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"gog-input__clear gog-textarea__clear gog-inline-center\"\r\n        [style.--gog-textarea-scrollbar-width.px]=\"scrollbarWidth()\"\r\n        [attr.aria-label]=\"resolvedClearLabel()\"\r\n        (click)=\"clearValue($event)\"\r\n      >\r\n        <gog-icon name=\"close\" />\r\n      </button>\r\n    }\r\n  </div>\r\n  @if (visibleError()) {\r\n    <span class=\"gog-input__error\" [attr.id]=\"errorId()\" role=\"alert\">{{ visibleError() }}</span>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-input-wrapper{display:flex;flex-direction:column;gap:var(--gog-input-gap);width:100%}:host(.gog-host--auto-width){width:fit-content}:host(.gog-host--auto-width) .gog-input-wrapper{width:fit-content}.gog-input__label{font-family:var(--gog-input-label-font-family);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input__field{width:100%;padding:var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x)));font-family:var(--gog-input-font-family);font-size:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-input-field-color);background-color:var(--gog-input-field-bg);border:var(--gog-input-field-border-width) var(--gog-input-field-border-style) var(--gog-input-field-border);border-radius:var(--gog-input-radius);outline:none;transition:border-color var(--gog-input-transition-duration) var(--gog-easing),box-shadow var(--gog-input-transition-duration) var(--gog-easing)}.gog-textarea__field{display:block;min-height:2.5em;line-height:1.5}.gog-textarea__field::-webkit-resizer{background:transparent}.gog-textarea__field{scrollbar-width:thin;scrollbar-color:var(--gog-scroll-thumb-bg) var(--gog-scroll-track-bg)}.gog-textarea__field::-webkit-scrollbar{width:var(--gog-scroll-thin-track-width);height:var(--gog-scroll-thin-track-width)}.gog-textarea__field::-webkit-scrollbar-track{background:var(--gog-scroll-track-bg);border-radius:var(--gog-scroll-track-radius)}.gog-textarea__field::-webkit-scrollbar-thumb{background:var(--gog-scroll-thumb-bg);border-radius:var(--gog-scroll-thumb-radius)}.gog-textarea__field::-webkit-scrollbar-thumb:hover{background:var(--gog-scroll-thumb-hover-bg)}.gog-textarea__field::-webkit-scrollbar-thumb:active{background:var(--gog-scroll-thumb-active-bg)}.gog-textarea__field::-webkit-scrollbar-corner{background:var(--gog-scroll-track-bg)}.gog-textarea__field--resize-vertical{resize:vertical}.gog-textarea__field--resize-horizontal{resize:horizontal}.gog-textarea__field--resize-both{resize:both}.gog-textarea__field--resize-none{resize:none}.gog-input__field-container{position:relative}.gog-input__field-container--resizable:after{content:\"\";position:absolute;inset-inline-end:calc(var(--gog-textarea-resize-grip-offset) + var(--gog-textarea-resize-inset-right));bottom:calc(var(--gog-textarea-resize-grip-offset) + var(--gog-textarea-resize-inset-bottom));width:var(--gog-textarea-resize-grip-size);height:var(--gog-textarea-resize-grip-size);clip-path:polygon(100% 0,100% 100%,0 100%);background-image:repeating-linear-gradient(135deg,transparent 0 var(--gog-textarea-resize-grip-stripe-gap),var(--gog-textarea-resize-grip-color) var(--gog-textarea-resize-grip-stripe-gap) calc(var(--gog-textarea-resize-grip-stripe-gap) + var(--gog-textarea-resize-grip-stripe-width)));opacity:var(--gog-textarea-resize-grip-opacity);pointer-events:none}.gog-input-wrapper--xsm{--gog-input-size-padding-y: var(--gog-field-xsm-padding-y);--gog-input-size-padding-x: var(--gog-field-xsm-padding-x);--gog-input-size-font-size: var(--gog-field-xsm-font-size)}.gog-input-wrapper--sm{--gog-input-size-padding-y: var(--gog-field-sm-padding-y);--gog-input-size-padding-x: var(--gog-field-sm-padding-x);--gog-input-size-font-size: var(--gog-field-sm-font-size)}.gog-input-wrapper--lg{--gog-input-size-padding-y: var(--gog-field-lg-padding-y);--gog-input-size-padding-x: var(--gog-field-lg-padding-x);--gog-input-size-font-size: var(--gog-field-lg-font-size)}.gog-input-wrapper--slg{--gog-input-size-padding-y: var(--gog-field-slg-padding-y);--gog-input-size-padding-x: var(--gog-field-slg-padding-x);--gog-input-size-font-size: var(--gog-field-slg-font-size)}.gog-input__field::placeholder{color:var(--gog-input-placeholder-color)}.gog-input__field:focus{border-color:var(--gog-input-focus-border);box-shadow:var(--gog-input-focus-glow)}.gog-input__field:focus-visible{outline:var(--gog-input-focus-ring-width) solid var(--gog-input-focus-border);outline-offset:var(--gog-input-focus-ring-offset)}.gog-input__field:disabled{opacity:var(--gog-input-disabled-opacity);cursor:not-allowed;resize:none}.gog-input__field--error{border-color:var(--gog-input-error-color)}.gog-input__error{font-family:var(--gog-input-font-family);font-size:var(--gog-input-error-font-size);color:var(--gog-input-error-color);margin-top:var(--gog-input-error-offset)}.gog-input__label--float{position:absolute;inset-inline-start:var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x)));top:var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y)));max-width:calc(100% - 2 * var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;color:var(--gog-input-placeholder-color);font-size:var(--gog-input-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-input-transition-duration) var(--gog-easing),font-size var(--gog-input-transition-duration) var(--gog-easing),color var(--gog-input-transition-duration) var(--gog-easing),top var(--gog-input-transition-duration) var(--gog-easing),background-color var(--gog-input-transition-duration) var(--gog-easing)}.gog-input-wrapper--float-in,.gog-input-wrapper--float-on{--gog-input-float-top-padding: calc(var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-input-float-label-reserve))}.gog-input-wrapper--float-in .gog-input__field,.gog-input-wrapper--float-on .gog-input__field{padding-top:var(--gog-input-float-top-padding)}.gog-input-wrapper--float-in .gog-input__label--float,.gog-input-wrapper--float-on .gog-input__label--float{top:var(--gog-input-float-top-padding)}.gog-input-wrapper--float-in.gog-input-wrapper--floated .gog-input__label--float{top:var(--gog-input-float-label-in-top);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input-wrapper--float-on.gog-input-wrapper--floated .gog-input__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing);background-color:var(--gog-input-float-label-on-bg, var(--gog-input-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-input-wrapper--float-over.gog-input-wrapper--floated .gog-input__label--float{top:calc(-1 * var(--gog-input-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input-wrapper--float-over .gog-input__field-container{margin-top:var(--gog-input-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-input__field,.gog-input__label--float{transition:none}}.gog-textarea__clear{position:absolute;top:var(--gog-input-clear-inset);inset-inline-end:calc(var(--gog-input-clear-inset) + var(--gog-textarea-scrollbar-width, 0px));width:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-input-clear-radius);background:transparent;color:var(--gog-input-placeholder-color);line-height:1;cursor:pointer;transition:color var(--gog-input-transition-duration) var(--gog-easing)}.gog-textarea__clear:hover{color:var(--gog-input-icon-hover-color)}.gog-textarea__clear:focus-visible{outline:var(--gog-input-icon-focus-ring-width) solid var(--gog-input-icon-hover-color);outline-offset:var(--gog-input-focus-ring-offset)}.gog-textarea__clear gog-icon{font-size:calc(var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size))) * var(--gog-textarea-clear-icon-ratio))}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TextareaComponent, decorators: [{
             type: Component,
@@ -6660,7 +6660,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
                         // full-width class: this field is full width by default, so the class only appears
                         // once a consumer opts *out* of that.
                         '[class.gog-host--auto-width]': '!fullWidth()',
-                    }, template: "<div\r\n  class=\"gog-input-wrapper gog-contained-layout\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-input-wrapper--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-input-wrapper--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-input-wrapper--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-input-wrapper--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <label class=\"gog-input__label\" [attr.for]=\"resolvedInputId()\">{{ label() }}</label>\r\n  }\r\n  <div\r\n    class=\"gog-input__field-container\"\r\n    [class.gog-input__field-container--resizable]=\"resolvedResize() !== 'none' && !isDisabled()\"\r\n    [style.--gog-textarea-resize-inset-right.px]=\"resizeInsetRight()\"\r\n    [style.--gog-textarea-resize-inset-bottom.px]=\"resizeInsetBottom()\"\r\n  >\r\n    @if (label() && isFloatLabelActive()) {\r\n      <label class=\"gog-input__label gog-input__label--float\" [attr.for]=\"resolvedInputId()\">{{\r\n        label()\r\n      }}</label>\r\n    }\r\n    <textarea\r\n      #field\r\n      class=\"gog-input__field gog-textarea__field\"\r\n      [class.gog-input__field--error]=\"hasError()\"\r\n      [class.gog-textarea__field--resize-vertical]=\"resolvedResize() === 'vertical'\"\r\n      [class.gog-textarea__field--resize-horizontal]=\"resolvedResize() === 'horizontal'\"\r\n      [class.gog-textarea__field--resize-both]=\"resolvedResize() === 'both'\"\r\n      [class.gog-textarea__field--resize-none]=\"resolvedResize() === 'none'\"\r\n      [attr.id]=\"resolvedInputId()\"\r\n      [attr.name]=\"name() || null\"\r\n      [placeholder]=\"effectivePlaceholder()\"\r\n      [rows]=\"rows()\"\r\n      [value]=\"value()\"\r\n      [disabled]=\"isDisabled()\"\r\n      [readOnly]=\"readonly()\"\r\n      [attr.maxlength]=\"maxlength()\"\r\n      [attr.minlength]=\"minlength()\"\r\n      [attr.spellcheck]=\"spellcheck()\"\r\n      [attr.aria-invalid]=\"hasError()\"\r\n      [attr.aria-describedby]=\"errorId()\"\r\n      (input)=\"onInput($event)\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n    ></textarea>\r\n    @if (showClear()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"gog-input__clear gog-textarea__clear gog-inline-center\"\r\n        [style.--gog-textarea-scrollbar-width.px]=\"scrollbarWidth()\"\r\n        [attr.aria-label]=\"resolvedClearLabel()\"\r\n        (click)=\"clearValue($event)\"\r\n      >\r\n        <gog-icon name=\"close\" />\r\n      </button>\r\n    }\r\n  </div>\r\n  @if (visibleError()) {\r\n    <span class=\"gog-input__error\" [attr.id]=\"errorId()\" role=\"alert\">{{ visibleError() }}</span>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-input-wrapper{display:flex;flex-direction:column;gap:var(--gog-input-gap);width:100%}:host(.gog-host--auto-width){width:fit-content}:host(.gog-host--auto-width) .gog-input-wrapper{width:fit-content}.gog-input__label{font-family:var(--gog-input-label-font-family);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input__field{width:100%;padding:var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x)));font-family:var(--gog-input-font-family);font-size:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-input-field-color);background-color:var(--gog-input-field-bg);border:var(--gog-input-field-border-width) var(--gog-input-field-border-style) var(--gog-input-field-border);border-radius:var(--gog-input-radius);outline:none;transition:border-color var(--gog-input-transition-duration) var(--gog-easing),box-shadow var(--gog-input-transition-duration) var(--gog-easing)}.gog-textarea__field{display:block;min-height:2.5em;line-height:1.5}.gog-textarea__field::-webkit-resizer{background:transparent}.gog-textarea__field--resize-vertical{resize:vertical}.gog-textarea__field--resize-horizontal{resize:horizontal}.gog-textarea__field--resize-both{resize:both}.gog-textarea__field--resize-none{resize:none}.gog-input__field-container{position:relative}.gog-input__field-container--resizable:after{content:\"\";position:absolute;inset-inline-end:calc(var(--gog-textarea-resize-grip-offset) + var(--gog-textarea-resize-inset-right));bottom:calc(var(--gog-textarea-resize-grip-offset) + var(--gog-textarea-resize-inset-bottom));width:var(--gog-textarea-resize-grip-size);height:var(--gog-textarea-resize-grip-size);clip-path:polygon(100% 0,100% 100%,0 100%);background-image:repeating-linear-gradient(135deg,transparent 0 var(--gog-textarea-resize-grip-stripe-gap),var(--gog-textarea-resize-grip-color) var(--gog-textarea-resize-grip-stripe-gap) calc(var(--gog-textarea-resize-grip-stripe-gap) + var(--gog-textarea-resize-grip-stripe-width)));opacity:var(--gog-textarea-resize-grip-opacity);pointer-events:none}.gog-input-wrapper--xsm{--gog-input-size-padding-y: var(--gog-field-xsm-padding-y);--gog-input-size-padding-x: var(--gog-field-xsm-padding-x);--gog-input-size-font-size: var(--gog-field-xsm-font-size)}.gog-input-wrapper--sm{--gog-input-size-padding-y: var(--gog-field-sm-padding-y);--gog-input-size-padding-x: var(--gog-field-sm-padding-x);--gog-input-size-font-size: var(--gog-field-sm-font-size)}.gog-input-wrapper--lg{--gog-input-size-padding-y: var(--gog-field-lg-padding-y);--gog-input-size-padding-x: var(--gog-field-lg-padding-x);--gog-input-size-font-size: var(--gog-field-lg-font-size)}.gog-input-wrapper--slg{--gog-input-size-padding-y: var(--gog-field-slg-padding-y);--gog-input-size-padding-x: var(--gog-field-slg-padding-x);--gog-input-size-font-size: var(--gog-field-slg-font-size)}.gog-input__field::placeholder{color:var(--gog-input-placeholder-color)}.gog-input__field:focus{border-color:var(--gog-input-focus-border);box-shadow:var(--gog-input-focus-glow)}.gog-input__field:focus-visible{outline:var(--gog-input-focus-ring-width) solid var(--gog-input-focus-border);outline-offset:var(--gog-input-focus-ring-offset)}.gog-input__field:disabled{opacity:var(--gog-input-disabled-opacity);cursor:not-allowed;resize:none}.gog-input__field--error{border-color:var(--gog-input-error-color)}.gog-input__error{font-family:var(--gog-input-font-family);font-size:var(--gog-input-error-font-size);color:var(--gog-input-error-color);margin-top:var(--gog-input-error-offset)}.gog-input__label--float{position:absolute;inset-inline-start:var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x)));top:var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y)));max-width:calc(100% - 2 * var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;color:var(--gog-input-placeholder-color);font-size:var(--gog-input-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-input-transition-duration) var(--gog-easing),font-size var(--gog-input-transition-duration) var(--gog-easing),color var(--gog-input-transition-duration) var(--gog-easing),top var(--gog-input-transition-duration) var(--gog-easing),background-color var(--gog-input-transition-duration) var(--gog-easing)}.gog-input-wrapper--float-in,.gog-input-wrapper--float-on{--gog-input-float-top-padding: calc(var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-input-float-label-reserve))}.gog-input-wrapper--float-in .gog-input__field,.gog-input-wrapper--float-on .gog-input__field{padding-top:var(--gog-input-float-top-padding)}.gog-input-wrapper--float-in .gog-input__label--float,.gog-input-wrapper--float-on .gog-input__label--float{top:var(--gog-input-float-top-padding)}.gog-input-wrapper--float-in.gog-input-wrapper--floated .gog-input__label--float{top:var(--gog-input-float-label-in-top);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input-wrapper--float-on.gog-input-wrapper--floated .gog-input__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing);background-color:var(--gog-input-float-label-on-bg, var(--gog-input-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-input-wrapper--float-over.gog-input-wrapper--floated .gog-input__label--float{top:calc(-1 * var(--gog-input-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input-wrapper--float-over .gog-input__field-container{margin-top:var(--gog-input-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-input__field,.gog-input__label--float{transition:none}}.gog-textarea__clear{position:absolute;top:var(--gog-input-clear-inset);inset-inline-end:calc(var(--gog-input-clear-inset) + var(--gog-textarea-scrollbar-width, 0px));width:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-input-clear-radius);background:transparent;color:var(--gog-input-placeholder-color);line-height:1;cursor:pointer;transition:color var(--gog-input-transition-duration) var(--gog-easing)}.gog-textarea__clear:hover{color:var(--gog-input-icon-hover-color)}.gog-textarea__clear:focus-visible{outline:var(--gog-input-icon-focus-ring-width) solid var(--gog-input-icon-hover-color);outline-offset:var(--gog-input-focus-ring-offset)}.gog-textarea__clear gog-icon{font-size:calc(var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size))) * var(--gog-textarea-clear-icon-ratio))}\n"] }]
+                    }, template: "<div\r\n  class=\"gog-input-wrapper gog-contained-layout\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-input-wrapper--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-input-wrapper--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-input-wrapper--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-input-wrapper--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <label class=\"gog-input__label\" [attr.for]=\"resolvedInputId()\">{{ label() }}</label>\r\n  }\r\n  <div\r\n    class=\"gog-input__field-container\"\r\n    [class.gog-input__field-container--resizable]=\"resolvedResize() !== 'none' && !isDisabled()\"\r\n    [style.--gog-textarea-resize-inset-right.px]=\"resizeInsetRight()\"\r\n    [style.--gog-textarea-resize-inset-bottom.px]=\"resizeInsetBottom()\"\r\n  >\r\n    @if (label() && isFloatLabelActive()) {\r\n      <label class=\"gog-input__label gog-input__label--float\" [attr.for]=\"resolvedInputId()\">{{\r\n        label()\r\n      }}</label>\r\n    }\r\n    <textarea\r\n      #field\r\n      class=\"gog-input__field gog-textarea__field\"\r\n      [class.gog-input__field--error]=\"hasError()\"\r\n      [class.gog-textarea__field--resize-vertical]=\"resolvedResize() === 'vertical'\"\r\n      [class.gog-textarea__field--resize-horizontal]=\"resolvedResize() === 'horizontal'\"\r\n      [class.gog-textarea__field--resize-both]=\"resolvedResize() === 'both'\"\r\n      [class.gog-textarea__field--resize-none]=\"resolvedResize() === 'none'\"\r\n      [attr.id]=\"resolvedInputId()\"\r\n      [attr.name]=\"name() || null\"\r\n      [placeholder]=\"effectivePlaceholder()\"\r\n      [rows]=\"rows()\"\r\n      [value]=\"value()\"\r\n      [disabled]=\"isDisabled()\"\r\n      [readOnly]=\"readonly()\"\r\n      [attr.maxlength]=\"maxlength()\"\r\n      [attr.minlength]=\"minlength()\"\r\n      [attr.spellcheck]=\"spellcheck()\"\r\n      [attr.aria-invalid]=\"hasError()\"\r\n      [attr.aria-describedby]=\"errorId()\"\r\n      (input)=\"onInput($event)\"\r\n      (focus)=\"onFocus()\"\r\n      (blur)=\"onBlur()\"\r\n    ></textarea>\r\n    @if (showClear()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"gog-input__clear gog-textarea__clear gog-inline-center\"\r\n        [style.--gog-textarea-scrollbar-width.px]=\"scrollbarWidth()\"\r\n        [attr.aria-label]=\"resolvedClearLabel()\"\r\n        (click)=\"clearValue($event)\"\r\n      >\r\n        <gog-icon name=\"close\" />\r\n      </button>\r\n    }\r\n  </div>\r\n  @if (visibleError()) {\r\n    <span class=\"gog-input__error\" [attr.id]=\"errorId()\" role=\"alert\">{{ visibleError() }}</span>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-input-wrapper{display:flex;flex-direction:column;gap:var(--gog-input-gap);width:100%}:host(.gog-host--auto-width){width:fit-content}:host(.gog-host--auto-width) .gog-input-wrapper{width:fit-content}.gog-input__label{font-family:var(--gog-input-label-font-family);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input__field{width:100%;padding:var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x)));font-family:var(--gog-input-font-family);font-size:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-input-field-color);background-color:var(--gog-input-field-bg);border:var(--gog-input-field-border-width) var(--gog-input-field-border-style) var(--gog-input-field-border);border-radius:var(--gog-input-radius);outline:none;transition:border-color var(--gog-input-transition-duration) var(--gog-easing),box-shadow var(--gog-input-transition-duration) var(--gog-easing)}.gog-textarea__field{display:block;min-height:2.5em;line-height:1.5}.gog-textarea__field::-webkit-resizer{background:transparent}.gog-textarea__field{scrollbar-width:thin;scrollbar-color:var(--gog-scroll-thumb-bg) var(--gog-scroll-track-bg)}.gog-textarea__field::-webkit-scrollbar{width:var(--gog-scroll-thin-track-width);height:var(--gog-scroll-thin-track-width)}.gog-textarea__field::-webkit-scrollbar-track{background:var(--gog-scroll-track-bg);border-radius:var(--gog-scroll-track-radius)}.gog-textarea__field::-webkit-scrollbar-thumb{background:var(--gog-scroll-thumb-bg);border-radius:var(--gog-scroll-thumb-radius)}.gog-textarea__field::-webkit-scrollbar-thumb:hover{background:var(--gog-scroll-thumb-hover-bg)}.gog-textarea__field::-webkit-scrollbar-thumb:active{background:var(--gog-scroll-thumb-active-bg)}.gog-textarea__field::-webkit-scrollbar-corner{background:var(--gog-scroll-track-bg)}.gog-textarea__field--resize-vertical{resize:vertical}.gog-textarea__field--resize-horizontal{resize:horizontal}.gog-textarea__field--resize-both{resize:both}.gog-textarea__field--resize-none{resize:none}.gog-input__field-container{position:relative}.gog-input__field-container--resizable:after{content:\"\";position:absolute;inset-inline-end:calc(var(--gog-textarea-resize-grip-offset) + var(--gog-textarea-resize-inset-right));bottom:calc(var(--gog-textarea-resize-grip-offset) + var(--gog-textarea-resize-inset-bottom));width:var(--gog-textarea-resize-grip-size);height:var(--gog-textarea-resize-grip-size);clip-path:polygon(100% 0,100% 100%,0 100%);background-image:repeating-linear-gradient(135deg,transparent 0 var(--gog-textarea-resize-grip-stripe-gap),var(--gog-textarea-resize-grip-color) var(--gog-textarea-resize-grip-stripe-gap) calc(var(--gog-textarea-resize-grip-stripe-gap) + var(--gog-textarea-resize-grip-stripe-width)));opacity:var(--gog-textarea-resize-grip-opacity);pointer-events:none}.gog-input-wrapper--xsm{--gog-input-size-padding-y: var(--gog-field-xsm-padding-y);--gog-input-size-padding-x: var(--gog-field-xsm-padding-x);--gog-input-size-font-size: var(--gog-field-xsm-font-size)}.gog-input-wrapper--sm{--gog-input-size-padding-y: var(--gog-field-sm-padding-y);--gog-input-size-padding-x: var(--gog-field-sm-padding-x);--gog-input-size-font-size: var(--gog-field-sm-font-size)}.gog-input-wrapper--lg{--gog-input-size-padding-y: var(--gog-field-lg-padding-y);--gog-input-size-padding-x: var(--gog-field-lg-padding-x);--gog-input-size-font-size: var(--gog-field-lg-font-size)}.gog-input-wrapper--slg{--gog-input-size-padding-y: var(--gog-field-slg-padding-y);--gog-input-size-padding-x: var(--gog-field-slg-padding-x);--gog-input-size-font-size: var(--gog-field-slg-font-size)}.gog-input__field::placeholder{color:var(--gog-input-placeholder-color)}.gog-input__field:focus{border-color:var(--gog-input-focus-border);box-shadow:var(--gog-input-focus-glow)}.gog-input__field:focus-visible{outline:var(--gog-input-focus-ring-width) solid var(--gog-input-focus-border);outline-offset:var(--gog-input-focus-ring-offset)}.gog-input__field:disabled{opacity:var(--gog-input-disabled-opacity);cursor:not-allowed;resize:none}.gog-input__field--error{border-color:var(--gog-input-error-color)}.gog-input__error{font-family:var(--gog-input-font-family);font-size:var(--gog-input-error-font-size);color:var(--gog-input-error-color);margin-top:var(--gog-input-error-offset)}.gog-input__label--float{position:absolute;inset-inline-start:var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x)));top:var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y)));max-width:calc(100% - 2 * var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;color:var(--gog-input-placeholder-color);font-size:var(--gog-input-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-input-transition-duration) var(--gog-easing),font-size var(--gog-input-transition-duration) var(--gog-easing),color var(--gog-input-transition-duration) var(--gog-easing),top var(--gog-input-transition-duration) var(--gog-easing),background-color var(--gog-input-transition-duration) var(--gog-easing)}.gog-input-wrapper--float-in,.gog-input-wrapper--float-on{--gog-input-float-top-padding: calc(var(--gog-input-padding-y, var(--gog-input-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-input-float-label-reserve))}.gog-input-wrapper--float-in .gog-input__field,.gog-input-wrapper--float-on .gog-input__field{padding-top:var(--gog-input-float-top-padding)}.gog-input-wrapper--float-in .gog-input__label--float,.gog-input-wrapper--float-on .gog-input__label--float{top:var(--gog-input-float-top-padding)}.gog-input-wrapper--float-in.gog-input-wrapper--floated .gog-input__label--float{top:var(--gog-input-float-label-in-top);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input-wrapper--float-on.gog-input-wrapper--floated .gog-input__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing);background-color:var(--gog-input-float-label-on-bg, var(--gog-input-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-input-padding-x, var(--gog-input-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-input-wrapper--float-over.gog-input-wrapper--floated .gog-input__label--float{top:calc(-1 * var(--gog-input-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-input-label-font-size);color:var(--gog-input-label-color);text-transform:var(--gog-input-label-text-transform);letter-spacing:var(--gog-input-label-letter-spacing)}.gog-input-wrapper--float-over .gog-input__field-container{margin-top:var(--gog-input-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-input__field,.gog-input__label--float{transition:none}}.gog-textarea__clear{position:absolute;top:var(--gog-input-clear-inset);inset-inline-end:calc(var(--gog-input-clear-inset) + var(--gog-textarea-scrollbar-width, 0px));width:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-input-clear-radius);background:transparent;color:var(--gog-input-placeholder-color);line-height:1;cursor:pointer;transition:color var(--gog-input-transition-duration) var(--gog-easing)}.gog-textarea__clear:hover{color:var(--gog-input-icon-hover-color)}.gog-textarea__clear:focus-visible{outline:var(--gog-input-icon-focus-ring-width) solid var(--gog-input-icon-hover-color);outline-offset:var(--gog-input-focus-ring-offset)}.gog-textarea__clear gog-icon{font-size:calc(var(--gog-input-font, var(--gog-input-size-font-size, var(--gog-field-md-font-size))) * var(--gog-textarea-clear-icon-ratio))}\n"] }]
         }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], errorDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorDisplay", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], maxlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxlength", required: false }] }], minlength: [{ type: i0.Input, args: [{ isSignal: true, alias: "minlength", required: false }] }], spellcheck: [{ type: i0.Input, args: [{ isSignal: true, alias: "spellcheck", required: false }] }], resize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resize", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], clearable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearable", required: false }] }], clearAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearAriaLabel", required: false }] }], floatLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "floatLabel", required: false }] }], floatLabelShowPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "floatLabelShowPlaceholder", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], fieldRef: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }] } });
 
 class ChipComponent {
@@ -6818,14 +6818,14 @@ class SelectComponent extends GogDropdownBase {
         this.close();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SelectComponent, isStandalone: true, selector: "gog-select", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "style.--gog-select-min-width": "minWidth()" } }, viewQueries: [{ propertyName: "panelTemplate", first: true, predicate: ["panelTpl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!--\r\n  Deliberately not `gog-contained-layout`: `contain: layout` makes this element a stacking\r\n  context, which traps the panel's z-index inside it and lets whatever follows on the page\r\n  paint over the open dropdown.\r\n-->\r\n<div\r\n  class=\"gog-select\"\r\n  [class.gog-select--clearable]=\"showClear()\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-select--disabled]=\"isDisabled()\"\r\n  [class.gog-select--open]=\"isOpen()\"\r\n  [class.gog-select--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-select--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-select--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-select--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  <!--\r\n    Associated with aria-labelledby rather than `for`: the trigger is a <button>, which is\r\n    not a labelable element, so `for` pointing at it is silently ignored by browsers and\r\n    assistive tech alike.\r\n  -->\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n    <label class=\"gog-select__label\" [id]=\"labelId()\">{{ label() }}</label>\r\n  }\r\n\r\n  <div class=\"gog-select__field\">\r\n    @if (label() && isFloatLabelActive()) {\r\n      <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n      <label class=\"gog-select__label gog-select__label--float\" [id]=\"labelId()\">{{\r\n        label()\r\n      }}</label>\r\n    }\r\n    <button\r\n      type=\"button\"\r\n      class=\"gog-select__control\"\r\n      [id]=\"triggerId()\"\r\n      [disabled]=\"isDisabled()\"\r\n      [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || placeholder() || 'Select'\"\r\n      [attr.aria-controls]=\"listboxId()\"\r\n      [attr.aria-expanded]=\"isOpen()\"\r\n      [attr.aria-haspopup]=\"'listbox'\"\r\n      [attr.aria-invalid]=\"hasError()\"\r\n      [attr.aria-describedby]=\"errorId()\"\r\n      (click)=\"toggle()\"\r\n      (focus)=\"onFocusIn()\"\r\n      (blur)=\"onFocusOut()\"\r\n      (keydown.enter)=\"toggle(); $event.preventDefault()\"\r\n      (keydown.space)=\"toggle(); $event.preventDefault()\"\r\n      (keydown.escape)=\"close()\"\r\n      (keydown.arrowdown)=\"onTriggerArrowKeydown($event)\"\r\n      (keydown.arrowup)=\"onTriggerArrowKeydown($event)\"\r\n    >\r\n      <span class=\"gog-select__value\" [class.gog-select__value--placeholder]=\"!selectedOption()\">\r\n        {{ selectedLabel() || effectivePlaceholder() }}\r\n      </span>\r\n\r\n      <span class=\"gog-select__chevron\" aria-hidden=\"true\">\r\n        <gog-icon [template]=\"chevronSlot()?.templateRef ?? null\" name=\"chevron-down\" />\r\n      </span>\r\n    </button>\r\n\r\n    <!--\r\n      A sibling of the trigger, not a child: `.gog-select__control` is a <button>, and nesting\r\n      one button inside another is invalid HTML. It is positioned over the trigger's right edge\r\n      by the stylesheet, which also reserves room for it so it never covers the value text.\r\n    -->\r\n    @if (showClear()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"gog-select__clear gog-inline-center\"\r\n        [attr.aria-label]=\"resolvedClearLabel()\"\r\n        (click)=\"clearValue($event)\"\r\n      >\r\n        <gog-icon name=\"close\" />\r\n      </button>\r\n    }\r\n\r\n    @if (isOpen() && !resolvedAppendToBody()) {\r\n      <ng-container [ngTemplateOutlet]=\"panelTpl\" />\r\n    }\r\n  </div>\r\n\r\n  @if (hasError()) {\r\n    <span class=\"gog-select__error\" [attr.id]=\"errorId()\" role=\"alert\">\r\n      {{ visibleError() }}\r\n    </span>\r\n  }\r\n</div>\r\n\r\n<!--\r\n  One template for both render modes. When `appendToBody` is set it is stamped into\r\n  <body> by the overlay, which is why the portal-only modifier and the resolved\r\n  coordinates are applied conditionally: outside the component's subtree the panel can\r\n  no longer inherit the size tokens from the `.gog-select--sm/--lg` wrapper.\r\n-->\r\n<ng-template #panelTpl>\r\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- (click) below is housekeeping stopPropagation, not an interactive handler; the focusable/keyboard-operable elements are the options inside -->\r\n  <div\r\n    [id]=\"listboxId()\"\r\n    class=\"gog-select__dropdown\"\r\n    [class.gog-select__dropdown--up]=\"!resolvedAppendToBody() && dropdownDirectionState() === 'up'\"\r\n    [class.gog-select__dropdown--portal]=\"resolvedAppendToBody()\"\r\n    [class]=\"panelSizeClass()\"\r\n    [style.top.px]=\"resolvedAppendToBody() ? panelPlacement()?.top : null\"\r\n    [style.left.px]=\"resolvedAppendToBody() ? panelPlacement()?.left : null\"\r\n    [style.width]=\"resolvedAppendToBody() ? resolvedPanelWidth() : null\"\r\n    [style.min-width]=\"resolvedAppendToBody() ? resolvedPanelMinWidth() : null\"\r\n    [style.max-height]=\"resolvedAppendToBody() ? resolvedPanelMaxHeight() : null\"\r\n    [style.z-index]=\"dropdownZIndex() ?? panelZIndex()\"\r\n    role=\"listbox\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <!--\r\n      Not a tab stop of its own: the listbox pattern's only stop is the trigger, with\r\n      focus moved between options via the arrow keys (roving-focus.ts), which already\r\n      scrolls the focused option into view natively \u2014 no separate keyboard-scroll target\r\n      needed here.\r\n    -->\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'top') {\r\n      <div class=\"gog-select__filter gog-select__filter--top\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-select__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    <gog-scroll\r\n      size=\"thin\"\r\n      [focusable]=\"false\"\r\n      overscrollBehavior=\"contain\"\r\n      class=\"gog-select__scroll\"\r\n    >\r\n      @if (visibleOptions().length === 0) {\r\n        <p class=\"gog-select__empty\">{{ filterEmptyMessage() }}</p>\r\n      }\r\n      @for (option of visibleOptions(); track valueOf(option)) {\r\n        <!--\r\n          tabindex=\"-1\" keeps the list to a single tab stop, as the listbox pattern expects:\r\n          focus is moved between options with the arrow keys, not by tabbing through every\r\n          one of them. Programmatic .focus() still works on a negative tabindex.\r\n        -->\r\n        <button\r\n          type=\"button\"\r\n          class=\"gog-select__option\"\r\n          role=\"option\"\r\n          tabindex=\"-1\"\r\n          [attr.aria-selected]=\"isSelected(option)\"\r\n          [attr.aria-disabled]=\"isOptionDisabled(option)\"\r\n          [class.gog-select__option--selected]=\"isSelected(option)\"\r\n          [class.gog-select__option--disabled]=\"isOptionDisabled(option)\"\r\n          (click)=\"selectOption(option, $event)\"\r\n          (keydown)=\"onOptionKeydown($event)\"\r\n          gogRipple\r\n          [rippleDisabled]=\"!rippleEnabled()\"\r\n        >\r\n          @if (optionSlot(); as slot) {\r\n            <ng-container\r\n              *ngTemplateOutlet=\"\r\n                slot.templateRef;\r\n                context: optionContext(option, isSelected(option))\r\n              \"\r\n            />\r\n          } @else {\r\n            <span class=\"gog-select__option-mark\" aria-hidden=\"true\">\r\n              @if (isSelected(option)) {\r\n                <gog-icon name=\"check\" />\r\n              }\r\n            </span>\r\n            <span class=\"gog-select__option-label\">{{ labelOf(option) }}</span>\r\n          }\r\n        </button>\r\n      }\r\n    </gog-scroll>\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'bottom') {\r\n      <div class=\"gog-select__filter gog-select__filter--bottom\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-select__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";:host{display:block}:host(.gog-host--auto-width){width:fit-content}.gog-select{display:flex;flex-direction:column;gap:var(--gog-select-gap);width:100%}.gog-select--xsm,.gog-select__dropdown--xsm{--gog-select-size-padding-y: var(--gog-field-xsm-padding-y);--gog-select-size-padding-x: var(--gog-field-xsm-padding-x);--gog-select-size-font-size: var(--gog-field-xsm-font-size)}.gog-select--sm,.gog-select__dropdown--sm{--gog-select-size-padding-y: var(--gog-field-sm-padding-y);--gog-select-size-padding-x: var(--gog-field-sm-padding-x);--gog-select-size-font-size: var(--gog-field-sm-font-size)}.gog-select--lg,.gog-select__dropdown--lg{--gog-select-size-padding-y: var(--gog-field-lg-padding-y);--gog-select-size-padding-x: var(--gog-field-lg-padding-x);--gog-select-size-font-size: var(--gog-field-lg-font-size)}.gog-select--slg,.gog-select__dropdown--slg{--gog-select-size-padding-y: var(--gog-field-slg-padding-y);--gog-select-size-padding-x: var(--gog-field-slg-padding-x);--gog-select-size-font-size: var(--gog-field-slg-font-size)}.gog-select--disabled{opacity:var(--gog-select-disabled-opacity)}.gog-select--disabled .gog-select__label,.gog-select--disabled .gog-select__field{cursor:not-allowed}.gog-select__label{font-family:var(--gog-select-label-font-family);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing);cursor:pointer}.gog-select__field{position:relative;cursor:pointer}.gog-select__control{width:100%;padding-block:var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y)));padding-inline:var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))) var(--gog-select-chevron-inset);display:flex;align-items:center;justify-content:space-between;gap:var(--gog-select-control-gap);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-field-color);background-color:var(--gog-select-field-bg);border:var(--gog-select-field-border-width) var(--gog-select-field-border-style) var(--gog-select-field-border);border-radius:var(--gog-select-radius);outline:none;cursor:pointer;transition:border-color var(--gog-select-transition-duration) var(--gog-easing),box-shadow var(--gog-select-transition-duration) var(--gog-easing)}.gog-select__control:focus{border-color:var(--gog-select-focus-border);box-shadow:var(--gog-select-focus-glow)}.gog-select__control:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:var(--gog-select-focus-ring-offset)}.gog-select__control:disabled{cursor:not-allowed}.gog-select--open .gog-select__control{border-color:var(--gog-select-focus-border)}.gog-select__value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start}.gog-select__value--placeholder{color:var(--gog-select-placeholder-color)}.gog-select__chevron{width:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));display:flex;align-items:center;justify-content:center;color:var(--gog-select-chevron-color);pointer-events:none;flex-shrink:0}.gog-select__chevron gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-chevron-icon-ratio))}.gog-select__dropdown{position:absolute;top:calc(100% + var(--gog-select-panel-offset));inset-inline-start:0;inset-inline-end:auto;min-width:100%;width:max-content;max-width:var(--gog-select-panel-max-width);z-index:var(--gog-dropdown-z);display:flex;flex-direction:column;background-color:var(--gog-select-panel-bg);border:var(--gog-select-field-border-width) var(--gog-select-field-border-style) var(--gog-select-field-border);border-radius:var(--gog-select-radius);max-height:var(--gog-select-panel-max-height);overflow:hidden;box-shadow:var(--gog-select-panel-shadow)}.gog-select__scroll{flex:1;min-height:0}.gog-select__dropdown--up{top:auto;bottom:calc(100% + var(--gog-select-panel-offset))}.gog-select__dropdown--portal{position:fixed;top:unset;bottom:unset;inset-inline:unset}.gog-select__option{width:100%;display:flex;align-items:center;gap:var(--gog-select-option-gap);padding:var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x)));border:0;background:transparent;text-align:start;font:inherit;font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-option-color);cursor:pointer;transition:background-color var(--gog-select-option-transition-duration) var(--gog-easing)}.gog-select__option:hover{background-color:var(--gog-select-option-hover-bg)}.gog-select__option--selected{color:var(--gog-select-option-selected-color)}.gog-select__option--disabled{opacity:var(--gog-select-option-disabled-opacity);cursor:not-allowed}.gog-select__option:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:calc(var(--gog-select-focus-ring-width) * -1)}.gog-select__option-mark{display:inline-flex;align-items:center;justify-content:center;width:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-size-ratio));height:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-size-ratio));flex-shrink:0}.gog-select__option-mark gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-icon-ratio))}.gog-select__error{font-family:var(--gog-select-font-family);font-size:var(--gog-select-error-font-size);color:var(--gog-select-error-color)}.gog-select__label--float{position:absolute;inset-inline-start:var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x)));top:50%;transform:translateY(-50%);max-width:calc(100% - 2 * var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;cursor:default;color:var(--gog-select-placeholder-color);font-size:var(--gog-select-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-select-transition-duration) var(--gog-easing),font-size var(--gog-select-transition-duration) var(--gog-easing),color var(--gog-select-transition-duration) var(--gog-easing),top var(--gog-select-transition-duration) var(--gog-easing),background-color var(--gog-select-transition-duration) var(--gog-easing)}.gog-select--float-in,.gog-select--float-on{--gog-select-float-top-padding: calc(var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-select-float-label-reserve))}.gog-select--float-in .gog-select__control,.gog-select--float-on .gog-select__control{padding-top:var(--gog-select-float-top-padding)}.gog-select--float-in .gog-select__label--float,.gog-select--float-on .gog-select__label--float{top:var(--gog-select-float-top-padding);transform:none}.gog-select--float-in.gog-select--floated .gog-select__label--float{top:var(--gog-select-float-label-in-top);transform:translateY(0);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing)}.gog-select--float-on.gog-select--floated .gog-select__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing);background-color:var(--gog-select-float-label-on-bg, var(--gog-select-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-select--float-over.gog-select--floated .gog-select__label--float{top:calc(-1 * var(--gog-select-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing)}.gog-select--float-over .gog-select__field{margin-top:var(--gog-select-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-select__control,.gog-select__option,.gog-select__label--float{transition:none}}.gog-select__clear{position:absolute;top:50%;inset-inline-end:var(--gog-select-chevron-inset);transform:translateY(-50%);width:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-select-clear-radius);background:transparent;color:var(--gog-select-clear-color);line-height:1;cursor:pointer;transition:color var(--gog-select-transition-duration) var(--gog-easing)}.gog-select__clear:hover{color:var(--gog-select-clear-hover-color)}.gog-select__clear:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:var(--gog-select-focus-ring-offset)}.gog-select__clear gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-clear-icon-ratio))}.gog-select--clearable .gog-select__control{padding-inline-end:calc(var(--gog-select-chevron-inset) + var(--gog-select-clear-gap) + var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))))}.gog-select__filter{position:sticky;top:0;z-index:1;padding:var(--gog-select-filter-padding);background:var(--gog-select-panel-bg)}.gog-select__filter-input{width:100%;padding:var(--gog-select-filter-input-padding-y) var(--gog-select-filter-input-padding-x);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-filter-input-color);background:var(--gog-select-filter-input-bg);border:var(--gog-control-border-width) var(--gog-control-border-style) var(--gog-select-filter-input-border);border-radius:var(--gog-select-filter-input-radius);outline:none}.gog-select__filter-input:focus{border-color:var(--gog-select-focus-border)}.gog-select__empty{margin:0;padding:var(--gog-select-filter-empty-padding);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-filter-empty-color);text-align:center}.gog-select__filter--top{border-bottom:var(--gog-select-filter-border-width) var(--gog-select-filter-border-style) var(--gog-select-filter-border-color)}.gog-select__filter--bottom{top:auto;bottom:0;border-top:var(--gog-select-filter-border-width) var(--gog-select-filter-border-style) var(--gog-select-filter-border-color)}:host(.gog-host--auto-width),:host(.gog-host--auto-width) .gog-select__control{min-width:var(--gog-select-min-width)}.gog-select__dropdown--portal{max-width:var(--gog-select-panel-max-width)}\n"], dependencies: [{ kind: "directive", type: GogRippleDirective, selector: "[gogRipple]", inputs: ["rippleDisabled", "rippleCentred"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ScrollComponent, selector: "gog-scroll", inputs: ["axis", "size", "autoHide", "hideDelay", "reachThreshold", "focusable", "ariaLabel", "overscrollBehavior", "showTrack"], outputs: ["gogScroll", "gogReachStart", "gogReachEnd"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SelectComponent, isStandalone: true, selector: "gog-select", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "style.--gog-select-min-width": "minWidth()" } }, viewQueries: [{ propertyName: "panelTemplate", first: true, predicate: ["panelTpl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!--\r\n  Deliberately not `gog-contained-layout`: `contain: layout` makes this element a stacking\r\n  context, which traps the panel's z-index inside it and lets whatever follows on the page\r\n  paint over the open dropdown.\r\n-->\r\n<div\r\n  class=\"gog-select\"\r\n  [class.gog-select--clearable]=\"showClear()\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-select--disabled]=\"isDisabled()\"\r\n  [class.gog-select--open]=\"isOpen()\"\r\n  [class.gog-select--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-select--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-select--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-select--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  <!--\r\n    Associated with aria-labelledby rather than `for`: the trigger is a <button>, which is\r\n    not a labelable element, so `for` pointing at it is silently ignored by browsers and\r\n    assistive tech alike.\r\n  -->\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n    <label class=\"gog-select__label\" [id]=\"labelId()\">{{ label() }}</label>\r\n  }\r\n\r\n  <div class=\"gog-select__field\">\r\n    @if (label() && isFloatLabelActive()) {\r\n      <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n      <label class=\"gog-select__label gog-select__label--float\" [id]=\"labelId()\">{{\r\n        label()\r\n      }}</label>\r\n    }\r\n    <button\r\n      type=\"button\"\r\n      class=\"gog-select__control\"\r\n      [id]=\"triggerId()\"\r\n      [disabled]=\"isDisabled()\"\r\n      [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || placeholder() || 'Select'\"\r\n      [attr.aria-controls]=\"listboxId()\"\r\n      [attr.aria-expanded]=\"isOpen()\"\r\n      [attr.aria-haspopup]=\"'listbox'\"\r\n      [attr.aria-invalid]=\"hasError()\"\r\n      [attr.aria-describedby]=\"errorId()\"\r\n      (click)=\"toggle()\"\r\n      (focus)=\"onFocusIn()\"\r\n      (blur)=\"onFocusOut()\"\r\n      (keydown.enter)=\"toggle(); $event.preventDefault()\"\r\n      (keydown.space)=\"toggle(); $event.preventDefault()\"\r\n      (keydown.escape)=\"close()\"\r\n      (keydown.arrowdown)=\"onTriggerArrowKeydown($event)\"\r\n      (keydown.arrowup)=\"onTriggerArrowKeydown($event)\"\r\n    >\r\n      <span class=\"gog-select__value\" [class.gog-select__value--placeholder]=\"!selectedOption()\">\r\n        {{ selectedLabel() || effectivePlaceholder() }}\r\n      </span>\r\n\r\n      <span\r\n        class=\"gog-select__chevron\"\r\n        [class.gog-select__chevron--auto-rotate]=\"!chevronSlot()\"\r\n        aria-hidden=\"true\"\r\n      >\r\n        <gog-icon [template]=\"chevronSlot()?.templateRef ?? null\" name=\"chevron-down\" />\r\n      </span>\r\n    </button>\r\n\r\n    <!--\r\n      A sibling of the trigger, not a child: `.gog-select__control` is a <button>, and nesting\r\n      one button inside another is invalid HTML. It is positioned over the trigger's right edge\r\n      by the stylesheet, which also reserves room for it so it never covers the value text.\r\n    -->\r\n    @if (showClear()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"gog-select__clear gog-inline-center\"\r\n        [attr.aria-label]=\"resolvedClearLabel()\"\r\n        (click)=\"clearValue($event)\"\r\n      >\r\n        <gog-icon name=\"close\" />\r\n      </button>\r\n    }\r\n\r\n    @if (isOpen() && !resolvedAppendToBody()) {\r\n      <ng-container [ngTemplateOutlet]=\"panelTpl\" />\r\n    }\r\n  </div>\r\n\r\n  @if (hasError()) {\r\n    <span class=\"gog-select__error\" [attr.id]=\"errorId()\" role=\"alert\">\r\n      {{ visibleError() }}\r\n    </span>\r\n  }\r\n</div>\r\n\r\n<!--\r\n  One template for both render modes. When `appendToBody` is set it is stamped into\r\n  <body> by the overlay, which is why the portal-only modifier and the resolved\r\n  coordinates are applied conditionally: outside the component's subtree the panel can\r\n  no longer inherit the size tokens from the `.gog-select--sm/--lg` wrapper.\r\n-->\r\n<ng-template #panelTpl>\r\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- (click) below is housekeeping stopPropagation, not an interactive handler; the focusable/keyboard-operable elements are the options inside -->\r\n  <div\r\n    [id]=\"listboxId()\"\r\n    class=\"gog-select__dropdown\"\r\n    [class.gog-select__dropdown--up]=\"!resolvedAppendToBody() && dropdownDirectionState() === 'up'\"\r\n    [class.gog-select__dropdown--portal]=\"resolvedAppendToBody()\"\r\n    [class]=\"panelSizeClass()\"\r\n    [style.top.px]=\"resolvedAppendToBody() ? panelPlacement()?.top : null\"\r\n    [style.left.px]=\"resolvedAppendToBody() ? panelPlacement()?.left : null\"\r\n    [style.width]=\"resolvedAppendToBody() ? resolvedPanelWidth() : null\"\r\n    [style.min-width]=\"resolvedAppendToBody() ? resolvedPanelMinWidth() : null\"\r\n    [style.max-height]=\"resolvedAppendToBody() ? resolvedPanelMaxHeight() : null\"\r\n    [style.z-index]=\"dropdownZIndex() ?? panelZIndex()\"\r\n    role=\"listbox\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <!--\r\n      Not a tab stop of its own: the listbox pattern's only stop is the trigger, with\r\n      focus moved between options via the arrow keys (roving-focus.ts), which already\r\n      scrolls the focused option into view natively \u2014 no separate keyboard-scroll target\r\n      needed here.\r\n    -->\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'top') {\r\n      <div class=\"gog-select__filter gog-select__filter--top\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-select__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    <gog-scroll\r\n      size=\"thin\"\r\n      [focusable]=\"false\"\r\n      overscrollBehavior=\"contain\"\r\n      class=\"gog-select__scroll\"\r\n    >\r\n      @if (visibleOptions().length === 0) {\r\n        <p class=\"gog-select__empty\">{{ filterEmptyMessage() }}</p>\r\n      }\r\n      @for (option of visibleOptions(); track valueOf(option)) {\r\n        <!--\r\n          tabindex=\"-1\" keeps the list to a single tab stop, as the listbox pattern expects:\r\n          focus is moved between options with the arrow keys, not by tabbing through every\r\n          one of them. Programmatic .focus() still works on a negative tabindex.\r\n        -->\r\n        <button\r\n          type=\"button\"\r\n          class=\"gog-select__option\"\r\n          role=\"option\"\r\n          tabindex=\"-1\"\r\n          [attr.aria-selected]=\"isSelected(option)\"\r\n          [attr.aria-disabled]=\"isOptionDisabled(option)\"\r\n          [class.gog-select__option--selected]=\"isSelected(option)\"\r\n          [class.gog-select__option--disabled]=\"isOptionDisabled(option)\"\r\n          (click)=\"selectOption(option, $event)\"\r\n          (keydown)=\"onOptionKeydown($event)\"\r\n          gogRipple\r\n          [rippleDisabled]=\"!rippleEnabled()\"\r\n        >\r\n          @if (optionSlot(); as slot) {\r\n            <ng-container\r\n              *ngTemplateOutlet=\"\r\n                slot.templateRef;\r\n                context: optionContext(option, isSelected(option))\r\n              \"\r\n            />\r\n          } @else {\r\n            <span class=\"gog-select__option-mark\" aria-hidden=\"true\">\r\n              @if (isSelected(option)) {\r\n                <gog-icon name=\"check\" />\r\n              }\r\n            </span>\r\n            <span class=\"gog-select__option-label\">{{ labelOf(option) }}</span>\r\n          }\r\n        </button>\r\n      }\r\n    </gog-scroll>\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'bottom') {\r\n      <div class=\"gog-select__filter gog-select__filter--bottom\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-select__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";:host{display:block}:host(.gog-host--auto-width){width:fit-content}.gog-select{display:flex;flex-direction:column;gap:var(--gog-select-gap);width:100%}.gog-select--xsm,.gog-select__dropdown--xsm{--gog-select-size-padding-y: var(--gog-field-xsm-padding-y);--gog-select-size-padding-x: var(--gog-field-xsm-padding-x);--gog-select-size-font-size: var(--gog-field-xsm-font-size)}.gog-select--sm,.gog-select__dropdown--sm{--gog-select-size-padding-y: var(--gog-field-sm-padding-y);--gog-select-size-padding-x: var(--gog-field-sm-padding-x);--gog-select-size-font-size: var(--gog-field-sm-font-size)}.gog-select--lg,.gog-select__dropdown--lg{--gog-select-size-padding-y: var(--gog-field-lg-padding-y);--gog-select-size-padding-x: var(--gog-field-lg-padding-x);--gog-select-size-font-size: var(--gog-field-lg-font-size)}.gog-select--slg,.gog-select__dropdown--slg{--gog-select-size-padding-y: var(--gog-field-slg-padding-y);--gog-select-size-padding-x: var(--gog-field-slg-padding-x);--gog-select-size-font-size: var(--gog-field-slg-font-size)}.gog-select--disabled{opacity:var(--gog-select-disabled-opacity)}.gog-select--disabled .gog-select__label,.gog-select--disabled .gog-select__field{cursor:not-allowed}.gog-select__label{font-family:var(--gog-select-label-font-family);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing);cursor:pointer}.gog-select__field{position:relative;cursor:pointer}.gog-select__control{width:100%;padding-block:var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y)));padding-inline:var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))) var(--gog-select-chevron-inset);display:flex;align-items:center;justify-content:space-between;gap:var(--gog-select-control-gap);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-field-color);background-color:var(--gog-select-field-bg);border:var(--gog-select-field-border-width) var(--gog-select-field-border-style) var(--gog-select-field-border);border-radius:var(--gog-select-radius);outline:none;cursor:pointer;transition:border-color var(--gog-select-transition-duration) var(--gog-easing),box-shadow var(--gog-select-transition-duration) var(--gog-easing)}.gog-select__control:focus{border-color:var(--gog-select-focus-border);box-shadow:var(--gog-select-focus-glow)}.gog-select__control:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:var(--gog-select-focus-ring-offset)}.gog-select__control:disabled{cursor:not-allowed}.gog-select--open .gog-select__control{border-color:var(--gog-select-focus-border)}.gog-select__value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start}.gog-select__value--placeholder{color:var(--gog-select-placeholder-color)}.gog-select__chevron{width:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));display:flex;align-items:center;justify-content:center;color:var(--gog-select-chevron-color);pointer-events:none;flex-shrink:0}.gog-select__chevron--auto-rotate{transition:transform var(--gog-select-transition-duration) var(--gog-easing)}.gog-select--open .gog-select__chevron--auto-rotate{transform:rotate(180deg)}.gog-select__chevron gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-chevron-icon-ratio))}.gog-select__dropdown{position:absolute;top:calc(100% + var(--gog-select-panel-offset));inset-inline-start:0;inset-inline-end:auto;min-width:100%;width:max-content;max-width:var(--gog-select-panel-max-width);z-index:var(--gog-dropdown-z);display:flex;flex-direction:column;background-color:var(--gog-select-panel-bg);border:var(--gog-select-field-border-width) var(--gog-select-field-border-style) var(--gog-select-field-border);border-radius:var(--gog-select-radius);max-height:var(--gog-select-panel-max-height);overflow:hidden;box-shadow:var(--gog-select-panel-shadow)}.gog-select__scroll{flex:1;min-height:0}.gog-select__dropdown--up{top:auto;bottom:calc(100% + var(--gog-select-panel-offset))}.gog-select__dropdown--portal{position:fixed;top:unset;bottom:unset;inset-inline:unset}.gog-select__option{width:100%;display:flex;align-items:center;gap:var(--gog-select-option-gap);padding:var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x)));border:0;background:transparent;text-align:start;font:inherit;font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-option-color);cursor:pointer;transition:background-color var(--gog-select-option-transition-duration) var(--gog-easing)}.gog-select__option:hover{background-color:var(--gog-select-option-hover-bg)}.gog-select__option--selected{color:var(--gog-select-option-selected-color)}.gog-select__option--disabled{opacity:var(--gog-select-option-disabled-opacity);cursor:not-allowed}.gog-select__option:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:calc(var(--gog-select-focus-ring-width) * -1)}.gog-select__option-mark{display:inline-flex;align-items:center;justify-content:center;width:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-size-ratio));height:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-size-ratio));flex-shrink:0}.gog-select__option-mark gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-icon-ratio))}.gog-select__error{font-family:var(--gog-select-font-family);font-size:var(--gog-select-error-font-size);color:var(--gog-select-error-color)}.gog-select__label--float{position:absolute;inset-inline-start:var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x)));top:50%;transform:translateY(-50%);max-width:calc(100% - 2 * var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;cursor:default;color:var(--gog-select-placeholder-color);font-size:var(--gog-select-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-select-transition-duration) var(--gog-easing),font-size var(--gog-select-transition-duration) var(--gog-easing),color var(--gog-select-transition-duration) var(--gog-easing),top var(--gog-select-transition-duration) var(--gog-easing),background-color var(--gog-select-transition-duration) var(--gog-easing)}.gog-select--float-in,.gog-select--float-on{--gog-select-float-top-padding: calc(var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-select-float-label-reserve))}.gog-select--float-in .gog-select__control,.gog-select--float-on .gog-select__control{padding-top:var(--gog-select-float-top-padding)}.gog-select--float-in .gog-select__label--float,.gog-select--float-on .gog-select__label--float{top:var(--gog-select-float-top-padding);transform:none}.gog-select--float-in.gog-select--floated .gog-select__label--float{top:var(--gog-select-float-label-in-top);transform:translateY(0);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing)}.gog-select--float-on.gog-select--floated .gog-select__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing);background-color:var(--gog-select-float-label-on-bg, var(--gog-select-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-select--float-over.gog-select--floated .gog-select__label--float{top:calc(-1 * var(--gog-select-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing)}.gog-select--float-over .gog-select__field{margin-top:var(--gog-select-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-select__control,.gog-select__option,.gog-select__chevron--auto-rotate,.gog-select__label--float{transition:none}}.gog-select__clear{position:absolute;top:50%;inset-inline-end:var(--gog-select-chevron-inset);transform:translateY(-50%);width:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-select-clear-radius);background:transparent;color:var(--gog-select-clear-color);line-height:1;cursor:pointer;transition:color var(--gog-select-transition-duration) var(--gog-easing)}.gog-select__clear:hover{color:var(--gog-select-clear-hover-color)}.gog-select__clear:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:var(--gog-select-focus-ring-offset)}.gog-select__clear gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-clear-icon-ratio))}.gog-select--clearable .gog-select__control{padding-inline-end:calc(var(--gog-select-chevron-inset) + var(--gog-select-clear-gap) + var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))))}.gog-select__filter{position:sticky;top:0;z-index:1;padding:var(--gog-select-filter-padding);background:var(--gog-select-panel-bg)}.gog-select__filter-input{width:100%;padding:var(--gog-select-filter-input-padding-y) var(--gog-select-filter-input-padding-x);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-filter-input-color);background:var(--gog-select-filter-input-bg);border:var(--gog-control-border-width) var(--gog-control-border-style) var(--gog-select-filter-input-border);border-radius:var(--gog-select-filter-input-radius);outline:none}.gog-select__filter-input:focus{border-color:var(--gog-select-focus-border)}.gog-select__empty{margin:0;padding:var(--gog-select-filter-empty-padding);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-filter-empty-color);text-align:center}.gog-select__filter--top{border-bottom:var(--gog-select-filter-border-width) var(--gog-select-filter-border-style) var(--gog-select-filter-border-color)}.gog-select__filter--bottom{top:auto;bottom:0;border-top:var(--gog-select-filter-border-width) var(--gog-select-filter-border-style) var(--gog-select-filter-border-color)}:host(.gog-host--auto-width),:host(.gog-host--auto-width) .gog-select__control{min-width:var(--gog-select-min-width)}.gog-select__dropdown--portal{max-width:var(--gog-select-panel-max-width)}\n"], dependencies: [{ kind: "directive", type: GogRippleDirective, selector: "[gogRipple]", inputs: ["rippleDisabled", "rippleCentred"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ScrollComponent, selector: "gog-scroll", inputs: ["axis", "size", "autoHide", "hideDelay", "reachThreshold", "focusable", "ariaLabel", "overscrollBehavior", "showTrack"], outputs: ["gogScroll", "gogReachStart", "gogReachEnd"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'gog-select', imports: [GogRippleDirective, IconComponent, NgTemplateOutlet, ScrollComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         // Only bites when the control has opted out of full width; otherwise the container decides.
                         '[style.--gog-select-min-width]': 'minWidth()',
-                    }, template: "<!--\r\n  Deliberately not `gog-contained-layout`: `contain: layout` makes this element a stacking\r\n  context, which traps the panel's z-index inside it and lets whatever follows on the page\r\n  paint over the open dropdown.\r\n-->\r\n<div\r\n  class=\"gog-select\"\r\n  [class.gog-select--clearable]=\"showClear()\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-select--disabled]=\"isDisabled()\"\r\n  [class.gog-select--open]=\"isOpen()\"\r\n  [class.gog-select--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-select--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-select--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-select--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  <!--\r\n    Associated with aria-labelledby rather than `for`: the trigger is a <button>, which is\r\n    not a labelable element, so `for` pointing at it is silently ignored by browsers and\r\n    assistive tech alike.\r\n  -->\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n    <label class=\"gog-select__label\" [id]=\"labelId()\">{{ label() }}</label>\r\n  }\r\n\r\n  <div class=\"gog-select__field\">\r\n    @if (label() && isFloatLabelActive()) {\r\n      <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n      <label class=\"gog-select__label gog-select__label--float\" [id]=\"labelId()\">{{\r\n        label()\r\n      }}</label>\r\n    }\r\n    <button\r\n      type=\"button\"\r\n      class=\"gog-select__control\"\r\n      [id]=\"triggerId()\"\r\n      [disabled]=\"isDisabled()\"\r\n      [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || placeholder() || 'Select'\"\r\n      [attr.aria-controls]=\"listboxId()\"\r\n      [attr.aria-expanded]=\"isOpen()\"\r\n      [attr.aria-haspopup]=\"'listbox'\"\r\n      [attr.aria-invalid]=\"hasError()\"\r\n      [attr.aria-describedby]=\"errorId()\"\r\n      (click)=\"toggle()\"\r\n      (focus)=\"onFocusIn()\"\r\n      (blur)=\"onFocusOut()\"\r\n      (keydown.enter)=\"toggle(); $event.preventDefault()\"\r\n      (keydown.space)=\"toggle(); $event.preventDefault()\"\r\n      (keydown.escape)=\"close()\"\r\n      (keydown.arrowdown)=\"onTriggerArrowKeydown($event)\"\r\n      (keydown.arrowup)=\"onTriggerArrowKeydown($event)\"\r\n    >\r\n      <span class=\"gog-select__value\" [class.gog-select__value--placeholder]=\"!selectedOption()\">\r\n        {{ selectedLabel() || effectivePlaceholder() }}\r\n      </span>\r\n\r\n      <span class=\"gog-select__chevron\" aria-hidden=\"true\">\r\n        <gog-icon [template]=\"chevronSlot()?.templateRef ?? null\" name=\"chevron-down\" />\r\n      </span>\r\n    </button>\r\n\r\n    <!--\r\n      A sibling of the trigger, not a child: `.gog-select__control` is a <button>, and nesting\r\n      one button inside another is invalid HTML. It is positioned over the trigger's right edge\r\n      by the stylesheet, which also reserves room for it so it never covers the value text.\r\n    -->\r\n    @if (showClear()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"gog-select__clear gog-inline-center\"\r\n        [attr.aria-label]=\"resolvedClearLabel()\"\r\n        (click)=\"clearValue($event)\"\r\n      >\r\n        <gog-icon name=\"close\" />\r\n      </button>\r\n    }\r\n\r\n    @if (isOpen() && !resolvedAppendToBody()) {\r\n      <ng-container [ngTemplateOutlet]=\"panelTpl\" />\r\n    }\r\n  </div>\r\n\r\n  @if (hasError()) {\r\n    <span class=\"gog-select__error\" [attr.id]=\"errorId()\" role=\"alert\">\r\n      {{ visibleError() }}\r\n    </span>\r\n  }\r\n</div>\r\n\r\n<!--\r\n  One template for both render modes. When `appendToBody` is set it is stamped into\r\n  <body> by the overlay, which is why the portal-only modifier and the resolved\r\n  coordinates are applied conditionally: outside the component's subtree the panel can\r\n  no longer inherit the size tokens from the `.gog-select--sm/--lg` wrapper.\r\n-->\r\n<ng-template #panelTpl>\r\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- (click) below is housekeeping stopPropagation, not an interactive handler; the focusable/keyboard-operable elements are the options inside -->\r\n  <div\r\n    [id]=\"listboxId()\"\r\n    class=\"gog-select__dropdown\"\r\n    [class.gog-select__dropdown--up]=\"!resolvedAppendToBody() && dropdownDirectionState() === 'up'\"\r\n    [class.gog-select__dropdown--portal]=\"resolvedAppendToBody()\"\r\n    [class]=\"panelSizeClass()\"\r\n    [style.top.px]=\"resolvedAppendToBody() ? panelPlacement()?.top : null\"\r\n    [style.left.px]=\"resolvedAppendToBody() ? panelPlacement()?.left : null\"\r\n    [style.width]=\"resolvedAppendToBody() ? resolvedPanelWidth() : null\"\r\n    [style.min-width]=\"resolvedAppendToBody() ? resolvedPanelMinWidth() : null\"\r\n    [style.max-height]=\"resolvedAppendToBody() ? resolvedPanelMaxHeight() : null\"\r\n    [style.z-index]=\"dropdownZIndex() ?? panelZIndex()\"\r\n    role=\"listbox\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <!--\r\n      Not a tab stop of its own: the listbox pattern's only stop is the trigger, with\r\n      focus moved between options via the arrow keys (roving-focus.ts), which already\r\n      scrolls the focused option into view natively \u2014 no separate keyboard-scroll target\r\n      needed here.\r\n    -->\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'top') {\r\n      <div class=\"gog-select__filter gog-select__filter--top\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-select__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    <gog-scroll\r\n      size=\"thin\"\r\n      [focusable]=\"false\"\r\n      overscrollBehavior=\"contain\"\r\n      class=\"gog-select__scroll\"\r\n    >\r\n      @if (visibleOptions().length === 0) {\r\n        <p class=\"gog-select__empty\">{{ filterEmptyMessage() }}</p>\r\n      }\r\n      @for (option of visibleOptions(); track valueOf(option)) {\r\n        <!--\r\n          tabindex=\"-1\" keeps the list to a single tab stop, as the listbox pattern expects:\r\n          focus is moved between options with the arrow keys, not by tabbing through every\r\n          one of them. Programmatic .focus() still works on a negative tabindex.\r\n        -->\r\n        <button\r\n          type=\"button\"\r\n          class=\"gog-select__option\"\r\n          role=\"option\"\r\n          tabindex=\"-1\"\r\n          [attr.aria-selected]=\"isSelected(option)\"\r\n          [attr.aria-disabled]=\"isOptionDisabled(option)\"\r\n          [class.gog-select__option--selected]=\"isSelected(option)\"\r\n          [class.gog-select__option--disabled]=\"isOptionDisabled(option)\"\r\n          (click)=\"selectOption(option, $event)\"\r\n          (keydown)=\"onOptionKeydown($event)\"\r\n          gogRipple\r\n          [rippleDisabled]=\"!rippleEnabled()\"\r\n        >\r\n          @if (optionSlot(); as slot) {\r\n            <ng-container\r\n              *ngTemplateOutlet=\"\r\n                slot.templateRef;\r\n                context: optionContext(option, isSelected(option))\r\n              \"\r\n            />\r\n          } @else {\r\n            <span class=\"gog-select__option-mark\" aria-hidden=\"true\">\r\n              @if (isSelected(option)) {\r\n                <gog-icon name=\"check\" />\r\n              }\r\n            </span>\r\n            <span class=\"gog-select__option-label\">{{ labelOf(option) }}</span>\r\n          }\r\n        </button>\r\n      }\r\n    </gog-scroll>\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'bottom') {\r\n      <div class=\"gog-select__filter gog-select__filter--bottom\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-select__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";:host{display:block}:host(.gog-host--auto-width){width:fit-content}.gog-select{display:flex;flex-direction:column;gap:var(--gog-select-gap);width:100%}.gog-select--xsm,.gog-select__dropdown--xsm{--gog-select-size-padding-y: var(--gog-field-xsm-padding-y);--gog-select-size-padding-x: var(--gog-field-xsm-padding-x);--gog-select-size-font-size: var(--gog-field-xsm-font-size)}.gog-select--sm,.gog-select__dropdown--sm{--gog-select-size-padding-y: var(--gog-field-sm-padding-y);--gog-select-size-padding-x: var(--gog-field-sm-padding-x);--gog-select-size-font-size: var(--gog-field-sm-font-size)}.gog-select--lg,.gog-select__dropdown--lg{--gog-select-size-padding-y: var(--gog-field-lg-padding-y);--gog-select-size-padding-x: var(--gog-field-lg-padding-x);--gog-select-size-font-size: var(--gog-field-lg-font-size)}.gog-select--slg,.gog-select__dropdown--slg{--gog-select-size-padding-y: var(--gog-field-slg-padding-y);--gog-select-size-padding-x: var(--gog-field-slg-padding-x);--gog-select-size-font-size: var(--gog-field-slg-font-size)}.gog-select--disabled{opacity:var(--gog-select-disabled-opacity)}.gog-select--disabled .gog-select__label,.gog-select--disabled .gog-select__field{cursor:not-allowed}.gog-select__label{font-family:var(--gog-select-label-font-family);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing);cursor:pointer}.gog-select__field{position:relative;cursor:pointer}.gog-select__control{width:100%;padding-block:var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y)));padding-inline:var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))) var(--gog-select-chevron-inset);display:flex;align-items:center;justify-content:space-between;gap:var(--gog-select-control-gap);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-field-color);background-color:var(--gog-select-field-bg);border:var(--gog-select-field-border-width) var(--gog-select-field-border-style) var(--gog-select-field-border);border-radius:var(--gog-select-radius);outline:none;cursor:pointer;transition:border-color var(--gog-select-transition-duration) var(--gog-easing),box-shadow var(--gog-select-transition-duration) var(--gog-easing)}.gog-select__control:focus{border-color:var(--gog-select-focus-border);box-shadow:var(--gog-select-focus-glow)}.gog-select__control:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:var(--gog-select-focus-ring-offset)}.gog-select__control:disabled{cursor:not-allowed}.gog-select--open .gog-select__control{border-color:var(--gog-select-focus-border)}.gog-select__value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start}.gog-select__value--placeholder{color:var(--gog-select-placeholder-color)}.gog-select__chevron{width:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));display:flex;align-items:center;justify-content:center;color:var(--gog-select-chevron-color);pointer-events:none;flex-shrink:0}.gog-select__chevron gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-chevron-icon-ratio))}.gog-select__dropdown{position:absolute;top:calc(100% + var(--gog-select-panel-offset));inset-inline-start:0;inset-inline-end:auto;min-width:100%;width:max-content;max-width:var(--gog-select-panel-max-width);z-index:var(--gog-dropdown-z);display:flex;flex-direction:column;background-color:var(--gog-select-panel-bg);border:var(--gog-select-field-border-width) var(--gog-select-field-border-style) var(--gog-select-field-border);border-radius:var(--gog-select-radius);max-height:var(--gog-select-panel-max-height);overflow:hidden;box-shadow:var(--gog-select-panel-shadow)}.gog-select__scroll{flex:1;min-height:0}.gog-select__dropdown--up{top:auto;bottom:calc(100% + var(--gog-select-panel-offset))}.gog-select__dropdown--portal{position:fixed;top:unset;bottom:unset;inset-inline:unset}.gog-select__option{width:100%;display:flex;align-items:center;gap:var(--gog-select-option-gap);padding:var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x)));border:0;background:transparent;text-align:start;font:inherit;font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-option-color);cursor:pointer;transition:background-color var(--gog-select-option-transition-duration) var(--gog-easing)}.gog-select__option:hover{background-color:var(--gog-select-option-hover-bg)}.gog-select__option--selected{color:var(--gog-select-option-selected-color)}.gog-select__option--disabled{opacity:var(--gog-select-option-disabled-opacity);cursor:not-allowed}.gog-select__option:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:calc(var(--gog-select-focus-ring-width) * -1)}.gog-select__option-mark{display:inline-flex;align-items:center;justify-content:center;width:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-size-ratio));height:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-size-ratio));flex-shrink:0}.gog-select__option-mark gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-icon-ratio))}.gog-select__error{font-family:var(--gog-select-font-family);font-size:var(--gog-select-error-font-size);color:var(--gog-select-error-color)}.gog-select__label--float{position:absolute;inset-inline-start:var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x)));top:50%;transform:translateY(-50%);max-width:calc(100% - 2 * var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;cursor:default;color:var(--gog-select-placeholder-color);font-size:var(--gog-select-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-select-transition-duration) var(--gog-easing),font-size var(--gog-select-transition-duration) var(--gog-easing),color var(--gog-select-transition-duration) var(--gog-easing),top var(--gog-select-transition-duration) var(--gog-easing),background-color var(--gog-select-transition-duration) var(--gog-easing)}.gog-select--float-in,.gog-select--float-on{--gog-select-float-top-padding: calc(var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-select-float-label-reserve))}.gog-select--float-in .gog-select__control,.gog-select--float-on .gog-select__control{padding-top:var(--gog-select-float-top-padding)}.gog-select--float-in .gog-select__label--float,.gog-select--float-on .gog-select__label--float{top:var(--gog-select-float-top-padding);transform:none}.gog-select--float-in.gog-select--floated .gog-select__label--float{top:var(--gog-select-float-label-in-top);transform:translateY(0);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing)}.gog-select--float-on.gog-select--floated .gog-select__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing);background-color:var(--gog-select-float-label-on-bg, var(--gog-select-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-select--float-over.gog-select--floated .gog-select__label--float{top:calc(-1 * var(--gog-select-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing)}.gog-select--float-over .gog-select__field{margin-top:var(--gog-select-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-select__control,.gog-select__option,.gog-select__label--float{transition:none}}.gog-select__clear{position:absolute;top:50%;inset-inline-end:var(--gog-select-chevron-inset);transform:translateY(-50%);width:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-select-clear-radius);background:transparent;color:var(--gog-select-clear-color);line-height:1;cursor:pointer;transition:color var(--gog-select-transition-duration) var(--gog-easing)}.gog-select__clear:hover{color:var(--gog-select-clear-hover-color)}.gog-select__clear:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:var(--gog-select-focus-ring-offset)}.gog-select__clear gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-clear-icon-ratio))}.gog-select--clearable .gog-select__control{padding-inline-end:calc(var(--gog-select-chevron-inset) + var(--gog-select-clear-gap) + var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))))}.gog-select__filter{position:sticky;top:0;z-index:1;padding:var(--gog-select-filter-padding);background:var(--gog-select-panel-bg)}.gog-select__filter-input{width:100%;padding:var(--gog-select-filter-input-padding-y) var(--gog-select-filter-input-padding-x);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-filter-input-color);background:var(--gog-select-filter-input-bg);border:var(--gog-control-border-width) var(--gog-control-border-style) var(--gog-select-filter-input-border);border-radius:var(--gog-select-filter-input-radius);outline:none}.gog-select__filter-input:focus{border-color:var(--gog-select-focus-border)}.gog-select__empty{margin:0;padding:var(--gog-select-filter-empty-padding);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-filter-empty-color);text-align:center}.gog-select__filter--top{border-bottom:var(--gog-select-filter-border-width) var(--gog-select-filter-border-style) var(--gog-select-filter-border-color)}.gog-select__filter--bottom{top:auto;bottom:0;border-top:var(--gog-select-filter-border-width) var(--gog-select-filter-border-style) var(--gog-select-filter-border-color)}:host(.gog-host--auto-width),:host(.gog-host--auto-width) .gog-select__control{min-width:var(--gog-select-min-width)}.gog-select__dropdown--portal{max-width:var(--gog-select-panel-max-width)}\n"] }]
+                    }, template: "<!--\r\n  Deliberately not `gog-contained-layout`: `contain: layout` makes this element a stacking\r\n  context, which traps the panel's z-index inside it and lets whatever follows on the page\r\n  paint over the open dropdown.\r\n-->\r\n<div\r\n  class=\"gog-select\"\r\n  [class.gog-select--clearable]=\"showClear()\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-select--disabled]=\"isDisabled()\"\r\n  [class.gog-select--open]=\"isOpen()\"\r\n  [class.gog-select--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-select--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-select--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-select--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  <!--\r\n    Associated with aria-labelledby rather than `for`: the trigger is a <button>, which is\r\n    not a labelable element, so `for` pointing at it is silently ignored by browsers and\r\n    assistive tech alike.\r\n  -->\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n    <label class=\"gog-select__label\" [id]=\"labelId()\">{{ label() }}</label>\r\n  }\r\n\r\n  <div class=\"gog-select__field\">\r\n    @if (label() && isFloatLabelActive()) {\r\n      <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n      <label class=\"gog-select__label gog-select__label--float\" [id]=\"labelId()\">{{\r\n        label()\r\n      }}</label>\r\n    }\r\n    <button\r\n      type=\"button\"\r\n      class=\"gog-select__control\"\r\n      [id]=\"triggerId()\"\r\n      [disabled]=\"isDisabled()\"\r\n      [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n      [attr.aria-label]=\"label() ? null : ariaLabel() || placeholder() || 'Select'\"\r\n      [attr.aria-controls]=\"listboxId()\"\r\n      [attr.aria-expanded]=\"isOpen()\"\r\n      [attr.aria-haspopup]=\"'listbox'\"\r\n      [attr.aria-invalid]=\"hasError()\"\r\n      [attr.aria-describedby]=\"errorId()\"\r\n      (click)=\"toggle()\"\r\n      (focus)=\"onFocusIn()\"\r\n      (blur)=\"onFocusOut()\"\r\n      (keydown.enter)=\"toggle(); $event.preventDefault()\"\r\n      (keydown.space)=\"toggle(); $event.preventDefault()\"\r\n      (keydown.escape)=\"close()\"\r\n      (keydown.arrowdown)=\"onTriggerArrowKeydown($event)\"\r\n      (keydown.arrowup)=\"onTriggerArrowKeydown($event)\"\r\n    >\r\n      <span class=\"gog-select__value\" [class.gog-select__value--placeholder]=\"!selectedOption()\">\r\n        {{ selectedLabel() || effectivePlaceholder() }}\r\n      </span>\r\n\r\n      <span\r\n        class=\"gog-select__chevron\"\r\n        [class.gog-select__chevron--auto-rotate]=\"!chevronSlot()\"\r\n        aria-hidden=\"true\"\r\n      >\r\n        <gog-icon [template]=\"chevronSlot()?.templateRef ?? null\" name=\"chevron-down\" />\r\n      </span>\r\n    </button>\r\n\r\n    <!--\r\n      A sibling of the trigger, not a child: `.gog-select__control` is a <button>, and nesting\r\n      one button inside another is invalid HTML. It is positioned over the trigger's right edge\r\n      by the stylesheet, which also reserves room for it so it never covers the value text.\r\n    -->\r\n    @if (showClear()) {\r\n      <button\r\n        type=\"button\"\r\n        class=\"gog-select__clear gog-inline-center\"\r\n        [attr.aria-label]=\"resolvedClearLabel()\"\r\n        (click)=\"clearValue($event)\"\r\n      >\r\n        <gog-icon name=\"close\" />\r\n      </button>\r\n    }\r\n\r\n    @if (isOpen() && !resolvedAppendToBody()) {\r\n      <ng-container [ngTemplateOutlet]=\"panelTpl\" />\r\n    }\r\n  </div>\r\n\r\n  @if (hasError()) {\r\n    <span class=\"gog-select__error\" [attr.id]=\"errorId()\" role=\"alert\">\r\n      {{ visibleError() }}\r\n    </span>\r\n  }\r\n</div>\r\n\r\n<!--\r\n  One template for both render modes. When `appendToBody` is set it is stamped into\r\n  <body> by the overlay, which is why the portal-only modifier and the resolved\r\n  coordinates are applied conditionally: outside the component's subtree the panel can\r\n  no longer inherit the size tokens from the `.gog-select--sm/--lg` wrapper.\r\n-->\r\n<ng-template #panelTpl>\r\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- (click) below is housekeeping stopPropagation, not an interactive handler; the focusable/keyboard-operable elements are the options inside -->\r\n  <div\r\n    [id]=\"listboxId()\"\r\n    class=\"gog-select__dropdown\"\r\n    [class.gog-select__dropdown--up]=\"!resolvedAppendToBody() && dropdownDirectionState() === 'up'\"\r\n    [class.gog-select__dropdown--portal]=\"resolvedAppendToBody()\"\r\n    [class]=\"panelSizeClass()\"\r\n    [style.top.px]=\"resolvedAppendToBody() ? panelPlacement()?.top : null\"\r\n    [style.left.px]=\"resolvedAppendToBody() ? panelPlacement()?.left : null\"\r\n    [style.width]=\"resolvedAppendToBody() ? resolvedPanelWidth() : null\"\r\n    [style.min-width]=\"resolvedAppendToBody() ? resolvedPanelMinWidth() : null\"\r\n    [style.max-height]=\"resolvedAppendToBody() ? resolvedPanelMaxHeight() : null\"\r\n    [style.z-index]=\"dropdownZIndex() ?? panelZIndex()\"\r\n    role=\"listbox\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    <!--\r\n      Not a tab stop of its own: the listbox pattern's only stop is the trigger, with\r\n      focus moved between options via the arrow keys (roving-focus.ts), which already\r\n      scrolls the focused option into view natively \u2014 no separate keyboard-scroll target\r\n      needed here.\r\n    -->\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'top') {\r\n      <div class=\"gog-select__filter gog-select__filter--top\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-select__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    <gog-scroll\r\n      size=\"thin\"\r\n      [focusable]=\"false\"\r\n      overscrollBehavior=\"contain\"\r\n      class=\"gog-select__scroll\"\r\n    >\r\n      @if (visibleOptions().length === 0) {\r\n        <p class=\"gog-select__empty\">{{ filterEmptyMessage() }}</p>\r\n      }\r\n      @for (option of visibleOptions(); track valueOf(option)) {\r\n        <!--\r\n          tabindex=\"-1\" keeps the list to a single tab stop, as the listbox pattern expects:\r\n          focus is moved between options with the arrow keys, not by tabbing through every\r\n          one of them. Programmatic .focus() still works on a negative tabindex.\r\n        -->\r\n        <button\r\n          type=\"button\"\r\n          class=\"gog-select__option\"\r\n          role=\"option\"\r\n          tabindex=\"-1\"\r\n          [attr.aria-selected]=\"isSelected(option)\"\r\n          [attr.aria-disabled]=\"isOptionDisabled(option)\"\r\n          [class.gog-select__option--selected]=\"isSelected(option)\"\r\n          [class.gog-select__option--disabled]=\"isOptionDisabled(option)\"\r\n          (click)=\"selectOption(option, $event)\"\r\n          (keydown)=\"onOptionKeydown($event)\"\r\n          gogRipple\r\n          [rippleDisabled]=\"!rippleEnabled()\"\r\n        >\r\n          @if (optionSlot(); as slot) {\r\n            <ng-container\r\n              *ngTemplateOutlet=\"\r\n                slot.templateRef;\r\n                context: optionContext(option, isSelected(option))\r\n              \"\r\n            />\r\n          } @else {\r\n            <span class=\"gog-select__option-mark\" aria-hidden=\"true\">\r\n              @if (isSelected(option)) {\r\n                <gog-icon name=\"check\" />\r\n              }\r\n            </span>\r\n            <span class=\"gog-select__option-label\">{{ labelOf(option) }}</span>\r\n          }\r\n        </button>\r\n      }\r\n    </gog-scroll>\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'bottom') {\r\n      <div class=\"gog-select__filter gog-select__filter--bottom\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-select__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";:host{display:block}:host(.gog-host--auto-width){width:fit-content}.gog-select{display:flex;flex-direction:column;gap:var(--gog-select-gap);width:100%}.gog-select--xsm,.gog-select__dropdown--xsm{--gog-select-size-padding-y: var(--gog-field-xsm-padding-y);--gog-select-size-padding-x: var(--gog-field-xsm-padding-x);--gog-select-size-font-size: var(--gog-field-xsm-font-size)}.gog-select--sm,.gog-select__dropdown--sm{--gog-select-size-padding-y: var(--gog-field-sm-padding-y);--gog-select-size-padding-x: var(--gog-field-sm-padding-x);--gog-select-size-font-size: var(--gog-field-sm-font-size)}.gog-select--lg,.gog-select__dropdown--lg{--gog-select-size-padding-y: var(--gog-field-lg-padding-y);--gog-select-size-padding-x: var(--gog-field-lg-padding-x);--gog-select-size-font-size: var(--gog-field-lg-font-size)}.gog-select--slg,.gog-select__dropdown--slg{--gog-select-size-padding-y: var(--gog-field-slg-padding-y);--gog-select-size-padding-x: var(--gog-field-slg-padding-x);--gog-select-size-font-size: var(--gog-field-slg-font-size)}.gog-select--disabled{opacity:var(--gog-select-disabled-opacity)}.gog-select--disabled .gog-select__label,.gog-select--disabled .gog-select__field{cursor:not-allowed}.gog-select__label{font-family:var(--gog-select-label-font-family);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing);cursor:pointer}.gog-select__field{position:relative;cursor:pointer}.gog-select__control{width:100%;padding-block:var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y)));padding-inline:var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))) var(--gog-select-chevron-inset);display:flex;align-items:center;justify-content:space-between;gap:var(--gog-select-control-gap);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-field-color);background-color:var(--gog-select-field-bg);border:var(--gog-select-field-border-width) var(--gog-select-field-border-style) var(--gog-select-field-border);border-radius:var(--gog-select-radius);outline:none;cursor:pointer;transition:border-color var(--gog-select-transition-duration) var(--gog-easing),box-shadow var(--gog-select-transition-duration) var(--gog-easing)}.gog-select__control:focus{border-color:var(--gog-select-focus-border);box-shadow:var(--gog-select-focus-glow)}.gog-select__control:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:var(--gog-select-focus-ring-offset)}.gog-select__control:disabled{cursor:not-allowed}.gog-select--open .gog-select__control{border-color:var(--gog-select-focus-border)}.gog-select__value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start}.gog-select__value--placeholder{color:var(--gog-select-placeholder-color)}.gog-select__chevron{width:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));display:flex;align-items:center;justify-content:center;color:var(--gog-select-chevron-color);pointer-events:none;flex-shrink:0}.gog-select__chevron--auto-rotate{transition:transform var(--gog-select-transition-duration) var(--gog-easing)}.gog-select--open .gog-select__chevron--auto-rotate{transform:rotate(180deg)}.gog-select__chevron gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-chevron-icon-ratio))}.gog-select__dropdown{position:absolute;top:calc(100% + var(--gog-select-panel-offset));inset-inline-start:0;inset-inline-end:auto;min-width:100%;width:max-content;max-width:var(--gog-select-panel-max-width);z-index:var(--gog-dropdown-z);display:flex;flex-direction:column;background-color:var(--gog-select-panel-bg);border:var(--gog-select-field-border-width) var(--gog-select-field-border-style) var(--gog-select-field-border);border-radius:var(--gog-select-radius);max-height:var(--gog-select-panel-max-height);overflow:hidden;box-shadow:var(--gog-select-panel-shadow)}.gog-select__scroll{flex:1;min-height:0}.gog-select__dropdown--up{top:auto;bottom:calc(100% + var(--gog-select-panel-offset))}.gog-select__dropdown--portal{position:fixed;top:unset;bottom:unset;inset-inline:unset}.gog-select__option{width:100%;display:flex;align-items:center;gap:var(--gog-select-option-gap);padding:var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x)));border:0;background:transparent;text-align:start;font:inherit;font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-option-color);cursor:pointer;transition:background-color var(--gog-select-option-transition-duration) var(--gog-easing)}.gog-select__option:hover{background-color:var(--gog-select-option-hover-bg)}.gog-select__option--selected{color:var(--gog-select-option-selected-color)}.gog-select__option--disabled{opacity:var(--gog-select-option-disabled-opacity);cursor:not-allowed}.gog-select__option:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:calc(var(--gog-select-focus-ring-width) * -1)}.gog-select__option-mark{display:inline-flex;align-items:center;justify-content:center;width:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-size-ratio));height:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-size-ratio));flex-shrink:0}.gog-select__option-mark gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-mark-icon-ratio))}.gog-select__error{font-family:var(--gog-select-font-family);font-size:var(--gog-select-error-font-size);color:var(--gog-select-error-color)}.gog-select__label--float{position:absolute;inset-inline-start:var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x)));top:50%;transform:translateY(-50%);max-width:calc(100% - 2 * var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;cursor:default;color:var(--gog-select-placeholder-color);font-size:var(--gog-select-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-select-transition-duration) var(--gog-easing),font-size var(--gog-select-transition-duration) var(--gog-easing),color var(--gog-select-transition-duration) var(--gog-easing),top var(--gog-select-transition-duration) var(--gog-easing),background-color var(--gog-select-transition-duration) var(--gog-easing)}.gog-select--float-in,.gog-select--float-on{--gog-select-float-top-padding: calc(var(--gog-select-control-padding-y, var(--gog-select-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-select-float-label-reserve))}.gog-select--float-in .gog-select__control,.gog-select--float-on .gog-select__control{padding-top:var(--gog-select-float-top-padding)}.gog-select--float-in .gog-select__label--float,.gog-select--float-on .gog-select__label--float{top:var(--gog-select-float-top-padding);transform:none}.gog-select--float-in.gog-select--floated .gog-select__label--float{top:var(--gog-select-float-label-in-top);transform:translateY(0);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing)}.gog-select--float-on.gog-select--floated .gog-select__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing);background-color:var(--gog-select-float-label-on-bg, var(--gog-select-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-select-control-padding-x, var(--gog-select-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-select--float-over.gog-select--floated .gog-select__label--float{top:calc(-1 * var(--gog-select-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-select-label-font-size);color:var(--gog-select-label-color);text-transform:var(--gog-select-label-text-transform);letter-spacing:var(--gog-select-label-letter-spacing)}.gog-select--float-over .gog-select__field{margin-top:var(--gog-select-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-select__control,.gog-select__option,.gog-select__chevron--auto-rotate,.gog-select__label--float{transition:none}}.gog-select__clear{position:absolute;top:50%;inset-inline-end:var(--gog-select-chevron-inset);transform:translateY(-50%);width:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-select-clear-radius);background:transparent;color:var(--gog-select-clear-color);line-height:1;cursor:pointer;transition:color var(--gog-select-transition-duration) var(--gog-easing)}.gog-select__clear:hover{color:var(--gog-select-clear-hover-color)}.gog-select__clear:focus-visible{outline:var(--gog-select-focus-ring-width) solid var(--gog-select-focus-border);outline-offset:var(--gog-select-focus-ring-offset)}.gog-select__clear gog-icon{font-size:calc(var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))) * var(--gog-select-clear-icon-ratio))}.gog-select--clearable .gog-select__control{padding-inline-end:calc(var(--gog-select-chevron-inset) + var(--gog-select-clear-gap) + var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size))))}.gog-select__filter{position:sticky;top:0;z-index:1;padding:var(--gog-select-filter-padding);background:var(--gog-select-panel-bg)}.gog-select__filter-input{width:100%;padding:var(--gog-select-filter-input-padding-y) var(--gog-select-filter-input-padding-x);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-filter-input-color);background:var(--gog-select-filter-input-bg);border:var(--gog-control-border-width) var(--gog-control-border-style) var(--gog-select-filter-input-border);border-radius:var(--gog-select-filter-input-radius);outline:none}.gog-select__filter-input:focus{border-color:var(--gog-select-focus-border)}.gog-select__empty{margin:0;padding:var(--gog-select-filter-empty-padding);font-family:var(--gog-select-font-family);font-size:var(--gog-select-control-font, var(--gog-select-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-select-filter-empty-color);text-align:center}.gog-select__filter--top{border-bottom:var(--gog-select-filter-border-width) var(--gog-select-filter-border-style) var(--gog-select-filter-border-color)}.gog-select__filter--bottom{top:auto;bottom:0;border-top:var(--gog-select-filter-border-width) var(--gog-select-filter-border-style) var(--gog-select-filter-border-color)}:host(.gog-host--auto-width),:host(.gog-host--auto-width) .gog-select__control{min-width:var(--gog-select-min-width)}.gog-select__dropdown--portal{max-width:var(--gog-select-panel-max-width)}\n"] }]
         }], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], panelTemplate: [{ type: i0.ViewChild, args: ['panelTpl', { isSignal: true }] }] } });
 
 const DEFAULT_GAP$2 = 4;
@@ -7896,7 +7896,7 @@ class MultiselectComponent extends GogDropdownBase {
         return this.showControls() ? CONTROLS_ROW_HEIGHT : 0;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: MultiselectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: MultiselectComponent, isStandalone: true, selector: "gog-multiselect", inputs: { showControls: { classPropertyName: "showControls", publicName: "showControls", isSignal: true, isRequired: false, transformFunction: null }, controlsPosition: { classPropertyName: "controlsPosition", publicName: "controlsPosition", isSignal: true, isRequired: false, transformFunction: null }, selectAllLabel: { classPropertyName: "selectAllLabel", publicName: "selectAllLabel", isSignal: true, isRequired: false, transformFunction: null }, clearAllLabel: { classPropertyName: "clearAllLabel", publicName: "clearAllLabel", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "style.--gog-multiselect-min-width": "minWidth()" } }, queries: [{ propertyName: "clearIconSlot", first: true, predicate: GogMultiselectClearIconDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "panelTemplate", first: true, predicate: ["panelTpl"], descendants: true, isSignal: true }, { propertyName: "valueRef", first: true, predicate: ["valueEl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!--\r\n  Deliberately not `gog-contained-layout`: `contain: layout` makes this element a stacking\r\n  context, which traps the panel's z-index inside it and lets whatever follows on the page\r\n  paint over the open dropdown.\r\n-->\r\n<div\r\n  class=\"gog-ms-wrapper\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-ms-wrapper--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-ms-wrapper--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-ms-wrapper--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-ms-wrapper--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  <!--\r\n    Associated with aria-labelledby rather than `for`: the trigger is a div with\r\n    role=\"combobox\", not a labelable element. Without this the trigger had no accessible\r\n    name at all whenever `label` was set, because that also suppresses the aria-label.\r\n  -->\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n    <label class=\"gog-ms__label\" [id]=\"labelId()\">{{ label() }}</label>\r\n  }\r\n\r\n  <div\r\n    [gogTooltip]=\"summary().hidden > 0 ? selectedListTpl : null\"\r\n    class=\"gog-ms\"\r\n    role=\"combobox\"\r\n    [attr.tabindex]=\"isDisabled() ? -1 : 0\"\r\n    [attr.aria-expanded]=\"isOpen()\"\r\n    aria-haspopup=\"listbox\"\r\n    [attr.aria-controls]=\"listboxId()\"\r\n    [attr.aria-disabled]=\"isDisabled()\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    [attr.aria-label]=\"label() ? null : ariaLabel() || placeholder() || 'Select'\"\r\n    [class.gog-ms--open]=\"isOpen()\"\r\n    [class.gog-ms--disabled]=\"isDisabled()\"\r\n    [class.gog-ms--error]=\"hasError()\"\r\n    (click)=\"toggle()\"\r\n    (focus)=\"onFocusIn()\"\r\n    (blur)=\"onFocusOut()\"\r\n    (keydown.enter)=\"toggle(); $event.preventDefault()\"\r\n    (keydown.space)=\"toggle(); $event.preventDefault()\"\r\n    (keydown.escape)=\"close()\"\r\n    (keydown.arrowdown)=\"onTriggerArrowKeydown($event)\"\r\n    (keydown.arrowup)=\"onTriggerArrowKeydown($event)\"\r\n  >\r\n    @if (label() && isFloatLabelActive()) {\r\n      <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n      <label class=\"gog-ms__label gog-ms__label--float\" [id]=\"labelId()\">{{ label() }}</label>\r\n    }\r\n    <span #valueEl class=\"gog-ms__value\" [class.gog-ms__value--placeholder]=\"!selectedNames()\">\r\n      {{ summary().text || effectivePlaceholder() }}\r\n    </span>\r\n    <!--\r\n      Only what fits is shown; the rest is collapsed into a count. The tooltip is the way to read\r\n      the whole selection back, so it is bound only while something is actually hidden.\r\n    -->\r\n    @if (summary().hidden > 0) {\r\n      <span class=\"gog-ms__overflow\" aria-hidden=\"true\">+{{ summary().hidden }}</span>\r\n    }\r\n\r\n    <span class=\"gog-ms__actions\">\r\n      <span class=\"gog-ms__arrow\" [class.gog-ms__arrow--up]=\"isOpen()\" aria-hidden=\"true\">\r\n        <gog-icon\r\n          [template]=\"chevronSlot()?.templateRef ?? null\"\r\n          [name]=\"isOpen() ? 'chevron-up' : 'chevron-down'\"\r\n        />\r\n      </span>\r\n      @if (showClear()) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"gog-ms__clear gog-inline-center\"\r\n          (click)=\"clearValue($event)\"\r\n          [attr.aria-label]=\"resolvedClearLabel()\"\r\n        >\r\n          <gog-icon [template]=\"clearIconSlot()?.templateRef ?? null\" name=\"close\" />\r\n        </button>\r\n      }\r\n    </span>\r\n  </div>\r\n\r\n  @if (isOpen() && !resolvedAppendToBody()) {\r\n    <ng-container [ngTemplateOutlet]=\"panelTpl\" />\r\n  }\r\n\r\n  @if (visibleError()) {\r\n    <span class=\"gog-ms__error\" role=\"alert\">{{ visibleError() }}</span>\r\n  }\r\n</div>\r\n\r\n<!--\r\n  One template for both render modes. When `appendToBody` is set it is stamped into\r\n  <body> by the overlay, which is why the portal-only modifier and the resolved\r\n  coordinates are applied conditionally: outside the component's subtree the panel can\r\n  no longer inherit the size tokens from the `.gog-ms-wrapper--sm/--lg` wrapper.\r\n-->\r\n<ng-template #panelTpl>\r\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- (click) below is housekeeping stopPropagation, not an interactive handler; the focusable/keyboard-operable elements are the options inside -->\r\n  <div\r\n    [id]=\"listboxId()\"\r\n    class=\"gog-ms__dropdown\"\r\n    [class.gog-ms__dropdown--up]=\"!resolvedAppendToBody() && dropdownDirectionState() === 'up'\"\r\n    [class.gog-ms__dropdown--portal]=\"resolvedAppendToBody()\"\r\n    [class]=\"panelSizeClass()\"\r\n    [style.top.px]=\"resolvedAppendToBody() ? panelPlacement()?.top : null\"\r\n    [style.left.px]=\"resolvedAppendToBody() ? panelPlacement()?.left : null\"\r\n    [style.width]=\"resolvedAppendToBody() ? resolvedPanelWidth() : null\"\r\n    [style.min-width]=\"resolvedAppendToBody() ? resolvedPanelMinWidth() : null\"\r\n    [style.max-height]=\"resolvedAppendToBody() ? resolvedPanelMaxHeight() : null\"\r\n    [style.z-index]=\"dropdownZIndex() ?? panelZIndex()\"\r\n    role=\"listbox\"\r\n    aria-multiselectable=\"true\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    @if (showControls() && controlsPosition() === 'top') {\r\n      <ng-container [ngTemplateOutlet]=\"controlsRowTpl\" />\r\n    }\r\n    <!--\r\n      Not a tab stop of its own: the listbox pattern's only stop is the trigger, with\r\n      focus moved between options via the arrow keys (roving-focus.ts), which already\r\n      scrolls the focused option into view natively \u2014 no separate keyboard-scroll target\r\n      needed here.\r\n    -->\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'top') {\r\n      <div class=\"gog-ms__filter gog-ms__filter--top\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-ms__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    <gog-scroll size=\"thin\" [focusable]=\"false\" overscrollBehavior=\"contain\" class=\"gog-ms__scroll\">\r\n      <div class=\"gog-ms__options\">\r\n        @if (visibleOptions().length === 0) {\r\n          <p class=\"gog-ms__empty\">{{ filterEmptyMessage() }}</p>\r\n        }\r\n        @for (option of visibleOptions(); track valueOf(option)) {\r\n          <!--\r\n            tabindex=\"-1\" keeps the list to a single tab stop, as the listbox pattern\r\n            expects: focus moves between options with the arrow keys, not by tabbing\r\n            through every one. Programmatic .focus() still works on a negative tabindex.\r\n          -->\r\n          <button\r\n            type=\"button\"\r\n            class=\"gog-ms__option\"\r\n            role=\"option\"\r\n            tabindex=\"-1\"\r\n            [attr.aria-selected]=\"isSelected(option)\"\r\n            [attr.aria-disabled]=\"isOptionDisabled(option)\"\r\n            [class.gog-ms__option--selected]=\"isSelected(option)\"\r\n            [class.gog-ms__option--disabled]=\"isOptionDisabled(option)\"\r\n            (click)=\"toggleOption(option, $event)\"\r\n            (keydown)=\"onOptionKeydown($event)\"\r\n            gogRipple\r\n            [rippleDisabled]=\"!rippleEnabled()\"\r\n          >\r\n            @if (optionSlot(); as slot) {\r\n              <ng-container\r\n                *ngTemplateOutlet=\"\r\n                  slot.templateRef;\r\n                  context: optionContext(option, isSelected(option))\r\n                \"\r\n              />\r\n            } @else {\r\n              <span class=\"gog-ms__option-mark\" aria-hidden=\"true\">\r\n                <gog-icon [name]=\"isSelected(option) ? 'checkbox-checked' : 'checkbox'\" />\r\n              </span>\r\n              {{ labelOf(option) }}\r\n            }\r\n          </button>\r\n        }\r\n      </div>\r\n    </gog-scroll>\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'bottom') {\r\n      <div class=\"gog-ms__filter gog-ms__filter--bottom\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-ms__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    @if (showControls() && controlsPosition() === 'bottom') {\r\n      <ng-container [ngTemplateOutlet]=\"controlsRowTpl\" />\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #controlsRowTpl>\r\n  <div class=\"gog-ms__controls\" [class.gog-ms__controls--bottom]=\"controlsPosition() === 'bottom'\">\r\n    <gog-button variant=\"ghost\" size=\"sm\" (click)=\"selectAll($event)\">{{\r\n      resolvedSelectAllLabel()\r\n    }}</gog-button>\r\n    <gog-button variant=\"ghost\" size=\"sm\" (click)=\"clearAll($event)\">{{\r\n      resolvedClearAllLabel()\r\n    }}</gog-button>\r\n  </div>\r\n</ng-template>\r\n\r\n<!-- Full selection, shown as a tooltip when the trigger can only fit part of it. -->\r\n<ng-template #selectedListTpl>\r\n  <ul class=\"gog-ms__tooltip-list\">\r\n    @for (label of selectedLabels(); track label) {\r\n      <li>{{ label }}</li>\r\n    }\r\n  </ul>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";.gog-ms-wrapper{display:flex;flex-direction:column;gap:var(--gog-multiselect-gap);position:relative;width:100%}:host(.gog-host--auto-width){width:fit-content}:host(.gog-host--auto-width) .gog-ms-wrapper{width:fit-content}.gog-ms-wrapper--xsm,.gog-ms__dropdown--xsm{--gog-multiselect-size-padding-y: var(--gog-field-xsm-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-xsm-padding-x);--gog-multiselect-size-font-size: var(--gog-field-xsm-font-size)}.gog-ms-wrapper--sm,.gog-ms__dropdown--sm{--gog-multiselect-size-padding-y: var(--gog-field-sm-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-sm-padding-x);--gog-multiselect-size-font-size: var(--gog-field-sm-font-size)}.gog-ms-wrapper--lg,.gog-ms__dropdown--lg{--gog-multiselect-size-padding-y: var(--gog-field-lg-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-lg-padding-x);--gog-multiselect-size-font-size: var(--gog-field-lg-font-size)}.gog-ms-wrapper--slg,.gog-ms__dropdown--slg{--gog-multiselect-size-padding-y: var(--gog-field-slg-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-slg-padding-x);--gog-multiselect-size-font-size: var(--gog-field-slg-font-size)}.gog-ms__label{font-family:var(--gog-multiselect-label-font-family);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing);cursor:pointer}.gog-ms{position:relative;display:flex;align-items:center;justify-content:space-between;padding:var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));background-color:var(--gog-multiselect-field-bg);border:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border);border-radius:var(--gog-multiselect-radius);color:var(--gog-multiselect-field-color);cursor:pointer;-webkit-user-select:none;user-select:none;transition:border-color var(--gog-multiselect-transition-duration) var(--gog-easing),box-shadow var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms:hover:not(.gog-ms--disabled){border-color:var(--gog-multiselect-focus-border)}.gog-ms:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:var(--gog-multiselect-focus-ring-offset)}.gog-ms--open{border-color:var(--gog-multiselect-border-color);box-shadow:var(--gog-multiselect-focus-glow)}.gog-ms--disabled{opacity:var(--gog-multiselect-disabled-opacity);cursor:not-allowed}.gog-ms--disabled .gog-ms__label{cursor:not-allowed}.gog-ms--error{border-color:var(--gog-multiselect-error-color)}.gog-ms__value{font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--gog-multiselect-value-color)}.gog-ms__value--placeholder{color:var(--gog-multiselect-placeholder-color)}.gog-ms{padding-inline-end:var(--gog-multiselect-actions-inset)}.gog-ms__actions{display:flex;align-items:center;gap:var(--gog-multiselect-actions-gap);flex-shrink:0}.gog-ms__clear{width:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-multiselect-clear-radius);background:transparent;color:var(--gog-multiselect-placeholder-color);line-height:1;cursor:pointer;transition:color var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms__clear gog-icon{font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-clear-icon-ratio))}.gog-ms__clear:hover{color:var(--gog-multiselect-field-color)}.gog-ms__clear:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:var(--gog-multiselect-focus-ring-offset)}.gog-ms__arrow{color:var(--gog-multiselect-border-color);transition:transform var(--gog-multiselect-arrow-transition-duration) var(--gog-easing);display:inline-flex;align-items:center;justify-content:center;width:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)))}.gog-ms__arrow gog-icon{font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-arrow-icon-ratio))}.gog-ms__arrow--up{transform:rotate(180deg)}.gog-ms__dropdown{position:absolute;top:calc(100% + var(--gog-multiselect-panel-offset));inset-inline-start:0;inset-inline-end:auto;min-width:100%;width:max-content;max-width:var(--gog-multiselect-panel-max-width);z-index:var(--gog-dropdown-z);display:flex;flex-direction:column;background-color:var(--gog-multiselect-panel-bg);border:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-panel-border);border-radius:var(--gog-multiselect-radius);max-height:var(--gog-multiselect-panel-max-height);overflow:hidden;box-shadow:var(--gog-multiselect-panel-shadow)}.gog-ms__scroll{flex:1;min-height:0}.gog-ms__dropdown--up{top:auto;bottom:calc(100% + var(--gog-multiselect-panel-offset))}.gog-ms__dropdown--portal{position:fixed;top:unset;bottom:unset;inset-inline:unset}.gog-ms__controls{flex-shrink:0;display:flex;gap:var(--gog-multiselect-controls-gap);padding:var(--gog-multiselect-controls-padding);background-color:var(--gog-multiselect-panel-bg);border-bottom:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border)}.gog-ms__controls--bottom{border-bottom:0;border-top:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border)}.gog-ms__options{display:flex;flex-direction:column;padding:var(--gog-multiselect-options-padding);gap:var(--gog-multiselect-option-gap)}.gog-ms__option{width:100%;display:flex;align-items:center;gap:var(--gog-multiselect-option-gap-inline);padding:var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));border:0;background:transparent;text-align:start;font:inherit;font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));cursor:pointer;border-radius:var(--gog-multiselect-option-radius);transition:background-color var(--gog-multiselect-option-transition-duration) var(--gog-easing);color:var(--gog-multiselect-option-color)}.gog-ms__option--disabled{opacity:var(--gog-multiselect-option-disabled-opacity);cursor:not-allowed}.gog-ms__option:hover{background-color:var(--gog-multiselect-option-hover-bg)}.gog-ms__option--selected{color:var(--gog-multiselect-border-color)}.gog-ms__option:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:calc(var(--gog-multiselect-focus-ring-width) * -1)}.gog-ms__option-mark{display:flex;align-items:center;justify-content:center;width:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-size-ratio));height:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-size-ratio));flex-shrink:0;font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-icon-ratio));color:var(--gog-multiselect-checkbox-border)}.gog-ms__option--selected .gog-ms__option-mark{color:var(--gog-multiselect-checkbox-checked-bg)}.gog-ms__error{font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-error-font-size);color:var(--gog-multiselect-error-color);margin-top:var(--gog-multiselect-error-offset)}.gog-ms__label--float{position:absolute;inset-inline-start:var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));top:50%;transform:translateY(-50%);max-width:calc(100% - 2 * var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;cursor:default;color:var(--gog-multiselect-placeholder-color);font-size:var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-multiselect-transition-duration) var(--gog-easing),font-size var(--gog-multiselect-transition-duration) var(--gog-easing),color var(--gog-multiselect-transition-duration) var(--gog-easing),top var(--gog-multiselect-transition-duration) var(--gog-easing),background-color var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms-wrapper--float-in,.gog-ms-wrapper--float-on{--gog-multiselect-float-top-padding: calc(var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-multiselect-float-label-reserve))}.gog-ms-wrapper--float-in .gog-ms,.gog-ms-wrapper--float-on .gog-ms{padding-top:var(--gog-multiselect-float-top-padding)}.gog-ms-wrapper--float-in .gog-ms__label--float,.gog-ms-wrapper--float-on .gog-ms__label--float{top:var(--gog-multiselect-float-top-padding);transform:none}.gog-ms-wrapper--float-in.gog-ms-wrapper--floated .gog-ms__label--float{top:var(--gog-multiselect-float-label-in-top);transform:translateY(0);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing)}.gog-ms-wrapper--float-on.gog-ms-wrapper--floated .gog-ms__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing);background-color:var(--gog-multiselect-float-label-on-bg, var(--gog-multiselect-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-ms-wrapper--float-over.gog-ms-wrapper--floated .gog-ms__label--float{top:calc(-1 * var(--gog-multiselect-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing)}.gog-ms-wrapper--float-over .gog-ms{margin-top:var(--gog-multiselect-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-ms,.gog-ms__clear,.gog-ms__arrow,.gog-ms__option,.gog-ms__option-mark,.gog-ms__label--float{transition:none}}.gog-ms__filter{position:sticky;top:0;z-index:1;padding:var(--gog-multiselect-filter-padding);background:var(--gog-multiselect-panel-bg)}.gog-ms__filter-input{width:100%;padding:var(--gog-multiselect-filter-input-padding-y) var(--gog-multiselect-filter-input-padding-x);font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-multiselect-filter-input-color);background:var(--gog-multiselect-filter-input-bg);border:var(--gog-control-border-width) var(--gog-control-border-style) var(--gog-multiselect-filter-input-border);border-radius:var(--gog-multiselect-filter-input-radius);outline:none}.gog-ms__filter-input:focus{border-color:var(--gog-multiselect-focus-border)}.gog-ms__empty{margin:0;padding:var(--gog-multiselect-filter-empty-padding);font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-multiselect-filter-empty-color);text-align:center}.gog-ms__filter--top{border-bottom:var(--gog-multiselect-filter-border-width) var(--gog-multiselect-filter-border-style) var(--gog-multiselect-filter-border-color)}.gog-ms__filter--bottom{top:auto;bottom:0;border-top:var(--gog-multiselect-filter-border-width) var(--gog-multiselect-filter-border-style) var(--gog-multiselect-filter-border-color)}:host(.gog-host--auto-width),:host(.gog-host--auto-width) .gog-ms{min-width:var(--gog-multiselect-min-width)}.gog-ms__dropdown--portal{max-width:var(--gog-multiselect-panel-max-width)}.gog-ms__overflow{flex-shrink:0;margin-inline-start:var(--gog-multiselect-overflow-gap);font-size:var(--gog-multiselect-overflow-font-size);color:var(--gog-multiselect-overflow-color)}.gog-ms__tooltip-list{margin:0;padding-inline-start:1.1em;text-align:start}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "gog-button", inputs: ["variant", "size", "disabled", "fullWidth", "type", "loading", "ripple", "debounce", "ariaLabel"], outputs: ["gogClick"] }, { kind: "directive", type: GogRippleDirective, selector: "[gogRipple]", inputs: ["rippleDisabled", "rippleCentred"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ScrollComponent, selector: "gog-scroll", inputs: ["axis", "size", "autoHide", "hideDelay", "reachThreshold", "focusable", "ariaLabel", "overscrollBehavior", "showTrack"], outputs: ["gogScroll", "gogReachStart", "gogReachEnd"] }, { kind: "directive", type: GogTooltipDirective, selector: "[gogTooltip]", inputs: ["gogTooltip", "gogTooltipPosition", "gogTooltipShowDelay", "gogTooltipHideDelay", "gogTooltipDisabled", "gogTooltipClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: MultiselectComponent, isStandalone: true, selector: "gog-multiselect", inputs: { showControls: { classPropertyName: "showControls", publicName: "showControls", isSignal: true, isRequired: false, transformFunction: null }, controlsPosition: { classPropertyName: "controlsPosition", publicName: "controlsPosition", isSignal: true, isRequired: false, transformFunction: null }, selectAllLabel: { classPropertyName: "selectAllLabel", publicName: "selectAllLabel", isSignal: true, isRequired: false, transformFunction: null }, clearAllLabel: { classPropertyName: "clearAllLabel", publicName: "clearAllLabel", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { properties: { "style.--gog-multiselect-min-width": "minWidth()" } }, queries: [{ propertyName: "clearIconSlot", first: true, predicate: GogMultiselectClearIconDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "panelTemplate", first: true, predicate: ["panelTpl"], descendants: true, isSignal: true }, { propertyName: "valueRef", first: true, predicate: ["valueEl"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!--\r\n  Deliberately not `gog-contained-layout`: `contain: layout` makes this element a stacking\r\n  context, which traps the panel's z-index inside it and lets whatever follows on the page\r\n  paint over the open dropdown.\r\n-->\r\n<div\r\n  class=\"gog-ms-wrapper\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-ms-wrapper--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-ms-wrapper--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-ms-wrapper--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-ms-wrapper--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  <!--\r\n    Associated with aria-labelledby rather than `for`: the trigger is a div with\r\n    role=\"combobox\", not a labelable element. Without this the trigger had no accessible\r\n    name at all whenever `label` was set, because that also suppresses the aria-label.\r\n  -->\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n    <label class=\"gog-ms__label\" [id]=\"labelId()\">{{ label() }}</label>\r\n  }\r\n\r\n  <div\r\n    [gogTooltip]=\"summary().hidden > 0 ? selectedListTpl : null\"\r\n    class=\"gog-ms\"\r\n    role=\"combobox\"\r\n    [attr.tabindex]=\"isDisabled() ? -1 : 0\"\r\n    [attr.aria-expanded]=\"isOpen()\"\r\n    aria-haspopup=\"listbox\"\r\n    [attr.aria-controls]=\"listboxId()\"\r\n    [attr.aria-disabled]=\"isDisabled()\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    [attr.aria-label]=\"label() ? null : ariaLabel() || placeholder() || 'Select'\"\r\n    [class.gog-ms--open]=\"isOpen()\"\r\n    [class.gog-ms--disabled]=\"isDisabled()\"\r\n    [class.gog-ms--error]=\"hasError()\"\r\n    (click)=\"toggle()\"\r\n    (focus)=\"onFocusIn()\"\r\n    (blur)=\"onFocusOut()\"\r\n    (keydown.enter)=\"toggle(); $event.preventDefault()\"\r\n    (keydown.space)=\"toggle(); $event.preventDefault()\"\r\n    (keydown.escape)=\"close()\"\r\n    (keydown.arrowdown)=\"onTriggerArrowKeydown($event)\"\r\n    (keydown.arrowup)=\"onTriggerArrowKeydown($event)\"\r\n  >\r\n    @if (label() && isFloatLabelActive()) {\r\n      <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n      <label class=\"gog-ms__label gog-ms__label--float\" [id]=\"labelId()\">{{ label() }}</label>\r\n    }\r\n    <span #valueEl class=\"gog-ms__value\" [class.gog-ms__value--placeholder]=\"!selectedNames()\">\r\n      {{ summary().text || effectivePlaceholder() }}\r\n    </span>\r\n    <!--\r\n      Only what fits is shown; the rest is collapsed into a count. The tooltip is the way to read\r\n      the whole selection back, so it is bound only while something is actually hidden.\r\n    -->\r\n    @if (summary().hidden > 0) {\r\n      <span class=\"gog-ms__overflow\" aria-hidden=\"true\">+{{ summary().hidden }}</span>\r\n    }\r\n\r\n    <span class=\"gog-ms__actions\">\r\n      <span class=\"gog-ms__arrow\" [class.gog-ms__arrow--up]=\"isOpen()\" aria-hidden=\"true\">\r\n        <gog-icon\r\n          [template]=\"chevronSlot()?.templateRef ?? null\"\r\n          [name]=\"isOpen() ? 'chevron-up' : 'chevron-down'\"\r\n        />\r\n      </span>\r\n      @if (showClear()) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"gog-ms__clear gog-inline-center\"\r\n          (click)=\"clearValue($event)\"\r\n          [attr.aria-label]=\"resolvedClearLabel()\"\r\n        >\r\n          <gog-icon [template]=\"clearIconSlot()?.templateRef ?? null\" name=\"close\" />\r\n        </button>\r\n      }\r\n    </span>\r\n  </div>\r\n\r\n  @if (isOpen() && !resolvedAppendToBody()) {\r\n    <ng-container [ngTemplateOutlet]=\"panelTpl\" />\r\n  }\r\n\r\n  @if (visibleError()) {\r\n    <span class=\"gog-ms__error\" role=\"alert\">{{ visibleError() }}</span>\r\n  }\r\n</div>\r\n\r\n<!--\r\n  One template for both render modes. When `appendToBody` is set it is stamped into\r\n  <body> by the overlay, which is why the portal-only modifier and the resolved\r\n  coordinates are applied conditionally: outside the component's subtree the panel can\r\n  no longer inherit the size tokens from the `.gog-ms-wrapper--sm/--lg` wrapper.\r\n-->\r\n<ng-template #panelTpl>\r\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- (click) below is housekeeping stopPropagation, not an interactive handler; the focusable/keyboard-operable elements are the options inside -->\r\n  <div\r\n    [id]=\"listboxId()\"\r\n    class=\"gog-ms__dropdown\"\r\n    [class.gog-ms__dropdown--up]=\"!resolvedAppendToBody() && dropdownDirectionState() === 'up'\"\r\n    [class.gog-ms__dropdown--portal]=\"resolvedAppendToBody()\"\r\n    [class]=\"panelSizeClass()\"\r\n    [style.top.px]=\"resolvedAppendToBody() ? panelPlacement()?.top : null\"\r\n    [style.left.px]=\"resolvedAppendToBody() ? panelPlacement()?.left : null\"\r\n    [style.width]=\"resolvedAppendToBody() ? resolvedPanelWidth() : null\"\r\n    [style.min-width]=\"resolvedAppendToBody() ? resolvedPanelMinWidth() : null\"\r\n    [style.max-height]=\"resolvedAppendToBody() ? resolvedPanelMaxHeight() : null\"\r\n    [style.z-index]=\"dropdownZIndex() ?? panelZIndex()\"\r\n    role=\"listbox\"\r\n    aria-multiselectable=\"true\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    @if (showControls() && controlsPosition() === 'top') {\r\n      <ng-container [ngTemplateOutlet]=\"controlsRowTpl\" />\r\n    }\r\n    <!--\r\n      Not a tab stop of its own: the listbox pattern's only stop is the trigger, with\r\n      focus moved between options via the arrow keys (roving-focus.ts), which already\r\n      scrolls the focused option into view natively \u2014 no separate keyboard-scroll target\r\n      needed here.\r\n    -->\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'top') {\r\n      <div class=\"gog-ms__filter gog-ms__filter--top\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-ms__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    <gog-scroll size=\"thin\" [focusable]=\"false\" overscrollBehavior=\"contain\" class=\"gog-ms__scroll\">\r\n      <div class=\"gog-ms__options\">\r\n        @if (visibleOptions().length === 0) {\r\n          <p class=\"gog-ms__empty\">{{ filterEmptyMessage() }}</p>\r\n        }\r\n        @for (option of visibleOptions(); track valueOf(option)) {\r\n          <!--\r\n            tabindex=\"-1\" keeps the list to a single tab stop, as the listbox pattern\r\n            expects: focus moves between options with the arrow keys, not by tabbing\r\n            through every one. Programmatic .focus() still works on a negative tabindex.\r\n          -->\r\n          <button\r\n            type=\"button\"\r\n            class=\"gog-ms__option\"\r\n            role=\"option\"\r\n            tabindex=\"-1\"\r\n            [attr.aria-selected]=\"isSelected(option)\"\r\n            [attr.aria-disabled]=\"isOptionDisabled(option)\"\r\n            [class.gog-ms__option--selected]=\"isSelected(option)\"\r\n            [class.gog-ms__option--disabled]=\"isOptionDisabled(option)\"\r\n            (click)=\"toggleOption(option, $event)\"\r\n            (keydown)=\"onOptionKeydown($event)\"\r\n            gogRipple\r\n            [rippleDisabled]=\"!rippleEnabled()\"\r\n          >\r\n            @if (optionSlot(); as slot) {\r\n              <ng-container\r\n                *ngTemplateOutlet=\"\r\n                  slot.templateRef;\r\n                  context: optionContext(option, isSelected(option))\r\n                \"\r\n              />\r\n            } @else {\r\n              <span class=\"gog-ms__option-mark\" aria-hidden=\"true\">\r\n                <gog-icon [name]=\"isSelected(option) ? 'checkbox-checked' : 'checkbox'\" />\r\n              </span>\r\n              {{ labelOf(option) }}\r\n            }\r\n          </button>\r\n        }\r\n      </div>\r\n    </gog-scroll>\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'bottom') {\r\n      <div class=\"gog-ms__filter gog-ms__filter--bottom\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-ms__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    @if (showControls() && controlsPosition() === 'bottom') {\r\n      <ng-container [ngTemplateOutlet]=\"controlsRowTpl\" />\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #controlsRowTpl>\r\n  <div class=\"gog-ms__controls\" [class.gog-ms__controls--bottom]=\"controlsPosition() === 'bottom'\">\r\n    <gog-button variant=\"ghost\" size=\"sm\" (click)=\"selectAll($event)\">{{\r\n      resolvedSelectAllLabel()\r\n    }}</gog-button>\r\n    <gog-button variant=\"ghost\" size=\"sm\" (click)=\"clearAll($event)\">{{\r\n      resolvedClearAllLabel()\r\n    }}</gog-button>\r\n  </div>\r\n</ng-template>\r\n\r\n<!-- Full selection, shown as a tooltip when the trigger can only fit part of it. -->\r\n<ng-template #selectedListTpl>\r\n  <ul class=\"gog-ms__tooltip-list\">\r\n    @for (label of selectedLabels(); track label) {\r\n      <li>{{ label }}</li>\r\n    }\r\n  </ul>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";.gog-ms-wrapper{display:flex;flex-direction:column;gap:var(--gog-multiselect-gap);position:relative;width:100%}:host(.gog-host--auto-width){width:fit-content}:host(.gog-host--auto-width) .gog-ms-wrapper{width:fit-content}.gog-ms-wrapper--xsm,.gog-ms__dropdown--xsm{--gog-multiselect-size-padding-y: var(--gog-field-xsm-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-xsm-padding-x);--gog-multiselect-size-font-size: var(--gog-field-xsm-font-size)}.gog-ms-wrapper--sm,.gog-ms__dropdown--sm{--gog-multiselect-size-padding-y: var(--gog-field-sm-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-sm-padding-x);--gog-multiselect-size-font-size: var(--gog-field-sm-font-size)}.gog-ms-wrapper--lg,.gog-ms__dropdown--lg{--gog-multiselect-size-padding-y: var(--gog-field-lg-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-lg-padding-x);--gog-multiselect-size-font-size: var(--gog-field-lg-font-size)}.gog-ms-wrapper--slg,.gog-ms__dropdown--slg{--gog-multiselect-size-padding-y: var(--gog-field-slg-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-slg-padding-x);--gog-multiselect-size-font-size: var(--gog-field-slg-font-size)}.gog-ms__label{font-family:var(--gog-multiselect-label-font-family);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing);cursor:pointer}.gog-ms{position:relative;display:flex;align-items:center;justify-content:space-between;padding:var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));background-color:var(--gog-multiselect-field-bg);border:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border);border-radius:var(--gog-multiselect-radius);color:var(--gog-multiselect-field-color);cursor:pointer;-webkit-user-select:none;user-select:none;transition:border-color var(--gog-multiselect-transition-duration) var(--gog-easing),box-shadow var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms:hover:not(.gog-ms--disabled){border-color:var(--gog-multiselect-focus-border)}.gog-ms:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:var(--gog-multiselect-focus-ring-offset)}.gog-ms--open{border-color:var(--gog-multiselect-border-color);box-shadow:var(--gog-multiselect-focus-glow)}.gog-ms--disabled{opacity:var(--gog-multiselect-disabled-opacity);cursor:not-allowed}.gog-ms--disabled .gog-ms__label{cursor:not-allowed}.gog-ms--error{border-color:var(--gog-multiselect-error-color)}.gog-ms__value{font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));flex:1;align-self:baseline;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--gog-multiselect-value-color)}.gog-ms__value--placeholder{color:var(--gog-multiselect-placeholder-color)}.gog-ms{padding-inline-end:var(--gog-multiselect-actions-inset)}.gog-ms__actions{display:flex;align-items:center;gap:var(--gog-multiselect-actions-gap);flex-shrink:0}.gog-ms__clear{width:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-multiselect-clear-radius);background:transparent;color:var(--gog-multiselect-placeholder-color);line-height:1;cursor:pointer;transition:color var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms__clear gog-icon{font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-clear-icon-ratio))}.gog-ms__clear:hover{color:var(--gog-multiselect-field-color)}.gog-ms__clear:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:var(--gog-multiselect-focus-ring-offset)}.gog-ms__arrow{color:var(--gog-multiselect-border-color);transition:transform var(--gog-multiselect-arrow-transition-duration) var(--gog-easing);display:inline-flex;align-items:center;justify-content:center;width:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)))}.gog-ms__arrow gog-icon{font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-arrow-icon-ratio))}.gog-ms__arrow--up{transform:rotate(180deg)}.gog-ms__dropdown{position:absolute;top:calc(100% + var(--gog-multiselect-panel-offset));inset-inline-start:0;inset-inline-end:auto;min-width:100%;width:max-content;max-width:var(--gog-multiselect-panel-max-width);z-index:var(--gog-dropdown-z);display:flex;flex-direction:column;background-color:var(--gog-multiselect-panel-bg);border:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-panel-border);border-radius:var(--gog-multiselect-radius);max-height:var(--gog-multiselect-panel-max-height);overflow:hidden;box-shadow:var(--gog-multiselect-panel-shadow)}.gog-ms__scroll{flex:1;min-height:0}.gog-ms__dropdown--up{top:auto;bottom:calc(100% + var(--gog-multiselect-panel-offset))}.gog-ms__dropdown--portal{position:fixed;top:unset;bottom:unset;inset-inline:unset}.gog-ms__controls{flex-shrink:0;display:flex;gap:var(--gog-multiselect-controls-gap);padding:var(--gog-multiselect-controls-padding);background-color:var(--gog-multiselect-panel-bg);border-bottom:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border)}.gog-ms__controls--bottom{border-bottom:0;border-top:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border)}.gog-ms__options{display:flex;flex-direction:column;padding:var(--gog-multiselect-options-padding);gap:var(--gog-multiselect-option-gap)}.gog-ms__option{width:100%;display:flex;align-items:center;gap:var(--gog-multiselect-option-gap-inline);padding:var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));border:0;background:transparent;text-align:start;font:inherit;font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));cursor:pointer;border-radius:var(--gog-multiselect-option-radius);transition:background-color var(--gog-multiselect-option-transition-duration) var(--gog-easing);color:var(--gog-multiselect-option-color)}.gog-ms__option--disabled{opacity:var(--gog-multiselect-option-disabled-opacity);cursor:not-allowed}.gog-ms__option:hover{background-color:var(--gog-multiselect-option-hover-bg)}.gog-ms__option--selected{color:var(--gog-multiselect-border-color)}.gog-ms__option:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:calc(var(--gog-multiselect-focus-ring-width) * -1)}.gog-ms__option-mark{display:flex;align-items:center;justify-content:center;width:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-size-ratio));height:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-size-ratio));flex-shrink:0;font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-icon-ratio));color:var(--gog-multiselect-checkbox-border)}.gog-ms__option--selected .gog-ms__option-mark{color:var(--gog-multiselect-checkbox-checked-bg)}.gog-ms__error{font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-error-font-size);color:var(--gog-multiselect-error-color);margin-top:var(--gog-multiselect-error-offset)}.gog-ms__label--float{position:absolute;inset-inline-start:var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));top:50%;transform:translateY(-50%);max-width:calc(100% - 2 * var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;cursor:default;color:var(--gog-multiselect-placeholder-color);font-size:var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-multiselect-transition-duration) var(--gog-easing),font-size var(--gog-multiselect-transition-duration) var(--gog-easing),color var(--gog-multiselect-transition-duration) var(--gog-easing),top var(--gog-multiselect-transition-duration) var(--gog-easing),background-color var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms-wrapper--float-in,.gog-ms-wrapper--float-on{--gog-multiselect-float-top-padding: calc(var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-multiselect-float-label-reserve))}.gog-ms-wrapper--float-in .gog-ms,.gog-ms-wrapper--float-on .gog-ms{padding-top:var(--gog-multiselect-float-top-padding)}.gog-ms-wrapper--float-in .gog-ms__label--float,.gog-ms-wrapper--float-on .gog-ms__label--float{top:var(--gog-multiselect-float-top-padding);transform:none}.gog-ms-wrapper--float-in.gog-ms-wrapper--floated .gog-ms__label--float{top:var(--gog-multiselect-float-label-in-top);transform:translateY(0);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing)}.gog-ms-wrapper--float-on.gog-ms-wrapper--floated .gog-ms__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing);background-color:var(--gog-multiselect-float-label-on-bg, var(--gog-multiselect-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-ms-wrapper--float-over.gog-ms-wrapper--floated .gog-ms__label--float{top:calc(-1 * var(--gog-multiselect-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing)}.gog-ms-wrapper--float-over .gog-ms{margin-top:var(--gog-multiselect-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-ms,.gog-ms__clear,.gog-ms__arrow,.gog-ms__option,.gog-ms__option-mark,.gog-ms__label--float{transition:none}}.gog-ms__filter{position:sticky;top:0;z-index:1;padding:var(--gog-multiselect-filter-padding);background:var(--gog-multiselect-panel-bg)}.gog-ms__filter-input{width:100%;padding:var(--gog-multiselect-filter-input-padding-y) var(--gog-multiselect-filter-input-padding-x);font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-multiselect-filter-input-color);background:var(--gog-multiselect-filter-input-bg);border:var(--gog-control-border-width) var(--gog-control-border-style) var(--gog-multiselect-filter-input-border);border-radius:var(--gog-multiselect-filter-input-radius);outline:none}.gog-ms__filter-input:focus{border-color:var(--gog-multiselect-focus-border)}.gog-ms__empty{margin:0;padding:var(--gog-multiselect-filter-empty-padding);font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-multiselect-filter-empty-color);text-align:center}.gog-ms__filter--top{border-bottom:var(--gog-multiselect-filter-border-width) var(--gog-multiselect-filter-border-style) var(--gog-multiselect-filter-border-color)}.gog-ms__filter--bottom{top:auto;bottom:0;border-top:var(--gog-multiselect-filter-border-width) var(--gog-multiselect-filter-border-style) var(--gog-multiselect-filter-border-color)}:host(.gog-host--auto-width),:host(.gog-host--auto-width) .gog-ms{min-width:var(--gog-multiselect-min-width)}.gog-ms__dropdown--portal{max-width:var(--gog-multiselect-panel-max-width)}.gog-ms__overflow{flex-shrink:0;align-self:baseline;margin-inline-start:var(--gog-multiselect-overflow-gap);font-size:var(--gog-multiselect-overflow-font-size);color:var(--gog-multiselect-overflow-color)}.gog-ms__tooltip-list{margin:0;padding-inline-start:1.1em;text-align:start}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "gog-button", inputs: ["variant", "size", "disabled", "fullWidth", "type", "loading", "ripple", "debounce", "ariaLabel"], outputs: ["gogClick"] }, { kind: "directive", type: GogRippleDirective, selector: "[gogRipple]", inputs: ["rippleDisabled", "rippleCentred"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ScrollComponent, selector: "gog-scroll", inputs: ["axis", "size", "autoHide", "hideDelay", "reachThreshold", "focusable", "ariaLabel", "overscrollBehavior", "showTrack"], outputs: ["gogScroll", "gogReachStart", "gogReachEnd"] }, { kind: "directive", type: GogTooltipDirective, selector: "[gogTooltip]", inputs: ["gogTooltip", "gogTooltipPosition", "gogTooltipShowDelay", "gogTooltipHideDelay", "gogTooltipDisabled", "gogTooltipClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: MultiselectComponent, decorators: [{
             type: Component,
@@ -7910,7 +7910,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
                     ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         // Only bites when the control has opted out of full width; otherwise the container decides.
                         '[style.--gog-multiselect-min-width]': 'minWidth()',
-                    }, template: "<!--\r\n  Deliberately not `gog-contained-layout`: `contain: layout` makes this element a stacking\r\n  context, which traps the panel's z-index inside it and lets whatever follows on the page\r\n  paint over the open dropdown.\r\n-->\r\n<div\r\n  class=\"gog-ms-wrapper\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-ms-wrapper--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-ms-wrapper--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-ms-wrapper--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-ms-wrapper--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  <!--\r\n    Associated with aria-labelledby rather than `for`: the trigger is a div with\r\n    role=\"combobox\", not a labelable element. Without this the trigger had no accessible\r\n    name at all whenever `label` was set, because that also suppresses the aria-label.\r\n  -->\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n    <label class=\"gog-ms__label\" [id]=\"labelId()\">{{ label() }}</label>\r\n  }\r\n\r\n  <div\r\n    [gogTooltip]=\"summary().hidden > 0 ? selectedListTpl : null\"\r\n    class=\"gog-ms\"\r\n    role=\"combobox\"\r\n    [attr.tabindex]=\"isDisabled() ? -1 : 0\"\r\n    [attr.aria-expanded]=\"isOpen()\"\r\n    aria-haspopup=\"listbox\"\r\n    [attr.aria-controls]=\"listboxId()\"\r\n    [attr.aria-disabled]=\"isDisabled()\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    [attr.aria-label]=\"label() ? null : ariaLabel() || placeholder() || 'Select'\"\r\n    [class.gog-ms--open]=\"isOpen()\"\r\n    [class.gog-ms--disabled]=\"isDisabled()\"\r\n    [class.gog-ms--error]=\"hasError()\"\r\n    (click)=\"toggle()\"\r\n    (focus)=\"onFocusIn()\"\r\n    (blur)=\"onFocusOut()\"\r\n    (keydown.enter)=\"toggle(); $event.preventDefault()\"\r\n    (keydown.space)=\"toggle(); $event.preventDefault()\"\r\n    (keydown.escape)=\"close()\"\r\n    (keydown.arrowdown)=\"onTriggerArrowKeydown($event)\"\r\n    (keydown.arrowup)=\"onTriggerArrowKeydown($event)\"\r\n  >\r\n    @if (label() && isFloatLabelActive()) {\r\n      <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n      <label class=\"gog-ms__label gog-ms__label--float\" [id]=\"labelId()\">{{ label() }}</label>\r\n    }\r\n    <span #valueEl class=\"gog-ms__value\" [class.gog-ms__value--placeholder]=\"!selectedNames()\">\r\n      {{ summary().text || effectivePlaceholder() }}\r\n    </span>\r\n    <!--\r\n      Only what fits is shown; the rest is collapsed into a count. The tooltip is the way to read\r\n      the whole selection back, so it is bound only while something is actually hidden.\r\n    -->\r\n    @if (summary().hidden > 0) {\r\n      <span class=\"gog-ms__overflow\" aria-hidden=\"true\">+{{ summary().hidden }}</span>\r\n    }\r\n\r\n    <span class=\"gog-ms__actions\">\r\n      <span class=\"gog-ms__arrow\" [class.gog-ms__arrow--up]=\"isOpen()\" aria-hidden=\"true\">\r\n        <gog-icon\r\n          [template]=\"chevronSlot()?.templateRef ?? null\"\r\n          [name]=\"isOpen() ? 'chevron-up' : 'chevron-down'\"\r\n        />\r\n      </span>\r\n      @if (showClear()) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"gog-ms__clear gog-inline-center\"\r\n          (click)=\"clearValue($event)\"\r\n          [attr.aria-label]=\"resolvedClearLabel()\"\r\n        >\r\n          <gog-icon [template]=\"clearIconSlot()?.templateRef ?? null\" name=\"close\" />\r\n        </button>\r\n      }\r\n    </span>\r\n  </div>\r\n\r\n  @if (isOpen() && !resolvedAppendToBody()) {\r\n    <ng-container [ngTemplateOutlet]=\"panelTpl\" />\r\n  }\r\n\r\n  @if (visibleError()) {\r\n    <span class=\"gog-ms__error\" role=\"alert\">{{ visibleError() }}</span>\r\n  }\r\n</div>\r\n\r\n<!--\r\n  One template for both render modes. When `appendToBody` is set it is stamped into\r\n  <body> by the overlay, which is why the portal-only modifier and the resolved\r\n  coordinates are applied conditionally: outside the component's subtree the panel can\r\n  no longer inherit the size tokens from the `.gog-ms-wrapper--sm/--lg` wrapper.\r\n-->\r\n<ng-template #panelTpl>\r\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- (click) below is housekeeping stopPropagation, not an interactive handler; the focusable/keyboard-operable elements are the options inside -->\r\n  <div\r\n    [id]=\"listboxId()\"\r\n    class=\"gog-ms__dropdown\"\r\n    [class.gog-ms__dropdown--up]=\"!resolvedAppendToBody() && dropdownDirectionState() === 'up'\"\r\n    [class.gog-ms__dropdown--portal]=\"resolvedAppendToBody()\"\r\n    [class]=\"panelSizeClass()\"\r\n    [style.top.px]=\"resolvedAppendToBody() ? panelPlacement()?.top : null\"\r\n    [style.left.px]=\"resolvedAppendToBody() ? panelPlacement()?.left : null\"\r\n    [style.width]=\"resolvedAppendToBody() ? resolvedPanelWidth() : null\"\r\n    [style.min-width]=\"resolvedAppendToBody() ? resolvedPanelMinWidth() : null\"\r\n    [style.max-height]=\"resolvedAppendToBody() ? resolvedPanelMaxHeight() : null\"\r\n    [style.z-index]=\"dropdownZIndex() ?? panelZIndex()\"\r\n    role=\"listbox\"\r\n    aria-multiselectable=\"true\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    @if (showControls() && controlsPosition() === 'top') {\r\n      <ng-container [ngTemplateOutlet]=\"controlsRowTpl\" />\r\n    }\r\n    <!--\r\n      Not a tab stop of its own: the listbox pattern's only stop is the trigger, with\r\n      focus moved between options via the arrow keys (roving-focus.ts), which already\r\n      scrolls the focused option into view natively \u2014 no separate keyboard-scroll target\r\n      needed here.\r\n    -->\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'top') {\r\n      <div class=\"gog-ms__filter gog-ms__filter--top\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-ms__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    <gog-scroll size=\"thin\" [focusable]=\"false\" overscrollBehavior=\"contain\" class=\"gog-ms__scroll\">\r\n      <div class=\"gog-ms__options\">\r\n        @if (visibleOptions().length === 0) {\r\n          <p class=\"gog-ms__empty\">{{ filterEmptyMessage() }}</p>\r\n        }\r\n        @for (option of visibleOptions(); track valueOf(option)) {\r\n          <!--\r\n            tabindex=\"-1\" keeps the list to a single tab stop, as the listbox pattern\r\n            expects: focus moves between options with the arrow keys, not by tabbing\r\n            through every one. Programmatic .focus() still works on a negative tabindex.\r\n          -->\r\n          <button\r\n            type=\"button\"\r\n            class=\"gog-ms__option\"\r\n            role=\"option\"\r\n            tabindex=\"-1\"\r\n            [attr.aria-selected]=\"isSelected(option)\"\r\n            [attr.aria-disabled]=\"isOptionDisabled(option)\"\r\n            [class.gog-ms__option--selected]=\"isSelected(option)\"\r\n            [class.gog-ms__option--disabled]=\"isOptionDisabled(option)\"\r\n            (click)=\"toggleOption(option, $event)\"\r\n            (keydown)=\"onOptionKeydown($event)\"\r\n            gogRipple\r\n            [rippleDisabled]=\"!rippleEnabled()\"\r\n          >\r\n            @if (optionSlot(); as slot) {\r\n              <ng-container\r\n                *ngTemplateOutlet=\"\r\n                  slot.templateRef;\r\n                  context: optionContext(option, isSelected(option))\r\n                \"\r\n              />\r\n            } @else {\r\n              <span class=\"gog-ms__option-mark\" aria-hidden=\"true\">\r\n                <gog-icon [name]=\"isSelected(option) ? 'checkbox-checked' : 'checkbox'\" />\r\n              </span>\r\n              {{ labelOf(option) }}\r\n            }\r\n          </button>\r\n        }\r\n      </div>\r\n    </gog-scroll>\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'bottom') {\r\n      <div class=\"gog-ms__filter gog-ms__filter--bottom\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-ms__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    @if (showControls() && controlsPosition() === 'bottom') {\r\n      <ng-container [ngTemplateOutlet]=\"controlsRowTpl\" />\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #controlsRowTpl>\r\n  <div class=\"gog-ms__controls\" [class.gog-ms__controls--bottom]=\"controlsPosition() === 'bottom'\">\r\n    <gog-button variant=\"ghost\" size=\"sm\" (click)=\"selectAll($event)\">{{\r\n      resolvedSelectAllLabel()\r\n    }}</gog-button>\r\n    <gog-button variant=\"ghost\" size=\"sm\" (click)=\"clearAll($event)\">{{\r\n      resolvedClearAllLabel()\r\n    }}</gog-button>\r\n  </div>\r\n</ng-template>\r\n\r\n<!-- Full selection, shown as a tooltip when the trigger can only fit part of it. -->\r\n<ng-template #selectedListTpl>\r\n  <ul class=\"gog-ms__tooltip-list\">\r\n    @for (label of selectedLabels(); track label) {\r\n      <li>{{ label }}</li>\r\n    }\r\n  </ul>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";.gog-ms-wrapper{display:flex;flex-direction:column;gap:var(--gog-multiselect-gap);position:relative;width:100%}:host(.gog-host--auto-width){width:fit-content}:host(.gog-host--auto-width) .gog-ms-wrapper{width:fit-content}.gog-ms-wrapper--xsm,.gog-ms__dropdown--xsm{--gog-multiselect-size-padding-y: var(--gog-field-xsm-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-xsm-padding-x);--gog-multiselect-size-font-size: var(--gog-field-xsm-font-size)}.gog-ms-wrapper--sm,.gog-ms__dropdown--sm{--gog-multiselect-size-padding-y: var(--gog-field-sm-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-sm-padding-x);--gog-multiselect-size-font-size: var(--gog-field-sm-font-size)}.gog-ms-wrapper--lg,.gog-ms__dropdown--lg{--gog-multiselect-size-padding-y: var(--gog-field-lg-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-lg-padding-x);--gog-multiselect-size-font-size: var(--gog-field-lg-font-size)}.gog-ms-wrapper--slg,.gog-ms__dropdown--slg{--gog-multiselect-size-padding-y: var(--gog-field-slg-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-slg-padding-x);--gog-multiselect-size-font-size: var(--gog-field-slg-font-size)}.gog-ms__label{font-family:var(--gog-multiselect-label-font-family);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing);cursor:pointer}.gog-ms{position:relative;display:flex;align-items:center;justify-content:space-between;padding:var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));background-color:var(--gog-multiselect-field-bg);border:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border);border-radius:var(--gog-multiselect-radius);color:var(--gog-multiselect-field-color);cursor:pointer;-webkit-user-select:none;user-select:none;transition:border-color var(--gog-multiselect-transition-duration) var(--gog-easing),box-shadow var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms:hover:not(.gog-ms--disabled){border-color:var(--gog-multiselect-focus-border)}.gog-ms:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:var(--gog-multiselect-focus-ring-offset)}.gog-ms--open{border-color:var(--gog-multiselect-border-color);box-shadow:var(--gog-multiselect-focus-glow)}.gog-ms--disabled{opacity:var(--gog-multiselect-disabled-opacity);cursor:not-allowed}.gog-ms--disabled .gog-ms__label{cursor:not-allowed}.gog-ms--error{border-color:var(--gog-multiselect-error-color)}.gog-ms__value{font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--gog-multiselect-value-color)}.gog-ms__value--placeholder{color:var(--gog-multiselect-placeholder-color)}.gog-ms{padding-inline-end:var(--gog-multiselect-actions-inset)}.gog-ms__actions{display:flex;align-items:center;gap:var(--gog-multiselect-actions-gap);flex-shrink:0}.gog-ms__clear{width:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-multiselect-clear-radius);background:transparent;color:var(--gog-multiselect-placeholder-color);line-height:1;cursor:pointer;transition:color var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms__clear gog-icon{font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-clear-icon-ratio))}.gog-ms__clear:hover{color:var(--gog-multiselect-field-color)}.gog-ms__clear:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:var(--gog-multiselect-focus-ring-offset)}.gog-ms__arrow{color:var(--gog-multiselect-border-color);transition:transform var(--gog-multiselect-arrow-transition-duration) var(--gog-easing);display:inline-flex;align-items:center;justify-content:center;width:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)))}.gog-ms__arrow gog-icon{font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-arrow-icon-ratio))}.gog-ms__arrow--up{transform:rotate(180deg)}.gog-ms__dropdown{position:absolute;top:calc(100% + var(--gog-multiselect-panel-offset));inset-inline-start:0;inset-inline-end:auto;min-width:100%;width:max-content;max-width:var(--gog-multiselect-panel-max-width);z-index:var(--gog-dropdown-z);display:flex;flex-direction:column;background-color:var(--gog-multiselect-panel-bg);border:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-panel-border);border-radius:var(--gog-multiselect-radius);max-height:var(--gog-multiselect-panel-max-height);overflow:hidden;box-shadow:var(--gog-multiselect-panel-shadow)}.gog-ms__scroll{flex:1;min-height:0}.gog-ms__dropdown--up{top:auto;bottom:calc(100% + var(--gog-multiselect-panel-offset))}.gog-ms__dropdown--portal{position:fixed;top:unset;bottom:unset;inset-inline:unset}.gog-ms__controls{flex-shrink:0;display:flex;gap:var(--gog-multiselect-controls-gap);padding:var(--gog-multiselect-controls-padding);background-color:var(--gog-multiselect-panel-bg);border-bottom:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border)}.gog-ms__controls--bottom{border-bottom:0;border-top:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border)}.gog-ms__options{display:flex;flex-direction:column;padding:var(--gog-multiselect-options-padding);gap:var(--gog-multiselect-option-gap)}.gog-ms__option{width:100%;display:flex;align-items:center;gap:var(--gog-multiselect-option-gap-inline);padding:var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));border:0;background:transparent;text-align:start;font:inherit;font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));cursor:pointer;border-radius:var(--gog-multiselect-option-radius);transition:background-color var(--gog-multiselect-option-transition-duration) var(--gog-easing);color:var(--gog-multiselect-option-color)}.gog-ms__option--disabled{opacity:var(--gog-multiselect-option-disabled-opacity);cursor:not-allowed}.gog-ms__option:hover{background-color:var(--gog-multiselect-option-hover-bg)}.gog-ms__option--selected{color:var(--gog-multiselect-border-color)}.gog-ms__option:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:calc(var(--gog-multiselect-focus-ring-width) * -1)}.gog-ms__option-mark{display:flex;align-items:center;justify-content:center;width:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-size-ratio));height:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-size-ratio));flex-shrink:0;font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-icon-ratio));color:var(--gog-multiselect-checkbox-border)}.gog-ms__option--selected .gog-ms__option-mark{color:var(--gog-multiselect-checkbox-checked-bg)}.gog-ms__error{font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-error-font-size);color:var(--gog-multiselect-error-color);margin-top:var(--gog-multiselect-error-offset)}.gog-ms__label--float{position:absolute;inset-inline-start:var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));top:50%;transform:translateY(-50%);max-width:calc(100% - 2 * var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;cursor:default;color:var(--gog-multiselect-placeholder-color);font-size:var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-multiselect-transition-duration) var(--gog-easing),font-size var(--gog-multiselect-transition-duration) var(--gog-easing),color var(--gog-multiselect-transition-duration) var(--gog-easing),top var(--gog-multiselect-transition-duration) var(--gog-easing),background-color var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms-wrapper--float-in,.gog-ms-wrapper--float-on{--gog-multiselect-float-top-padding: calc(var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-multiselect-float-label-reserve))}.gog-ms-wrapper--float-in .gog-ms,.gog-ms-wrapper--float-on .gog-ms{padding-top:var(--gog-multiselect-float-top-padding)}.gog-ms-wrapper--float-in .gog-ms__label--float,.gog-ms-wrapper--float-on .gog-ms__label--float{top:var(--gog-multiselect-float-top-padding);transform:none}.gog-ms-wrapper--float-in.gog-ms-wrapper--floated .gog-ms__label--float{top:var(--gog-multiselect-float-label-in-top);transform:translateY(0);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing)}.gog-ms-wrapper--float-on.gog-ms-wrapper--floated .gog-ms__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing);background-color:var(--gog-multiselect-float-label-on-bg, var(--gog-multiselect-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-ms-wrapper--float-over.gog-ms-wrapper--floated .gog-ms__label--float{top:calc(-1 * var(--gog-multiselect-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing)}.gog-ms-wrapper--float-over .gog-ms{margin-top:var(--gog-multiselect-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-ms,.gog-ms__clear,.gog-ms__arrow,.gog-ms__option,.gog-ms__option-mark,.gog-ms__label--float{transition:none}}.gog-ms__filter{position:sticky;top:0;z-index:1;padding:var(--gog-multiselect-filter-padding);background:var(--gog-multiselect-panel-bg)}.gog-ms__filter-input{width:100%;padding:var(--gog-multiselect-filter-input-padding-y) var(--gog-multiselect-filter-input-padding-x);font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-multiselect-filter-input-color);background:var(--gog-multiselect-filter-input-bg);border:var(--gog-control-border-width) var(--gog-control-border-style) var(--gog-multiselect-filter-input-border);border-radius:var(--gog-multiselect-filter-input-radius);outline:none}.gog-ms__filter-input:focus{border-color:var(--gog-multiselect-focus-border)}.gog-ms__empty{margin:0;padding:var(--gog-multiselect-filter-empty-padding);font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-multiselect-filter-empty-color);text-align:center}.gog-ms__filter--top{border-bottom:var(--gog-multiselect-filter-border-width) var(--gog-multiselect-filter-border-style) var(--gog-multiselect-filter-border-color)}.gog-ms__filter--bottom{top:auto;bottom:0;border-top:var(--gog-multiselect-filter-border-width) var(--gog-multiselect-filter-border-style) var(--gog-multiselect-filter-border-color)}:host(.gog-host--auto-width),:host(.gog-host--auto-width) .gog-ms{min-width:var(--gog-multiselect-min-width)}.gog-ms__dropdown--portal{max-width:var(--gog-multiselect-panel-max-width)}.gog-ms__overflow{flex-shrink:0;margin-inline-start:var(--gog-multiselect-overflow-gap);font-size:var(--gog-multiselect-overflow-font-size);color:var(--gog-multiselect-overflow-color)}.gog-ms__tooltip-list{margin:0;padding-inline-start:1.1em;text-align:start}\n"] }]
+                    }, template: "<!--\r\n  Deliberately not `gog-contained-layout`: `contain: layout` makes this element a stacking\r\n  context, which traps the panel's z-index inside it and lets whatever follows on the page\r\n  paint over the open dropdown.\r\n-->\r\n<div\r\n  class=\"gog-ms-wrapper\"\r\n  [class]=\"sizeClass()\"\r\n  [class.gog-ms-wrapper--float-in]=\"resolvedFloatLabel() === 'in'\"\r\n  [class.gog-ms-wrapper--float-on]=\"resolvedFloatLabel() === 'on'\"\r\n  [class.gog-ms-wrapper--float-over]=\"resolvedFloatLabel() === 'over'\"\r\n  [class.gog-ms-wrapper--floated]=\"isFloatLabelFloated()\"\r\n>\r\n  <!--\r\n    Associated with aria-labelledby rather than `for`: the trigger is a div with\r\n    role=\"combobox\", not a labelable element. Without this the trigger had no accessible\r\n    name at all whenever `label` was set, because that also suppresses the aria-label.\r\n  -->\r\n  @if (label() && resolvedFloatLabel() === 'none') {\r\n    <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n    <label class=\"gog-ms__label\" [id]=\"labelId()\">{{ label() }}</label>\r\n  }\r\n\r\n  <div\r\n    [gogTooltip]=\"summary().hidden > 0 ? selectedListTpl : null\"\r\n    class=\"gog-ms\"\r\n    role=\"combobox\"\r\n    [attr.tabindex]=\"isDisabled() ? -1 : 0\"\r\n    [attr.aria-expanded]=\"isOpen()\"\r\n    aria-haspopup=\"listbox\"\r\n    [attr.aria-controls]=\"listboxId()\"\r\n    [attr.aria-disabled]=\"isDisabled()\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    [attr.aria-label]=\"label() ? null : ariaLabel() || placeholder() || 'Select'\"\r\n    [class.gog-ms--open]=\"isOpen()\"\r\n    [class.gog-ms--disabled]=\"isDisabled()\"\r\n    [class.gog-ms--error]=\"hasError()\"\r\n    (click)=\"toggle()\"\r\n    (focus)=\"onFocusIn()\"\r\n    (blur)=\"onFocusOut()\"\r\n    (keydown.enter)=\"toggle(); $event.preventDefault()\"\r\n    (keydown.space)=\"toggle(); $event.preventDefault()\"\r\n    (keydown.escape)=\"close()\"\r\n    (keydown.arrowdown)=\"onTriggerArrowKeydown($event)\"\r\n    (keydown.arrowup)=\"onTriggerArrowKeydown($event)\"\r\n  >\r\n    @if (label() && isFloatLabelActive()) {\r\n      <!-- eslint-disable-next-line @angular-eslint/template/label-has-associated-control -- associated via aria-labelledby above instead, see comment -->\r\n      <label class=\"gog-ms__label gog-ms__label--float\" [id]=\"labelId()\">{{ label() }}</label>\r\n    }\r\n    <span #valueEl class=\"gog-ms__value\" [class.gog-ms__value--placeholder]=\"!selectedNames()\">\r\n      {{ summary().text || effectivePlaceholder() }}\r\n    </span>\r\n    <!--\r\n      Only what fits is shown; the rest is collapsed into a count. The tooltip is the way to read\r\n      the whole selection back, so it is bound only while something is actually hidden.\r\n    -->\r\n    @if (summary().hidden > 0) {\r\n      <span class=\"gog-ms__overflow\" aria-hidden=\"true\">+{{ summary().hidden }}</span>\r\n    }\r\n\r\n    <span class=\"gog-ms__actions\">\r\n      <span class=\"gog-ms__arrow\" [class.gog-ms__arrow--up]=\"isOpen()\" aria-hidden=\"true\">\r\n        <gog-icon\r\n          [template]=\"chevronSlot()?.templateRef ?? null\"\r\n          [name]=\"isOpen() ? 'chevron-up' : 'chevron-down'\"\r\n        />\r\n      </span>\r\n      @if (showClear()) {\r\n        <button\r\n          type=\"button\"\r\n          class=\"gog-ms__clear gog-inline-center\"\r\n          (click)=\"clearValue($event)\"\r\n          [attr.aria-label]=\"resolvedClearLabel()\"\r\n        >\r\n          <gog-icon [template]=\"clearIconSlot()?.templateRef ?? null\" name=\"close\" />\r\n        </button>\r\n      }\r\n    </span>\r\n  </div>\r\n\r\n  @if (isOpen() && !resolvedAppendToBody()) {\r\n    <ng-container [ngTemplateOutlet]=\"panelTpl\" />\r\n  }\r\n\r\n  @if (visibleError()) {\r\n    <span class=\"gog-ms__error\" role=\"alert\">{{ visibleError() }}</span>\r\n  }\r\n</div>\r\n\r\n<!--\r\n  One template for both render modes. When `appendToBody` is set it is stamped into\r\n  <body> by the overlay, which is why the portal-only modifier and the resolved\r\n  coordinates are applied conditionally: outside the component's subtree the panel can\r\n  no longer inherit the size tokens from the `.gog-ms-wrapper--sm/--lg` wrapper.\r\n-->\r\n<ng-template #panelTpl>\r\n  <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -- (click) below is housekeeping stopPropagation, not an interactive handler; the focusable/keyboard-operable elements are the options inside -->\r\n  <div\r\n    [id]=\"listboxId()\"\r\n    class=\"gog-ms__dropdown\"\r\n    [class.gog-ms__dropdown--up]=\"!resolvedAppendToBody() && dropdownDirectionState() === 'up'\"\r\n    [class.gog-ms__dropdown--portal]=\"resolvedAppendToBody()\"\r\n    [class]=\"panelSizeClass()\"\r\n    [style.top.px]=\"resolvedAppendToBody() ? panelPlacement()?.top : null\"\r\n    [style.left.px]=\"resolvedAppendToBody() ? panelPlacement()?.left : null\"\r\n    [style.width]=\"resolvedAppendToBody() ? resolvedPanelWidth() : null\"\r\n    [style.min-width]=\"resolvedAppendToBody() ? resolvedPanelMinWidth() : null\"\r\n    [style.max-height]=\"resolvedAppendToBody() ? resolvedPanelMaxHeight() : null\"\r\n    [style.z-index]=\"dropdownZIndex() ?? panelZIndex()\"\r\n    role=\"listbox\"\r\n    aria-multiselectable=\"true\"\r\n    [attr.aria-labelledby]=\"label() ? labelId() : null\"\r\n    (click)=\"$event.stopPropagation()\"\r\n  >\r\n    @if (showControls() && controlsPosition() === 'top') {\r\n      <ng-container [ngTemplateOutlet]=\"controlsRowTpl\" />\r\n    }\r\n    <!--\r\n      Not a tab stop of its own: the listbox pattern's only stop is the trigger, with\r\n      focus moved between options via the arrow keys (roving-focus.ts), which already\r\n      scrolls the focused option into view natively \u2014 no separate keyboard-scroll target\r\n      needed here.\r\n    -->\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'top') {\r\n      <div class=\"gog-ms__filter gog-ms__filter--top\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-ms__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    <gog-scroll size=\"thin\" [focusable]=\"false\" overscrollBehavior=\"contain\" class=\"gog-ms__scroll\">\r\n      <div class=\"gog-ms__options\">\r\n        @if (visibleOptions().length === 0) {\r\n          <p class=\"gog-ms__empty\">{{ filterEmptyMessage() }}</p>\r\n        }\r\n        @for (option of visibleOptions(); track valueOf(option)) {\r\n          <!--\r\n            tabindex=\"-1\" keeps the list to a single tab stop, as the listbox pattern\r\n            expects: focus moves between options with the arrow keys, not by tabbing\r\n            through every one. Programmatic .focus() still works on a negative tabindex.\r\n          -->\r\n          <button\r\n            type=\"button\"\r\n            class=\"gog-ms__option\"\r\n            role=\"option\"\r\n            tabindex=\"-1\"\r\n            [attr.aria-selected]=\"isSelected(option)\"\r\n            [attr.aria-disabled]=\"isOptionDisabled(option)\"\r\n            [class.gog-ms__option--selected]=\"isSelected(option)\"\r\n            [class.gog-ms__option--disabled]=\"isOptionDisabled(option)\"\r\n            (click)=\"toggleOption(option, $event)\"\r\n            (keydown)=\"onOptionKeydown($event)\"\r\n            gogRipple\r\n            [rippleDisabled]=\"!rippleEnabled()\"\r\n          >\r\n            @if (optionSlot(); as slot) {\r\n              <ng-container\r\n                *ngTemplateOutlet=\"\r\n                  slot.templateRef;\r\n                  context: optionContext(option, isSelected(option))\r\n                \"\r\n              />\r\n            } @else {\r\n              <span class=\"gog-ms__option-mark\" aria-hidden=\"true\">\r\n                <gog-icon [name]=\"isSelected(option) ? 'checkbox-checked' : 'checkbox'\" />\r\n              </span>\r\n              {{ labelOf(option) }}\r\n            }\r\n          </button>\r\n        }\r\n      </div>\r\n    </gog-scroll>\r\n    @if (resolvedFilter() && resolvedFilterPosition() === 'bottom') {\r\n      <div class=\"gog-ms__filter gog-ms__filter--bottom\">\r\n        <input\r\n          type=\"text\"\r\n          class=\"gog-ms__filter-input\"\r\n          [placeholder]=\"filterPlaceholder()\"\r\n          [value]=\"filterQuery()\"\r\n          (input)=\"onFilterInput($event)\"\r\n          (click)=\"$event.stopPropagation()\"\r\n          (keydown.escape)=\"close(); focusTrigger()\"\r\n        />\r\n      </div>\r\n    }\r\n    @if (showControls() && controlsPosition() === 'bottom') {\r\n      <ng-container [ngTemplateOutlet]=\"controlsRowTpl\" />\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #controlsRowTpl>\r\n  <div class=\"gog-ms__controls\" [class.gog-ms__controls--bottom]=\"controlsPosition() === 'bottom'\">\r\n    <gog-button variant=\"ghost\" size=\"sm\" (click)=\"selectAll($event)\">{{\r\n      resolvedSelectAllLabel()\r\n    }}</gog-button>\r\n    <gog-button variant=\"ghost\" size=\"sm\" (click)=\"clearAll($event)\">{{\r\n      resolvedClearAllLabel()\r\n    }}</gog-button>\r\n  </div>\r\n</ng-template>\r\n\r\n<!-- Full selection, shown as a tooltip when the trigger can only fit part of it. -->\r\n<ng-template #selectedListTpl>\r\n  <ul class=\"gog-ms__tooltip-list\">\r\n    @for (label of selectedLabels(); track label) {\r\n      <li>{{ label }}</li>\r\n    }\r\n  </ul>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";.gog-ms-wrapper{display:flex;flex-direction:column;gap:var(--gog-multiselect-gap);position:relative;width:100%}:host(.gog-host--auto-width){width:fit-content}:host(.gog-host--auto-width) .gog-ms-wrapper{width:fit-content}.gog-ms-wrapper--xsm,.gog-ms__dropdown--xsm{--gog-multiselect-size-padding-y: var(--gog-field-xsm-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-xsm-padding-x);--gog-multiselect-size-font-size: var(--gog-field-xsm-font-size)}.gog-ms-wrapper--sm,.gog-ms__dropdown--sm{--gog-multiselect-size-padding-y: var(--gog-field-sm-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-sm-padding-x);--gog-multiselect-size-font-size: var(--gog-field-sm-font-size)}.gog-ms-wrapper--lg,.gog-ms__dropdown--lg{--gog-multiselect-size-padding-y: var(--gog-field-lg-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-lg-padding-x);--gog-multiselect-size-font-size: var(--gog-field-lg-font-size)}.gog-ms-wrapper--slg,.gog-ms__dropdown--slg{--gog-multiselect-size-padding-y: var(--gog-field-slg-padding-y);--gog-multiselect-size-padding-x: var(--gog-field-slg-padding-x);--gog-multiselect-size-font-size: var(--gog-field-slg-font-size)}.gog-ms__label{font-family:var(--gog-multiselect-label-font-family);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing);cursor:pointer}.gog-ms{position:relative;display:flex;align-items:center;justify-content:space-between;padding:var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));background-color:var(--gog-multiselect-field-bg);border:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border);border-radius:var(--gog-multiselect-radius);color:var(--gog-multiselect-field-color);cursor:pointer;-webkit-user-select:none;user-select:none;transition:border-color var(--gog-multiselect-transition-duration) var(--gog-easing),box-shadow var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms:hover:not(.gog-ms--disabled){border-color:var(--gog-multiselect-focus-border)}.gog-ms:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:var(--gog-multiselect-focus-ring-offset)}.gog-ms--open{border-color:var(--gog-multiselect-border-color);box-shadow:var(--gog-multiselect-focus-glow)}.gog-ms--disabled{opacity:var(--gog-multiselect-disabled-opacity);cursor:not-allowed}.gog-ms--disabled .gog-ms__label{cursor:not-allowed}.gog-ms--error{border-color:var(--gog-multiselect-error-color)}.gog-ms__value{font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));flex:1;align-self:baseline;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--gog-multiselect-value-color)}.gog-ms__value--placeholder{color:var(--gog-multiselect-placeholder-color)}.gog-ms{padding-inline-end:var(--gog-multiselect-actions-inset)}.gog-ms__actions{display:flex;align-items:center;gap:var(--gog-multiselect-actions-gap);flex-shrink:0}.gog-ms__clear{width:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));padding:0;border:0;border-radius:var(--gog-multiselect-clear-radius);background:transparent;color:var(--gog-multiselect-placeholder-color);line-height:1;cursor:pointer;transition:color var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms__clear gog-icon{font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-clear-icon-ratio))}.gog-ms__clear:hover{color:var(--gog-multiselect-field-color)}.gog-ms__clear:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:var(--gog-multiselect-focus-ring-offset)}.gog-ms__arrow{color:var(--gog-multiselect-border-color);transition:transform var(--gog-multiselect-arrow-transition-duration) var(--gog-easing);display:inline-flex;align-items:center;justify-content:center;width:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));height:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)))}.gog-ms__arrow gog-icon{font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-arrow-icon-ratio))}.gog-ms__arrow--up{transform:rotate(180deg)}.gog-ms__dropdown{position:absolute;top:calc(100% + var(--gog-multiselect-panel-offset));inset-inline-start:0;inset-inline-end:auto;min-width:100%;width:max-content;max-width:var(--gog-multiselect-panel-max-width);z-index:var(--gog-dropdown-z);display:flex;flex-direction:column;background-color:var(--gog-multiselect-panel-bg);border:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-panel-border);border-radius:var(--gog-multiselect-radius);max-height:var(--gog-multiselect-panel-max-height);overflow:hidden;box-shadow:var(--gog-multiselect-panel-shadow)}.gog-ms__scroll{flex:1;min-height:0}.gog-ms__dropdown--up{top:auto;bottom:calc(100% + var(--gog-multiselect-panel-offset))}.gog-ms__dropdown--portal{position:fixed;top:unset;bottom:unset;inset-inline:unset}.gog-ms__controls{flex-shrink:0;display:flex;gap:var(--gog-multiselect-controls-gap);padding:var(--gog-multiselect-controls-padding);background-color:var(--gog-multiselect-panel-bg);border-bottom:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border)}.gog-ms__controls--bottom{border-bottom:0;border-top:var(--gog-multiselect-field-border-width) var(--gog-multiselect-field-border-style) var(--gog-multiselect-field-border)}.gog-ms__options{display:flex;flex-direction:column;padding:var(--gog-multiselect-options-padding);gap:var(--gog-multiselect-option-gap)}.gog-ms__option{width:100%;display:flex;align-items:center;gap:var(--gog-multiselect-option-gap-inline);padding:var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));border:0;background:transparent;text-align:start;font:inherit;font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));cursor:pointer;border-radius:var(--gog-multiselect-option-radius);transition:background-color var(--gog-multiselect-option-transition-duration) var(--gog-easing);color:var(--gog-multiselect-option-color)}.gog-ms__option--disabled{opacity:var(--gog-multiselect-option-disabled-opacity);cursor:not-allowed}.gog-ms__option:hover{background-color:var(--gog-multiselect-option-hover-bg)}.gog-ms__option--selected{color:var(--gog-multiselect-border-color)}.gog-ms__option:focus-visible{outline:var(--gog-multiselect-focus-ring-width) solid var(--gog-multiselect-focus-ring);outline-offset:calc(var(--gog-multiselect-focus-ring-width) * -1)}.gog-ms__option-mark{display:flex;align-items:center;justify-content:center;width:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-size-ratio));height:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-size-ratio));flex-shrink:0;font-size:calc(var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size))) * var(--gog-multiselect-mark-icon-ratio));color:var(--gog-multiselect-checkbox-border)}.gog-ms__option--selected .gog-ms__option-mark{color:var(--gog-multiselect-checkbox-checked-bg)}.gog-ms__error{font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-error-font-size);color:var(--gog-multiselect-error-color);margin-top:var(--gog-multiselect-error-offset)}.gog-ms__label--float{position:absolute;inset-inline-start:var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x)));top:50%;transform:translateY(-50%);max-width:calc(100% - 2 * var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x))));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;cursor:default;color:var(--gog-multiselect-placeholder-color);font-size:var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size));text-transform:none;letter-spacing:normal;transition:transform var(--gog-multiselect-transition-duration) var(--gog-easing),font-size var(--gog-multiselect-transition-duration) var(--gog-easing),color var(--gog-multiselect-transition-duration) var(--gog-easing),top var(--gog-multiselect-transition-duration) var(--gog-easing),background-color var(--gog-multiselect-transition-duration) var(--gog-easing)}.gog-ms-wrapper--float-in,.gog-ms-wrapper--float-on{--gog-multiselect-float-top-padding: calc(var(--gog-multiselect-padding-y, var(--gog-multiselect-size-padding-y, var(--gog-field-md-padding-y))) + var(--gog-multiselect-float-label-reserve))}.gog-ms-wrapper--float-in .gog-ms,.gog-ms-wrapper--float-on .gog-ms{padding-top:var(--gog-multiselect-float-top-padding)}.gog-ms-wrapper--float-in .gog-ms__label--float,.gog-ms-wrapper--float-on .gog-ms__label--float{top:var(--gog-multiselect-float-top-padding);transform:none}.gog-ms-wrapper--float-in.gog-ms-wrapper--floated .gog-ms__label--float{top:var(--gog-multiselect-float-label-in-top);transform:translateY(0);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing)}.gog-ms-wrapper--float-on.gog-ms-wrapper--floated .gog-ms__label--float{top:0;transform:translateY(-50%);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing);background-color:var(--gog-multiselect-float-label-on-bg, var(--gog-multiselect-field-bg));padding:0 4px;inset-inline-start:calc(var(--gog-multiselect-padding-x, var(--gog-multiselect-size-padding-x, var(--gog-field-md-padding-x))) - 4px)}.gog-ms-wrapper--float-over.gog-ms-wrapper--floated .gog-ms__label--float{top:calc(-1 * var(--gog-multiselect-float-label-over-gap));transform:translateY(-100%);font-size:var(--gog-multiselect-label-font-size);color:var(--gog-multiselect-label-color);text-transform:var(--gog-multiselect-label-text-transform);letter-spacing:var(--gog-multiselect-label-letter-spacing)}.gog-ms-wrapper--float-over .gog-ms{margin-top:var(--gog-multiselect-float-label-over-reserve)}@media(prefers-reduced-motion:reduce){.gog-ms,.gog-ms__clear,.gog-ms__arrow,.gog-ms__option,.gog-ms__option-mark,.gog-ms__label--float{transition:none}}.gog-ms__filter{position:sticky;top:0;z-index:1;padding:var(--gog-multiselect-filter-padding);background:var(--gog-multiselect-panel-bg)}.gog-ms__filter-input{width:100%;padding:var(--gog-multiselect-filter-input-padding-y) var(--gog-multiselect-filter-input-padding-x);font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-multiselect-filter-input-color);background:var(--gog-multiselect-filter-input-bg);border:var(--gog-control-border-width) var(--gog-control-border-style) var(--gog-multiselect-filter-input-border);border-radius:var(--gog-multiselect-filter-input-radius);outline:none}.gog-ms__filter-input:focus{border-color:var(--gog-multiselect-focus-border)}.gog-ms__empty{margin:0;padding:var(--gog-multiselect-filter-empty-padding);font-family:var(--gog-multiselect-font-family);font-size:var(--gog-multiselect-font-size, var(--gog-multiselect-size-font-size, var(--gog-field-md-font-size)));color:var(--gog-multiselect-filter-empty-color);text-align:center}.gog-ms__filter--top{border-bottom:var(--gog-multiselect-filter-border-width) var(--gog-multiselect-filter-border-style) var(--gog-multiselect-filter-border-color)}.gog-ms__filter--bottom{top:auto;bottom:0;border-top:var(--gog-multiselect-filter-border-width) var(--gog-multiselect-filter-border-style) var(--gog-multiselect-filter-border-color)}:host(.gog-host--auto-width),:host(.gog-host--auto-width) .gog-ms{min-width:var(--gog-multiselect-min-width)}.gog-ms__dropdown--portal{max-width:var(--gog-multiselect-panel-max-width)}.gog-ms__overflow{flex-shrink:0;align-self:baseline;margin-inline-start:var(--gog-multiselect-overflow-gap);font-size:var(--gog-multiselect-overflow-font-size);color:var(--gog-multiselect-overflow-color)}.gog-ms__tooltip-list{margin:0;padding-inline-start:1.1em;text-align:start}\n"] }]
         }], ctorParameters: () => [], propDecorators: { showControls: [{ type: i0.Input, args: [{ isSignal: true, alias: "showControls", required: false }] }], controlsPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "controlsPosition", required: false }] }], selectAllLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectAllLabel", required: false }] }], clearAllLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "clearAllLabel", required: false }] }], clearIconSlot: [{ type: i0.ContentChild, args: [i0.forwardRef(() => GogMultiselectClearIconDirective), { isSignal: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], panelTemplate: [{ type: i0.ViewChild, args: ['panelTpl', { isSignal: true }] }], valueRef: [{ type: i0.ViewChild, args: ['valueEl', { isSignal: true }] }] } });
 /** One shared 2D context; creating a canvas per measurement is what makes this approach slow. */
 let measureContext = null;
@@ -8934,7 +8934,7 @@ class TableComponent {
     /** CSS grid-area for the pagination block */
     paginatorGridArea = computed(() => this.paginatorPosition(), ...(ngDevMode ? [{ debugName: "paginatorGridArea" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TableComponent, isStandalone: true, selector: "gog-table", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, showPageSizeSelect: { classPropertyName: "showPageSizeSelect", publicName: "showPageSizeSelect", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, interactiveRows: { classPropertyName: "interactiveRows", publicName: "interactiveRows", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, showSelectionColumn: { classPropertyName: "showSelectionColumn", publicName: "showSelectionColumn", isSignal: true, isRequired: false, transformFunction: null }, showRowNumbers: { classPropertyName: "showRowNumbers", publicName: "showRowNumbers", isSignal: true, isRequired: false, transformFunction: null }, showTotal: { classPropertyName: "showTotal", publicName: "showTotal", isSignal: true, isRequired: false, transformFunction: null }, emptyPlaceholder: { classPropertyName: "emptyPlaceholder", publicName: "emptyPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, paginatorPosition: { classPropertyName: "paginatorPosition", publicName: "paginatorPosition", isSignal: true, isRequired: false, transformFunction: null }, totalPosition: { classPropertyName: "totalPosition", publicName: "totalPosition", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, showColumnBorders: { classPropertyName: "showColumnBorders", publicName: "showColumnBorders", isSignal: true, isRequired: false, transformFunction: null }, stickyHeader: { classPropertyName: "stickyHeader", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageSize: "pageSizeChange", selection: "selectionChange", gogSortChange: "gogSortChange", gogPageChange: "gogPageChange", gogRowClick: "gogRowClick" }, host: { properties: { "style.display": "\"block\"", "style.width": "fullWidth() ? \"100%\" : \"fit-content\"", "attr.aria-busy": "loading() ? \"true\" : null" }, classAttribute: "gog-table-host" }, queries: [{ propertyName: "columns", predicate: GogColumn, isSignal: true }], ngImport: i0, template: "<div class=\"gog-table-wrapper gog-contained-layout\">\r\n  <!--\r\n    The vertical axis is enabled only when the table has been capped. Left on for an uncapped\r\n    table, `gog-scroll` would make this viewport a scroll container on both axes, which puts it\r\n    in the sticky chain of everything inside it and takes the consumer's own scrolling region\r\n    out of it \u2014 measured: a header that used to pin to that region rode away by 147px.\r\n  -->\r\n  <gog-scroll\r\n    [axis]=\"maxHeight() ? 'both' : 'horizontal'\"\r\n    [style.max-height]=\"maxHeight()\"\r\n    class=\"gog-table-scroll\"\r\n  >\r\n    <table\r\n      class=\"gog-table\"\r\n      [class]=\"sizeClass()\"\r\n      [class.gog-table--col-borders]=\"showColumnBorders()\"\r\n      [class.gog-table--loading]=\"loading()\"\r\n      [class.gog-table--sticky-header]=\"stickyHeader()\"\r\n      [class.gog-table--auto-layout]=\"!fullWidth()\"\r\n      [style.width]=\"fullWidth() ? '100%' : 'fit-content'\"\r\n    >\r\n      <colgroup>\r\n        @if (hasSelectionColumn()) {\r\n          <col class=\"gog-table__col--select\" />\r\n        }\r\n        @if (showRowNumbers()) {\r\n          <col class=\"gog-table__col--num\" />\r\n        }\r\n        @for (col of columns(); track col.field()) {\r\n          <col\r\n            [style.width]=\"col.width() || null\"\r\n            [style.min-width]=\"col.minWidth() || null\"\r\n            [style.max-width]=\"col.maxWidth() || null\"\r\n          />\r\n        }\r\n      </colgroup>\r\n      <thead>\r\n        <tr>\r\n          @if (hasSelectionColumn()) {\r\n            <th class=\"gog-table__th gog-table__th--select\" scope=\"col\">\r\n              <!--\r\n                Only `multiple` gets a select-all: in `single` mode there is nothing to select\r\n                all of, and a checkbox that can only ever check one row is a lie.\r\n              -->\r\n              @if (selectionMode() === 'multiple') {\r\n                <gog-checkbox\r\n                  [checked]=\"allPageRowsSelected()\"\r\n                  [indeterminate]=\"somePageRowsSelected()\"\r\n                  [disabled]=\"loading() || visibleRows().length === 0\"\r\n                  [ariaLabel]=\"resolvedLabels().selectAllRows\"\r\n                  (checkedChange)=\"toggleAllOnPage($event)\"\r\n                />\r\n              }\r\n            </th>\r\n          }\r\n          @if (showRowNumbers()) {\r\n            <th class=\"gog-table__th gog-table__th--num\" scope=\"col\">#</th>\r\n          }\r\n          @for (col of columns(); track col.field()) {\r\n            <th\r\n              class=\"gog-table__th\"\r\n              scope=\"col\"\r\n              [class.gog-table__th--sortable]=\"col.sortable() && !loading()\"\r\n              [class.gog-table__th--sorted]=\"getSortDirection(col.field())\"\r\n              [attr.aria-sort]=\"getAriaSort(col.field())\"\r\n              [attr.tabindex]=\"col.sortable() && !loading() ? 0 : null\"\r\n              (click)=\"handleSortClick(col)\"\r\n              (keydown.enter)=\"handleSortClick(col)\"\r\n              (keydown.space)=\"handleSortClick(col); $event.preventDefault()\"\r\n            >\r\n              @if (getHeaderTemplate(col); as headerTpl) {\r\n                <ng-container *ngTemplateOutlet=\"headerTpl; context: headerContext(col)\" />\r\n              } @else {\r\n                <span class=\"gog-table__th-inner\">\r\n                  {{ col.header() || col.field() }}\r\n                  @if (col.sortable() && !loading()) {\r\n                    <span class=\"gog-table__sort-icon\" aria-hidden=\"true\">\r\n                      @if (getSortDirection(col.field()) === 'asc') {\r\n                        <gog-icon name=\"sort-up\" />\r\n                      } @else if (getSortDirection(col.field()) === 'desc') {\r\n                        <gog-icon name=\"sort-down\" />\r\n                      } @else {\r\n                        <gog-icon name=\"sort\" />\r\n                      }\r\n                    </span>\r\n                  }\r\n                </span>\r\n              }\r\n            </th>\r\n          }\r\n        </tr>\r\n      </thead>\r\n      <tbody>\r\n        @if (loading()) {\r\n          <tr>\r\n            <td class=\"gog-table__loading-cell\" [attr.colspan]=\"emptyColspan()\">\r\n              <gog-spinner size=\"md\" />\r\n            </td>\r\n          </tr>\r\n        } @else if (visibleRows().length === 0) {\r\n          <tr>\r\n            <td class=\"gog-table__empty\" [attr.colspan]=\"emptyColspan()\">\u2014</td>\r\n          </tr>\r\n        } @else {\r\n          @for (row of visibleRows(); track rowKey(row); let i = $index) {\r\n            <tr\r\n              class=\"gog-table__row\"\r\n              [class.gog-table__row--interactive]=\"interactiveRows()\"\r\n              [class.gog-table__row--selected]=\"isSelected(row)\"\r\n              [attr.tabindex]=\"interactiveRows() ? 0 : null\"\r\n              [attr.aria-selected]=\"hasSelection() ? isSelected(row) : null\"\r\n              (click)=\"emitRowClick(row, i, $event)\"\r\n              (keydown)=\"onRowKeydown(row, i, $event)\"\r\n            >\r\n              @if (hasSelectionColumn()) {\r\n                <td class=\"gog-table__td gog-table__td--select\">\r\n                  <!--\r\n                    `$event.stopPropagation()` so ticking the box does not also count as a row\r\n                    click: with `interactiveRows` those are two different intents, and firing both\r\n                    from one gesture is how a \"select\" ends up navigating away.\r\n                  -->\r\n                  <gog-checkbox\r\n                    [checked]=\"isSelected(row)\"\r\n                    [ariaLabel]=\"resolvedLabels().selectRow\"\r\n                    (click)=\"$event.stopPropagation()\"\r\n                    (checkedChange)=\"toggleRowSelection(row, $event)\"\r\n                  />\r\n                </td>\r\n              }\r\n              @if (showRowNumbers()) {\r\n                <td class=\"gog-table__td gog-table__td--num\">{{ globalRowIndex(i) }}</td>\r\n              }\r\n              @for (col of columns(); track col.field()) {\r\n                <td class=\"gog-table__td\">\r\n                  @if (getBodyTemplate(col); as bodyTpl) {\r\n                    <ng-container *ngTemplateOutlet=\"bodyTpl; context: bodyContext(row, col, i)\" />\r\n                  } @else {\r\n                    {{ formatCellValue(row, col.field()) }}\r\n                  }\r\n                </td>\r\n              }\r\n            </tr>\r\n          }\r\n        }\r\n      </tbody>\r\n    </table>\r\n  </gog-scroll>\r\n\r\n  @if (hasPagination() || showTotal()) {\r\n    <div class=\"gog-table__footer\">\r\n      @if (showTotal()) {\r\n        <span class=\"gog-table__total\" [style.grid-area]=\"totalGridArea()\">\r\n          {{ resolvedLabels().total }}: {{ rowCount() }}\r\n        </span>\r\n      }\r\n\r\n      @if (hasPagination()) {\r\n        <!--\r\n          `[(pageSize)]` straight through to the table's own model: the rows-per-page select\r\n          writes back here, and a consumer binding `[(pageSize)]` on the table sees it. No\r\n          intermediate signal, in either direction.\r\n        -->\r\n        <gog-paginator\r\n          class=\"gog-table__pagination\"\r\n          [style.grid-area]=\"paginatorGridArea()\"\r\n          [(page)]=\"currentPage\"\r\n          [(pageSize)]=\"pageSize\"\r\n          [totalPages]=\"totalPages()\"\r\n          [showPageSizeSelect]=\"showPageSizeSelect()\"\r\n          [pageSizeOptions]=\"pageSizeOptions()\"\r\n          rangeMode=\"ellipsis\"\r\n          size=\"sm\"\r\n          [ariaLabel]=\"resolvedLabels().pagination\"\r\n        />\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-table-wrapper{display:flex;flex-direction:column;gap:var(--gog-table-gap);width:100%;overflow-anchor:none}.gog-table-scroll{width:100%}.gog-table{width:100%;border-collapse:collapse;border:var(--gog-table-border-width) var(--gog-table-border-style) var(--gog-table-border-color);background-color:var(--gog-table-surface);color:var(--gog-table-text-color);font-family:var(--gog-table-font-family);table-layout:fixed}.gog-table--auto-layout{table-layout:auto}.gog-table--slg{--gog-table-size-th-padding-v: var(--gog-table-slg-padding-v);--gog-table-size-td-padding-v: var(--gog-table-slg-padding-v);--gog-table-size-th-font-size: var(--gog-table-slg-th-font-size);--gog-table-size-td-font-size: var(--gog-table-slg-td-font-size)}.gog-table--md{--gog-table-size-th-padding-v: var(--gog-table-md-padding-v);--gog-table-size-td-padding-v: var(--gog-table-md-padding-v);--gog-table-size-th-font-size: var(--gog-table-md-th-font-size);--gog-table-size-td-font-size: var(--gog-table-md-td-font-size)}.gog-table--sm{--gog-table-size-th-padding-v: var(--gog-table-sm-padding-v);--gog-table-size-td-padding-v: var(--gog-table-sm-padding-v);--gog-table-size-th-font-size: var(--gog-table-sm-th-font-size);--gog-table-size-td-font-size: var(--gog-table-sm-td-font-size)}.gog-table--xsm{--gog-table-size-th-padding-v: var(--gog-table-xsm-padding-v);--gog-table-size-td-padding-v: var(--gog-table-xsm-padding-v);--gog-table-size-th-font-size: var(--gog-table-xsm-th-font-size);--gog-table-size-td-font-size: var(--gog-table-xsm-td-font-size)}.gog-table__col--num{width:var(--gog-table-num-col-width)}.gog-table__th{padding:var(--gog-table-th-padding-v, var(--gog-table-size-th-padding-v, var(--gog-table-lg-padding-v))) var(--gog-table-padding-h);text-align:start;font-family:var(--gog-table-header-font-family);font-size:var(--gog-table-th-font-size, var(--gog-table-size-th-font-size, var(--gog-table-lg-th-font-size)));text-transform:var(--gog-table-header-text-transform);letter-spacing:var(--gog-table-header-letter-spacing);color:var(--gog-table-accent-color);background-color:var(--gog-table-surface);border-bottom:var(--gog-table-border-width) var(--gog-table-border-style) var(--gog-table-border-color);white-space:normal;overflow:hidden}.gog-table--sticky-header .gog-table__th{position:sticky;top:0;z-index:1}.gog-table__th--num{width:var(--gog-table-num-col-width);text-align:center;color:var(--gog-table-muted-color)}.gog-table__th--select,.gog-table__td--select{width:var(--gog-table-select-col-width);text-align:center}.gog-table__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.gog-table__th--sortable:focus-visible{outline:var(--gog-table-focus-ring-width) solid var(--gog-table-focus-ring);outline-offset:calc(var(--gog-table-focus-ring-width) * -1)}.gog-table__th--sortable:hover,.gog-table__th--sorted{color:var(--gog-table-accent-bright)}.gog-table__th-inner{display:inline-flex;align-items:center;gap:var(--gog-table-th-inner-gap);width:100%}.gog-table__sort-icon{display:inline-block;width:var(--gog-table-sort-icon-width);text-align:center;font-size:var(--gog-table-sort-icon-size);opacity:var(--gog-table-sort-icon-opacity);flex-shrink:0}.gog-table__th--sorted .gog-table__sort-icon{opacity:1}.gog-table__td{padding:var(--gog-table-td-padding-v, var(--gog-table-size-td-padding-v, var(--gog-table-lg-padding-v))) var(--gog-table-padding-h);font-size:var(--gog-table-td-font-size, var(--gog-table-size-td-font-size, var(--gog-table-lg-td-font-size)));border-bottom:var(--gog-table-row-border-width) var(--gog-table-border-style) var(--gog-table-border-color);vertical-align:middle;overflow-wrap:break-word;word-break:break-word;overflow:hidden}.gog-table__td--num{text-align:center;color:var(--gog-table-muted-color);font-size:var(--gog-table-num-font-size);font-family:var(--gog-table-numeric-font-family);width:var(--gog-table-num-col-width)}.gog-table__row:last-child .gog-table__td{border-bottom:none}.gog-table__row{transition:background-color var(--gog-table-row-transition-duration) var(--gog-easing)}.gog-table__row--interactive{cursor:pointer}.gog-table__row--interactive:focus-visible{outline:var(--gog-table-focus-ring-width) solid var(--gog-table-focus-ring);outline-offset:calc(var(--gog-table-focus-ring-width) * -1)}.gog-table__row:hover{background-color:var(--gog-table-hover-bg)}.gog-table__row--selected,.gog-table__row--selected:hover{background-color:var(--gog-table-selected-bg)}.gog-table__empty{padding:var(--gog-table-empty-padding);text-align:center;color:var(--gog-table-muted-color);font-size:var(--gog-table-empty-font-size)}.gog-table--loading thead{opacity:var(--gog-table-loading-opacity);pointer-events:none}.gog-table__loading-cell{padding:var(--gog-table-loading-padding);text-align:center}.gog-table--col-borders .gog-table__th:not(:last-child),.gog-table--col-borders .gog-table__td:not(:last-child){border-inline-end:var(--gog-table-row-border-width) var(--gog-table-border-style) var(--gog-table-border-color)}.gog-table__footer{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:\"left center right\";align-items:center;min-height:var(--gog-table-footer-min-height);gap:var(--gog-table-footer-gap)}.gog-table__total{font-size:var(--gog-table-total-font-size);color:var(--gog-table-muted-color);font-family:var(--gog-table-numeric-font-family);text-transform:var(--gog-table-total-text-transform);letter-spacing:var(--gog-table-total-letter-spacing)}.gog-table__total[style*=\"grid-area: right\"]{text-align:end}.gog-table__pagination[style*=\"grid-area: left\"]{justify-content:flex-start}.gog-table__pagination[style*=\"grid-area: center\"]{justify-content:center}.gog-table__pagination[style*=\"grid-area: right\"]{justify-content:flex-end}@media(prefers-reduced-motion:reduce){.gog-table__row{transition:none}}\n"], dependencies: [{ kind: "component", type: SpinnerComponent, selector: "gog-spinner", inputs: ["size", "overlay", "ariaLabel", "variant"] }, { kind: "component", type: PaginatorComponent, selector: "gog-paginator", inputs: ["page", "fullWidth", "totalPages", "totalRecords", "pageSize", "showPageSizeSelect", "pageSizeOptions", "rangeMode", "visiblePages", "showFirstPage", "showLastPage", "siblingCount", "size", "disabled", "ariaLabel"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }, { kind: "component", type: ScrollComponent, selector: "gog-scroll", inputs: ["axis", "size", "autoHide", "hideDelay", "reachThreshold", "focusable", "ariaLabel", "overscrollBehavior", "showTrack"], outputs: ["gogScroll", "gogReachStart", "gogReachEnd"] }, { kind: "component", type: CheckboxComponent, selector: "gog-checkbox", inputs: ["label", "ariaLabel", "size", "indeterminate", "disabled", "fullWidth", "checked"], outputs: ["checkedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: TableComponent, isStandalone: true, selector: "gog-table", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, showPageSizeSelect: { classPropertyName: "showPageSizeSelect", publicName: "showPageSizeSelect", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: false, transformFunction: null }, interactiveRows: { classPropertyName: "interactiveRows", publicName: "interactiveRows", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, showSelectionColumn: { classPropertyName: "showSelectionColumn", publicName: "showSelectionColumn", isSignal: true, isRequired: false, transformFunction: null }, showRowNumbers: { classPropertyName: "showRowNumbers", publicName: "showRowNumbers", isSignal: true, isRequired: false, transformFunction: null }, showTotal: { classPropertyName: "showTotal", publicName: "showTotal", isSignal: true, isRequired: false, transformFunction: null }, emptyPlaceholder: { classPropertyName: "emptyPlaceholder", publicName: "emptyPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, paginatorPosition: { classPropertyName: "paginatorPosition", publicName: "paginatorPosition", isSignal: true, isRequired: false, transformFunction: null }, totalPosition: { classPropertyName: "totalPosition", publicName: "totalPosition", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, showColumnBorders: { classPropertyName: "showColumnBorders", publicName: "showColumnBorders", isSignal: true, isRequired: false, transformFunction: null }, stickyHeader: { classPropertyName: "stickyHeader", publicName: "stickyHeader", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageSize: "pageSizeChange", selection: "selectionChange", gogSortChange: "gogSortChange", gogPageChange: "gogPageChange", gogRowClick: "gogRowClick" }, host: { properties: { "style.display": "\"block\"", "style.width": "fullWidth() ? \"100%\" : \"fit-content\"", "attr.aria-busy": "loading() ? \"true\" : null" }, classAttribute: "gog-table-host" }, queries: [{ propertyName: "columns", predicate: GogColumn, isSignal: true }], ngImport: i0, template: "<div class=\"gog-table-wrapper gog-contained-layout\">\r\n  <!--\r\n    The vertical axis is enabled only when the table has been capped. Left on for an uncapped\r\n    table, `gog-scroll` would make this viewport a scroll container on both axes, which puts it\r\n    in the sticky chain of everything inside it and takes the consumer's own scrolling region\r\n    out of it \u2014 measured: a header that used to pin to that region rode away by 147px.\r\n  -->\r\n  <gog-scroll\r\n    [axis]=\"maxHeight() ? 'both' : 'horizontal'\"\r\n    [style.max-height]=\"maxHeight()\"\r\n    class=\"gog-table-scroll\"\r\n  >\r\n    <table\r\n      class=\"gog-table\"\r\n      [class]=\"sizeClass()\"\r\n      [class.gog-table--col-borders]=\"showColumnBorders()\"\r\n      [class.gog-table--loading]=\"loading()\"\r\n      [class.gog-table--sticky-header]=\"stickyHeader()\"\r\n      [class.gog-table--auto-layout]=\"!fullWidth()\"\r\n      [style.width]=\"fullWidth() ? '100%' : 'fit-content'\"\r\n    >\r\n      <colgroup>\r\n        @if (hasSelectionColumn()) {\r\n          <col class=\"gog-table__col--select\" />\r\n        }\r\n        @if (showRowNumbers()) {\r\n          <col class=\"gog-table__col--num\" />\r\n        }\r\n        @for (col of columns(); track col.field()) {\r\n          <col\r\n            [style.width]=\"col.width() || null\"\r\n            [style.min-width]=\"col.minWidth() || null\"\r\n            [style.max-width]=\"col.maxWidth() || null\"\r\n          />\r\n        }\r\n      </colgroup>\r\n      <thead>\r\n        <tr>\r\n          @if (hasSelectionColumn()) {\r\n            <th class=\"gog-table__th gog-table__th--select\" scope=\"col\">\r\n              <!--\r\n                Only `multiple` gets a select-all: in `single` mode there is nothing to select\r\n                all of, and a checkbox that can only ever check one row is a lie.\r\n              -->\r\n              @if (selectionMode() === 'multiple') {\r\n                <gog-checkbox\r\n                  [checked]=\"allPageRowsSelected()\"\r\n                  [indeterminate]=\"somePageRowsSelected()\"\r\n                  [disabled]=\"loading() || visibleRows().length === 0\"\r\n                  [ariaLabel]=\"resolvedLabels().selectAllRows\"\r\n                  (checkedChange)=\"toggleAllOnPage($event)\"\r\n                />\r\n              }\r\n            </th>\r\n          }\r\n          @if (showRowNumbers()) {\r\n            <th class=\"gog-table__th gog-table__th--num\" scope=\"col\">#</th>\r\n          }\r\n          @for (col of columns(); track col.field()) {\r\n            <th\r\n              class=\"gog-table__th\"\r\n              scope=\"col\"\r\n              [class.gog-table__th--sortable]=\"col.sortable() && !loading()\"\r\n              [class.gog-table__th--sorted]=\"getSortDirection(col.field())\"\r\n              [attr.aria-sort]=\"getAriaSort(col.field())\"\r\n              [attr.tabindex]=\"col.sortable() && !loading() ? 0 : null\"\r\n              (click)=\"handleSortClick(col)\"\r\n              (keydown.enter)=\"handleSortClick(col)\"\r\n              (keydown.space)=\"handleSortClick(col); $event.preventDefault()\"\r\n            >\r\n              @if (getHeaderTemplate(col); as headerTpl) {\r\n                <ng-container *ngTemplateOutlet=\"headerTpl; context: headerContext(col)\" />\r\n              } @else {\r\n                <span class=\"gog-table__th-inner\">\r\n                  {{ col.header() || col.field() }}\r\n                  @if (col.sortable() && !loading()) {\r\n                    <span class=\"gog-table__sort-icon\" aria-hidden=\"true\">\r\n                      @if (getSortDirection(col.field()) === 'asc') {\r\n                        <gog-icon name=\"sort-up\" />\r\n                      } @else if (getSortDirection(col.field()) === 'desc') {\r\n                        <gog-icon name=\"sort-down\" />\r\n                      } @else {\r\n                        <gog-icon name=\"sort\" />\r\n                      }\r\n                    </span>\r\n                  }\r\n                </span>\r\n              }\r\n            </th>\r\n          }\r\n        </tr>\r\n      </thead>\r\n      <tbody>\r\n        @if (loading()) {\r\n          <tr>\r\n            <td class=\"gog-table__loading-cell\" [attr.colspan]=\"emptyColspan()\">\r\n              <gog-spinner size=\"md\" />\r\n            </td>\r\n          </tr>\r\n        } @else if (visibleRows().length === 0) {\r\n          <tr>\r\n            <td class=\"gog-table__empty\" [attr.colspan]=\"emptyColspan()\">\u2014</td>\r\n          </tr>\r\n        } @else {\r\n          @for (row of visibleRows(); track rowKey(row); let i = $index) {\r\n            <tr\r\n              class=\"gog-table__row\"\r\n              [class.gog-table__row--interactive]=\"interactiveRows()\"\r\n              [class.gog-table__row--selected]=\"isSelected(row)\"\r\n              [attr.tabindex]=\"interactiveRows() ? 0 : null\"\r\n              [attr.aria-selected]=\"hasSelection() ? isSelected(row) : null\"\r\n              (click)=\"emitRowClick(row, i, $event)\"\r\n              (keydown)=\"onRowKeydown(row, i, $event)\"\r\n            >\r\n              @if (hasSelectionColumn()) {\r\n                <td class=\"gog-table__td gog-table__td--select\">\r\n                  <!--\r\n                    `$event.stopPropagation()` so ticking the box does not also count as a row\r\n                    click: with `interactiveRows` those are two different intents, and firing both\r\n                    from one gesture is how a \"select\" ends up navigating away.\r\n                  -->\r\n                  <gog-checkbox\r\n                    [checked]=\"isSelected(row)\"\r\n                    [ariaLabel]=\"resolvedLabels().selectRow\"\r\n                    (click)=\"$event.stopPropagation()\"\r\n                    (checkedChange)=\"toggleRowSelection(row, $event)\"\r\n                  />\r\n                </td>\r\n              }\r\n              @if (showRowNumbers()) {\r\n                <td class=\"gog-table__td gog-table__td--num\">{{ globalRowIndex(i) }}</td>\r\n              }\r\n              @for (col of columns(); track col.field()) {\r\n                <td class=\"gog-table__td\">\r\n                  @if (getBodyTemplate(col); as bodyTpl) {\r\n                    <ng-container *ngTemplateOutlet=\"bodyTpl; context: bodyContext(row, col, i)\" />\r\n                  } @else {\r\n                    {{ formatCellValue(row, col.field()) }}\r\n                  }\r\n                </td>\r\n              }\r\n            </tr>\r\n          }\r\n        }\r\n      </tbody>\r\n    </table>\r\n  </gog-scroll>\r\n\r\n  @if (hasPagination() || showTotal()) {\r\n    <div class=\"gog-table__footer\">\r\n      @if (showTotal()) {\r\n        <span class=\"gog-table__total\" [style.grid-area]=\"totalGridArea()\">\r\n          {{ resolvedLabels().total }}: {{ rowCount() }}\r\n        </span>\r\n      }\r\n\r\n      @if (hasPagination()) {\r\n        <!--\r\n          `[(pageSize)]` straight through to the table's own model: the rows-per-page select\r\n          writes back here, and a consumer binding `[(pageSize)]` on the table sees it. No\r\n          intermediate signal, in either direction.\r\n        -->\r\n        <gog-paginator\r\n          class=\"gog-table__pagination\"\r\n          [style.grid-area]=\"paginatorGridArea()\"\r\n          [(page)]=\"currentPage\"\r\n          [(pageSize)]=\"pageSize\"\r\n          [totalPages]=\"totalPages()\"\r\n          [showPageSizeSelect]=\"showPageSizeSelect()\"\r\n          [pageSizeOptions]=\"pageSizeOptions()\"\r\n          rangeMode=\"ellipsis\"\r\n          size=\"sm\"\r\n          [ariaLabel]=\"resolvedLabels().pagination\"\r\n        />\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-table-wrapper{display:flex;flex-direction:column;gap:var(--gog-table-gap);width:100%;overflow-anchor:none}.gog-table-scroll{width:100%}.gog-table{width:100%;border-collapse:collapse;border:var(--gog-table-border-width) var(--gog-table-border-style) var(--gog-table-border-color);background-color:var(--gog-table-surface);color:var(--gog-table-text-color);font-family:var(--gog-table-font-family);table-layout:fixed}.gog-table--auto-layout{table-layout:auto}.gog-table--slg{--gog-table-size-th-padding-v: var(--gog-table-slg-padding-v);--gog-table-size-td-padding-v: var(--gog-table-slg-padding-v);--gog-table-size-th-font-size: var(--gog-table-slg-th-font-size);--gog-table-size-td-font-size: var(--gog-table-slg-td-font-size)}.gog-table--md{--gog-table-size-th-padding-v: var(--gog-table-md-padding-v);--gog-table-size-td-padding-v: var(--gog-table-md-padding-v);--gog-table-size-th-font-size: var(--gog-table-md-th-font-size);--gog-table-size-td-font-size: var(--gog-table-md-td-font-size)}.gog-table--sm{--gog-table-size-th-padding-v: var(--gog-table-sm-padding-v);--gog-table-size-td-padding-v: var(--gog-table-sm-padding-v);--gog-table-size-th-font-size: var(--gog-table-sm-th-font-size);--gog-table-size-td-font-size: var(--gog-table-sm-td-font-size)}.gog-table--xsm{--gog-table-size-th-padding-v: var(--gog-table-xsm-padding-v);--gog-table-size-td-padding-v: var(--gog-table-xsm-padding-v);--gog-table-size-th-font-size: var(--gog-table-xsm-th-font-size);--gog-table-size-td-font-size: var(--gog-table-xsm-td-font-size)}.gog-table__col--num{width:var(--gog-table-num-col-width)}.gog-table__th{padding:var(--gog-table-th-padding-v, var(--gog-table-size-th-padding-v, var(--gog-table-lg-padding-v))) var(--gog-table-padding-h);text-align:start;font-family:var(--gog-table-header-font-family);font-size:var(--gog-table-th-font-size, var(--gog-table-size-th-font-size, var(--gog-table-lg-th-font-size)));text-transform:var(--gog-table-header-text-transform);letter-spacing:var(--gog-table-header-letter-spacing);color:var(--gog-table-accent-color);background-color:var(--gog-table-header-bg);border-bottom:var(--gog-table-border-width) var(--gog-table-border-style) var(--gog-table-border-color);white-space:normal;overflow:hidden}.gog-table--sticky-header .gog-table__th{position:sticky;top:0;z-index:1}.gog-table__th--num{width:var(--gog-table-num-col-width);text-align:center;color:var(--gog-table-muted-color)}.gog-table__th--select,.gog-table__td--select{width:var(--gog-table-select-col-width);text-align:center}.gog-table__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.gog-table__th--sortable:focus-visible{outline:var(--gog-table-focus-ring-width) solid var(--gog-table-focus-ring);outline-offset:calc(var(--gog-table-focus-ring-width) * -1)}.gog-table__th--sortable:hover,.gog-table__th--sorted{color:var(--gog-table-accent-bright)}.gog-table__th-inner{display:inline-flex;align-items:center;gap:var(--gog-table-th-inner-gap);width:100%}.gog-table__sort-icon{display:inline-block;width:var(--gog-table-sort-icon-width);text-align:center;font-size:var(--gog-table-sort-icon-size);opacity:var(--gog-table-sort-icon-opacity);flex-shrink:0}.gog-table__th--sorted .gog-table__sort-icon{opacity:1}.gog-table__td{padding:var(--gog-table-td-padding-v, var(--gog-table-size-td-padding-v, var(--gog-table-lg-padding-v))) var(--gog-table-padding-h);font-size:var(--gog-table-td-font-size, var(--gog-table-size-td-font-size, var(--gog-table-lg-td-font-size)));border-bottom:var(--gog-table-row-border-width) var(--gog-table-border-style) var(--gog-table-border-color);vertical-align:middle;overflow-wrap:break-word;word-break:break-word;overflow:hidden}.gog-table__td--num{text-align:center;color:var(--gog-table-muted-color);font-size:var(--gog-table-num-font-size);font-family:var(--gog-table-numeric-font-family);width:var(--gog-table-num-col-width)}.gog-table__row:last-child .gog-table__td{border-bottom:none}.gog-table__row{transition:background-color var(--gog-table-row-transition-duration) var(--gog-easing)}.gog-table__row--interactive{cursor:pointer}.gog-table__row--interactive:focus-visible{outline:var(--gog-table-focus-ring-width) solid var(--gog-table-focus-ring);outline-offset:calc(var(--gog-table-focus-ring-width) * -1)}.gog-table__row:hover{background-color:var(--gog-table-hover-bg)}.gog-table__row--selected,.gog-table__row--selected:hover{background-color:var(--gog-table-selected-bg)}.gog-table__empty{padding:var(--gog-table-empty-padding);text-align:center;color:var(--gog-table-muted-color);font-size:var(--gog-table-empty-font-size)}.gog-table--loading thead{opacity:var(--gog-table-loading-opacity);pointer-events:none}.gog-table__loading-cell{padding:var(--gog-table-loading-padding);text-align:center}.gog-table--col-borders .gog-table__th:not(:last-child),.gog-table--col-borders .gog-table__td:not(:last-child){border-inline-end:var(--gog-table-row-border-width) var(--gog-table-border-style) var(--gog-table-border-color)}.gog-table__footer{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:\"left center right\";align-items:center;min-height:var(--gog-table-footer-min-height);gap:var(--gog-table-footer-gap)}.gog-table__total{font-size:var(--gog-table-total-font-size);color:var(--gog-table-muted-color);font-family:var(--gog-table-numeric-font-family);text-transform:var(--gog-table-total-text-transform);letter-spacing:var(--gog-table-total-letter-spacing)}.gog-table__total[style*=\"grid-area: right\"]{text-align:end}.gog-table__pagination[style*=\"grid-area: left\"]{justify-content:flex-start}.gog-table__pagination[style*=\"grid-area: center\"]{justify-content:center}.gog-table__pagination[style*=\"grid-area: right\"]{justify-content:flex-end}@media(prefers-reduced-motion:reduce){.gog-table__row{transition:none}}\n"], dependencies: [{ kind: "component", type: SpinnerComponent, selector: "gog-spinner", inputs: ["size", "overlay", "ariaLabel", "variant"] }, { kind: "component", type: PaginatorComponent, selector: "gog-paginator", inputs: ["page", "fullWidth", "totalPages", "totalRecords", "pageSize", "showPageSizeSelect", "pageSizeOptions", "rangeMode", "visiblePages", "showFirstPage", "showLastPage", "siblingCount", "size", "disabled", "ariaLabel"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "gog-icon", inputs: ["name", "template", "title", "ariaHidden"] }, { kind: "component", type: ScrollComponent, selector: "gog-scroll", inputs: ["axis", "size", "autoHide", "hideDelay", "reachThreshold", "focusable", "ariaLabel", "overscrollBehavior", "showTrack"], outputs: ["gogScroll", "gogReachStart", "gogReachEnd"] }, { kind: "component", type: CheckboxComponent, selector: "gog-checkbox", inputs: ["label", "ariaLabel", "size", "indeterminate", "disabled", "fullWidth", "checked"], outputs: ["checkedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
@@ -8955,7 +8955,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
                          * of every `loading` input; see the loading-state rule in `api-design.instructions.md`.
                          */
                         '[attr.aria-busy]': 'loading() ? "true" : null',
-                    }, template: "<div class=\"gog-table-wrapper gog-contained-layout\">\r\n  <!--\r\n    The vertical axis is enabled only when the table has been capped. Left on for an uncapped\r\n    table, `gog-scroll` would make this viewport a scroll container on both axes, which puts it\r\n    in the sticky chain of everything inside it and takes the consumer's own scrolling region\r\n    out of it \u2014 measured: a header that used to pin to that region rode away by 147px.\r\n  -->\r\n  <gog-scroll\r\n    [axis]=\"maxHeight() ? 'both' : 'horizontal'\"\r\n    [style.max-height]=\"maxHeight()\"\r\n    class=\"gog-table-scroll\"\r\n  >\r\n    <table\r\n      class=\"gog-table\"\r\n      [class]=\"sizeClass()\"\r\n      [class.gog-table--col-borders]=\"showColumnBorders()\"\r\n      [class.gog-table--loading]=\"loading()\"\r\n      [class.gog-table--sticky-header]=\"stickyHeader()\"\r\n      [class.gog-table--auto-layout]=\"!fullWidth()\"\r\n      [style.width]=\"fullWidth() ? '100%' : 'fit-content'\"\r\n    >\r\n      <colgroup>\r\n        @if (hasSelectionColumn()) {\r\n          <col class=\"gog-table__col--select\" />\r\n        }\r\n        @if (showRowNumbers()) {\r\n          <col class=\"gog-table__col--num\" />\r\n        }\r\n        @for (col of columns(); track col.field()) {\r\n          <col\r\n            [style.width]=\"col.width() || null\"\r\n            [style.min-width]=\"col.minWidth() || null\"\r\n            [style.max-width]=\"col.maxWidth() || null\"\r\n          />\r\n        }\r\n      </colgroup>\r\n      <thead>\r\n        <tr>\r\n          @if (hasSelectionColumn()) {\r\n            <th class=\"gog-table__th gog-table__th--select\" scope=\"col\">\r\n              <!--\r\n                Only `multiple` gets a select-all: in `single` mode there is nothing to select\r\n                all of, and a checkbox that can only ever check one row is a lie.\r\n              -->\r\n              @if (selectionMode() === 'multiple') {\r\n                <gog-checkbox\r\n                  [checked]=\"allPageRowsSelected()\"\r\n                  [indeterminate]=\"somePageRowsSelected()\"\r\n                  [disabled]=\"loading() || visibleRows().length === 0\"\r\n                  [ariaLabel]=\"resolvedLabels().selectAllRows\"\r\n                  (checkedChange)=\"toggleAllOnPage($event)\"\r\n                />\r\n              }\r\n            </th>\r\n          }\r\n          @if (showRowNumbers()) {\r\n            <th class=\"gog-table__th gog-table__th--num\" scope=\"col\">#</th>\r\n          }\r\n          @for (col of columns(); track col.field()) {\r\n            <th\r\n              class=\"gog-table__th\"\r\n              scope=\"col\"\r\n              [class.gog-table__th--sortable]=\"col.sortable() && !loading()\"\r\n              [class.gog-table__th--sorted]=\"getSortDirection(col.field())\"\r\n              [attr.aria-sort]=\"getAriaSort(col.field())\"\r\n              [attr.tabindex]=\"col.sortable() && !loading() ? 0 : null\"\r\n              (click)=\"handleSortClick(col)\"\r\n              (keydown.enter)=\"handleSortClick(col)\"\r\n              (keydown.space)=\"handleSortClick(col); $event.preventDefault()\"\r\n            >\r\n              @if (getHeaderTemplate(col); as headerTpl) {\r\n                <ng-container *ngTemplateOutlet=\"headerTpl; context: headerContext(col)\" />\r\n              } @else {\r\n                <span class=\"gog-table__th-inner\">\r\n                  {{ col.header() || col.field() }}\r\n                  @if (col.sortable() && !loading()) {\r\n                    <span class=\"gog-table__sort-icon\" aria-hidden=\"true\">\r\n                      @if (getSortDirection(col.field()) === 'asc') {\r\n                        <gog-icon name=\"sort-up\" />\r\n                      } @else if (getSortDirection(col.field()) === 'desc') {\r\n                        <gog-icon name=\"sort-down\" />\r\n                      } @else {\r\n                        <gog-icon name=\"sort\" />\r\n                      }\r\n                    </span>\r\n                  }\r\n                </span>\r\n              }\r\n            </th>\r\n          }\r\n        </tr>\r\n      </thead>\r\n      <tbody>\r\n        @if (loading()) {\r\n          <tr>\r\n            <td class=\"gog-table__loading-cell\" [attr.colspan]=\"emptyColspan()\">\r\n              <gog-spinner size=\"md\" />\r\n            </td>\r\n          </tr>\r\n        } @else if (visibleRows().length === 0) {\r\n          <tr>\r\n            <td class=\"gog-table__empty\" [attr.colspan]=\"emptyColspan()\">\u2014</td>\r\n          </tr>\r\n        } @else {\r\n          @for (row of visibleRows(); track rowKey(row); let i = $index) {\r\n            <tr\r\n              class=\"gog-table__row\"\r\n              [class.gog-table__row--interactive]=\"interactiveRows()\"\r\n              [class.gog-table__row--selected]=\"isSelected(row)\"\r\n              [attr.tabindex]=\"interactiveRows() ? 0 : null\"\r\n              [attr.aria-selected]=\"hasSelection() ? isSelected(row) : null\"\r\n              (click)=\"emitRowClick(row, i, $event)\"\r\n              (keydown)=\"onRowKeydown(row, i, $event)\"\r\n            >\r\n              @if (hasSelectionColumn()) {\r\n                <td class=\"gog-table__td gog-table__td--select\">\r\n                  <!--\r\n                    `$event.stopPropagation()` so ticking the box does not also count as a row\r\n                    click: with `interactiveRows` those are two different intents, and firing both\r\n                    from one gesture is how a \"select\" ends up navigating away.\r\n                  -->\r\n                  <gog-checkbox\r\n                    [checked]=\"isSelected(row)\"\r\n                    [ariaLabel]=\"resolvedLabels().selectRow\"\r\n                    (click)=\"$event.stopPropagation()\"\r\n                    (checkedChange)=\"toggleRowSelection(row, $event)\"\r\n                  />\r\n                </td>\r\n              }\r\n              @if (showRowNumbers()) {\r\n                <td class=\"gog-table__td gog-table__td--num\">{{ globalRowIndex(i) }}</td>\r\n              }\r\n              @for (col of columns(); track col.field()) {\r\n                <td class=\"gog-table__td\">\r\n                  @if (getBodyTemplate(col); as bodyTpl) {\r\n                    <ng-container *ngTemplateOutlet=\"bodyTpl; context: bodyContext(row, col, i)\" />\r\n                  } @else {\r\n                    {{ formatCellValue(row, col.field()) }}\r\n                  }\r\n                </td>\r\n              }\r\n            </tr>\r\n          }\r\n        }\r\n      </tbody>\r\n    </table>\r\n  </gog-scroll>\r\n\r\n  @if (hasPagination() || showTotal()) {\r\n    <div class=\"gog-table__footer\">\r\n      @if (showTotal()) {\r\n        <span class=\"gog-table__total\" [style.grid-area]=\"totalGridArea()\">\r\n          {{ resolvedLabels().total }}: {{ rowCount() }}\r\n        </span>\r\n      }\r\n\r\n      @if (hasPagination()) {\r\n        <!--\r\n          `[(pageSize)]` straight through to the table's own model: the rows-per-page select\r\n          writes back here, and a consumer binding `[(pageSize)]` on the table sees it. No\r\n          intermediate signal, in either direction.\r\n        -->\r\n        <gog-paginator\r\n          class=\"gog-table__pagination\"\r\n          [style.grid-area]=\"paginatorGridArea()\"\r\n          [(page)]=\"currentPage\"\r\n          [(pageSize)]=\"pageSize\"\r\n          [totalPages]=\"totalPages()\"\r\n          [showPageSizeSelect]=\"showPageSizeSelect()\"\r\n          [pageSizeOptions]=\"pageSizeOptions()\"\r\n          rangeMode=\"ellipsis\"\r\n          size=\"sm\"\r\n          [ariaLabel]=\"resolvedLabels().pagination\"\r\n        />\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-table-wrapper{display:flex;flex-direction:column;gap:var(--gog-table-gap);width:100%;overflow-anchor:none}.gog-table-scroll{width:100%}.gog-table{width:100%;border-collapse:collapse;border:var(--gog-table-border-width) var(--gog-table-border-style) var(--gog-table-border-color);background-color:var(--gog-table-surface);color:var(--gog-table-text-color);font-family:var(--gog-table-font-family);table-layout:fixed}.gog-table--auto-layout{table-layout:auto}.gog-table--slg{--gog-table-size-th-padding-v: var(--gog-table-slg-padding-v);--gog-table-size-td-padding-v: var(--gog-table-slg-padding-v);--gog-table-size-th-font-size: var(--gog-table-slg-th-font-size);--gog-table-size-td-font-size: var(--gog-table-slg-td-font-size)}.gog-table--md{--gog-table-size-th-padding-v: var(--gog-table-md-padding-v);--gog-table-size-td-padding-v: var(--gog-table-md-padding-v);--gog-table-size-th-font-size: var(--gog-table-md-th-font-size);--gog-table-size-td-font-size: var(--gog-table-md-td-font-size)}.gog-table--sm{--gog-table-size-th-padding-v: var(--gog-table-sm-padding-v);--gog-table-size-td-padding-v: var(--gog-table-sm-padding-v);--gog-table-size-th-font-size: var(--gog-table-sm-th-font-size);--gog-table-size-td-font-size: var(--gog-table-sm-td-font-size)}.gog-table--xsm{--gog-table-size-th-padding-v: var(--gog-table-xsm-padding-v);--gog-table-size-td-padding-v: var(--gog-table-xsm-padding-v);--gog-table-size-th-font-size: var(--gog-table-xsm-th-font-size);--gog-table-size-td-font-size: var(--gog-table-xsm-td-font-size)}.gog-table__col--num{width:var(--gog-table-num-col-width)}.gog-table__th{padding:var(--gog-table-th-padding-v, var(--gog-table-size-th-padding-v, var(--gog-table-lg-padding-v))) var(--gog-table-padding-h);text-align:start;font-family:var(--gog-table-header-font-family);font-size:var(--gog-table-th-font-size, var(--gog-table-size-th-font-size, var(--gog-table-lg-th-font-size)));text-transform:var(--gog-table-header-text-transform);letter-spacing:var(--gog-table-header-letter-spacing);color:var(--gog-table-accent-color);background-color:var(--gog-table-surface);border-bottom:var(--gog-table-border-width) var(--gog-table-border-style) var(--gog-table-border-color);white-space:normal;overflow:hidden}.gog-table--sticky-header .gog-table__th{position:sticky;top:0;z-index:1}.gog-table__th--num{width:var(--gog-table-num-col-width);text-align:center;color:var(--gog-table-muted-color)}.gog-table__th--select,.gog-table__td--select{width:var(--gog-table-select-col-width);text-align:center}.gog-table__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.gog-table__th--sortable:focus-visible{outline:var(--gog-table-focus-ring-width) solid var(--gog-table-focus-ring);outline-offset:calc(var(--gog-table-focus-ring-width) * -1)}.gog-table__th--sortable:hover,.gog-table__th--sorted{color:var(--gog-table-accent-bright)}.gog-table__th-inner{display:inline-flex;align-items:center;gap:var(--gog-table-th-inner-gap);width:100%}.gog-table__sort-icon{display:inline-block;width:var(--gog-table-sort-icon-width);text-align:center;font-size:var(--gog-table-sort-icon-size);opacity:var(--gog-table-sort-icon-opacity);flex-shrink:0}.gog-table__th--sorted .gog-table__sort-icon{opacity:1}.gog-table__td{padding:var(--gog-table-td-padding-v, var(--gog-table-size-td-padding-v, var(--gog-table-lg-padding-v))) var(--gog-table-padding-h);font-size:var(--gog-table-td-font-size, var(--gog-table-size-td-font-size, var(--gog-table-lg-td-font-size)));border-bottom:var(--gog-table-row-border-width) var(--gog-table-border-style) var(--gog-table-border-color);vertical-align:middle;overflow-wrap:break-word;word-break:break-word;overflow:hidden}.gog-table__td--num{text-align:center;color:var(--gog-table-muted-color);font-size:var(--gog-table-num-font-size);font-family:var(--gog-table-numeric-font-family);width:var(--gog-table-num-col-width)}.gog-table__row:last-child .gog-table__td{border-bottom:none}.gog-table__row{transition:background-color var(--gog-table-row-transition-duration) var(--gog-easing)}.gog-table__row--interactive{cursor:pointer}.gog-table__row--interactive:focus-visible{outline:var(--gog-table-focus-ring-width) solid var(--gog-table-focus-ring);outline-offset:calc(var(--gog-table-focus-ring-width) * -1)}.gog-table__row:hover{background-color:var(--gog-table-hover-bg)}.gog-table__row--selected,.gog-table__row--selected:hover{background-color:var(--gog-table-selected-bg)}.gog-table__empty{padding:var(--gog-table-empty-padding);text-align:center;color:var(--gog-table-muted-color);font-size:var(--gog-table-empty-font-size)}.gog-table--loading thead{opacity:var(--gog-table-loading-opacity);pointer-events:none}.gog-table__loading-cell{padding:var(--gog-table-loading-padding);text-align:center}.gog-table--col-borders .gog-table__th:not(:last-child),.gog-table--col-borders .gog-table__td:not(:last-child){border-inline-end:var(--gog-table-row-border-width) var(--gog-table-border-style) var(--gog-table-border-color)}.gog-table__footer{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:\"left center right\";align-items:center;min-height:var(--gog-table-footer-min-height);gap:var(--gog-table-footer-gap)}.gog-table__total{font-size:var(--gog-table-total-font-size);color:var(--gog-table-muted-color);font-family:var(--gog-table-numeric-font-family);text-transform:var(--gog-table-total-text-transform);letter-spacing:var(--gog-table-total-letter-spacing)}.gog-table__total[style*=\"grid-area: right\"]{text-align:end}.gog-table__pagination[style*=\"grid-area: left\"]{justify-content:flex-start}.gog-table__pagination[style*=\"grid-area: center\"]{justify-content:center}.gog-table__pagination[style*=\"grid-area: right\"]{justify-content:flex-end}@media(prefers-reduced-motion:reduce){.gog-table__row{transition:none}}\n"] }]
+                    }, template: "<div class=\"gog-table-wrapper gog-contained-layout\">\r\n  <!--\r\n    The vertical axis is enabled only when the table has been capped. Left on for an uncapped\r\n    table, `gog-scroll` would make this viewport a scroll container on both axes, which puts it\r\n    in the sticky chain of everything inside it and takes the consumer's own scrolling region\r\n    out of it \u2014 measured: a header that used to pin to that region rode away by 147px.\r\n  -->\r\n  <gog-scroll\r\n    [axis]=\"maxHeight() ? 'both' : 'horizontal'\"\r\n    [style.max-height]=\"maxHeight()\"\r\n    class=\"gog-table-scroll\"\r\n  >\r\n    <table\r\n      class=\"gog-table\"\r\n      [class]=\"sizeClass()\"\r\n      [class.gog-table--col-borders]=\"showColumnBorders()\"\r\n      [class.gog-table--loading]=\"loading()\"\r\n      [class.gog-table--sticky-header]=\"stickyHeader()\"\r\n      [class.gog-table--auto-layout]=\"!fullWidth()\"\r\n      [style.width]=\"fullWidth() ? '100%' : 'fit-content'\"\r\n    >\r\n      <colgroup>\r\n        @if (hasSelectionColumn()) {\r\n          <col class=\"gog-table__col--select\" />\r\n        }\r\n        @if (showRowNumbers()) {\r\n          <col class=\"gog-table__col--num\" />\r\n        }\r\n        @for (col of columns(); track col.field()) {\r\n          <col\r\n            [style.width]=\"col.width() || null\"\r\n            [style.min-width]=\"col.minWidth() || null\"\r\n            [style.max-width]=\"col.maxWidth() || null\"\r\n          />\r\n        }\r\n      </colgroup>\r\n      <thead>\r\n        <tr>\r\n          @if (hasSelectionColumn()) {\r\n            <th class=\"gog-table__th gog-table__th--select\" scope=\"col\">\r\n              <!--\r\n                Only `multiple` gets a select-all: in `single` mode there is nothing to select\r\n                all of, and a checkbox that can only ever check one row is a lie.\r\n              -->\r\n              @if (selectionMode() === 'multiple') {\r\n                <gog-checkbox\r\n                  [checked]=\"allPageRowsSelected()\"\r\n                  [indeterminate]=\"somePageRowsSelected()\"\r\n                  [disabled]=\"loading() || visibleRows().length === 0\"\r\n                  [ariaLabel]=\"resolvedLabels().selectAllRows\"\r\n                  (checkedChange)=\"toggleAllOnPage($event)\"\r\n                />\r\n              }\r\n            </th>\r\n          }\r\n          @if (showRowNumbers()) {\r\n            <th class=\"gog-table__th gog-table__th--num\" scope=\"col\">#</th>\r\n          }\r\n          @for (col of columns(); track col.field()) {\r\n            <th\r\n              class=\"gog-table__th\"\r\n              scope=\"col\"\r\n              [class.gog-table__th--sortable]=\"col.sortable() && !loading()\"\r\n              [class.gog-table__th--sorted]=\"getSortDirection(col.field())\"\r\n              [attr.aria-sort]=\"getAriaSort(col.field())\"\r\n              [attr.tabindex]=\"col.sortable() && !loading() ? 0 : null\"\r\n              (click)=\"handleSortClick(col)\"\r\n              (keydown.enter)=\"handleSortClick(col)\"\r\n              (keydown.space)=\"handleSortClick(col); $event.preventDefault()\"\r\n            >\r\n              @if (getHeaderTemplate(col); as headerTpl) {\r\n                <ng-container *ngTemplateOutlet=\"headerTpl; context: headerContext(col)\" />\r\n              } @else {\r\n                <span class=\"gog-table__th-inner\">\r\n                  {{ col.header() || col.field() }}\r\n                  @if (col.sortable() && !loading()) {\r\n                    <span class=\"gog-table__sort-icon\" aria-hidden=\"true\">\r\n                      @if (getSortDirection(col.field()) === 'asc') {\r\n                        <gog-icon name=\"sort-up\" />\r\n                      } @else if (getSortDirection(col.field()) === 'desc') {\r\n                        <gog-icon name=\"sort-down\" />\r\n                      } @else {\r\n                        <gog-icon name=\"sort\" />\r\n                      }\r\n                    </span>\r\n                  }\r\n                </span>\r\n              }\r\n            </th>\r\n          }\r\n        </tr>\r\n      </thead>\r\n      <tbody>\r\n        @if (loading()) {\r\n          <tr>\r\n            <td class=\"gog-table__loading-cell\" [attr.colspan]=\"emptyColspan()\">\r\n              <gog-spinner size=\"md\" />\r\n            </td>\r\n          </tr>\r\n        } @else if (visibleRows().length === 0) {\r\n          <tr>\r\n            <td class=\"gog-table__empty\" [attr.colspan]=\"emptyColspan()\">\u2014</td>\r\n          </tr>\r\n        } @else {\r\n          @for (row of visibleRows(); track rowKey(row); let i = $index) {\r\n            <tr\r\n              class=\"gog-table__row\"\r\n              [class.gog-table__row--interactive]=\"interactiveRows()\"\r\n              [class.gog-table__row--selected]=\"isSelected(row)\"\r\n              [attr.tabindex]=\"interactiveRows() ? 0 : null\"\r\n              [attr.aria-selected]=\"hasSelection() ? isSelected(row) : null\"\r\n              (click)=\"emitRowClick(row, i, $event)\"\r\n              (keydown)=\"onRowKeydown(row, i, $event)\"\r\n            >\r\n              @if (hasSelectionColumn()) {\r\n                <td class=\"gog-table__td gog-table__td--select\">\r\n                  <!--\r\n                    `$event.stopPropagation()` so ticking the box does not also count as a row\r\n                    click: with `interactiveRows` those are two different intents, and firing both\r\n                    from one gesture is how a \"select\" ends up navigating away.\r\n                  -->\r\n                  <gog-checkbox\r\n                    [checked]=\"isSelected(row)\"\r\n                    [ariaLabel]=\"resolvedLabels().selectRow\"\r\n                    (click)=\"$event.stopPropagation()\"\r\n                    (checkedChange)=\"toggleRowSelection(row, $event)\"\r\n                  />\r\n                </td>\r\n              }\r\n              @if (showRowNumbers()) {\r\n                <td class=\"gog-table__td gog-table__td--num\">{{ globalRowIndex(i) }}</td>\r\n              }\r\n              @for (col of columns(); track col.field()) {\r\n                <td class=\"gog-table__td\">\r\n                  @if (getBodyTemplate(col); as bodyTpl) {\r\n                    <ng-container *ngTemplateOutlet=\"bodyTpl; context: bodyContext(row, col, i)\" />\r\n                  } @else {\r\n                    {{ formatCellValue(row, col.field()) }}\r\n                  }\r\n                </td>\r\n              }\r\n            </tr>\r\n          }\r\n        }\r\n      </tbody>\r\n    </table>\r\n  </gog-scroll>\r\n\r\n  @if (hasPagination() || showTotal()) {\r\n    <div class=\"gog-table__footer\">\r\n      @if (showTotal()) {\r\n        <span class=\"gog-table__total\" [style.grid-area]=\"totalGridArea()\">\r\n          {{ resolvedLabels().total }}: {{ rowCount() }}\r\n        </span>\r\n      }\r\n\r\n      @if (hasPagination()) {\r\n        <!--\r\n          `[(pageSize)]` straight through to the table's own model: the rows-per-page select\r\n          writes back here, and a consumer binding `[(pageSize)]` on the table sees it. No\r\n          intermediate signal, in either direction.\r\n        -->\r\n        <gog-paginator\r\n          class=\"gog-table__pagination\"\r\n          [style.grid-area]=\"paginatorGridArea()\"\r\n          [(page)]=\"currentPage\"\r\n          [(pageSize)]=\"pageSize\"\r\n          [totalPages]=\"totalPages()\"\r\n          [showPageSizeSelect]=\"showPageSizeSelect()\"\r\n          [pageSizeOptions]=\"pageSizeOptions()\"\r\n          rangeMode=\"ellipsis\"\r\n          size=\"sm\"\r\n          [ariaLabel]=\"resolvedLabels().pagination\"\r\n        />\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n", styles: ["@charset \"UTF-8\";.gog-table-wrapper{display:flex;flex-direction:column;gap:var(--gog-table-gap);width:100%;overflow-anchor:none}.gog-table-scroll{width:100%}.gog-table{width:100%;border-collapse:collapse;border:var(--gog-table-border-width) var(--gog-table-border-style) var(--gog-table-border-color);background-color:var(--gog-table-surface);color:var(--gog-table-text-color);font-family:var(--gog-table-font-family);table-layout:fixed}.gog-table--auto-layout{table-layout:auto}.gog-table--slg{--gog-table-size-th-padding-v: var(--gog-table-slg-padding-v);--gog-table-size-td-padding-v: var(--gog-table-slg-padding-v);--gog-table-size-th-font-size: var(--gog-table-slg-th-font-size);--gog-table-size-td-font-size: var(--gog-table-slg-td-font-size)}.gog-table--md{--gog-table-size-th-padding-v: var(--gog-table-md-padding-v);--gog-table-size-td-padding-v: var(--gog-table-md-padding-v);--gog-table-size-th-font-size: var(--gog-table-md-th-font-size);--gog-table-size-td-font-size: var(--gog-table-md-td-font-size)}.gog-table--sm{--gog-table-size-th-padding-v: var(--gog-table-sm-padding-v);--gog-table-size-td-padding-v: var(--gog-table-sm-padding-v);--gog-table-size-th-font-size: var(--gog-table-sm-th-font-size);--gog-table-size-td-font-size: var(--gog-table-sm-td-font-size)}.gog-table--xsm{--gog-table-size-th-padding-v: var(--gog-table-xsm-padding-v);--gog-table-size-td-padding-v: var(--gog-table-xsm-padding-v);--gog-table-size-th-font-size: var(--gog-table-xsm-th-font-size);--gog-table-size-td-font-size: var(--gog-table-xsm-td-font-size)}.gog-table__col--num{width:var(--gog-table-num-col-width)}.gog-table__th{padding:var(--gog-table-th-padding-v, var(--gog-table-size-th-padding-v, var(--gog-table-lg-padding-v))) var(--gog-table-padding-h);text-align:start;font-family:var(--gog-table-header-font-family);font-size:var(--gog-table-th-font-size, var(--gog-table-size-th-font-size, var(--gog-table-lg-th-font-size)));text-transform:var(--gog-table-header-text-transform);letter-spacing:var(--gog-table-header-letter-spacing);color:var(--gog-table-accent-color);background-color:var(--gog-table-header-bg);border-bottom:var(--gog-table-border-width) var(--gog-table-border-style) var(--gog-table-border-color);white-space:normal;overflow:hidden}.gog-table--sticky-header .gog-table__th{position:sticky;top:0;z-index:1}.gog-table__th--num{width:var(--gog-table-num-col-width);text-align:center;color:var(--gog-table-muted-color)}.gog-table__th--select,.gog-table__td--select{width:var(--gog-table-select-col-width);text-align:center}.gog-table__th--sortable{cursor:pointer;-webkit-user-select:none;user-select:none}.gog-table__th--sortable:focus-visible{outline:var(--gog-table-focus-ring-width) solid var(--gog-table-focus-ring);outline-offset:calc(var(--gog-table-focus-ring-width) * -1)}.gog-table__th--sortable:hover,.gog-table__th--sorted{color:var(--gog-table-accent-bright)}.gog-table__th-inner{display:inline-flex;align-items:center;gap:var(--gog-table-th-inner-gap);width:100%}.gog-table__sort-icon{display:inline-block;width:var(--gog-table-sort-icon-width);text-align:center;font-size:var(--gog-table-sort-icon-size);opacity:var(--gog-table-sort-icon-opacity);flex-shrink:0}.gog-table__th--sorted .gog-table__sort-icon{opacity:1}.gog-table__td{padding:var(--gog-table-td-padding-v, var(--gog-table-size-td-padding-v, var(--gog-table-lg-padding-v))) var(--gog-table-padding-h);font-size:var(--gog-table-td-font-size, var(--gog-table-size-td-font-size, var(--gog-table-lg-td-font-size)));border-bottom:var(--gog-table-row-border-width) var(--gog-table-border-style) var(--gog-table-border-color);vertical-align:middle;overflow-wrap:break-word;word-break:break-word;overflow:hidden}.gog-table__td--num{text-align:center;color:var(--gog-table-muted-color);font-size:var(--gog-table-num-font-size);font-family:var(--gog-table-numeric-font-family);width:var(--gog-table-num-col-width)}.gog-table__row:last-child .gog-table__td{border-bottom:none}.gog-table__row{transition:background-color var(--gog-table-row-transition-duration) var(--gog-easing)}.gog-table__row--interactive{cursor:pointer}.gog-table__row--interactive:focus-visible{outline:var(--gog-table-focus-ring-width) solid var(--gog-table-focus-ring);outline-offset:calc(var(--gog-table-focus-ring-width) * -1)}.gog-table__row:hover{background-color:var(--gog-table-hover-bg)}.gog-table__row--selected,.gog-table__row--selected:hover{background-color:var(--gog-table-selected-bg)}.gog-table__empty{padding:var(--gog-table-empty-padding);text-align:center;color:var(--gog-table-muted-color);font-size:var(--gog-table-empty-font-size)}.gog-table--loading thead{opacity:var(--gog-table-loading-opacity);pointer-events:none}.gog-table__loading-cell{padding:var(--gog-table-loading-padding);text-align:center}.gog-table--col-borders .gog-table__th:not(:last-child),.gog-table--col-borders .gog-table__td:not(:last-child){border-inline-end:var(--gog-table-row-border-width) var(--gog-table-border-style) var(--gog-table-border-color)}.gog-table__footer{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:\"left center right\";align-items:center;min-height:var(--gog-table-footer-min-height);gap:var(--gog-table-footer-gap)}.gog-table__total{font-size:var(--gog-table-total-font-size);color:var(--gog-table-muted-color);font-family:var(--gog-table-numeric-font-family);text-transform:var(--gog-table-total-text-transform);letter-spacing:var(--gog-table-total-letter-spacing)}.gog-table__total[style*=\"grid-area: right\"]{text-align:end}.gog-table__pagination[style*=\"grid-area: left\"]{justify-content:flex-start}.gog-table__pagination[style*=\"grid-area: center\"]{justify-content:center}.gog-table__pagination[style*=\"grid-area: right\"]{justify-content:flex-end}@media(prefers-reduced-motion:reduce){.gog-table__row{transition:none}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }, { type: i0.Output, args: ["pageSizeChange"] }], showPageSizeSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPageSizeSelect", required: false }] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], lazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazy", required: false }] }], totalRecords: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalRecords", required: false }] }], interactiveRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "interactiveRows", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }, { type: i0.Output, args: ["selectionChange"] }], dataKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataKey", required: false }] }], showSelectionColumn: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSelectionColumn", required: false }] }], showRowNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRowNumbers", required: false }] }], showTotal: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTotal", required: false }] }], emptyPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyPlaceholder", required: false }] }], paginatorPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginatorPosition", required: false }] }], totalPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalPosition", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], showColumnBorders: [{ type: i0.Input, args: [{ isSignal: true, alias: "showColumnBorders", required: false }] }], stickyHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "stickyHeader", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], gogSortChange: [{ type: i0.Output, args: ["gogSortChange"] }], gogPageChange: [{ type: i0.Output, args: ["gogPageChange"] }], gogRowClick: [{ type: i0.Output, args: ["gogRowClick"] }], columns: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => GogColumn), { isSignal: true }] }] } });
 
 /** Built-in defaults, used when `GOG_CONFIG.theme` doesn't supply one. */
@@ -9238,10 +9238,12 @@ const GOG_TOKEN_GROUPS = [
             '--gog-accent-text-color',
             '--gog-background-color',
             '--gog-border-color',
+            '--gog-card-elevated-shadow',
             '--gog-danger-color',
             '--gog-hover-color',
             '--gog-info-color',
             '--gog-muted-text-color',
+            '--gog-panel-elevated-shadow',
             '--gog-panel-shadow',
             '--gog-primary-color',
             '--gog-secondary-color',
@@ -9260,6 +9262,7 @@ const GOG_TOKEN_GROUPS = [
             '--gog-control-icon-offset',
             '--gog-control-padding-x',
             '--gog-control-padding-y',
+            '--gog-elevated-surface-color',
             '--gog-field-float-label-over-gap',
             '--gog-field-lg-font-size',
             '--gog-field-lg-icon-inset',
@@ -10431,6 +10434,7 @@ const GOG_TOKEN_GROUPS = [
             '--gog-table-footer-gap',
             '--gog-table-footer-min-height',
             '--gog-table-gap',
+            '--gog-table-header-bg',
             '--gog-table-header-font-family',
             '--gog-table-header-letter-spacing',
             '--gog-table-header-text-transform',