@aurodesignsystem-dev/auro-formkit 0.0.0-pr622.1 → 0.0.0-pr624.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/README.md +1 -1
- package/components/checkbox/demo/api.min.js +14 -3
- package/components/checkbox/demo/index.min.js +14 -3
- package/components/checkbox/demo/readme.md +1 -1
- 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 +14 -3
- package/components/checkbox/dist/registered.js +14 -3
- package/components/combobox/README.md +1 -1
- package/components/combobox/demo/api.md +3 -0
- package/components/combobox/demo/api.min.js +1479 -395
- package/components/combobox/demo/index.html +2 -0
- package/components/combobox/demo/index.md +75 -0
- package/components/combobox/demo/index.min.js +1479 -395
- package/components/combobox/demo/readme.md +1 -1
- package/components/combobox/dist/auro-combobox.d.ts +19 -9
- package/components/combobox/dist/index.js +1471 -387
- package/components/combobox/dist/registered.js +1471 -387
- package/components/counter/README.md +1 -1
- package/components/counter/demo/api.min.js +433 -104
- package/components/counter/demo/index.min.js +433 -104
- package/components/counter/demo/readme.md +1 -1
- 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/README.md +1 -1
- package/components/datepicker/demo/api.min.js +1157 -376
- package/components/datepicker/demo/index.min.js +1157 -376
- package/components/datepicker/demo/readme.md +1 -1
- package/components/datepicker/dist/index.js +1156 -375
- package/components/datepicker/dist/registered.js +1156 -375
- package/components/dropdown/README.md +1 -1
- 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/demo/readme.md +1 -1
- 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/dropdown/dist/styles/default/style-css.d.ts +2 -0
- package/components/dropdown/dist/styles/emphasized/style-css.d.ts +2 -0
- package/components/dropdown/dist/styles/shapeSize-css.d.ts +2 -0
- package/components/dropdown/dist/styles/snowflake/style-css.d.ts +2 -0
- package/components/form/README.md +1 -1
- package/components/form/demo/readme.md +1 -1
- package/components/input/README.md +2 -2
- 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 +2 -2
- 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/color-css.d.ts +2 -0
- 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/README.md +1 -1
- package/components/menu/demo/api.min.js +2 -2
- package/components/menu/demo/index.min.js +2 -2
- package/components/menu/demo/readme.md +1 -1
- package/components/menu/dist/iconVersion.d.ts +1 -1
- package/components/menu/dist/index.js +2 -2
- package/components/menu/dist/registered.js +2 -2
- package/components/radio/README.md +1 -1
- package/components/radio/demo/api.md +8 -0
- package/components/radio/demo/api.min.js +13 -5
- package/components/radio/demo/index.min.js +13 -5
- package/components/radio/demo/readme.md +1 -1
- package/components/radio/dist/auro-radio.d.ts +4 -0
- package/components/radio/dist/index.js +13 -5
- package/components/radio/dist/registered.js +13 -5
- package/components/select/README.md +1 -1
- package/components/select/demo/api.html +15 -0
- package/components/select/demo/api.md +178 -0
- package/components/select/demo/api.min.js +403 -62
- package/components/select/demo/index.html +15 -0
- package/components/select/demo/index.md +177 -0
- package/components/select/demo/index.min.js +403 -62
- package/components/select/demo/readme.md +1 -1
- package/components/select/dist/auro-select.d.ts +27 -0
- package/components/select/dist/index.js +400 -58
- package/components/select/dist/registered.js +400 -58
- 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
|
@@ -119,7 +119,7 @@ let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
|
|
|
119
119
|
}
|
|
120
120
|
};
|
|
121
121
|
|
|
122
|
-
var styleCss$9 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-basic-text-body-default-font-family, AS Circular);font-size:var(--ds-basic-text-body-default-font-size, 16px);font-weight:var(--ds-basic-text-body-default-font-weight,
|
|
122
|
+
var styleCss$9 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-basic-text-body-default-font-family, "AS Circular");font-size:var(--ds-basic-text-body-default-font-size, 16px);font-weight:var(--ds-basic-text-body-default-font-weight, 450);line-height:var(--ds-basic-text-body-default-line-height, 24px);letter-spacing:var(--ds-basic-text-body-default-letter-spacing, 0);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible{outline:none}.auro-button:focus-visible:not([variant=flat]){outline-style:solid;outline-width:var(--ds-size-50, 0.25rem);outline-offset:calc(var(--ds-size-50, 0.25rem)*-1)}.auro-button:focus-visible:not([variant=flat]):not([variant=secondary]):not([variant=tertiary]){outline-width:calc(var(--ds-size-50, 0.25rem) - 1px)}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-family:var(--ds-basic-text-body-sm-font-family, "AS Circular");font-size:var(--ds-basic-text-body-sm-font-size, 14px);font-weight:var(--ds-basic-text-body-sm-font-weight, 450);line-height:var(--ds-basic-text-body-sm-line-height, 20px);letter-spacing:var(--ds-basic-text-body-sm-letter-spacing, 0);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}.auro-button--iconOnly:not(.auro-button--rounded):focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]){outline-width:1px;outline-offset:-2px}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, 1rem) + var(--ds-size-50, 0.25rem))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out,outline 0ms,outline-offset 0ms}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}.auro-button--rounded:focus-visible:not([variant=flat]):after{border-radius:100px}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
123
123
|
|
|
124
124
|
var colorCss$8 = css`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible{outline-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-hover, #00274a)}.auro-button:not([ondark]):disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-disabled, #acc9e2)}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border, #01426a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text, #01426a)}.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-hover, #00274a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-hover, #00274a)}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-disabled, #cfe0ef);--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text, #01426a)}.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-border-color:transparent}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-advanced-color-button-flat-text, #676767);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-hover, #525252);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-disabled, #d0d0d0);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a)}.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-hover, #ebf3f9);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9)}.auro-button[ondark]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button[ondark]:disabled{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:transparent;--ds-auro-button-container-image:transparent;--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:active:not(:disabled),.auro-button[ondark][variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse-disabled, #dddddd)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=flat]{color:var(--ds-advanced-color-button-flat-text-inverse, #ffffff);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-inverse-hover, #adadad);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-inverse-disabled, #7e8894);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
125
125
|
|
|
@@ -278,27 +278,6 @@ var loaderVersion = '5.0.0';
|
|
|
278
278
|
|
|
279
279
|
|
|
280
280
|
/**
|
|
281
|
-
* @attr {Boolean} autofocus - This Boolean attribute lets you specify that the button should have input focus when the page loads, unless overridden by the user
|
|
282
|
-
* @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
|
|
283
|
-
* @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
|
|
284
|
-
* @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
|
|
285
|
-
* @attr {String} loadingText - Sets custom loading text for the `aria-label` on a button in loading state. If not set, the default value of "Loading..." will be used.
|
|
286
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-button
|
|
287
|
-
* @attr {Boolean} rounded - If set to true, the button will have a rounded shape
|
|
288
|
-
* @attr {Boolean} slim - Set value for slim version of auro-button
|
|
289
|
-
* @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
|
|
290
|
-
* @attr {String} arialabel - Populates the `aria-label` attribute that is used to define a string that labels the current element. Use it in cases where a text label is not visible on the screen. If there is visible text labeling the element, use `aria-labelledby` instead.
|
|
291
|
-
* @attr {String} arialabelledby - Populates the `aria-labelledby` attribute that establishes relationships between objects and their label(s), and its value should be one or more element IDs, which refer to elements that have the text needed for labeling. List multiple element IDs in a space delimited fashion.
|
|
292
|
-
* @attr {Boolean} ariaexpanded - Populates the `aria-expanded` attribute that indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. This is an optional attribute for buttons.
|
|
293
|
-
* @attr {String} id - Set the unique ID of an element.
|
|
294
|
-
* @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
|
|
295
|
-
* @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
|
|
296
|
-
* @attr {String} value - Defines the value associated with the button which is submitted with the form data.
|
|
297
|
-
* @attr {String} variant - Sets button variant option. Possible values are: `secondary`, `tertiary`
|
|
298
|
-
* @attr {Boolean} secondary - DEPRECATED
|
|
299
|
-
* @attr {Boolean} tertiary - DEPRECATED
|
|
300
|
-
* @prop {Boolean} ready - When false the component API should not be called.
|
|
301
|
-
* @event auroButton-ready - Notifies that the component has finished initializing.
|
|
302
281
|
* @slot - Default slot for the text of the button.
|
|
303
282
|
* @slot icon - Slot to provide auro-icon for the button.
|
|
304
283
|
* @csspart button - Apply CSS to HTML5 button.
|
|
@@ -322,13 +301,11 @@ class AuroButton extends LitElement {
|
|
|
322
301
|
|
|
323
302
|
constructor() {
|
|
324
303
|
super();
|
|
325
|
-
|
|
326
304
|
this.autofocus = false;
|
|
327
305
|
this.disabled = false;
|
|
328
306
|
this.iconOnly = false;
|
|
329
307
|
this.loading = false;
|
|
330
308
|
this.onDark = false;
|
|
331
|
-
this.ready = false;
|
|
332
309
|
this.secondary = false;
|
|
333
310
|
this.tertiary = false;
|
|
334
311
|
this.rounded = false;
|
|
@@ -367,73 +344,169 @@ class AuroButton extends LitElement {
|
|
|
367
344
|
|
|
368
345
|
static get properties() {
|
|
369
346
|
return {
|
|
347
|
+
|
|
348
|
+
/**
|
|
349
|
+
* This Boolean attribute lets you specify that the button should have input focus when the page loads, unless overridden by the user.
|
|
350
|
+
*/
|
|
370
351
|
autofocus: {
|
|
371
352
|
type: Boolean,
|
|
372
353
|
reflect: true
|
|
373
354
|
},
|
|
355
|
+
|
|
356
|
+
/**
|
|
357
|
+
* If set to true, button will become disabled and not allow for interactions.
|
|
358
|
+
*/
|
|
374
359
|
disabled: {
|
|
375
360
|
type: Boolean,
|
|
376
361
|
reflect: true
|
|
377
362
|
},
|
|
363
|
+
|
|
364
|
+
/**
|
|
365
|
+
* DEPRECATED.
|
|
366
|
+
* @deprecated
|
|
367
|
+
*/
|
|
378
368
|
secondary: {
|
|
379
369
|
type: Boolean,
|
|
380
370
|
reflect: true
|
|
381
371
|
},
|
|
372
|
+
|
|
373
|
+
/**
|
|
374
|
+
* DEPRECATED.
|
|
375
|
+
* @deprecated
|
|
376
|
+
*/
|
|
382
377
|
tertiary: {
|
|
383
378
|
type: Boolean,
|
|
384
379
|
reflect: true
|
|
385
380
|
},
|
|
381
|
+
|
|
382
|
+
/**
|
|
383
|
+
* Alters the shape of the button to be full width of its parent container.
|
|
384
|
+
*/
|
|
386
385
|
fluid: {
|
|
387
386
|
type: Boolean,
|
|
388
387
|
reflect: true
|
|
389
388
|
},
|
|
389
|
+
|
|
390
|
+
/**
|
|
391
|
+
* If set to true, the button will contain an icon with no additional content.
|
|
392
|
+
*/
|
|
390
393
|
iconOnly: {
|
|
391
394
|
type: Boolean,
|
|
392
395
|
reflect: true
|
|
393
396
|
},
|
|
397
|
+
|
|
398
|
+
/**
|
|
399
|
+
* If set to true button text will be replaced with `auro-loader` and become disabled.
|
|
400
|
+
*/
|
|
394
401
|
loading: {
|
|
395
402
|
type: Boolean,
|
|
396
403
|
reflect: true
|
|
397
404
|
},
|
|
405
|
+
|
|
406
|
+
/**
|
|
407
|
+
* Sets custom loading text for the `aria-label` on a button in loading state. If not set, the default value of "Loading..." will be used.
|
|
408
|
+
*/
|
|
398
409
|
loadingText: {
|
|
399
410
|
type: String
|
|
400
411
|
},
|
|
412
|
+
|
|
413
|
+
/**
|
|
414
|
+
* Set value for on-dark version of auro-button.
|
|
415
|
+
*/
|
|
401
416
|
onDark: {
|
|
402
417
|
type: Boolean,
|
|
403
418
|
reflect: true
|
|
404
419
|
},
|
|
420
|
+
|
|
421
|
+
/**
|
|
422
|
+
* If set to true, the button will have a rounded shape.
|
|
423
|
+
*/
|
|
405
424
|
rounded: {
|
|
406
425
|
type: Boolean,
|
|
407
426
|
reflect: true
|
|
408
427
|
},
|
|
428
|
+
|
|
429
|
+
/**
|
|
430
|
+
* Set value for slim version of auro-button.
|
|
431
|
+
*/
|
|
409
432
|
slim: {
|
|
410
433
|
type: Boolean,
|
|
411
434
|
reflect: true
|
|
412
435
|
},
|
|
436
|
+
|
|
437
|
+
/**
|
|
438
|
+
* Populates `tabIndex` to define the focusable sequence in keyboard navigation.
|
|
439
|
+
*/
|
|
440
|
+
tIndex: {
|
|
441
|
+
type: String,
|
|
442
|
+
reflect: true
|
|
443
|
+
},
|
|
444
|
+
|
|
445
|
+
/**
|
|
446
|
+
* Populates the `aria-hidden` attribute to hide the button from a11y API.
|
|
447
|
+
*/
|
|
448
|
+
ariahidden: {
|
|
449
|
+
type: String,
|
|
450
|
+
reflect: true,
|
|
451
|
+
},
|
|
452
|
+
|
|
453
|
+
/**
|
|
454
|
+
* Populates the `aria-label` attribute that is used to define a string that labels the current element.
|
|
455
|
+
* Use it in cases where a text label is not visible on the screen.
|
|
456
|
+
* If there is visible text labeling the element, use `aria-labelledby` instead.
|
|
457
|
+
*/
|
|
413
458
|
arialabel: {
|
|
414
459
|
type: String,
|
|
415
460
|
reflect: true
|
|
416
461
|
},
|
|
462
|
+
|
|
463
|
+
/**
|
|
464
|
+
* Populates the `aria-labelledby` attribute that establishes relationships between objects and their label(s),
|
|
465
|
+
* and its value should be one or more element IDs, which refer to elements that have the text needed for labeling.
|
|
466
|
+
* List multiple element IDs in a space delimited fashion.
|
|
467
|
+
*/
|
|
417
468
|
arialabelledby: {
|
|
418
469
|
type: String,
|
|
419
470
|
reflect: true
|
|
420
471
|
},
|
|
472
|
+
|
|
473
|
+
/**
|
|
474
|
+
* Populates the `aria-expanded` attribute that indicates whether the element,
|
|
475
|
+
* or another grouping element it controls, is currently expanded or collapsed.
|
|
476
|
+
* This is an optional attribute for buttons.
|
|
477
|
+
*/
|
|
421
478
|
ariaexpanded: {
|
|
422
479
|
type: Boolean,
|
|
423
480
|
reflect: true
|
|
424
481
|
},
|
|
482
|
+
|
|
483
|
+
/**
|
|
484
|
+
* Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
|
|
485
|
+
*/
|
|
425
486
|
title: {
|
|
426
487
|
type: String,
|
|
427
488
|
reflect: true
|
|
428
489
|
},
|
|
490
|
+
|
|
491
|
+
/**
|
|
492
|
+
* The type of the button. Possible values are: `submit`, `reset`, `button`.
|
|
493
|
+
*/
|
|
429
494
|
type: {
|
|
430
495
|
type: String,
|
|
431
496
|
reflect: true
|
|
432
497
|
},
|
|
498
|
+
|
|
499
|
+
/**
|
|
500
|
+
* Defines the value associated with the button which is submitted with the form data.
|
|
501
|
+
*/
|
|
433
502
|
value: {
|
|
434
503
|
type: String,
|
|
435
504
|
reflect: true
|
|
436
505
|
},
|
|
506
|
+
|
|
507
|
+
/**
|
|
508
|
+
* Sets button variant option. Possible values are: `secondary`, `tertiary`.
|
|
509
|
+
*/
|
|
437
510
|
variant: {
|
|
438
511
|
type: String,
|
|
439
512
|
reflect: true
|
|
@@ -463,21 +536,6 @@ class AuroButton extends LitElement {
|
|
|
463
536
|
this.renderRoot.querySelector('button').focus();
|
|
464
537
|
}
|
|
465
538
|
|
|
466
|
-
/**
|
|
467
|
-
* Marks the component as ready and sends event.
|
|
468
|
-
* @private
|
|
469
|
-
* @returns {void}
|
|
470
|
-
*/
|
|
471
|
-
notifyReady() {
|
|
472
|
-
this.ready = true;
|
|
473
|
-
|
|
474
|
-
this.dispatchEvent(new CustomEvent('auroButton-ready', {
|
|
475
|
-
bubbles: true,
|
|
476
|
-
cancelable: false,
|
|
477
|
-
composed: true,
|
|
478
|
-
}));
|
|
479
|
-
}
|
|
480
|
-
|
|
481
539
|
updated() {
|
|
482
540
|
// support the old `secondary` and `tertiary` attributes` that are deprecated
|
|
483
541
|
if (this.secondary) {
|
|
@@ -489,10 +547,6 @@ class AuroButton extends LitElement {
|
|
|
489
547
|
}
|
|
490
548
|
}
|
|
491
549
|
|
|
492
|
-
firstUpdated() {
|
|
493
|
-
this.notifyReady();
|
|
494
|
-
}
|
|
495
|
-
|
|
496
550
|
/**
|
|
497
551
|
* Submits the form that this button is associated with.
|
|
498
552
|
* @private
|
|
@@ -507,7 +561,7 @@ class AuroButton extends LitElement {
|
|
|
507
561
|
/**
|
|
508
562
|
* Returns the form element that this button is associated with.
|
|
509
563
|
* @private
|
|
510
|
-
* @returns {HTMLFormElement|null}
|
|
564
|
+
* @returns {HTMLFormElement | null}
|
|
511
565
|
*/
|
|
512
566
|
get form() {
|
|
513
567
|
return this.internals ? this.internals.form : null;
|
|
@@ -528,9 +582,11 @@ class AuroButton extends LitElement {
|
|
|
528
582
|
return html$1`
|
|
529
583
|
<button
|
|
530
584
|
part="button"
|
|
585
|
+
aria-hidden="${ifDefined(this.ariahidden || undefined)}"
|
|
531
586
|
aria-label="${ifDefined(this.loading ? this.loadingText : this.arialabel || undefined)}"
|
|
532
587
|
aria-labelledby="${ifDefined(this.arialabelledby ? this.arialabelledby : undefined)}"
|
|
533
588
|
aria-expanded="${ifDefined(this.ariaexpanded)}"
|
|
589
|
+
tabIndex="${ifDefined(this.tIndex)}"
|
|
534
590
|
?autofocus="${this.autofocus}"
|
|
535
591
|
class="${classMap(classes)}"
|
|
536
592
|
?disabled="${this.disabled || this.loading}"
|
|
@@ -602,7 +658,7 @@ if (!customElements.get("auro-counter-button")) {
|
|
|
602
658
|
* @attr {Boolean} hiddenAudible - If present, the component will be hidden from screen readers, but seen visually
|
|
603
659
|
*/
|
|
604
660
|
|
|
605
|
-
let AuroElement$
|
|
661
|
+
let AuroElement$3 = class AuroElement extends LitElement {
|
|
606
662
|
|
|
607
663
|
// function to define props used within the scope of this component
|
|
608
664
|
static get properties() {
|
|
@@ -670,7 +726,7 @@ var styleCss$7 = css`:focus:not(:focus-visible){outline:3px solid transparent}.u
|
|
|
670
726
|
*/
|
|
671
727
|
|
|
672
728
|
// build the component class
|
|
673
|
-
let BaseIcon$2 = class BaseIcon extends AuroElement$
|
|
729
|
+
let BaseIcon$2 = class BaseIcon extends AuroElement$3 {
|
|
674
730
|
constructor() {
|
|
675
731
|
super();
|
|
676
732
|
this.onDark = false;
|
|
@@ -744,7 +800,7 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
|
|
|
744
800
|
|
|
745
801
|
var tokensCss$4 = 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)}`;
|
|
746
802
|
|
|
747
|
-
var colorCss$6 = 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)}`;
|
|
803
|
+
var colorCss$6 = 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)}`;
|
|
748
804
|
|
|
749
805
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
750
806
|
// See LICENSE in the project root for license information.
|
|
@@ -913,7 +969,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
913
969
|
}
|
|
914
970
|
};
|
|
915
971
|
|
|
916
|
-
var iconVersion$2 = '8.0.
|
|
972
|
+
var iconVersion$2 = '8.0.3';
|
|
917
973
|
|
|
918
974
|
class DateFormatter {
|
|
919
975
|
|
|
@@ -2645,16 +2701,21 @@ const flip$1 = function (options) {
|
|
|
2645
2701
|
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
2646
2702
|
const nextPlacement = placements[nextIndex];
|
|
2647
2703
|
if (nextPlacement) {
|
|
2648
|
-
|
|
2649
|
-
|
|
2650
|
-
|
|
2651
|
-
|
|
2652
|
-
|
|
2653
|
-
|
|
2654
|
-
|
|
2655
|
-
|
|
2656
|
-
|
|
2657
|
-
|
|
2704
|
+
var _overflowsData$;
|
|
2705
|
+
const ignoreCrossAxisOverflow = checkCrossAxis === 'alignment' ? initialSideAxis !== getSideAxis(nextPlacement) : false;
|
|
2706
|
+
const hasInitialMainAxisOverflow = ((_overflowsData$ = overflowsData[0]) == null ? void 0 : _overflowsData$.overflows[0]) > 0;
|
|
2707
|
+
if (!ignoreCrossAxisOverflow || hasInitialMainAxisOverflow) {
|
|
2708
|
+
// Try next placement and re-run the lifecycle.
|
|
2709
|
+
return {
|
|
2710
|
+
data: {
|
|
2711
|
+
index: nextIndex,
|
|
2712
|
+
overflows: overflowsData
|
|
2713
|
+
},
|
|
2714
|
+
reset: {
|
|
2715
|
+
placement: nextPlacement
|
|
2716
|
+
}
|
|
2717
|
+
};
|
|
2718
|
+
}
|
|
2658
2719
|
}
|
|
2659
2720
|
|
|
2660
2721
|
// First, find the candidates that fit on the mainAxis side of overflow,
|
|
@@ -3306,6 +3367,12 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
|
3306
3367
|
scrollTop: 0
|
|
3307
3368
|
};
|
|
3308
3369
|
const offsets = createCoords(0);
|
|
3370
|
+
|
|
3371
|
+
// If the <body> scrollbar appears on the left (e.g. RTL systems). Use
|
|
3372
|
+
// Firefox with layout.scrollbar.side = 3 in about:config to test this.
|
|
3373
|
+
function setLeftRTLScrollbarOffset() {
|
|
3374
|
+
offsets.x = getWindowScrollBarX(documentElement);
|
|
3375
|
+
}
|
|
3309
3376
|
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
3310
3377
|
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
3311
3378
|
scroll = getNodeScroll(offsetParent);
|
|
@@ -3315,11 +3382,12 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
|
3315
3382
|
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
3316
3383
|
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
3317
3384
|
} else if (documentElement) {
|
|
3318
|
-
|
|
3319
|
-
// Firefox with layout.scrollbar.side = 3 in about:config to test this.
|
|
3320
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
3385
|
+
setLeftRTLScrollbarOffset();
|
|
3321
3386
|
}
|
|
3322
3387
|
}
|
|
3388
|
+
if (isFixed && !isOffsetParentAnElement && documentElement) {
|
|
3389
|
+
setLeftRTLScrollbarOffset();
|
|
3390
|
+
}
|
|
3323
3391
|
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
3324
3392
|
const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
|
|
3325
3393
|
const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
|
|
@@ -3496,7 +3564,7 @@ function observeMove(element, onMove) {
|
|
|
3496
3564
|
// Handle <iframe>s
|
|
3497
3565
|
root: root.ownerDocument
|
|
3498
3566
|
});
|
|
3499
|
-
} catch (
|
|
3567
|
+
} catch (_e) {
|
|
3500
3568
|
io = new IntersectionObserver(handleObserve, options);
|
|
3501
3569
|
}
|
|
3502
3570
|
io.observe(element);
|
|
@@ -4451,7 +4519,7 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
4451
4519
|
|
|
4452
4520
|
var tokensCss$2 = 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)}`;
|
|
4453
4521
|
|
|
4454
|
-
var colorCss$3 = 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)}`;
|
|
4522
|
+
var colorCss$3 = 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)}`;
|
|
4455
4523
|
|
|
4456
4524
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
4457
4525
|
// See LICENSE in the project root for license information.
|
|
@@ -4626,7 +4694,7 @@ var styleCss$2$1 = css`:host{position:absolute;z-index:var(--depth-tooltip, 400)
|
|
|
4626
4694
|
|
|
4627
4695
|
var colorCss$2$1 = css`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
4628
4696
|
|
|
4629
|
-
var tokensCss$1 = css`:host{--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}`;
|
|
4697
|
+
var tokensCss$1 = css`:host(:not([ondark])){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}`;
|
|
4630
4698
|
|
|
4631
4699
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
4632
4700
|
// See LICENSE in the project root for license information.
|
|
@@ -4749,9 +4817,15 @@ class AuroDropdownBib extends LitElement {
|
|
|
4749
4817
|
|
|
4750
4818
|
var dropdownVersion$1 = '3.0.0';
|
|
4751
4819
|
|
|
4752
|
-
var
|
|
4820
|
+
var shapeSizeCss = css`.shape-snowflake-xl,.shape-snowflake-lg,.shape-snowflake-md,.shape-snowflake-sm,.shape-snowflake-xs{min-height:56px;max-height:56px;border-style:solid;border-width:2px;border-color:transparent;border-radius:30px}.shape-snowflake-xl.simple,.shape-snowflake-lg.simple,.shape-snowflake-md.simple,.shape-snowflake-sm.simple,.shape-snowflake-xs.simple{border-width:0;min-height:60px;max-height:60px;background-color:unset}.shape-box-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-xl.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-rounded-lg{min-height:52px;max-height:52px;border-style:solid;border-width:2px;border-color:transparent;border-radius:6px}.shape-rounded-lg.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:34px}.shape-pill-xl.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-left-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:34px 0 0 34px}.shape-pill-left-xl.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-right-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 34px 34px 0}.shape-pill-right-xl.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-md{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:34px}.shape-pill-md.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-left-md{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:34px 0 0 34px}.shape-pill-left-md.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-right-md{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 34px 34px 0}.shape-pill-right-md.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}`;
|
|
4821
|
+
|
|
4822
|
+
var styleCss$1$1 = css`:host([layout*=classic]){position:relative;display:inline-block;max-width:100%}:host([layout*=classic]) #bibSizer{position:absolute;z-index:-1;opacity:0;pointer-events:none}:host([layout*=classic]) .label{font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-text-body-size-default, 1rem);transition:font-size .3s cubic-bezier(0.215, 0.61, 0.355, 1);white-space:normal}:host([layout*=classic]) .label[hasTrigger=false]{font-size:var(--ds-text-body-size-default, 1rem)}:host([layout*=classic]) .trigger{position:relative;display:flex;align-items:center}:host([layout*=classic]) .trigger[showBorder]{border-width:1px;border-style:solid;cursor:pointer;outline-style:solid;outline-width:1px}@media(hover: hover){:host([layout*=classic]) .trigger:hover{cursor:pointer}}:host([layout*=classic]) .triggerContentWrapper{overflow:hidden;flex:1;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) #showStateIcon{display:flex;overflow:hidden;height:100%;align-items:center;margin-left:var(--ds-size-100, 0.5rem)}:host([layout*=classic]) #showStateIcon [auro-icon]{height:var(--ds-size-300, 1.5rem);line-height:var(--ds-size-300, 1.5rem)}:host([layout*=classic]) #showStateIcon[data-expanded=true] [auro-icon]{transform:rotate(-180deg)}:host([layout*=classic][fluid]){display:block}:host([layout*=classic][matchwidth]) #bibSizer{width:100%}:host([layout*=classic][disabled]){pointer-events:none}:host([layout*=classic][inset]) .trigger{padding:var(--ds-size-150, 0.75rem) var(--ds-size-200, 1rem)}:host([layout*=classic][common]) .trigger,:host([layout*=classic][inset][bordered]) .trigger{padding:var(--ds-size-200, 1rem) var(--ds-size-150, 0.75rem)}:host([layout*=classic][inset][bordered][labeled]) .trigger{padding:var(--ds-size-100, 0.5rem) var(--ds-size-150, 0.75rem)}:host([layout*=classic][common]) .trigger,:host([layout*=classic][rounded]) .trigger{border-radius:var(--ds-border-radius, 0.375rem)}`;
|
|
4823
|
+
|
|
4824
|
+
var colorCss$1$1 = css`:host .wrapper{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-background-color);color:var(--ds-auro-dropdown-trigger-text-color)}:host(:not([ondark])) .wrapper:focus,:host(:not([ondark])) .wrapper:focus-within{--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-brand, #00274a)}:host([ondark]) .wrapper:focus,:host([ondark]) .wrapper:focus-within{--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff)}:host([error]:not([ondark])){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-status-error, #e31f26)}:host([error][ondark]){--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helpText{color:var(--ds-auro-dropdown-helptext-text-color)}`;
|
|
4753
4825
|
|
|
4754
|
-
var
|
|
4826
|
+
var styleEmphasizedCss = css`:host{display:block}.wrapper{display:flex;flex-direction:column}.trigger{flex:1;display:flex;align-items:center;justify-content:center;outline:none}.triggerContentWrapper{flex:1;display:flex;align-items:center;justify-content:center;width:100%}.triggerContent{overflow:hidden;flex:1;display:flex;align-items:center;justify-content:center;text-overflow:ellipsis;white-space:nowrap;width:100%}:host([layout*=emphasized][shape*=pill]:not([layout*=right])) .leftIndent{margin-left:24px;width:calc(100% - 24px)}:host([layout*=emphasized][shape*=pill]:not([layout*=left])) .rightIndent{margin-right:24px;width:calc(100% - 24px)}:host([layout*=emphasized][shape*=pill]:not([layout*=left]):not([layout*=right])) .rightIndent{margin-right:24px;width:calc(100% - 48px)}`;
|
|
4827
|
+
|
|
4828
|
+
var styleSnowflakeCss = css`:host{display:block}.wrapper{display:flex;flex-direction:column}.trigger{flex:1;display:flex;align-items:center;justify-content:center;outline:none}.triggerContentWrapper{flex:1;display:flex;align-items:center;justify-content:center;width:100%}.triggerContent{overflow:hidden;flex:1;display:flex;align-items:center;justify-content:center;text-overflow:ellipsis;white-space:nowrap;width:100%}:host([layout*=snowflake]) .leftIndent{margin-left:24px;width:calc(100% - 48px)}:host([layout*=snowflake]) .rightIndent{margin-right:24px;width:calc(100% - 48px)}`;
|
|
4755
4829
|
|
|
4756
4830
|
var colorCss$4 = css`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]){--ds-auro-helptext-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
4757
4831
|
|
|
@@ -4961,6 +5035,98 @@ class AuroHelpText extends LitElement {
|
|
|
4961
5035
|
|
|
4962
5036
|
var helpTextVersion = '1.0.0';
|
|
4963
5037
|
|
|
5038
|
+
let AuroElement$2 = class AuroElement extends LitElement {
|
|
5039
|
+
static get properties() {
|
|
5040
|
+
return {
|
|
5041
|
+
|
|
5042
|
+
/**
|
|
5043
|
+
* Defines the language of an element.
|
|
5044
|
+
* @default {'default'}
|
|
5045
|
+
*/
|
|
5046
|
+
layout: {
|
|
5047
|
+
type: String,
|
|
5048
|
+
attribute: "layout",
|
|
5049
|
+
reflect: true
|
|
5050
|
+
},
|
|
5051
|
+
|
|
5052
|
+
shape: {
|
|
5053
|
+
type: String,
|
|
5054
|
+
attribute: "shape",
|
|
5055
|
+
reflect: true
|
|
5056
|
+
},
|
|
5057
|
+
|
|
5058
|
+
size: {
|
|
5059
|
+
type: String,
|
|
5060
|
+
attribute: "size",
|
|
5061
|
+
reflect: true
|
|
5062
|
+
},
|
|
5063
|
+
|
|
5064
|
+
onDark: {
|
|
5065
|
+
type: Boolean,
|
|
5066
|
+
attribute: "ondark",
|
|
5067
|
+
reflect: true
|
|
5068
|
+
}
|
|
5069
|
+
};
|
|
5070
|
+
}
|
|
5071
|
+
|
|
5072
|
+
resetShapeClasses() {
|
|
5073
|
+
if (this.shape && this.size) {
|
|
5074
|
+
const wrapper = this.shadowRoot.querySelector('.wrapper');
|
|
5075
|
+
|
|
5076
|
+
if (wrapper) {
|
|
5077
|
+
wrapper.classList.forEach((className) => {
|
|
5078
|
+
if (className.startsWith('shape-')) {
|
|
5079
|
+
wrapper.classList.remove(className);
|
|
5080
|
+
}
|
|
5081
|
+
});
|
|
5082
|
+
|
|
5083
|
+
wrapper.classList.add(`shape-${this.shape.toLowerCase()}-${this.size.toLowerCase()}`);
|
|
5084
|
+
}
|
|
5085
|
+
}
|
|
5086
|
+
}
|
|
5087
|
+
|
|
5088
|
+
resetLayoutClasses() {
|
|
5089
|
+
if (this.layout) {
|
|
5090
|
+
const wrapper = this.shadowRoot.querySelector('.wrapper');
|
|
5091
|
+
|
|
5092
|
+
if (wrapper) {
|
|
5093
|
+
wrapper.classList.forEach((className) => {
|
|
5094
|
+
if (className.startsWith('layout-')) {
|
|
5095
|
+
wrapper.classList.remove(className);
|
|
5096
|
+
}
|
|
5097
|
+
});
|
|
5098
|
+
|
|
5099
|
+
wrapper.classList.add(`layout-${this.layout.toLowerCase()}`);
|
|
5100
|
+
}
|
|
5101
|
+
}
|
|
5102
|
+
}
|
|
5103
|
+
|
|
5104
|
+
updateComponentArchitecture() {
|
|
5105
|
+
this.resetLayoutClasses();
|
|
5106
|
+
this.resetShapeClasses();
|
|
5107
|
+
}
|
|
5108
|
+
|
|
5109
|
+
updated(changedProperties) {
|
|
5110
|
+
if (changedProperties.has('layout') || changedProperties.has('shape') || changedProperties.has('size')) {
|
|
5111
|
+
this.updateComponentArchitecture();
|
|
5112
|
+
}
|
|
5113
|
+
}
|
|
5114
|
+
|
|
5115
|
+
// Try to render the defined `this.layout` layout. If that fails, fall back to the default layout.
|
|
5116
|
+
// This will catch if an invalid layout value is passed in and render the default layout if so.
|
|
5117
|
+
render() {
|
|
5118
|
+
try {
|
|
5119
|
+
return this.renderLayout();
|
|
5120
|
+
} catch (error) {
|
|
5121
|
+
// failed to get the defined layout
|
|
5122
|
+
console.error('Failed to get the defined layout - using the default layout', error); // eslint-disable-line no-console
|
|
5123
|
+
|
|
5124
|
+
// fallback to the default layout
|
|
5125
|
+
return this.getLayout('default');
|
|
5126
|
+
}
|
|
5127
|
+
}
|
|
5128
|
+
};
|
|
5129
|
+
|
|
4964
5130
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
4965
5131
|
// See LICENSE in the project root for license information.
|
|
4966
5132
|
|
|
@@ -4978,7 +5144,7 @@ var helpTextVersion = '1.0.0';
|
|
|
4978
5144
|
* @event auroDropdown-toggled - Notifies that the visibility of the dropdown bib has changed.
|
|
4979
5145
|
* @event auroDropdown-idAdded - Notifies consumers that the unique ID for the dropdown bib has been generated.
|
|
4980
5146
|
*/
|
|
4981
|
-
class AuroDropdown extends
|
|
5147
|
+
class AuroDropdown extends AuroElement$2 {
|
|
4982
5148
|
constructor() {
|
|
4983
5149
|
super();
|
|
4984
5150
|
|
|
@@ -4987,26 +5153,29 @@ class AuroDropdown extends LitElement {
|
|
|
4987
5153
|
this.matchWidth = false;
|
|
4988
5154
|
this.noHideOnThisFocusLoss = false;
|
|
4989
5155
|
|
|
5156
|
+
this.errorMessage = ''; // TODO!
|
|
5157
|
+
|
|
5158
|
+
// Layout Config
|
|
5159
|
+
this.layout = 'default';
|
|
5160
|
+
this.shape = 'rounded';
|
|
5161
|
+
this.size = 'xl';
|
|
5162
|
+
|
|
4990
5163
|
this.privateDefaults();
|
|
5164
|
+
}
|
|
4991
5165
|
|
|
4992
|
-
|
|
4993
|
-
|
|
4994
|
-
|
|
4995
|
-
*/
|
|
4996
|
-
this.constructor.shadowRootOptions = {
|
|
4997
|
-
...LitElement.shadowRootOptions,
|
|
4998
|
-
delegatesFocus: true,
|
|
5166
|
+
get commonLabelClasses() {
|
|
5167
|
+
return {
|
|
5168
|
+
// 'withValue': this.value && this.value.length > 0
|
|
4999
5169
|
};
|
|
5170
|
+
}
|
|
5000
5171
|
|
|
5001
|
-
|
|
5002
|
-
|
|
5003
|
-
|
|
5004
|
-
|
|
5005
|
-
|
|
5006
|
-
|
|
5007
|
-
|
|
5008
|
-
*/
|
|
5009
|
-
this.showTriggerBorders = true;
|
|
5172
|
+
get commonWrapperClasses() {
|
|
5173
|
+
return {
|
|
5174
|
+
'trigger': true,
|
|
5175
|
+
'wrapper': true,
|
|
5176
|
+
'hasFocus': this.hasFocus,
|
|
5177
|
+
'simple': this.simple
|
|
5178
|
+
};
|
|
5010
5179
|
}
|
|
5011
5180
|
|
|
5012
5181
|
/**
|
|
@@ -5014,7 +5183,6 @@ class AuroDropdown extends LitElement {
|
|
|
5014
5183
|
* @returns {void} Internal defaults.
|
|
5015
5184
|
*/
|
|
5016
5185
|
privateDefaults() {
|
|
5017
|
-
this.bordered = false;
|
|
5018
5186
|
this.chevron = false;
|
|
5019
5187
|
this.disabled = false;
|
|
5020
5188
|
this.error = false;
|
|
@@ -5024,8 +5192,11 @@ class AuroDropdown extends LitElement {
|
|
|
5024
5192
|
this.noToggle = false;
|
|
5025
5193
|
this.a11yAutocomplete = 'none';
|
|
5026
5194
|
this.labeled = true;
|
|
5027
|
-
this.a11yRole = '
|
|
5195
|
+
this.a11yRole = 'button';
|
|
5028
5196
|
this.onDark = false;
|
|
5197
|
+
this.showTriggerBorders = true;
|
|
5198
|
+
this.triggerContentFocusable = false;
|
|
5199
|
+
this.simple = false;
|
|
5029
5200
|
|
|
5030
5201
|
// floaterConfig
|
|
5031
5202
|
this.placement = 'bottom-start';
|
|
@@ -5033,6 +5204,15 @@ class AuroDropdown extends LitElement {
|
|
|
5033
5204
|
this.noFlip = false;
|
|
5034
5205
|
this.autoPlacement = false;
|
|
5035
5206
|
|
|
5207
|
+
/**
|
|
5208
|
+
* @private
|
|
5209
|
+
* @property {boolean} delegatesFocus - Whether the shadow root delegates focus.
|
|
5210
|
+
*/
|
|
5211
|
+
this.constructor.shadowRootOptions = {
|
|
5212
|
+
...LitElement.shadowRootOptions,
|
|
5213
|
+
delegatesFocus: true,
|
|
5214
|
+
};
|
|
5215
|
+
|
|
5036
5216
|
/**
|
|
5037
5217
|
* @private
|
|
5038
5218
|
*/
|
|
@@ -5123,7 +5303,7 @@ class AuroDropdown extends LitElement {
|
|
|
5123
5303
|
/**
|
|
5124
5304
|
* If declared, applies a border around the trigger slot.
|
|
5125
5305
|
*/
|
|
5126
|
-
|
|
5306
|
+
simple: {
|
|
5127
5307
|
type: Boolean,
|
|
5128
5308
|
reflect: true
|
|
5129
5309
|
},
|
|
@@ -5171,13 +5351,20 @@ class AuroDropdown extends LitElement {
|
|
|
5171
5351
|
},
|
|
5172
5352
|
|
|
5173
5353
|
/**
|
|
5174
|
-
* If declared in combination with `
|
|
5354
|
+
* If declared in combination with not using the `simple` property or `helpText` slot content, will apply red color to both.
|
|
5175
5355
|
*/
|
|
5176
5356
|
error: {
|
|
5177
5357
|
type: Boolean,
|
|
5178
5358
|
reflect: true
|
|
5179
5359
|
},
|
|
5180
5360
|
|
|
5361
|
+
/**
|
|
5362
|
+
* Contains the help text message for the current validity error.
|
|
5363
|
+
*/
|
|
5364
|
+
errorMessage: {
|
|
5365
|
+
type: String
|
|
5366
|
+
},
|
|
5367
|
+
|
|
5181
5368
|
/**
|
|
5182
5369
|
* If declared, the bib will display when focus is applied to the trigger.
|
|
5183
5370
|
*/
|
|
@@ -5312,11 +5499,6 @@ class AuroDropdown extends LitElement {
|
|
|
5312
5499
|
|
|
5313
5500
|
/**
|
|
5314
5501
|
* Position where the bib should appear relative to the trigger.
|
|
5315
|
-
* Accepted values:
|
|
5316
|
-
* "top" | "right" | "bottom" | "left" |
|
|
5317
|
-
* "bottom-start" | "top-start" | "top-end" |
|
|
5318
|
-
* "right-start" | "right-end" | "bottom-end" |
|
|
5319
|
-
* "left-start" | "left-end"
|
|
5320
5502
|
* @default bottom-start
|
|
5321
5503
|
*/
|
|
5322
5504
|
placement: {
|
|
@@ -5362,7 +5544,10 @@ class AuroDropdown extends LitElement {
|
|
|
5362
5544
|
return [
|
|
5363
5545
|
colorCss$1$1,
|
|
5364
5546
|
styleCss$1$1,
|
|
5365
|
-
tokensCss$1
|
|
5547
|
+
tokensCss$1,
|
|
5548
|
+
styleEmphasizedCss,
|
|
5549
|
+
styleSnowflakeCss,
|
|
5550
|
+
shapeSizeCss
|
|
5366
5551
|
];
|
|
5367
5552
|
}
|
|
5368
5553
|
|
|
@@ -5398,6 +5583,7 @@ class AuroDropdown extends LitElement {
|
|
|
5398
5583
|
}
|
|
5399
5584
|
|
|
5400
5585
|
updated(changedProperties) {
|
|
5586
|
+
super.updated(changedProperties);
|
|
5401
5587
|
this.floater.handleUpdate(changedProperties);
|
|
5402
5588
|
|
|
5403
5589
|
// Note: `disabled` is not a breakpoint (it is not a screen size),
|
|
@@ -5407,7 +5593,7 @@ class AuroDropdown extends LitElement {
|
|
|
5407
5593
|
}
|
|
5408
5594
|
|
|
5409
5595
|
// when trigger's content is changed without any attribute or node change,
|
|
5410
|
-
// `requestUpdate` needs to be called to update
|
|
5596
|
+
// `requestUpdate` needs to be called to update hasTriggerContent
|
|
5411
5597
|
if (changedProperties.size === 0 || changedProperties.has('isPopoverVisible')) {
|
|
5412
5598
|
this.handleTriggerContentSlotChange();
|
|
5413
5599
|
}
|
|
@@ -5468,6 +5654,24 @@ class AuroDropdown extends LitElement {
|
|
|
5468
5654
|
return inCustomSlot;
|
|
5469
5655
|
}
|
|
5470
5656
|
|
|
5657
|
+
/**
|
|
5658
|
+
* Function to support @focusin event.
|
|
5659
|
+
* @private
|
|
5660
|
+
* @return {void}
|
|
5661
|
+
*/
|
|
5662
|
+
handleFocusin() {
|
|
5663
|
+
this.hasFocus = true;
|
|
5664
|
+
}
|
|
5665
|
+
|
|
5666
|
+
/**
|
|
5667
|
+
* Function to support @focusout event.
|
|
5668
|
+
* @private
|
|
5669
|
+
* @return {void}
|
|
5670
|
+
*/
|
|
5671
|
+
handleFocusout() {
|
|
5672
|
+
this.hasFocus = false;
|
|
5673
|
+
}
|
|
5674
|
+
|
|
5471
5675
|
/**
|
|
5472
5676
|
* Determines if the element or any children are focusable.
|
|
5473
5677
|
* @private
|
|
@@ -5527,8 +5731,8 @@ class AuroDropdown extends LitElement {
|
|
|
5527
5731
|
}
|
|
5528
5732
|
|
|
5529
5733
|
/**
|
|
5530
|
-
* @private
|
|
5531
5734
|
* Creates and dispatches a duplicate focus event on the trigger element.
|
|
5735
|
+
* @private
|
|
5532
5736
|
* @param {Event} event - The original focus event.
|
|
5533
5737
|
*/
|
|
5534
5738
|
bindFocusEventToTrigger(event) {
|
|
@@ -5541,9 +5745,9 @@ class AuroDropdown extends LitElement {
|
|
|
5541
5745
|
}
|
|
5542
5746
|
|
|
5543
5747
|
/**
|
|
5544
|
-
* @private
|
|
5545
5748
|
* Sets up event listeners to deliver focus and blur events from nested Auro components within the trigger slot to trigger.
|
|
5546
5749
|
* This ensures that focus/blur events originating from within these components are propagated to the trigger element itself.
|
|
5750
|
+
* @private
|
|
5547
5751
|
*/
|
|
5548
5752
|
setupTriggerFocusEventBinding() {
|
|
5549
5753
|
if (!this.triggerContentSlot || this.triggerContentSlot.length === 0) {
|
|
@@ -5637,7 +5841,7 @@ class AuroDropdown extends LitElement {
|
|
|
5637
5841
|
// If there are children
|
|
5638
5842
|
if (triggerContentNodes) {
|
|
5639
5843
|
|
|
5640
|
-
// See if any of them are focusable
|
|
5844
|
+
// See if any of them are focusable elements
|
|
5641
5845
|
this.triggerContentFocusable = triggerContentNodes.some((node) => this.containsFocusableElement(node));
|
|
5642
5846
|
|
|
5643
5847
|
// If any of them are focusable elements
|
|
@@ -5723,8 +5927,75 @@ class AuroDropdown extends LitElement {
|
|
|
5723
5927
|
this.labeled = nodesArr.length > 0;
|
|
5724
5928
|
}
|
|
5725
5929
|
|
|
5726
|
-
|
|
5727
|
-
|
|
5930
|
+
/**
|
|
5931
|
+
* Returns HTML for the common portion of the layouts.
|
|
5932
|
+
* @private
|
|
5933
|
+
* @param {Object} helpTextClasses - Classes to apply to the help text container.
|
|
5934
|
+
* @returns {html} - Returns HTML.
|
|
5935
|
+
*/
|
|
5936
|
+
renderBasicHtml(helpTextClasses) {
|
|
5937
|
+
return html$1`
|
|
5938
|
+
<div>
|
|
5939
|
+
<div
|
|
5940
|
+
id="trigger"
|
|
5941
|
+
class="${classMap(this.commonWrapperClasses)}" part="wrapper"
|
|
5942
|
+
tabindex="${this.tabIndex}"
|
|
5943
|
+
?showBorder="${this.showTriggerBorders}"
|
|
5944
|
+
role="${ifDefined(this.triggerContentFocusable ? undefined : this.a11yRole)}"
|
|
5945
|
+
aria-expanded="${ifDefined(this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
|
|
5946
|
+
aria-controls="${ifDefined(this.triggerContentFocusable ? undefined : this.dropdownId)}"
|
|
5947
|
+
aria-labelledby="${ifDefined(this.triggerContentFocusable ? undefined : 'triggerLabel')}"
|
|
5948
|
+
@focusin="${this.handleFocusin}"
|
|
5949
|
+
@blur="${this.handleFocusOut}">
|
|
5950
|
+
<div class="triggerContentWrapper">
|
|
5951
|
+
<label class="label" id="triggerLabel" hasTrigger=${this.hasTriggerContent}>
|
|
5952
|
+
<slot name="label" @slotchange="${this.handleLabelSlotChange}"></slot>
|
|
5953
|
+
</label>
|
|
5954
|
+
<div class="triggerContent">
|
|
5955
|
+
<slot
|
|
5956
|
+
name="trigger"
|
|
5957
|
+
@slotchange="${this.handleTriggerContentSlotChange}"></slot>
|
|
5958
|
+
</div>
|
|
5959
|
+
</div>
|
|
5960
|
+
${this.chevron || this.common ? html$1`
|
|
5961
|
+
<div
|
|
5962
|
+
id="showStateIcon"
|
|
5963
|
+
part="chevron">
|
|
5964
|
+
<${this.iconTag}
|
|
5965
|
+
category="interface"
|
|
5966
|
+
name="chevron-down"
|
|
5967
|
+
?onDark="${this.onDark}"
|
|
5968
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
5969
|
+
>
|
|
5970
|
+
</${this.iconTag}>
|
|
5971
|
+
</div>
|
|
5972
|
+
` : undefined }
|
|
5973
|
+
</div>
|
|
5974
|
+
<div class="${classMap(helpTextClasses)}">
|
|
5975
|
+
<slot name="helpText"></slot>
|
|
5976
|
+
</div>
|
|
5977
|
+
<div class="slotContent">
|
|
5978
|
+
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
5979
|
+
</div>
|
|
5980
|
+
<div id="bibSizer" part="size"></div>
|
|
5981
|
+
<${this.dropdownBibTag}
|
|
5982
|
+
id="bib"
|
|
5983
|
+
?data-show="${this.isPopoverVisible}"
|
|
5984
|
+
?isfullscreen="${this.isBibFullscreen}"
|
|
5985
|
+
?common="${this.common}"
|
|
5986
|
+
?rounded="${this.common || this.rounded}"
|
|
5987
|
+
?inset="${this.common || this.inset}">
|
|
5988
|
+
</${this.dropdownBibTag}>
|
|
5989
|
+
</div>
|
|
5990
|
+
`;
|
|
5991
|
+
}
|
|
5992
|
+
|
|
5993
|
+
/**
|
|
5994
|
+
* Returns HTML for the classic layout. Does not support type="*".
|
|
5995
|
+
* @private
|
|
5996
|
+
* @returns {html} - Returns HTML for the classic layout.
|
|
5997
|
+
*/
|
|
5998
|
+
renderLayoutClassic() {
|
|
5728
5999
|
return html$1`
|
|
5729
6000
|
<div>
|
|
5730
6001
|
<div
|
|
@@ -5762,9 +6033,6 @@ class AuroDropdown extends LitElement {
|
|
|
5762
6033
|
</div>
|
|
5763
6034
|
` : undefined }
|
|
5764
6035
|
</div>
|
|
5765
|
-
<${this.helpTextTag} part="helpText" ?onDark=${this.onDark} ?error="${this.error}">
|
|
5766
|
-
<slot name="helpText"></slot>
|
|
5767
|
-
</${this.helpTextTag}>
|
|
5768
6036
|
<div class="slotContent">
|
|
5769
6037
|
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
5770
6038
|
</div>
|
|
@@ -5781,6 +6049,67 @@ class AuroDropdown extends LitElement {
|
|
|
5781
6049
|
</div>
|
|
5782
6050
|
`;
|
|
5783
6051
|
}
|
|
6052
|
+
|
|
6053
|
+
/**
|
|
6054
|
+
* Returns HTML for the snowflake layout. Does not support type="*".
|
|
6055
|
+
* @private
|
|
6056
|
+
* @returns {html} - Returns HTML for the snowflake layout.
|
|
6057
|
+
*/
|
|
6058
|
+
renderLayoutSnowflake() {
|
|
6059
|
+
const helpTextClasses = {
|
|
6060
|
+
'helpText': true,
|
|
6061
|
+
'leftIndent': true,
|
|
6062
|
+
'rightIndent': true
|
|
6063
|
+
};
|
|
6064
|
+
|
|
6065
|
+
return html$1`
|
|
6066
|
+
${this.renderBasicHtml(helpTextClasses)}
|
|
6067
|
+
`;
|
|
6068
|
+
}
|
|
6069
|
+
|
|
6070
|
+
/**
|
|
6071
|
+
* Returns HTML for the emphasized layout. Does not support type="*".
|
|
6072
|
+
* @private
|
|
6073
|
+
* @returns {html} - Returns HTML for the emphasized layout.
|
|
6074
|
+
*/
|
|
6075
|
+
renderLayoutEmphasized() {
|
|
6076
|
+
const helpTextClasses = {
|
|
6077
|
+
'helpText': true,
|
|
6078
|
+
'leftIndent': this.shape.toLowerCase().includes('pill') && !this.shape.toLowerCase().includes('right'),
|
|
6079
|
+
'rightIndent': this.shape.toLowerCase().includes('pill') && !this.shape.toLowerCase().includes('left')
|
|
6080
|
+
};
|
|
6081
|
+
|
|
6082
|
+
return html$1`
|
|
6083
|
+
${this.renderBasicHtml(helpTextClasses)}
|
|
6084
|
+
`;
|
|
6085
|
+
}
|
|
6086
|
+
|
|
6087
|
+
/**
|
|
6088
|
+
* Logic to determine the layout of the component.
|
|
6089
|
+
* @private
|
|
6090
|
+
* @param {string} [ForcedLayout] - Used to force a specific layout, pass in the layout name to use.
|
|
6091
|
+
* @returns {HTMLCollection} - Returns the HTML for the layout.
|
|
6092
|
+
*/
|
|
6093
|
+
renderLayout(ForcedLayout) {
|
|
6094
|
+
const layout = ForcedLayout || this.layout;
|
|
6095
|
+
|
|
6096
|
+
switch (layout) {
|
|
6097
|
+
case 'emphasized':
|
|
6098
|
+
return this.renderLayoutEmphasized();
|
|
6099
|
+
case 'emphasized-left':
|
|
6100
|
+
return this.renderLayoutEmphasized();
|
|
6101
|
+
case 'emphasized-right':
|
|
6102
|
+
return this.renderLayoutEmphasized();
|
|
6103
|
+
case 'snowflake':
|
|
6104
|
+
return this.renderLayoutSnowflake();
|
|
6105
|
+
case 'snowflake-left':
|
|
6106
|
+
return this.renderLayoutSnowflake();
|
|
6107
|
+
case 'snowflake-right':
|
|
6108
|
+
return this.renderLayoutSnowflake();
|
|
6109
|
+
default:
|
|
6110
|
+
return this.renderLayoutClassic();
|
|
6111
|
+
}
|
|
6112
|
+
}
|
|
5784
6113
|
}
|
|
5785
6114
|
|
|
5786
6115
|
var dropdownVersion = '3.0.0';
|
|
@@ -6053,7 +6382,7 @@ class BaseIcon extends AuroElement {
|
|
|
6053
6382
|
|
|
6054
6383
|
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)}`;
|
|
6055
6384
|
|
|
6056
|
-
var colorCss$2 = 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)}`;
|
|
6385
|
+
var colorCss$2 = 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)}`;
|
|
6057
6386
|
|
|
6058
6387
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
6059
6388
|
// See LICENSE in the project root for license information.
|
|
@@ -6222,7 +6551,7 @@ class AuroIcon extends BaseIcon {
|
|
|
6222
6551
|
}
|
|
6223
6552
|
}
|
|
6224
6553
|
|
|
6225
|
-
var iconVersion = '8.0.
|
|
6554
|
+
var iconVersion = '8.0.3';
|
|
6226
6555
|
|
|
6227
6556
|
var styleCss$3 = 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)}`;
|
|
6228
6557
|
|