@gravionlabs/helix-ui 22.2.1 → 22.2.2

package/tokens.css

@@ -11,6 +11,7 @@
 :root,:host{--h-breadcrumb-separator-color:var(--h-navigation-item-icon-color);--h-breadcrumb-item-color:var(--h-text-muted-color);--h-breadcrumb-item-hover-color:var(--h-text-color);--h-breadcrumb-item-border-radius:var(--h-content-border-radius);--h-breadcrumb-item-gap:var(--h-navigation-item-gap);--h-breadcrumb-item-focus-ring-width:var(--h-focus-ring-width);--h-breadcrumb-item-focus-ring-style:var(--h-focus-ring-style);--h-breadcrumb-item-focus-ring-color:var(--h-focus-ring-color);--h-breadcrumb-item-focus-ring-offset:var(--h-focus-ring-offset);--h-breadcrumb-item-focus-ring-shadow:var(--h-focus-ring-shadow);--h-breadcrumb-item-icon-color:var(--h-navigation-item-icon-color);--h-breadcrumb-item-icon-hover-color:var(--h-navigation-item-icon-focus-color);--h-breadcrumb-padding:1rem;--h-breadcrumb-background:var(--h-content-background);--h-breadcrumb-gap:0.5rem;--h-breadcrumb-transition-duration:var(--h-transition-duration);}
 :root,:host{--h-button-border-radius:var(--h-form-field-border-radius);--h-button-rounded-border-radius:2rem;--h-button-gap:0.5rem;--h-button-padding-x:var(--h-form-field-padding-x);--h-button-padding-y:var(--h-form-field-padding-y);--h-button-icon-only-width:2.5rem;--h-button-raised-shadow:0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);--h-button-badge-size:1rem;--h-button-transition-duration:var(--h-form-field-transition-duration);--h-button-focus-ring-width:var(--h-focus-ring-width);--h-button-focus-ring-style:var(--h-focus-ring-style);--h-button-focus-ring-offset:var(--h-focus-ring-offset);--h-button-label-font-weight:500;--h-button-lg-font-size:var(--h-form-field-lg-font-size);--h-button-lg-padding-x:var(--h-form-field-lg-padding-x);--h-button-lg-padding-y:var(--h-form-field-lg-padding-y);--h-button-lg-icon-only-width:3rem;--h-button-sm-font-size:var(--h-form-field-sm-font-size);--h-button-sm-padding-x:var(--h-form-field-sm-padding-x);--h-button-sm-padding-y:var(--h-form-field-sm-padding-y);--h-button-sm-icon-only-width:2rem;--h-button-link-color:var(--h-primary-color);--h-button-link-hover-color:var(--h-primary-color);--h-button-link-active-color:var(--h-primary-color);--h-button-text-plain-hover-background:var(--h-surface-50);--h-button-text-plain-active-background:var(--h-surface-100);--h-button-text-plain-color:var(--h-surface-700);--h-button-text-contrast-hover-background:var(--h-surface-50);--h-button-text-contrast-active-background:var(--h-surface-100);--h-button-text-contrast-color:var(--h-surface-950);--h-button-text-danger-hover-background:var(--h-red-50);--h-button-text-danger-active-background:var(--h-red-100);--h-button-text-danger-color:var(--h-red-500);--h-button-text-help-hover-background:var(--h-purple-50);--h-button-text-help-active-background:var(--h-purple-100);--h-button-text-help-color:var(--h-purple-500);--h-button-text-warn-hover-background:var(--h-orange-50);--h-button-text-warn-active-background:var(--h-orange-100);--h-button-text-warn-color:var(--h-orange-500);--h-button-text-info-hover-background:var(--h-sky-50);--h-button-text-info-active-background:var(--h-sky-100);--h-button-text-info-color:var(--h-sky-500);--h-button-text-success-hover-background:var(--h-green-50);--h-button-text-success-active-background:var(--h-green-100);--h-button-text-success-color:var(--h-green-500);--h-button-text-secondary-hover-background:var(--h-surface-50);--h-button-text-secondary-active-background:var(--h-surface-100);--h-button-text-secondary-color:var(--h-surface-500);--h-button-text-primary-hover-background:var(--h-primary-50);--h-button-text-primary-active-background:var(--h-primary-100);--h-button-text-primary-color:var(--h-primary-color);--h-button-outlined-plain-hover-background:var(--h-surface-50);--h-button-outlined-plain-active-background:var(--h-surface-100);--h-button-outlined-plain-border-color:var(--h-surface-200);--h-button-outlined-plain-color:var(--h-surface-700);--h-button-outlined-contrast-hover-background:var(--h-surface-50);--h-button-outlined-contrast-active-background:var(--h-surface-100);--h-button-outlined-contrast-border-color:var(--h-surface-700);--h-button-outlined-contrast-color:var(--h-surface-950);--h-button-outlined-danger-hover-background:var(--h-red-50);--h-button-outlined-danger-active-background:var(--h-red-100);--h-button-outlined-danger-border-color:var(--h-red-200);--h-button-outlined-danger-color:var(--h-red-500);--h-button-outlined-help-hover-background:var(--h-purple-50);--h-button-outlined-help-active-background:var(--h-purple-100);--h-button-outlined-help-border-color:var(--h-purple-200);--h-button-outlined-help-color:var(--h-purple-500);--h-button-outlined-warn-hover-background:var(--h-orange-50);--h-button-outlined-warn-active-background:var(--h-orange-100);--h-button-outlined-warn-border-color:var(--h-orange-200);--h-button-outlined-warn-color:var(--h-orange-500);--h-button-outlined-info-hover-background:var(--h-sky-50);--h-button-outlined-info-active-background:var(--h-sky-100);--h-button-outlined-info-border-color:var(--h-sky-200);--h-button-outlined-info-color:var(--h-sky-500);--h-button-outlined-success-hover-background:var(--h-green-50);--h-button-outlined-success-active-background:var(--h-green-100);--h-button-outlined-success-border-color:var(--h-green-200);--h-button-outlined-success-color:var(--h-green-500);--h-button-outlined-secondary-hover-background:var(--h-surface-50);--h-button-outlined-secondary-active-background:var(--h-surface-100);--h-button-outlined-secondary-border-color:var(--h-surface-200);--h-button-outlined-secondary-color:var(--h-surface-500);--h-button-outlined-primary-hover-background:var(--h-primary-50);--h-button-outlined-primary-active-background:var(--h-primary-100);--h-button-outlined-primary-border-color:var(--h-primary-200);--h-button-outlined-primary-color:var(--h-primary-color);--h-button-contrast-background:var(--h-surface-800);--h-button-contrast-hover-background:var(--h-surface-700);--h-button-contrast-active-background:var(--h-surface-600);--h-button-contrast-border-color:var(--h-surface-800);--h-button-contrast-hover-border-color:var(--h-surface-700);--h-button-contrast-active-border-color:var(--h-surface-600);--h-button-contrast-color:var(--h-surface-0);--h-button-contrast-hover-color:var(--h-surface-0);--h-button-contrast-active-color:var(--h-surface-0);--h-button-contrast-focus-ring-color:var(--h-surface-800);--h-button-contrast-focus-ring-shadow:none;--h-button-danger-background:var(--h-red-500);--h-button-danger-hover-background:var(--h-red-600);--h-button-danger-active-background:var(--h-red-700);--h-button-danger-border-color:var(--h-red-500);--h-button-danger-hover-border-color:var(--h-red-600);--h-button-danger-active-border-color:var(--h-red-700);--h-button-danger-color:#ffffff;--h-button-danger-hover-color:#ffffff;--h-button-danger-active-color:#ffffff;--h-button-danger-focus-ring-color:var(--h-red-500);--h-button-danger-focus-ring-shadow:none;--h-button-help-background:var(--h-purple-500);--h-button-help-hover-background:var(--h-purple-600);--h-button-help-active-background:var(--h-purple-700);--h-button-help-border-color:var(--h-purple-500);--h-button-help-hover-border-color:var(--h-purple-600);--h-button-help-active-border-color:var(--h-purple-700);--h-button-help-color:#ffffff;--h-button-help-hover-color:#ffffff;--h-button-help-active-color:#ffffff;--h-button-help-focus-ring-color:var(--h-purple-500);--h-button-help-focus-ring-shadow:none;--h-button-warn-background:var(--h-orange-500);--h-button-warn-hover-background:var(--h-orange-600);--h-button-warn-active-background:var(--h-orange-700);--h-button-warn-border-color:var(--h-orange-500);--h-button-warn-hover-border-color:var(--h-orange-600);--h-button-warn-active-border-color:var(--h-orange-700);--h-button-warn-color:#ffffff;--h-button-warn-hover-color:#ffffff;--h-button-warn-active-color:#ffffff;--h-button-warn-focus-ring-color:var(--h-orange-500);--h-button-warn-focus-ring-shadow:none;--h-button-success-background:var(--h-green-500);--h-button-success-hover-background:var(--h-green-600);--h-button-success-active-background:var(--h-green-700);--h-button-success-border-color:var(--h-green-500);--h-button-success-hover-border-color:var(--h-green-600);--h-button-success-active-border-color:var(--h-green-700);--h-button-success-color:#ffffff;--h-button-success-hover-color:#ffffff;--h-button-success-active-color:#ffffff;--h-button-success-focus-ring-color:var(--h-green-500);--h-button-success-focus-ring-shadow:none;--h-button-info-background:var(--h-sky-500);--h-button-info-hover-background:var(--h-sky-600);--h-button-info-active-background:var(--h-sky-700);--h-button-info-border-color:var(--h-sky-500);--h-button-info-hover-border-color:var(--h-sky-600);--h-button-info-active-border-color:var(--h-sky-700);--h-button-info-color:#ffffff;--h-button-info-hover-color:#ffffff;--h-button-info-active-color:#ffffff;--h-button-info-focus-ring-color:var(--h-sky-500);--h-button-info-focus-ring-shadow:none;--h-button-secondary-background:var(--h-surface-100);--h-button-secondary-hover-background:var(--h-surface-200);--h-button-secondary-active-background:var(--h-surface-300);--h-button-secondary-border-color:var(--h-surface-100);--h-button-secondary-hover-border-color:var(--h-surface-200);--h-button-secondary-active-border-color:var(--h-surface-300);--h-button-secondary-color:var(--h-surface-600);--h-button-secondary-hover-color:var(--h-surface-700);--h-button-secondary-active-color:var(--h-surface-800);--h-button-secondary-focus-ring-color:var(--h-surface-600);--h-button-secondary-focus-ring-shadow:none;--h-button-primary-background:var(--h-primary-color);--h-button-primary-hover-background:var(--h-primary-hover-color);--h-button-primary-active-background:var(--h-primary-active-color);--h-button-primary-border-color:var(--h-primary-color);--h-button-primary-hover-border-color:var(--h-primary-hover-color);--h-button-primary-active-border-color:var(--h-primary-active-color);--h-button-primary-color:var(--h-primary-contrast-color);--h-button-primary-hover-color:var(--h-primary-contrast-color);--h-button-primary-active-color:var(--h-primary-contrast-color);--h-button-primary-focus-ring-color:var(--h-primary-color);--h-button-primary-focus-ring-shadow:none;}.app-dark{--h-button-link-color:var(--h-primary-color);--h-button-link-hover-color:var(--h-primary-color);--h-button-link-active-color:var(--h-primary-color);--h-button-text-plain-hover-background:var(--h-surface-800);--h-button-text-plain-active-background:var(--h-surface-700);--h-button-text-plain-color:var(--h-surface-0);--h-button-text-contrast-hover-background:var(--h-surface-800);--h-button-text-contrast-active-background:var(--h-surface-700);--h-button-text-contrast-color:var(--h-surface-0);--h-button-text-danger-hover-background:color-mix(in srgb, var(--h-red-400), transparent 96%);--h-button-text-danger-active-background:color-mix(in srgb, var(--h-red-400), transparent 84%);--h-button-text-danger-color:var(--h-red-400);--h-button-text-help-hover-background:color-mix(in srgb, var(--h-purple-400), transparent 96%);--h-button-text-help-active-background:color-mix(in srgb, var(--h-purple-400), transparent 84%);--h-button-text-help-color:var(--h-purple-400);--h-button-text-warn-hover-background:color-mix(in srgb, var(--h-orange-400), transparent 96%);--h-button-text-warn-active-background:color-mix(in srgb, var(--h-orange-400), transparent 84%);--h-button-text-warn-color:var(--h-orange-400);--h-button-text-info-hover-background:color-mix(in srgb, var(--h-sky-400), transparent 96%);--h-button-text-info-active-background:color-mix(in srgb, var(--h-sky-400), transparent 84%);--h-button-text-info-color:var(--h-sky-400);--h-button-text-success-hover-background:color-mix(in srgb, var(--h-green-400), transparent 96%);--h-button-text-success-active-background:color-mix(in srgb, var(--h-green-400), transparent 84%);--h-button-text-success-color:var(--h-green-400);--h-button-text-secondary-hover-background:var(--h-surface-800);--h-button-text-secondary-active-background:var(--h-surface-700);--h-button-text-secondary-color:var(--h-surface-400);--h-button-text-primary-hover-background:color-mix(in srgb, var(--h-primary-color), transparent 96%);--h-button-text-primary-active-background:color-mix(in srgb, var(--h-primary-color), transparent 84%);--h-button-text-primary-color:var(--h-primary-color);--h-button-outlined-plain-hover-background:var(--h-surface-800);--h-button-outlined-plain-active-background:var(--h-surface-700);--h-button-outlined-plain-border-color:var(--h-surface-600);--h-button-outlined-plain-color:var(--h-surface-0);--h-button-outlined-contrast-hover-background:var(--h-surface-800);--h-button-outlined-contrast-active-background:var(--h-surface-700);--h-button-outlined-contrast-border-color:var(--h-surface-500);--h-button-outlined-contrast-color:var(--h-surface-0);--h-button-outlined-danger-hover-background:color-mix(in srgb, var(--h-red-400), transparent 96%);--h-button-outlined-danger-active-background:color-mix(in srgb, var(--h-red-400), transparent 84%);--h-button-outlined-danger-border-color:var(--h-red-700);--h-button-outlined-danger-color:var(--h-red-400);--h-button-outlined-help-hover-background:color-mix(in srgb, var(--h-purple-400), transparent 96%);--h-button-outlined-help-active-background:color-mix(in srgb, var(--h-purple-400), transparent 84%);--h-button-outlined-help-border-color:var(--h-purple-700);--h-button-outlined-help-color:var(--h-purple-400);--h-button-outlined-warn-hover-background:color-mix(in srgb, var(--h-orange-400), transparent 96%);--h-button-outlined-warn-active-background:color-mix(in srgb, var(--h-orange-400), transparent 84%);--h-button-outlined-warn-border-color:var(--h-orange-700);--h-button-outlined-warn-color:var(--h-orange-400);--h-button-outlined-info-hover-background:color-mix(in srgb, var(--h-sky-400), transparent 96%);--h-button-outlined-info-active-background:color-mix(in srgb, var(--h-sky-400), transparent 84%);--h-button-outlined-info-border-color:var(--h-sky-700);--h-button-outlined-info-color:var(--h-sky-400);--h-button-outlined-success-hover-background:color-mix(in srgb, var(--h-green-400), transparent 96%);--h-button-outlined-success-active-background:color-mix(in srgb, var(--h-green-400), transparent 84%);--h-button-outlined-success-border-color:var(--h-green-700);--h-button-outlined-success-color:var(--h-green-400);--h-button-outlined-secondary-hover-background:rgba(255,255,255,0.04);--h-button-outlined-secondary-active-background:rgba(255,255,255,0.16);--h-button-outlined-secondary-border-color:var(--h-surface-700);--h-button-outlined-secondary-color:var(--h-surface-400);--h-button-outlined-primary-hover-background:color-mix(in srgb, var(--h-primary-color), transparent 96%);--h-button-outlined-primary-active-background:color-mix(in srgb, var(--h-primary-color), transparent 84%);--h-button-outlined-primary-border-color:var(--h-primary-700);--h-button-outlined-primary-color:var(--h-primary-color);--h-button-contrast-background:var(--h-surface-200);--h-button-contrast-hover-background:var(--h-surface-300);--h-button-contrast-active-background:var(--h-surface-400);--h-button-contrast-border-color:var(--h-surface-200);--h-button-contrast-hover-border-color:var(--h-surface-300);--h-button-contrast-active-border-color:var(--h-surface-400);--h-button-contrast-color:var(--h-surface-950);--h-button-contrast-hover-color:var(--h-surface-950);--h-button-contrast-active-color:var(--h-surface-950);--h-button-contrast-focus-ring-color:var(--h-surface-200);--h-button-contrast-focus-ring-shadow:none;--h-button-danger-background:var(--h-red-400);--h-button-danger-hover-background:var(--h-red-300);--h-button-danger-active-background:var(--h-red-200);--h-button-danger-border-color:var(--h-red-400);--h-button-danger-hover-border-color:var(--h-red-300);--h-button-danger-active-border-color:var(--h-red-200);--h-button-danger-color:var(--h-red-950);--h-button-danger-hover-color:var(--h-red-950);--h-button-danger-active-color:var(--h-red-950);--h-button-danger-focus-ring-color:var(--h-red-400);--h-button-danger-focus-ring-shadow:none;--h-button-help-background:var(--h-purple-400);--h-button-help-hover-background:var(--h-purple-300);--h-button-help-active-background:var(--h-purple-200);--h-button-help-border-color:var(--h-purple-400);--h-button-help-hover-border-color:var(--h-purple-300);--h-button-help-active-border-color:var(--h-purple-200);--h-button-help-color:var(--h-purple-950);--h-button-help-hover-color:var(--h-purple-950);--h-button-help-active-color:var(--h-purple-950);--h-button-help-focus-ring-color:var(--h-purple-400);--h-button-help-focus-ring-shadow:none;--h-button-warn-background:var(--h-orange-400);--h-button-warn-hover-background:var(--h-orange-300);--h-button-warn-active-background:var(--h-orange-200);--h-button-warn-border-color:var(--h-orange-400);--h-button-warn-hover-border-color:var(--h-orange-300);--h-button-warn-active-border-color:var(--h-orange-200);--h-button-warn-color:var(--h-orange-950);--h-button-warn-hover-color:var(--h-orange-950);--h-button-warn-active-color:var(--h-orange-950);--h-button-warn-focus-ring-color:var(--h-orange-400);--h-button-warn-focus-ring-shadow:none;--h-button-success-background:var(--h-green-400);--h-button-success-hover-background:var(--h-green-300);--h-button-success-active-background:var(--h-green-200);--h-button-success-border-color:var(--h-green-400);--h-button-success-hover-border-color:var(--h-green-300);--h-button-success-active-border-color:var(--h-green-200);--h-button-success-color:var(--h-green-950);--h-button-success-hover-color:var(--h-green-950);--h-button-success-active-color:var(--h-green-950);--h-button-success-focus-ring-color:var(--h-green-400);--h-button-success-focus-ring-shadow:none;--h-button-info-background:var(--h-sky-400);--h-button-info-hover-background:var(--h-sky-300);--h-button-info-active-background:var(--h-sky-200);--h-button-info-border-color:var(--h-sky-400);--h-button-info-hover-border-color:var(--h-sky-300);--h-button-info-active-border-color:var(--h-sky-200);--h-button-info-color:var(--h-sky-950);--h-button-info-hover-color:var(--h-sky-950);--h-button-info-active-color:var(--h-sky-950);--h-button-info-focus-ring-color:var(--h-sky-400);--h-button-info-focus-ring-shadow:none;--h-button-secondary-background:var(--h-surface-800);--h-button-secondary-hover-background:var(--h-surface-700);--h-button-secondary-active-background:var(--h-surface-600);--h-button-secondary-border-color:var(--h-surface-800);--h-button-secondary-hover-border-color:var(--h-surface-700);--h-button-secondary-active-border-color:var(--h-surface-600);--h-button-secondary-color:var(--h-surface-300);--h-button-secondary-hover-color:var(--h-surface-200);--h-button-secondary-active-color:var(--h-surface-100);--h-button-secondary-focus-ring-color:var(--h-surface-300);--h-button-secondary-focus-ring-shadow:none;--h-button-primary-background:var(--h-primary-color);--h-button-primary-hover-background:var(--h-primary-hover-color);--h-button-primary-active-background:var(--h-primary-active-color);--h-button-primary-border-color:var(--h-primary-color);--h-button-primary-hover-border-color:var(--h-primary-hover-color);--h-button-primary-active-border-color:var(--h-primary-active-color);--h-button-primary-color:var(--h-primary-contrast-color);--h-button-primary-hover-color:var(--h-primary-contrast-color);--h-button-primary-active-color:var(--h-primary-contrast-color);--h-button-primary-focus-ring-color:var(--h-primary-color);--h-button-primary-focus-ring-shadow:none;}
 :root,:host{--h-card-subtitle-color:var(--h-text-muted-color);--h-card-title-font-size:1.25rem;--h-card-title-font-weight:500;--h-card-caption-gap:0.5rem;--h-card-body-padding:1.25rem;--h-card-body-gap:0.5rem;--h-card-background:var(--h-content-background);--h-card-border-radius:var(--h-border-radius-xl);--h-card-color:var(--h-content-color);--h-card-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);}
+:root,:host{--h-carousel-indicator-width:2rem;--h-carousel-indicator-height:0.5rem;--h-carousel-indicator-border-radius:var(--h-content-border-radius);--h-carousel-indicator-focus-ring-width:var(--h-focus-ring-width);--h-carousel-indicator-focus-ring-style:var(--h-focus-ring-style);--h-carousel-indicator-focus-ring-color:var(--h-focus-ring-color);--h-carousel-indicator-focus-ring-offset:var(--h-focus-ring-offset);--h-carousel-indicator-focus-ring-shadow:var(--h-focus-ring-shadow);--h-carousel-indicator-list-padding:1rem;--h-carousel-indicator-list-gap:0.5rem;--h-carousel-content-gap:0.25rem;--h-carousel-transition-duration:var(--h-transition-duration);--h-carousel-indicator-background:var(--h-surface-200);--h-carousel-indicator-hover-background:var(--h-surface-300);--h-carousel-indicator-active-background:var(--h-primary-color);}.app-dark{--h-carousel-indicator-background:var(--h-surface-700);--h-carousel-indicator-hover-background:var(--h-surface-600);--h-carousel-indicator-active-background:var(--h-primary-color);}
 :root,:host{--h-checkbox-icon-size:0.875rem;--h-checkbox-icon-color:var(--h-form-field-color);--h-checkbox-icon-checked-color:var(--h-primary-contrast-color);--h-checkbox-icon-checked-hover-color:var(--h-primary-contrast-color);--h-checkbox-icon-disabled-color:var(--h-form-field-disabled-color);--h-checkbox-icon-lg-size:1rem;--h-checkbox-icon-sm-size:0.75rem;--h-checkbox-border-radius:var(--h-border-radius-sm);--h-checkbox-width:1.25rem;--h-checkbox-height:1.25rem;--h-checkbox-background:var(--h-form-field-background);--h-checkbox-checked-background:var(--h-primary-color);--h-checkbox-checked-hover-background:var(--h-primary-hover-color);--h-checkbox-disabled-background:var(--h-form-field-disabled-background);--h-checkbox-filled-background:var(--h-form-field-filled-background);--h-checkbox-border-color:var(--h-form-field-border-color);--h-checkbox-hover-border-color:var(--h-form-field-hover-border-color);--h-checkbox-focus-border-color:var(--h-form-field-border-color);--h-checkbox-checked-border-color:var(--h-primary-color);--h-checkbox-checked-hover-border-color:var(--h-primary-hover-color);--h-checkbox-checked-focus-border-color:var(--h-primary-color);--h-checkbox-checked-disabled-border-color:var(--h-form-field-border-color);--h-checkbox-invalid-border-color:var(--h-form-field-invalid-border-color);--h-checkbox-shadow:var(--h-form-field-shadow);--h-checkbox-transition-duration:var(--h-form-field-transition-duration);--h-checkbox-lg-width:1.5rem;--h-checkbox-lg-height:1.5rem;--h-checkbox-sm-width:1rem;--h-checkbox-sm-height:1rem;--h-checkbox-focus-ring-width:var(--h-focus-ring-width);--h-checkbox-focus-ring-style:var(--h-focus-ring-style);--h-checkbox-focus-ring-color:var(--h-focus-ring-color);--h-checkbox-focus-ring-offset:var(--h-focus-ring-offset);--h-checkbox-focus-ring-shadow:var(--h-focus-ring-shadow);}
 :root,:host{--h-chip-remove-icon-size:1rem;--h-chip-remove-icon-focus-ring-width:var(--h-focus-ring-width);--h-chip-remove-icon-focus-ring-style:var(--h-focus-ring-style);--h-chip-remove-icon-focus-ring-color:var(--h-focus-ring-color);--h-chip-remove-icon-focus-ring-offset:var(--h-focus-ring-offset);--h-chip-remove-icon-focus-ring-shadow:var(--h-form-field-focus-ring-shadow);--h-chip-icon-size:1rem;--h-chip-image-width:2rem;--h-chip-image-height:2rem;--h-chip-border-radius:16px;--h-chip-padding-x:0.75rem;--h-chip-padding-y:0.5rem;--h-chip-gap:0.5rem;--h-chip-transition-duration:var(--h-transition-duration);--h-chip-remove-icon-color:var(--h-surface-800);--h-chip-icon-color:var(--h-surface-800);--h-chip-background:var(--h-surface-100);--h-chip-color:var(--h-surface-800);}.app-dark{--h-chip-remove-icon-color:var(--h-surface-0);--h-chip-icon-color:var(--h-surface-0);--h-chip-background:var(--h-surface-800);--h-chip-color:var(--h-surface-0);}
 :root,:host{--h-confirmdialog-content-gap:1rem;--h-confirmdialog-icon-size:2rem;--h-confirmdialog-icon-color:var(--h-overlay-modal-color);}
@@ -23,7 +24,9 @@
 :root,:host{--h-fieldset-content-padding:0;--h-fieldset-toggle-icon-color:var(--h-text-muted-color);--h-fieldset-toggle-icon-hover-color:var(--h-text-hover-muted-color);--h-fieldset-legend-background:var(--h-content-background);--h-fieldset-legend-hover-background:var(--h-content-hover-background);--h-fieldset-legend-color:var(--h-content-color);--h-fieldset-legend-hover-color:var(--h-content-hover-color);--h-fieldset-legend-border-radius:var(--h-content-border-radius);--h-fieldset-legend-border-width:1px;--h-fieldset-legend-border-color:transparent;--h-fieldset-legend-padding:0.5rem 0.75rem;--h-fieldset-legend-gap:0.5rem;--h-fieldset-legend-font-weight:600;--h-fieldset-legend-focus-ring-width:var(--h-focus-ring-width);--h-fieldset-legend-focus-ring-style:var(--h-focus-ring-style);--h-fieldset-legend-focus-ring-color:var(--h-focus-ring-color);--h-fieldset-legend-focus-ring-offset:var(--h-focus-ring-offset);--h-fieldset-legend-focus-ring-shadow:var(--h-focus-ring-shadow);--h-fieldset-background:var(--h-content-background);--h-fieldset-border-color:var(--h-content-border-color);--h-fieldset-border-radius:var(--h-content-border-radius);--h-fieldset-color:var(--h-content-color);--h-fieldset-padding:0 1.125rem 1.125rem 1.125rem;--h-fieldset-transition-duration:var(--h-transition-duration);}
 :root,:host{--h-fileupload-basic-gap:0.5rem;--h-fileupload-progressbar-height:0.25rem;--h-fileupload-file-list-gap:0.5rem;--h-fileupload-file-padding:1rem;--h-fileupload-file-gap:1rem;--h-fileupload-file-border-color:var(--h-content-border-color);--h-fileupload-file-info-gap:0.5rem;--h-fileupload-content-highlight-border-color:var(--h-primary-color);--h-fileupload-content-padding:0 1.125rem 1.125rem 1.125rem;--h-fileupload-content-gap:1rem;--h-fileupload-header-background:transparent;--h-fileupload-header-color:var(--h-text-color);--h-fileupload-header-padding:1.125rem;--h-fileupload-header-border-color:unset;--h-fileupload-header-border-width:0;--h-fileupload-header-border-radius:0;--h-fileupload-header-gap:0.5rem;--h-fileupload-background:var(--h-content-background);--h-fileupload-border-color:var(--h-content-border-color);--h-fileupload-color:var(--h-content-color);--h-fileupload-border-radius:var(--h-content-border-radius);--h-fileupload-transition-duration:var(--h-transition-duration);}
 :root,:host{--h-floatlabel-on-border-radius:var(--h-border-radius-xs);--h-floatlabel-on-active-background:var(--h-form-field-background);--h-floatlabel-on-active-padding:0 0.125rem;--h-floatlabel-in-active-top:var(--h-form-field-padding-y);--h-floatlabel-in-input-padding-top:1.5rem;--h-floatlabel-in-input-padding-bottom:var(--h-form-field-padding-y);--h-floatlabel-over-active-top:-1.25rem;--h-floatlabel-color:var(--h-form-field-float-label-color);--h-floatlabel-focus-color:var(--h-form-field-float-label-focus-color);--h-floatlabel-active-color:var(--h-form-field-float-label-active-color);--h-floatlabel-invalid-color:var(--h-form-field-float-label-invalid-color);--h-floatlabel-transition-duration:0.2s;--h-floatlabel-position-x:var(--h-form-field-padding-x);--h-floatlabel-position-y:var(--h-form-field-padding-y);--h-floatlabel-font-weight:500;--h-floatlabel-active-font-size:0.75rem;--h-floatlabel-active-font-weight:400;}
+:root,:host{--h-galleria-close-button-icon-size:1.5rem;--h-galleria-close-button-size:3rem;--h-galleria-close-button-gutter:0.5rem;--h-galleria-close-button-background:rgba(255, 255, 255, 0.1);--h-galleria-close-button-hover-background:rgba(255, 255, 255, 0.2);--h-galleria-close-button-color:var(--h-surface-50);--h-galleria-close-button-hover-color:var(--h-surface-0);--h-galleria-close-button-border-radius:50%;--h-galleria-close-button-focus-ring-width:var(--h-focus-ring-width);--h-galleria-close-button-focus-ring-style:var(--h-focus-ring-style);--h-galleria-close-button-focus-ring-color:var(--h-focus-ring-color);--h-galleria-close-button-focus-ring-offset:var(--h-focus-ring-offset);--h-galleria-close-button-focus-ring-shadow:var(--h-focus-ring-shadow);--h-galleria-inset-indicator-button-background:rgba(255, 255, 255, 0.4);--h-galleria-inset-indicator-button-hover-background:rgba(255, 255, 255, 0.6);--h-galleria-inset-indicator-button-active-background:rgba(255, 255, 255, 0.9);--h-galleria-inset-indicator-list-background:rgba(0, 0, 0, 0.5);--h-galleria-indicator-button-width:1rem;--h-galleria-indicator-button-height:1rem;--h-galleria-indicator-button-active-background:var(--h-primary-color);--h-galleria-indicator-button-border-radius:50%;--h-galleria-indicator-button-focus-ring-width:var(--h-focus-ring-width);--h-galleria-indicator-button-focus-ring-style:var(--h-focus-ring-style);--h-galleria-indicator-button-focus-ring-color:var(--h-focus-ring-color);--h-galleria-indicator-button-focus-ring-offset:var(--h-focus-ring-offset);--h-galleria-indicator-button-focus-ring-shadow:var(--h-focus-ring-shadow);--h-galleria-indicator-list-gap:0.5rem;--h-galleria-indicator-list-padding:1rem;--h-galleria-caption-background:rgba(0, 0, 0, 0.5);--h-galleria-caption-color:var(--h-surface-100);--h-galleria-caption-padding:1rem;--h-galleria-thumbnail-nav-button-icon-size:1rem;--h-galleria-thumbnail-nav-button-size:2rem;--h-galleria-thumbnail-nav-button-border-radius:var(--h-content-border-radius);--h-galleria-thumbnail-nav-button-gutter:0.5rem;--h-galleria-thumbnail-nav-button-focus-ring-width:var(--h-focus-ring-width);--h-galleria-thumbnail-nav-button-focus-ring-style:var(--h-focus-ring-style);--h-galleria-thumbnail-nav-button-focus-ring-color:var(--h-focus-ring-color);--h-galleria-thumbnail-nav-button-focus-ring-offset:var(--h-focus-ring-offset);--h-galleria-thumbnail-nav-button-focus-ring-shadow:var(--h-focus-ring-shadow);--h-galleria-thumbnails-content-background:var(--h-content-background);--h-galleria-thumbnails-content-padding:1rem 0.25rem;--h-galleria-nav-icon-size:1.5rem;--h-galleria-nav-button-background:rgba(255, 255, 255, 0.1);--h-galleria-nav-button-hover-background:rgba(255, 255, 255, 0.2);--h-galleria-nav-button-color:var(--h-surface-100);--h-galleria-nav-button-hover-color:var(--h-surface-0);--h-galleria-nav-button-size:3rem;--h-galleria-nav-button-gutter:0.5rem;--h-galleria-nav-button-focus-ring-width:var(--h-focus-ring-width);--h-galleria-nav-button-focus-ring-style:var(--h-focus-ring-style);--h-galleria-nav-button-focus-ring-color:var(--h-focus-ring-color);--h-galleria-nav-button-focus-ring-offset:var(--h-focus-ring-offset);--h-galleria-nav-button-focus-ring-shadow:var(--h-focus-ring-shadow);--h-galleria-nav-button-next-border-radius:50%;--h-galleria-nav-button-prev-border-radius:50%;--h-galleria-border-width:1px;--h-galleria-border-color:var(--h-content-border-color);--h-galleria-border-radius:var(--h-content-border-radius);--h-galleria-transition-duration:var(--h-transition-duration);--h-galleria-indicator-button-background:var(--h-surface-200);--h-galleria-indicator-button-hover-background:var(--h-surface-300);--h-galleria-thumbnail-nav-button-hover-background:var(--h-surface-100);--h-galleria-thumbnail-nav-button-color:var(--h-surface-600);--h-galleria-thumbnail-nav-button-hover-color:var(--h-surface-700);}.app-dark{--h-galleria-indicator-button-background:var(--h-surface-700);--h-galleria-indicator-button-hover-background:var(--h-surface-600);--h-galleria-thumbnail-nav-button-hover-background:var(--h-surface-700);--h-galleria-thumbnail-nav-button-color:var(--h-surface-400);--h-galleria-thumbnail-nav-button-hover-color:var(--h-surface-0);}
 :root,:host{--h-iconfield-icon-color:var(--h-form-field-icon-color);}
+:root,:host{--h-image-action-hover-background:rgba(255,255,255,0.1);--h-image-action-color:var(--h-surface-50);--h-image-action-hover-color:var(--h-surface-0);--h-image-action-size:3rem;--h-image-action-icon-size:1.5rem;--h-image-action-border-radius:50%;--h-image-action-focus-ring-width:var(--h-focus-ring-width);--h-image-action-focus-ring-style:var(--h-focus-ring-style);--h-image-action-focus-ring-color:var(--h-focus-ring-color);--h-image-action-focus-ring-offset:var(--h-focus-ring-offset);--h-image-action-focus-ring-shadow:var(--h-focus-ring-shadow);--h-image-toolbar-blur:8px;--h-image-toolbar-background:rgba(255,255,255,0.1);--h-image-toolbar-border-color:rgba(255,255,255,0.2);--h-image-toolbar-border-width:1px;--h-image-toolbar-border-radius:30px;--h-image-toolbar-padding:.5rem;--h-image-toolbar-gap:0.5rem;--h-image-toolbar-position-left:auto;--h-image-toolbar-position-right:1rem;--h-image-toolbar-position-top:1rem;--h-image-toolbar-position-bottom:auto;--h-image-preview-mask-background:var(--h-mask-background);--h-image-preview-mask-color:var(--h-mask-color);--h-image-preview-icon-size:1.5rem;--h-image-transition-duration:var(--h-transition-duration);}
 :root,:host{--h-inputgroup-addon-background:var(--h-form-field-background);--h-inputgroup-addon-border-color:var(--h-form-field-border-color);--h-inputgroup-addon-color:var(--h-form-field-icon-color);--h-inputgroup-addon-border-radius:var(--h-form-field-border-radius);--h-inputgroup-addon-padding:0.5rem;--h-inputgroup-addon-min-width:2.5rem;}
 :root,:host{--h-inputnumber-button-width:2.5rem;--h-inputnumber-button-border-radius:var(--h-form-field-border-radius);--h-inputnumber-button-vertical-padding:var(--h-form-field-padding-y);--h-inputnumber-transition-duration:var(--h-transition-duration);--h-inputnumber-button-background:transparent;--h-inputnumber-button-hover-background:var(--h-surface-100);--h-inputnumber-button-active-background:var(--h-surface-200);--h-inputnumber-button-border-color:var(--h-form-field-border-color);--h-inputnumber-button-hover-border-color:var(--h-form-field-border-color);--h-inputnumber-button-active-border-color:var(--h-form-field-border-color);--h-inputnumber-button-color:var(--h-surface-400);--h-inputnumber-button-hover-color:var(--h-surface-500);--h-inputnumber-button-active-color:var(--h-surface-600);}.app-dark{--h-inputnumber-button-background:transparent;--h-inputnumber-button-hover-background:var(--h-surface-800);--h-inputnumber-button-active-background:var(--h-surface-700);--h-inputnumber-button-border-color:var(--h-form-field-border-color);--h-inputnumber-button-hover-border-color:var(--h-form-field-border-color);--h-inputnumber-button-active-border-color:var(--h-form-field-border-color);--h-inputnumber-button-color:var(--h-surface-400);--h-inputnumber-button-hover-color:var(--h-surface-300);--h-inputnumber-button-active-color:var(--h-surface-200);}
 :root,:host{--h-textarea-background:var(--h-form-field-background);--h-textarea-disabled-background:var(--h-form-field-disabled-background);--h-textarea-filled-background:var(--h-form-field-filled-background);--h-textarea-filled-hover-background:var(--h-form-field-filled-hover-background);--h-textarea-filled-focus-background:var(--h-form-field-filled-focus-background);--h-textarea-border-color:var(--h-form-field-border-color);--h-textarea-hover-border-color:var(--h-form-field-hover-border-color);--h-textarea-focus-border-color:var(--h-form-field-focus-border-color);--h-textarea-invalid-border-color:var(--h-form-field-invalid-border-color);--h-textarea-color:var(--h-form-field-color);--h-textarea-disabled-color:var(--h-form-field-disabled-color);--h-textarea-placeholder-color:var(--h-form-field-placeholder-color);--h-textarea-invalid-placeholder-color:var(--h-form-field-invalid-placeholder-color);--h-textarea-shadow:var(--h-form-field-shadow);--h-textarea-padding-x:var(--h-form-field-padding-x);--h-textarea-padding-y:var(--h-form-field-padding-y);--h-textarea-border-radius:var(--h-form-field-border-radius);--h-textarea-transition-duration:var(--h-form-field-transition-duration);--h-textarea-lg-font-size:var(--h-form-field-lg-font-size);--h-textarea-lg-padding-x:var(--h-form-field-lg-padding-x);--h-textarea-lg-padding-y:var(--h-form-field-lg-padding-y);--h-textarea-sm-font-size:var(--h-form-field-sm-font-size);--h-textarea-sm-padding-x:var(--h-form-field-sm-padding-x);--h-textarea-sm-padding-y:var(--h-form-field-sm-padding-y);--h-textarea-focus-ring-width:var(--h-form-field-focus-ring-width);--h-textarea-focus-ring-style:var(--h-form-field-focus-ring-style);--h-textarea-focus-ring-color:var(--h-form-field-focus-ring-color);--h-textarea-focus-ring-offset:var(--h-form-field-focus-ring-offset);--h-textarea-focus-ring-shadow:var(--h-form-field-focus-ring-shadow);}

package/types/gravionlabs-helix-ui.d.ts

@@ -683,6 +683,180 @@ export declare class HxCard {
     };
   }, {}, never, ["[hxCardTitle]", "[hxCardHeader]", "[hxCardSubtitle]", "*", "[hxCardFooter]"], true, never>;
 }
+type HxCarouselOrientation = 'horizontal' | 'vertical';
+/** How many items are visible and scrolled at a viewport width (`breakpoint` is a max-width, `'1024px'`). */
+interface HxCarouselResponsiveOption {
+  breakpoint: string;
+  numVisible: number;
+  numScroll: number;
+}
+interface HxCarouselItemContext<T = unknown> {
+  $implicit: T;
+  index: number;
+}
+/** The template of one item: `<ng-template hxCarouselItem let-item let-index="index">`. */
+export declare class HxCarouselItem {
+  readonly template: TemplateRef<HxCarouselItemContext<unknown>>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HxCarouselItem, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HxCarouselItem, "ng-template[hxCarouselItem]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * A slider over a list of items: `numVisible` items at a time, moved by `numScroll` with the previous/next buttons,
+ * the page indicators or the arrow keys; optional autoplay and circular paging.
+ *
+ * ```html
+ * <hx-carousel [value]="products" [numVisible]="3" [numScroll]="1" [responsiveOptions]="responsive" ariaLabel="Products">
+ *   <ng-template hxCarouselItem let-product>…</ng-template>
+ * </hx-carousel>
+ * ```
+ *
+ * The carousel is a `region` with `aria-roledescription="carousel"`; the items are `group`s named "n of m"; items
+ * outside the viewport are hidden from assistive technology and the tab order. Autoplay pauses while the pointer or
+ * the focus is inside and stays off when the user prefers reduced motion.
+ */
+export declare class HxCarousel<T = unknown> {
+  readonly value: import("@angular/core").InputSignal<readonly T[]>;
+  readonly numVisible: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly numScroll: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  /** After the last page comes the first again. */
+  readonly circular: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** Milliseconds between automatic page changes; 0 is off. */
+  readonly autoplayInterval: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly orientation: import("@angular/core").InputSignal<HxCarouselOrientation>;
+  /** Height of the viewport when vertical. */
+  readonly verticalViewPortHeight: import("@angular/core").InputSignal<string>;
+  readonly showIndicators: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly showNavigators: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly responsiveOptions: import("@angular/core").InputSignal<readonly HxCarouselResponsiveOption[] | undefined>;
+  /** The current page (0-based); `pageChange` is its output. */
+  readonly page: import("@angular/core").ModelSignal<number>;
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  readonly prevLabel: import("@angular/core").InputSignal<string>;
+  readonly nextLabel: import("@angular/core").InputSignal<string>;
+  /** `{page}` and `{pageCount}` are replaced. */
+  readonly pageLabelTemplate: import("@angular/core").InputSignal<string>;
+  /** `{index}` and `{count}` are replaced. */
+  readonly itemLabelTemplate: import("@angular/core").InputSignal<string>;
+  protected readonly itemTemplate: import("@angular/core").Signal<HxCarouselItem | undefined>;
+  protected readonly hovered: import("@angular/core").WritableSignal<boolean>;
+  protected readonly focused: import("@angular/core").WritableSignal<boolean>;
+  protected readonly id: string;
+  private readonly viewportWidth;
+  private readonly reducedMotion;
+  /** The visible/scroll counts for the current viewport (the smallest matching breakpoint wins). */
+  private readonly counts;
+  protected readonly visible: import("@angular/core").Signal<number>;
+  protected readonly scroll: import("@angular/core").Signal<number>;
+  protected readonly pageCount: import("@angular/core").Signal<number>;
+  protected readonly currentPage: import("@angular/core").Signal<number>;
+  /** The index of the first visible item. */
+  protected readonly first: import("@angular/core").Signal<number>;
+  protected readonly pages: import("@angular/core").Signal<number[]>;
+  protected readonly isFirst: import("@angular/core").Signal<boolean>;
+  protected readonly isLast: import("@angular/core").Signal<boolean>;
+  protected readonly prevDisabled: import("@angular/core").Signal<boolean>;
+  protected readonly nextDisabled: import("@angular/core").Signal<boolean>;
+  protected readonly itemSize: import("@angular/core").Signal<number>;
+  protected readonly offset: import("@angular/core").Signal<number>;
+  protected readonly transform: import("@angular/core").Signal<string>;
+  constructor();
+  protected isVisible(index: number): boolean;
+  protected itemLabel(index: number): string;
+  protected pageLabel(page: number): string;
+  /** Goes to a page (0-based); wraps around when `circular`, else clamps. */
+  goTo(page: number): void;
+  next(auto?: boolean): void;
+  prev(): void;
+  protected onKeydown(event: KeyboardEvent): void;
+  protected onIndicatorKeydown(event: KeyboardEvent): void;
+  protected onFocusOut(event: FocusEvent): void;
+  protected onResize(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HxCarousel<any>, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HxCarousel<any>, "hx-carousel", never, {
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "numVisible": {
+      "alias": "numVisible";
+      "required": false;
+      "isSignal": true;
+    };
+    "numScroll": {
+      "alias": "numScroll";
+      "required": false;
+      "isSignal": true;
+    };
+    "circular": {
+      "alias": "circular";
+      "required": false;
+      "isSignal": true;
+    };
+    "autoplayInterval": {
+      "alias": "autoplayInterval";
+      "required": false;
+      "isSignal": true;
+    };
+    "orientation": {
+      "alias": "orientation";
+      "required": false;
+      "isSignal": true;
+    };
+    "verticalViewPortHeight": {
+      "alias": "verticalViewPortHeight";
+      "required": false;
+      "isSignal": true;
+    };
+    "showIndicators": {
+      "alias": "showIndicators";
+      "required": false;
+      "isSignal": true;
+    };
+    "showNavigators": {
+      "alias": "showNavigators";
+      "required": false;
+      "isSignal": true;
+    };
+    "responsiveOptions": {
+      "alias": "responsiveOptions";
+      "required": false;
+      "isSignal": true;
+    };
+    "page": {
+      "alias": "page";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "ariaLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "prevLabel": {
+      "alias": "prevLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "nextLabel": {
+      "alias": "nextLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "pageLabelTemplate": {
+      "alias": "pageLabelTemplate";
+      "required": false;
+      "isSignal": true;
+    };
+    "itemLabelTemplate": {
+      "alias": "itemLabelTemplate";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "page": "pageChange";
+  }, ["itemTemplate"], ["[hxCarouselHeader]", "[hxCarouselFooter]"], true, never>;
+}
 type HxChartType = 'bar' | 'line' | 'scatter' | 'bubble' | 'pie' | 'doughnut' | 'polarArea' | 'radar';
 /** What `(dataSelect)` carries: the click and what chart.js found under it. */
 interface HxChartSelectEvent {
@@ -2441,6 +2615,213 @@ export declare class HxFloatLabel {
     };
   }, {}, never, ["*"], true, never>;
 }
+/** One picture of a galleria. */
+interface HxGalleriaItem {
+  src: string;
+  alt: string;
+  /** A smaller picture for the thumbnail strip (default: `src`). */
+  thumbnailSrc?: string;
+  title?: string;
+  caption?: string;
+}
+type HxGalleriaThumbnailsPosition = 'bottom' | 'top' | 'left' | 'right';
+interface HxGalleriaItemContext {
+  $implicit: HxGalleriaItem;
+  index: number;
+}
+/** The template of the stage: `<ng-template hxGalleriaItem let-item let-index="index">`. */
+export declare class HxGalleriaItemTemplate {
+  readonly template: TemplateRef<HxGalleriaItemContext>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HxGalleriaItemTemplate, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HxGalleriaItemTemplate, "ng-template[hxGalleriaItem]", never, {}, {}, never, never, true, never>;
+}
+/** The template of a thumbnail: `<ng-template hxGalleriaThumbnail let-item>`. */
+export declare class HxGalleriaThumbnail {
+  readonly template: TemplateRef<HxGalleriaItemContext>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HxGalleriaThumbnail, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HxGalleriaThumbnail, "ng-template[hxGalleriaThumbnail]", never, {}, {}, never, never, true, never>;
+}
+/** The template of the caption over the stage: `<ng-template hxGalleriaCaption let-item>`. */
+export declare class HxGalleriaCaption {
+  readonly template: TemplateRef<HxGalleriaItemContext>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HxGalleriaCaption, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HxGalleriaCaption, "ng-template[hxGalleriaCaption]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * An image gallery: a stage with the current picture, a strip of thumbnails, previous/next buttons, captions and an
+ * optional full-screen mode in a modal overlay.
+ *
+ * ```html
+ * <hx-galleria [value]="pictures" [(activeIndex)]="index" [numVisible]="5" circular ariaLabel="Product pictures" />
+ * <hx-galleria [value]="pictures" fullScreen [(visible)]="open" />
+ * ```
+ *
+ * The stage is a `region` with `aria-roledescription="carousel"` and the arrow keys move between pictures; the
+ * thumbnails are a `tablist`. Full screen is a modal dialog: the focus is trapped, Escape closes it and the focus goes
+ * back to where it was.
+ */
+export declare class HxGalleria {
+  #private;
+  readonly value: import("@angular/core").InputSignal<readonly HxGalleriaItem[]>;
+  /** The picture on the stage (0-based); `activeIndexChange` is its output. */
+  readonly activeIndex: import("@angular/core").ModelSignal<number>;
+  /** Thumbnails shown at a time. */
+  readonly numVisible: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  /** After the last picture comes the first again. */
+  readonly circular: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly autoplay: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly autoplayInterval: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly showThumbnails: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** Dots over the stage. */
+  readonly showIndicators: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly showItemNavigators: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly thumbnailsPosition: import("@angular/core").InputSignal<HxGalleriaThumbnailsPosition>;
+  /** The gallery is not shown inline; `visible` opens it in a modal overlay. */
+  readonly fullScreen: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** Full screen open (with `fullScreen`); `visibleChange` is its output. */
+  readonly visible: import("@angular/core").ModelSignal<boolean>;
+  /** CSS height of the stage inline (full screen uses the viewport). */
+  readonly height: import("@angular/core").InputSignal<string>;
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  readonly prevLabel: import("@angular/core").InputSignal<string>;
+  readonly nextLabel: import("@angular/core").InputSignal<string>;
+  readonly closeLabel: import("@angular/core").InputSignal<string>;
+  /** `{index}` and `{count}` are replaced. */
+  readonly itemLabelTemplate: import("@angular/core").InputSignal<string>;
+  protected readonly itemTemplate: import("@angular/core").Signal<HxGalleriaItemTemplate | undefined>;
+  protected readonly thumbnailTemplate: import("@angular/core").Signal<HxGalleriaThumbnail | undefined>;
+  protected readonly captionTemplate: import("@angular/core").Signal<HxGalleriaCaption | undefined>;
+  private readonly content;
+  protected readonly hovered: import("@angular/core").WritableSignal<boolean>;
+  protected readonly focused: import("@angular/core").WritableSignal<boolean>;
+  protected readonly id: string;
+  private readonly reducedMotion;
+  protected readonly count: import("@angular/core").Signal<number>;
+  protected readonly index: import("@angular/core").Signal<number>;
+  protected readonly current: import("@angular/core").Signal<HxGalleriaItem | undefined>;
+  protected readonly isFirst: import("@angular/core").Signal<boolean>;
+  protected readonly isLast: import("@angular/core").Signal<boolean>;
+  protected readonly prevDisabled: import("@angular/core").Signal<boolean>;
+  protected readonly nextDisabled: import("@angular/core").Signal<boolean>;
+  protected readonly indices: import("@angular/core").Signal<number[]>;
+  protected readonly hasCaption: import("@angular/core").Signal<boolean>;
+  /** The first thumbnail of the strip: the strip moves so the active picture stays visible. */
+  private readonly thumbStart;
+  protected readonly thumbsVisible: import("@angular/core").Signal<number>;
+  protected readonly thumbNavigation: import("@angular/core").Signal<boolean>;
+  protected readonly thumbs: import("@angular/core").Signal<number[]>;
+  protected readonly thumbPrevDisabled: import("@angular/core").Signal<boolean>;
+  protected readonly thumbNextDisabled: import("@angular/core").Signal<boolean>;
+  constructor();
+  protected itemLabel(index: number): string;
+  protected thumbnailSrc(item: HxGalleriaItem): string;
+  /** Shows a picture (0-based); wraps around when `circular`, else clamps. */
+  goTo(index: number): void;
+  next(auto?: boolean): void;
+  prev(): void;
+  protected scrollThumbs(delta: number): void;
+  protected onKeydown(event: KeyboardEvent): void;
+  protected onThumbKeydown(event: KeyboardEvent): void;
+  protected onFocusIn(): void;
+  protected onFocusOut(event: FocusEvent): void;
+  protected close(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HxGalleria, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HxGalleria, "hx-galleria", never, {
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "activeIndex": {
+      "alias": "activeIndex";
+      "required": false;
+      "isSignal": true;
+    };
+    "numVisible": {
+      "alias": "numVisible";
+      "required": false;
+      "isSignal": true;
+    };
+    "circular": {
+      "alias": "circular";
+      "required": false;
+      "isSignal": true;
+    };
+    "autoplay": {
+      "alias": "autoplay";
+      "required": false;
+      "isSignal": true;
+    };
+    "autoplayInterval": {
+      "alias": "autoplayInterval";
+      "required": false;
+      "isSignal": true;
+    };
+    "showThumbnails": {
+      "alias": "showThumbnails";
+      "required": false;
+      "isSignal": true;
+    };
+    "showIndicators": {
+      "alias": "showIndicators";
+      "required": false;
+      "isSignal": true;
+    };
+    "showItemNavigators": {
+      "alias": "showItemNavigators";
+      "required": false;
+      "isSignal": true;
+    };
+    "thumbnailsPosition": {
+      "alias": "thumbnailsPosition";
+      "required": false;
+      "isSignal": true;
+    };
+    "fullScreen": {
+      "alias": "fullScreen";
+      "required": false;
+      "isSignal": true;
+    };
+    "visible": {
+      "alias": "visible";
+      "required": false;
+      "isSignal": true;
+    };
+    "height": {
+      "alias": "height";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "ariaLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "prevLabel": {
+      "alias": "prevLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "nextLabel": {
+      "alias": "nextLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "closeLabel": {
+      "alias": "closeLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "itemLabelTemplate": {
+      "alias": "itemLabelTemplate";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "activeIndex": "activeIndexChange";
+    "visible": "visibleChange";
+  }, ["itemTemplate", "thumbnailTemplate", "captionTemplate"], never, true, never>;
+}
 type HxIconPosition = 'left' | 'right';
 /**
  * An icon inside a text field. Wrap an `hx-input` (or `hx-password`) and one `hx-input-icon` element; the
@@ -2477,6 +2858,167 @@ export declare class HxInputIcon {
   static ɵfac: i0.ɵɵFactoryDeclaration<HxInputIcon, never>;
   static ɵdir: i0.ɵɵDirectiveDeclaration<HxInputIcon, "[hx-input-icon]", never, {}, {}, never, never, true, never>;
 }
+/** The content of the hover indicator over a previewable image: `<ng-template hxImageIndicator>`. */
+export declare class HxImageIndicator {
+  readonly template: TemplateRef<unknown>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HxImageIndicator, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HxImageIndicator, "ng-template[hxImageIndicator]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * An image, optionally with a preview: a click (or Enter on the button over it) opens the picture in a modal
+ * overlay with a toolbar to rotate, zoom and close.
+ *
+ * ```html
+ * <hx-image src="product.jpg" alt="Bamboo watch" width="250" preview />
+ * <hx-image src="thumb.jpg" previewImageSrc="large.jpg" alt="Bamboo watch" preview />
+ * ```
+ *
+ * The preview trigger is a button named "Preview {alt}"; the overlay is a modal dialog (focus trap, Escape closes,
+ * focus restored); the toolbar buttons are labelled; + and - zoom from the keyboard.
+ */
+export declare class HxImage {
+  #private;
+  readonly src: import("@angular/core").InputSignal<string>;
+  readonly alt: import("@angular/core").InputSignal<string>;
+  /** Width and height of the inline image (CSS or number of pixels). */
+  readonly width: import("@angular/core").InputSignal<string | number | undefined>;
+  readonly height: import("@angular/core").InputSignal<string | number | undefined>;
+  /** A click opens the picture in an overlay. */
+  readonly preview: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** A larger picture for the overlay (default: `src`). */
+  readonly previewImageSrc: import("@angular/core").InputSignal<string | undefined>;
+  readonly imageClass: import("@angular/core").InputSignal<string | undefined>;
+  readonly imageStyle: import("@angular/core").InputSignal<Record<string, string> | undefined>;
+  readonly showToolbar: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly zoomStep: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly zoomMin: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly zoomMax: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  /** `{alt}` is replaced. */
+  readonly previewLabelTemplate: import("@angular/core").InputSignal<string>;
+  readonly rotateLeftLabel: import("@angular/core").InputSignal<string>;
+  readonly rotateRightLabel: import("@angular/core").InputSignal<string>;
+  readonly zoomOutLabel: import("@angular/core").InputSignal<string>;
+  readonly zoomInLabel: import("@angular/core").InputSignal<string>;
+  readonly closeLabel: import("@angular/core").InputSignal<string>;
+  /** The preview opened. */
+  readonly show: import("@angular/core").OutputEmitterRef<void>;
+  /** The preview closed. */
+  readonly hide: import("@angular/core").OutputEmitterRef<void>;
+  protected readonly indicatorTemplate: import("@angular/core").Signal<HxImageIndicator | undefined>;
+  private readonly overlay;
+  protected readonly rotation: import("@angular/core").WritableSignal<number>;
+  protected readonly scale: import("@angular/core").WritableSignal<number>;
+  protected readonly transform: import("@angular/core").Signal<string>;
+  protected readonly previewLabel: import("@angular/core").Signal<string>;
+  protected readonly previewSrc: import("@angular/core").Signal<string>;
+  protected readonly zoomOutDisabled: import("@angular/core").Signal<boolean>;
+  protected readonly zoomInDisabled: import("@angular/core").Signal<boolean>;
+  constructor();
+  protected cssSize(value: string | number | undefined): string | null;
+  /** Opens the preview. */
+  open(): void;
+  /** Closes the preview. */
+  close(): void;
+  protected rotate(degrees: number): void;
+  protected zoom(direction: 1 | -1): void;
+  protected onKeydown(event: KeyboardEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HxImage, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HxImage, "hx-image", never, {
+    "src": {
+      "alias": "src";
+      "required": true;
+      "isSignal": true;
+    };
+    "alt": {
+      "alias": "alt";
+      "required": true;
+      "isSignal": true;
+    };
+    "width": {
+      "alias": "width";
+      "required": false;
+      "isSignal": true;
+    };
+    "height": {
+      "alias": "height";
+      "required": false;
+      "isSignal": true;
+    };
+    "preview": {
+      "alias": "preview";
+      "required": false;
+      "isSignal": true;
+    };
+    "previewImageSrc": {
+      "alias": "previewImageSrc";
+      "required": false;
+      "isSignal": true;
+    };
+    "imageClass": {
+      "alias": "imageClass";
+      "required": false;
+      "isSignal": true;
+    };
+    "imageStyle": {
+      "alias": "imageStyle";
+      "required": false;
+      "isSignal": true;
+    };
+    "showToolbar": {
+      "alias": "showToolbar";
+      "required": false;
+      "isSignal": true;
+    };
+    "zoomStep": {
+      "alias": "zoomStep";
+      "required": false;
+      "isSignal": true;
+    };
+    "zoomMin": {
+      "alias": "zoomMin";
+      "required": false;
+      "isSignal": true;
+    };
+    "zoomMax": {
+      "alias": "zoomMax";
+      "required": false;
+      "isSignal": true;
+    };
+    "previewLabelTemplate": {
+      "alias": "previewLabelTemplate";
+      "required": false;
+      "isSignal": true;
+    };
+    "rotateLeftLabel": {
+      "alias": "rotateLeftLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "rotateRightLabel": {
+      "alias": "rotateRightLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "zoomOutLabel": {
+      "alias": "zoomOutLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "zoomInLabel": {
+      "alias": "zoomInLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "closeLabel": {
+      "alias": "closeLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "show": "show";
+    "hide": "hide";
+  }, ["indicatorTemplate"], never, true, never>;
+}
 type HxInputSize = 'small' | 'medium' | 'large';
 type HxInputVariant = 'outlined' | 'filled';
 /**
@@ -5307,4 +5849,4 @@ export declare class HxTree {
     "nodeCollapse": "nodeCollapse";
   }, ["template"], never, true, never>;
 }
-export type { HxAccordionValue, HxAutoCompleteEvent, HxAutoCompleteSize, HxAvatarShape, HxAvatarSize, HxBadgeSeverity, HxBadgeSize, HxBreadcrumbItem, HxButtonSeverity, HxButtonSize, HxButtonVariant, HxCellContext, HxChartInstance, HxChartModule, HxChartSelectEvent, HxChartType, HxCheckboxSize, HxColumn, HxColumnAlign, HxConfirmation, HxDatePickerSelectionMode, HxDatePickerValue, HxDialogConfig, HxDialogPosition, HxDividerAlign, HxDividerLayout, HxDividerType, HxDrawerPosition, HxFileUploadMode, HxFloatLabelVariant, HxIconPosition, HxInputNumberButtonLayout, HxInputNumberMode, HxInputNumberSize, HxInputNumberVariant, HxInputSize, HxInputVariant, HxLazyLoadEvent, HxMenuItem, HxMenuItemCommandEvent, HxMessageSeverity, HxMessageSize, HxMessageVariant, HxMultiSelectDisplay, HxMultiSelectSize, HxMultiSelectVariant, HxPageEvent, HxPrimaryColor, HxProgressMode, HxRadioSize, HxSelectButtonSize, HxSelectItem, HxSelectSize, HxSelectVariant, HxSelectionMode, HxSkeletonAnimation, HxSkeletonShape, HxSliderOrientation, HxSliderValue, HxSortFunction, HxSortMeta, HxSortMode, HxStepContentContext, HxStepValue, HxSurface, HxTableColumnsContext, HxTableRowContext, HxTableSize, HxTagSeverity, HxThemeOptions, HxTimelineAlign, HxTimelineContext, HxTimelineLayout, HxToastMessage, HxToastMessageInput, HxToastPosition, HxToastSeverity, HxToggleButtonSize, HxTooltipEvent, HxTooltipPosition, HxTreeFilterMode, HxTreeNode, HxTreeNodeContext, HxTreeNodeEvent, HxTreeSelection, HxTreeSelectionMode };
+export type { HxAccordionValue, HxAutoCompleteEvent, HxAutoCompleteSize, HxAvatarShape, HxAvatarSize, HxBadgeSeverity, HxBadgeSize, HxBreadcrumbItem, HxButtonSeverity, HxButtonSize, HxButtonVariant, HxCarouselItemContext, HxCarouselOrientation, HxCarouselResponsiveOption, HxCellContext, HxChartInstance, HxChartModule, HxChartSelectEvent, HxChartType, HxCheckboxSize, HxColumn, HxColumnAlign, HxConfirmation, HxDatePickerSelectionMode, HxDatePickerValue, HxDialogConfig, HxDialogPosition, HxDividerAlign, HxDividerLayout, HxDividerType, HxDrawerPosition, HxFileUploadMode, HxFloatLabelVariant, HxGalleriaItem, HxGalleriaItemContext, HxGalleriaThumbnailsPosition, HxIconPosition, HxInputNumberButtonLayout, HxInputNumberMode, HxInputNumberSize, HxInputNumberVariant, HxInputSize, HxInputVariant, HxLazyLoadEvent, HxMenuItem, HxMenuItemCommandEvent, HxMessageSeverity, HxMessageSize, HxMessageVariant, HxMultiSelectDisplay, HxMultiSelectSize, HxMultiSelectVariant, HxPageEvent, HxPrimaryColor, HxProgressMode, HxRadioSize, HxSelectButtonSize, HxSelectItem, HxSelectSize, HxSelectVariant, HxSelectionMode, HxSkeletonAnimation, HxSkeletonShape, HxSliderOrientation, HxSliderValue, HxSortFunction, HxSortMeta, HxSortMode, HxStepContentContext, HxStepValue, HxSurface, HxTableColumnsContext, HxTableRowContext, HxTableSize, HxTagSeverity, HxThemeOptions, HxTimelineAlign, HxTimelineContext, HxTimelineLayout, HxToastMessage, HxToastMessageInput, HxToastPosition, HxToastSeverity, HxToggleButtonSize, HxTooltipEvent, HxTooltipPosition, HxTreeFilterMode, HxTreeNode, HxTreeNodeContext, HxTreeNodeEvent, HxTreeSelection, HxTreeSelectionMode };