@aurodesignsystem-dev/auro-formkit 0.0.0-pr754.2 → 0.0.0-pr755.0
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 +1 -1
- package/components/bibtemplate/dist/registered.js +1 -1
- package/components/checkbox/demo/api.html +16 -10
- package/components/checkbox/demo/api.min.js +11 -11
- package/components/checkbox/demo/index.html +16 -10
- package/components/checkbox/demo/index.min.js +11 -11
- package/components/checkbox/demo/readme.html +16 -9
- package/components/checkbox/dist/index.js +11 -11
- package/components/checkbox/dist/registered.js +11 -11
- package/components/combobox/demo/api.html +16 -10
- package/components/combobox/demo/api.md +6 -12
- package/components/combobox/demo/api.min.js +95 -78
- package/components/combobox/demo/index.html +16 -10
- package/components/combobox/demo/index.min.js +95 -78
- package/components/combobox/demo/readme.html +16 -9
- package/components/combobox/dist/index.js +84 -42
- package/components/combobox/dist/registered.js +84 -42
- package/components/counter/demo/api.html +16 -10
- package/components/counter/demo/api.md +7 -140
- package/components/counter/demo/api.min.js +386 -556
- package/components/counter/demo/index.html +16 -10
- package/components/counter/demo/index.md +0 -82
- package/components/counter/demo/index.min.js +386 -556
- package/components/counter/demo/readme.html +16 -9
- package/components/counter/dist/auro-counter-group.d.ts +14 -71
- package/components/counter/dist/auro-counter.d.ts +0 -10
- package/components/counter/dist/index.js +386 -556
- package/components/counter/dist/registered.js +386 -556
- package/components/datepicker/demo/api.html +16 -10
- package/components/datepicker/demo/api.min.js +84 -42
- package/components/datepicker/demo/index.html +16 -10
- package/components/datepicker/demo/index.min.js +84 -42
- package/components/datepicker/demo/readme.html +16 -9
- package/components/datepicker/dist/index.js +84 -42
- package/components/datepicker/dist/registered.js +84 -42
- package/components/dropdown/demo/api.html +16 -10
- package/components/dropdown/demo/api.md +268 -76
- package/components/dropdown/demo/api.min.js +67 -25
- package/components/dropdown/demo/index.html +16 -10
- package/components/dropdown/demo/index.md +363 -45
- package/components/dropdown/demo/index.min.js +67 -25
- package/components/dropdown/demo/readme.html +16 -9
- package/components/dropdown/dist/auro-dropdown.d.ts +71 -21
- package/components/dropdown/dist/index.js +67 -25
- package/components/dropdown/dist/registered.js +67 -25
- package/components/form/demo/api.html +16 -9
- package/components/form/demo/autocomplete.html +19 -3
- package/components/form/demo/index.html +16 -9
- package/components/form/demo/readme.html +16 -9
- package/components/form/demo/working.html +19 -13
- package/components/helptext/dist/index.js +1 -1
- package/components/helptext/dist/registered.js +1 -1
- package/components/input/demo/api.html +16 -10
- package/components/input/demo/api.md +1 -1
- package/components/input/demo/api.min.js +10 -10
- package/components/input/demo/index.html +16 -10
- package/components/input/demo/index.min.js +10 -10
- package/components/input/demo/readme.html +16 -9
- package/components/input/dist/base-input.d.ts +1 -1
- package/components/input/dist/index.js +10 -10
- package/components/input/dist/registered.js +10 -10
- package/components/menu/demo/api.html +16 -32
- package/components/menu/demo/api.md +1 -1
- package/components/menu/demo/api.min.js +11 -36
- package/components/menu/demo/index.html +16 -10
- package/components/menu/demo/index.min.js +11 -36
- package/components/menu/demo/readme.html +16 -9
- package/components/menu/dist/auro-menu.d.ts +2 -13
- package/components/menu/dist/index.js +11 -36
- package/components/menu/dist/registered.js +11 -36
- package/components/radio/demo/api.html +16 -10
- package/components/radio/demo/api.min.js +9 -9
- package/components/radio/demo/index.html +16 -10
- package/components/radio/demo/index.min.js +9 -9
- package/components/radio/demo/readme.html +16 -9
- package/components/radio/dist/index.js +9 -9
- package/components/radio/dist/registered.js +9 -9
- package/components/select/demo/api.html +16 -10
- package/components/select/demo/api.md +9 -15
- package/components/select/demo/api.min.js +193 -124
- package/components/select/demo/index.html +16 -11
- package/components/select/demo/index.md +1 -1
- package/components/select/demo/index.min.js +193 -124
- package/components/select/demo/readme.html +16 -9
- package/components/select/dist/auro-select.d.ts +4 -20
- package/components/select/dist/index.js +182 -88
- package/components/select/dist/registered.js +182 -88
- package/package.json +3 -3
|
@@ -16,18 +16,24 @@
|
|
|
16
16
|
<head>
|
|
17
17
|
<meta charset="UTF-8" />
|
|
18
18
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
19
|
-
<title>Auro Web Component
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/auro-classic/CSSCustomProperties.css"
|
|
26
|
-
|
|
19
|
+
<title>Auro Web Component Demo | auro-datepicker</title>
|
|
20
|
+
|
|
21
|
+
<!-- Prism.js Stylesheet -->
|
|
22
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"/>
|
|
23
|
+
|
|
24
|
+
<!-- Legacy reference is still needed to support auro-datepicker's use of legacy token values at this time -->
|
|
25
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/legacy/auro-classic/CSSCustomProperties.css"/>
|
|
26
|
+
|
|
27
|
+
<!-- Design Token Alaska Theme -->
|
|
28
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/themes/alaska/CSSCustomProperties--alaska.min.css"/>
|
|
29
|
+
|
|
30
|
+
<!-- Webcore Stylesheet Alaska Theme -->
|
|
31
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/themes/alaska.global.min.css" />
|
|
32
|
+
|
|
33
|
+
<!-- Demo Specific Styles -->
|
|
27
34
|
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/demoWrapper.css" />
|
|
28
35
|
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/elementDemoStyles.css" />
|
|
29
|
-
|
|
30
|
-
</head>
|
|
36
|
+
</head>
|
|
31
37
|
<body class="auro-markdown">
|
|
32
38
|
<main></main>
|
|
33
39
|
|
|
@@ -830,19 +830,19 @@ let AuroFormValidation$1 = class AuroFormValidation {
|
|
|
830
830
|
{
|
|
831
831
|
check: (e) => e.value?.length > 0 && e.value?.length < e.minLength,
|
|
832
832
|
validity: 'tooShort',
|
|
833
|
-
message: e => e.
|
|
833
|
+
message: e => e.setCustomValidityTooShort || e.setCustomValidity || ''
|
|
834
834
|
},
|
|
835
835
|
{
|
|
836
836
|
check: (e) => e.value?.length > e.maxLength,
|
|
837
837
|
validity: 'tooLong',
|
|
838
|
-
message: e => e.
|
|
838
|
+
message: e => e.setCustomValidityTooLong || e.setCustomValidity || ''
|
|
839
839
|
}
|
|
840
840
|
],
|
|
841
841
|
pattern: [
|
|
842
842
|
{
|
|
843
843
|
check: (e) => e.pattern && !new RegExp(`^${e.pattern}$`, 'u').test(e.value),
|
|
844
844
|
validity: 'patternMismatch',
|
|
845
|
-
message: e => e.
|
|
845
|
+
message: e => e.setCustomValidityPatternMismatch || e.setCustomValidity || ''
|
|
846
846
|
}
|
|
847
847
|
]
|
|
848
848
|
},
|
|
@@ -1037,10 +1037,10 @@ let AuroFormValidation$1 = class AuroFormValidation {
|
|
|
1037
1037
|
if (!hasValue && elem.required && elem.touched) {
|
|
1038
1038
|
elem.validity = 'valueMissing';
|
|
1039
1039
|
elem.errorMessage = elem.setCustomValidityValueMissing || elem.setCustomValidity || '';
|
|
1040
|
-
} else if (
|
|
1040
|
+
} else if (this.runtimeUtils.elementMatch(elem, 'auro-input')) {
|
|
1041
1041
|
this.validateType(elem);
|
|
1042
1042
|
this.validateElementAttributes(elem);
|
|
1043
|
-
} else if (
|
|
1043
|
+
} else if (this.runtimeUtils.elementMatch(elem, 'auro-counter') || this.runtimeUtils.elementMatch(elem, 'auro-counter-group')) {
|
|
1044
1044
|
this.validateElementAttributes(elem);
|
|
1045
1045
|
}
|
|
1046
1046
|
}
|
|
@@ -13040,7 +13040,7 @@ class AuroBibtemplate extends i {
|
|
|
13040
13040
|
<div id="bibTemplate" part="bibtemplate">
|
|
13041
13041
|
${this.isFullscreen ? u$3`
|
|
13042
13042
|
<div id="headerContainer">
|
|
13043
|
-
<${this.buttonTag} id="closeButton"
|
|
13043
|
+
<${this.buttonTag} id="closeButton" variant="ghost" shape="circle" size="sm" @click="${this.onCloseButtonClick}">
|
|
13044
13044
|
<${this.iconTag} category="interface" name="x-lg"></${this.iconTag}>
|
|
13045
13045
|
</${this.buttonTag}>
|
|
13046
13046
|
<${this.headerTag} display="${this.large ? 'display' : '600'}" level="3" size="none" id="header" no-margin-block>
|
|
@@ -17556,7 +17556,7 @@ var dropdownVersion$1 = '3.0.0';
|
|
|
17556
17556
|
|
|
17557
17557
|
var shapeSizeCss$1 = i$2`.wrapper{overflow:hidden}.shape-classic-xl,.shape-classic-lg,.shape-classic-md,.shape-classic-sm,.shape-classic-xs{min-height:58px;max-height:58px;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:60px;max-height:60px;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:58px;max-height:58px;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:56px;max-height:56px}.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-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}`;
|
|
17558
17558
|
|
|
17559
|
-
var colorCss$1$2 = i$2`:host(:not([
|
|
17559
|
+
var colorCss$1$2 = i$2`: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)}`;
|
|
17560
17560
|
|
|
17561
17561
|
var classicColorCss$1 = i$2``;
|
|
17562
17562
|
|
|
@@ -17568,7 +17568,7 @@ var styleSnowflakeCss = i$2`:host{display:block}.wrapper{display:flex;flex:1;fle
|
|
|
17568
17568
|
|
|
17569
17569
|
var colorCss$5 = i$2`: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-basic-color-status-error-subtle, #fbc6c6)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
17570
17570
|
|
|
17571
|
-
var styleCss$6 = i$2
|
|
17571
|
+
var styleCss$6 = i$2`.helptext-wrapper{display:none;font-size:12px;font-weight:450;letter-spacing:0;line-height:16px}:host([large]) .helptext-wrapper{font-size:16px;font-weight:450;letter-spacing:0;line-height:24px}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
|
|
17572
17572
|
|
|
17573
17573
|
var tokensCss$6 = i$2`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
17574
17574
|
|
|
@@ -17873,8 +17873,10 @@ let AuroElement$4 = class AuroElement extends i {
|
|
|
17873
17873
|
// See LICENSE in the project root for license information.
|
|
17874
17874
|
|
|
17875
17875
|
|
|
17876
|
-
|
|
17876
|
+
/**
|
|
17877
|
+
* @attr { Boolean } disableEventShow - If declared, the dropdown will only show by calling the API .show() public method.
|
|
17877
17878
|
* @slot - Default slot for the popover content.
|
|
17879
|
+
* @slot label - Defines the content of the label.
|
|
17878
17880
|
* @slot helpText - Defines the content of the helpText.
|
|
17879
17881
|
* @slot trigger - Defines the content of the trigger.
|
|
17880
17882
|
* @csspart trigger - The trigger content container.
|
|
@@ -17893,22 +17895,18 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
17893
17895
|
this.matchWidth = false;
|
|
17894
17896
|
this.noHideOnThisFocusLoss = false;
|
|
17895
17897
|
|
|
17896
|
-
this.errorMessage =
|
|
17898
|
+
this.errorMessage = ''; // TODO - check with Doug if there is still more to do here
|
|
17897
17899
|
|
|
17898
17900
|
// Layout Config
|
|
17899
|
-
this.layout =
|
|
17900
|
-
this.shape =
|
|
17901
|
-
this.size =
|
|
17901
|
+
this.layout = 'classic';
|
|
17902
|
+
this.shape = 'classic';
|
|
17903
|
+
this.size = 'xl';
|
|
17902
17904
|
|
|
17903
17905
|
this.parentBorder = false;
|
|
17904
17906
|
|
|
17905
17907
|
this.privateDefaults();
|
|
17906
17908
|
}
|
|
17907
17909
|
|
|
17908
|
-
/**
|
|
17909
|
-
* @private
|
|
17910
|
-
* @returns {object} Class definition for the wrapper element.
|
|
17911
|
-
*/
|
|
17912
17910
|
get commonWrapperClasses() {
|
|
17913
17911
|
return {
|
|
17914
17912
|
'trigger': true,
|
|
@@ -17928,8 +17926,12 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
17928
17926
|
this.disabled = false;
|
|
17929
17927
|
this.disableFocusTrap = false;
|
|
17930
17928
|
this.error = false;
|
|
17929
|
+
this.inset = false;
|
|
17930
|
+
this.rounded = false;
|
|
17931
17931
|
this.tabIndex = 0;
|
|
17932
17932
|
this.noToggle = false;
|
|
17933
|
+
this.a11yAutocomplete = 'none';
|
|
17934
|
+
this.labeled = true;
|
|
17933
17935
|
this.a11yRole = 'button';
|
|
17934
17936
|
this.onDark = false;
|
|
17935
17937
|
this.showTriggerBorders = true;
|
|
@@ -18051,27 +18053,26 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
18051
18053
|
},
|
|
18052
18054
|
|
|
18053
18055
|
/**
|
|
18054
|
-
* If declared,
|
|
18055
|
-
* @default false
|
|
18056
|
+
* If declared, applies a border around the trigger slot.
|
|
18056
18057
|
*/
|
|
18057
|
-
|
|
18058
|
+
simple: {
|
|
18058
18059
|
type: Boolean,
|
|
18059
18060
|
reflect: true
|
|
18060
18061
|
},
|
|
18061
18062
|
|
|
18062
18063
|
/**
|
|
18063
|
-
* If declared,
|
|
18064
|
+
* If declared, the dropdown displays a chevron on the right.
|
|
18065
|
+
* @attr {Boolean} chevron
|
|
18064
18066
|
*/
|
|
18065
|
-
|
|
18067
|
+
chevron: {
|
|
18066
18068
|
type: Boolean,
|
|
18067
18069
|
reflect: true
|
|
18068
18070
|
},
|
|
18069
18071
|
|
|
18070
18072
|
/**
|
|
18071
|
-
* If declared, the dropdown
|
|
18072
|
-
* @attr {Boolean} chevron
|
|
18073
|
+
* If declared, the dropdown will be styled with the common theme.
|
|
18073
18074
|
*/
|
|
18074
|
-
|
|
18075
|
+
common: {
|
|
18075
18076
|
type: Boolean,
|
|
18076
18077
|
reflect: true
|
|
18077
18078
|
},
|
|
@@ -18085,7 +18086,7 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
18085
18086
|
},
|
|
18086
18087
|
|
|
18087
18088
|
/**
|
|
18088
|
-
* If
|
|
18089
|
+
* If declare, the focus trap inside of bib will be turned off.
|
|
18089
18090
|
*/
|
|
18090
18091
|
disableFocusTrap: {
|
|
18091
18092
|
type: Boolean,
|
|
@@ -18132,6 +18133,22 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
18132
18133
|
reflect: true
|
|
18133
18134
|
},
|
|
18134
18135
|
|
|
18136
|
+
/**
|
|
18137
|
+
* Makes the trigger to be full width of its parent container.
|
|
18138
|
+
*/
|
|
18139
|
+
fluid: {
|
|
18140
|
+
type: Boolean,
|
|
18141
|
+
reflect: true
|
|
18142
|
+
},
|
|
18143
|
+
|
|
18144
|
+
/**
|
|
18145
|
+
* If declared, will apply padding around trigger slot content.
|
|
18146
|
+
*/
|
|
18147
|
+
inset: {
|
|
18148
|
+
type: Boolean,
|
|
18149
|
+
reflect: true
|
|
18150
|
+
},
|
|
18151
|
+
|
|
18135
18152
|
/**
|
|
18136
18153
|
* If true, the dropdown bib is displayed.
|
|
18137
18154
|
*/
|
|
@@ -18175,6 +18192,15 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
18175
18192
|
reflect: true
|
|
18176
18193
|
},
|
|
18177
18194
|
|
|
18195
|
+
/**
|
|
18196
|
+
* Defines if there is a label preset.
|
|
18197
|
+
* @private
|
|
18198
|
+
*/
|
|
18199
|
+
labeled: {
|
|
18200
|
+
type: Boolean,
|
|
18201
|
+
reflect: true
|
|
18202
|
+
},
|
|
18203
|
+
|
|
18178
18204
|
/**
|
|
18179
18205
|
* Defines if the trigger should size based on the parent element providing the border UI.
|
|
18180
18206
|
* @private
|
|
@@ -18235,9 +18261,6 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
18235
18261
|
reflect: true
|
|
18236
18262
|
},
|
|
18237
18263
|
|
|
18238
|
-
/**
|
|
18239
|
-
* If declared, and a function is set, that function will execute when the slot content is updated.
|
|
18240
|
-
*/
|
|
18241
18264
|
onSlotChange: {
|
|
18242
18265
|
type: Function,
|
|
18243
18266
|
reflect: false
|
|
@@ -18252,6 +18275,14 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
18252
18275
|
reflect: true
|
|
18253
18276
|
},
|
|
18254
18277
|
|
|
18278
|
+
/**
|
|
18279
|
+
* If declared, will apply border-radius to trigger and default slots.
|
|
18280
|
+
*/
|
|
18281
|
+
rounded: {
|
|
18282
|
+
type: Boolean,
|
|
18283
|
+
reflect: true
|
|
18284
|
+
},
|
|
18285
|
+
|
|
18255
18286
|
/**
|
|
18256
18287
|
* @private
|
|
18257
18288
|
*/
|
|
@@ -18266,14 +18297,22 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
18266
18297
|
type: String || undefined,
|
|
18267
18298
|
attribute: false,
|
|
18268
18299
|
reflect: false
|
|
18300
|
+
},
|
|
18301
|
+
|
|
18302
|
+
/**
|
|
18303
|
+
* The value for the aria-autocomplete attribute of the trigger element.
|
|
18304
|
+
*/
|
|
18305
|
+
a11yAutocomplete: {
|
|
18306
|
+
type: String,
|
|
18307
|
+
attribute: false,
|
|
18269
18308
|
}
|
|
18270
18309
|
};
|
|
18271
18310
|
}
|
|
18272
18311
|
|
|
18273
18312
|
static get styles() {
|
|
18274
18313
|
return [
|
|
18275
|
-
tokensCss$1$2,
|
|
18276
18314
|
colorCss$1$2,
|
|
18315
|
+
tokensCss$1$2,
|
|
18277
18316
|
|
|
18278
18317
|
// default layout
|
|
18279
18318
|
classicColorCss$1,
|
|
@@ -18713,7 +18752,10 @@ class AuroDropdown extends AuroElement$4 {
|
|
|
18713
18752
|
id="bib"
|
|
18714
18753
|
shape="${this.shape}"
|
|
18715
18754
|
?data-show="${this.isPopoverVisible}"
|
|
18716
|
-
?isfullscreen="${this.isBibFullscreen}"
|
|
18755
|
+
?isfullscreen="${this.isBibFullscreen}"
|
|
18756
|
+
?common="${this.common}"
|
|
18757
|
+
?rounded="${this.common || this.rounded}"
|
|
18758
|
+
?inset="${this.common || this.inset}">
|
|
18717
18759
|
<div class="slotContent">
|
|
18718
18760
|
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
18719
18761
|
</div>
|
|
@@ -18821,11 +18863,11 @@ var styleCss$4 = i$2`.util_displayInline{display:inline}.util_displayInlineBlock
|
|
|
18821
18863
|
|
|
18822
18864
|
var styleDefaultCss = i$2`.layoutDefault .typeIcon,:host(:not([layout])) .typeIcon{display:flex;flex-direction:row;align-items:center}.layoutDefault .typeIcon [auro-icon],:host(:not([layout])) .typeIcon [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-100, 0.5rem)}.layoutDefault .notificationIcons,:host(:not([layout])) .notificationIcons{display:flex;flex-direction:row;padding-right:var(--ds-size-100, 0.5rem)}:host([class=layoutDefault][bordered]) .typeIcon,:host(:not([layout])[bordered]) .typeIcon{padding-left:var(--ds-size-100, 0.5rem)}:host([class=layoutDefault][bordered]) .notificationIcons,:host(:not([layout])[bordered]) .notificationIcons{align-items:center}:host([class=layoutDefault][bordered]) .notification:not(:first-of-type),:host(:not([layout])[bordered]) .notification:not(:first-of-type){margin-left:var(--ds-size-100, 0.5rem)}:host([class=layoutDefault][bordered]) .alertNotification,:host(:not([layout])[bordered]) .alertNotification{width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem))}:host([class=layoutDefault][bordered]) .passwordBtn,:host(:not([layout])[bordered]) .passwordBtn{width:calc(var(--ds-size-300, 1.5rem));height:calc(var(--ds-size-300, 1.5rem))}:host([class=layoutDefault][bordered]) .notificationBtn,:host(:not([layout])[bordered]) .notificationBtn{display:block;width:var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);padding:0;border:0;background:unset;cursor:pointer}:host([class=layoutDefault][bordered]) .notificationBtn [auro-icon],:host(:not([layout])[bordered]) .notificationBtn [auro-icon]{display:block;height:var(--ds-size-300, 1.5rem);--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([class=layoutDefault][bordered]) .notificationBtn [auro-icon][hidden],:host(:not([layout])[bordered]) .notificationBtn [auro-icon][hidden]{display:none}:host([class=layoutDefault]:not([bordered])) .typeIcon,:host([class=layoutDefault]:not([bordered])) .notificationIcons,:host(:not([layout]):not([bordered])) .typeIcon,:host(:not([layout]):not([bordered])) .notificationIcons{align-items:flex-end;padding-bottom:var(--ds-size-50, 0.25rem)}:host([class=layoutDefault]:not([bordered])) .clearBtn,:host(:not([layout]):not([bordered])) .clearBtn{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);overflow:hidden;width:0;opacity:0}.layoutDefault .wrapper:hover .clearBtn,.layoutDefault .wrapper:focus-within .clearBtn,:host(:not([layout])) .wrapper:hover .clearBtn,:host(:not([layout])) .wrapper:focus-within .clearBtn{width:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));opacity:1}:host([class=layoutDefault]:focus-within[type=password]) .notificationIcons[hasValue] .alertNotification,:host(:not([layout]):focus-within[type=password]) .notificationIcons[hasValue] .alertNotification{overflow:hidden;width:0;height:0;padding:0;margin:0;visibility:hidden}.layoutDefault input,:host(:not([layout])) input{border:unset}.layoutDefault .wrapper,:host(:not([layout])) .wrapper{position:relative;overflow:hidden;border-style:solid}:host([class=layoutDefault]:not([bordered],[borderless])) .wrapper,:host(:not([layout]):not([bordered],[borderless])) .wrapper{border-width:1px 0}:host([class=layoutDefault][bordered]) .wrapper,:host(:not([layout])[bordered]) .wrapper{border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}:host([class=layoutDefault]:not([borderless])) .wrapper:focus-within:before,:host(:not([layout]):not([borderless])) .wrapper:focus-within:before{position:absolute;display:block;border-bottom-width:1px;border-bottom-style:solid;content:"";inset:0;pointer-events:none}:host([class=layoutDefault][validity]:not([validity=valid])) .wrapper:before,:host(:not([layout])[validity]:not([validity=valid])) .wrapper:before{border-bottom:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.layoutDefault :host,:host(:not([layout])) :host{position:relative;display:block}.layoutDefault .wrapper,:host(:not([layout])) .wrapper{display:flex;flex-direction:row}.layoutDefault .main,:host(:not([layout])) .main{display:flex;flex-direction:row;position:relative;flex:1}`;
|
|
18823
18865
|
|
|
18824
|
-
var colorBaseCss = i$2`.wrapper{border-color:var(--ds-auro-input-border-color);background-color:var(--ds-auro-input-background-color);color:var(--ds-auro-input-text-color)}.wrapper label{color:var(--ds-auro-input-label-text-color)}.wrapper input{caret-color:var(--ds-auro-input-caret-color);color:var(--ds-auro-input-text-color)}.wrapper input::placeholder{color:var(--ds-auro-input-placeholder-text-color)}.wrapper input:focus::placeholder{color:var(--ds-auro-input-placeholder-text-color)}.wrapper .displayValue{background-color:var(--ds-auro-input-background-color)}:host(:not([ondark])) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-basic-color-border-brand, #00274a)}:host([ondark]) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-basic-color-border-inverse, #ffffff)}:host(:is([validity]:not([validity=valid]))) .wrapper{--ds-auro-input-border-color: var(--ds-basic-color-status-error, #e31f26)}:host([ondark]:is([validity]:not([validity=valid]))) .wrapper{--ds-auro-input-border-color: var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([ondark])[disabled]){--ds-auro-input-border-color: var(--ds-
|
|
18866
|
+
var colorBaseCss = i$2`.wrapper{border-color:var(--ds-auro-input-border-color);background-color:var(--ds-auro-input-background-color);color:var(--ds-auro-input-text-color)}.wrapper label{color:var(--ds-auro-input-label-text-color)}.wrapper input{caret-color:var(--ds-auro-input-caret-color);color:var(--ds-auro-input-text-color)}.wrapper input::placeholder{color:var(--ds-auro-input-placeholder-text-color)}.wrapper input:focus::placeholder{color:var(--ds-auro-input-placeholder-text-color)}.wrapper .displayValue{background-color:var(--ds-auro-input-background-color)}:host(:not([ondark])) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-basic-color-border-brand, #00274a)}:host([ondark]) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-basic-color-border-inverse, #ffffff)}:host(:is([validity]:not([validity=valid]))) .wrapper{--ds-auro-input-border-color: var(--ds-basic-color-status-error, #e31f26)}:host([ondark]:is([validity]:not([validity=valid]))) .wrapper{--ds-auro-input-border-color: var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([ondark])[disabled]){--ds-auro-input-border-color: var(--ds-advanced-color-button-primary-border-disabled, #acc9e2);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host([ondark][disabled]){--ds-auro-input-border-color: var(--ds-advanced-color-button-primary-border-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}`;
|
|
18825
18867
|
|
|
18826
18868
|
var tokensCss$4 = i$2`:host(:not([ondark])){--ds-auro-input-border-color: var(--ds-basic-color-border-bold, #585e67);--ds-auro-input-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-input-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-input-caret-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-input-placeholder-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-input-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-input-error-icon-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-input-outline-color: transparent}:host([ondark]){--ds-auro-input-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-input-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-input-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-input-caret-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-input-placeholder-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-input-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-input-error-icon-color: var(--ds-basic-color-status-error-subtle, #fbc6c6);--ds-auro-input-outline-color: transparent}`;
|
|
18827
18869
|
|
|
18828
|
-
var classicStyleCss = i$2`.layout-classic{display:flex;flex-direction:row;box-shadow:inset 0 0 0 1px var(--ds-auro-input-outline-color)}.layout-classic .mainContent{position:relative;display:flex;flex:1;flex-direction:column;justify-content:center;cursor:text}.layout-classic .mainContent label{cursor:text;font-size:var(--ds-text-body-size-xs);line-height:20px;transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1)}.layout-classic .mainContent input{height:auto;font-size:var(--ds-basic-text-body-default-font-size, 16px);line-height:var(--ds-basic-text-body-default-line-height, 24px);transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1)}.layout-classic .mainContent:has(input.util_displayHiddenVisually) label{padding-top:0;font-size:var(--ds-text-body-size-default, 1rem);justify-self:flex-start;line-height:var(--ds-text-body-size-default)}.layout-classic .mainContent:has(input.util_displayHiddenVisually) input{height:0;padding-bottom:0;line-height:0}.layout-classic .accents
|
|
18870
|
+
var classicStyleCss = i$2`.layout-classic{display:flex;flex-direction:row;box-shadow:inset 0 0 0 1px var(--ds-auro-input-outline-color)}.layout-classic .mainContent{position:relative;display:flex;flex:1;flex-direction:column;justify-content:center;cursor:text}.layout-classic .mainContent label{cursor:text;font-size:var(--ds-text-body-size-xs);line-height:20px;transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1)}.layout-classic .mainContent input{height:auto;font-size:var(--ds-basic-text-body-default-font-size, 16px);line-height:var(--ds-basic-text-body-default-line-height, 24px);transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1)}.layout-classic .mainContent:has(input.util_displayHiddenVisually) label{padding-top:0;font-size:var(--ds-text-body-size-default, 1rem);justify-self:flex-start;line-height:var(--ds-text-body-size-default)}.layout-classic .mainContent:has(input.util_displayHiddenVisually) input{height:0;padding-bottom:0;line-height:0}.layout-classic .accents{padding:0 8px}.layout-classic.withValue{justify-content:flex-start}.layout-classic:focus-within{justify-content:flex-start}.layout-classic:focus-within .alertNotification{display:none}`;
|
|
18829
18871
|
|
|
18830
18872
|
var classicColorCss = i$2`.layout-classic label{color:var(--ds-auro-input-label-text-color)}.layout-classic:focus-within{--ds-auro-input-outline-color: var(--ds-auro-input-border-color)}:host(:not([ondark])) .layout-classic:focus-within{--ds-auro-input-border-color: var(--ds-basic-color-border-brand, #00274a);--ds-auro-input-outline-color: var(--ds-basic-color-border-brand, #00274a)}:host([ondark]) .layout-classic:focus-within{--ds-auro-input-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-input-outline-color: var(--ds-basic-color-border-inverse, #ffffff)}:host([layout*=classic]:not([ondark]):is([validity]:not([validity=valid]))){--ds-auro-input-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-input-outline-color: var(--ds-basic-color-status-error, #e31f26)}:host([layout*=classic]:not([ondark]):is([validity]:not([validity=valid]))) .layout-classic:focus-within{--ds-auro-input-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-input-outline-color: var(--ds-basic-color-status-error, #e31f26)}:host([layout*=classic][ondark]:is([validity]:not([validity=valid]))){--ds-auro-input-border-color: var(--ds-basic-color-status-error-subtle, #fbc6c6);--ds-auro-input-outline-color: var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host([layout*=classic][ondark]:is([validity]:not([validity=valid]))) .layout-classic:focus-within{--ds-auro-input-border-color: var(--ds-basic-color-status-error-subtle, #fbc6c6);--ds-auro-input-outline-color: var(--ds-basic-color-status-error-subtle, #fbc6c6)}`;
|
|
18831
18873
|
|
|
@@ -23348,19 +23390,19 @@ class AuroFormValidation {
|
|
|
23348
23390
|
{
|
|
23349
23391
|
check: (e) => e.value?.length > 0 && e.value?.length < e.minLength,
|
|
23350
23392
|
validity: 'tooShort',
|
|
23351
|
-
message: e => e.
|
|
23393
|
+
message: e => e.setCustomValidityTooShort || e.setCustomValidity || ''
|
|
23352
23394
|
},
|
|
23353
23395
|
{
|
|
23354
23396
|
check: (e) => e.value?.length > e.maxLength,
|
|
23355
23397
|
validity: 'tooLong',
|
|
23356
|
-
message: e => e.
|
|
23398
|
+
message: e => e.setCustomValidityTooLong || e.setCustomValidity || ''
|
|
23357
23399
|
}
|
|
23358
23400
|
],
|
|
23359
23401
|
pattern: [
|
|
23360
23402
|
{
|
|
23361
23403
|
check: (e) => e.pattern && !new RegExp(`^${e.pattern}$`, 'u').test(e.value),
|
|
23362
23404
|
validity: 'patternMismatch',
|
|
23363
|
-
message: e => e.
|
|
23405
|
+
message: e => e.setCustomValidityPatternMismatch || e.setCustomValidity || ''
|
|
23364
23406
|
}
|
|
23365
23407
|
]
|
|
23366
23408
|
},
|
|
@@ -23555,10 +23597,10 @@ class AuroFormValidation {
|
|
|
23555
23597
|
if (!hasValue && elem.required && elem.touched) {
|
|
23556
23598
|
elem.validity = 'valueMissing';
|
|
23557
23599
|
elem.errorMessage = elem.setCustomValidityValueMissing || elem.setCustomValidity || '';
|
|
23558
|
-
} else if (
|
|
23600
|
+
} else if (this.runtimeUtils.elementMatch(elem, 'auro-input')) {
|
|
23559
23601
|
this.validateType(elem);
|
|
23560
23602
|
this.validateElementAttributes(elem);
|
|
23561
|
-
} else if (
|
|
23603
|
+
} else if (this.runtimeUtils.elementMatch(elem, 'auro-counter') || this.runtimeUtils.elementMatch(elem, 'auro-counter-group')) {
|
|
23562
23604
|
this.validateElementAttributes(elem);
|
|
23563
23605
|
}
|
|
23564
23606
|
}
|
|
@@ -24040,7 +24082,7 @@ class BaseInput extends AuroElement$2 {
|
|
|
24040
24082
|
},
|
|
24041
24083
|
|
|
24042
24084
|
/**
|
|
24043
|
-
* Define custom placeholder text.
|
|
24085
|
+
* Define custom placeholder text, only supported by date input formats.
|
|
24044
24086
|
*/
|
|
24045
24087
|
placeholder: {
|
|
24046
24088
|
type: String,
|
|
@@ -26300,7 +26342,7 @@ var buttonVersion = '11.0.0';
|
|
|
26300
26342
|
|
|
26301
26343
|
var colorCss$4 = i$2`: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-basic-color-status-error-subtle, #fbc6c6)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
26302
26344
|
|
|
26303
|
-
var styleCss$5 = i$2
|
|
26345
|
+
var styleCss$5 = i$2`.helptext-wrapper{display:none;font-size:12px;font-weight:450;letter-spacing:0;line-height:16px}:host([large]) .helptext-wrapper{font-size:16px;font-weight:450;letter-spacing:0;line-height:24px}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
|
|
26304
26346
|
|
|
26305
26347
|
var tokensCss$5 = i$2`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
26306
26348
|
|
|
@@ -26577,7 +26619,7 @@ class AuroInput extends BaseInput {
|
|
|
26577
26619
|
*/
|
|
26578
26620
|
get commonInputClasses() {
|
|
26579
26621
|
return {
|
|
26580
|
-
'util_displayHiddenVisually':
|
|
26622
|
+
'util_displayHiddenVisually': this.hasDisplayValueContent && !this.hasFocus && this.value && this.value.length > 0
|
|
26581
26623
|
};
|
|
26582
26624
|
}
|
|
26583
26625
|
|
|
@@ -27026,7 +27068,7 @@ var inputVersion = '4.2.0';
|
|
|
27026
27068
|
|
|
27027
27069
|
var colorCss$1 = i$2`: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-basic-color-status-error-subtle, #fbc6c6)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
27028
27070
|
|
|
27029
|
-
var styleCss$1 = i$2
|
|
27071
|
+
var styleCss$1 = i$2`.helptext-wrapper{display:none;font-size:12px;font-weight:450;letter-spacing:0;line-height:16px}:host([large]) .helptext-wrapper{font-size:16px;font-weight:450;letter-spacing:0;line-height:24px}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
|
|
27030
27072
|
|
|
27031
27073
|
var tokensCss$1 = i$2`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
27032
27074
|
|
|
@@ -16,18 +16,24 @@
|
|
|
16
16
|
<head>
|
|
17
17
|
<meta charset="UTF-8" />
|
|
18
18
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
19
|
-
<title>Auro Web Component
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/auro-classic/CSSCustomProperties.css"
|
|
26
|
-
|
|
19
|
+
<title>Auro Web Component Demo | auro-datepicker</title>
|
|
20
|
+
|
|
21
|
+
<!-- Prism.js Stylesheet -->
|
|
22
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"/>
|
|
23
|
+
|
|
24
|
+
<!-- Legacy reference is still needed to support auro-datepicker's use of legacy token values at this time -->
|
|
25
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/legacy/auro-classic/CSSCustomProperties.css"/>
|
|
26
|
+
|
|
27
|
+
<!-- Design Token Alaska Theme -->
|
|
28
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/themes/alaska/CSSCustomProperties--alaska.min.css"/>
|
|
29
|
+
|
|
30
|
+
<!-- Webcore Stylesheet Alaska Theme -->
|
|
31
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/themes/alaska.global.min.css" />
|
|
32
|
+
|
|
33
|
+
<!-- Demo Specific Styles -->
|
|
27
34
|
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/demoWrapper.css" />
|
|
28
35
|
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/elementDemoStyles.css" />
|
|
29
|
-
|
|
30
|
-
</head>
|
|
36
|
+
</head>
|
|
31
37
|
<body class="auro-markdown">
|
|
32
38
|
<main></main>
|
|
33
39
|
|