@alto-avios/alto-ui 3.2.1 → 3.3.0

package/dist/assets/Button.css

@@ -1 +1 @@
-._button_etsb3_1{background:var(--alto-sem-color-bg-accent-vibrant-default);border:none;border-radius:var(--alto-button-md-radius);box-sizing:border-box;color:var(--alto-sem-color-fg-accent-on-vibrant);cursor:pointer;font-family:var(--alto-sem-text-body-font-family);font-style:normal;font-weight:500;justify-content:center;padding:var(--alto-sem-space-xs) var(--alto-sem-space-md);text-decoration:none}._button_etsb3_1,._button_etsb3_1 ._content_etsb3_19{align-items:center;display:inline-flex;gap:var(--alto-sem-space-2xs)}._isNotLoading_etsb3_28 ._loadingSpinner_etsb3_28{opacity:0;position:absolute}._isNotLoading_etsb3_28 ._content_etsb3_19{opacity:1}._isLoading_etsb3_37 ._loadingSpinner_etsb3_28{opacity:1;position:absolute}._isLoading_etsb3_37 ._content_etsb3_19{opacity:0}._focusWhite_etsb3_49[data-focused]{outline-color:var(--alto-sem-color-border-white)}._sm_etsb3_56{font-size:var(--alto-sem-text-body-sm-font-size);letter-spacing:var(--alto-sem-text-body-sm-letter-spacing);line-height:var(--alto-sem-text-label-sm-line-height);min-height:36px;padding:var(--alto-sem-space-2xs) var(--alto-sem-space-md)}._md_etsb3_64{font-size:var(--alto-sem-text-body-md-font-size);letter-spacing:var(--alto-sem-text-body-md-letter-spacing);line-height:var(--alto-sem-text-body-md-line-height);min-height:48px;padding:var(--alto-sem-space-xs) var(--alto-sem-space-lg)}._lg_etsb3_72{font-size:var(--alto-sem-text-body-lg-font-size);height:55px;letter-spacing:var(--alto-sem-text-body-lg-letter-spacing);line-height:var(--alto-sem-text-body-lg-line-height);padding:var(--alto-sem-space-sm) var(--alto-sem-space-lg)}._fullWidth_etsb3_80{width:100%}._textAlignLeft_etsb3_87{text-align:left}._textAlignCenter_etsb3_91{text-align:center}._textAlignRight_etsb3_95{text-align:right}._accentPrimary_etsb3_103[data-focused],._accentPrimary_etsb3_103[data-hovered]{background:var(--alto-sem-color-bg-accent-vibrant-hover)}._accentPrimary_etsb3_103[data-pressed]{background:var(--alto-sem-color-bg-accent-vibrant-active)}._accentPrimary_etsb3_103[data-pressed][data-focused]{outline:none}._accentPrimary_etsb3_103:disabled,._accentPrimary_etsb3_103[aria-disabled]{background:var(--alto-sem-color-bg-disabled-vibrant);cursor:not-allowed;pointer-events:auto}._accentSecondary_etsb3_123{background-color:transparent;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-accent);color:var(--alto-sem-color-fg-accent-primary)}._accentSecondary_etsb3_123[data-focused],._accentSecondary_etsb3_123[data-hovered]{background:var(--alto-sem-color-bg-accent-subtle-hover)}._accentSecondary_etsb3_123[data-pressed]{background:var(--alto-sem-color-bg-accent-subtle-active)}._accentSecondary_etsb3_123[data-pressed][data-focused]{outline:none}._accentSecondary_etsb3_123:disabled,._accentSecondary_etsb3_123[aria-disabled]{background:none;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-disabled-vibrant);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._accentTertiary_etsb3_153{background:var(--alto-sem-color-bg-accent-subtle-default);color:var(--alto-sem-color-fg-accent-primary)}._accentTertiary_etsb3_153[data-focused],._accentTertiary_etsb3_153[data-hovered]{background:var(--alto-sem-color-bg-accent-subtle-hover)}._accentTertiary_etsb3_153[data-pressed]{background:var(--alto-sem-color-bg-accent-subtle-active)}._accentTertiary_etsb3_153[data-pressed][data-focused]{outline:none}._accentTertiary_etsb3_153:disabled,._accentTertiary_etsb3_153[aria-disabled]{background:var(--alto-sem-color-bg-disabled-subtle);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._accentQuaternary_etsb3_179{background:none;color:var(--alto-sem-color-fg-accent-primary)}._accentQuaternary_etsb3_179[data-focused],._accentQuaternary_etsb3_179[data-hovered]{background:var(--alto-sem-color-bg-accent-subtle-hover)}._accentQuaternary_etsb3_179[data-pressed]{background:var(--alto-sem-color-bg-accent-subtle-active)}._accentQuaternary_etsb3_179[data-pressed][data-focused]{outline:none}._accentQuaternary_etsb3_179:disabled,._accentQuaternary_etsb3_179[aria-disabled]{color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._criticalPrimary_etsb3_205{background:var(--alto-sem-color-bg-critical-vibrant-default);color:var(--alto-sem-color-fg-critical-on-vibrant)}._criticalPrimary_etsb3_205[data-focused],._criticalPrimary_etsb3_205[data-hovered]{background:var(--alto-sem-color-bg-critical-vibrant-hover)}._criticalPrimary_etsb3_205[data-pressed]{background:var(--alto-sem-color-bg-critical-vibrant-active)}._criticalPrimary_etsb3_205[data-pressed][data-focused]{outline:none}._criticalPrimary_etsb3_205:disabled,._criticalPrimary_etsb3_205[aria-disabled]{background:var(--alto-sem-color-bg-disabled-vibrant);cursor:not-allowed;pointer-events:auto}._criticalSecondary_etsb3_230{background:transparent;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-critical);color:var(--alto-sem-color-fg-critical-primary)}._criticalSecondary_etsb3_230[data-focused],._criticalSecondary_etsb3_230[data-hovered]{background:var(--alto-sem-color-bg-critical-subtle-hover)}._criticalSecondary_etsb3_230[data-pressed]{background:var(--alto-sem-color-bg-critical-subtle-active)}._criticalSecondary_etsb3_230[data-pressed][data-focused]{outline:none}._criticalSecondary_etsb3_230:disabled,._criticalSecondary_etsb3_230[aria-disabled]{background:none;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-disabled-vibrant);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._criticalTertiary_etsb3_260{background:var(--alto-sem-color-bg-critical-subtle-default);color:var(--alto-sem-color-fg-critical-primary)}._criticalTertiary_etsb3_260[data-focused],._criticalTertiary_etsb3_260[data-hovered]{background:var(--alto-sem-color-bg-critical-subtle-hover)}._criticalTertiary_etsb3_260[data-pressed]{background:var(--alto-sem-color-bg-critical-subtle-active)}._criticalTertiary_etsb3_260[data-pressed][data-focused]{outline:none}._criticalTertiary_etsb3_260:disabled,._criticalTertiary_etsb3_260[aria-disabled]{background:var(--alto-sem-color-bg-disabled-subtle);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._criticalQuaternary_etsb3_286{background:none;color:var(--alto-sem-color-fg-critical-primary)}._criticalQuaternary_etsb3_286[data-focused],._criticalQuaternary_etsb3_286[data-hovered]{background:var(--alto-sem-color-bg-critical-subtle-hover)}._criticalQuaternary_etsb3_286[data-pressed]{background:var(--alto-sem-color-bg-critical-subtle-active)}._criticalQuaternary_etsb3_286[data-pressed][data-focused]{outline:none}._criticalQuaternary_etsb3_286:disabled,._criticalQuaternary_etsb3_286[aria-disabled]{background:none;color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._neutralPrimary_etsb3_313{background:var(--alto-sem-color-bg-inverse-vibrant-default);color:var(--alto-sem-color-fg-inverse-on-vibrant)}._neutralPrimary_etsb3_313[data-focused],._neutralPrimary_etsb3_313[data-hovered]{background:var(--alto-sem-color-bg-inverse-vibrant-hover)}._neutralPrimary_etsb3_313[data-pressed]{background:var(--alto-sem-color-bg-inverse-vibrant-active)}._neutralPrimary_etsb3_313[data-pressed][data-focused]{outline:none}._neutralPrimary_etsb3_313:disabled,._neutralPrimary_etsb3_313[aria-disabled]{background:var(--alto-sem-color-bg-disabled-vibrant);cursor:not-allowed;pointer-events:auto}._neutralSecondary_etsb3_338{background:transparent;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-inverse);color:var(--alto-sem-color-fg-inverse-on-subtle)}._neutralSecondary_etsb3_338[data-focused],._neutralSecondary_etsb3_338[data-hovered]{background:var(--alto-sem-color-bg-inverse-subtle-hover)}._neutralSecondary_etsb3_338[data-pressed]{background:var(--alto-sem-color-bg-inverse-subtle-active)}._neutralSecondary_etsb3_338[data-pressed][data-focused]{outline:none}._neutralSecondary_etsb3_338:disabled,._neutralSecondary_etsb3_338[aria-disabled]{background:none;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-disabled-vibrant);cursor:not-allowed;pointer-events:auto}._neutralTertiary_etsb3_367{background:var(--alto-sem-color-bg-inverse-subtle-default);color:var(--alto-sem-color-fg-primary)}._neutralTertiary_etsb3_367[data-focused],._neutralTertiary_etsb3_367[data-hovered]{background:var(--alto-sem-color-bg-inverse-subtle-hover)}._neutralTertiary_etsb3_367[data-pressed]{background:var(--alto-sem-color-bg-inverse-subtle-active)}._neutralTertiary_etsb3_367[data-pressed][data-focused]{outline:none}._neutralTertiary_etsb3_367:disabled,._neutralTertiary_etsb3_367[aria-disabled]{background:var(--alto-sem-color-bg-disabled-subtle);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._neutralQuaternary_etsb3_393{background:none;color:var(--alto-sem-color-fg-primary)}._neutralQuaternary_etsb3_393[data-focused],._neutralQuaternary_etsb3_393[data-hovered]{background:var(--alto-sem-color-bg-inverse-subtle-hover)}._neutralQuaternary_etsb3_393[data-pressed]{background:var(--alto-sem-color-bg-inverse-subtle-active)}._neutralQuaternary_etsb3_393[data-pressed][data-focused]{outline:none}._neutralQuaternary_etsb3_393:disabled,._neutralQuaternary_etsb3_393[aria-disabled]{background:none;color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._whitePrimary_etsb3_420{background:var(--alto-sem-color-bg-white-vibrant-default);color:var(--alto-sem-color-fg-white-on-vibrant)}._whitePrimary_etsb3_420[data-focused],._whitePrimary_etsb3_420[data-hovered]{background:var(--alto-sem-color-bg-white-vibrant-hover)}._whitePrimary_etsb3_420[data-pressed]{background:var(--alto-sem-color-bg-white-vibrant-active)}._whitePrimary_etsb3_420[data-pressed][data-focused]{outline:none}._whitePrimary_etsb3_420:disabled,._whitePrimary_etsb3_420[aria-disabled]{background:#ffffff52;color:var(--alto-sem-color-fg-disabled-on-vibrant);cursor:not-allowed;pointer-events:auto}._whiteSecondary_etsb3_446{background:transparent;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-white);color:var(--alto-sem-color-fg-white-on-subtle)}._whiteSecondary_etsb3_446[data-focused],._whiteSecondary_etsb3_446[data-hovered]{background:var(--alto-sem-color-overlay-state-darken-hover)}._whiteSecondary_etsb3_446[data-pressed]{background:var(--alto-sem-color-overlay-state-darken-active)}._whiteSecondary_etsb3_446[data-pressed][data-focused]{outline:none}._whiteSecondary_etsb3_446[data-focused]{outline-color:var(--alto-sem-color-border-white)}._whiteSecondary_etsb3_446:disabled,._whiteSecondary_etsb3_446[aria-disabled]{background:none;border:var(--alto-sem-border-width-sm) solid hsla(0,0%,100%,.32);color:#ffffff52;cursor:not-allowed;pointer-events:auto}._whiteTertiary_etsb3_479{background:var(--alto-sem-color-bg-white-subtle-default);color:var(--alto-sem-color-fg-white-on-subtle)}._whiteTertiary_etsb3_479[data-focused],._whiteTertiary_etsb3_479[data-hovered]{background:var(--alto-sem-color-bg-white-subtle-hover)}._whiteTertiary_etsb3_479[data-pressed]{background:var(--alto-sem-color-bg-white-subtle-active)}._whiteTertiary_etsb3_479[data-pressed][data-focused]{outline:none}._whiteTertiary_etsb3_479[data-focused]{outline-color:var(--alto-sem-color-border-white)}._whiteTertiary_etsb3_479:disabled,._whiteTertiary_etsb3_479[aria-disabled]{background:#0000000d;color:#ffffff52;cursor:not-allowed;pointer-events:auto}._whiteQuaternary_etsb3_509{background:none;color:var(--alto-sem-color-fg-white-primary)}._whiteQuaternary_etsb3_509[data-focused],._whiteQuaternary_etsb3_509[data-hovered]{background:var(--alto-sem-color-bg-white-subtle-hover)}._whiteQuaternary_etsb3_509[data-pressed]{background:var(--alto-sem-color-bg-white-subtle-active)}._whiteQuaternary_etsb3_509[data-pressed][data-focused]{outline:none}._whiteQuaternary_etsb3_509[data-focused]{outline-color:var(--alto-sem-color-border-white)}._whiteQuaternary_etsb3_509:disabled,._whiteQuaternary_etsb3_509[aria-disabled]{background:none;color:#ffffff52;cursor:not-allowed;pointer-events:auto}._fa-spinner-third_etsb3_541{height:1rem;width:1rem}._icon-wrapper_etsb3_546{all:unset;align-items:center;display:flex;height:1em;justify-content:center;width:1em}
+._button_1o6d2_1{background:var(--alto-sem-color-bg-accent-vibrant-default);border:none;border-radius:var(--alto-button-md-radius);box-sizing:border-box;color:var(--alto-sem-color-fg-accent-on-vibrant);cursor:pointer;font-family:var(--alto-sem-text-body-font-family);font-style:normal;font-weight:500;justify-content:center;padding:var(--alto-sem-space-xs) var(--alto-sem-space-md);text-decoration:none}._button_1o6d2_1,._button_1o6d2_1 ._content_1o6d2_19{align-items:center;display:inline-flex;gap:var(--alto-sem-space-2xs)}._isNotLoading_1o6d2_28 ._loadingSpinner_1o6d2_28{opacity:0;position:absolute}._isNotLoading_1o6d2_28 ._content_1o6d2_19{opacity:1}._isLoading_1o6d2_37 ._loadingSpinner_1o6d2_28{opacity:1;position:absolute}._isLoading_1o6d2_37 ._content_1o6d2_19{opacity:0}._focusWhite_1o6d2_49[data-focused]{outline-color:var(--alto-sem-color-border-white)}._sm_1o6d2_56{font-size:var(--alto-sem-text-label-sm-font-size);letter-spacing:var(--alto-sem-text-label-sm-letter-spacing);line-height:var(--alto-sem-text-label-sm-line-height);min-height:36px;padding:var(--alto-sem-space-2xs) var(--alto-sem-space-md)}._md_1o6d2_64{font-size:var(--alto-sem-text-label-md-font-size);letter-spacing:var(--alto-sem-text-label-md-letter-spacing);line-height:var(--alto-sem-text-label-md-line-height);min-height:48px;padding:var(--alto-sem-space-xs) var(--alto-sem-space-lg)}._lg_1o6d2_72{font-size:var(--alto-sem-text-label-lg-font-size);height:55px;letter-spacing:var(--alto-sem-text-label-lg-letter-spacing);line-height:var(--alto-sem-text-label-lg-line-height);padding:var(--alto-sem-space-sm) var(--alto-sem-space-lg)}._fullWidth_1o6d2_80{width:100%}._textAlignLeft_1o6d2_87{text-align:left}._textAlignCenter_1o6d2_91{text-align:center}._textAlignRight_1o6d2_95{text-align:right}._accentPrimary_1o6d2_103[data-focused],._accentPrimary_1o6d2_103[data-hovered]{background:var(--alto-sem-color-bg-accent-vibrant-hover)}._accentPrimary_1o6d2_103[data-pressed]{background:var(--alto-sem-color-bg-accent-vibrant-active)}._accentPrimary_1o6d2_103[data-pressed][data-focused]{outline:none}._accentPrimary_1o6d2_103:disabled,._accentPrimary_1o6d2_103[aria-disabled]{background:var(--alto-sem-color-bg-disabled-vibrant);cursor:not-allowed;pointer-events:auto}._accentSecondary_1o6d2_123{background-color:transparent;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-accent);color:var(--alto-sem-color-fg-accent-primary)}._accentSecondary_1o6d2_123[data-focused],._accentSecondary_1o6d2_123[data-hovered]{background:var(--alto-sem-color-bg-accent-subtle-hover)}._accentSecondary_1o6d2_123[data-pressed]{background:var(--alto-sem-color-bg-accent-subtle-active)}._accentSecondary_1o6d2_123[data-pressed][data-focused]{outline:none}._accentSecondary_1o6d2_123:disabled,._accentSecondary_1o6d2_123[aria-disabled]{background:none;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-disabled-vibrant);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._accentTertiary_1o6d2_153{background:var(--alto-sem-color-bg-accent-subtle-default);color:var(--alto-sem-color-fg-accent-primary)}._accentTertiary_1o6d2_153[data-focused],._accentTertiary_1o6d2_153[data-hovered]{background:var(--alto-sem-color-bg-accent-subtle-hover)}._accentTertiary_1o6d2_153[data-pressed]{background:var(--alto-sem-color-bg-accent-subtle-active)}._accentTertiary_1o6d2_153[data-pressed][data-focused]{outline:none}._accentTertiary_1o6d2_153:disabled,._accentTertiary_1o6d2_153[aria-disabled]{background:var(--alto-sem-color-bg-disabled-subtle);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._accentQuaternary_1o6d2_179{background:none;color:var(--alto-sem-color-fg-accent-primary)}._accentQuaternary_1o6d2_179[data-focused],._accentQuaternary_1o6d2_179[data-hovered]{background:var(--alto-sem-color-bg-accent-subtle-hover)}._accentQuaternary_1o6d2_179[data-pressed]{background:var(--alto-sem-color-bg-accent-subtle-active)}._accentQuaternary_1o6d2_179[data-pressed][data-focused]{outline:none}._accentQuaternary_1o6d2_179:disabled,._accentQuaternary_1o6d2_179[aria-disabled]{color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._criticalPrimary_1o6d2_205{background:var(--alto-sem-color-bg-critical-vibrant-default);color:var(--alto-sem-color-fg-critical-on-vibrant)}._criticalPrimary_1o6d2_205[data-focused],._criticalPrimary_1o6d2_205[data-hovered]{background:var(--alto-sem-color-bg-critical-vibrant-hover)}._criticalPrimary_1o6d2_205[data-pressed]{background:var(--alto-sem-color-bg-critical-vibrant-active)}._criticalPrimary_1o6d2_205[data-pressed][data-focused]{outline:none}._criticalPrimary_1o6d2_205:disabled,._criticalPrimary_1o6d2_205[aria-disabled]{background:var(--alto-sem-color-bg-disabled-vibrant);cursor:not-allowed;pointer-events:auto}._criticalSecondary_1o6d2_230{background:transparent;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-critical);color:var(--alto-sem-color-fg-critical-primary)}._criticalSecondary_1o6d2_230[data-focused],._criticalSecondary_1o6d2_230[data-hovered]{background:var(--alto-sem-color-bg-critical-subtle-hover)}._criticalSecondary_1o6d2_230[data-pressed]{background:var(--alto-sem-color-bg-critical-subtle-active)}._criticalSecondary_1o6d2_230[data-pressed][data-focused]{outline:none}._criticalSecondary_1o6d2_230:disabled,._criticalSecondary_1o6d2_230[aria-disabled]{background:none;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-disabled-vibrant);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._criticalTertiary_1o6d2_260{background:var(--alto-sem-color-bg-critical-subtle-default);color:var(--alto-sem-color-fg-critical-primary)}._criticalTertiary_1o6d2_260[data-focused],._criticalTertiary_1o6d2_260[data-hovered]{background:var(--alto-sem-color-bg-critical-subtle-hover)}._criticalTertiary_1o6d2_260[data-pressed]{background:var(--alto-sem-color-bg-critical-subtle-active)}._criticalTertiary_1o6d2_260[data-pressed][data-focused]{outline:none}._criticalTertiary_1o6d2_260:disabled,._criticalTertiary_1o6d2_260[aria-disabled]{background:var(--alto-sem-color-bg-disabled-subtle);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._criticalQuaternary_1o6d2_286{background:none;color:var(--alto-sem-color-fg-critical-primary)}._criticalQuaternary_1o6d2_286[data-focused],._criticalQuaternary_1o6d2_286[data-hovered]{background:var(--alto-sem-color-bg-critical-subtle-hover)}._criticalQuaternary_1o6d2_286[data-pressed]{background:var(--alto-sem-color-bg-critical-subtle-active)}._criticalQuaternary_1o6d2_286[data-pressed][data-focused]{outline:none}._criticalQuaternary_1o6d2_286:disabled,._criticalQuaternary_1o6d2_286[aria-disabled]{background:none;color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._neutralPrimary_1o6d2_313{background:var(--alto-sem-color-bg-inverse-vibrant-default);color:var(--alto-sem-color-fg-inverse-on-vibrant)}._neutralPrimary_1o6d2_313[data-focused],._neutralPrimary_1o6d2_313[data-hovered]{background:var(--alto-sem-color-bg-inverse-vibrant-hover)}._neutralPrimary_1o6d2_313[data-pressed]{background:var(--alto-sem-color-bg-inverse-vibrant-active)}._neutralPrimary_1o6d2_313[data-pressed][data-focused]{outline:none}._neutralPrimary_1o6d2_313:disabled,._neutralPrimary_1o6d2_313[aria-disabled]{background:var(--alto-sem-color-bg-disabled-vibrant);cursor:not-allowed;pointer-events:auto}._neutralSecondary_1o6d2_338{background:transparent;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-inverse);color:var(--alto-sem-color-fg-inverse-on-subtle)}._neutralSecondary_1o6d2_338[data-focused],._neutralSecondary_1o6d2_338[data-hovered]{background:var(--alto-sem-color-bg-inverse-subtle-hover)}._neutralSecondary_1o6d2_338[data-pressed]{background:var(--alto-sem-color-bg-inverse-subtle-active)}._neutralSecondary_1o6d2_338[data-pressed][data-focused]{outline:none}._neutralSecondary_1o6d2_338:disabled,._neutralSecondary_1o6d2_338[aria-disabled]{background:none;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-disabled-vibrant);cursor:not-allowed;pointer-events:auto}._neutralTertiary_1o6d2_367{background:var(--alto-sem-color-bg-inverse-subtle-default);color:var(--alto-sem-color-fg-primary)}._neutralTertiary_1o6d2_367[data-focused],._neutralTertiary_1o6d2_367[data-hovered]{background:var(--alto-sem-color-bg-inverse-subtle-hover)}._neutralTertiary_1o6d2_367[data-pressed]{background:var(--alto-sem-color-bg-inverse-subtle-active)}._neutralTertiary_1o6d2_367[data-pressed][data-focused]{outline:none}._neutralTertiary_1o6d2_367:disabled,._neutralTertiary_1o6d2_367[aria-disabled]{background:var(--alto-sem-color-bg-disabled-subtle);color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._neutralQuaternary_1o6d2_393{background:none;color:var(--alto-sem-color-fg-primary)}._neutralQuaternary_1o6d2_393[data-focused],._neutralQuaternary_1o6d2_393[data-hovered]{background:var(--alto-sem-color-bg-inverse-subtle-hover)}._neutralQuaternary_1o6d2_393[data-pressed]{background:var(--alto-sem-color-bg-inverse-subtle-active)}._neutralQuaternary_1o6d2_393[data-pressed][data-focused]{outline:none}._neutralQuaternary_1o6d2_393:disabled,._neutralQuaternary_1o6d2_393[aria-disabled]{background:none;color:var(--alto-sem-color-fg-disabled-primary);cursor:not-allowed;pointer-events:auto}._whitePrimary_1o6d2_420{background:var(--alto-sem-color-bg-white-vibrant-default);color:var(--alto-sem-color-fg-white-on-vibrant)}._whitePrimary_1o6d2_420[data-focused],._whitePrimary_1o6d2_420[data-hovered]{background:var(--alto-sem-color-bg-white-vibrant-hover)}._whitePrimary_1o6d2_420[data-pressed]{background:var(--alto-sem-color-bg-white-vibrant-active)}._whitePrimary_1o6d2_420[data-pressed][data-focused]{outline:none}._whitePrimary_1o6d2_420:disabled,._whitePrimary_1o6d2_420[aria-disabled]{background:#ffffff52;color:var(--alto-sem-color-fg-disabled-on-vibrant);cursor:not-allowed;pointer-events:auto}._whiteSecondary_1o6d2_446{background:transparent;border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-white);color:var(--alto-sem-color-fg-white-on-subtle)}._whiteSecondary_1o6d2_446[data-focused],._whiteSecondary_1o6d2_446[data-hovered]{background:var(--alto-sem-color-overlay-state-darken-hover)}._whiteSecondary_1o6d2_446[data-pressed]{background:var(--alto-sem-color-overlay-state-darken-active)}._whiteSecondary_1o6d2_446[data-pressed][data-focused]{outline:none}._whiteSecondary_1o6d2_446[data-focused]{outline-color:var(--alto-sem-color-border-white)}._whiteSecondary_1o6d2_446:disabled,._whiteSecondary_1o6d2_446[aria-disabled]{background:none;border:var(--alto-sem-border-width-sm) solid hsla(0,0%,100%,.32);color:#ffffff52;cursor:not-allowed;pointer-events:auto}._whiteTertiary_1o6d2_479{background:var(--alto-sem-color-bg-white-subtle-default);color:var(--alto-sem-color-fg-white-on-subtle)}._whiteTertiary_1o6d2_479[data-focused],._whiteTertiary_1o6d2_479[data-hovered]{background:var(--alto-sem-color-bg-white-subtle-hover)}._whiteTertiary_1o6d2_479[data-pressed]{background:var(--alto-sem-color-bg-white-subtle-active)}._whiteTertiary_1o6d2_479[data-pressed][data-focused]{outline:none}._whiteTertiary_1o6d2_479[data-focused]{outline-color:var(--alto-sem-color-border-white)}._whiteTertiary_1o6d2_479:disabled,._whiteTertiary_1o6d2_479[aria-disabled]{background:#0000000d;color:#ffffff52;cursor:not-allowed;pointer-events:auto}._whiteQuaternary_1o6d2_509{background:none;color:var(--alto-sem-color-fg-white-primary)}._whiteQuaternary_1o6d2_509[data-focused],._whiteQuaternary_1o6d2_509[data-hovered]{background:var(--alto-sem-color-bg-white-subtle-hover)}._whiteQuaternary_1o6d2_509[data-pressed]{background:var(--alto-sem-color-bg-white-subtle-active)}._whiteQuaternary_1o6d2_509[data-pressed][data-focused]{outline:none}._whiteQuaternary_1o6d2_509[data-focused]{outline-color:var(--alto-sem-color-border-white)}._whiteQuaternary_1o6d2_509:disabled,._whiteQuaternary_1o6d2_509[aria-disabled]{background:none;color:#ffffff52;cursor:not-allowed;pointer-events:auto}._fa-spinner-third_1o6d2_541{height:1rem;width:1rem}._icon-wrapper_1o6d2_546{all:unset;align-items:center;display:flex;height:1em;justify-content:center;width:1em}

package/dist/assets/Label.css

@@ -0,0 +1 @@
+._label_1w8ui_1{font-family:var(--alto-sem-text-label-font-family);font-style:normal;font-weight:var(--alto-sem-text-label-font-weight)}._xxs_1w8ui_7{font-size:var(--alto-sem-text-label-2xs-font-size);letter-spacing:var(--alto-sem-text-label-2xs-letter-spacing);line-height:var(--alto-sem-text-label-2xs-line-height)}._xs_1w8ui_13{font-size:var(--alto-sem-text-label-xs-font-size);letter-spacing:var(--alto-sem-text-label-xs-letter-spacing);line-height:var(--alto-sem-text-label-xs-line-height)}._sm_1w8ui_19{font-size:var(--alto-sem-text-label-sm-font-size);letter-spacing:var(--alto-sem-text-label-sm-letter-spacing);line-height:var(--alto-sem-text-label-sm-line-height)}._md_1w8ui_25{font-size:var(--alto-sem-text-label-md-font-size);letter-spacing:var(--alto-sem-text-label-md-letter-spacing);line-height:var(--alto-sem-text-label-md-line-height)}._lg_1w8ui_31{font-size:var(--alto-sem-text-label-lg-font-size);letter-spacing:var(--alto-sem-text-label-lg-letter-spacing);line-height:var(--alto-sem-text-label-lg-line-height)}

package/dist/assets/ListBoxItem.css

@@ -0,0 +1 @@
+._listBoxItem_1d71p_1{align-items:center;border-radius:var(--alto-sem-radius-3xs);color:var(--alto-sem-color-fg-primary);display:flex;font-size:var(--alto-sem-text-body-sm-font-size);gap:var(--alto-sem-space-xs);justify-content:space-between;letter-spacing:var(--alto-sem-text-body-sm-letter-spacing);line-height:var(--alto-sem-text-body-sm-line-height);padding:var(--alto-sem-space-2xs) var(--alto-sem-space-xs);text-align:left;width:100%;width:-webkit-fill-available}._listBoxItemLabel_1d71p_17{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._listBoxItem_1d71p_1[data-loading]{cursor:progress;outline-style:none}._listBoxItem_1d71p_1[data-hovered]:not([data-loading]){background-color:var(--alto-sem-color-overlay-state-darken-invert-hover)}._listBoxItem_1d71p_1[data-disabled]{background:var(--alto-sem-color-bg-disabled-subtle);color:var(--alto-sem-color-fg-disabled-on-subtle);cursor:not-allowed}._listBoxItem_1d71p_1[data-pressed]:not([data-loading]){background-color:var(--alto-sem-color-overlay-state-darken-invert-active)}._listBoxItem_1d71p_1[data-focused]:not([data-loading]){background-color:var(--alto-sem-color-overlay-state-darken-invert-hover);outline-color:var(--alto-sem-color-border-accent);outline-offset:0;outline-style:solid;outline-width:var(--alto-sem-border-width-md)}._listBoxItem_1d71p_1[data-selected]:not([data-loading]){background-color:var(--alto-sem-color-bg-accent-subtle-default)}._listBoxItem_1d71p_1[data-selected][data-hovered]:not([data-loading]){background-color:var(--alto-sem-color-bg-accent-subtle-hover)}._listBoxItem_1d71p_1[data-selected][data-pressed]:not([data-loading]){background-color:var(--alto-sem-color-bg-accent-subtle-active)}._listBoxItem_1d71p_1[data-selected][data-focused]:not([data-loading]){background:var(--alto-sem-color-bg-accent-subtle-hover)}._listBoxItemIcon_1d71p_65,._listBoxItemSelected_1d71p_71{align-items:center;display:inline-flex;justify-content:center}._listBoxItemSelected_1d71p_71{opacity:0}._listBoxItem_1d71p_1[data-selected] ._listBoxItemSelected_1d71p_71{opacity:1}

package/dist/assets/Paragraph.css

@@ -1 +1 @@
-._paragraph_odu3c_1{display:block;font-family:var(--alto-sem-text-body-font-family);font-style:normal;font-weight:var(--alto-sem-text-body-regular-font-weight);margin:0}._xs_odu3c_9{font-size:var(--alto-sem-text-body-xs-font-size);letter-spacing:var(--alto-sem-text-body-xs-letter-spacing);line-height:var(--alto-sem-text-body-xs-line-height)}._sm_odu3c_15{font-size:var(--alto-sem-text-body-sm-font-size);letter-spacing:var(--alto-sem-text-body-sm-letter-spacing);line-height:var(--alto-sem-text-body-sm-line-height)}._md_odu3c_21{font-size:var(--alto-sem-text-body-md-font-size);letter-spacing:var(--alto-sem-text-body-md-letter-spacing);line-height:var(--alto-sem-text-body-md-line-height)}._lg_odu3c_27{font-size:var(--alto-sem-text-body-lg-font-size);letter-spacing:var(--alto-sem-text-body-lg-letter-spacing);line-height:var(--alto-sem-text-body-lg-line-height)}._start_odu3c_33{text-align:start}._center_odu3c_37{text-align:center}._end_odu3c_41{text-align:end}
+._paragraph_rcir1_1{display:block;font-family:var(--alto-sem-text-body-font-family);font-style:normal;font-weight:var(--alto-sem-text-body-regular-font-weight);margin:0}._paragraph_rcir1_1 strong{font-weight:var(--alto-sem-text-body-bold-font-weight)}._xs_rcir1_13{font-size:var(--alto-sem-text-body-xs-font-size);letter-spacing:var(--alto-sem-text-body-xs-letter-spacing);line-height:var(--alto-sem-text-body-xs-line-height)}._sm_rcir1_19{font-size:var(--alto-sem-text-body-sm-font-size);letter-spacing:var(--alto-sem-text-body-sm-letter-spacing);line-height:var(--alto-sem-text-body-sm-line-height)}._md_rcir1_25{font-size:var(--alto-sem-text-body-md-font-size);letter-spacing:var(--alto-sem-text-body-md-letter-spacing);line-height:var(--alto-sem-text-body-md-line-height)}._lg_rcir1_31{font-size:var(--alto-sem-text-body-lg-font-size);letter-spacing:var(--alto-sem-text-body-lg-letter-spacing);line-height:var(--alto-sem-text-body-lg-line-height)}._start_rcir1_37{text-align:start}._center_rcir1_41{text-align:center}._end_rcir1_45{text-align:end}

package/dist/assets/SearchField.css

@@ -0,0 +1 @@
+._searchField_acl05_1{color:var(--alto-sem-color-fg-primary);display:flex;flex-direction:column;position:relative;width:100%}._searchField_acl05_1>[role=group]{align-items:center;align-self:stretch;background:var(--alto-sem-color-bg-layer2-default);border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-primary-default);border-radius:var(--alto-sem-radius-sm);box-sizing:border-box;display:flex;flex-direction:row;justify-content:space-between;overflow:hidden;position:relative}._searchField_acl05_1>[role=group][data-focus-within]:not(:has(>button[data-focused])){outline-color:var(--alto-sem-color-border-accent);outline-offset:var(--alto-sem-border-width-md);outline-style:solid;outline-width:var(--alto-sem-border-width-md)}._searchField_acl05_1>[role=group]:has(input[data-disabled]){background:var(--alto-sem-color-bg-disabled-subtle);border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-disabled-subtle);color:var(--alto-sem-color-fg-disabled-on-subtle)}._searchField_acl05_1>[role=group]:has(input[data-hovered]:not([data-disabled])){border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-primary-hover)}._searchField_acl05_1>[role=group]:has(input[data-pressed]:not([data-disabled])){border:var(--alto-sem-border-width-sm) solid var(--alto-sem-color-border-primary-active)}._searchField_acl05_1>[role=group]:has(input[data-invalid]:not([data-disabled])){border:var(--alto-sem-border-width-md) solid var(--alto-sem-color-border-critical)}._searchField_acl05_1>[role=group]>button{flex-shrink:0;margin:0 var(--alto-sem-space-3xs)}._searchField_acl05_1 input{border:none;font-size:var(--alto-sem-text-body-md-font-size);font-style:normal;font-weight:var(--alto-sem-text-body-regular-font-weight);height:48px;padding:0 var(--alto-sem-space-2xs) 0 var(--alto-sem-space-sm);padding-left:44px;width:100%}._searchField_acl05_1 input::-moz-placeholder{color:var(--alto-sem-color-fg-secondary);font-size:var(--alto-sem-text-body-md-font-size);font-weight:var(--alto-sem-text-body-regular-font-weight)}._searchField_acl05_1 input::placeholder{color:var(--alto-sem-color-fg-secondary);font-size:var(--alto-sem-text-body-md-font-size);font-weight:var(--alto-sem-text-body-regular-font-weight)}._searchField_acl05_1 input[data-focused]{outline:none}._searchField_acl05_1 ._iconStart_acl05_80{cursor:pointer;padding:var(--alto-sem-space-4xs);padding-left:var(--alto-sem-space-xs);padding-right:var(--alto-sem-space-2xs);position:absolute}

package/dist/components/Box/Box.d.ts

@@ -16,9 +16,9 @@ export interface BoxProps extends BackgroundVariants, FlexVariants, BorderVarian
     width?: 'full' | string;
     /**
      * The maximum width of the Box.
-     * Accepts any valid CSS unit.
+     * Accepts any valid CSS unit or "pageWidth" to use the `section-container-max-width` token.
      */
-    maxWidth?: string;
+    maxWidth?: 'pageWidth' | string;
     /**
      * The minimum width of the Box.
      * Accepts any valid CSS unit.

package/dist/components/Box/Box.js

@@ -24,7 +24,7 @@ const Box = ({
   const stylesProp = {
     width: width === "full" ? "100%" : width,
     height: height === "full" ? "100%" : height,
-    maxWidth,
+    maxWidth: maxWidth === "pageWidth" ? "var(--alto-section-container-max-width)" : maxWidth,
     minWidth,
     maxHeight,
     minHeight

package/dist/components/Button/Button.js

@@ -8,35 +8,35 @@ import { useFocusRing } from "@react-aria/focus";
 import { Icon } from "../Icon/Icon.js";
 import LoadingSpinner from "../LoadingSpinner/LoadingSpinner.js";
 import { focusStyleVariants } from "../../utils/focus/focusStyles.js";
-import '../../assets/Button.css';const button$1 = "_button_etsb3_1";
-const content = "_content_etsb3_19";
-const isNotLoading = "_isNotLoading_etsb3_28";
-const loadingSpinner = "_loadingSpinner_etsb3_28";
-const isLoading = "_isLoading_etsb3_37";
-const focusWhite = "_focusWhite_etsb3_49";
-const sm = "_sm_etsb3_56";
-const md = "_md_etsb3_64";
-const lg = "_lg_etsb3_72";
-const fullWidth = "_fullWidth_etsb3_80";
-const textAlignLeft = "_textAlignLeft_etsb3_87";
-const textAlignCenter = "_textAlignCenter_etsb3_91";
-const textAlignRight = "_textAlignRight_etsb3_95";
-const accentPrimary = "_accentPrimary_etsb3_103";
-const accentSecondary = "_accentSecondary_etsb3_123";
-const accentTertiary = "_accentTertiary_etsb3_153";
-const accentQuaternary = "_accentQuaternary_etsb3_179";
-const criticalPrimary = "_criticalPrimary_etsb3_205";
-const criticalSecondary = "_criticalSecondary_etsb3_230";
-const criticalTertiary = "_criticalTertiary_etsb3_260";
-const criticalQuaternary = "_criticalQuaternary_etsb3_286";
-const neutralPrimary = "_neutralPrimary_etsb3_313";
-const neutralSecondary = "_neutralSecondary_etsb3_338";
-const neutralTertiary = "_neutralTertiary_etsb3_367";
-const neutralQuaternary = "_neutralQuaternary_etsb3_393";
-const whitePrimary = "_whitePrimary_etsb3_420";
-const whiteSecondary = "_whiteSecondary_etsb3_446";
-const whiteTertiary = "_whiteTertiary_etsb3_479";
-const whiteQuaternary = "_whiteQuaternary_etsb3_509";
+import '../../assets/Button.css';const button$1 = "_button_1o6d2_1";
+const content = "_content_1o6d2_19";
+const isNotLoading = "_isNotLoading_1o6d2_28";
+const loadingSpinner = "_loadingSpinner_1o6d2_28";
+const isLoading = "_isLoading_1o6d2_37";
+const focusWhite = "_focusWhite_1o6d2_49";
+const sm = "_sm_1o6d2_56";
+const md = "_md_1o6d2_64";
+const lg = "_lg_1o6d2_72";
+const fullWidth = "_fullWidth_1o6d2_80";
+const textAlignLeft = "_textAlignLeft_1o6d2_87";
+const textAlignCenter = "_textAlignCenter_1o6d2_91";
+const textAlignRight = "_textAlignRight_1o6d2_95";
+const accentPrimary = "_accentPrimary_1o6d2_103";
+const accentSecondary = "_accentSecondary_1o6d2_123";
+const accentTertiary = "_accentTertiary_1o6d2_153";
+const accentQuaternary = "_accentQuaternary_1o6d2_179";
+const criticalPrimary = "_criticalPrimary_1o6d2_205";
+const criticalSecondary = "_criticalSecondary_1o6d2_230";
+const criticalTertiary = "_criticalTertiary_1o6d2_260";
+const criticalQuaternary = "_criticalQuaternary_1o6d2_286";
+const neutralPrimary = "_neutralPrimary_1o6d2_313";
+const neutralSecondary = "_neutralSecondary_1o6d2_338";
+const neutralTertiary = "_neutralTertiary_1o6d2_367";
+const neutralQuaternary = "_neutralQuaternary_1o6d2_393";
+const whitePrimary = "_whitePrimary_1o6d2_420";
+const whiteSecondary = "_whiteSecondary_1o6d2_446";
+const whiteTertiary = "_whiteTertiary_1o6d2_479";
+const whiteQuaternary = "_whiteQuaternary_1o6d2_509";
 const styles = {
   button: button$1,
   content,
@@ -67,8 +67,8 @@ const styles = {
   whiteSecondary,
   whiteTertiary,
   whiteQuaternary,
-  "fa-spinner-third": "_fa-spinner-third_etsb3_541",
-  "icon-wrapper": "_icon-wrapper_etsb3_546"
+  "fa-spinner-third": "_fa-spinner-third_1o6d2_541",
+  "icon-wrapper": "_icon-wrapper_1o6d2_546"
 };
 const button = cva(styles.button, {
   variants: {

package/dist/components/CalloutBanner/CalloutBanner.d.ts

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
 import { VariantProps } from 'class-variance-authority';
 declare const calloutBanner: (props?: ({
-    emphasis?: "secondary" | "primary" | "tertiary" | null | undefined;
+    emphasis?: "primary" | "secondary" | "tertiary" | null | undefined;
     styleVariant?: "neutral" | "critical" | "success" | "information" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type CalloutBannerVariants = VariantProps<typeof calloutBanner>;

package/dist/components/Label/Label.d.ts

@@ -0,0 +1,23 @@
+import { default as React } from 'react';
+import { ForegroundVariants } from '../../utils/foregroundColour/foregroundColor';
+type labelSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg';
+export interface LabelProps extends Omit<React.HTMLAttributes<Element>, 'className' | 'style'> {
+    /**
+     * children
+     */
+    children: React.ReactNode;
+    /**
+     * The HTML element to render the label as.
+     */
+    as?: 'span' | 'div' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+    /**
+     * The size of the label
+     */
+    size?: labelSize;
+    /**
+     * The foreground color of the label
+     */
+    foregroundColor?: ForegroundVariants['foregroundColor'];
+}
+export declare const Label: ({ children, as: Component, size, foregroundColor, ...props }: LabelProps) => import("react/jsx-runtime").JSX.Element;
+export default Label;

package/dist/components/Label/Label.js

@@ -0,0 +1,50 @@
+import { jsx } from "react/jsx-runtime";
+import { c as cva } from "../../index-Bi3v_EjJ.js";
+import { foregroundColorVariants } from "../../utils/foregroundColour/foregroundColor.js";
+import '../../assets/Label.css';const label$1 = "_label_1w8ui_1";
+const xxs = "_xxs_1w8ui_7";
+const xs = "_xs_1w8ui_13";
+const sm = "_sm_1w8ui_19";
+const md = "_md_1w8ui_25";
+const lg = "_lg_1w8ui_31";
+const styles = {
+  label: label$1,
+  xxs,
+  xs,
+  sm,
+  md,
+  lg
+};
+const label = cva(styles.label, {
+  variants: {
+    size: {
+      "2xs": styles.xxs,
+      xs: styles.xs,
+      sm: styles.sm,
+      md: styles.md,
+      lg: styles.lg
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+const Label = ({
+  children,
+  as: Component = "span",
+  size = "md",
+  foregroundColor,
+  ...props
+}) => {
+  const classNames = `${label({
+    size
+  })} ${foregroundColorVariants({
+    foregroundColor
+  })}`;
+  return /* @__PURE__ */ jsx(Component, { className: classNames, ...props, children });
+};
+export {
+  Label,
+  Label as default
+};
+//# sourceMappingURL=Label.js.map

package/dist/components/Label/Label.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Label.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Label/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Label';

package/dist/components/Label/index.js

@@ -0,0 +1,5 @@
+import { Label } from "./Label.js";
+export {
+  Label as default
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Label/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/ListBoxItem/ListBoxItem.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+import { ListBoxItemProps as AriaListBoxItemProps } from 'react-aria-components';
+export interface ListBoxItemProps extends AriaListBoxItemProps {
+    children?: React.ReactNode;
+    /**
+     *  Enables loading state
+     */
+    isLoading?: boolean;
+    /**
+     *  Enables disabled state
+     */
+    labelLoading?: string;
+}
+export declare const ListBoxItem: ({ children, isLoading, labelLoading, ...props }: ListBoxItemProps) => import("react/jsx-runtime").JSX.Element;
+export default ListBoxItem;

package/dist/components/ListBoxItem/ListBoxItem.js

@@ -0,0 +1,32 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { ListBoxItem as ListBoxItem$1, Text } from "react-aria-components";
+import { Icon } from "../Icon/Icon.js";
+import LoadingSpinner from "../LoadingSpinner/LoadingSpinner.js";
+import '../../assets/ListBoxItem.css';const listBoxItem = "_listBoxItem_1d71p_1";
+const listBoxItemLabel = "_listBoxItemLabel_1d71p_17";
+const listBoxItemIcon = "_listBoxItemIcon_1d71p_65";
+const listBoxItemSelected = "_listBoxItemSelected_1d71p_71";
+const styles = {
+  listBoxItem,
+  listBoxItemLabel,
+  listBoxItemIcon,
+  listBoxItemSelected
+};
+const ListBoxItem = ({
+  children,
+  isLoading,
+  labelLoading = "Loading",
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxs(ListBoxItem$1, { className: styles["listBoxItem"], ...isLoading && {
+    "data-loading": true
+  }, ...props, children: [
+    /* @__PURE__ */ jsx(Text, { slot: "label", className: styles["listBoxItemLabel"], children: isLoading ? labelLoading : children }),
+    isLoading ? /* @__PURE__ */ jsx(LoadingSpinner, { size: "1x", className: styles["listBoxItemIcon"] }) : /* @__PURE__ */ jsx("span", { className: styles["listBoxItemSelected"], children: /* @__PURE__ */ jsx(Icon, { iconName: "check", scale: "1x", padding: "square" }) })
+  ] });
+};
+export {
+  ListBoxItem,
+  ListBoxItem as default
+};
+//# sourceMappingURL=ListBoxItem.js.map

package/dist/components/ListBoxItem/ListBoxItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListBoxItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/ListBoxItem/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ListBoxItem';

package/dist/components/ListBoxItem/index.js

@@ -0,0 +1,5 @@
+import { ListBoxItem } from "./ListBoxItem.js";
+export {
+  ListBoxItem as default
+};
+//# sourceMappingURL=index.js.map

package/dist/components/ListBoxItem/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/NumberField/NumberField.d.ts

@@ -21,5 +21,5 @@ export interface NumberFieldProps extends FieldProps<AriaNumberFieldProps> {
      */
     maxValue?: number;
 }
-export declare const NumberField: ({ labelIncrement, labelDecrement, minValue, maxValue, isInvalid, isDisabled, ...props }: NumberFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const NumberField: import('react').ForwardRefExoticComponent<NumberFieldProps & import('react').RefAttributes<HTMLInputElement>>;
 export default NumberField;

package/dist/components/NumberField/NumberField.js

@@ -3,6 +3,7 @@ import { NumberField as NumberField$1, Group, Button, Input } from "react-aria-c
 import { Icon } from "../Icon/Icon.js";
 import { Tooltip } from "../Tooltip/Tooltip.js";
 import { Field } from "../_base/Field/Field.js";
+import { forwardRef } from "react";
 import '../../assets/NumberField.css';const numberField = "_numberField_1knmk_1";
 const numberFieldGroup = "_numberFieldGroup_1knmk_6";
 const numberFieldInput = "_numberFieldInput_1knmk_59";
@@ -13,7 +14,7 @@ const styles = {
   numberFieldInput,
   numberFieldButton
 };
-const NumberField = ({
+const NumberField = forwardRef(({
   labelIncrement = "Increase",
   labelDecrement = "Decrease",
   minValue,
@@ -21,13 +22,14 @@ const NumberField = ({
   isInvalid = false,
   isDisabled = false,
   ...props
-}) => {
+}, ref) => {
   return /* @__PURE__ */ jsx(Field, { as: NumberField$1, className: styles.numberField, minValue, maxValue, isInvalid, isDisabled, ...props, children: /* @__PURE__ */ jsxs(Group, { className: styles.numberFieldGroup, children: [
     /* @__PURE__ */ jsx(Tooltip, { placement: "bottom", label: labelDecrement, children: /* @__PURE__ */ jsx(Button, { className: styles.numberFieldButton, slot: "decrement", children: /* @__PURE__ */ jsx(Icon, { iconName: "minus" }) }) }),
-    /* @__PURE__ */ jsx(Input, { className: styles.numberFieldInput }),
+    /* @__PURE__ */ jsx(Input, { className: styles.numberFieldInput, ref }),
     /* @__PURE__ */ jsx(Tooltip, { placement: "bottom", label: labelIncrement, children: /* @__PURE__ */ jsx(Button, { className: styles.numberFieldButton, slot: "increment", children: /* @__PURE__ */ jsx(Icon, { iconName: "plus" }) }) })
   ] }) });
-};
+});
+NumberField.displayName = "NumberField";
 export {
   NumberField,
   NumberField as default

package/dist/components/NumberField/NumberField.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"NumberField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Paragraph/Paragraph.js

@@ -1,14 +1,14 @@
 import { jsx } from "react/jsx-runtime";
 import { c as cva } from "../../index-Bi3v_EjJ.js";
 import { foregroundColorVariants } from "../../utils/foregroundColour/foregroundColor.js";
-import '../../assets/Paragraph.css';const paragraph$1 = "_paragraph_odu3c_1";
-const xs = "_xs_odu3c_9";
-const sm = "_sm_odu3c_15";
-const md = "_md_odu3c_21";
-const lg = "_lg_odu3c_27";
-const start = "_start_odu3c_33";
-const center = "_center_odu3c_37";
-const end = "_end_odu3c_41";
+import '../../assets/Paragraph.css';const paragraph$1 = "_paragraph_rcir1_1";
+const xs = "_xs_rcir1_13";
+const sm = "_sm_rcir1_19";
+const md = "_md_rcir1_25";
+const lg = "_lg_rcir1_31";
+const start = "_start_rcir1_37";
+const center = "_center_rcir1_41";
+const end = "_end_rcir1_45";
 const styles = {
   paragraph: paragraph$1,
   xs,

package/dist/components/PasswordField/PasswordField.d.ts

@@ -1,3 +1,4 @@
+import { default as React } from 'react';
 import { FieldProps } from '../_base/Field';
 import { TextFieldProps as AriaTextFieldProps } from 'react-aria-components';
 type PasswordStrengthValidation = {
@@ -26,5 +27,5 @@ export interface PasswordFieldProps extends FieldProps<AriaTextFieldProps> {
      */
     requirementsLabel?: string;
 }
-export declare const PasswordField: ({ tooltipLabelShowPassword, tooltipLabelHidePassword, requirementsLabel, ...props }: PasswordFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PasswordField: React.ForwardRefExoticComponent<PasswordFieldProps & React.RefAttributes<HTMLInputElement>>;
 export default PasswordField;

package/dist/components/PasswordField/PasswordField.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import React, { useState } from "react";
+import React, { forwardRef, useState } from "react";
 import { Field } from "../_base/Field/Field.js";
 import { TextField, Group, Input } from "react-aria-components";
 import { IconButton } from "../IconButton/IconButton.js";
@@ -19,12 +19,12 @@ const styles = {
   passwordStrengthItemNeutral,
   passwordStrengthItemInvalid
 };
-const PasswordField = ({
+const PasswordField = forwardRef(({
   tooltipLabelShowPassword = "Show Password",
   tooltipLabelHidePassword = "Hide Password",
   requirementsLabel = "Password requirements",
   ...props
-}) => {
+}, ref) => {
   var _a;
   const [internalVisible, setInternalVisible] = useState(props.isVisible || false);
   const [internalValue, setInternalValue] = useState(props == null ? void 0 : props.defaultValue);
@@ -38,7 +38,7 @@ const PasswordField = ({
   const tooltipLabel = isVisibleState ? tooltipLabelHidePassword : tooltipLabelShowPassword;
   return /* @__PURE__ */ jsx("div", { className: styles["passwordField"], children: /* @__PURE__ */ jsxs(Field, { as: TextField, className: styles.passwordField, label: "Password", ...props, children: [
     /* @__PURE__ */ jsxs(Group, { children: [
-      /* @__PURE__ */ jsx(Input, { type: isVisibleState ? "text" : "password", value, onChange: handleChange }),
+      /* @__PURE__ */ jsx(Input, { type: isVisibleState ? "text" : "password", value, onChange: handleChange, ref }),
       /* @__PURE__ */ jsx(IconButton, { size: "sm", iconProps: isVisibleState ? {
         iconName: "eye",
         iconPrefix: "fas"
@@ -49,7 +49,7 @@ const PasswordField = ({
     ] }),
     /* @__PURE__ */ jsx("ul", { className: styles["passwordField__strength"], "aria-label": requirementsLabel, "aria-live": "polite", children: (_a = props.strengthValidations) == null ? void 0 : _a.map((validation) => /* @__PURE__ */ jsx(PasswordStrengthItem, { status: value ? validation.validation(value) ? "valid" : "invalid" : "neutral", message: validation.message }, `${validation.message}-${value}`)) })
   ] }) });
-};
+});
 const passwordStrengthItem = cva(styles.passwordStrengthItem, {
   variants: {
     status: {
@@ -97,6 +97,7 @@ const PasswordStrengthItem = ({
     /* @__PURE__ */ jsx("span", { children: message })
   ] });
 };
+PasswordField.displayName = "PasswordField";
 export {
   PasswordField,
   PasswordField as default

package/dist/components/PasswordField/PasswordField.js.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"PasswordField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/SearchField/SearchField.d.ts

@@ -0,0 +1,14 @@
+import { FieldProps } from '../_base/Field';
+import { TextFieldProps as AriaTextFieldProps } from 'react-aria-components';
+export interface SearchFieldProps extends FieldProps<AriaTextFieldProps> {
+    /**
+     * Label for clear button
+     */
+    clearLabel?: string;
+    /**
+     * Placeholder for the search field
+     */
+    placeholder?: string;
+}
+export declare const SearchField: ({ clearLabel, placeholder, ...props }: SearchFieldProps) => import("react/jsx-runtime").JSX.Element;
+export default SearchField;

package/dist/components/SearchField/SearchField.js

@@ -0,0 +1,48 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import React, { useRef, useState } from "react";
+import { Field } from "../_base/Field/Field.js";
+import { TextField, Group, Input } from "react-aria-components";
+import { IconButton } from "../IconButton/IconButton.js";
+import { Icon } from "../Icon/Icon.js";
+import '../../assets/SearchField.css';const searchField = "_searchField_acl05_1";
+const iconStart = "_iconStart_acl05_80";
+const styles = {
+  searchField,
+  iconStart
+};
+const SearchField = ({
+  clearLabel = "Delete search",
+  placeholder,
+  ...props
+}) => {
+  const inputRef = useRef(null);
+  const [internalValue, setInternalValue] = useState(props == null ? void 0 : props.defaultValue);
+  const value = (props == null ? void 0 : props.value) ?? internalValue;
+  const setValue = React.useCallback((nextValue) => {
+    var _a;
+    setInternalValue(nextValue);
+    (_a = props == null ? void 0 : props.onChange) == null ? void 0 : _a.call(props, nextValue);
+  }, [props == null ? void 0 : props.onChange]);
+  const handleClear = React.useCallback(() => {
+    var _a;
+    setValue("");
+    (_a = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _a.focus();
+  }, [setValue]);
+  const tooltipLabel = clearLabel;
+  return /* @__PURE__ */ jsx("div", { className: styles["searchField"], children: /* @__PURE__ */ jsx(Field, { as: TextField, className: styles.searchField, ...props, children: /* @__PURE__ */ jsxs(Group, { onClick: () => {
+    var _a;
+    return (_a = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _a.focus();
+  }, children: [
+    /* @__PURE__ */ jsx(Icon, { iconSize: "1x", padding: "roomy", iconName: "search", className: styles.iconStart }),
+    /* @__PURE__ */ jsx(Input, { type: "text", value, onChange: (e) => setValue(e.target.value), ref: inputRef, placeholder }),
+    !!value && /* @__PURE__ */ jsx(IconButton, { size: "sm", iconProps: {
+      iconName: "xmark",
+      iconPrefix: "fas"
+    }, onClick: (props == null ? void 0 : props.isDisabled) ? void 0 : handleClear, isDisabled: props == null ? void 0 : props.isDisabled, styleVariant: "neutral", emphasis: "tertiary", "aria-label": tooltipLabel, tooltipLabel })
+  ] }) }) });
+};
+export {
+  SearchField,
+  SearchField as default
+};
+//# sourceMappingURL=SearchField.js.map

package/dist/components/SearchField/SearchField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/SearchField/index.d.ts

@@ -0,0 +1 @@
+export { default } from './SearchField';

package/dist/components/SearchField/index.js

@@ -0,0 +1,5 @@
+import { SearchField } from "./SearchField.js";
+export {
+  SearchField as default
+};
+//# sourceMappingURL=index.js.map

package/dist/components/SearchField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/TextAreaField/TextAreaField.d.ts

@@ -1,3 +1,3 @@
 import { TextFieldProps } from '../TextField/TextField';
-export declare const TextAreaField: (props: TextFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TextAreaField: import('react').ForwardRefExoticComponent<TextFieldProps & import('react').RefAttributes<HTMLTextAreaElement>>;
 export default TextAreaField;

package/dist/components/TextAreaField/TextAreaField.js

@@ -1,15 +1,17 @@
 import { jsx } from "react/jsx-runtime";
 import { TextField, TextArea } from "react-aria-components";
 import { Field } from "../_base/Field/Field.js";
+import { forwardRef } from "react";
 import '../../assets/TextAreaField.css';const textAreaField = "_textAreaField_1hjyj_1";
 const validationError = "_validationError_1hjyj_71";
 const styles = {
   textAreaField,
   validationError
 };
-const TextAreaField = (props) => {
-  return /* @__PURE__ */ jsx(Field, { as: TextField, className: styles.textAreaField, ...props, children: /* @__PURE__ */ jsx(TextArea, {}) });
-};
+const TextAreaField = forwardRef((props, ref) => {
+  return /* @__PURE__ */ jsx(Field, { as: TextField, className: styles.textAreaField, ...props, children: /* @__PURE__ */ jsx(TextArea, { ref }) });
+});
+TextAreaField.displayName = "TextAreaField";
 export {
   TextAreaField,
   TextAreaField as default

package/dist/components/TextAreaField/TextAreaField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextAreaField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
+{"version":3,"file":"TextAreaField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/components/TextField/TextField.d.ts

@@ -11,5 +11,5 @@ export interface TextFieldProps extends FieldProps<AriaTextFieldProps> {
      */
     iconEndProps?: IconProps;
 }
-export declare const TextField: ({ iconStartProps, iconEndProps, ...props }: TextFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TextField: import('react').ForwardRefExoticComponent<TextFieldProps & import('react').RefAttributes<HTMLInputElement>>;
 export default TextField;

package/dist/components/TextField/TextField.js

@@ -2,6 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { TextField as TextField$1, Input } from "react-aria-components";
 import { Icon } from "../Icon/Icon.js";
 import { Field } from "../_base/Field/Field.js";
+import { forwardRef } from "react";
 import '../../assets/TextField.css';const textField = "_textField_1kom2_1";
 const inputWrapper = "_inputWrapper_1kom2_45";
 const iconStart = "_iconStart_1kom2_51";
@@ -12,17 +13,18 @@ const styles = {
   iconStart,
   iconEnd
 };
-const TextField = ({
+const TextField = forwardRef(({
   iconStartProps,
   iconEndProps,
   ...props
-}) => {
+}, ref) => {
   return /* @__PURE__ */ jsx(Field, { as: TextField$1, className: styles.textField, ...props, children: /* @__PURE__ */ jsxs("div", { className: styles.inputWrapper, children: [
     iconStartProps && /* @__PURE__ */ jsx(Icon, { ...iconStartProps, className: styles.iconStart }),
-    /* @__PURE__ */ jsx(Input, {}),
+    /* @__PURE__ */ jsx(Input, { ref }),
     iconEndProps && /* @__PURE__ */ jsx(Icon, { ...iconEndProps, className: styles.iconEnd })
   ] }) });
-};
+});
+TextField.displayName = "TextField";
 export {
   TextField,
   TextField as default

package/dist/components/TextField/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"TextField.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/index.d.ts

@@ -30,7 +30,9 @@ export { default as Icon } from './Icon';
 export { default as IconBackdrop } from './IconBackdrop';
 export { default as IconButton } from './IconButton';
 export { default as Image } from './Image';
+export { default as Label } from './Label';
 export { default as Link } from './Link';
+export { default as ListBoxItem } from './ListBoxItem';
 export { default as LoadingSpinner } from './LoadingSpinner';
 export { default as Menu } from './Menu';
 export { default as NumberField } from './NumberField';
@@ -40,6 +42,7 @@ export { default as Popover } from './Popover';
 export { default as PasswordField } from './PasswordField';
 export { default as Radio } from './Radio';
 export { default as RadioGroup } from './RadioGroup';
+export { default as SearchField } from './SearchField';
 export { default as Section } from './Section';
 export { default as Select } from './SelectNative';
 export { default as SelectCard } from './SelectCard';

package/dist/components/index.js

@@ -31,7 +31,9 @@ import { Icon } from "./Icon/Icon.js";
 import { IconBackdrop } from "./IconBackdrop/IconBackdrop.js";
 import { IconButton } from "./IconButton/IconButton.js";
 import { Image } from "./Image/Image.js";
+import { Label } from "./Label/Label.js";
 import { default as default6 } from "./Link/Link.js";
+import { ListBoxItem } from "./ListBoxItem/ListBoxItem.js";
 import { default as default7 } from "./LoadingSpinner/LoadingSpinner.js";
 import { Menu } from "./Menu/Menu.js";
 import { NumberField } from "./NumberField/NumberField.js";
@@ -41,6 +43,7 @@ import { Popover } from "./Popover/Popover.js";
 import { PasswordField } from "./PasswordField/PasswordField.js";
 import { Radio } from "./Radio/Radio.js";
 import { RadioGroup } from "./RadioGroup/RadioGroup.js";
+import { SearchField } from "./SearchField/SearchField.js";
 import { default as default8 } from "./Section/Section.js";
 import { SelectNative, SelectNative as SelectNative2 } from "./SelectNative/SelectNative.js";
 import { default as default9 } from "./SelectCard/SelectCard.js";
@@ -86,7 +89,9 @@ export {
   IconBackdrop,
   IconButton,
   Image,
+  Label,
   default6 as Link,
+  ListBoxItem,
   default7 as LoadingSpinner,
   Menu,
   NumberField,
@@ -96,6 +101,7 @@ export {
   Popover,
   Radio,
   RadioGroup,
+  SearchField,
   default8 as Section,
   SelectNative as Select,
   default9 as SelectCard,

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.js

@@ -31,7 +31,9 @@ import { Icon } from "./components/Icon/Icon.js";
 import { IconBackdrop } from "./components/IconBackdrop/IconBackdrop.js";
 import { IconButton } from "./components/IconButton/IconButton.js";
 import { Image } from "./components/Image/Image.js";
+import { Label } from "./components/Label/Label.js";
 import { default as default6 } from "./components/Link/Link.js";
+import { ListBoxItem } from "./components/ListBoxItem/ListBoxItem.js";
 import { default as default7 } from "./components/LoadingSpinner/LoadingSpinner.js";
 import { Menu } from "./components/Menu/Menu.js";
 import { NumberField } from "./components/NumberField/NumberField.js";
@@ -41,6 +43,7 @@ import { Popover } from "./components/Popover/Popover.js";
 import { PasswordField } from "./components/PasswordField/PasswordField.js";
 import { Radio } from "./components/Radio/Radio.js";
 import { RadioGroup } from "./components/RadioGroup/RadioGroup.js";
+import { SearchField } from "./components/SearchField/SearchField.js";
 import { default as default8 } from "./components/Section/Section.js";
 import { SelectNative, SelectNative as SelectNative2 } from "./components/SelectNative/SelectNative.js";
 import { default as default9 } from "./components/SelectCard/SelectCard.js";
@@ -86,7 +89,9 @@ export {
   IconBackdrop,
   IconButton,
   Image,
+  Label,
   default6 as Link,
+  ListBoxItem,
   default7 as LoadingSpinner,
   Menu,
   NumberField,
@@ -96,6 +101,7 @@ export {
   Popover,
   Radio,
   RadioGroup,
+  SearchField,
   default8 as Section,
   SelectNative as Select,
   default9 as SelectCard,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/utils/foregroundColour/foregroundColor.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 import { InputType } from 'storybook/internal/types';
 export declare const foregroundColorVariants: (props?: ({
-    foregroundColor?: "default" | "secondary" | "accentPrimary" | "accentSecondary" | "accentOnVibrant" | "accentOnVibrantAccent" | "accentOnSubtle" | "accentOnDeep" | "criticalPrimary" | "criticalOnVibrant" | "criticalOnSubtle" | "warningPrimary" | "warningOnVibrant" | "warningOnSubtle" | "cautionPrimary" | "cautionOnVibrant" | "cautionOnSubtle" | "successPrimary" | "successOnVibrant" | "successOnSubtle" | "informationPrimary" | "informationOnVibrant" | "informationOnSubtle" | "inversePrimary" | "inverseOnVibrant" | "inverseOnSubtle" | "whitePrimary" | "whiteOnVibrant" | "whiteOnSubtle" | "disabledPrimary" | "disabledOnVibrant" | "disabledOnSubtle" | "salePrimary" | "saleOnVibrant" | null | undefined;
+    foregroundColor?: "default" | "primary" | "secondary" | "accentPrimary" | "accentSecondary" | "accentOnVibrant" | "accentOnVibrantAccent" | "accentOnSubtle" | "accentOnDeep" | "criticalPrimary" | "criticalOnVibrant" | "criticalOnSubtle" | "warningPrimary" | "warningOnVibrant" | "warningOnSubtle" | "cautionPrimary" | "cautionOnVibrant" | "cautionOnSubtle" | "successPrimary" | "successOnVibrant" | "successOnSubtle" | "informationPrimary" | "informationOnVibrant" | "informationOnSubtle" | "inversePrimary" | "inverseOnVibrant" | "inverseOnSubtle" | "whitePrimary" | "whiteOnVibrant" | "whiteOnSubtle" | "disabledPrimary" | "disabledOnVibrant" | "disabledOnSubtle" | "salePrimary" | "saleOnVibrant" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type ForegroundVariants = VariantProps<typeof foregroundColorVariants>;
 export declare const foregroundColorOptions: ForegroundVariants['foregroundColor'][];

package/dist/utils/foregroundColour/foregroundColor.js

@@ -39,6 +39,7 @@ const foregroundColorVariants = cva("", {
   variants: {
     foregroundColor: {
       default: styles["foregroundColor-primary"],
+      primary: styles["foregroundColor-primary"],
       secondary: styles["foregroundColor-secondary"],
       accentPrimary: styles["foregroundColor-accent-primary"],
       accentSecondary: styles["foregroundColor-accent-secondary"],
@@ -76,6 +77,8 @@ const foregroundColorVariants = cva("", {
   }
 });
 const foregroundColorOptions = [
+  "default",
+  "primary",
   "secondary",
   "accentPrimary",
   "accentSecondary",

package/dist/utils/foregroundColour/foregroundColor.js.map

@@ -1 +1 @@
-{"version":3,"file":"foregroundColor.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"foregroundColor.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/utils/stories/iconPropsArgTypes.js

@@ -7,7 +7,7 @@ const iconPropsArgTypes = {
 iconName: string;
 iconPrefix?: 'fas' | 'far' | 'fal' | 'fab' | 'fad' | 'fak';
 iconSize?: | '0.5x' | '0.75x' | '1x' | '1.25x' | '1.5x' | '2x' | '2.5x' | '3x' | '4x' | '5x' | '6x' | '7x' | '8x' | '9x' | '10x';
-padding?: 'none' | 'square' | 'circle';
+padding?: 'none' | 'fixedWidth' | 'square' | 'roomy';
 flip?: 'horizontal' | 'vertical' | 'both';
 fixedWidth?: boolean;
 listItem?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alto-avios/alto-ui",
-  "version": "3.2.1",
+  "version": "3.3.0",
   "description": "A react component library for Alto Design System",
   "author": {
     "name": "Ian Caldwell IAGL",
@@ -48,7 +48,6 @@
     "@commitlint/config-conventional": "^19.6.0",
     "@commitlint/cz-commitlint": "^19.5.0",
     "@eslint/js": "^9.14.0",
-    "@omlet/cli": "^1.6.1",
     "@storybook/addon-a11y": "^8.4.4",
     "@storybook/addon-actions": "^8.4.4",
     "@storybook/addon-essentials": "^8.4.4",
@@ -107,7 +106,7 @@
     "wait-on": "^8.0.1"
   },
   "peerDependencies": {
-    "@alto-avios/alto-tokens": "^3.0.1",
+    "@alto-avios/alto-tokens": "^3.0.2",
     "react": "^18.0.0"
   },
   "main": "dist/index.js",