@aurodesignsystem-dev/auro-formkit 0.0.0-pr649.6 → 0.0.0-pr652.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
- package/components/bibtemplate/dist/index.js +2 -2
- package/components/bibtemplate/dist/registered.js +2 -2
- package/components/checkbox/demo/api.min.js +13 -2
- package/components/checkbox/demo/index.min.js +13 -2
- package/components/checkbox/dist/auro-checkbox-group.d.ts +1 -1
- package/components/checkbox/dist/auro-checkbox.d.ts +5 -1
- package/components/checkbox/dist/index.js +13 -2
- package/components/checkbox/dist/registered.js +13 -2
- package/components/combobox/demo/api.md +30 -27
- package/components/combobox/demo/api.min.js +1927 -517
- package/components/combobox/demo/index.html +1 -0
- package/components/combobox/demo/index.md +75 -0
- package/components/combobox/demo/index.min.js +1925 -515
- package/components/combobox/dist/auro-combobox.d.ts +29 -14
- package/components/combobox/dist/index.js +1630 -408
- package/components/combobox/dist/registered.js +1630 -408
- package/components/counter/demo/api.min.js +433 -104
- package/components/counter/demo/index.min.js +433 -104
- package/components/counter/dist/iconVersion.d.ts +1 -1
- package/components/counter/dist/index.js +433 -104
- package/components/counter/dist/registered.js +433 -104
- package/components/datepicker/demo/api.min.js +1157 -376
- package/components/datepicker/demo/index.min.js +1157 -376
- package/components/datepicker/dist/index.js +1156 -375
- package/components/datepicker/dist/registered.js +1156 -375
- package/components/dropdown/demo/api.md +59 -35
- package/components/dropdown/demo/api.min.js +361 -88
- package/components/dropdown/demo/index.md +52 -0
- package/components/dropdown/demo/index.min.js +361 -88
- package/components/dropdown/dist/auro-dropdown.d.ts +70 -21
- package/components/dropdown/dist/index.js +331 -58
- package/components/dropdown/dist/registered.js +331 -58
- package/components/input/README.md +1 -1
- package/components/input/demo/api.md +76 -64
- package/components/input/demo/api.min.js +747 -295
- package/components/input/demo/index.html +1 -1
- package/components/input/demo/index.md +49 -4
- package/components/input/demo/index.min.js +747 -295
- package/components/input/demo/readme.md +1 -1
- package/components/input/dist/auro-input.d.ts +97 -3
- package/components/input/dist/base-input.d.ts +36 -18
- package/components/input/dist/index.js +681 -229
- package/components/input/dist/registered.js +681 -229
- package/components/input/dist/styles/classic/style-css.d.ts +2 -0
- package/components/input/dist/styles/default/borders-css.d.ts +2 -0
- package/components/input/dist/styles/default/color-css.d.ts +2 -0
- package/components/input/dist/styles/default/input-css.d.ts +2 -0
- package/components/input/dist/styles/default/label-css.d.ts +2 -0
- package/components/input/dist/styles/default/mixins-css.d.ts +2 -0
- package/components/input/dist/styles/default/notificationIcons-css.d.ts +2 -0
- package/components/input/dist/styles/default/style-css.d.ts +2 -0
- package/components/input/dist/styles/emphasized/color-css.d.ts +2 -0
- package/components/input/dist/styles/emphasized/style-css.d.ts +2 -0
- package/components/input/dist/styles/shapeSize-css.d.ts +2 -0
- package/components/input/dist/styles/snowflake/style-css.d.ts +2 -0
- package/components/layoutElement/dist/auroElement.d.ts +34 -0
- package/components/layoutElement/dist/index.d.ts +1 -0
- package/components/layoutElement/dist/index.js +1 -0
- package/components/layoutElement/dist/registered.js +1 -0
- package/components/menu/demo/api.md +24 -22
- package/components/menu/demo/api.min.js +338 -58
- package/components/menu/demo/index.min.js +338 -58
- package/components/menu/dist/auro-menu-utils.d.ts +8 -0
- package/components/menu/dist/auro-menu.d.ts +32 -7
- package/components/menu/dist/auro-menuoption.d.ts +27 -3
- package/components/menu/dist/iconVersion.d.ts +1 -1
- package/components/menu/dist/index.d.ts +1 -1
- package/components/menu/dist/index.js +298 -59
- package/components/menu/dist/registered.js +338 -58
- package/components/menu/dist/styles/default/color-menu-css.d.ts +2 -0
- package/components/menu/dist/styles/default/color-menuoption-css.d.ts +2 -0
- package/components/menu/dist/styles/default/style-menu-css.d.ts +2 -0
- package/components/menu/dist/styles/default/style-menuoption-css.d.ts +2 -0
- package/components/menu/dist/styles/default/tokens-css.d.ts +2 -0
- package/components/menu/dist/styles/emphasized/color-menuoption-css.d.ts +2 -0
- package/components/menu/dist/styles/emphasized/style-menu-css.d.ts +2 -0
- package/components/menu/dist/styles/emphasized/style-menuoption-css.d.ts +2 -0
- package/components/select/demo/api.md +32 -32
- package/components/select/demo/api.min.js +756 -182
- package/components/select/demo/index.min.js +754 -180
- package/components/select/dist/auro-select.d.ts +13 -12
- package/components/select/dist/index.js +411 -117
- package/components/select/dist/registered.js +411 -117
- package/package.json +2 -2
- /package/components/{dropdown/dist/styles/bibColors-css.d.ts → combobox/dist/styles/emphasized/style-css.d.ts} +0 -0
- /package/components/{dropdown/dist/styles/bibStyles-css.d.ts → combobox/dist/styles/snowflake/style-css.d.ts} +0 -0
- /package/components/{input/dist/styles/borders-css.d.ts → dropdown/dist/styles/default/bibColors-css.d.ts} +0 -0
- /package/components/{input/dist/styles/label-css.d.ts → dropdown/dist/styles/default/bibStyles-css.d.ts} +0 -0
- /package/components/{input/dist/styles/notificationIcons-css.d.ts → dropdown/dist/styles/default/color-css.d.ts} +0 -0
- /package/components/{menu/dist/styles/color-menu-css.d.ts → dropdown/dist/styles/default/style-css.d.ts} +0 -0
- /package/components/{menu/dist/styles/color-menuoption-css.d.ts → dropdown/dist/styles/emphasized/style-css.d.ts} +0 -0
- /package/components/{menu/dist/styles/style-menu-css.d.ts → dropdown/dist/styles/shapeSize-css.d.ts} +0 -0
- /package/components/{menu/dist/styles/style-menuoption-css.d.ts → dropdown/dist/styles/snowflake/style-css.d.ts} +0 -0
- /package/components/{menu/dist/styles/tokens-css.d.ts → input/dist/styles/classic/color-css.d.ts} +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: "8.0.
|
|
1
|
+
declare const _default: "8.0.3";
|
|
2
2
|
export default _default;
|
|
@@ -271,7 +271,7 @@ class BaseIcon extends AuroElement {
|
|
|
271
271
|
|
|
272
272
|
var tokensCss = css`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
|
|
273
273
|
|
|
274
|
-
var colorCss = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=tierOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-emerald, #139142)}:host(:not([onDark])[variant=tierOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=tierOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
|
|
274
|
+
var colorCss = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=tierOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-emerald, #139142)}:host(:not([onDark])[variant=tierOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=tierOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][variant=statusError]){--ds-auro-icon-color:var(--ds-advanced-color-state-error-inverse, #f9a4a8)}`;
|
|
275
275
|
|
|
276
276
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
277
277
|
// See LICENSE in the project root for license information.
|
|
@@ -440,7 +440,7 @@ class AuroIcon extends BaseIcon {
|
|
|
440
440
|
}
|
|
441
441
|
}
|
|
442
442
|
|
|
443
|
-
var iconVersion = '8.0.
|
|
443
|
+
var iconVersion = '8.0.3';
|
|
444
444
|
|
|
445
445
|
var styleCss = css`.heading{margin:1.75rem 0;letter-spacing:var(--ds-text-heading-default-spacing, -0.2px);font-weight:var(--ds-text-heading-default-weight, 500)}.heading--display{margin-top:0;font-size:var(--ds-text-heading-display-size-breakpoint-sm, 2.75rem);font-weight:var(--ds-text-heading-display-weight, 100);line-height:var(--ds-text-heading-display-height-breakpoint-sm, 3.375rem)}@media screen and (min-width: 768px){.heading--display{font-size:var(--ds-text-heading-display-size-breakpoint-md, 3rem);line-height:var(--ds-text-heading-display-height-breakpoint-md, 3.75rem)}}@media screen and (min-width: 1024px){.heading--display{font-size:var(--ds-text-heading-display-size-breakpoint-lg, 3.5rem);line-height:var(--ds-text-heading-display-height-breakpoint-lg, 4.25rem)}}.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-sm, 2rem);font-weight:var(--ds-text-heading-800-weight, 500);line-height:var(--ds-text-heading-800-height-breakpoint-sm, 2.375rem)}@media screen and (min-width: 768px){.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-md, 2.25rem);line-height:var(--ds-text-heading-800-height-breakpoint-md, 2.625rem)}}@media screen and (min-width: 1024px){.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-lg, 2.5rem);line-height:var(--ds-text-heading-800-height-breakpoint-lg, 3rem)}}.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-sm, 1.75rem);font-weight:var(--ds-text-heading-700-weight, 500);line-height:var(--ds-text-heading-700-height-breakpoint-sm, 2.125rem)}@media screen and (min-width: 768px){.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-md, 2rem);line-height:var(--ds-text-heading-700-height-breakpoint-md, 2.375rem)}}@media screen and (min-width: 1024px){.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-lg, 2.25rem);line-height:var(--ds-text-heading-700-height-breakpoint-lg, 2.75rem)}}.heading--600{margin:1rem 0;font-size:var(--ds-text-heading-600-size-breakpoint-sm, 1.625rem);font-weight:var(--ds-text-heading-600-weight, 300);line-height:var(--ds-text-heading-600-height-breakpoint-sm, 1.875rem)}@media screen and (min-width: 768px){.heading--600{font-size:var(--ds-text-heading-600-size-breakpoint-md, 1.75rem);line-height:var(--ds-text-heading-600-height-breakpoint-md, 2.125rem)}}@media screen and (min-width: 1024px){.heading--600{font-size:var(--ds-text-heading-600-size-breakpoint-lg, 1.75rem);line-height:var(--ds-text-heading-600-height-breakpoint-lg, 2.25rem)}}.heading--500{margin:1rem 0;font-size:var(--ds-text-heading-500-size-breakpoint-sm, 1.375rem);font-weight:var(--ds-text-heading-500-weight, 300);line-height:var(--ds-text-heading-500-height-breakpoint-sm, 1.625rem)}@media screen and (min-width: 768px){.heading--500{font-size:var(--ds-text-heading-500-size-breakpoint-md, 1.5rem);line-height:var(--ds-text-heading-500-height-breakpoint-md, 1.875rem)}}@media screen and (min-width: 1024px){.heading--500{font-size:var(--ds-text-heading-500-size-breakpoint-lg, 1.5rem);line-height:var(--ds-text-heading-500-height-breakpoint-lg, 2rem)}}.heading--400{margin:.75rem 0;font-size:var(--ds-text-heading-400-size, 1.25rem);font-weight:var(--ds-text-heading-400-weight, 300);line-height:var(--ds-text-heading-400-height, 1.625rem)}.heading--300{margin:.75rem 0;font-size:var(--ds-text-heading-300-size, 1.125rem);font-weight:var(--ds-text-heading-300-weight, 300);line-height:var(--ds-text-heading-300-height, 1.625rem)}:host([no-margin-block]) .heading{margin-block:0}.util_stackMarginnone--bottom{margin-bottom:0}.util_stackMargin25--bottom{margin-bottom:var(--ds-size-25, 0.125rem)}.util_stackMargin50--bottom{margin-bottom:var(--ds-size-50, 0.25rem)}.util_stackMargin100--bottom{margin-bottom:var(--ds-size-100, 0.5rem)}.util_stackMargin150--bottom{margin-bottom:var(--ds-size-150, 0.75rem)}.util_stackMargin200--bottom{margin-bottom:var(--ds-size-200, 1rem)}.util_stackMargin300--bottom{margin-bottom:var(--ds-size-300, 1.5rem)}.util_stackMargin400--bottom{margin-bottom:var(--ds-size-400, 2rem)}.util_stackMargin600--bottom{margin-bottom:var(--ds-size-600, 3rem)}.util_stackMargin800--bottom{margin-bottom:var(--ds-size-800, 4rem)}.util_stackMarginnone--top{margin-top:0}.util_stackMargin25--top{margin-top:var(--ds-size-25, 0.125rem)}.util_stackMargin50--top{margin-top:var(--ds-size-50, 0.25rem)}.util_stackMargin100--top{margin-top:var(--ds-size-100, 0.5rem)}.util_stackMargin150--top{margin-top:var(--ds-size-150, 0.75rem)}.util_stackMargin200--top{margin-top:var(--ds-size-200, 1rem)}.util_stackMargin300--top{margin-top:var(--ds-size-300, 1.5rem)}.util_stackMargin400--top{margin-top:var(--ds-size-400, 2rem)}.util_stackMargin600--top{margin-top:var(--ds-size-600, 3rem)}.util_stackMargin800--top{margin-top:var(--ds-size-800, 4rem)}`;
|
|
446
446
|
|
|
@@ -271,7 +271,7 @@ class BaseIcon extends AuroElement {
|
|
|
271
271
|
|
|
272
272
|
var tokensCss = css`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
|
|
273
273
|
|
|
274
|
-
var colorCss = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=tierOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-emerald, #139142)}:host(:not([onDark])[variant=tierOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=tierOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
|
|
274
|
+
var colorCss = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=tierOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-emerald, #139142)}:host(:not([onDark])[variant=tierOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=tierOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][variant=statusError]){--ds-auro-icon-color:var(--ds-advanced-color-state-error-inverse, #f9a4a8)}`;
|
|
275
275
|
|
|
276
276
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
277
277
|
// See LICENSE in the project root for license information.
|
|
@@ -440,7 +440,7 @@ class AuroIcon extends BaseIcon {
|
|
|
440
440
|
}
|
|
441
441
|
}
|
|
442
442
|
|
|
443
|
-
var iconVersion = '8.0.
|
|
443
|
+
var iconVersion = '8.0.3';
|
|
444
444
|
|
|
445
445
|
var styleCss = css`.heading{margin:1.75rem 0;letter-spacing:var(--ds-text-heading-default-spacing, -0.2px);font-weight:var(--ds-text-heading-default-weight, 500)}.heading--display{margin-top:0;font-size:var(--ds-text-heading-display-size-breakpoint-sm, 2.75rem);font-weight:var(--ds-text-heading-display-weight, 100);line-height:var(--ds-text-heading-display-height-breakpoint-sm, 3.375rem)}@media screen and (min-width: 768px){.heading--display{font-size:var(--ds-text-heading-display-size-breakpoint-md, 3rem);line-height:var(--ds-text-heading-display-height-breakpoint-md, 3.75rem)}}@media screen and (min-width: 1024px){.heading--display{font-size:var(--ds-text-heading-display-size-breakpoint-lg, 3.5rem);line-height:var(--ds-text-heading-display-height-breakpoint-lg, 4.25rem)}}.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-sm, 2rem);font-weight:var(--ds-text-heading-800-weight, 500);line-height:var(--ds-text-heading-800-height-breakpoint-sm, 2.375rem)}@media screen and (min-width: 768px){.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-md, 2.25rem);line-height:var(--ds-text-heading-800-height-breakpoint-md, 2.625rem)}}@media screen and (min-width: 1024px){.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-lg, 2.5rem);line-height:var(--ds-text-heading-800-height-breakpoint-lg, 3rem)}}.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-sm, 1.75rem);font-weight:var(--ds-text-heading-700-weight, 500);line-height:var(--ds-text-heading-700-height-breakpoint-sm, 2.125rem)}@media screen and (min-width: 768px){.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-md, 2rem);line-height:var(--ds-text-heading-700-height-breakpoint-md, 2.375rem)}}@media screen and (min-width: 1024px){.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-lg, 2.25rem);line-height:var(--ds-text-heading-700-height-breakpoint-lg, 2.75rem)}}.heading--600{margin:1rem 0;font-size:var(--ds-text-heading-600-size-breakpoint-sm, 1.625rem);font-weight:var(--ds-text-heading-600-weight, 300);line-height:var(--ds-text-heading-600-height-breakpoint-sm, 1.875rem)}@media screen and (min-width: 768px){.heading--600{font-size:var(--ds-text-heading-600-size-breakpoint-md, 1.75rem);line-height:var(--ds-text-heading-600-height-breakpoint-md, 2.125rem)}}@media screen and (min-width: 1024px){.heading--600{font-size:var(--ds-text-heading-600-size-breakpoint-lg, 1.75rem);line-height:var(--ds-text-heading-600-height-breakpoint-lg, 2.25rem)}}.heading--500{margin:1rem 0;font-size:var(--ds-text-heading-500-size-breakpoint-sm, 1.375rem);font-weight:var(--ds-text-heading-500-weight, 300);line-height:var(--ds-text-heading-500-height-breakpoint-sm, 1.625rem)}@media screen and (min-width: 768px){.heading--500{font-size:var(--ds-text-heading-500-size-breakpoint-md, 1.5rem);line-height:var(--ds-text-heading-500-height-breakpoint-md, 1.875rem)}}@media screen and (min-width: 1024px){.heading--500{font-size:var(--ds-text-heading-500-size-breakpoint-lg, 1.5rem);line-height:var(--ds-text-heading-500-height-breakpoint-lg, 2rem)}}.heading--400{margin:.75rem 0;font-size:var(--ds-text-heading-400-size, 1.25rem);font-weight:var(--ds-text-heading-400-weight, 300);line-height:var(--ds-text-heading-400-height, 1.625rem)}.heading--300{margin:.75rem 0;font-size:var(--ds-text-heading-300-size, 1.125rem);font-weight:var(--ds-text-heading-300-weight, 300);line-height:var(--ds-text-heading-300-height, 1.625rem)}:host([no-margin-block]) .heading{margin-block:0}.util_stackMarginnone--bottom{margin-bottom:0}.util_stackMargin25--bottom{margin-bottom:var(--ds-size-25, 0.125rem)}.util_stackMargin50--bottom{margin-bottom:var(--ds-size-50, 0.25rem)}.util_stackMargin100--bottom{margin-bottom:var(--ds-size-100, 0.5rem)}.util_stackMargin150--bottom{margin-bottom:var(--ds-size-150, 0.75rem)}.util_stackMargin200--bottom{margin-bottom:var(--ds-size-200, 1rem)}.util_stackMargin300--bottom{margin-bottom:var(--ds-size-300, 1.5rem)}.util_stackMargin400--bottom{margin-bottom:var(--ds-size-400, 2rem)}.util_stackMargin600--bottom{margin-bottom:var(--ds-size-600, 3rem)}.util_stackMargin800--bottom{margin-bottom:var(--ds-size-800, 4rem)}.util_stackMarginnone--top{margin-top:0}.util_stackMargin25--top{margin-top:var(--ds-size-25, 0.125rem)}.util_stackMargin50--top{margin-top:var(--ds-size-50, 0.25rem)}.util_stackMargin100--top{margin-top:var(--ds-size-100, 0.5rem)}.util_stackMargin150--top{margin-top:var(--ds-size-150, 0.75rem)}.util_stackMargin200--top{margin-top:var(--ds-size-200, 1rem)}.util_stackMargin300--top{margin-top:var(--ds-size-300, 1.5rem)}.util_stackMargin400--top{margin-top:var(--ds-size-400, 2rem)}.util_stackMargin600--top{margin-top:var(--ds-size-600, 3rem)}.util_stackMargin800--top{margin-top:var(--ds-size-800, 4rem)}`;
|
|
446
446
|
|
|
@@ -180,6 +180,7 @@ class AuroCheckbox extends i$2 {
|
|
|
180
180
|
// function to define props used within the scope of this component
|
|
181
181
|
static get properties() {
|
|
182
182
|
return {
|
|
183
|
+
...super.properties,
|
|
183
184
|
|
|
184
185
|
/**
|
|
185
186
|
* If set to true, the checkbox will be filled with a checkmark.
|
|
@@ -354,8 +355,11 @@ class AuroCheckbox extends i$2 {
|
|
|
354
355
|
});
|
|
355
356
|
}
|
|
356
357
|
|
|
357
|
-
|
|
358
|
-
|
|
358
|
+
/**
|
|
359
|
+
* @private
|
|
360
|
+
* @returns {HTMLElement}
|
|
361
|
+
*/
|
|
362
|
+
getLayoutDefault() {
|
|
359
363
|
const labelClasses = {
|
|
360
364
|
'label': true,
|
|
361
365
|
'label--cbx': true,
|
|
@@ -1496,6 +1500,7 @@ class AuroCheckboxGroup extends i$2 {
|
|
|
1496
1500
|
|
|
1497
1501
|
static get properties() {
|
|
1498
1502
|
return {
|
|
1503
|
+
...super.properties,
|
|
1499
1504
|
|
|
1500
1505
|
/**
|
|
1501
1506
|
* If set, disables the checkbox group.
|
|
@@ -1728,6 +1733,12 @@ class AuroCheckboxGroup extends i$2 {
|
|
|
1728
1733
|
* @returns {void}
|
|
1729
1734
|
*/
|
|
1730
1735
|
updated(changedProperties) {
|
|
1736
|
+
if (changedProperties.has('layout')) {
|
|
1737
|
+
this.checkboxes.forEach((el) => {
|
|
1738
|
+
el.layout = this.layout;
|
|
1739
|
+
});
|
|
1740
|
+
}
|
|
1741
|
+
|
|
1731
1742
|
if (changedProperties.has('disabled')) {
|
|
1732
1743
|
this.checkboxes.forEach((el) => {
|
|
1733
1744
|
if (this.disabled) {
|
|
@@ -172,6 +172,7 @@ class AuroCheckbox extends i$2 {
|
|
|
172
172
|
// function to define props used within the scope of this component
|
|
173
173
|
static get properties() {
|
|
174
174
|
return {
|
|
175
|
+
...super.properties,
|
|
175
176
|
|
|
176
177
|
/**
|
|
177
178
|
* If set to true, the checkbox will be filled with a checkmark.
|
|
@@ -346,8 +347,11 @@ class AuroCheckbox extends i$2 {
|
|
|
346
347
|
});
|
|
347
348
|
}
|
|
348
349
|
|
|
349
|
-
|
|
350
|
-
|
|
350
|
+
/**
|
|
351
|
+
* @private
|
|
352
|
+
* @returns {HTMLElement}
|
|
353
|
+
*/
|
|
354
|
+
getLayoutDefault() {
|
|
351
355
|
const labelClasses = {
|
|
352
356
|
'label': true,
|
|
353
357
|
'label--cbx': true,
|
|
@@ -1488,6 +1492,7 @@ class AuroCheckboxGroup extends i$2 {
|
|
|
1488
1492
|
|
|
1489
1493
|
static get properties() {
|
|
1490
1494
|
return {
|
|
1495
|
+
...super.properties,
|
|
1491
1496
|
|
|
1492
1497
|
/**
|
|
1493
1498
|
* If set, disables the checkbox group.
|
|
@@ -1720,6 +1725,12 @@ class AuroCheckboxGroup extends i$2 {
|
|
|
1720
1725
|
* @returns {void}
|
|
1721
1726
|
*/
|
|
1722
1727
|
updated(changedProperties) {
|
|
1728
|
+
if (changedProperties.has('layout')) {
|
|
1729
|
+
this.checkboxes.forEach((el) => {
|
|
1730
|
+
el.layout = this.layout;
|
|
1731
|
+
});
|
|
1732
|
+
}
|
|
1733
|
+
|
|
1723
1734
|
if (changedProperties.has('disabled')) {
|
|
1724
1735
|
this.checkboxes.forEach((el) => {
|
|
1725
1736
|
if (this.disabled) {
|
|
@@ -124,6 +124,10 @@ export class AuroCheckbox extends LitElement {
|
|
|
124
124
|
reset(): void;
|
|
125
125
|
firstUpdated(): void;
|
|
126
126
|
inputId: string;
|
|
127
|
-
|
|
127
|
+
/**
|
|
128
|
+
* @private
|
|
129
|
+
* @returns {HTMLElement}
|
|
130
|
+
*/
|
|
131
|
+
private getLayoutDefault;
|
|
128
132
|
}
|
|
129
133
|
import { LitElement } from "lit";
|
|
@@ -132,6 +132,7 @@ class AuroCheckbox extends LitElement {
|
|
|
132
132
|
// function to define props used within the scope of this component
|
|
133
133
|
static get properties() {
|
|
134
134
|
return {
|
|
135
|
+
...super.properties,
|
|
135
136
|
|
|
136
137
|
/**
|
|
137
138
|
* If set to true, the checkbox will be filled with a checkmark.
|
|
@@ -306,8 +307,11 @@ class AuroCheckbox extends LitElement {
|
|
|
306
307
|
});
|
|
307
308
|
}
|
|
308
309
|
|
|
309
|
-
|
|
310
|
-
|
|
310
|
+
/**
|
|
311
|
+
* @private
|
|
312
|
+
* @returns {HTMLElement}
|
|
313
|
+
*/
|
|
314
|
+
getLayoutDefault() {
|
|
311
315
|
const labelClasses = {
|
|
312
316
|
'label': true,
|
|
313
317
|
'label--cbx': true,
|
|
@@ -1441,6 +1445,7 @@ class AuroCheckboxGroup extends LitElement {
|
|
|
1441
1445
|
|
|
1442
1446
|
static get properties() {
|
|
1443
1447
|
return {
|
|
1448
|
+
...super.properties,
|
|
1444
1449
|
|
|
1445
1450
|
/**
|
|
1446
1451
|
* If set, disables the checkbox group.
|
|
@@ -1673,6 +1678,12 @@ class AuroCheckboxGroup extends LitElement {
|
|
|
1673
1678
|
* @returns {void}
|
|
1674
1679
|
*/
|
|
1675
1680
|
updated(changedProperties) {
|
|
1681
|
+
if (changedProperties.has('layout')) {
|
|
1682
|
+
this.checkboxes.forEach((el) => {
|
|
1683
|
+
el.layout = this.layout;
|
|
1684
|
+
});
|
|
1685
|
+
}
|
|
1686
|
+
|
|
1676
1687
|
if (changedProperties.has('disabled')) {
|
|
1677
1688
|
this.checkboxes.forEach((el) => {
|
|
1678
1689
|
if (this.disabled) {
|
|
@@ -132,6 +132,7 @@ class AuroCheckbox extends LitElement {
|
|
|
132
132
|
// function to define props used within the scope of this component
|
|
133
133
|
static get properties() {
|
|
134
134
|
return {
|
|
135
|
+
...super.properties,
|
|
135
136
|
|
|
136
137
|
/**
|
|
137
138
|
* If set to true, the checkbox will be filled with a checkmark.
|
|
@@ -306,8 +307,11 @@ class AuroCheckbox extends LitElement {
|
|
|
306
307
|
});
|
|
307
308
|
}
|
|
308
309
|
|
|
309
|
-
|
|
310
|
-
|
|
310
|
+
/**
|
|
311
|
+
* @private
|
|
312
|
+
* @returns {HTMLElement}
|
|
313
|
+
*/
|
|
314
|
+
getLayoutDefault() {
|
|
311
315
|
const labelClasses = {
|
|
312
316
|
'label': true,
|
|
313
317
|
'label--cbx': true,
|
|
@@ -1441,6 +1445,7 @@ class AuroCheckboxGroup extends LitElement {
|
|
|
1441
1445
|
|
|
1442
1446
|
static get properties() {
|
|
1443
1447
|
return {
|
|
1448
|
+
...super.properties,
|
|
1444
1449
|
|
|
1445
1450
|
/**
|
|
1446
1451
|
* If set, disables the checkbox group.
|
|
@@ -1673,6 +1678,12 @@ class AuroCheckboxGroup extends LitElement {
|
|
|
1673
1678
|
* @returns {void}
|
|
1674
1679
|
*/
|
|
1675
1680
|
updated(changedProperties) {
|
|
1681
|
+
if (changedProperties.has('layout')) {
|
|
1682
|
+
this.checkboxes.forEach((el) => {
|
|
1683
|
+
el.layout = this.layout;
|
|
1684
|
+
});
|
|
1685
|
+
}
|
|
1686
|
+
|
|
1676
1687
|
if (changedProperties.has('disabled')) {
|
|
1677
1688
|
this.checkboxes.forEach((el) => {
|
|
1678
1689
|
if (this.disabled) {
|
|
@@ -5,37 +5,40 @@
|
|
|
5
5
|
|
|
6
6
|
## Properties
|
|
7
7
|
|
|
8
|
-
| Property | Attribute | Type
|
|
9
|
-
|
|
10
|
-
| [autoPlacement](#autoPlacement) | `autoPlacement` | `boolean`
|
|
11
|
-
| [autocomplete](#autocomplete) | `autocomplete` | `string`
|
|
12
|
-
| [checkmark](#checkmark) | `checkmark` | `boolean`
|
|
13
|
-
| [disabled](#disabled) | `disabled` | `boolean`
|
|
14
|
-
| [error](#error) | `error` | `string`
|
|
15
|
-
| [fullscreenBreakpoint](#fullscreenBreakpoint) | `fullscreenBreakpoint` | `string`
|
|
16
|
-
| [inputmode](#inputmode) | `inputmode` | `string`
|
|
17
|
-
| [largeFullscreenHeadline](#largeFullscreenHeadline) | `largeFullscreenHeadline` | `boolean`
|
|
18
|
-
| [
|
|
19
|
-
| [
|
|
20
|
-
| [
|
|
21
|
-
| [
|
|
22
|
-
| [
|
|
23
|
-
| [
|
|
24
|
-
| [
|
|
25
|
-
| [
|
|
26
|
-
| [
|
|
27
|
-
| [
|
|
28
|
-
| [
|
|
29
|
-
| [
|
|
30
|
-
| [
|
|
31
|
-
| [
|
|
32
|
-
| [
|
|
8
|
+
| Property | Attribute | Type | Default | Description |
|
|
9
|
+
|---------------------------------|---------------------------------|------------------------|----------------|--------------------------------------------------|
|
|
10
|
+
| [autoPlacement](#autoPlacement) | `autoPlacement` | `boolean` | | If declared, bib's position will be automatically calculated where to appear. |
|
|
11
|
+
| [autocomplete](#autocomplete) | `autocomplete` | `string` | "false" | An enumerated attribute that defines what the user agent can suggest for autofill. At this time, only `autocomplete="off"` is supported. |
|
|
12
|
+
| [checkmark](#checkmark) | `checkmark` | `boolean` | | When attribute is present auro-menu will apply checkmarks to selected options. |
|
|
13
|
+
| [disabled](#disabled) | `disabled` | `boolean` | | If set, disables the combobox. |
|
|
14
|
+
| [error](#error) | `error` | `string` | | When defined, sets persistent validity to `customError` and sets the validation message to the attribute value. |
|
|
15
|
+
| [fullscreenBreakpoint](#fullscreenBreakpoint) | `fullscreenBreakpoint` | `string` | "sm" | Defines the screen size breakpoint (`xs`, `sm`, `md`, `lg`, `xl`, `disabled`)<br />at which the dropdown switches to fullscreen mode on mobile. `disabled` indicates a dropdown should _never_ enter fullscreen.<br /><br />When expanded, the dropdown will automatically display in fullscreen mode<br />if the screen size is equal to or smaller than the selected breakpoint. |
|
|
16
|
+
| [inputmode](#inputmode) | `inputmode` | `string` | | Exposes inputmode attribute for input. |
|
|
17
|
+
| [largeFullscreenHeadline](#largeFullscreenHeadline) | `largeFullscreenHeadline` | `boolean` | | If declared, make bib.fullscreen.headline in HeadingDisplay.<br />Otherwise, Heading 600 |
|
|
18
|
+
| [layout](#layout) | | `string` | | |
|
|
19
|
+
| [noFilter](#noFilter) | `noFilter` | `boolean` | | If set, combobox will not filter menuoptions based in input. |
|
|
20
|
+
| [noFlip](#noFlip) | `noFlip` | `boolean` | "false" | If declared, the bib will NOT flip to an alternate position<br />when there isn't enough space in the specified `placement`. |
|
|
21
|
+
| [noValidate](#noValidate) | `noValidate` | `boolean` | | If set, disables auto-validation on blur. |
|
|
22
|
+
| [offset](#offset) | `offset` | `number` | "0" | Gap between the trigger element and bib. |
|
|
23
|
+
| [onDark](#onDark) | `onDark` | `boolean` | | If declared, onDark styles will be applied to the trigger. |
|
|
24
|
+
| [optionSelected](#optionSelected) | `optionSelected` | `object` | | Specifies the current selected option. |
|
|
25
|
+
| [placeholder](#placeholder) | `placeholder` | `string` | | Define custom placeholder text, only supported by date input formats. |
|
|
26
|
+
| [placement](#placement) | `placement` | `string` | "bottom-start" | Position where the bib should appear relative to the trigger.<br />Accepted values:<br />"top" \| "right" \| "bottom" \| "left" \|<br />"bottom-start" \| "top-start" \| "top-end" \|<br />"right-start" \| "right-end" \| "bottom-end" \|<br />"left-start" \| "left-end" |
|
|
27
|
+
| [required](#required) | `required` | `boolean` | | Populates the `required` attribute on the input. Used for client-side validation. |
|
|
28
|
+
| [setCustomValidity](#setCustomValidity) | `setCustomValidity` | `string` | | Sets a custom help text message to display for all validityStates. |
|
|
29
|
+
| [setCustomValidityCustomError](#setCustomValidityCustomError) | `setCustomValidityCustomError` | `string` | | Custom help text message to display when validity = `customError`. |
|
|
30
|
+
| [setCustomValidityValueMissing](#setCustomValidityValueMissing) | `setCustomValidityValueMissing` | `string` | | Custom help text message to display when validity = `valueMissing`. |
|
|
31
|
+
| [triggerIcon](#triggerIcon) | `triggerIcon` | `boolean` | | If set, the `icon` attribute will be applied to the trigger `auro-input` element. |
|
|
32
|
+
| [type](#type) | `type` | `string` | | Applies the defined value as the type attribute on auro-input. |
|
|
33
|
+
| [validity](#validity) | `validity` | `string` | | Specifies the `validityState` this element is in. |
|
|
34
|
+
| [value](#value) | `value` | `Array\|String<Array>` | | Value selected for the dropdown menu. |
|
|
33
35
|
|
|
34
36
|
## Methods
|
|
35
37
|
|
|
36
38
|
| Method | Type | Description |
|
|
37
39
|
|------------|----------------------------------------|--------------------------------------------------|
|
|
38
40
|
| [focus](#focus) | `(): void` | Focuses the combobox trigger input. |
|
|
41
|
+
| [isValid](#isValid) | `(): boolean` | |
|
|
39
42
|
| [reset](#reset) | `(): void` | Resets component to initial state. |
|
|
40
43
|
| [validate](#validate) | `(force?: boolean \| undefined): void` | Validates value.<br /><br />**force**: Whether to force validation. |
|
|
41
44
|
|
|
@@ -684,11 +687,11 @@ export function valueExample() {
|
|
|
684
687
|
const valueExample = document.querySelector('#valueExample');
|
|
685
688
|
|
|
686
689
|
document.querySelector('#valueValidExampleBtn').addEventListener('click', () => {
|
|
687
|
-
valueExample.value = 'Oranges';
|
|
690
|
+
valueExample.value = ['Oranges'];
|
|
688
691
|
});
|
|
689
692
|
|
|
690
693
|
document.querySelector('#valueInvalidExampleBtn').addEventListener('click', () => {
|
|
691
|
-
valueExample.value = 'Dragon Fruit';
|
|
694
|
+
valueExample.value = ['Dragon Fruit'];
|
|
692
695
|
});
|
|
693
696
|
|
|
694
697
|
document.querySelector('#valueUndefinedExampleBtn').addEventListener('click', () => {
|