@aurodesignsystem-dev/auro-formkit 0.0.0-pr788.2 → 0.0.0-pr788.4
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/index.js +11 -9
- package/components/bibtemplate/dist/registered.js +11 -9
- package/components/checkbox/demo/api.md +7 -6
- package/components/checkbox/demo/api.min.js +5 -8
- package/components/checkbox/demo/index.min.js +5 -8
- package/components/checkbox/dist/auro-checkbox.d.ts +3 -0
- package/components/checkbox/dist/index.js +5 -8
- package/components/checkbox/dist/registered.js +5 -8
- package/components/combobox/demo/api.min.js +160 -42
- package/components/combobox/demo/index.md +2 -4
- package/components/combobox/demo/index.min.js +160 -42
- package/components/combobox/dist/auro-combobox.d.ts +13 -2
- package/components/combobox/dist/index.js +150 -39
- package/components/combobox/dist/registered.js +150 -39
- package/components/counter/demo/api.min.js +26 -22
- package/components/counter/demo/index.min.js +26 -22
- package/components/counter/dist/index.js +26 -22
- package/components/counter/dist/registered.js +26 -22
- package/components/datepicker/demo/api.md +6 -3
- package/components/datepicker/demo/api.min.js +142 -56
- package/components/datepicker/demo/index.min.js +142 -56
- package/components/datepicker/dist/index.js +142 -56
- package/components/datepicker/dist/registered.js +142 -56
- package/components/dropdown/demo/api.min.js +3 -3
- package/components/dropdown/demo/index.min.js +3 -3
- package/components/dropdown/dist/index.js +3 -3
- package/components/dropdown/dist/registered.js +3 -3
- package/components/form/demo/api.md +1 -1
- package/components/form/demo/api.min.js +1 -1
- package/components/form/demo/index.min.js +1 -1
- package/components/form/dist/auro-form.d.ts +1 -1
- package/components/form/dist/index.js +1 -1
- package/components/form/dist/registered.js +1 -1
- package/components/input/demo/api.md +2 -5
- package/components/input/demo/api.min.js +90 -13
- package/components/input/demo/index.md +2 -2
- package/components/input/demo/index.min.js +90 -13
- package/components/input/dist/auro-input.d.ts +24 -0
- package/components/input/dist/base-input.d.ts +8 -2
- package/components/input/dist/index.js +90 -13
- package/components/input/dist/registered.js +90 -13
- package/components/menu/demo/api.min.js +10 -3
- package/components/menu/demo/index.min.js +10 -3
- package/components/menu/dist/index.js +10 -3
- package/components/menu/dist/registered.js +10 -3
- package/components/radio/demo/api.md +2 -0
- package/components/radio/demo/api.min.js +3 -1
- package/components/radio/demo/index.min.js +3 -1
- package/components/radio/dist/auro-radio.d.ts +2 -0
- package/components/radio/dist/index.js +3 -1
- package/components/radio/dist/registered.js +3 -1
- package/components/select/demo/api.md +1 -3
- package/components/select/demo/api.min.js +117 -54
- package/components/select/demo/index.min.js +117 -54
- package/components/select/dist/auro-select.d.ts +16 -5
- package/components/select/dist/index.js +107 -51
- package/components/select/dist/registered.js +107 -51
- package/package.json +4 -4
- package/components/input/dist/styles/default/input-css.d.ts +0 -2
- package/components/input/dist/styles/default/label-css.d.ts +0 -2
- package/components/input/dist/styles/input-css.d.ts +0 -2
|
@@ -99,7 +99,7 @@ let AuroElement$3 = class AuroElement extends LitElement {
|
|
|
99
99
|
}
|
|
100
100
|
};
|
|
101
101
|
|
|
102
|
-
var shapeSizeCss$1 = css`.wrapper{overflow:hidden}.shape-classic-xl,.shape-classic-lg,.shape-classic-md,.shape-classic-sm,.shape-classic-xs{min-height:
|
|
102
|
+
var shapeSizeCss$1 = css`.wrapper{overflow:hidden}.shape-classic-xl,.shape-classic-lg,.shape-classic-md,.shape-classic-sm,.shape-classic-xs{min-height:56px;max-height:56px;border-style:solid;border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}.shape-classic-xl.simple,.shape-classic-lg.simple,.shape-classic-md.simple,.shape-classic-sm.simple,.shape-classic-xs.simple{border-width:0px;min-height:58px;max-height:58px;background-color:unset;box-shadow:none}.shape-classic-xl.thin,.shape-classic-lg.thin,.shape-classic-md.thin,.shape-classic-sm.thin,.shape-classic-xs.thin{border-width:1px;min-height:56px;max-height:56px;background-color:unset}.shape-classic-xl.parentBorder,.shape-classic-lg.parentBorder,.shape-classic-md.parentBorder,.shape-classic-sm.parentBorder,.shape-classic-xs.parentBorder{border:0;box-shadow:unset;min-height:54px;max-height:54px}.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:0px;min-height:60px;max-height:60px;background-color:unset;box-shadow:none}.shape-snowflake-xl.thin,.shape-snowflake-lg.thin,.shape-snowflake-md.thin,.shape-snowflake-sm.thin,.shape-snowflake-xs.thin{border-width:1px;min-height:58px;max-height:58px;background-color:unset}.shape-snowflake-xl.parentBorder,.shape-snowflake-lg.parentBorder,.shape-snowflake-md.parentBorder,.shape-snowflake-sm.parentBorder,.shape-snowflake-xs.parentBorder{border:0;box-shadow:unset;min-height:56px;max-height:56px}.shape-box-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-box-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-box-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-box-lg{min-height:52px;max-height:52px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-box-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-box-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-box-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-box-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-box-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-box-sm{min-height:32px;max-height:32px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-sm.simple{border-width:0px;min-height:36px;max-height:36px;background-color:unset;box-shadow:none}.shape-box-sm.thin{border-width:1px;min-height:34px;max-height:34px;background-color:unset}.shape-box-sm.parentBorder{border:0;box-shadow:unset;min-height:32px;max-height:32px}.shape-box-xs{min-height:20px;max-height:20px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-xs.simple{border-width:0px;min-height:24px;max-height:24px;background-color:unset;box-shadow:none}.shape-box-xs.thin{border-width:1px;min-height:22px;max-height:22px;background-color:unset}.shape-box-xs.parentBorder{border:0;box-shadow:unset;min-height:20px;max-height:20px}.shape-rounded-lg{min-height:56px;max-height:56px;border-style:solid;border-width:2px;border-color:transparent;border-radius:6px}.shape-rounded-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-rounded-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-rounded-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-pill-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px}.shape-pill-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-left-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px 0 0 36px}.shape-pill-left-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-left-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-left-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-right-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 36px 36px 0}.shape-pill-right-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-right-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-right-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px}.shape-pill-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-pill-left-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px 0 0 36px}.shape-pill-left-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-left-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-left-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-pill-right-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 36px 36px 0}.shape-pill-right-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-right-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-right-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}`;
|
|
103
103
|
|
|
104
104
|
var tokensCss$5 = css`:host(:not([ondark])){--ds-auro-select-border-color: var(--ds-basic-color-border-bold, #585e67);--ds-auro-select-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-select-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-select-placeholder-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-select-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-select-error-icon-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-select-outline-color: transparent}:host([ondark]){--ds-auro-select-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-select-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-select-label-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-select-placeholder-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-select-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-select-error-icon-color: var(--ds-basic-color-status-error-subtle, #fbc6c6);--ds-auro-select-outline-color: transparent}`;
|
|
105
105
|
|
|
@@ -4144,15 +4144,15 @@ class AuroDropdownBib extends LitElement {
|
|
|
4144
4144
|
|
|
4145
4145
|
var dropdownVersion$1 = '3.0.0';
|
|
4146
4146
|
|
|
4147
|
-
var shapeSizeCss = css`.wrapper{overflow:hidden}.shape-classic-xl,.shape-classic-lg,.shape-classic-md,.shape-classic-sm,.shape-classic-xs{min-height:
|
|
4147
|
+
var shapeSizeCss = css`.wrapper{overflow:hidden}.shape-classic-xl,.shape-classic-lg,.shape-classic-md,.shape-classic-sm,.shape-classic-xs{min-height:56px;max-height:56px;border-style:solid;border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}.shape-classic-xl.simple,.shape-classic-lg.simple,.shape-classic-md.simple,.shape-classic-sm.simple,.shape-classic-xs.simple{border-width:0px;min-height:58px;max-height:58px;background-color:unset;box-shadow:none}.shape-classic-xl.thin,.shape-classic-lg.thin,.shape-classic-md.thin,.shape-classic-sm.thin,.shape-classic-xs.thin{border-width:1px;min-height:56px;max-height:56px;background-color:unset}.shape-classic-xl.parentBorder,.shape-classic-lg.parentBorder,.shape-classic-md.parentBorder,.shape-classic-sm.parentBorder,.shape-classic-xs.parentBorder{border:0;box-shadow:unset;min-height:54px;max-height:54px}.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:0px;min-height:60px;max-height:60px;background-color:unset;box-shadow:none}.shape-snowflake-xl.thin,.shape-snowflake-lg.thin,.shape-snowflake-md.thin,.shape-snowflake-sm.thin,.shape-snowflake-xs.thin{border-width:1px;min-height:58px;max-height:58px;background-color:unset}.shape-snowflake-xl.parentBorder,.shape-snowflake-lg.parentBorder,.shape-snowflake-md.parentBorder,.shape-snowflake-sm.parentBorder,.shape-snowflake-xs.parentBorder{border:0;box-shadow:unset;min-height:56px;max-height:56px}.shape-box-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-box-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-box-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-box-lg{min-height:52px;max-height:52px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-box-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-box-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-box-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-box-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-box-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-box-sm{min-height:32px;max-height:32px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-sm.simple{border-width:0px;min-height:36px;max-height:36px;background-color:unset;box-shadow:none}.shape-box-sm.thin{border-width:1px;min-height:34px;max-height:34px;background-color:unset}.shape-box-sm.parentBorder{border:0;box-shadow:unset;min-height:32px;max-height:32px}.shape-box-xs{min-height:20px;max-height:20px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-xs.simple{border-width:0px;min-height:24px;max-height:24px;background-color:unset;box-shadow:none}.shape-box-xs.thin{border-width:1px;min-height:22px;max-height:22px;background-color:unset}.shape-box-xs.parentBorder{border:0;box-shadow:unset;min-height:20px;max-height:20px}.shape-rounded-lg{min-height:56px;max-height:56px;border-style:solid;border-width:2px;border-color:transparent;border-radius:6px}.shape-rounded-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-rounded-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-rounded-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-pill-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px}.shape-pill-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-left-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px 0 0 36px}.shape-pill-left-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-left-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-left-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-right-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 36px 36px 0}.shape-pill-right-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-right-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-right-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px}.shape-pill-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-pill-left-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent;border-radius:36px 0 0 36px}.shape-pill-left-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-left-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-left-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-pill-right-md{min-height:44px;max-height:44px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 36px 36px 0}.shape-pill-right-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-right-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-right-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}`;
|
|
4148
4148
|
|
|
4149
4149
|
var colorCss$1$1 = css`:host(:not([layout*=classic])){--ds-auro-dropdown-trigger-border-color: transparent}:host(:not([ondark])) .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-within,:host(:not([ondark])) .wrapper:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused, #01426a)}:host(:not([onDark])[disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host(:not([ondark])[error]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]) .label{color:var(--ds-auro-dropdown-label-text-color)}:host([onDark]) .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([onDark]) .wrapper:focus-within,:host([onDark]) .wrapper:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse-disabled, rgba(255, 255, 255, 0.1))}:host([ondark][error]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-status-error-subtle, #fbc6c6)}`;
|
|
4150
4150
|
|
|
4151
|
-
var styleCss$1$2 = css`:host{display:block
|
|
4151
|
+
var styleCss$1$2 = css`:host{position:relative;display:block}:host([open]){z-index:var(--depth-tooltip, 400)}.wrapper{display:flex;flex:1;flex-direction:row;align-items:center;justify-content:center;outline:none}.triggerContentWrapper{display:flex;overflow:hidden;width:100%;flex:1;align-items:center;justify-content:center;text-overflow:ellipsis;white-space:nowrap}:host([matchwidth]) #bibSizer{width:100%}`;
|
|
4152
4152
|
|
|
4153
4153
|
var classicColorCss = css``;
|
|
4154
4154
|
|
|
4155
|
-
var classicLayoutCss = css`:host([layout*=classic]){position:relative;max-width:100%}:host([layout*=classic]) #bibSizer{position:absolute;z-index:-1;opacity:0;pointer-events:none}:host([layout*=classic])
|
|
4155
|
+
var classicLayoutCss = css`:host([layout*=classic]){position:relative;max-width:100%}:host([layout*=classic]) #bibSizer{position:absolute;z-index:-1;opacity:0;pointer-events:none}:host([layout*=classic]) label{transition:font-size .3s cubic-bezier(0.215, 0.61, 0.355, 1);white-space:normal}:host([layout*=classic]) .wrapper{display:flex;flex-direction:row;box-shadow:inset 0 0 0 1px var(--ds-auro-dropdown-trigger-outline-color)}@media(hover: hover){:host([layout*=classic]) .wrapper:hover{cursor:pointer}}:host([layout*=classic]) .triggerContentWrapper{overflow:hidden;flex:1;justify-content:start;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) #showStateIcon{display:flex;overflow:hidden;height:100%;align-items:center;padding-right:var(--ds-size-150, 0.75rem)}:host([layout*=classic]) #showStateIcon [auro-icon]{height:var(--ds-size-300, 1.5rem)}:host([layout*=classic]) #showStateIcon[data-expanded=true] [auro-icon]{transform:rotate(-180deg)}`;
|
|
4156
4156
|
|
|
4157
4157
|
var styleEmphasizedCss = css`.layout-emphasized .chevron,.layout-emphasized-left .chevron,.layout-emphasized-right .chevron{margin-right:var(--ds-size-300, 1.5rem)}:host([layout*=emphasized][shape*=pill]:not([layout*=right])) .leftIndent{width:calc(100% - var(--ds-size-300, 1.5rem));margin-left:var(--ds-size-300, 1.5rem)}:host([layout*=emphasized][shape*=pill]:not([layout*=left])) .rightIndent{width:calc(100% - var(--ds-size-300, 1.5rem));margin-right:var(--ds-size-300, 1.5rem)}:host([layout*=emphasized][shape*=pill]:not([layout*=left]):not([layout*=right])) .rightIndent{width:calc(100% - var(--ds-size-600, 3rem));margin-right:var(--ds-size-300, 1.5rem)}`;
|
|
4158
4158
|
|
|
@@ -5358,7 +5358,7 @@ var dropdownVersion = '3.0.0';
|
|
|
5358
5358
|
|
|
5359
5359
|
var colorCss$3 = css`#headerContainer{box-shadow:var(--ds-auro-dropdownbib-header-boxshadow-color)}#footerContainer{background-color:var(--ds-auro-dropdownbib-footer-container-color)}`;
|
|
5360
5360
|
|
|
5361
|
-
var styleCss$4 = css`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column
|
|
5361
|
+
var styleCss$4 = css`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column;padding:var(--ds-size-200, 1rem);padding-top:var(--ds-size-400, 2rem);padding-bottom:0}#headerContainer .titleRow{display:flex;flex-direction:row;justify-content:space-between;gap:var(--ds-size-100, 0.5rem)}#headerContainer .header{max-width:calc(100vw - var(--ds-size-900, 4.5rem));padding-top:var(--ds-size-200, 1rem)}#headerContainer .subheader{width:100%}#closeButton [auro-icon]{--ds-auro-icon-size: var(--ds-size-500, 2.5rem)}#bodyContainer{position:relative;overflow:auto;flex:1 1 100%}:host([isfullscreen]) #bibTemplate{max-height:100dvh}:host([isfullscreen]) #bodyContainer{margin-top:var(--ds-size-100, 0.5rem)}#footerContainer{position:absolute;right:0;bottom:0;left:0;padding:var(--ds-size-200, 1rem)}`;
|
|
5362
5362
|
|
|
5363
5363
|
var tokenCss = css`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-footer-container-color: var(--ds-basic-color-surface-default, #ffffff)}`;
|
|
5364
5364
|
|
|
@@ -7262,14 +7262,16 @@ class AuroBibtemplate extends LitElement {
|
|
|
7262
7262
|
<div id="bibTemplate" part="bibtemplate">
|
|
7263
7263
|
${this.isFullscreen ? html`
|
|
7264
7264
|
<div id="headerContainer">
|
|
7265
|
-
|
|
7266
|
-
|
|
7267
|
-
|
|
7268
|
-
|
|
7269
|
-
|
|
7270
|
-
|
|
7271
|
-
|
|
7272
|
-
|
|
7265
|
+
<div class="titleRow">
|
|
7266
|
+
<${this.headerTag} class="header" display="${this.large ? 'display' : '600'}" level="3" size="none" id="header" no-margin-block>
|
|
7267
|
+
<slot name="header"></slot>
|
|
7268
|
+
</${this.headerTag}>
|
|
7269
|
+
<${this.buttonTag} id="closeButton" variant="ghost" shape="circle" size="sm" @click="${this.onCloseButtonClick}">
|
|
7270
|
+
<span><slot name="ariaLabel.close">Close</slot></span>
|
|
7271
|
+
<${this.iconTag} aria-hidden="true" category="interface" name="x-lg"></${this.iconTag}>
|
|
7272
|
+
</${this.buttonTag}>
|
|
7273
|
+
</div>
|
|
7274
|
+
<span class="subheader">
|
|
7273
7275
|
<slot name="subheader"></slot>
|
|
7274
7276
|
</span>
|
|
7275
7277
|
</div>` : null}
|
|
@@ -7495,7 +7497,7 @@ class AuroHelpText extends LitElement {
|
|
|
7495
7497
|
|
|
7496
7498
|
var helpTextVersion = '1.0.0';
|
|
7497
7499
|
|
|
7498
|
-
var styleCss = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}[auro-dropdown]{--ds-auro-dropdown-trigger-border-color: var(--ds-auro-select-border-color);--ds-auro-dropdown-trigger-background-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-container-color: var(--ds-auro-select-background-color)}:host{display:inline-block}:host([layout*=emphasized]) [auro-dropdown],:host([layout*=snowflake]) [auro-dropdown]{--ds-auro-select-border-color: transparent}:host([layout*=emphasized]) .mainContent,:host([layout*=snowflake]) .mainContent{text-align:center}.mainContent{position:relative;display:flex;overflow:hidden;flex:1;flex-direction:column;align-items:center;justify-content:center}.valueContainer [slot=displayValue]{display:none}.accents{display:flex;flex-direction:row;align-items:center;justify-content:center}::slotted([slot=typeIcon]){margin-right:var(--ds-size-100, 0.5rem)}.displayValue{display:block}.displayValue:not(.force){display:none}.displayValue:not(.force).hasContent:is(.withValue):not(.hasFocus){display:block}.triggerContent{display:flex;width:100%;align-items:center;justify-content:center}:host([layout*=emphasized]) .triggerContent,:host([layout*=snowflake]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-300, 1.5rem)}:host([layout*=snowflake]) [auro-dropdown] label.withValue{font-size:var(--ds-text-body-size-xs);line-height:20px}:host([layout*=emphasized]) [auro-dropdown] label.withValue{font-size:var(--ds-text-body-size-xs);line-height:20px}:host([layout*=classic]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem)}:host([layout*=classic]) .mainContent{align-items:start}:host([layout*=classic]) label{overflow:hidden;cursor:text;font-size:16px;font-weight:450;letter-spacing:0;line-height:24px;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) label.withValue{font-size:12px;font-weight:450;letter-spacing:0;line-height:16px}:host([layout*=classic]) .value{height:auto;font-size:16px;font-weight:450;letter-spacing:0;line-height:24px}:host(:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-status-error-subtle, #fbc6c6);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}#slotHolder{display:none}:host([disabled]){pointer-events:none;user-select:none}:host([disabled]:not([ondark])) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host(:not([layout*=classic])[disabled][ondark]) [auro-dropdown]{--ds-auro-select-border-color: transparent}`;
|
|
7500
|
+
var styleCss = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.63)}.body-sm{font-size:var(--wcss-body-sm-font-size, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, 0.88)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}[auro-dropdown]{--ds-auro-dropdown-trigger-border-color: var(--ds-auro-select-border-color);--ds-auro-dropdown-trigger-background-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-container-color: var(--ds-auro-select-background-color)}:host{display:inline-block}:host([layout*=emphasized]) [auro-dropdown],:host([layout*=snowflake]) [auro-dropdown]{--ds-auro-select-border-color: transparent}:host([layout*=emphasized]) .mainContent,:host([layout*=snowflake]) .mainContent{text-align:center}.mainContent{position:relative;display:flex;overflow:hidden;flex:1;flex-direction:column;align-items:center;justify-content:center}.valueContainer [slot=displayValue]{display:none}.accents{display:flex;flex-direction:row;align-items:center;justify-content:center}::slotted([slot=typeIcon]){margin-right:var(--ds-size-100, 0.5rem)}.displayValue{display:block}.displayValue:not(.force){display:none}.displayValue:not(.force).hasContent:is(.withValue):not(.hasFocus){display:block}.triggerContent{display:flex;width:100%;align-items:center;justify-content:center}:host([layout*=emphasized]) .triggerContent,:host([layout*=snowflake]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-300, 1.5rem)}:host([layout*=classic]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem)}:host([layout*=classic]) .mainContent{align-items:start}:host([layout*=classic]) label{overflow:hidden;cursor:text;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) .value{height:auto}:host(:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-status-error-subtle, #fbc6c6);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}#slotHolder{display:none}:host([disabled]){pointer-events:none;user-select:none}:host([disabled]:not([ondark])) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host(:not([layout*=classic])[disabled][ondark]) [auro-dropdown]{--ds-auro-select-border-color: transparent}`;
|
|
7499
7501
|
|
|
7500
7502
|
// Copyright (c) 2021 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
7501
7503
|
// See LICENSE in the project root for license information.
|
|
@@ -7532,11 +7534,6 @@ class AuroSelect extends AuroElement$3 {
|
|
|
7532
7534
|
|
|
7533
7535
|
this.matchWidth = false;
|
|
7534
7536
|
|
|
7535
|
-
// Layout Config
|
|
7536
|
-
this.layout = 'snowflake';
|
|
7537
|
-
this.shape = 'snowflake';
|
|
7538
|
-
this.size = 'xl';
|
|
7539
|
-
|
|
7540
7537
|
// floaterConfig
|
|
7541
7538
|
this.placement = 'bottom-start';
|
|
7542
7539
|
this.offset = 0;
|
|
@@ -7545,10 +7542,6 @@ class AuroSelect extends AuroElement$3 {
|
|
|
7545
7542
|
|
|
7546
7543
|
this.forceDisplayValue = false;
|
|
7547
7544
|
|
|
7548
|
-
this.layout = 'classic';
|
|
7549
|
-
this.shape = 'classic';
|
|
7550
|
-
this.size = 'xl';
|
|
7551
|
-
|
|
7552
7545
|
/**
|
|
7553
7546
|
* @private
|
|
7554
7547
|
*/
|
|
@@ -7614,6 +7607,11 @@ class AuroSelect extends AuroElement$3 {
|
|
|
7614
7607
|
this.fullscreenBreakpoint = 'sm';
|
|
7615
7608
|
this.onDark = false;
|
|
7616
7609
|
this.isPopoverVisible = false;
|
|
7610
|
+
|
|
7611
|
+
// Layout Config
|
|
7612
|
+
this.layout = 'classic';
|
|
7613
|
+
this.shape = 'classic';
|
|
7614
|
+
this.size = 'lg';
|
|
7617
7615
|
}
|
|
7618
7616
|
|
|
7619
7617
|
// This function is to define props used within the scope of this component
|
|
@@ -7916,22 +7914,52 @@ class AuroSelect extends AuroElement$3 {
|
|
|
7916
7914
|
* @returns {void}
|
|
7917
7915
|
*/
|
|
7918
7916
|
get commonLabelClasses() {
|
|
7919
|
-
|
|
7917
|
+
const obj = {
|
|
7920
7918
|
'is-disabled': this.disabled,
|
|
7921
|
-
'withValue':
|
|
7922
|
-
'util_displayHiddenVisually': this.hasDisplayValueContent && !this.hasFocus && this.value && this.value.length > 0
|
|
7919
|
+
'withValue': false,
|
|
7920
|
+
'util_displayHiddenVisually': this.hasDisplayValueContent && !this.hasFocus && this.value && this.value.length > 0,
|
|
7921
|
+
[this.labelFontClass]: true
|
|
7923
7922
|
};
|
|
7923
|
+
|
|
7924
|
+
if (this.placeholder) {
|
|
7925
|
+
obj.withValue = true;
|
|
7926
|
+
} else if (this.optionSelected) {
|
|
7927
|
+
if (Array.isArray(this.optionSelected)) {
|
|
7928
|
+
obj.withValue = this.optionSelected.length > 0;
|
|
7929
|
+
} else {
|
|
7930
|
+
obj.withValue = true;
|
|
7931
|
+
}
|
|
7932
|
+
}
|
|
7933
|
+
return obj;
|
|
7924
7934
|
}
|
|
7925
7935
|
|
|
7926
7936
|
/**
|
|
7927
|
-
* Returns
|
|
7937
|
+
* Returns the label font class based on layout and selection state.
|
|
7928
7938
|
* @private
|
|
7929
|
-
* @returns {
|
|
7939
|
+
* @returns {string} - The font class for the label.
|
|
7930
7940
|
*/
|
|
7931
|
-
get
|
|
7932
|
-
|
|
7933
|
-
|
|
7934
|
-
|
|
7941
|
+
get labelFontClass() {
|
|
7942
|
+
const isSelected = this.hasValue;
|
|
7943
|
+
|
|
7944
|
+
if (this.layout.startsWith('emphasized')) {
|
|
7945
|
+
return isSelected ? 'body-sm' : 'accent-xl';
|
|
7946
|
+
}
|
|
7947
|
+
|
|
7948
|
+
if (this.layout === 'snowflake') {
|
|
7949
|
+
return isSelected ? 'body-xs' : 'body-lg';
|
|
7950
|
+
}
|
|
7951
|
+
|
|
7952
|
+
// classic layout (default)
|
|
7953
|
+
return isSelected ? 'body-xs' : 'body-default';
|
|
7954
|
+
}
|
|
7955
|
+
|
|
7956
|
+
/**
|
|
7957
|
+
* Whether or not the component has a value.
|
|
7958
|
+
* @returns {boolean} - Returns true if the component has a value or placeholder.
|
|
7959
|
+
* @private
|
|
7960
|
+
*/
|
|
7961
|
+
get hasValue() {
|
|
7962
|
+
return this.placeholder || (this.value && this.value.length > 0); // eslint-disable-line no-extra-parens
|
|
7935
7963
|
}
|
|
7936
7964
|
|
|
7937
7965
|
/**
|
|
@@ -7946,6 +7974,7 @@ class AuroSelect extends AuroElement$3 {
|
|
|
7946
7974
|
this.isPopoverVisible = this.dropdown.isPopoverVisible;
|
|
7947
7975
|
|
|
7948
7976
|
if (this.dropdown.isPopoverVisible) {
|
|
7977
|
+
this.updateMenuShapeSize();
|
|
7949
7978
|
// wait til the bib gets fully rendered
|
|
7950
7979
|
setTimeout(() => {
|
|
7951
7980
|
if (this.dropdown.isBibFullscreen) {
|
|
@@ -7961,6 +7990,10 @@ class AuroSelect extends AuroElement$3 {
|
|
|
7961
7990
|
}
|
|
7962
7991
|
});
|
|
7963
7992
|
|
|
7993
|
+
this.dropdown.addEventListener('auroDropdown-strategy-change', () => {
|
|
7994
|
+
this.updateMenuShapeSize();
|
|
7995
|
+
});
|
|
7996
|
+
|
|
7964
7997
|
// setting up bibtemplate
|
|
7965
7998
|
this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
|
|
7966
7999
|
|
|
@@ -8025,6 +8058,30 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8025
8058
|
this.dropdown.requestUpdate();
|
|
8026
8059
|
}
|
|
8027
8060
|
|
|
8061
|
+
/**
|
|
8062
|
+
* Update menu to default for fullscreen bib, otherwise to this.size and this.shape.
|
|
8063
|
+
* @private
|
|
8064
|
+
*/
|
|
8065
|
+
updateMenuShapeSize() {
|
|
8066
|
+
if (!this.menu) {
|
|
8067
|
+
return;
|
|
8068
|
+
}
|
|
8069
|
+
|
|
8070
|
+
if (this.dropdown && this.dropdown.isBibFullscreen) {
|
|
8071
|
+
this.menu.setAttribute('size', 'md');
|
|
8072
|
+
this.menu.setAttribute('shape', 'box');
|
|
8073
|
+
} else {
|
|
8074
|
+
// set menu's default size if there it's not specified.
|
|
8075
|
+
if (!this.menu.getAttribute('size')) {
|
|
8076
|
+
this.menu.setAttribute('size', this.layout !== 'emphasized' ? 'md' : this.size);
|
|
8077
|
+
}
|
|
8078
|
+
|
|
8079
|
+
if (!this.getAttribute('shape')) {
|
|
8080
|
+
this.menu.setAttribute('shape', this.layout === 'classic' ? 'box' : this.shape);
|
|
8081
|
+
}
|
|
8082
|
+
}
|
|
8083
|
+
}
|
|
8084
|
+
|
|
8028
8085
|
/**
|
|
8029
8086
|
* Binds all behavior needed to the menu after rendering.
|
|
8030
8087
|
* @private
|
|
@@ -8041,14 +8098,7 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8041
8098
|
return;
|
|
8042
8099
|
}
|
|
8043
8100
|
|
|
8044
|
-
|
|
8045
|
-
if (!this.menu.getAttribute('size')) {
|
|
8046
|
-
this.menu.setAttribute('size', this.layout !== 'emphasized' ? 'md' : this.size);
|
|
8047
|
-
}
|
|
8048
|
-
|
|
8049
|
-
if (!this.getAttribute('shape')) {
|
|
8050
|
-
this.menu.setAttribute('shape', this.layout === 'classic' ? 'box' : this.shape);
|
|
8051
|
-
}
|
|
8101
|
+
this.updateMenuShapeSize();
|
|
8052
8102
|
|
|
8053
8103
|
if (this.multiSelect) {
|
|
8054
8104
|
this.menu.multiSelect = this.multiSelect;
|
|
@@ -8087,7 +8137,7 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8087
8137
|
|
|
8088
8138
|
this.menu.addEventListener('auroMenu-selectValueReset', () => {
|
|
8089
8139
|
this.optionSelected = this.menu.optionSelected;
|
|
8090
|
-
this.
|
|
8140
|
+
this.validate(this);
|
|
8091
8141
|
});
|
|
8092
8142
|
|
|
8093
8143
|
this.menu.addEventListener('auroMenu-activatedOption', (evt) => {
|
|
@@ -8171,7 +8221,7 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8171
8221
|
this.addEventListener('focusin', this.handleFocusin);
|
|
8172
8222
|
|
|
8173
8223
|
this.addEventListener('blur', () => {
|
|
8174
|
-
this.
|
|
8224
|
+
this.validate();
|
|
8175
8225
|
this.hasFocus = false;
|
|
8176
8226
|
});
|
|
8177
8227
|
}
|
|
@@ -8360,7 +8410,11 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8360
8410
|
if (!this.menu) return;
|
|
8361
8411
|
|
|
8362
8412
|
this.menu.setAttribute('value', value);
|
|
8363
|
-
|
|
8413
|
+
if (value) {
|
|
8414
|
+
this.menu.value = value;
|
|
8415
|
+
} else {
|
|
8416
|
+
this.menu.reset();
|
|
8417
|
+
}
|
|
8364
8418
|
await this.menu.updateComplete;
|
|
8365
8419
|
}
|
|
8366
8420
|
|
|
@@ -8381,7 +8435,7 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8381
8435
|
}
|
|
8382
8436
|
|
|
8383
8437
|
this._updateNativeSelect();
|
|
8384
|
-
this.
|
|
8438
|
+
this.validate();
|
|
8385
8439
|
|
|
8386
8440
|
// LEGACY EVENT
|
|
8387
8441
|
this.dispatchEvent(new CustomEvent('auroSelect-valueSet', {
|
|
@@ -8578,7 +8632,7 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8578
8632
|
'displayValue': true,
|
|
8579
8633
|
'hasContent': this.hasDisplayValueContent,
|
|
8580
8634
|
'hasFocus': this.isPopoverVisible,
|
|
8581
|
-
'withValue': this.
|
|
8635
|
+
'withValue': this.commonLabelClasses.widthValue,
|
|
8582
8636
|
'force': this.forceDisplayValue,
|
|
8583
8637
|
};
|
|
8584
8638
|
|
|
@@ -8589,7 +8643,6 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8589
8643
|
|
|
8590
8644
|
return html`
|
|
8591
8645
|
<div
|
|
8592
|
-
class="${classMap(this.commonWrapperClasses)}"
|
|
8593
8646
|
part="wrapper">
|
|
8594
8647
|
<div id="slotHolder" aria-hidden="true">
|
|
8595
8648
|
<slot name="bib.fullscreen.headline" @slotchange="${this.handleSlotChange}"></slot>
|
|
@@ -8658,7 +8711,7 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8658
8711
|
'displayValue': true,
|
|
8659
8712
|
'hasContent': this.hasDisplayValueContent,
|
|
8660
8713
|
'hasFocus': this.isPopoverVisible,
|
|
8661
|
-
'withValue': this.
|
|
8714
|
+
'withValue': this.commonLabelClasses.widthValue,
|
|
8662
8715
|
'force': this.forceDisplayValue,
|
|
8663
8716
|
};
|
|
8664
8717
|
|
|
@@ -8669,7 +8722,6 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8669
8722
|
|
|
8670
8723
|
return html`
|
|
8671
8724
|
<div
|
|
8672
|
-
class="${classMap(this.commonWrapperClasses)}"
|
|
8673
8725
|
part="wrapper">
|
|
8674
8726
|
<div id="slotHolder" aria-hidden="true">
|
|
8675
8727
|
<slot name="bib.fullscreen.headline" @slotchange="${this.handleSlotChange}"></slot>
|
|
@@ -8738,7 +8790,7 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8738
8790
|
'displayValue': true,
|
|
8739
8791
|
'hasContent': this.hasDisplayValueContent,
|
|
8740
8792
|
'hasFocus': this.isPopoverVisible,
|
|
8741
|
-
'withValue': this.
|
|
8793
|
+
'withValue': this.commonLabelClasses.widthValue,
|
|
8742
8794
|
'force': this.forceDisplayValue,
|
|
8743
8795
|
};
|
|
8744
8796
|
|
|
@@ -8747,9 +8799,13 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8747
8799
|
'util_displayHiddenVisually': (this.forceDisplayValue || !(this.dropdown && this.dropdown.isPopoverVisible)) && this.hasDisplayValueContent
|
|
8748
8800
|
};
|
|
8749
8801
|
|
|
8802
|
+
const valueClasses = {
|
|
8803
|
+
'value': true,
|
|
8804
|
+
'body-default': true
|
|
8805
|
+
};
|
|
8806
|
+
|
|
8750
8807
|
return html`
|
|
8751
8808
|
<div
|
|
8752
|
-
class="${classMap(this.commonWrapperClasses)}"
|
|
8753
8809
|
part="wrapper">
|
|
8754
8810
|
<div id="slotHolder" aria-hidden="true">
|
|
8755
8811
|
<slot name="bib.fullscreen.headline" @slotchange="${this.handleSlotChange}"></slot>
|
|
@@ -8779,7 +8835,7 @@ class AuroSelect extends AuroElement$3 {
|
|
|
8779
8835
|
<slot name="label"></slot>
|
|
8780
8836
|
${this.required ? undefined : html`<slot name="optionalLabel"> (optional)</slot>`}
|
|
8781
8837
|
</label>
|
|
8782
|
-
<div class="
|
|
8838
|
+
<div class="${classMap(valueClasses)}" id="value"></div>
|
|
8783
8839
|
<div id="placeholder" class="${classMap(placeholderClass)}">
|
|
8784
8840
|
${this.placeholder}
|
|
8785
8841
|
</div>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@aurodesignsystem-dev/auro-formkit",
|
|
3
|
-
"version": "0.0.0-pr788.
|
|
3
|
+
"version": "0.0.0-pr788.4",
|
|
4
4
|
"description": "A collection of web components used to build forms.",
|
|
5
5
|
"homepage": "https://github.com/AlaskaAirlines/auro-formkit#readme",
|
|
6
6
|
"bugs": {
|
|
@@ -82,8 +82,8 @@
|
|
|
82
82
|
"concurrently": "^9.2.0",
|
|
83
83
|
"copyfiles": "^2.4.1",
|
|
84
84
|
"core-js": "^3.43.0",
|
|
85
|
-
"eslint": "^9.
|
|
86
|
-
"eslint-plugin-jsdoc": "^51.
|
|
85
|
+
"eslint": "^9.31.0",
|
|
86
|
+
"eslint-plugin-jsdoc": "^51.4.0",
|
|
87
87
|
"husky": "^9.1.7",
|
|
88
88
|
"lodash": "^4.17.21",
|
|
89
89
|
"markdown-magic": "^3.4.1",
|
|
@@ -94,7 +94,7 @@
|
|
|
94
94
|
"postcss-discard-comments": "^7.0.4",
|
|
95
95
|
"prettier": "^3.6.2",
|
|
96
96
|
"sass": "^1.89.2",
|
|
97
|
-
"semantic-release": "^24.2.
|
|
97
|
+
"semantic-release": "^24.2.7",
|
|
98
98
|
"stylelint": "^16.21.1",
|
|
99
99
|
"stylelint-config-idiomatic-order": "^10.0.0",
|
|
100
100
|
"stylelint-config-standard": "^38.0.0",
|