@educarehq/solaris-ui 0.21.0 → 0.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/fesm2022/educarehq-solaris-ui.mjs +65 -44
  2. package/fesm2022/educarehq-solaris-ui.mjs.map +1 -1
  3. package/package.json +1 -1
  4. package/types/educarehq-solaris-ui.d.ts +22 -6
package/fesm2022/educarehq-solaris-ui.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { InjectionToken, inject, PLATFORM_ID, Injectable, Pipe, Directive, signal, DestroyRef, DOCUMENT, input, computed, ChangeDetectionStrategy, Component, output, ElementRef, EnvironmentInjector, effect, createComponent, HostListener, model, TemplateRef, ViewContainerRef, contentChild, forwardRef, ViewChild, ViewEncapsulation, contentChildren, NgZone, Injector, viewChild, isDevMode, ChangeDetectorRef, booleanAttribute, numberAttribute, afterNextRender, viewChildren, ApplicationRef } from '@angular/core';
2
+ import { InjectionToken, inject, PLATFORM_ID, Injectable, Pipe, Directive, signal, DestroyRef, DOCUMENT, input, computed, ChangeDetectionStrategy, Component, booleanAttribute, output, ElementRef, EnvironmentInjector, effect, createComponent, HostListener, model, TemplateRef, ViewContainerRef, contentChild, forwardRef, ViewChild, ViewEncapsulation, contentChildren, NgZone, Injector, viewChild, isDevMode, ChangeDetectorRef, numberAttribute, afterNextRender, viewChildren, ApplicationRef } from '@angular/core';
3
3
  import { isPlatformBrowser, DOCUMENT as DOCUMENT$1, NgTemplateOutlet } from '@angular/common';
4
4
  import { Overlay, OverlayConfig } from '@angular/cdk/overlay';
5
5
  import { TemplatePortal, ComponentPortal } from '@angular/cdk/portal';
@@ -2887,12 +2887,13 @@ class SolarisCardComponent {
2887
2887
  size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
2888
2888
  density = input(...(ngDevMode ? [undefined, { debugName: "density" }] : /* istanbul ignore next */ []));
2889
2889
  glassTexture = input('none', ...(ngDevMode ? [{ debugName: "glassTexture" }] : /* istanbul ignore next */ []));
2890
+ mediaPosition = input('top', ...(ngDevMode ? [{ debugName: "mediaPosition" }] : /* istanbul ignore next */ []));
2890
2891
  themeService = inject(SolarisThemeService);
2891
2892
  effectiveDensity = computed(() => {
2892
2893
  return this.density() ?? this.themeService.density;
2893
2894
  }, ...(ngDevMode ? [{ debugName: "effectiveDensity" }] : /* istanbul ignore next */ []));
2894
2895
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
2895
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.22", type: SolarisCardComponent, isStandalone: true, selector: "solaris-card", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, glassTexture: { classPropertyName: "glassTexture", publicName: "glassTexture", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-appearance": "appearance()", "attr.data-size": "size()", "attr.data-radius": "radius()", "attr.data-density": "effectiveDensity()", "attr.data-glass-texture": "appearance() === \"glass\" && glassTexture() !== \"none\" ? glassTexture() : null" } }, ngImport: i0, template: "<ng-content />\n", styles: [":host{--solaris-card-shadow: none;--solaris-card-glass-blur: initial;--solaris-card-glass-background: initial;--solaris-card-glass-border-color: initial;--solaris-card-gap: var(--solaris-spacing-5);--solaris-card-glass-texture-opacity: initial;--solaris-card-radius: var(--solaris-radius-lg);--solaris-card-padding: var(--solaris-spacing-6);--solaris-card-color: var(--solaris-text-default);--solaris-card-header-gap: var(--solaris-spacing-1);--solaris-card-section-gap: var(--solaris-card-gap);--solaris-card-background: var(--solaris-surface-base);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm);--solaris-card-section-padding: var(--solaris-card-padding);--solaris-card-footer-border-color: var(--solaris-border-subtle);gap:0;padding:0;display:flex;overflow:hidden;flex-direction:column;box-sizing:border-box;color:var(--solaris-card-color);box-shadow:var(--solaris-card-shadow);border-radius:var(--solaris-card-radius);background:var(--solaris-card-background);border:var(--solaris-card-border-width) solid var(--solaris-card-border-color)}:host([data-size=sm]){--solaris-card-section-gap: var(--solaris-spacing-4);--solaris-card-section-padding: var(--solaris-spacing-4)}:host([data-size=lg]){--solaris-card-section-gap: var(--solaris-spacing-6);--solaris-card-section-padding: var(--solaris-spacing-8)}:host([data-appearance=surface]){--solaris-card-shadow: none;--solaris-card-color: var(--solaris-text-default);--solaris-card-background: var(--solaris-surface-base);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=outline]){--solaris-card-shadow: none;--solaris-card-background: transparent;--solaris-card-color: var(--solaris-text-default);--solaris-card-border-color: var(--solaris-border-default);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=tonal]){--solaris-card-shadow: none;--solaris-card-color: var(--solaris-text-default);--solaris-card-background: var(--solaris-surface-subtle);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=glass]){--solaris-card-glass-blur: var(--solaris-glass-blur);--solaris-card-glass-texture-opacity: var(--solaris-glass-texture-opacity);--solaris-card-color: var(--solaris-text-glass);--solaris-card-border-width: var(--solaris-border-width-sm);--solaris-card-glass-border-color: var(--solaris-glass-border-color);--solaris-card-shadow: var(--solaris-glass-shadow);--solaris-card-glass-background: var(--solaris-glass-background);position:relative;isolation:isolate;box-shadow:var(--solaris-card-shadow);background:var(--solaris-card-glass-background);border-color:var(--solaris-card-glass-border-color);backdrop-filter:var(--solaris-glass-backdrop-filter);-webkit-backdrop-filter:var(--solaris-glass-backdrop-filter)}:host([data-appearance=glass]):before{inset:0;content:\"\";position:absolute;pointer-events:none;border-radius:inherit;z-index:var(--solaris-z-index-decorative);background:radial-gradient(circle at 72% 58%,rgba(255,110,24,.3607843137),transparent 34%),radial-gradient(circle at 22% 16%,rgba(255,255,255,.1803921569),transparent 30%),linear-gradient(135deg,rgba(255,255,255,.1803921569),transparent 42%)}:host([data-appearance=glass][data-glass-texture=grooves]):after{inset:0;content:\"\";position:absolute;pointer-events:none;border-radius:inherit;z-index:var(--solaris-z-index-decorative);opacity:var(--solaris-card-glass-texture-opacity);background-image:repeating-radial-gradient(circle at 0 0,var(--solaris-glass-border-color) 0,var(--solaris-glass-border-color) 1px,transparent 1px,transparent 4px)}:host([data-density=compact]){--solaris-card-gap: var(--solaris-density-gap-lg);--solaris-card-padding: var(--solaris-density-padding-xl)}:host([data-density=comfortable]){--solaris-card-gap: var(--solaris-density-gap-lg);--solaris-card-padding: var(--solaris-density-padding-xl)}:host([data-radius=none]){--solaris-card-radius: var(--solaris-radius-none)}:host([data-radius=sm]){--solaris-card-radius: var(--solaris-radius-sm)}:host([data-radius=lg]){--solaris-card-radius: var(--solaris-radius-lg)}:host([data-radius=xl]){--solaris-card-radius: var(--solaris-radius-xl)}:host ::ng-deep .solaris-card-header,:host ::ng-deep .solaris-card-content,:host ::ng-deep .solaris-card-footer{box-sizing:border-box;padding-inline:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header{display:flex;flex-direction:column;padding-block:var(--solaris-card-section-padding) var(--solaris-spacing-0);gap:var(--solaris-card-header-gap)}:host ::ng-deep .solaris-card-header:only-child{padding-block-end:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-content{display:block;padding-block:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header+.solaris-card-content{padding-block-start:var(--solaris-card-section-gap)}:host ::ng-deep .solaris-card-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-2);padding-block:var(--solaris-spacing-1) var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-footer:only-child{padding-block-start:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-footer[data-separator]{padding-block-start:var(--solaris-card-section-gap);border-top:var(--solaris-border-width-sm) solid var(--solaris-card-footer-border-color)}:host ::ng-deep .solaris-card-media{margin:0;display:block;overflow:hidden}:host ::ng-deep .solaris-card-media:first-child{border-radius:var(--solaris-card-radius) var(--solaris-card-radius) 0 0}:host ::ng-deep .solaris-card-media:not(:first-child){border-radius:var(--solaris-radius-none)}:host ::ng-deep .solaris-card-media img,:host ::ng-deep .solaris-card-media video,:host ::ng-deep .solaris-card-media picture{width:100%;display:block}:host ::ng-deep .solaris-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-2)}:host ::ng-deep .solaris-card-title{color:var(--solaris-text-strong);font-size:var(--solaris-font-size-lg);line-height:var(--solaris-line-height-sm);font-weight:var(--solaris-font-weight-semibold);margin:var(--solaris-spacing-0) var(--solaris-spacing-0) var(--solaris-spacing-2)}:host ::ng-deep .solaris-card-description{margin:var(--solaris-spacing-0);color:var(--solaris-text-muted);font-size:var(--solaris-font-size-sm);line-height:var(--solaris-line-height-md)}:host([data-appearance=glass]) ::ng-deep .solaris-card-description{color:var(--solaris-text-glass)}:host ::ng-deep *+.solaris-card-description{margin-top:var(--solaris-spacing-1)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2896
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.22", type: SolarisCardComponent, isStandalone: true, selector: "solaris-card", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, glassTexture: { classPropertyName: "glassTexture", publicName: "glassTexture", isSignal: true, isRequired: false, transformFunction: null }, mediaPosition: { classPropertyName: "mediaPosition", publicName: "mediaPosition", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-appearance": "appearance()", "attr.data-size": "size()", "attr.data-radius": "radius()", "attr.data-density": "effectiveDensity()", "attr.data-media-position": "mediaPosition()", "attr.data-glass-texture": "appearance() === \"glass\" && glassTexture() !== \"none\" ? glassTexture() : null" } }, ngImport: i0, template: "<ng-content />\n", styles: [":host{--solaris-card-shadow: none;--solaris-card-glass-blur: initial;--solaris-card-glass-background: initial;--solaris-card-glass-border-color: initial;--solaris-card-gap: var(--solaris-spacing-0);--solaris-card-glass-texture-opacity: initial;--solaris-card-radius: var(--solaris-radius-lg);--solaris-card-padding: var(--solaris-spacing-0);--solaris-card-color: var(--solaris-text-default);--solaris-card-header-gap: var(--solaris-spacing-0);--solaris-card-section-gap: var(--solaris-card-gap);--solaris-card-background: var(--solaris-surface-base);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm);--solaris-card-section-padding: var(--solaris-card-padding);--solaris-card-footer-border-color: var(--solaris-border-subtle);--solaris-card-header-border-color: var(--solaris-border-subtle);--solaris-card-media-size: var(--solaris-spacing-12);gap:0;padding:0;display:flex;overflow:hidden;flex-direction:column;box-sizing:border-box;color:var(--solaris-card-color);box-shadow:var(--solaris-card-shadow);border-radius:var(--solaris-card-radius);background:var(--solaris-card-background);border:var(--solaris-card-border-width) solid var(--solaris-card-border-color)}:host([data-size=sm]){--solaris-card-media-size: var(--solaris-spacing-10)}:host([data-size=lg]){--solaris-card-media-size: var(--solaris-spacing-16)}:host([data-appearance=surface]){--solaris-card-shadow: none;--solaris-card-color: var(--solaris-text-default);--solaris-card-background: var(--solaris-surface-base);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=outline]){--solaris-card-shadow: none;--solaris-card-background: transparent;--solaris-card-color: var(--solaris-text-default);--solaris-card-border-color: var(--solaris-border-default);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=tonal]){--solaris-card-shadow: none;--solaris-card-color: var(--solaris-text-default);--solaris-card-background: var(--solaris-surface-subtle);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=glass]){--solaris-card-glass-blur: var(--solaris-glass-blur);--solaris-card-glass-texture-opacity: var(--solaris-glass-texture-opacity);--solaris-card-color: var(--solaris-text-glass);--solaris-card-border-width: var(--solaris-border-width-sm);--solaris-card-glass-border-color: var(--solaris-glass-border-color);--solaris-card-shadow: var(--solaris-glass-shadow);--solaris-card-glass-background: var(--solaris-glass-background);position:relative;isolation:isolate;box-shadow:var(--solaris-card-shadow);background:var(--solaris-card-glass-background);border-color:var(--solaris-card-glass-border-color);backdrop-filter:var(--solaris-glass-backdrop-filter);-webkit-backdrop-filter:var(--solaris-glass-backdrop-filter)}:host([data-appearance=glass]):before{inset:0;content:\"\";position:absolute;pointer-events:none;border-radius:inherit;z-index:var(--solaris-z-index-decorative);background:radial-gradient(circle at 72% 58%,rgba(255,110,24,.3607843137),transparent 34%),radial-gradient(circle at 22% 16%,rgba(255,255,255,.1803921569),transparent 30%),linear-gradient(135deg,rgba(255,255,255,.1803921569),transparent 42%)}:host([data-appearance=glass][data-glass-texture=grooves]):after{inset:0;content:\"\";position:absolute;pointer-events:none;border-radius:inherit;z-index:var(--solaris-z-index-decorative);opacity:var(--solaris-card-glass-texture-opacity);background-image:repeating-radial-gradient(circle at 0 0,var(--solaris-glass-border-color) 0,var(--solaris-glass-border-color) 1px,transparent 1px,transparent 4px)}:host([data-radius=none]){--solaris-card-radius: var(--solaris-radius-none)}:host([data-radius=sm]){--solaris-card-radius: var(--solaris-radius-sm)}:host([data-radius=lg]){--solaris-card-radius: var(--solaris-radius-lg)}:host([data-radius=xl]){--solaris-card-radius: var(--solaris-radius-xl)}:host ::ng-deep .solaris-card-header,:host ::ng-deep .solaris-card-content,:host ::ng-deep .solaris-card-footer{box-sizing:border-box;padding-inline:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header{display:flex;flex-direction:column;padding-block:var(--solaris-card-section-padding) var(--solaris-spacing-0);gap:var(--solaris-card-header-gap)}:host ::ng-deep .solaris-card-header:only-child{padding-block-end:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-content{display:block;padding-block:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header+.solaris-card-content{padding-block-start:var(--solaris-card-section-gap)}:host ::ng-deep .solaris-card-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-0);padding-block:var(--solaris-spacing-0) var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-footer:only-child{padding-block-start:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header[data-separator]{padding-block-end:var(--solaris-card-section-gap);border-bottom:var(--solaris-border-width-sm) solid var(--solaris-card-header-border-color)}:host ::ng-deep .solaris-card-footer[data-separator]{padding-block-start:var(--solaris-card-section-gap);border-top:var(--solaris-border-width-sm) solid var(--solaris-card-footer-border-color)}:host ::ng-deep .solaris-card-media{margin:0;display:block;overflow:hidden}:host ::ng-deep .solaris-card-media:first-child{border-radius:var(--solaris-card-radius) var(--solaris-card-radius) 0 0}:host ::ng-deep .solaris-card-media:not(:first-child){border-radius:var(--solaris-radius-none)}:host ::ng-deep .solaris-card-media img,:host ::ng-deep .solaris-card-media video,:host ::ng-deep .solaris-card-media picture{width:100%;display:block}:host ::ng-deep .solaris-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-0)}:host ::ng-deep .solaris-card-title{color:var(--solaris-text-strong);font-size:var(--solaris-font-size-lg);line-height:var(--solaris-line-height-sm);font-weight:var(--solaris-font-weight-semibold);margin:var(--solaris-spacing-0)}:host ::ng-deep .solaris-card-description{margin:var(--solaris-spacing-0);color:var(--solaris-text-muted);font-size:var(--solaris-font-size-sm);line-height:var(--solaris-line-height-md)}:host([data-appearance=glass]) ::ng-deep .solaris-card-description{color:var(--solaris-text-glass)}:host ::ng-deep *+.solaris-card-description{margin-top:var(--solaris-spacing-0)}:host([data-media-position=start]){display:grid;grid-template-columns:auto minmax(0,1fr);align-items:stretch}:host([data-media-position=start]) ::ng-deep .solaris-card-media{grid-row:1/-1;grid-column:1;align-self:center;width:var(--solaris-card-media-size);height:var(--solaris-card-media-size);border-radius:var(--solaris-radius-md)}:host([data-media-position=start]) ::ng-deep .solaris-card-media img,:host([data-media-position=start]) ::ng-deep .solaris-card-media video,:host([data-media-position=start]) ::ng-deep .solaris-card-media picture{width:100%;height:100%;object-fit:cover}:host([data-media-position=start]) ::ng-deep .solaris-card-header,:host([data-media-position=start]) ::ng-deep .solaris-card-content,:host([data-media-position=start]) ::ng-deep .solaris-card-footer,:host([data-media-position=start]) ::ng-deep .solaris-card-actions{grid-column:2;min-width:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2896
2897
  }
2897
2898
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisCardComponent, decorators: [{
2898
2899
  type: Component,
@@ -2901,13 +2902,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImpo
2901
2902
  '[attr.data-size]': 'size()',
2902
2903
  '[attr.data-radius]': 'radius()',
2903
2904
  '[attr.data-density]': 'effectiveDensity()',
2905
+ '[attr.data-media-position]': 'mediaPosition()',
2904
2906
  '[attr.data-glass-texture]': 'appearance() === "glass" && glassTexture() !== "none" ? glassTexture() : null',
2905
- }, template: "<ng-content />\n", styles: [":host{--solaris-card-shadow: none;--solaris-card-glass-blur: initial;--solaris-card-glass-background: initial;--solaris-card-glass-border-color: initial;--solaris-card-gap: var(--solaris-spacing-5);--solaris-card-glass-texture-opacity: initial;--solaris-card-radius: var(--solaris-radius-lg);--solaris-card-padding: var(--solaris-spacing-6);--solaris-card-color: var(--solaris-text-default);--solaris-card-header-gap: var(--solaris-spacing-1);--solaris-card-section-gap: var(--solaris-card-gap);--solaris-card-background: var(--solaris-surface-base);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm);--solaris-card-section-padding: var(--solaris-card-padding);--solaris-card-footer-border-color: var(--solaris-border-subtle);gap:0;padding:0;display:flex;overflow:hidden;flex-direction:column;box-sizing:border-box;color:var(--solaris-card-color);box-shadow:var(--solaris-card-shadow);border-radius:var(--solaris-card-radius);background:var(--solaris-card-background);border:var(--solaris-card-border-width) solid var(--solaris-card-border-color)}:host([data-size=sm]){--solaris-card-section-gap: var(--solaris-spacing-4);--solaris-card-section-padding: var(--solaris-spacing-4)}:host([data-size=lg]){--solaris-card-section-gap: var(--solaris-spacing-6);--solaris-card-section-padding: var(--solaris-spacing-8)}:host([data-appearance=surface]){--solaris-card-shadow: none;--solaris-card-color: var(--solaris-text-default);--solaris-card-background: var(--solaris-surface-base);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=outline]){--solaris-card-shadow: none;--solaris-card-background: transparent;--solaris-card-color: var(--solaris-text-default);--solaris-card-border-color: var(--solaris-border-default);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=tonal]){--solaris-card-shadow: none;--solaris-card-color: var(--solaris-text-default);--solaris-card-background: var(--solaris-surface-subtle);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=glass]){--solaris-card-glass-blur: var(--solaris-glass-blur);--solaris-card-glass-texture-opacity: var(--solaris-glass-texture-opacity);--solaris-card-color: var(--solaris-text-glass);--solaris-card-border-width: var(--solaris-border-width-sm);--solaris-card-glass-border-color: var(--solaris-glass-border-color);--solaris-card-shadow: var(--solaris-glass-shadow);--solaris-card-glass-background: var(--solaris-glass-background);position:relative;isolation:isolate;box-shadow:var(--solaris-card-shadow);background:var(--solaris-card-glass-background);border-color:var(--solaris-card-glass-border-color);backdrop-filter:var(--solaris-glass-backdrop-filter);-webkit-backdrop-filter:var(--solaris-glass-backdrop-filter)}:host([data-appearance=glass]):before{inset:0;content:\"\";position:absolute;pointer-events:none;border-radius:inherit;z-index:var(--solaris-z-index-decorative);background:radial-gradient(circle at 72% 58%,rgba(255,110,24,.3607843137),transparent 34%),radial-gradient(circle at 22% 16%,rgba(255,255,255,.1803921569),transparent 30%),linear-gradient(135deg,rgba(255,255,255,.1803921569),transparent 42%)}:host([data-appearance=glass][data-glass-texture=grooves]):after{inset:0;content:\"\";position:absolute;pointer-events:none;border-radius:inherit;z-index:var(--solaris-z-index-decorative);opacity:var(--solaris-card-glass-texture-opacity);background-image:repeating-radial-gradient(circle at 0 0,var(--solaris-glass-border-color) 0,var(--solaris-glass-border-color) 1px,transparent 1px,transparent 4px)}:host([data-density=compact]){--solaris-card-gap: var(--solaris-density-gap-lg);--solaris-card-padding: var(--solaris-density-padding-xl)}:host([data-density=comfortable]){--solaris-card-gap: var(--solaris-density-gap-lg);--solaris-card-padding: var(--solaris-density-padding-xl)}:host([data-radius=none]){--solaris-card-radius: var(--solaris-radius-none)}:host([data-radius=sm]){--solaris-card-radius: var(--solaris-radius-sm)}:host([data-radius=lg]){--solaris-card-radius: var(--solaris-radius-lg)}:host([data-radius=xl]){--solaris-card-radius: var(--solaris-radius-xl)}:host ::ng-deep .solaris-card-header,:host ::ng-deep .solaris-card-content,:host ::ng-deep .solaris-card-footer{box-sizing:border-box;padding-inline:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header{display:flex;flex-direction:column;padding-block:var(--solaris-card-section-padding) var(--solaris-spacing-0);gap:var(--solaris-card-header-gap)}:host ::ng-deep .solaris-card-header:only-child{padding-block-end:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-content{display:block;padding-block:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header+.solaris-card-content{padding-block-start:var(--solaris-card-section-gap)}:host ::ng-deep .solaris-card-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-2);padding-block:var(--solaris-spacing-1) var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-footer:only-child{padding-block-start:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-footer[data-separator]{padding-block-start:var(--solaris-card-section-gap);border-top:var(--solaris-border-width-sm) solid var(--solaris-card-footer-border-color)}:host ::ng-deep .solaris-card-media{margin:0;display:block;overflow:hidden}:host ::ng-deep .solaris-card-media:first-child{border-radius:var(--solaris-card-radius) var(--solaris-card-radius) 0 0}:host ::ng-deep .solaris-card-media:not(:first-child){border-radius:var(--solaris-radius-none)}:host ::ng-deep .solaris-card-media img,:host ::ng-deep .solaris-card-media video,:host ::ng-deep .solaris-card-media picture{width:100%;display:block}:host ::ng-deep .solaris-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-2)}:host ::ng-deep .solaris-card-title{color:var(--solaris-text-strong);font-size:var(--solaris-font-size-lg);line-height:var(--solaris-line-height-sm);font-weight:var(--solaris-font-weight-semibold);margin:var(--solaris-spacing-0) var(--solaris-spacing-0) var(--solaris-spacing-2)}:host ::ng-deep .solaris-card-description{margin:var(--solaris-spacing-0);color:var(--solaris-text-muted);font-size:var(--solaris-font-size-sm);line-height:var(--solaris-line-height-md)}:host([data-appearance=glass]) ::ng-deep .solaris-card-description{color:var(--solaris-text-glass)}:host ::ng-deep *+.solaris-card-description{margin-top:var(--solaris-spacing-1)}\n"] }]
2906
- }], propDecorators: { appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], radius: [{ type: i0.Input, args: [{ isSignal: true, alias: "radius", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], glassTexture: [{ type: i0.Input, args: [{ isSignal: true, alias: "glassTexture", required: false }] }] } });
2907
+ }, template: "<ng-content />\n", styles: [":host{--solaris-card-shadow: none;--solaris-card-glass-blur: initial;--solaris-card-glass-background: initial;--solaris-card-glass-border-color: initial;--solaris-card-gap: var(--solaris-spacing-0);--solaris-card-glass-texture-opacity: initial;--solaris-card-radius: var(--solaris-radius-lg);--solaris-card-padding: var(--solaris-spacing-0);--solaris-card-color: var(--solaris-text-default);--solaris-card-header-gap: var(--solaris-spacing-0);--solaris-card-section-gap: var(--solaris-card-gap);--solaris-card-background: var(--solaris-surface-base);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm);--solaris-card-section-padding: var(--solaris-card-padding);--solaris-card-footer-border-color: var(--solaris-border-subtle);--solaris-card-header-border-color: var(--solaris-border-subtle);--solaris-card-media-size: var(--solaris-spacing-12);gap:0;padding:0;display:flex;overflow:hidden;flex-direction:column;box-sizing:border-box;color:var(--solaris-card-color);box-shadow:var(--solaris-card-shadow);border-radius:var(--solaris-card-radius);background:var(--solaris-card-background);border:var(--solaris-card-border-width) solid var(--solaris-card-border-color)}:host([data-size=sm]){--solaris-card-media-size: var(--solaris-spacing-10)}:host([data-size=lg]){--solaris-card-media-size: var(--solaris-spacing-16)}:host([data-appearance=surface]){--solaris-card-shadow: none;--solaris-card-color: var(--solaris-text-default);--solaris-card-background: var(--solaris-surface-base);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=outline]){--solaris-card-shadow: none;--solaris-card-background: transparent;--solaris-card-color: var(--solaris-text-default);--solaris-card-border-color: var(--solaris-border-default);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=tonal]){--solaris-card-shadow: none;--solaris-card-color: var(--solaris-text-default);--solaris-card-background: var(--solaris-surface-subtle);--solaris-card-border-color: var(--solaris-border-subtle);--solaris-card-border-width: var(--solaris-border-width-sm)}:host([data-appearance=glass]){--solaris-card-glass-blur: var(--solaris-glass-blur);--solaris-card-glass-texture-opacity: var(--solaris-glass-texture-opacity);--solaris-card-color: var(--solaris-text-glass);--solaris-card-border-width: var(--solaris-border-width-sm);--solaris-card-glass-border-color: var(--solaris-glass-border-color);--solaris-card-shadow: var(--solaris-glass-shadow);--solaris-card-glass-background: var(--solaris-glass-background);position:relative;isolation:isolate;box-shadow:var(--solaris-card-shadow);background:var(--solaris-card-glass-background);border-color:var(--solaris-card-glass-border-color);backdrop-filter:var(--solaris-glass-backdrop-filter);-webkit-backdrop-filter:var(--solaris-glass-backdrop-filter)}:host([data-appearance=glass]):before{inset:0;content:\"\";position:absolute;pointer-events:none;border-radius:inherit;z-index:var(--solaris-z-index-decorative);background:radial-gradient(circle at 72% 58%,rgba(255,110,24,.3607843137),transparent 34%),radial-gradient(circle at 22% 16%,rgba(255,255,255,.1803921569),transparent 30%),linear-gradient(135deg,rgba(255,255,255,.1803921569),transparent 42%)}:host([data-appearance=glass][data-glass-texture=grooves]):after{inset:0;content:\"\";position:absolute;pointer-events:none;border-radius:inherit;z-index:var(--solaris-z-index-decorative);opacity:var(--solaris-card-glass-texture-opacity);background-image:repeating-radial-gradient(circle at 0 0,var(--solaris-glass-border-color) 0,var(--solaris-glass-border-color) 1px,transparent 1px,transparent 4px)}:host([data-radius=none]){--solaris-card-radius: var(--solaris-radius-none)}:host([data-radius=sm]){--solaris-card-radius: var(--solaris-radius-sm)}:host([data-radius=lg]){--solaris-card-radius: var(--solaris-radius-lg)}:host([data-radius=xl]){--solaris-card-radius: var(--solaris-radius-xl)}:host ::ng-deep .solaris-card-header,:host ::ng-deep .solaris-card-content,:host ::ng-deep .solaris-card-footer{box-sizing:border-box;padding-inline:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header{display:flex;flex-direction:column;padding-block:var(--solaris-card-section-padding) var(--solaris-spacing-0);gap:var(--solaris-card-header-gap)}:host ::ng-deep .solaris-card-header:only-child{padding-block-end:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-content{display:block;padding-block:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header+.solaris-card-content{padding-block-start:var(--solaris-card-section-gap)}:host ::ng-deep .solaris-card-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-0);padding-block:var(--solaris-spacing-0) var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-footer:only-child{padding-block-start:var(--solaris-card-section-padding)}:host ::ng-deep .solaris-card-header[data-separator]{padding-block-end:var(--solaris-card-section-gap);border-bottom:var(--solaris-border-width-sm) solid var(--solaris-card-header-border-color)}:host ::ng-deep .solaris-card-footer[data-separator]{padding-block-start:var(--solaris-card-section-gap);border-top:var(--solaris-border-width-sm) solid var(--solaris-card-footer-border-color)}:host ::ng-deep .solaris-card-media{margin:0;display:block;overflow:hidden}:host ::ng-deep .solaris-card-media:first-child{border-radius:var(--solaris-card-radius) var(--solaris-card-radius) 0 0}:host ::ng-deep .solaris-card-media:not(:first-child){border-radius:var(--solaris-radius-none)}:host ::ng-deep .solaris-card-media img,:host ::ng-deep .solaris-card-media video,:host ::ng-deep .solaris-card-media picture{width:100%;display:block}:host ::ng-deep .solaris-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-0)}:host ::ng-deep .solaris-card-title{color:var(--solaris-text-strong);font-size:var(--solaris-font-size-lg);line-height:var(--solaris-line-height-sm);font-weight:var(--solaris-font-weight-semibold);margin:var(--solaris-spacing-0)}:host ::ng-deep .solaris-card-description{margin:var(--solaris-spacing-0);color:var(--solaris-text-muted);font-size:var(--solaris-font-size-sm);line-height:var(--solaris-line-height-md)}:host([data-appearance=glass]) ::ng-deep .solaris-card-description{color:var(--solaris-text-glass)}:host ::ng-deep *+.solaris-card-description{margin-top:var(--solaris-spacing-0)}:host([data-media-position=start]){display:grid;grid-template-columns:auto minmax(0,1fr);align-items:stretch}:host([data-media-position=start]) ::ng-deep .solaris-card-media{grid-row:1/-1;grid-column:1;align-self:center;width:var(--solaris-card-media-size);height:var(--solaris-card-media-size);border-radius:var(--solaris-radius-md)}:host([data-media-position=start]) ::ng-deep .solaris-card-media img,:host([data-media-position=start]) ::ng-deep .solaris-card-media video,:host([data-media-position=start]) ::ng-deep .solaris-card-media picture{width:100%;height:100%;object-fit:cover}:host([data-media-position=start]) ::ng-deep .solaris-card-header,:host([data-media-position=start]) ::ng-deep .solaris-card-content,:host([data-media-position=start]) ::ng-deep .solaris-card-footer,:host([data-media-position=start]) ::ng-deep .solaris-card-actions{grid-column:2;min-width:0}\n"] }]
2908
+ }], propDecorators: { appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], radius: [{ type: i0.Input, args: [{ isSignal: true, alias: "radius", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], glassTexture: [{ type: i0.Input, args: [{ isSignal: true, alias: "glassTexture", required: false }] }], mediaPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "mediaPosition", required: false }] }] } });
2907
2909
 
2908
2910
  class SolarisCardHeaderDirective {
2911
+ separator = input(true, { ...(ngDevMode ? { debugName: "separator" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
2909
2912
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisCardHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2910
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.22", type: SolarisCardHeaderDirective, isStandalone: true, selector: "[solaris-card-header]", host: { classAttribute: "solaris-card-header" }, ngImport: i0 });
2913
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.22", type: SolarisCardHeaderDirective, isStandalone: true, selector: "[solaris-card-header]", inputs: { separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-separator": "separator() ? '' : null" }, classAttribute: "solaris-card-header" }, ngImport: i0 });
2911
2914
  }
2912
2915
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisCardHeaderDirective, decorators: [{
2913
2916
  type: Directive,
@@ -2916,9 +2919,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImpo
2916
2919
  standalone: true,
2917
2920
  host: {
2918
2921
  class: 'solaris-card-header',
2922
+ '[attr.data-separator]': "separator() ? '' : null",
2919
2923
  },
2920
2924
  }]
2921
- }] });
2925
+ }], propDecorators: { separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }] } });
2922
2926
 
2923
2927
  class SolarisCardContentDirective {
2924
2928
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisCardContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -2951,7 +2955,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImpo
2951
2955
  }] });
2952
2956
 
2953
2957
  class SolarisCardFooterDirective {
2954
- separator = input(false, ...(ngDevMode ? [{ debugName: "separator" }] : /* istanbul ignore next */ []));
2958
+ separator = input(true, { ...(ngDevMode ? { debugName: "separator" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
2955
2959
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisCardFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
2956
2960
  static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.22", type: SolarisCardFooterDirective, isStandalone: true, selector: "[solaris-card-footer]", inputs: { separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-separator": "separator() ? '' : null" }, classAttribute: "solaris-card-footer" }, ngImport: i0 });
2957
2961
  }
@@ -9044,6 +9048,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImpo
9044
9048
  }, template: "<label class=\"solaris-radio__label\" [for]=\"elementId()\">\n <input\n type=\"radio\"\n class=\"solaris-radio__input\"\n [id]=\"elementId()\"\n [checked]=\"_checked()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [required]=\"required\"\n [attr.aria-label]=\"effectiveAriaLabel() ?? null\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.aria-describedby]=\"ariaDescribedBy()\"\n [attr.aria-invalid]=\"isEffectivelyInvalid() ? 'true' : null\"\n [attr.name]=\"effectiveName() ?? null\"\n (change)=\"onInputChange($event)\"\n (blur)=\"onBlur()\"\n (focus)=\"onFocus()\"\n #inputElement\n />\n <span class=\"solaris-radio__control\" aria-hidden=\"true\">\n @if (_checked()) {\n <span class=\"solaris-radio__dot\"></span>\n }\n </span>\n @if (hasProjectedContent()) {\n <span class=\"solaris-radio__label-text\" [id]=\"elementId() + '-label'\">\n <ng-content />\n </span>\n } @else if (labelText(); as text) {\n <span class=\"solaris-radio__label-text\" [id]=\"elementId() + '-label'\">\n {{ text }}\n </span>\n }\n</label>\n", styles: [":host{--solaris-radio-dot-color: transparent;--solaris-radio-background: transparent;--solaris-radio-ring-color: transparent;--solaris-radio-custom-surface: initial;--solaris-radio-custom-ring-color: initial;--solaris-radio-readonly-background: initial;--solaris-radio-custom-border-color: initial;--solaris-radio-gap: var(--solaris-spacing-2);--solaris-radio-size: var(--solaris-spacing-5);--solaris-radio-custom-indicator-color: initial;--solaris-radio-dot-size: var(--solaris-spacing-2);--solaris-radio-border-color: var(--solaris-primary-border);--solaris-radio-disabled-opacity: var(--solaris-opacity-50);--solaris-radio-label-font-size: var(--solaris-font-size-md);--solaris-radio-focus-ring-color: var(--solaris-primary-base);--solaris-radio-ring-width: var(--solaris-spacing-half);--solaris-radio-label-line-height: var(--solaris-line-height-md);outline:none;display:inline-flex;vertical-align:middle}.solaris-radio__label{cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;align-items:center;display:inline-flex;gap:var(--solaris-radio-gap)}.solaris-radio__input{width:0;height:0;margin:0;opacity:0;padding:0;position:absolute;pointer-events:none}.solaris-radio__control{display:flex;flex-shrink:0;border-radius:50%;position:relative;align-items:center;box-sizing:border-box;justify-content:center;width:var(--solaris-radio-size);height:var(--solaris-radio-size);background:var(--solaris-radio-background);border:var(--solaris-radio-ring-width) solid var(--solaris-radio-border-color);transition:background-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),border-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),box-shadow var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}.solaris-radio__dot{display:block;border-radius:50%;box-sizing:border-box;width:var(--solaris-radio-dot-size);height:var(--solaris-radio-dot-size);background:var(--solaris-radio-dot-color)}.solaris-radio__label-text{color:inherit;font-size:var(--solaris-radio-label-font-size);line-height:var(--solaris-radio-label-line-height)}:host([data-size=sm]){--solaris-radio-gap: var(--solaris-spacing-2);--solaris-radio-size: var(--solaris-spacing-4);--solaris-radio-label-font-size: var(--solaris-font-size-sm);--solaris-radio-dot-size: calc(var(--solaris-spacing-1) * 1.5);--solaris-radio-ring-width: var(--solaris-spacing-half);--solaris-radio-label-line-height: var(--solaris-line-height-sm)}:host([data-size=md]){--solaris-radio-gap: var(--solaris-spacing-2);--solaris-radio-size: var(--solaris-spacing-5);--solaris-radio-dot-size: var(--solaris-spacing-2);--solaris-radio-label-font-size: var(--solaris-font-size-md);--solaris-radio-ring-width: var(--solaris-spacing-half);--solaris-radio-label-line-height: var(--solaris-line-height-md)}:host([data-size=lg]){--solaris-radio-gap: var(--solaris-spacing-3);--solaris-radio-size: var(--solaris-spacing-6);--solaris-radio-label-font-size: var(--solaris-font-size-lg);--solaris-radio-dot-size: calc(var(--solaris-spacing-1) * 2.5);--solaris-radio-label-line-height: var(--solaris-line-height-lg);--solaris-radio-ring-width: calc(var(--solaris-spacing-1) * .75)}:host([data-density=compact]){--solaris-radio-gap: var(--solaris-spacing-1)}:host([data-density=normal]){--solaris-radio-gap: var(--solaris-spacing-2)}:host([data-density=comfortable]){--solaris-radio-gap: var(--solaris-spacing-3)}:host([data-appearance=outline]){--solaris-radio-background: transparent}:host([data-appearance=surface]){--solaris-radio-border-color: transparent;--solaris-radio-ring-width: var(--solaris-spacing-0);--solaris-radio-background: var(--solaris-surface-muted)}:host([data-appearance=surface][data-checked]){--solaris-radio-background: transparent;--solaris-radio-ring-width: var(--solaris-spacing-half)}:host([data-color=neutral]){--solaris-radio-border-color: var(--solaris-border-default)}:host([data-color=neutral][data-checked]){--solaris-radio-dot-color: var(--solaris-text-default);--solaris-radio-ring-color: var(--solaris-text-default);--solaris-radio-border-color: var(--solaris-text-default)}:host([data-color=primary]){--solaris-radio-border-color: var(--solaris-primary-border);--solaris-radio-focus-ring-color: var(--solaris-primary-base)}:host([data-color=primary][data-checked]){--solaris-radio-dot-color: var(--solaris-primary-base);--solaris-radio-ring-color: var(--solaris-primary-base);--solaris-radio-border-color: var(--solaris-primary-base)}:host([data-color=success]){--solaris-radio-border-color: var(--solaris-success-border);--solaris-radio-focus-ring-color: var(--solaris-success-base)}:host([data-color=success][data-checked]){--solaris-radio-dot-color: var(--solaris-success-base);--solaris-radio-ring-color: var(--solaris-success-base);--solaris-radio-border-color: var(--solaris-success-base)}:host([data-color=warning]){--solaris-radio-border-color: var(--solaris-warning-border);--solaris-radio-focus-ring-color: var(--solaris-warning-base)}:host([data-color=warning][data-checked]){--solaris-radio-dot-color: var(--solaris-warning-base);--solaris-radio-ring-color: var(--solaris-warning-base);--solaris-radio-border-color: var(--solaris-warning-base)}:host([data-color=danger]){--solaris-radio-border-color: var(--solaris-danger-border);--solaris-radio-focus-ring-color: var(--solaris-danger-base)}:host([data-color=danger][data-checked]){--solaris-radio-dot-color: var(--solaris-danger-base);--solaris-radio-ring-color: var(--solaris-danger-base);--solaris-radio-border-color: var(--solaris-danger-base)}:host([data-color=info]){--solaris-radio-border-color: var(--solaris-info-border);--solaris-radio-focus-ring-color: var(--solaris-info-base)}:host([data-color=info][data-checked]){--solaris-radio-dot-color: var(--solaris-info-base);--solaris-radio-ring-color: var(--solaris-info-base);--solaris-radio-border-color: var(--solaris-info-base)}:host([data-color=custom]){--solaris-radio-background: var(--solaris-radio-custom-surface);--solaris-radio-border-color: var(--solaris-radio-custom-border-color)}:host([data-color=custom][data-checked]){--solaris-radio-ring-color: var(--solaris-radio-custom-ring-color);--solaris-radio-border-color: var(--solaris-radio-custom-ring-color);--solaris-radio-dot-color: var(--solaris-radio-custom-indicator-color)}.solaris-radio__label:hover .solaris-radio__control{border-color:var(--solaris-radio-border-color)}:host([data-color=primary]) .solaris-radio__label:hover .solaris-radio__control{border-color:var(--solaris-primary-hover)}:host([data-color=success]) .solaris-radio__label:hover .solaris-radio__control{border-color:var(--solaris-success-hover)}:host([data-color=warning]) .solaris-radio__label:hover .solaris-radio__control{border-color:var(--solaris-warning-hover)}:host([data-color=danger]) .solaris-radio__label:hover .solaris-radio__control{border-color:var(--solaris-danger-hover)}:host([data-color=info]) .solaris-radio__label:hover .solaris-radio__control{border-color:var(--solaris-info-hover)}.solaris-radio__input:focus-visible+.solaris-radio__control{outline-offset:var(--solaris-spacing-half);outline:var(--solaris-border-width-sm) solid var(--solaris-radio-focus-ring-color)}:host([data-invalid]){--solaris-radio-border-color: var(--solaris-danger-base);--solaris-radio-focus-ring-color: var(--solaris-danger-base)}:host([data-invalid][data-checked]){--solaris-radio-dot-color: var(--solaris-danger-base);--solaris-radio-ring-color: var(--solaris-danger-base);--solaris-radio-border-color: var(--solaris-danger-base)}:host([data-invalid]) .solaris-radio__label:hover .solaris-radio__control{border-color:var(--solaris-danger-base)}:host([data-disabled]){--solaris-radio-disabled-opacity: var(--solaris-opacity-50)}:host([data-disabled]) .solaris-radio__label{cursor:not-allowed}:host([data-disabled]) .solaris-radio__control{opacity:var(--solaris-radio-disabled-opacity)}:host([data-disabled]) .solaris-radio__label-text{opacity:var(--solaris-radio-disabled-opacity)}:host([data-readonly]),:host([data-readonly][data-checked]){--solaris-radio-readonly-opacity: .65;--solaris-radio-dot-color: var(--solaris-text-muted);--solaris-radio-ring-color: var(--solaris-text-muted);--solaris-radio-border-color: var(--solaris-border-subtle)}:host([data-readonly]) .solaris-radio__label{cursor:not-allowed}:host([data-readonly]) .solaris-radio__control,:host([data-readonly]) .solaris-radio__label-text{opacity:var(--solaris-radio-readonly-opacity)}:host([data-readonly]) .solaris-radio__label:hover .solaris-radio__control{border-color:var(--solaris-radio-border-color)}:host([data-readonly][data-checked]) .solaris-radio__control{border-color:var(--solaris-radio-ring-color);background:var(--solaris-radio-readonly-background)}:host([data-readonly][data-checked]) .solaris-radio__dot{background:var(--solaris-radio-dot-color)}\n"] }]
9045
9049
  }], ctorParameters: () => [], propDecorators: { inputElementRef: [{ type: i0.ViewChild, args: ['inputElement', { isSignal: true }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonlyInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], requiredInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], invalidInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], radioLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelKey", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelKey", required: false }] }], checkedChange: [{ type: i0.Output, args: ["checkedChange"] }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }] } });
9046
9050
 
9051
+ class SolarisSelectionCardFooterDirective {
9052
+ separator = input(true, { ...(ngDevMode ? { debugName: "separator" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
9053
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
9054
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.22", type: SolarisSelectionCardFooterDirective, isStandalone: true, selector: "[solaris-selection-card-footer]", inputs: { separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-separator": "separator() ? '' : null" }, classAttribute: "solaris-selection-card-footer" }, ngImport: i0 });
9055
+ }
9056
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardFooterDirective, decorators: [{
9057
+ type: Directive,
9058
+ args: [{
9059
+ selector: '[solaris-selection-card-footer]',
9060
+ standalone: true,
9061
+ host: {
9062
+ class: 'solaris-selection-card-footer',
9063
+ '[attr.data-separator]': "separator() ? '' : null",
9064
+ },
9065
+ }]
9066
+ }], propDecorators: { separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }] } });
9067
+
9068
+ class SolarisSelectionCardHeaderDirective {
9069
+ separator = input(true, { ...(ngDevMode ? { debugName: "separator" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
9070
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
9071
+ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.22", type: SolarisSelectionCardHeaderDirective, isStandalone: true, selector: "[solaris-selection-card-header]", inputs: { separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-separator": "separator() ? '' : null" }, classAttribute: "solaris-selection-card-header" }, ngImport: i0 });
9072
+ }
9073
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardHeaderDirective, decorators: [{
9074
+ type: Directive,
9075
+ args: [{
9076
+ selector: '[solaris-selection-card-header]',
9077
+ standalone: true,
9078
+ host: {
9079
+ class: 'solaris-selection-card-header',
9080
+ '[attr.data-separator]': "separator() ? '' : null",
9081
+ },
9082
+ }]
9083
+ }], propDecorators: { separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }] } });
9084
+
9047
9085
  class SolarisSelectionCardMediaDirective {
9048
9086
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardMediaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
9049
9087
  static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.22", type: SolarisSelectionCardMediaDirective, isStandalone: true, selector: "[solaris-selection-card-media]", host: { classAttribute: "solaris-selection-card-media" }, ngImport: i0 });
@@ -9066,6 +9104,8 @@ class SolarisSelectionCardComponent extends SolarisFormControl {
9066
9104
  groupName = inject(SOLARIS_RADIO_GROUP_NAME, { optional: true }) ?? null;
9067
9105
  inputElementRef = viewChild('inputElement', ...(ngDevMode ? [{ debugName: "inputElementRef" }] : /* istanbul ignore next */ []));
9068
9106
  media = contentChild(SolarisSelectionCardMediaDirective, ...(ngDevMode ? [{ debugName: "media" }] : /* istanbul ignore next */ []));
9107
+ header = contentChild(SolarisSelectionCardHeaderDirective, ...(ngDevMode ? [{ debugName: "header" }] : /* istanbul ignore next */ []));
9108
+ footer = contentChild(SolarisSelectionCardFooterDirective, ...(ngDevMode ? [{ debugName: "footer" }] : /* istanbul ignore next */ []));
9069
9109
  _checked = signal(false, ...(ngDevMode ? [{ debugName: "_checked" }] : /* istanbul ignore next */ []));
9070
9110
  _focused = signal(false, ...(ngDevMode ? [{ debugName: "_focused" }] : /* istanbul ignore next */ []));
9071
9111
  _describedByIds = signal([], ...(ngDevMode ? [{ debugName: "_describedByIds" }] : /* istanbul ignore next */ []));
@@ -9088,6 +9128,9 @@ class SolarisSelectionCardComponent extends SolarisFormControl {
9088
9128
  size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
9089
9129
  radius = input('lg', ...(ngDevMode ? [{ debugName: "radius" }] : /* istanbul ignore next */ []));
9090
9130
  density = input(...(ngDevMode ? [undefined, { debugName: "density" }] : /* istanbul ignore next */ []));
9131
+ selection = input('radio', ...(ngDevMode ? [{ debugName: "selection" }] : /* istanbul ignore next */ []));
9132
+ selectionPosition = input('start', ...(ngDevMode ? [{ debugName: "selectionPosition" }] : /* istanbul ignore next */ []));
9133
+ mediaPosition = input('top', ...(ngDevMode ? [{ debugName: "mediaPosition" }] : /* istanbul ignore next */ []));
9091
9134
  name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : /* istanbul ignore next */ []));
9092
9135
  value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
9093
9136
  ariaLabel = input(...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
@@ -9097,12 +9140,16 @@ class SolarisSelectionCardComponent extends SolarisFormControl {
9097
9140
  themeService = inject(SolarisThemeService);
9098
9141
  effectiveDensity = computed(() => this.density() ?? this.themeService.density, ...(ngDevMode ? [{ debugName: "effectiveDensity" }] : /* istanbul ignore next */ []));
9099
9142
  hasMedia = computed(() => this.media() !== undefined, ...(ngDevMode ? [{ debugName: "hasMedia" }] : /* istanbul ignore next */ []));
9143
+ hasFooter = computed(() => this.footer() !== undefined, ...(ngDevMode ? [{ debugName: "hasFooter" }] : /* istanbul ignore next */ []));
9144
+ hasHeaderSeparator = computed(() => this.header()?.separator() ?? false, ...(ngDevMode ? [{ debugName: "hasHeaderSeparator" }] : /* istanbul ignore next */ []));
9145
+ hasFooterSeparator = computed(() => this.footer()?.separator() ?? false, ...(ngDevMode ? [{ debugName: "hasFooterSeparator" }] : /* istanbul ignore next */ []));
9146
+ isSwitchSelection = computed(() => this.selection() === 'switch', ...(ngDevMode ? [{ debugName: "isSwitchSelection" }] : /* istanbul ignore next */ []));
9100
9147
  isEffectivelyDisabled = computed(() => this.disabledInput() || this.cvaDisabled(), ...(ngDevMode ? [{ debugName: "isEffectivelyDisabled" }] : /* istanbul ignore next */ []));
9101
9148
  isEffectivelyReadonly = computed(() => this.readonlyInput() || this.cvaReadonly(), ...(ngDevMode ? [{ debugName: "isEffectivelyReadonly" }] : /* istanbul ignore next */ []));
9102
9149
  isEffectivelyInvalid = computed(() => this.invalidInput() ?? false, ...(ngDevMode ? [{ debugName: "isEffectivelyInvalid" }] : /* istanbul ignore next */ []));
9103
9150
  elementId = computed(() => resolveElementId(this.elementRef, 'solaris-selection-card'), ...(ngDevMode ? [{ debugName: "elementId" }] : /* istanbul ignore next */ []));
9104
9151
  contentId = computed(() => `${this.elementId()}-content`, ...(ngDevMode ? [{ debugName: "contentId" }] : /* istanbul ignore next */ []));
9105
- effectiveName = computed(() => this.name() ?? this.groupName, ...(ngDevMode ? [{ debugName: "effectiveName" }] : /* istanbul ignore next */ []));
9152
+ effectiveName = computed(() => this.name() ?? (this.isSwitchSelection() ? null : this.groupName), ...(ngDevMode ? [{ debugName: "effectiveName" }] : /* istanbul ignore next */ []));
9106
9153
  ariaDescribedBy = computed(() => {
9107
9154
  const ids = this._describedByIds();
9108
9155
  return ids.length > 0 ? ids.join(' ') : null;
@@ -9196,7 +9243,7 @@ class SolarisSelectionCardComponent extends SolarisFormControl {
9196
9243
  this.onTouched();
9197
9244
  }
9198
9245
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
9199
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.22", type: SolarisSelectionCardComponent, isStandalone: true, selector: "solaris-selection-card", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonlyInput: { classPropertyName: "readonlyInput", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, requiredInput: { classPropertyName: "requiredInput", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelKey: { classPropertyName: "ariaLabelKey", publicName: "ariaLabelKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checkedChange: "checkedChange", changeEvent: "changeEvent" }, host: { properties: { "attr.data-appearance": "appearance()", "attr.data-color": "color()", "attr.data-size": "size()", "attr.data-radius": "radius()", "attr.data-density": "effectiveDensity()", "attr.data-checked": "_checked() ? \"\" : null", "attr.data-disabled": "isEffectivelyDisabled() ? \"\" : null", "attr.data-readonly": "isEffectivelyReadonly() ? \"\" : null", "attr.data-invalid": "isEffectivelyInvalid() ? \"\" : null", "attr.data-focused": "_focused() ? \"\" : null", "attr.data-has-media": "hasMedia() ? \"\" : null" }, classAttribute: "solaris-selection-card" }, providers: [
9246
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.22", type: SolarisSelectionCardComponent, isStandalone: true, selector: "solaris-selection-card", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabledInput: { classPropertyName: "disabledInput", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonlyInput: { classPropertyName: "readonlyInput", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, requiredInput: { classPropertyName: "requiredInput", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, selectionPosition: { classPropertyName: "selectionPosition", publicName: "selectionPosition", isSignal: true, isRequired: false, transformFunction: null }, mediaPosition: { classPropertyName: "mediaPosition", publicName: "mediaPosition", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelKey: { classPropertyName: "ariaLabelKey", publicName: "ariaLabelKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checkedChange: "checkedChange", changeEvent: "changeEvent" }, host: { properties: { "attr.data-appearance": "appearance()", "attr.data-color": "color()", "attr.data-size": "size()", "attr.data-radius": "radius()", "attr.data-density": "effectiveDensity()", "attr.data-selection": "selection()", "attr.data-selection-position": "selectionPosition()", "attr.data-media-position": "mediaPosition()", "attr.data-checked": "_checked() ? \"\" : null", "attr.data-disabled": "isEffectivelyDisabled() ? \"\" : null", "attr.data-readonly": "isEffectivelyReadonly() ? \"\" : null", "attr.data-invalid": "isEffectivelyInvalid() ? \"\" : null", "attr.data-focused": "_focused() ? \"\" : null", "attr.data-has-media": "hasMedia() ? \"\" : null", "attr.data-has-footer": "hasFooter() ? \"\" : null", "attr.data-header-separator": "hasHeaderSeparator() ? \"\" : null", "attr.data-footer-separator": "hasFooterSeparator() ? \"\" : null" }, classAttribute: "solaris-selection-card" }, providers: [
9200
9247
  {
9201
9248
  provide: NG_VALUE_ACCESSOR,
9202
9249
  useExisting: forwardRef(() => SolarisSelectionCardComponent),
@@ -9210,7 +9257,7 @@ class SolarisSelectionCardComponent extends SolarisFormControl {
9210
9257
  provide: SOLARIS_RADIO_OPTION,
9211
9258
  useExisting: forwardRef(() => SolarisSelectionCardComponent),
9212
9259
  },
9213
- ], queries: [{ propertyName: "media", first: true, predicate: SolarisSelectionCardMediaDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<input\n #inputElement\n type=\"radio\"\n class=\"solaris-selection-card__input\"\n [id]=\"elementId()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [required]=\"required\"\n [attr.name]=\"effectiveName() ?? null\"\n [attr.aria-label]=\"effectiveAriaLabel() ?? null\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.aria-describedby]=\"ariaDescribedBy()\"\n [attr.aria-invalid]=\"isEffectivelyInvalid() ? 'true' : null\"\n [attr.aria-readonly]=\"isEffectivelyReadonly() ? 'true' : null\"\n (change)=\"onInputChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n/>\n<div class=\"solaris-selection-card__surface\">\n <ng-content select=\"[solaris-selection-card-media]\" />\n <div class=\"solaris-selection-card__body\">\n <span class=\"solaris-selection-card__control\" aria-hidden=\"true\">\n @if (_checked()) {\n <span class=\"solaris-selection-card__dot\"></span>\n }\n </span>\n <div class=\"solaris-selection-card__content\" [id]=\"contentId()\">\n <ng-content select=\"[solaris-selection-card-header]\" />\n <ng-content select=\"[solaris-selection-card-content]\" />\n <ng-content />\n <ng-content select=\"[solaris-selection-card-footer]\" />\n </div>\n </div>\n</div>\n", styles: [":host{--solaris-selection-card-gap: var(--solaris-spacing-4);--solaris-selection-card-radius: var(--solaris-radius-lg);--solaris-selection-card-padding: var(--solaris-spacing-6);--solaris-selection-card-color: var(--solaris-text-default);--solaris-selection-card-background: var(--solaris-surface-base);--solaris-selection-card-indicator-size: var(--solaris-spacing-5);--solaris-selection-card-border-color: var(--solaris-border-subtle);--solaris-selection-card-disabled-opacity: var(--solaris-opacity-50);--solaris-selection-card-border-width: var(--solaris-border-width-sm);--solaris-selection-card-indicator-dot-size: var(--solaris-spacing-2);--solaris-selection-card-hover-background: var(--solaris-surface-subtle);--solaris-selection-card-active-background: var(--solaris-surface-muted);--solaris-selection-card-focus-ring-color: var(--solaris-text-default);--solaris-selection-card-indicator-dot-color: var(--solaris-text-default);--solaris-selection-card-selected-background: var(--solaris-surface-muted);--solaris-selection-card-selected-border-color: var(--solaris-border-default);--solaris-selection-card-indicator-border-color: var( --solaris-border-default );--solaris-selection-card-glass-background: initial;--solaris-selection-card-glass-border-color: initial;--solaris-selection-card-custom-focus-ring-color: initial;--solaris-selection-card-custom-indicator-dot-color: initial;--solaris-selection-card-custom-selected-background: initial;--solaris-selection-card-custom-selected-border-color: initial;--solaris-selection-card-custom-indicator-border-color: initial;display:block;position:relative;box-sizing:border-box}.solaris-selection-card__input{inset:0;margin:0;opacity:0;width:100%;height:100%;cursor:pointer;position:absolute;z-index:var(--solaris-z-index-content)}.solaris-selection-card__surface{overflow:hidden;position:relative;box-sizing:border-box;color:var(--solaris-selection-card-color);border-radius:var(--solaris-selection-card-radius);background:var(--solaris-selection-card-background);border:var(--solaris-selection-card-border-width) solid var(--solaris-selection-card-border-color);transition:background-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),border-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),box-shadow var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}.solaris-selection-card__body{display:flex;min-height:var(--solaris-density-min-height);box-sizing:border-box;align-items:flex-start;gap:var(--solaris-selection-card-gap);padding:var(--solaris-selection-card-padding)}.solaris-selection-card__content{flex:1;min-width:0}.solaris-selection-card__control{display:flex;flex-shrink:0;border-radius:50%;align-items:center;box-sizing:border-box;justify-content:center;width:var(--solaris-selection-card-indicator-size);height:var(--solaris-selection-card-indicator-size);border:var(--solaris-border-width-sm) solid var(--solaris-selection-card-indicator-border-color)}:host([data-has-media]) .solaris-selection-card__control{top:var(--solaris-selection-card-padding);right:var(--solaris-selection-card-padding);position:absolute;background:var(--solaris-surface-base)}.solaris-selection-card__dot{display:block;border-radius:50%;width:var(--solaris-selection-card-indicator-dot-size);height:var(--solaris-selection-card-indicator-dot-size);background:var(--solaris-selection-card-indicator-dot-color)}:host ::ng-deep .solaris-selection-card-media{margin:0;display:block;overflow:hidden}:host ::ng-deep .solaris-selection-card-media img,:host ::ng-deep .solaris-selection-card-media video,:host ::ng-deep .solaris-selection-card-media picture{width:100%;display:block}:host ::ng-deep .solaris-selection-card-header{display:flex;flex-direction:column;gap:var(--solaris-spacing-1)}:host ::ng-deep .solaris-selection-card-content{display:block;margin-top:var(--solaris-selection-card-gap)}:host ::ng-deep .solaris-selection-card-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-2);margin-top:var(--solaris-selection-card-gap)}:host ::ng-deep .solaris-selection-card-footer[data-separator]{padding-top:var(--solaris-selection-card-gap);border-top:var(--solaris-border-width-sm) solid var(--solaris-selection-card-border-color)}:host ::ng-deep .solaris-selection-card-title{margin:0;color:var(--solaris-text-strong);font:var(--solaris-font-weight-semibold) var(--solaris-font-size-lg)/var(--solaris-line-height-sm) var(--solaris-font-family-sans)}:host ::ng-deep .solaris-selection-card-description{margin:0;color:var(--solaris-text-muted);font:var(--solaris-font-weight-regular) var(--solaris-font-size-sm)/var(--solaris-line-height-md) var(--solaris-font-family-sans)}:host([data-size=sm]){--solaris-selection-card-gap: var(--solaris-spacing-3);--solaris-selection-card-padding: var(--solaris-spacing-4);--solaris-selection-card-indicator-size: var(--solaris-spacing-4);--solaris-selection-card-indicator-dot-size: calc( var(--solaris-spacing-1) * 1.5 )}:host([data-size=lg]){--solaris-selection-card-gap: var(--solaris-spacing-5);--solaris-selection-card-padding: var(--solaris-spacing-8);--solaris-selection-card-indicator-size: var(--solaris-spacing-6);--solaris-selection-card-indicator-dot-size: calc( var(--solaris-spacing-1) * 2.5 )}:host([data-density=compact]){--solaris-selection-card-gap: var(--solaris-density-gap-lg);--solaris-selection-card-padding: var(--solaris-density-padding-xl)}:host([data-density=comfortable]){--solaris-selection-card-gap: var(--solaris-density-gap-lg);--solaris-selection-card-padding: var(--solaris-density-padding-xl)}:host([data-radius=none]){--solaris-selection-card-radius: var(--solaris-radius-none)}:host([data-radius=sm]){--solaris-selection-card-radius: var(--solaris-radius-sm)}:host([data-radius=xl]){--solaris-selection-card-radius: var(--solaris-radius-xl)}:host([data-appearance=outline]){--solaris-selection-card-background: transparent;--solaris-selection-card-border-color: var(--solaris-border-default)}:host([data-appearance=tonal]){--solaris-selection-card-background: var(--solaris-surface-subtle);--solaris-selection-card-border-color: var(--solaris-border-subtle)}:host([data-appearance=glass]) .solaris-selection-card__surface{--solaris-selection-card-color: var(--solaris-text-glass);--solaris-selection-card-glass-background: var(--solaris-glass-background);--solaris-selection-card-glass-border-color: var( --solaris-glass-border-color );isolation:isolate;background:var(--solaris-selection-card-glass-background);border-color:var(--solaris-selection-card-glass-border-color);box-shadow:var(--solaris-glass-shadow);backdrop-filter:var(--solaris-glass-backdrop-filter);-webkit-backdrop-filter:var(--solaris-glass-backdrop-filter)}:host([data-appearance=glass][data-checked]) .solaris-selection-card__surface{background:var(--solaris-selection-card-background);border-color:var(--solaris-selection-card-border-color)}:host([data-appearance=glass]) ::ng-deep .solaris-selection-card-description{color:var(--solaris-text-glass)}:host([data-color=primary]){--solaris-selection-card-focus-ring-color: var(--solaris-primary-base);--solaris-selection-card-indicator-dot-color: var(--solaris-primary-base);--solaris-selection-card-selected-background: var(--solaris-primary-surface);--solaris-selection-card-selected-border-color: var(--solaris-primary-border);--solaris-selection-card-indicator-border-color: var( --solaris-primary-border )}:host([data-color=success]){--solaris-selection-card-focus-ring-color: var(--solaris-success-base);--solaris-selection-card-indicator-dot-color: var(--solaris-success-base);--solaris-selection-card-selected-background: var(--solaris-success-surface);--solaris-selection-card-selected-border-color: var(--solaris-success-border);--solaris-selection-card-indicator-border-color: var( --solaris-success-border )}:host([data-color=warning]){--solaris-selection-card-focus-ring-color: var(--solaris-warning-base);--solaris-selection-card-indicator-dot-color: var(--solaris-warning-base);--solaris-selection-card-selected-background: var(--solaris-warning-surface);--solaris-selection-card-selected-border-color: var(--solaris-warning-border);--solaris-selection-card-indicator-border-color: var( --solaris-warning-border )}:host([data-color=danger]){--solaris-selection-card-focus-ring-color: var(--solaris-danger-base);--solaris-selection-card-indicator-dot-color: var(--solaris-danger-base);--solaris-selection-card-selected-background: var(--solaris-danger-surface);--solaris-selection-card-selected-border-color: var(--solaris-danger-border);--solaris-selection-card-indicator-border-color: var(--solaris-danger-border)}:host([data-color=info]){--solaris-selection-card-focus-ring-color: var(--solaris-info-base);--solaris-selection-card-indicator-dot-color: var(--solaris-info-base);--solaris-selection-card-selected-background: var(--solaris-info-surface);--solaris-selection-card-selected-border-color: var(--solaris-info-border);--solaris-selection-card-indicator-border-color: var(--solaris-info-border)}:host([data-color=custom]){--solaris-selection-card-focus-ring-color: var( --solaris-selection-card-custom-focus-ring-color );--solaris-selection-card-indicator-dot-color: var( --solaris-selection-card-custom-indicator-dot-color );--solaris-selection-card-selected-background: var( --solaris-selection-card-custom-selected-background );--solaris-selection-card-selected-border-color: var( --solaris-selection-card-custom-selected-border-color );--solaris-selection-card-indicator-border-color: var( --solaris-selection-card-custom-indicator-border-color )}:host(:not([data-disabled],[data-readonly])) .solaris-selection-card__input:hover+.solaris-selection-card__surface{background:var(--solaris-selection-card-hover-background)}:host(:not([data-disabled],[data-readonly])) .solaris-selection-card__input:active+.solaris-selection-card__surface{background:var(--solaris-selection-card-active-background)}:host([data-checked]){--solaris-selection-card-background: var( --solaris-selection-card-selected-background );--solaris-selection-card-border-color: var( --solaris-selection-card-selected-border-color )}.solaris-selection-card__input:focus-visible+.solaris-selection-card__surface{outline-offset:var(--solaris-focus-ring-offset);outline:var(--solaris-focus-ring-width) var(--solaris-focus-ring-style) var(--solaris-selection-card-focus-ring-color)}:host([data-invalid]){--solaris-selection-card-border-color: var(--solaris-danger-border);--solaris-selection-card-focus-ring-color: var(--solaris-danger-base);--solaris-selection-card-indicator-dot-color: var(--solaris-danger-base);--solaris-selection-card-indicator-border-color: var(--solaris-danger-border)}:host([data-disabled]) .solaris-selection-card__surface{cursor:not-allowed;opacity:var(--solaris-selection-card-disabled-opacity)}:host([data-readonly]) .solaris-selection-card__input{cursor:not-allowed}:host([data-readonly]) .solaris-selection-card__surface{cursor:default;opacity:var(--solaris-selection-card-disabled-opacity)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
9260
+ ], queries: [{ propertyName: "media", first: true, predicate: SolarisSelectionCardMediaDirective, descendants: true, isSignal: true }, { propertyName: "header", first: true, predicate: SolarisSelectionCardHeaderDirective, descendants: true, isSignal: true }, { propertyName: "footer", first: true, predicate: SolarisSelectionCardFooterDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<input\n #inputElement\n [type]=\"isSwitchSelection() ? 'checkbox' : 'radio'\"\n [attr.role]=\"isSwitchSelection() ? 'switch' : null\"\n class=\"solaris-selection-card__input\"\n [id]=\"elementId()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [required]=\"required\"\n [attr.name]=\"effectiveName() ?? null\"\n [attr.aria-label]=\"effectiveAriaLabel() ?? null\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.aria-describedby]=\"ariaDescribedBy()\"\n [attr.aria-invalid]=\"isEffectivelyInvalid() ? 'true' : null\"\n [attr.aria-readonly]=\"isEffectivelyReadonly() ? 'true' : null\"\n (change)=\"onInputChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n/>\n<div class=\"solaris-selection-card__surface\">\n <ng-content select=\"[solaris-selection-card-media]\" />\n <div class=\"solaris-selection-card__body\">\n <div class=\"solaris-selection-card__top-row\">\n @if (!isSwitchSelection() && selectionPosition() === 'start') {\n <span class=\"solaris-selection-card__control\" aria-hidden=\"true\">\n @if (_checked()) {\n <span class=\"solaris-selection-card__dot\"></span>\n }\n </span>\n }\n <div class=\"solaris-selection-card__header\">\n <ng-content select=\"[solaris-selection-card-header]\" />\n </div>\n @if (!isSwitchSelection() && selectionPosition() === 'end') {\n <span class=\"solaris-selection-card__control\" aria-hidden=\"true\">\n @if (_checked()) {\n <span class=\"solaris-selection-card__dot\"></span>\n }\n </span>\n }\n </div>\n @if (hasHeaderSeparator()) {\n <div class=\"solaris-selection-card__separator\" aria-hidden=\"true\"></div>\n }\n <div class=\"solaris-selection-card__content\" [id]=\"contentId()\">\n <ng-content select=\"[solaris-selection-card-content]\" />\n <ng-content />\n </div>\n </div>\n @if (isSwitchSelection() || hasFooter()) {\n <div class=\"solaris-selection-card__footer\">\n @if (isSwitchSelection() && selectionPosition() === 'start') {\n <span class=\"solaris-selection-card__switch\" aria-hidden=\"true\">\n <span class=\"solaris-selection-card__switch-thumb\"></span>\n </span>\n }\n <ng-content select=\"[solaris-selection-card-footer]\" />\n @if (isSwitchSelection() && selectionPosition() === 'end') {\n <span class=\"solaris-selection-card__switch\" aria-hidden=\"true\">\n <span class=\"solaris-selection-card__switch-thumb\"></span>\n </span>\n }\n </div>\n }\n</div>\n", styles: [":host{--solaris-selection-card-gap: var(--solaris-spacing-0);--solaris-selection-card-radius: var(--solaris-radius-lg);--solaris-selection-card-padding: var(--solaris-spacing-0);--solaris-selection-card-color: var(--solaris-text-default);--solaris-selection-card-background: var(--solaris-surface-base);--solaris-selection-card-indicator-size: var(--solaris-spacing-5);--solaris-selection-card-border-color: var(--solaris-border-strong);--solaris-selection-card-disabled-opacity: var(--solaris-opacity-50);--solaris-selection-card-border-width: var(--solaris-border-width-sm);--solaris-selection-card-indicator-dot-size: var(--solaris-spacing-2);--solaris-selection-card-hover-background: var(--solaris-surface-subtle);--solaris-selection-card-active-background: var(--solaris-surface-muted);--solaris-selection-card-focus-ring-color: var(--solaris-text-default);--solaris-selection-card-indicator-dot-color: var(--solaris-text-default);--solaris-selection-card-selected-background: var(--solaris-surface-muted);--solaris-selection-card-selected-border-color: var(--solaris-border-default);--solaris-selection-card-header-border-color: var(--solaris-border-strong);--solaris-selection-card-footer-border-color: var(--solaris-border-strong);--solaris-selection-card-media-size: var(--solaris-spacing-12);--solaris-selection-card-switch-track-width: calc( var(--solaris-spacing-8) + var(--solaris-spacing-1) / 2 );--solaris-selection-card-switch-track-height: calc( var(--solaris-spacing-4) + var(--solaris-spacing-3) / 4 );--solaris-selection-card-switch-thumb-size: var(--solaris-spacing-3);--solaris-selection-card-switch-thumb-offset: var(--solaris-spacing-half);--solaris-selection-card-switch-track-background: var( --solaris-surface-muted );--solaris-selection-card-switch-thumb-background: var( --solaris-surface-raised );--solaris-selection-card-indicator-border-color: var( --solaris-border-default );--solaris-selection-card-glass-background: initial;--solaris-selection-card-glass-border-color: initial;--solaris-selection-card-custom-focus-ring-color: initial;--solaris-selection-card-custom-indicator-dot-color: initial;--solaris-selection-card-custom-selected-background: initial;--solaris-selection-card-custom-selected-border-color: initial;--solaris-selection-card-custom-indicator-border-color: initial;display:block;position:relative;box-sizing:border-box}.solaris-selection-card__input{inset:0;margin:0;opacity:0;width:100%;height:100%;cursor:pointer;position:absolute;z-index:var(--solaris-z-index-content)}.solaris-selection-card__surface{overflow:hidden;position:relative;box-sizing:border-box;color:var(--solaris-selection-card-color);border-radius:var(--solaris-selection-card-radius);background:var(--solaris-selection-card-background);border:var(--solaris-selection-card-border-width) solid var(--solaris-selection-card-border-color);transition:background-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),border-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),box-shadow var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}.solaris-selection-card__body{display:flex;min-height:var(--solaris-density-min-height);box-sizing:border-box;flex-direction:column;gap:var(--solaris-selection-card-gap);padding:var(--solaris-selection-card-padding)}.solaris-selection-card__top-row{display:flex;align-items:flex-start;box-sizing:border-box;gap:var(--solaris-selection-card-gap)}.solaris-selection-card__header{flex:1;min-width:0}.solaris-selection-card__separator{border-bottom:var(--solaris-border-width-sm) solid var(--solaris-selection-card-header-border-color)}.solaris-selection-card__content{flex:1;min-width:0}.solaris-selection-card__control{display:flex;flex-shrink:0;border-radius:50%;align-items:center;box-sizing:border-box;justify-content:center;width:var(--solaris-selection-card-indicator-size);height:var(--solaris-selection-card-indicator-size);border:var(--solaris-border-width-sm) solid var(--solaris-selection-card-indicator-border-color)}:host([data-has-media]:not([data-media-position=start])) .solaris-selection-card__control{top:var(--solaris-selection-card-padding);right:var(--solaris-selection-card-padding);position:absolute;background:var(--solaris-surface-base)}.solaris-selection-card__footer{display:flex;align-items:center;box-sizing:border-box;gap:var(--solaris-selection-card-gap);padding:var(--solaris-selection-card-padding)}.solaris-selection-card__footer:empty{display:none}:host([data-selection-position=end]) .solaris-selection-card__footer{justify-content:flex-end}:host ::ng-deep .solaris-selection-card__footer .solaris-selection-card-footer{flex:1;min-width:0;margin-top:var(--solaris-spacing-0)}.solaris-selection-card__switch{display:flex;flex-shrink:0;position:relative;align-items:center;box-sizing:border-box;width:var(--solaris-selection-card-switch-track-width);height:var(--solaris-selection-card-switch-track-height);background:var(--solaris-selection-card-switch-track-background);border-radius:calc(var(--solaris-selection-card-switch-track-height) / 2);border:var(--solaris-border-width-sm) solid var(--solaris-selection-card-indicator-border-color);transition:background-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),border-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}.solaris-selection-card__switch-thumb{display:block;position:absolute;border-radius:50%;top:50%;transform:translateY(-50%);left:var(--solaris-selection-card-switch-thumb-offset);width:var(--solaris-selection-card-switch-thumb-size);height:var(--solaris-selection-card-switch-thumb-size);background:var(--solaris-selection-card-switch-thumb-background);transition:left var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}:host([data-checked]) .solaris-selection-card__switch-thumb{left:calc(100% - var(--solaris-selection-card-switch-thumb-size) - var(--solaris-selection-card-switch-thumb-offset))}.solaris-selection-card__dot{display:block;border-radius:50%;width:var(--solaris-selection-card-indicator-dot-size);height:var(--solaris-selection-card-indicator-dot-size);background:var(--solaris-selection-card-indicator-dot-color)}:host ::ng-deep .solaris-selection-card-media{margin:0;display:block;overflow:hidden}:host ::ng-deep .solaris-selection-card-media img,:host ::ng-deep .solaris-selection-card-media video,:host ::ng-deep .solaris-selection-card-media picture{width:100%;display:block}:host ::ng-deep .solaris-selection-card-header{display:flex;flex-direction:column;gap:var(--solaris-spacing-0)}:host ::ng-deep .solaris-selection-card-content{display:block;margin-top:var(--solaris-spacing-0)}:host ::ng-deep .solaris-selection-card-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-0);margin-top:var(--solaris-spacing-0)}:host([data-footer-separator]) .solaris-selection-card__footer{border-top:var(--solaris-border-width-sm) solid var(--solaris-selection-card-footer-border-color)}:host ::ng-deep .solaris-selection-card-title{margin:0;color:var(--solaris-text-strong);font:var(--solaris-font-weight-semibold) var(--solaris-font-size-lg)/var(--solaris-line-height-sm) var(--solaris-font-family-sans)}:host ::ng-deep .solaris-selection-card-description{margin:0;color:var(--solaris-text-muted);font:var(--solaris-font-weight-regular) var(--solaris-font-size-sm)/var(--solaris-line-height-md) var(--solaris-font-family-sans)}:host([data-size=sm]){--solaris-selection-card-media-size: var(--solaris-spacing-10);--solaris-selection-card-indicator-size: var(--solaris-spacing-4);--solaris-selection-card-indicator-dot-size: calc( var(--solaris-spacing-1) * 1.5 )}:host([data-size=lg]){--solaris-selection-card-media-size: var(--solaris-spacing-16);--solaris-selection-card-indicator-size: var(--solaris-spacing-6);--solaris-selection-card-indicator-dot-size: calc( var(--solaris-spacing-1) * 2.5 )}:host([data-media-position=start]) .solaris-selection-card__surface{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center}:host([data-media-position=start]) ::ng-deep .solaris-selection-card-media{grid-row:1/-1;grid-column:1;align-self:center;width:var(--solaris-selection-card-media-size);height:var(--solaris-selection-card-media-size);margin:var(--solaris-selection-card-padding);margin-inline-end:var(--solaris-spacing-0);border-radius:var(--solaris-radius-md)}:host([data-media-position=start]) ::ng-deep .solaris-selection-card-media img,:host([data-media-position=start]) ::ng-deep .solaris-selection-card-media video,:host([data-media-position=start]) ::ng-deep .solaris-selection-card-media picture{width:100%;height:100%;object-fit:cover}:host([data-media-position=start]) .solaris-selection-card__body{grid-column:2;min-width:0}:host([data-media-position=start]) .solaris-selection-card__footer{grid-column:2;min-width:0}:host([data-radius=none]){--solaris-selection-card-radius: var(--solaris-radius-none)}:host([data-radius=sm]){--solaris-selection-card-radius: var(--solaris-radius-sm)}:host([data-radius=xl]){--solaris-selection-card-radius: var(--solaris-radius-xl)}:host([data-appearance=outline]){--solaris-selection-card-background: transparent;--solaris-selection-card-border-color: var(--solaris-border-default)}:host([data-appearance=tonal]){--solaris-selection-card-background: var(--solaris-surface-subtle);--solaris-selection-card-border-color: var(--solaris-border-subtle)}:host([data-appearance=glass]) .solaris-selection-card__surface{--solaris-selection-card-color: var(--solaris-text-glass);--solaris-selection-card-glass-background: var(--solaris-glass-background);--solaris-selection-card-glass-border-color: var( --solaris-glass-border-color );isolation:isolate;background:var(--solaris-selection-card-glass-background);border-color:var(--solaris-selection-card-glass-border-color);box-shadow:var(--solaris-glass-shadow);backdrop-filter:var(--solaris-glass-backdrop-filter);-webkit-backdrop-filter:var(--solaris-glass-backdrop-filter)}:host([data-appearance=glass][data-checked]) .solaris-selection-card__surface{background:var(--solaris-selection-card-background);border-color:var(--solaris-selection-card-border-color)}:host([data-appearance=glass]) ::ng-deep .solaris-selection-card-description{color:var(--solaris-text-glass)}:host([data-color=primary]){--solaris-selection-card-focus-ring-color: var(--solaris-primary-base);--solaris-selection-card-indicator-dot-color: var(--solaris-primary-base);--solaris-selection-card-selected-background: var(--solaris-primary-surface);--solaris-selection-card-selected-border-color: var(--solaris-primary-border);--solaris-selection-card-indicator-border-color: var( --solaris-primary-border )}:host([data-color=success]){--solaris-selection-card-focus-ring-color: var(--solaris-success-base);--solaris-selection-card-indicator-dot-color: var(--solaris-success-base);--solaris-selection-card-selected-background: var(--solaris-success-surface);--solaris-selection-card-selected-border-color: var(--solaris-success-border);--solaris-selection-card-indicator-border-color: var( --solaris-success-border )}:host([data-color=warning]){--solaris-selection-card-focus-ring-color: var(--solaris-warning-base);--solaris-selection-card-indicator-dot-color: var(--solaris-warning-base);--solaris-selection-card-selected-background: var(--solaris-warning-surface);--solaris-selection-card-selected-border-color: var(--solaris-warning-border);--solaris-selection-card-indicator-border-color: var( --solaris-warning-border )}:host([data-color=danger]){--solaris-selection-card-focus-ring-color: var(--solaris-danger-base);--solaris-selection-card-indicator-dot-color: var(--solaris-danger-base);--solaris-selection-card-selected-background: var(--solaris-danger-surface);--solaris-selection-card-selected-border-color: var(--solaris-danger-border);--solaris-selection-card-indicator-border-color: var(--solaris-danger-border)}:host([data-color=info]){--solaris-selection-card-focus-ring-color: var(--solaris-info-base);--solaris-selection-card-indicator-dot-color: var(--solaris-info-base);--solaris-selection-card-selected-background: var(--solaris-info-surface);--solaris-selection-card-selected-border-color: var(--solaris-info-border);--solaris-selection-card-indicator-border-color: var(--solaris-info-border)}:host([data-color=custom]){--solaris-selection-card-focus-ring-color: var( --solaris-selection-card-custom-focus-ring-color );--solaris-selection-card-indicator-dot-color: var( --solaris-selection-card-custom-indicator-dot-color );--solaris-selection-card-selected-background: var( --solaris-selection-card-custom-selected-background );--solaris-selection-card-selected-border-color: var( --solaris-selection-card-custom-selected-border-color );--solaris-selection-card-indicator-border-color: var( --solaris-selection-card-custom-indicator-border-color )}:host([data-selection=switch][data-checked]) .solaris-selection-card__switch{background:var(--solaris-selection-card-focus-ring-color);border-color:var(--solaris-selection-card-focus-ring-color)}:host(:not([data-disabled],[data-readonly])) .solaris-selection-card__input:hover+.solaris-selection-card__surface{background:var(--solaris-selection-card-hover-background)}:host(:not([data-disabled],[data-readonly])) .solaris-selection-card__input:active+.solaris-selection-card__surface{background:var(--solaris-selection-card-active-background)}:host([data-checked]){--solaris-selection-card-background: var( --solaris-selection-card-selected-background );--solaris-selection-card-border-color: var( --solaris-selection-card-selected-border-color )}.solaris-selection-card__input:focus-visible+.solaris-selection-card__surface{outline-offset:var(--solaris-focus-ring-offset);outline:var(--solaris-focus-ring-width) var(--solaris-focus-ring-style) var(--solaris-selection-card-focus-ring-color)}:host([data-invalid]){--solaris-selection-card-border-color: var(--solaris-danger-border);--solaris-selection-card-focus-ring-color: var(--solaris-danger-base);--solaris-selection-card-indicator-dot-color: var(--solaris-danger-base);--solaris-selection-card-indicator-border-color: var(--solaris-danger-border)}:host([data-disabled]) .solaris-selection-card__surface{cursor:not-allowed;opacity:var(--solaris-selection-card-disabled-opacity)}:host([data-readonly]) .solaris-selection-card__input{cursor:not-allowed}:host([data-readonly]) .solaris-selection-card__surface{cursor:default;opacity:var(--solaris-selection-card-disabled-opacity)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
9214
9261
  }
9215
9262
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardComponent, decorators: [{
9216
9263
  type: Component,
@@ -9235,14 +9282,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImpo
9235
9282
  '[attr.data-size]': 'size()',
9236
9283
  '[attr.data-radius]': 'radius()',
9237
9284
  '[attr.data-density]': 'effectiveDensity()',
9285
+ '[attr.data-selection]': 'selection()',
9286
+ '[attr.data-selection-position]': 'selectionPosition()',
9287
+ '[attr.data-media-position]': 'mediaPosition()',
9238
9288
  '[attr.data-checked]': '_checked() ? "" : null',
9239
9289
  '[attr.data-disabled]': 'isEffectivelyDisabled() ? "" : null',
9240
9290
  '[attr.data-readonly]': 'isEffectivelyReadonly() ? "" : null',
9241
9291
  '[attr.data-invalid]': 'isEffectivelyInvalid() ? "" : null',
9242
9292
  '[attr.data-focused]': '_focused() ? "" : null',
9243
9293
  '[attr.data-has-media]': 'hasMedia() ? "" : null',
9244
- }, template: "<input\n #inputElement\n type=\"radio\"\n class=\"solaris-selection-card__input\"\n [id]=\"elementId()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [required]=\"required\"\n [attr.name]=\"effectiveName() ?? null\"\n [attr.aria-label]=\"effectiveAriaLabel() ?? null\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.aria-describedby]=\"ariaDescribedBy()\"\n [attr.aria-invalid]=\"isEffectivelyInvalid() ? 'true' : null\"\n [attr.aria-readonly]=\"isEffectivelyReadonly() ? 'true' : null\"\n (change)=\"onInputChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n/>\n<div class=\"solaris-selection-card__surface\">\n <ng-content select=\"[solaris-selection-card-media]\" />\n <div class=\"solaris-selection-card__body\">\n <span class=\"solaris-selection-card__control\" aria-hidden=\"true\">\n @if (_checked()) {\n <span class=\"solaris-selection-card__dot\"></span>\n }\n </span>\n <div class=\"solaris-selection-card__content\" [id]=\"contentId()\">\n <ng-content select=\"[solaris-selection-card-header]\" />\n <ng-content select=\"[solaris-selection-card-content]\" />\n <ng-content />\n <ng-content select=\"[solaris-selection-card-footer]\" />\n </div>\n </div>\n</div>\n", styles: [":host{--solaris-selection-card-gap: var(--solaris-spacing-4);--solaris-selection-card-radius: var(--solaris-radius-lg);--solaris-selection-card-padding: var(--solaris-spacing-6);--solaris-selection-card-color: var(--solaris-text-default);--solaris-selection-card-background: var(--solaris-surface-base);--solaris-selection-card-indicator-size: var(--solaris-spacing-5);--solaris-selection-card-border-color: var(--solaris-border-subtle);--solaris-selection-card-disabled-opacity: var(--solaris-opacity-50);--solaris-selection-card-border-width: var(--solaris-border-width-sm);--solaris-selection-card-indicator-dot-size: var(--solaris-spacing-2);--solaris-selection-card-hover-background: var(--solaris-surface-subtle);--solaris-selection-card-active-background: var(--solaris-surface-muted);--solaris-selection-card-focus-ring-color: var(--solaris-text-default);--solaris-selection-card-indicator-dot-color: var(--solaris-text-default);--solaris-selection-card-selected-background: var(--solaris-surface-muted);--solaris-selection-card-selected-border-color: var(--solaris-border-default);--solaris-selection-card-indicator-border-color: var( --solaris-border-default );--solaris-selection-card-glass-background: initial;--solaris-selection-card-glass-border-color: initial;--solaris-selection-card-custom-focus-ring-color: initial;--solaris-selection-card-custom-indicator-dot-color: initial;--solaris-selection-card-custom-selected-background: initial;--solaris-selection-card-custom-selected-border-color: initial;--solaris-selection-card-custom-indicator-border-color: initial;display:block;position:relative;box-sizing:border-box}.solaris-selection-card__input{inset:0;margin:0;opacity:0;width:100%;height:100%;cursor:pointer;position:absolute;z-index:var(--solaris-z-index-content)}.solaris-selection-card__surface{overflow:hidden;position:relative;box-sizing:border-box;color:var(--solaris-selection-card-color);border-radius:var(--solaris-selection-card-radius);background:var(--solaris-selection-card-background);border:var(--solaris-selection-card-border-width) solid var(--solaris-selection-card-border-color);transition:background-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),border-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),box-shadow var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}.solaris-selection-card__body{display:flex;min-height:var(--solaris-density-min-height);box-sizing:border-box;align-items:flex-start;gap:var(--solaris-selection-card-gap);padding:var(--solaris-selection-card-padding)}.solaris-selection-card__content{flex:1;min-width:0}.solaris-selection-card__control{display:flex;flex-shrink:0;border-radius:50%;align-items:center;box-sizing:border-box;justify-content:center;width:var(--solaris-selection-card-indicator-size);height:var(--solaris-selection-card-indicator-size);border:var(--solaris-border-width-sm) solid var(--solaris-selection-card-indicator-border-color)}:host([data-has-media]) .solaris-selection-card__control{top:var(--solaris-selection-card-padding);right:var(--solaris-selection-card-padding);position:absolute;background:var(--solaris-surface-base)}.solaris-selection-card__dot{display:block;border-radius:50%;width:var(--solaris-selection-card-indicator-dot-size);height:var(--solaris-selection-card-indicator-dot-size);background:var(--solaris-selection-card-indicator-dot-color)}:host ::ng-deep .solaris-selection-card-media{margin:0;display:block;overflow:hidden}:host ::ng-deep .solaris-selection-card-media img,:host ::ng-deep .solaris-selection-card-media video,:host ::ng-deep .solaris-selection-card-media picture{width:100%;display:block}:host ::ng-deep .solaris-selection-card-header{display:flex;flex-direction:column;gap:var(--solaris-spacing-1)}:host ::ng-deep .solaris-selection-card-content{display:block;margin-top:var(--solaris-selection-card-gap)}:host ::ng-deep .solaris-selection-card-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-2);margin-top:var(--solaris-selection-card-gap)}:host ::ng-deep .solaris-selection-card-footer[data-separator]{padding-top:var(--solaris-selection-card-gap);border-top:var(--solaris-border-width-sm) solid var(--solaris-selection-card-border-color)}:host ::ng-deep .solaris-selection-card-title{margin:0;color:var(--solaris-text-strong);font:var(--solaris-font-weight-semibold) var(--solaris-font-size-lg)/var(--solaris-line-height-sm) var(--solaris-font-family-sans)}:host ::ng-deep .solaris-selection-card-description{margin:0;color:var(--solaris-text-muted);font:var(--solaris-font-weight-regular) var(--solaris-font-size-sm)/var(--solaris-line-height-md) var(--solaris-font-family-sans)}:host([data-size=sm]){--solaris-selection-card-gap: var(--solaris-spacing-3);--solaris-selection-card-padding: var(--solaris-spacing-4);--solaris-selection-card-indicator-size: var(--solaris-spacing-4);--solaris-selection-card-indicator-dot-size: calc( var(--solaris-spacing-1) * 1.5 )}:host([data-size=lg]){--solaris-selection-card-gap: var(--solaris-spacing-5);--solaris-selection-card-padding: var(--solaris-spacing-8);--solaris-selection-card-indicator-size: var(--solaris-spacing-6);--solaris-selection-card-indicator-dot-size: calc( var(--solaris-spacing-1) * 2.5 )}:host([data-density=compact]){--solaris-selection-card-gap: var(--solaris-density-gap-lg);--solaris-selection-card-padding: var(--solaris-density-padding-xl)}:host([data-density=comfortable]){--solaris-selection-card-gap: var(--solaris-density-gap-lg);--solaris-selection-card-padding: var(--solaris-density-padding-xl)}:host([data-radius=none]){--solaris-selection-card-radius: var(--solaris-radius-none)}:host([data-radius=sm]){--solaris-selection-card-radius: var(--solaris-radius-sm)}:host([data-radius=xl]){--solaris-selection-card-radius: var(--solaris-radius-xl)}:host([data-appearance=outline]){--solaris-selection-card-background: transparent;--solaris-selection-card-border-color: var(--solaris-border-default)}:host([data-appearance=tonal]){--solaris-selection-card-background: var(--solaris-surface-subtle);--solaris-selection-card-border-color: var(--solaris-border-subtle)}:host([data-appearance=glass]) .solaris-selection-card__surface{--solaris-selection-card-color: var(--solaris-text-glass);--solaris-selection-card-glass-background: var(--solaris-glass-background);--solaris-selection-card-glass-border-color: var( --solaris-glass-border-color );isolation:isolate;background:var(--solaris-selection-card-glass-background);border-color:var(--solaris-selection-card-glass-border-color);box-shadow:var(--solaris-glass-shadow);backdrop-filter:var(--solaris-glass-backdrop-filter);-webkit-backdrop-filter:var(--solaris-glass-backdrop-filter)}:host([data-appearance=glass][data-checked]) .solaris-selection-card__surface{background:var(--solaris-selection-card-background);border-color:var(--solaris-selection-card-border-color)}:host([data-appearance=glass]) ::ng-deep .solaris-selection-card-description{color:var(--solaris-text-glass)}:host([data-color=primary]){--solaris-selection-card-focus-ring-color: var(--solaris-primary-base);--solaris-selection-card-indicator-dot-color: var(--solaris-primary-base);--solaris-selection-card-selected-background: var(--solaris-primary-surface);--solaris-selection-card-selected-border-color: var(--solaris-primary-border);--solaris-selection-card-indicator-border-color: var( --solaris-primary-border )}:host([data-color=success]){--solaris-selection-card-focus-ring-color: var(--solaris-success-base);--solaris-selection-card-indicator-dot-color: var(--solaris-success-base);--solaris-selection-card-selected-background: var(--solaris-success-surface);--solaris-selection-card-selected-border-color: var(--solaris-success-border);--solaris-selection-card-indicator-border-color: var( --solaris-success-border )}:host([data-color=warning]){--solaris-selection-card-focus-ring-color: var(--solaris-warning-base);--solaris-selection-card-indicator-dot-color: var(--solaris-warning-base);--solaris-selection-card-selected-background: var(--solaris-warning-surface);--solaris-selection-card-selected-border-color: var(--solaris-warning-border);--solaris-selection-card-indicator-border-color: var( --solaris-warning-border )}:host([data-color=danger]){--solaris-selection-card-focus-ring-color: var(--solaris-danger-base);--solaris-selection-card-indicator-dot-color: var(--solaris-danger-base);--solaris-selection-card-selected-background: var(--solaris-danger-surface);--solaris-selection-card-selected-border-color: var(--solaris-danger-border);--solaris-selection-card-indicator-border-color: var(--solaris-danger-border)}:host([data-color=info]){--solaris-selection-card-focus-ring-color: var(--solaris-info-base);--solaris-selection-card-indicator-dot-color: var(--solaris-info-base);--solaris-selection-card-selected-background: var(--solaris-info-surface);--solaris-selection-card-selected-border-color: var(--solaris-info-border);--solaris-selection-card-indicator-border-color: var(--solaris-info-border)}:host([data-color=custom]){--solaris-selection-card-focus-ring-color: var( --solaris-selection-card-custom-focus-ring-color );--solaris-selection-card-indicator-dot-color: var( --solaris-selection-card-custom-indicator-dot-color );--solaris-selection-card-selected-background: var( --solaris-selection-card-custom-selected-background );--solaris-selection-card-selected-border-color: var( --solaris-selection-card-custom-selected-border-color );--solaris-selection-card-indicator-border-color: var( --solaris-selection-card-custom-indicator-border-color )}:host(:not([data-disabled],[data-readonly])) .solaris-selection-card__input:hover+.solaris-selection-card__surface{background:var(--solaris-selection-card-hover-background)}:host(:not([data-disabled],[data-readonly])) .solaris-selection-card__input:active+.solaris-selection-card__surface{background:var(--solaris-selection-card-active-background)}:host([data-checked]){--solaris-selection-card-background: var( --solaris-selection-card-selected-background );--solaris-selection-card-border-color: var( --solaris-selection-card-selected-border-color )}.solaris-selection-card__input:focus-visible+.solaris-selection-card__surface{outline-offset:var(--solaris-focus-ring-offset);outline:var(--solaris-focus-ring-width) var(--solaris-focus-ring-style) var(--solaris-selection-card-focus-ring-color)}:host([data-invalid]){--solaris-selection-card-border-color: var(--solaris-danger-border);--solaris-selection-card-focus-ring-color: var(--solaris-danger-base);--solaris-selection-card-indicator-dot-color: var(--solaris-danger-base);--solaris-selection-card-indicator-border-color: var(--solaris-danger-border)}:host([data-disabled]) .solaris-selection-card__surface{cursor:not-allowed;opacity:var(--solaris-selection-card-disabled-opacity)}:host([data-readonly]) .solaris-selection-card__input{cursor:not-allowed}:host([data-readonly]) .solaris-selection-card__surface{cursor:default;opacity:var(--solaris-selection-card-disabled-opacity)}\n"] }]
9245
- }], propDecorators: { inputElementRef: [{ type: i0.ViewChild, args: ['inputElement', { isSignal: true }] }], media: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SolarisSelectionCardMediaDirective), { isSignal: true }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonlyInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], requiredInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], invalidInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], radius: [{ type: i0.Input, args: [{ isSignal: true, alias: "radius", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelKey", required: false }] }], checkedChange: [{ type: i0.Output, args: ["checkedChange"] }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }] } });
9294
+ '[attr.data-has-footer]': 'hasFooter() ? "" : null',
9295
+ '[attr.data-header-separator]': 'hasHeaderSeparator() ? "" : null',
9296
+ '[attr.data-footer-separator]': 'hasFooterSeparator() ? "" : null',
9297
+ }, template: "<input\n #inputElement\n [type]=\"isSwitchSelection() ? 'checkbox' : 'radio'\"\n [attr.role]=\"isSwitchSelection() ? 'switch' : null\"\n class=\"solaris-selection-card__input\"\n [id]=\"elementId()\"\n [disabled]=\"isEffectivelyDisabled()\"\n [required]=\"required\"\n [attr.name]=\"effectiveName() ?? null\"\n [attr.aria-label]=\"effectiveAriaLabel() ?? null\"\n [attr.aria-labelledby]=\"ariaLabelledBy()\"\n [attr.aria-describedby]=\"ariaDescribedBy()\"\n [attr.aria-invalid]=\"isEffectivelyInvalid() ? 'true' : null\"\n [attr.aria-readonly]=\"isEffectivelyReadonly() ? 'true' : null\"\n (change)=\"onInputChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n/>\n<div class=\"solaris-selection-card__surface\">\n <ng-content select=\"[solaris-selection-card-media]\" />\n <div class=\"solaris-selection-card__body\">\n <div class=\"solaris-selection-card__top-row\">\n @if (!isSwitchSelection() && selectionPosition() === 'start') {\n <span class=\"solaris-selection-card__control\" aria-hidden=\"true\">\n @if (_checked()) {\n <span class=\"solaris-selection-card__dot\"></span>\n }\n </span>\n }\n <div class=\"solaris-selection-card__header\">\n <ng-content select=\"[solaris-selection-card-header]\" />\n </div>\n @if (!isSwitchSelection() && selectionPosition() === 'end') {\n <span class=\"solaris-selection-card__control\" aria-hidden=\"true\">\n @if (_checked()) {\n <span class=\"solaris-selection-card__dot\"></span>\n }\n </span>\n }\n </div>\n @if (hasHeaderSeparator()) {\n <div class=\"solaris-selection-card__separator\" aria-hidden=\"true\"></div>\n }\n <div class=\"solaris-selection-card__content\" [id]=\"contentId()\">\n <ng-content select=\"[solaris-selection-card-content]\" />\n <ng-content />\n </div>\n </div>\n @if (isSwitchSelection() || hasFooter()) {\n <div class=\"solaris-selection-card__footer\">\n @if (isSwitchSelection() && selectionPosition() === 'start') {\n <span class=\"solaris-selection-card__switch\" aria-hidden=\"true\">\n <span class=\"solaris-selection-card__switch-thumb\"></span>\n </span>\n }\n <ng-content select=\"[solaris-selection-card-footer]\" />\n @if (isSwitchSelection() && selectionPosition() === 'end') {\n <span class=\"solaris-selection-card__switch\" aria-hidden=\"true\">\n <span class=\"solaris-selection-card__switch-thumb\"></span>\n </span>\n }\n </div>\n }\n</div>\n", styles: [":host{--solaris-selection-card-gap: var(--solaris-spacing-0);--solaris-selection-card-radius: var(--solaris-radius-lg);--solaris-selection-card-padding: var(--solaris-spacing-0);--solaris-selection-card-color: var(--solaris-text-default);--solaris-selection-card-background: var(--solaris-surface-base);--solaris-selection-card-indicator-size: var(--solaris-spacing-5);--solaris-selection-card-border-color: var(--solaris-border-strong);--solaris-selection-card-disabled-opacity: var(--solaris-opacity-50);--solaris-selection-card-border-width: var(--solaris-border-width-sm);--solaris-selection-card-indicator-dot-size: var(--solaris-spacing-2);--solaris-selection-card-hover-background: var(--solaris-surface-subtle);--solaris-selection-card-active-background: var(--solaris-surface-muted);--solaris-selection-card-focus-ring-color: var(--solaris-text-default);--solaris-selection-card-indicator-dot-color: var(--solaris-text-default);--solaris-selection-card-selected-background: var(--solaris-surface-muted);--solaris-selection-card-selected-border-color: var(--solaris-border-default);--solaris-selection-card-header-border-color: var(--solaris-border-strong);--solaris-selection-card-footer-border-color: var(--solaris-border-strong);--solaris-selection-card-media-size: var(--solaris-spacing-12);--solaris-selection-card-switch-track-width: calc( var(--solaris-spacing-8) + var(--solaris-spacing-1) / 2 );--solaris-selection-card-switch-track-height: calc( var(--solaris-spacing-4) + var(--solaris-spacing-3) / 4 );--solaris-selection-card-switch-thumb-size: var(--solaris-spacing-3);--solaris-selection-card-switch-thumb-offset: var(--solaris-spacing-half);--solaris-selection-card-switch-track-background: var( --solaris-surface-muted );--solaris-selection-card-switch-thumb-background: var( --solaris-surface-raised );--solaris-selection-card-indicator-border-color: var( --solaris-border-default );--solaris-selection-card-glass-background: initial;--solaris-selection-card-glass-border-color: initial;--solaris-selection-card-custom-focus-ring-color: initial;--solaris-selection-card-custom-indicator-dot-color: initial;--solaris-selection-card-custom-selected-background: initial;--solaris-selection-card-custom-selected-border-color: initial;--solaris-selection-card-custom-indicator-border-color: initial;display:block;position:relative;box-sizing:border-box}.solaris-selection-card__input{inset:0;margin:0;opacity:0;width:100%;height:100%;cursor:pointer;position:absolute;z-index:var(--solaris-z-index-content)}.solaris-selection-card__surface{overflow:hidden;position:relative;box-sizing:border-box;color:var(--solaris-selection-card-color);border-radius:var(--solaris-selection-card-radius);background:var(--solaris-selection-card-background);border:var(--solaris-selection-card-border-width) solid var(--solaris-selection-card-border-color);transition:background-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),border-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),box-shadow var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}.solaris-selection-card__body{display:flex;min-height:var(--solaris-density-min-height);box-sizing:border-box;flex-direction:column;gap:var(--solaris-selection-card-gap);padding:var(--solaris-selection-card-padding)}.solaris-selection-card__top-row{display:flex;align-items:flex-start;box-sizing:border-box;gap:var(--solaris-selection-card-gap)}.solaris-selection-card__header{flex:1;min-width:0}.solaris-selection-card__separator{border-bottom:var(--solaris-border-width-sm) solid var(--solaris-selection-card-header-border-color)}.solaris-selection-card__content{flex:1;min-width:0}.solaris-selection-card__control{display:flex;flex-shrink:0;border-radius:50%;align-items:center;box-sizing:border-box;justify-content:center;width:var(--solaris-selection-card-indicator-size);height:var(--solaris-selection-card-indicator-size);border:var(--solaris-border-width-sm) solid var(--solaris-selection-card-indicator-border-color)}:host([data-has-media]:not([data-media-position=start])) .solaris-selection-card__control{top:var(--solaris-selection-card-padding);right:var(--solaris-selection-card-padding);position:absolute;background:var(--solaris-surface-base)}.solaris-selection-card__footer{display:flex;align-items:center;box-sizing:border-box;gap:var(--solaris-selection-card-gap);padding:var(--solaris-selection-card-padding)}.solaris-selection-card__footer:empty{display:none}:host([data-selection-position=end]) .solaris-selection-card__footer{justify-content:flex-end}:host ::ng-deep .solaris-selection-card__footer .solaris-selection-card-footer{flex:1;min-width:0;margin-top:var(--solaris-spacing-0)}.solaris-selection-card__switch{display:flex;flex-shrink:0;position:relative;align-items:center;box-sizing:border-box;width:var(--solaris-selection-card-switch-track-width);height:var(--solaris-selection-card-switch-track-height);background:var(--solaris-selection-card-switch-track-background);border-radius:calc(var(--solaris-selection-card-switch-track-height) / 2);border:var(--solaris-border-width-sm) solid var(--solaris-selection-card-indicator-border-color);transition:background-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),border-color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}.solaris-selection-card__switch-thumb{display:block;position:absolute;border-radius:50%;top:50%;transform:translateY(-50%);left:var(--solaris-selection-card-switch-thumb-offset);width:var(--solaris-selection-card-switch-thumb-size);height:var(--solaris-selection-card-switch-thumb-size);background:var(--solaris-selection-card-switch-thumb-background);transition:left var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}:host([data-checked]) .solaris-selection-card__switch-thumb{left:calc(100% - var(--solaris-selection-card-switch-thumb-size) - var(--solaris-selection-card-switch-thumb-offset))}.solaris-selection-card__dot{display:block;border-radius:50%;width:var(--solaris-selection-card-indicator-dot-size);height:var(--solaris-selection-card-indicator-dot-size);background:var(--solaris-selection-card-indicator-dot-color)}:host ::ng-deep .solaris-selection-card-media{margin:0;display:block;overflow:hidden}:host ::ng-deep .solaris-selection-card-media img,:host ::ng-deep .solaris-selection-card-media video,:host ::ng-deep .solaris-selection-card-media picture{width:100%;display:block}:host ::ng-deep .solaris-selection-card-header{display:flex;flex-direction:column;gap:var(--solaris-spacing-0)}:host ::ng-deep .solaris-selection-card-content{display:block;margin-top:var(--solaris-spacing-0)}:host ::ng-deep .solaris-selection-card-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--solaris-spacing-0);margin-top:var(--solaris-spacing-0)}:host([data-footer-separator]) .solaris-selection-card__footer{border-top:var(--solaris-border-width-sm) solid var(--solaris-selection-card-footer-border-color)}:host ::ng-deep .solaris-selection-card-title{margin:0;color:var(--solaris-text-strong);font:var(--solaris-font-weight-semibold) var(--solaris-font-size-lg)/var(--solaris-line-height-sm) var(--solaris-font-family-sans)}:host ::ng-deep .solaris-selection-card-description{margin:0;color:var(--solaris-text-muted);font:var(--solaris-font-weight-regular) var(--solaris-font-size-sm)/var(--solaris-line-height-md) var(--solaris-font-family-sans)}:host([data-size=sm]){--solaris-selection-card-media-size: var(--solaris-spacing-10);--solaris-selection-card-indicator-size: var(--solaris-spacing-4);--solaris-selection-card-indicator-dot-size: calc( var(--solaris-spacing-1) * 1.5 )}:host([data-size=lg]){--solaris-selection-card-media-size: var(--solaris-spacing-16);--solaris-selection-card-indicator-size: var(--solaris-spacing-6);--solaris-selection-card-indicator-dot-size: calc( var(--solaris-spacing-1) * 2.5 )}:host([data-media-position=start]) .solaris-selection-card__surface{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center}:host([data-media-position=start]) ::ng-deep .solaris-selection-card-media{grid-row:1/-1;grid-column:1;align-self:center;width:var(--solaris-selection-card-media-size);height:var(--solaris-selection-card-media-size);margin:var(--solaris-selection-card-padding);margin-inline-end:var(--solaris-spacing-0);border-radius:var(--solaris-radius-md)}:host([data-media-position=start]) ::ng-deep .solaris-selection-card-media img,:host([data-media-position=start]) ::ng-deep .solaris-selection-card-media video,:host([data-media-position=start]) ::ng-deep .solaris-selection-card-media picture{width:100%;height:100%;object-fit:cover}:host([data-media-position=start]) .solaris-selection-card__body{grid-column:2;min-width:0}:host([data-media-position=start]) .solaris-selection-card__footer{grid-column:2;min-width:0}:host([data-radius=none]){--solaris-selection-card-radius: var(--solaris-radius-none)}:host([data-radius=sm]){--solaris-selection-card-radius: var(--solaris-radius-sm)}:host([data-radius=xl]){--solaris-selection-card-radius: var(--solaris-radius-xl)}:host([data-appearance=outline]){--solaris-selection-card-background: transparent;--solaris-selection-card-border-color: var(--solaris-border-default)}:host([data-appearance=tonal]){--solaris-selection-card-background: var(--solaris-surface-subtle);--solaris-selection-card-border-color: var(--solaris-border-subtle)}:host([data-appearance=glass]) .solaris-selection-card__surface{--solaris-selection-card-color: var(--solaris-text-glass);--solaris-selection-card-glass-background: var(--solaris-glass-background);--solaris-selection-card-glass-border-color: var( --solaris-glass-border-color );isolation:isolate;background:var(--solaris-selection-card-glass-background);border-color:var(--solaris-selection-card-glass-border-color);box-shadow:var(--solaris-glass-shadow);backdrop-filter:var(--solaris-glass-backdrop-filter);-webkit-backdrop-filter:var(--solaris-glass-backdrop-filter)}:host([data-appearance=glass][data-checked]) .solaris-selection-card__surface{background:var(--solaris-selection-card-background);border-color:var(--solaris-selection-card-border-color)}:host([data-appearance=glass]) ::ng-deep .solaris-selection-card-description{color:var(--solaris-text-glass)}:host([data-color=primary]){--solaris-selection-card-focus-ring-color: var(--solaris-primary-base);--solaris-selection-card-indicator-dot-color: var(--solaris-primary-base);--solaris-selection-card-selected-background: var(--solaris-primary-surface);--solaris-selection-card-selected-border-color: var(--solaris-primary-border);--solaris-selection-card-indicator-border-color: var( --solaris-primary-border )}:host([data-color=success]){--solaris-selection-card-focus-ring-color: var(--solaris-success-base);--solaris-selection-card-indicator-dot-color: var(--solaris-success-base);--solaris-selection-card-selected-background: var(--solaris-success-surface);--solaris-selection-card-selected-border-color: var(--solaris-success-border);--solaris-selection-card-indicator-border-color: var( --solaris-success-border )}:host([data-color=warning]){--solaris-selection-card-focus-ring-color: var(--solaris-warning-base);--solaris-selection-card-indicator-dot-color: var(--solaris-warning-base);--solaris-selection-card-selected-background: var(--solaris-warning-surface);--solaris-selection-card-selected-border-color: var(--solaris-warning-border);--solaris-selection-card-indicator-border-color: var( --solaris-warning-border )}:host([data-color=danger]){--solaris-selection-card-focus-ring-color: var(--solaris-danger-base);--solaris-selection-card-indicator-dot-color: var(--solaris-danger-base);--solaris-selection-card-selected-background: var(--solaris-danger-surface);--solaris-selection-card-selected-border-color: var(--solaris-danger-border);--solaris-selection-card-indicator-border-color: var(--solaris-danger-border)}:host([data-color=info]){--solaris-selection-card-focus-ring-color: var(--solaris-info-base);--solaris-selection-card-indicator-dot-color: var(--solaris-info-base);--solaris-selection-card-selected-background: var(--solaris-info-surface);--solaris-selection-card-selected-border-color: var(--solaris-info-border);--solaris-selection-card-indicator-border-color: var(--solaris-info-border)}:host([data-color=custom]){--solaris-selection-card-focus-ring-color: var( --solaris-selection-card-custom-focus-ring-color );--solaris-selection-card-indicator-dot-color: var( --solaris-selection-card-custom-indicator-dot-color );--solaris-selection-card-selected-background: var( --solaris-selection-card-custom-selected-background );--solaris-selection-card-selected-border-color: var( --solaris-selection-card-custom-selected-border-color );--solaris-selection-card-indicator-border-color: var( --solaris-selection-card-custom-indicator-border-color )}:host([data-selection=switch][data-checked]) .solaris-selection-card__switch{background:var(--solaris-selection-card-focus-ring-color);border-color:var(--solaris-selection-card-focus-ring-color)}:host(:not([data-disabled],[data-readonly])) .solaris-selection-card__input:hover+.solaris-selection-card__surface{background:var(--solaris-selection-card-hover-background)}:host(:not([data-disabled],[data-readonly])) .solaris-selection-card__input:active+.solaris-selection-card__surface{background:var(--solaris-selection-card-active-background)}:host([data-checked]){--solaris-selection-card-background: var( --solaris-selection-card-selected-background );--solaris-selection-card-border-color: var( --solaris-selection-card-selected-border-color )}.solaris-selection-card__input:focus-visible+.solaris-selection-card__surface{outline-offset:var(--solaris-focus-ring-offset);outline:var(--solaris-focus-ring-width) var(--solaris-focus-ring-style) var(--solaris-selection-card-focus-ring-color)}:host([data-invalid]){--solaris-selection-card-border-color: var(--solaris-danger-border);--solaris-selection-card-focus-ring-color: var(--solaris-danger-base);--solaris-selection-card-indicator-dot-color: var(--solaris-danger-base);--solaris-selection-card-indicator-border-color: var(--solaris-danger-border)}:host([data-disabled]) .solaris-selection-card__surface{cursor:not-allowed;opacity:var(--solaris-selection-card-disabled-opacity)}:host([data-readonly]) .solaris-selection-card__input{cursor:not-allowed}:host([data-readonly]) .solaris-selection-card__surface{cursor:default;opacity:var(--solaris-selection-card-disabled-opacity)}\n"] }]
9298
+ }], propDecorators: { inputElementRef: [{ type: i0.ViewChild, args: ['inputElement', { isSignal: true }] }], media: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SolarisSelectionCardMediaDirective), { isSignal: true }] }], header: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SolarisSelectionCardHeaderDirective), { isSignal: true }] }], footer: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SolarisSelectionCardFooterDirective), { isSignal: true }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonlyInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], requiredInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], invalidInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], radius: [{ type: i0.Input, args: [{ isSignal: true, alias: "radius", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }], selectionPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionPosition", required: false }] }], mediaPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "mediaPosition", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelKey", required: false }] }], checkedChange: [{ type: i0.Output, args: ["checkedChange"] }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }] } });
9246
9299
 
9247
9300
  class SolarisSelectionCardContentDirective {
9248
9301
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -9274,38 +9327,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImpo
9274
9327
  }]
9275
9328
  }] });
9276
9329
 
9277
- class SolarisSelectionCardFooterDirective {
9278
- separator = input(false, ...(ngDevMode ? [{ debugName: "separator" }] : /* istanbul ignore next */ []));
9279
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
9280
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.22", type: SolarisSelectionCardFooterDirective, isStandalone: true, selector: "[solaris-selection-card-footer]", inputs: { separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-separator": "separator() ? '' : null" }, classAttribute: "solaris-selection-card-footer" }, ngImport: i0 });
9281
- }
9282
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardFooterDirective, decorators: [{
9283
- type: Directive,
9284
- args: [{
9285
- selector: '[solaris-selection-card-footer]',
9286
- standalone: true,
9287
- host: {
9288
- class: 'solaris-selection-card-footer',
9289
- '[attr.data-separator]': "separator() ? '' : null",
9290
- },
9291
- }]
9292
- }], propDecorators: { separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }] } });
9293
-
9294
- class SolarisSelectionCardHeaderDirective {
9295
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
9296
- static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.22", type: SolarisSelectionCardHeaderDirective, isStandalone: true, selector: "[solaris-selection-card-header]", host: { classAttribute: "solaris-selection-card-header" }, ngImport: i0 });
9297
- }
9298
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardHeaderDirective, decorators: [{
9299
- type: Directive,
9300
- args: [{
9301
- selector: '[solaris-selection-card-header]',
9302
- standalone: true,
9303
- host: {
9304
- class: 'solaris-selection-card-header',
9305
- },
9306
- }]
9307
- }] });
9308
-
9309
9330
  class SolarisSelectionCardTitleDirective {
9310
9331
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.22", ngImport: i0, type: SolarisSelectionCardTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
9311
9332
  static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.22", type: SolarisSelectionCardTitleDirective, isStandalone: true, selector: "[solaris-selection-card-title]", host: { classAttribute: "solaris-selection-card-title" }, ngImport: i0 });