@aurodesignsystem-dev/auro-formkit 0.0.0-pr754.0 → 0.0.0-pr754.2
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.min.js +9 -9
- package/components/checkbox/demo/index.min.js +9 -9
- package/components/checkbox/dist/index.js +9 -9
- package/components/checkbox/dist/registered.js +9 -9
- package/components/combobox/demo/api.md +12 -6
- package/components/combobox/demo/api.min.js +43 -84
- package/components/combobox/demo/index.min.js +43 -84
- package/components/combobox/dist/index.js +42 -84
- package/components/combobox/dist/registered.js +42 -84
- package/components/counter/demo/api.md +140 -7
- package/components/counter/demo/api.min.js +555 -385
- package/components/counter/demo/index.md +82 -0
- package/components/counter/demo/index.min.js +555 -385
- package/components/counter/dist/auro-counter-group.d.ts +71 -14
- package/components/counter/dist/auro-counter.d.ts +10 -0
- package/components/counter/dist/index.js +555 -385
- package/components/counter/dist/registered.js +555 -385
- package/components/datepicker/demo/api.min.js +42 -84
- package/components/datepicker/demo/index.min.js +42 -84
- package/components/datepicker/dist/index.js +42 -84
- package/components/datepicker/dist/registered.js +42 -84
- package/components/dropdown/demo/api.md +76 -268
- package/components/dropdown/demo/api.min.js +25 -67
- package/components/dropdown/demo/index.md +45 -363
- package/components/dropdown/demo/index.min.js +25 -67
- package/components/dropdown/dist/auro-dropdown.d.ts +21 -71
- package/components/dropdown/dist/index.js +25 -67
- package/components/dropdown/dist/registered.js +25 -67
- package/components/helptext/dist/index.js +1 -1
- package/components/helptext/dist/registered.js +1 -1
- package/components/input/demo/api.md +1 -1
- package/components/input/demo/api.min.js +10 -10
- package/components/input/demo/index.min.js +10 -10
- 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.md +14 -15
- package/components/menu/demo/api.min.js +1 -0
- package/components/menu/demo/index.min.js +1 -0
- package/components/menu/dist/auro-menu.d.ts +2 -1
- package/components/menu/dist/index.js +1 -0
- package/components/menu/dist/registered.js +1 -0
- package/components/radio/demo/api.min.js +9 -9
- package/components/radio/demo/index.min.js +9 -9
- package/components/radio/dist/index.js +9 -9
- package/components/radio/dist/registered.js +9 -9
- package/components/select/demo/api.md +41 -36
- package/components/select/demo/api.min.js +60 -102
- package/components/select/demo/index.md +1 -1
- package/components/select/demo/index.min.js +60 -102
- package/components/select/dist/auro-select.d.ts +9 -2
- package/components/select/dist/index.js +59 -102
- package/components/select/dist/registered.js +59 -102
- package/package.json +2 -2
|
@@ -3187,7 +3187,7 @@ var dropdownVersion = '3.0.0';
|
|
|
3187
3187
|
|
|
3188
3188
|
var shapeSizeCss = 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}`;
|
|
3189
3189
|
|
|
3190
|
-
var colorCss$1 = 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)}`;
|
|
3190
|
+
var colorCss$1 = i$2`: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)}`;
|
|
3191
3191
|
|
|
3192
3192
|
var classicColorCss = i$2``;
|
|
3193
3193
|
|
|
@@ -3199,7 +3199,7 @@ var styleSnowflakeCss = i$2`:host{display:block}.wrapper{display:flex;flex:1;fle
|
|
|
3199
3199
|
|
|
3200
3200
|
var colorCss = 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)}`;
|
|
3201
3201
|
|
|
3202
|
-
var styleCss = i$2
|
|
3202
|
+
var styleCss = i$2`:host{position:relative;display:block}.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}`;
|
|
3203
3203
|
|
|
3204
3204
|
var tokensCss = i$2`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
3205
3205
|
|
|
@@ -3504,10 +3504,8 @@ class AuroElement extends i {
|
|
|
3504
3504
|
// See LICENSE in the project root for license information.
|
|
3505
3505
|
|
|
3506
3506
|
|
|
3507
|
-
|
|
3508
|
-
* @attr { Boolean } disableEventShow - If declared, the dropdown will only show by calling the API .show() public method.
|
|
3507
|
+
/*
|
|
3509
3508
|
* @slot - Default slot for the popover content.
|
|
3510
|
-
* @slot label - Defines the content of the label.
|
|
3511
3509
|
* @slot helpText - Defines the content of the helpText.
|
|
3512
3510
|
* @slot trigger - Defines the content of the trigger.
|
|
3513
3511
|
* @csspart trigger - The trigger content container.
|
|
@@ -3526,18 +3524,22 @@ class AuroDropdown extends AuroElement {
|
|
|
3526
3524
|
this.matchWidth = false;
|
|
3527
3525
|
this.noHideOnThisFocusLoss = false;
|
|
3528
3526
|
|
|
3529
|
-
this.errorMessage =
|
|
3527
|
+
this.errorMessage = undefined; // TODO - check with Doug if there is still more to do here
|
|
3530
3528
|
|
|
3531
3529
|
// Layout Config
|
|
3532
|
-
this.layout =
|
|
3533
|
-
this.shape =
|
|
3534
|
-
this.size =
|
|
3530
|
+
this.layout = undefined;
|
|
3531
|
+
this.shape = undefined;
|
|
3532
|
+
this.size = undefined;
|
|
3535
3533
|
|
|
3536
3534
|
this.parentBorder = false;
|
|
3537
3535
|
|
|
3538
3536
|
this.privateDefaults();
|
|
3539
3537
|
}
|
|
3540
3538
|
|
|
3539
|
+
/**
|
|
3540
|
+
* @private
|
|
3541
|
+
* @returns {object} Class definition for the wrapper element.
|
|
3542
|
+
*/
|
|
3541
3543
|
get commonWrapperClasses() {
|
|
3542
3544
|
return {
|
|
3543
3545
|
'trigger': true,
|
|
@@ -3557,12 +3559,8 @@ class AuroDropdown extends AuroElement {
|
|
|
3557
3559
|
this.disabled = false;
|
|
3558
3560
|
this.disableFocusTrap = false;
|
|
3559
3561
|
this.error = false;
|
|
3560
|
-
this.inset = false;
|
|
3561
|
-
this.rounded = false;
|
|
3562
3562
|
this.tabIndex = 0;
|
|
3563
3563
|
this.noToggle = false;
|
|
3564
|
-
this.a11yAutocomplete = 'none';
|
|
3565
|
-
this.labeled = true;
|
|
3566
3564
|
this.a11yRole = 'button';
|
|
3567
3565
|
this.onDark = false;
|
|
3568
3566
|
this.showTriggerBorders = true;
|
|
@@ -3684,26 +3682,27 @@ class AuroDropdown extends AuroElement {
|
|
|
3684
3682
|
},
|
|
3685
3683
|
|
|
3686
3684
|
/**
|
|
3687
|
-
* If declared,
|
|
3685
|
+
* If declared, the dropdown will only show by calling the API .show() public method.
|
|
3686
|
+
* @default false
|
|
3688
3687
|
*/
|
|
3689
|
-
|
|
3688
|
+
disableEventShow: {
|
|
3690
3689
|
type: Boolean,
|
|
3691
3690
|
reflect: true
|
|
3692
3691
|
},
|
|
3693
3692
|
|
|
3694
3693
|
/**
|
|
3695
|
-
* If declared,
|
|
3696
|
-
* @attr {Boolean} chevron
|
|
3694
|
+
* If declared, applies a border around the trigger slot.
|
|
3697
3695
|
*/
|
|
3698
|
-
|
|
3696
|
+
simple: {
|
|
3699
3697
|
type: Boolean,
|
|
3700
3698
|
reflect: true
|
|
3701
3699
|
},
|
|
3702
3700
|
|
|
3703
3701
|
/**
|
|
3704
|
-
* If declared, the dropdown
|
|
3702
|
+
* If declared, the dropdown displays a chevron on the right.
|
|
3703
|
+
* @attr {Boolean} chevron
|
|
3705
3704
|
*/
|
|
3706
|
-
|
|
3705
|
+
chevron: {
|
|
3707
3706
|
type: Boolean,
|
|
3708
3707
|
reflect: true
|
|
3709
3708
|
},
|
|
@@ -3717,7 +3716,7 @@ class AuroDropdown extends AuroElement {
|
|
|
3717
3716
|
},
|
|
3718
3717
|
|
|
3719
3718
|
/**
|
|
3720
|
-
* If
|
|
3719
|
+
* If declared, the focus trap inside of bib will be turned off.
|
|
3721
3720
|
*/
|
|
3722
3721
|
disableFocusTrap: {
|
|
3723
3722
|
type: Boolean,
|
|
@@ -3764,22 +3763,6 @@ class AuroDropdown extends AuroElement {
|
|
|
3764
3763
|
reflect: true
|
|
3765
3764
|
},
|
|
3766
3765
|
|
|
3767
|
-
/**
|
|
3768
|
-
* Makes the trigger to be full width of its parent container.
|
|
3769
|
-
*/
|
|
3770
|
-
fluid: {
|
|
3771
|
-
type: Boolean,
|
|
3772
|
-
reflect: true
|
|
3773
|
-
},
|
|
3774
|
-
|
|
3775
|
-
/**
|
|
3776
|
-
* If declared, will apply padding around trigger slot content.
|
|
3777
|
-
*/
|
|
3778
|
-
inset: {
|
|
3779
|
-
type: Boolean,
|
|
3780
|
-
reflect: true
|
|
3781
|
-
},
|
|
3782
|
-
|
|
3783
3766
|
/**
|
|
3784
3767
|
* If true, the dropdown bib is displayed.
|
|
3785
3768
|
*/
|
|
@@ -3823,15 +3806,6 @@ class AuroDropdown extends AuroElement {
|
|
|
3823
3806
|
reflect: true
|
|
3824
3807
|
},
|
|
3825
3808
|
|
|
3826
|
-
/**
|
|
3827
|
-
* Defines if there is a label preset.
|
|
3828
|
-
* @private
|
|
3829
|
-
*/
|
|
3830
|
-
labeled: {
|
|
3831
|
-
type: Boolean,
|
|
3832
|
-
reflect: true
|
|
3833
|
-
},
|
|
3834
|
-
|
|
3835
3809
|
/**
|
|
3836
3810
|
* Defines if the trigger should size based on the parent element providing the border UI.
|
|
3837
3811
|
* @private
|
|
@@ -3892,6 +3866,9 @@ class AuroDropdown extends AuroElement {
|
|
|
3892
3866
|
reflect: true
|
|
3893
3867
|
},
|
|
3894
3868
|
|
|
3869
|
+
/**
|
|
3870
|
+
* If declared, and a function is set, that function will execute when the slot content is updated.
|
|
3871
|
+
*/
|
|
3895
3872
|
onSlotChange: {
|
|
3896
3873
|
type: Function,
|
|
3897
3874
|
reflect: false
|
|
@@ -3906,14 +3883,6 @@ class AuroDropdown extends AuroElement {
|
|
|
3906
3883
|
reflect: true
|
|
3907
3884
|
},
|
|
3908
3885
|
|
|
3909
|
-
/**
|
|
3910
|
-
* If declared, will apply border-radius to trigger and default slots.
|
|
3911
|
-
*/
|
|
3912
|
-
rounded: {
|
|
3913
|
-
type: Boolean,
|
|
3914
|
-
reflect: true
|
|
3915
|
-
},
|
|
3916
|
-
|
|
3917
3886
|
/**
|
|
3918
3887
|
* @private
|
|
3919
3888
|
*/
|
|
@@ -3928,22 +3897,14 @@ class AuroDropdown extends AuroElement {
|
|
|
3928
3897
|
type: String || undefined,
|
|
3929
3898
|
attribute: false,
|
|
3930
3899
|
reflect: false
|
|
3931
|
-
},
|
|
3932
|
-
|
|
3933
|
-
/**
|
|
3934
|
-
* The value for the aria-autocomplete attribute of the trigger element.
|
|
3935
|
-
*/
|
|
3936
|
-
a11yAutocomplete: {
|
|
3937
|
-
type: String,
|
|
3938
|
-
attribute: false,
|
|
3939
3900
|
}
|
|
3940
3901
|
};
|
|
3941
3902
|
}
|
|
3942
3903
|
|
|
3943
3904
|
static get styles() {
|
|
3944
3905
|
return [
|
|
3945
|
-
colorCss$1,
|
|
3946
3906
|
tokensCss$1,
|
|
3907
|
+
colorCss$1,
|
|
3947
3908
|
|
|
3948
3909
|
// default layout
|
|
3949
3910
|
classicColorCss,
|
|
@@ -4383,10 +4344,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4383
4344
|
id="bib"
|
|
4384
4345
|
shape="${this.shape}"
|
|
4385
4346
|
?data-show="${this.isPopoverVisible}"
|
|
4386
|
-
?isfullscreen="${this.isBibFullscreen}"
|
|
4387
|
-
?common="${this.common}"
|
|
4388
|
-
?rounded="${this.common || this.rounded}"
|
|
4389
|
-
?inset="${this.common || this.inset}">
|
|
4347
|
+
?isfullscreen="${this.isBibFullscreen}">
|
|
4390
4348
|
<div class="slotContent">
|
|
4391
4349
|
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
4392
4350
|
</div>
|
|
@@ -1,16 +1,3 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @attr { Boolean } disableEventShow - If declared, the dropdown will only show by calling the API .show() public method.
|
|
3
|
-
* @slot - Default slot for the popover content.
|
|
4
|
-
* @slot label - Defines the content of the label.
|
|
5
|
-
* @slot helpText - Defines the content of the helpText.
|
|
6
|
-
* @slot trigger - Defines the content of the trigger.
|
|
7
|
-
* @csspart trigger - The trigger content container.
|
|
8
|
-
* @csspart chevron - The collapsed/expanded state icon container.
|
|
9
|
-
* @csspart helpText - The helpText content container.
|
|
10
|
-
* @event auroDropdown-triggerClick - Notifies that the trigger has been clicked.
|
|
11
|
-
* @event auroDropdown-toggled - Notifies that the visibility of the dropdown bib has changed.
|
|
12
|
-
* @event auroDropdown-idAdded - Notifies consumers that the unique ID for the dropdown bib has been generated.
|
|
13
|
-
*/
|
|
14
1
|
export class AuroDropdown extends AuroElement {
|
|
15
2
|
static get properties(): {
|
|
16
3
|
/**
|
|
@@ -22,24 +9,25 @@ export class AuroDropdown extends AuroElement {
|
|
|
22
9
|
reflect: boolean;
|
|
23
10
|
};
|
|
24
11
|
/**
|
|
25
|
-
* If declared,
|
|
12
|
+
* If declared, the dropdown will only show by calling the API .show() public method.
|
|
13
|
+
* @default false
|
|
26
14
|
*/
|
|
27
|
-
|
|
15
|
+
disableEventShow: {
|
|
28
16
|
type: BooleanConstructor;
|
|
29
17
|
reflect: boolean;
|
|
30
18
|
};
|
|
31
19
|
/**
|
|
32
|
-
* If declared,
|
|
33
|
-
* @attr {Boolean} chevron
|
|
20
|
+
* If declared, applies a border around the trigger slot.
|
|
34
21
|
*/
|
|
35
|
-
|
|
22
|
+
simple: {
|
|
36
23
|
type: BooleanConstructor;
|
|
37
24
|
reflect: boolean;
|
|
38
25
|
};
|
|
39
26
|
/**
|
|
40
|
-
* If declared, the dropdown
|
|
27
|
+
* If declared, the dropdown displays a chevron on the right.
|
|
28
|
+
* @attr {Boolean} chevron
|
|
41
29
|
*/
|
|
42
|
-
|
|
30
|
+
chevron: {
|
|
43
31
|
type: BooleanConstructor;
|
|
44
32
|
reflect: boolean;
|
|
45
33
|
};
|
|
@@ -51,7 +39,7 @@ export class AuroDropdown extends AuroElement {
|
|
|
51
39
|
reflect: boolean;
|
|
52
40
|
};
|
|
53
41
|
/**
|
|
54
|
-
* If
|
|
42
|
+
* If declared, the focus trap inside of bib will be turned off.
|
|
55
43
|
*/
|
|
56
44
|
disableFocusTrap: {
|
|
57
45
|
type: BooleanConstructor;
|
|
@@ -92,20 +80,6 @@ export class AuroDropdown extends AuroElement {
|
|
|
92
80
|
type: BooleanConstructor;
|
|
93
81
|
reflect: boolean;
|
|
94
82
|
};
|
|
95
|
-
/**
|
|
96
|
-
* Makes the trigger to be full width of its parent container.
|
|
97
|
-
*/
|
|
98
|
-
fluid: {
|
|
99
|
-
type: BooleanConstructor;
|
|
100
|
-
reflect: boolean;
|
|
101
|
-
};
|
|
102
|
-
/**
|
|
103
|
-
* If declared, will apply padding around trigger slot content.
|
|
104
|
-
*/
|
|
105
|
-
inset: {
|
|
106
|
-
type: BooleanConstructor;
|
|
107
|
-
reflect: boolean;
|
|
108
|
-
};
|
|
109
83
|
/**
|
|
110
84
|
* If true, the dropdown bib is displayed.
|
|
111
85
|
*/
|
|
@@ -144,14 +118,6 @@ export class AuroDropdown extends AuroElement {
|
|
|
144
118
|
type: StringConstructor;
|
|
145
119
|
reflect: boolean;
|
|
146
120
|
};
|
|
147
|
-
/**
|
|
148
|
-
* Defines if there is a label preset.
|
|
149
|
-
* @private
|
|
150
|
-
*/
|
|
151
|
-
labeled: {
|
|
152
|
-
type: BooleanConstructor;
|
|
153
|
-
reflect: boolean;
|
|
154
|
-
};
|
|
155
121
|
/**
|
|
156
122
|
* Defines if the trigger should size based on the parent element providing the border UI.
|
|
157
123
|
* @private
|
|
@@ -205,6 +171,9 @@ export class AuroDropdown extends AuroElement {
|
|
|
205
171
|
type: BooleanConstructor;
|
|
206
172
|
reflect: boolean;
|
|
207
173
|
};
|
|
174
|
+
/**
|
|
175
|
+
* If declared, and a function is set, that function will execute when the slot content is updated.
|
|
176
|
+
*/
|
|
208
177
|
onSlotChange: {
|
|
209
178
|
type: FunctionConstructor;
|
|
210
179
|
reflect: boolean;
|
|
@@ -217,13 +186,6 @@ export class AuroDropdown extends AuroElement {
|
|
|
217
186
|
type: StringConstructor;
|
|
218
187
|
reflect: boolean;
|
|
219
188
|
};
|
|
220
|
-
/**
|
|
221
|
-
* If declared, will apply border-radius to trigger and default slots.
|
|
222
|
-
*/
|
|
223
|
-
rounded: {
|
|
224
|
-
type: BooleanConstructor;
|
|
225
|
-
reflect: boolean;
|
|
226
|
-
};
|
|
227
189
|
/**
|
|
228
190
|
* @private
|
|
229
191
|
*/
|
|
@@ -238,13 +200,6 @@ export class AuroDropdown extends AuroElement {
|
|
|
238
200
|
attribute: boolean;
|
|
239
201
|
reflect: boolean;
|
|
240
202
|
};
|
|
241
|
-
/**
|
|
242
|
-
* The value for the aria-autocomplete attribute of the trigger element.
|
|
243
|
-
*/
|
|
244
|
-
a11yAutocomplete: {
|
|
245
|
-
type: StringConstructor;
|
|
246
|
-
attribute: boolean;
|
|
247
|
-
};
|
|
248
203
|
};
|
|
249
204
|
static get styles(): import("lit").CSSResult[];
|
|
250
205
|
/**
|
|
@@ -260,17 +215,16 @@ export class AuroDropdown extends AuroElement {
|
|
|
260
215
|
isBibFullscreen: boolean;
|
|
261
216
|
matchWidth: boolean;
|
|
262
217
|
noHideOnThisFocusLoss: boolean;
|
|
263
|
-
errorMessage:
|
|
264
|
-
|
|
265
|
-
|
|
218
|
+
errorMessage: any;
|
|
219
|
+
layout: any;
|
|
220
|
+
shape: any;
|
|
221
|
+
size: any;
|
|
266
222
|
parentBorder: boolean;
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
parentBorder: boolean;
|
|
273
|
-
};
|
|
223
|
+
/**
|
|
224
|
+
* @private
|
|
225
|
+
* @returns {object} Class definition for the wrapper element.
|
|
226
|
+
*/
|
|
227
|
+
private get commonWrapperClasses();
|
|
274
228
|
/**
|
|
275
229
|
* @private
|
|
276
230
|
* @returns {void} Internal defaults.
|
|
@@ -280,11 +234,7 @@ export class AuroDropdown extends AuroElement {
|
|
|
280
234
|
disabled: boolean;
|
|
281
235
|
disableFocusTrap: boolean;
|
|
282
236
|
error: boolean;
|
|
283
|
-
inset: boolean;
|
|
284
|
-
rounded: boolean;
|
|
285
237
|
noToggle: boolean;
|
|
286
|
-
a11yAutocomplete: string;
|
|
287
|
-
labeled: boolean;
|
|
288
238
|
a11yRole: string;
|
|
289
239
|
onDark: boolean;
|
|
290
240
|
showTriggerBorders: boolean;
|
|
@@ -3140,7 +3140,7 @@ var dropdownVersion = '3.0.0';
|
|
|
3140
3140
|
|
|
3141
3141
|
var shapeSizeCss = css`.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}`;
|
|
3142
3142
|
|
|
3143
|
-
var colorCss$1 = css`: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)}`;
|
|
3143
|
+
var colorCss$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)}`;
|
|
3144
3144
|
|
|
3145
3145
|
var classicColorCss = css``;
|
|
3146
3146
|
|
|
@@ -3152,7 +3152,7 @@ var styleSnowflakeCss = css`:host{display:block}.wrapper{display:flex;flex:1;fle
|
|
|
3152
3152
|
|
|
3153
3153
|
var colorCss = css`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error-subtle, #fbc6c6)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
3154
3154
|
|
|
3155
|
-
var styleCss = css
|
|
3155
|
+
var styleCss = css`:host{position:relative;display:block}.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}`;
|
|
3156
3156
|
|
|
3157
3157
|
var tokensCss = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
3158
3158
|
|
|
@@ -3457,10 +3457,8 @@ class AuroElement extends LitElement {
|
|
|
3457
3457
|
// See LICENSE in the project root for license information.
|
|
3458
3458
|
|
|
3459
3459
|
|
|
3460
|
-
|
|
3461
|
-
* @attr { Boolean } disableEventShow - If declared, the dropdown will only show by calling the API .show() public method.
|
|
3460
|
+
/*
|
|
3462
3461
|
* @slot - Default slot for the popover content.
|
|
3463
|
-
* @slot label - Defines the content of the label.
|
|
3464
3462
|
* @slot helpText - Defines the content of the helpText.
|
|
3465
3463
|
* @slot trigger - Defines the content of the trigger.
|
|
3466
3464
|
* @csspart trigger - The trigger content container.
|
|
@@ -3479,18 +3477,22 @@ class AuroDropdown extends AuroElement {
|
|
|
3479
3477
|
this.matchWidth = false;
|
|
3480
3478
|
this.noHideOnThisFocusLoss = false;
|
|
3481
3479
|
|
|
3482
|
-
this.errorMessage =
|
|
3480
|
+
this.errorMessage = undefined; // TODO - check with Doug if there is still more to do here
|
|
3483
3481
|
|
|
3484
3482
|
// Layout Config
|
|
3485
|
-
this.layout =
|
|
3486
|
-
this.shape =
|
|
3487
|
-
this.size =
|
|
3483
|
+
this.layout = undefined;
|
|
3484
|
+
this.shape = undefined;
|
|
3485
|
+
this.size = undefined;
|
|
3488
3486
|
|
|
3489
3487
|
this.parentBorder = false;
|
|
3490
3488
|
|
|
3491
3489
|
this.privateDefaults();
|
|
3492
3490
|
}
|
|
3493
3491
|
|
|
3492
|
+
/**
|
|
3493
|
+
* @private
|
|
3494
|
+
* @returns {object} Class definition for the wrapper element.
|
|
3495
|
+
*/
|
|
3494
3496
|
get commonWrapperClasses() {
|
|
3495
3497
|
return {
|
|
3496
3498
|
'trigger': true,
|
|
@@ -3510,12 +3512,8 @@ class AuroDropdown extends AuroElement {
|
|
|
3510
3512
|
this.disabled = false;
|
|
3511
3513
|
this.disableFocusTrap = false;
|
|
3512
3514
|
this.error = false;
|
|
3513
|
-
this.inset = false;
|
|
3514
|
-
this.rounded = false;
|
|
3515
3515
|
this.tabIndex = 0;
|
|
3516
3516
|
this.noToggle = false;
|
|
3517
|
-
this.a11yAutocomplete = 'none';
|
|
3518
|
-
this.labeled = true;
|
|
3519
3517
|
this.a11yRole = 'button';
|
|
3520
3518
|
this.onDark = false;
|
|
3521
3519
|
this.showTriggerBorders = true;
|
|
@@ -3637,26 +3635,27 @@ class AuroDropdown extends AuroElement {
|
|
|
3637
3635
|
},
|
|
3638
3636
|
|
|
3639
3637
|
/**
|
|
3640
|
-
* If declared,
|
|
3638
|
+
* If declared, the dropdown will only show by calling the API .show() public method.
|
|
3639
|
+
* @default false
|
|
3641
3640
|
*/
|
|
3642
|
-
|
|
3641
|
+
disableEventShow: {
|
|
3643
3642
|
type: Boolean,
|
|
3644
3643
|
reflect: true
|
|
3645
3644
|
},
|
|
3646
3645
|
|
|
3647
3646
|
/**
|
|
3648
|
-
* If declared,
|
|
3649
|
-
* @attr {Boolean} chevron
|
|
3647
|
+
* If declared, applies a border around the trigger slot.
|
|
3650
3648
|
*/
|
|
3651
|
-
|
|
3649
|
+
simple: {
|
|
3652
3650
|
type: Boolean,
|
|
3653
3651
|
reflect: true
|
|
3654
3652
|
},
|
|
3655
3653
|
|
|
3656
3654
|
/**
|
|
3657
|
-
* If declared, the dropdown
|
|
3655
|
+
* If declared, the dropdown displays a chevron on the right.
|
|
3656
|
+
* @attr {Boolean} chevron
|
|
3658
3657
|
*/
|
|
3659
|
-
|
|
3658
|
+
chevron: {
|
|
3660
3659
|
type: Boolean,
|
|
3661
3660
|
reflect: true
|
|
3662
3661
|
},
|
|
@@ -3670,7 +3669,7 @@ class AuroDropdown extends AuroElement {
|
|
|
3670
3669
|
},
|
|
3671
3670
|
|
|
3672
3671
|
/**
|
|
3673
|
-
* If
|
|
3672
|
+
* If declared, the focus trap inside of bib will be turned off.
|
|
3674
3673
|
*/
|
|
3675
3674
|
disableFocusTrap: {
|
|
3676
3675
|
type: Boolean,
|
|
@@ -3717,22 +3716,6 @@ class AuroDropdown extends AuroElement {
|
|
|
3717
3716
|
reflect: true
|
|
3718
3717
|
},
|
|
3719
3718
|
|
|
3720
|
-
/**
|
|
3721
|
-
* Makes the trigger to be full width of its parent container.
|
|
3722
|
-
*/
|
|
3723
|
-
fluid: {
|
|
3724
|
-
type: Boolean,
|
|
3725
|
-
reflect: true
|
|
3726
|
-
},
|
|
3727
|
-
|
|
3728
|
-
/**
|
|
3729
|
-
* If declared, will apply padding around trigger slot content.
|
|
3730
|
-
*/
|
|
3731
|
-
inset: {
|
|
3732
|
-
type: Boolean,
|
|
3733
|
-
reflect: true
|
|
3734
|
-
},
|
|
3735
|
-
|
|
3736
3719
|
/**
|
|
3737
3720
|
* If true, the dropdown bib is displayed.
|
|
3738
3721
|
*/
|
|
@@ -3776,15 +3759,6 @@ class AuroDropdown extends AuroElement {
|
|
|
3776
3759
|
reflect: true
|
|
3777
3760
|
},
|
|
3778
3761
|
|
|
3779
|
-
/**
|
|
3780
|
-
* Defines if there is a label preset.
|
|
3781
|
-
* @private
|
|
3782
|
-
*/
|
|
3783
|
-
labeled: {
|
|
3784
|
-
type: Boolean,
|
|
3785
|
-
reflect: true
|
|
3786
|
-
},
|
|
3787
|
-
|
|
3788
3762
|
/**
|
|
3789
3763
|
* Defines if the trigger should size based on the parent element providing the border UI.
|
|
3790
3764
|
* @private
|
|
@@ -3845,6 +3819,9 @@ class AuroDropdown extends AuroElement {
|
|
|
3845
3819
|
reflect: true
|
|
3846
3820
|
},
|
|
3847
3821
|
|
|
3822
|
+
/**
|
|
3823
|
+
* If declared, and a function is set, that function will execute when the slot content is updated.
|
|
3824
|
+
*/
|
|
3848
3825
|
onSlotChange: {
|
|
3849
3826
|
type: Function,
|
|
3850
3827
|
reflect: false
|
|
@@ -3859,14 +3836,6 @@ class AuroDropdown extends AuroElement {
|
|
|
3859
3836
|
reflect: true
|
|
3860
3837
|
},
|
|
3861
3838
|
|
|
3862
|
-
/**
|
|
3863
|
-
* If declared, will apply border-radius to trigger and default slots.
|
|
3864
|
-
*/
|
|
3865
|
-
rounded: {
|
|
3866
|
-
type: Boolean,
|
|
3867
|
-
reflect: true
|
|
3868
|
-
},
|
|
3869
|
-
|
|
3870
3839
|
/**
|
|
3871
3840
|
* @private
|
|
3872
3841
|
*/
|
|
@@ -3881,22 +3850,14 @@ class AuroDropdown extends AuroElement {
|
|
|
3881
3850
|
type: String || undefined,
|
|
3882
3851
|
attribute: false,
|
|
3883
3852
|
reflect: false
|
|
3884
|
-
},
|
|
3885
|
-
|
|
3886
|
-
/**
|
|
3887
|
-
* The value for the aria-autocomplete attribute of the trigger element.
|
|
3888
|
-
*/
|
|
3889
|
-
a11yAutocomplete: {
|
|
3890
|
-
type: String,
|
|
3891
|
-
attribute: false,
|
|
3892
3853
|
}
|
|
3893
3854
|
};
|
|
3894
3855
|
}
|
|
3895
3856
|
|
|
3896
3857
|
static get styles() {
|
|
3897
3858
|
return [
|
|
3898
|
-
colorCss$1,
|
|
3899
3859
|
tokensCss$1,
|
|
3860
|
+
colorCss$1,
|
|
3900
3861
|
|
|
3901
3862
|
// default layout
|
|
3902
3863
|
classicColorCss,
|
|
@@ -4336,10 +4297,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4336
4297
|
id="bib"
|
|
4337
4298
|
shape="${this.shape}"
|
|
4338
4299
|
?data-show="${this.isPopoverVisible}"
|
|
4339
|
-
?isfullscreen="${this.isBibFullscreen}"
|
|
4340
|
-
?common="${this.common}"
|
|
4341
|
-
?rounded="${this.common || this.rounded}"
|
|
4342
|
-
?inset="${this.common || this.inset}">
|
|
4300
|
+
?isfullscreen="${this.isBibFullscreen}">
|
|
4343
4301
|
<div class="slotContent">
|
|
4344
4302
|
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
4345
4303
|
</div>
|