lightning-base-components 1.28.7-alpha → 1.28.10-alpha
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/metadata/raptor.json +2 -0
- package/package.json +17 -8
- package/src/lightning/accordionSection/button.slds.css +28 -28
- package/src/lightning/baseCombobox/baseCombobox.d.ts.map +1 -1
- package/src/lightning/baseCombobox/baseCombobox.js +5 -0
- package/src/lightning/baseCombobox/baseComboboxEvents.d.ts.map +1 -1
- package/src/lightning/baseCombobox/baseComboboxEvents.js +6 -0
- package/src/lightning/baseCombobox/input-text.slds.css +44 -50
- package/src/lightning/button/button.slds.css +28 -28
- package/src/lightning/buttonIcon/button-icon.slds.css +28 -28
- package/src/lightning/buttonIconStateful/button-icon.slds.css +28 -28
- package/src/lightning/buttonIconStateful/button.slds.css +28 -28
- package/src/lightning/buttonMenu/button-icon.slds.css +28 -28
- package/src/lightning/buttonMenu/button.slds.css +28 -28
- package/src/lightning/buttonStateful/button.slds.css +28 -28
- package/src/lightning/carousel/button.slds.css +28 -28
- package/src/lightning/checkboxGroup/checkboxGroup.d.ts +1 -0
- package/src/lightning/checkboxGroup/checkboxGroup.d.ts.map +1 -1
- package/src/lightning/checkboxGroup/checkboxGroup.html +23 -2
- package/src/lightning/checkboxGroup/checkboxGroup.js +5 -1
- package/src/lightning/colorPickerCustom/colorPickerCustom.d.ts.map +1 -1
- package/src/lightning/colorPickerCustom/colorPickerCustom.js +9 -0
- package/src/lightning/colorPickerCustom/input-text.slds.css +44 -50
- package/src/lightning/datatable/button-icon.slds.css +28 -28
- package/src/lightning/datatable/datatable.d.ts.map +1 -1
- package/src/lightning/datatable/datatable.js +3 -0
- package/src/lightning/datatable/icon.slds.css +11 -11
- package/src/lightning/datatable/input-checkbox.slds.css +20 -20
- package/src/lightning/datepicker/input-text.slds.css +44 -50
- package/src/lightning/datetimepicker/datetimepicker.d.ts.map +1 -1
- package/src/lightning/datetimepicker/datetimepicker.js +9 -0
- package/src/lightning/datetimepicker/input-text.slds.css +44 -50
- package/src/lightning/features/gates/imports.d.ts +4 -2
- package/src/lightning/features/gates/imports.js +4 -2
- package/src/lightning/formattedRichText/formattedRichText.d.ts +2 -0
- package/src/lightning/formattedRichText/formattedRichText.d.ts.map +1 -1
- package/src/lightning/formattedRichText/formattedRichText.html +13 -4
- package/src/lightning/formattedRichText/formattedRichText.js +15 -0
- package/src/lightning/groupedCombobox/input-text.slds.css +44 -50
- package/src/lightning/helptext/button-icon.slds.css +28 -28
- package/src/lightning/icon/icon.slds.css +11 -11
- package/src/lightning/input/input.d.ts.map +1 -1
- package/src/lightning/input/input.js +3 -0
- package/src/lightning/inputAddress/input-text.slds.css +44 -50
- package/src/lightning/inputLocation/input-text.slds.css +44 -50
- package/src/lightning/inputName/input-text.slds.css +44 -50
- package/src/lightning/inputName/inputName.d.ts.map +1 -1
- package/src/lightning/inputName/inputName.js +4 -0
- package/src/lightning/interactiveDialogBase/button.slds.css +28 -28
- package/src/lightning/modalHeader/modalHeader.css +2 -11
- package/src/lightning/modalHeader/modalHeader.lbc.synthetic.css +7 -0
- package/src/lightning/pillContainer/button.slds.css +28 -28
- package/src/lightning/pillContainer/standardPillContainer.css +1 -5
- package/src/lightning/pillContainer/standardPillContainer.lbc.native.css +5 -0
- package/src/lightning/positionLibrary/elementProxy.d.ts +2 -1
- package/src/lightning/positionLibrary/elementProxy.d.ts.map +1 -1
- package/src/lightning/positionLibrary/elementProxy.js +32 -3
- package/src/lightning/primitiveCellCheckbox/checkbox.css +0 -2
- package/src/lightning/primitiveCellCheckbox/checkbox.lbc.native.css +2 -0
- package/src/lightning/primitiveCellCheckbox/input-checkbox.slds.css +20 -20
- package/src/lightning/primitiveCellFactory/button-icon.slds.css +28 -28
- package/src/lightning/primitiveCoordinateItem/button.slds.css +28 -28
- package/src/lightning/primitiveDatatableStatusBar/button.slds.css +28 -28
- package/src/lightning/primitiveDatatableTooltip/button-icon.slds.css +28 -28
- package/src/lightning/primitiveDatatableTooltip/button.slds.css +28 -28
- package/src/lightning/primitiveFigure/primitiveFigure.css +64 -0
- package/src/lightning/primitiveFigure/primitiveFigure.d.ts +33 -0
- package/src/lightning/primitiveFigure/primitiveFigure.d.ts.map +1 -0
- package/src/lightning/primitiveFigure/primitiveFigure.html +5 -0
- package/src/lightning/primitiveFigure/primitiveFigure.js +155 -0
- package/src/lightning/primitiveFigure/primitiveFigure.js-meta.xml +4 -0
- package/src/lightning/primitiveHeaderFactory/input-checkbox.slds.css +20 -20
- package/src/lightning/primitiveIcon/icon.slds.css +11 -11
- package/src/lightning/primitiveInputCheckbox/input-checkbox.slds.css +20 -20
- package/src/lightning/primitiveInputCheckbox/primitiveInputCheckbox.d.ts.map +1 -1
- package/src/lightning/primitiveInputCheckbox/primitiveInputCheckbox.js +1 -11
- package/src/lightning/primitiveInputCheckboxButton/primitiveInputCheckboxButton.css +0 -1
- package/src/lightning/primitiveInputCheckboxButton/primitiveInputCheckboxButton.d.ts.map +1 -1
- package/src/lightning/primitiveInputCheckboxButton/primitiveInputCheckboxButton.js +12 -0
- package/src/lightning/primitiveInputColor/input-text.slds.css +44 -50
- package/src/lightning/primitiveInputColor/primitiveInputColor.d.ts.map +1 -1
- package/src/lightning/primitiveInputColor/primitiveInputColor.js +12 -0
- package/src/lightning/primitiveInputFile/button.slds.css +28 -28
- package/src/lightning/primitiveInputSimple/input-text.slds.css +44 -50
- package/src/lightning/primitiveInputSimple/primitiveInputSimple.d.ts.map +1 -1
- package/src/lightning/primitiveInputSimple/primitiveInputSimple.js +8 -0
- package/src/lightning/primitiveInputToggle/primitiveInputToggle.d.ts.map +1 -1
- package/src/lightning/primitiveInputToggle/primitiveInputToggle.js +12 -0
- package/src/lightning/primitiveTreegridCellToggle/button-icon.slds.css +28 -28
- package/src/lightning/prompt/input-text.slds.css +44 -50
- package/src/lightning/sldsCommon/sldsCommon.css +10 -10
- package/src/lightning/toast/button-icon.slds.css +28 -28
- package/src/lightning/toast/icon.slds.css +11 -11
- package/src/lightning/tree/treeData.d.ts.map +1 -1
- package/src/lightning/tree/treeData.js +18 -0
- package/src/lightning/utilsPrivate/normalize.d.ts +1 -1
- package/src/lightning/utilsPrivate/normalize.d.ts.map +1 -1
- package/src/lightning/verticalNavigationOverflow/button.slds.css +28 -28
- package/src/lightning/primitiveInputCheckboxButton/primitiveInputCheckboxButton.lbc.synthetic.css +0 -2
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
:host([data-render-mode="shadow"]) [part~='input-checkbox'] {
|
|
13
13
|
display: inline-flex;
|
|
14
14
|
align-items: center;
|
|
15
|
-
gap: var(--sds-c-inputcheckbox-spacing-gap, var(--
|
|
15
|
+
gap: var(--sds-c-inputcheckbox-spacing-gap, var(--slds-s-input-spacing-gap));
|
|
16
16
|
}
|
|
17
17
|
/**
|
|
18
18
|
* The visual container of the checkbox indicator
|
|
@@ -22,12 +22,12 @@
|
|
|
22
22
|
align-items: center;
|
|
23
23
|
justify-content: center;
|
|
24
24
|
position: relative;
|
|
25
|
-
background-color: var(--sds-c-inputcheckbox-color-background, var(--
|
|
25
|
+
background-color: var(--sds-c-inputcheckbox-color-background, var(--slds-s-input-color-background));
|
|
26
26
|
box-shadow: var(--sds-c-inputcheckbox-shadow);
|
|
27
27
|
width: var(--sds-c-inputcheckbox-sizing, 1rem);
|
|
28
28
|
height: var(--sds-c-inputcheckbox-sizing, 1rem);
|
|
29
|
-
border: var(--sds-c-inputcheckbox-sizing-border, var(--
|
|
30
|
-
var(--sds-c-inputcheckbox-color-border, var(--
|
|
29
|
+
border: var(--sds-c-inputcheckbox-sizing-border, var(--slds-s-input-sizing-border, 1px)) solid
|
|
30
|
+
var(--sds-c-inputcheckbox-color-border, var(--slds-s-input-color-border, currentColor));
|
|
31
31
|
border-radius: var(--sds-c-inputcheckbox-radius-border);
|
|
32
32
|
}
|
|
33
33
|
/**
|
|
@@ -37,15 +37,15 @@
|
|
|
37
37
|
[part='checkbox']:has(:checked):has(:focus) {
|
|
38
38
|
--sds-c-inputcheckbox-shadow: var(
|
|
39
39
|
--sds-c-inputcheckbox-shadow-focus,
|
|
40
|
-
var(--
|
|
40
|
+
var(--slds-s-input-shadow-focus, revert)
|
|
41
41
|
);
|
|
42
42
|
--sds-c-inputcheckbox-color-background: var(
|
|
43
43
|
--sds-c-inputcheckbox-color-background-focus,
|
|
44
|
-
var(--
|
|
44
|
+
var(--slds-s-input-color-background-focus, revert)
|
|
45
45
|
);
|
|
46
46
|
--sds-c-inputcheckbox-color-border: var(
|
|
47
47
|
--sds-c-inputcheckbox-color-border-focus,
|
|
48
|
-
var(--
|
|
48
|
+
var(--slds-s-input-color-border-focus, revert)
|
|
49
49
|
);
|
|
50
50
|
}
|
|
51
51
|
/**
|
|
@@ -70,10 +70,10 @@
|
|
|
70
70
|
:host([data-render-mode="shadow"]) [part='mark'] {
|
|
71
71
|
display: inline-flex;
|
|
72
72
|
opacity: 0;
|
|
73
|
-
color: var(--sds-c-inputcheckbox-mark-color-foreground, var(--
|
|
74
|
-
background-color: var(--sds-c-inputcheckbox-mark-color-background, var(--
|
|
75
|
-
width: var(--sds-c-inputcheckbox-mark-sizing, var(--
|
|
76
|
-
height: var(--sds-c-inputcheckbox-mark-sizing, var(--
|
|
73
|
+
color: var(--sds-c-inputcheckbox-mark-color-foreground, var(--slds-s-mark-color-foreground));
|
|
74
|
+
background-color: var(--sds-c-inputcheckbox-mark-color-background, var(--slds-s-mark-color-background));
|
|
75
|
+
width: var(--sds-c-inputcheckbox-mark-sizing, var(--slds-s-mark-sizing, 1em));
|
|
76
|
+
height: var(--sds-c-inputcheckbox-mark-sizing, var(--slds-s-mark-sizing, 1em));
|
|
77
77
|
}
|
|
78
78
|
/**
|
|
79
79
|
* When the label or checkbox is clicked, a checked state is applied to the host element
|
|
@@ -83,7 +83,7 @@
|
|
|
83
83
|
|
|
84
84
|
--sds-c-inputcheckbox-mark-color-background: var(
|
|
85
85
|
--sds-c-inputcheckbox-mark-color-background-checked,
|
|
86
|
-
var(--
|
|
86
|
+
var(--slds-s-mark-color-background-checked, revert)
|
|
87
87
|
);
|
|
88
88
|
}
|
|
89
89
|
/**
|
|
@@ -103,8 +103,8 @@
|
|
|
103
103
|
* The label of the checkbox
|
|
104
104
|
*/
|
|
105
105
|
:host([data-render-mode="shadow"]) [part~='label'] {
|
|
106
|
-
color: var(--sds-c-inputcheckbox-label-color, var(--
|
|
107
|
-
font-size: var(--sds-c-inputcheckbox-label-font-size, var(--
|
|
106
|
+
color: var(--sds-c-inputcheckbox-label-color, var(--slds-s-label-color));
|
|
107
|
+
font-size: var(--sds-c-inputcheckbox-label-font-size, var(--slds-s-label-font-size));
|
|
108
108
|
}
|
|
109
109
|
/**
|
|
110
110
|
* If told, the label will be hidden from view
|
|
@@ -128,23 +128,23 @@
|
|
|
128
128
|
* This prevents box-model customizations from being applied, in the case of no children
|
|
129
129
|
*/
|
|
130
130
|
:host([data-render-mode="shadow"]) [part='help-text visible'] {
|
|
131
|
-
font-size: var(--sds-c-inputcheckbox-helptext-font-size, var(--
|
|
132
|
-
color: var(--sds-c-inputcheckbox-helptext-text-color, var(--
|
|
131
|
+
font-size: var(--sds-c-inputcheckbox-helptext-font-size, var(--slds-s-helptext-font-size));
|
|
132
|
+
color: var(--sds-c-inputcheckbox-helptext-text-color, var(--slds-s-helptext-color));
|
|
133
133
|
padding-inline-start: var(
|
|
134
134
|
--sds-c-inputcheckbox-helptext-spacing-inlinestart,
|
|
135
|
-
var(--sds-c-inputcheckbox-helptext-spacing-inline, var(--
|
|
135
|
+
var(--sds-c-inputcheckbox-helptext-spacing-inline, var(--slds-s-helptext-spacing))
|
|
136
136
|
);
|
|
137
137
|
padding-inline-end: var(
|
|
138
138
|
--sds-c-inputcheckbox-helptext-spacing-inlineend,
|
|
139
|
-
var(--sds-c-inputcheckbox-helptext-spacing-inline, var(--
|
|
139
|
+
var(--sds-c-inputcheckbox-helptext-spacing-inline, var(--slds-s-helptext-spacing))
|
|
140
140
|
);
|
|
141
141
|
padding-block-start: var(
|
|
142
142
|
--sds-c-inputcheckbox-helptext-spacing-blockstart,
|
|
143
|
-
var(--sds-c-inputcheckbox-helptext-spacing-block, var(--
|
|
143
|
+
var(--sds-c-inputcheckbox-helptext-spacing-block, var(--slds-s-helptext-spacing))
|
|
144
144
|
);
|
|
145
145
|
padding-block-end: var(
|
|
146
146
|
--sds-c-inputcheckbox-helptext-spacing-blockend,
|
|
147
|
-
var(--sds-c-inputcheckbox-helptext-spacing-block, var(--
|
|
147
|
+
var(--sds-c-inputcheckbox-helptext-spacing-block, var(--slds-s-helptext-spacing))
|
|
148
148
|
);
|
|
149
149
|
}
|
|
150
150
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"primitiveInputCheckbox.d.ts","sourceRoot":"","sources":["../../../../../modules/lightning/primitiveInputCheckbox/primitiveInputCheckbox.js"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"primitiveInputCheckbox.d.ts","sourceRoot":"","sources":["../../../../../modules/lightning/primitiveInputCheckbox/primitiveInputCheckbox.js"],"names":[],"mappings":"AAcA;IACI,cAAc;IACd,cAAc;IACd,WAAW;IACX,iBAAiB;IACjB,6BAA6B;IAC7B,oBAAoB;IACpB,iBAAiB;IACjB,eAAe;IACf,eAAe;IACf,UAAU;IACV,cAAc;IACd,sBAAsB;IACtB,kBAAkB;IAClB,yBAAyB;IAEzB,iCAEC;IAED,uCAGC;IAMD,wBAEC;IAND,mBAGC;IAUD,8BAGC;IARD,uBAGC;IA0CD,kBAAa;IA/Bb,0BAGC;IAPD,mBAGC;IAEG,cAAuB;IAI3B,qCAOC;IAHO,qCAAsC;IAK9C,mCAGC;IAED,uCAGC;IAED,8BAGC;IAED,sBAA8B;IAC9B,cAAS;IAGT,iCAKC;IAED,6BAEC;IAED,oCAIC;IAED,0DAEC;IAED,gCAEC;IAED,iCAIC;IAED,4BAEC;IAED,mBAEC;IAED,oBAEC;IAED,8BAWC;IAED,+BAWC;IAED,oBAIC;IAIG,yBAA8C;IAGlD,yBAMC;IADG,kBAAoB;IAGxB,6BAGC;CACJ;qCApLoC,kCAAkC"}
|
|
@@ -10,7 +10,6 @@ import labelTrue from '@salesforce/label/LightningControl.true';
|
|
|
10
10
|
import labelFalse from '@salesforce/label/LightningControl.false';
|
|
11
11
|
import { api } from 'lwc';
|
|
12
12
|
import LightningShadowBaseClass from 'lightning/shadowBaseClassPrivate';
|
|
13
|
-
import { features } from 'lightning/features';
|
|
14
13
|
import { isNativeComponent, reflectAttribute } from 'lightning/utilsPrivate';
|
|
15
14
|
const i18n = {
|
|
16
15
|
true: labelTrue,
|
|
@@ -122,16 +121,7 @@ export default class LightningPrimitiveInputCheckbox extends LightningShadowBase
|
|
|
122
121
|
.toString();
|
|
123
122
|
}
|
|
124
123
|
get showReadOnlyIcon() {
|
|
125
|
-
|
|
126
|
-
features.enableReadOnlyCheckboxField) {
|
|
127
|
-
return !this.disabled && this.readOnly;
|
|
128
|
-
}
|
|
129
|
-
else if (features.enableReadOnlyCheckboxField) {
|
|
130
|
-
return this.readOnly;
|
|
131
|
-
}
|
|
132
|
-
else {
|
|
133
|
-
return false;
|
|
134
|
-
}
|
|
124
|
+
return !this.disabled && this.readOnly;
|
|
135
125
|
}
|
|
136
126
|
handleBlur() {
|
|
137
127
|
this.dispatchEvent(new CustomEvent('blur'));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"primitiveInputCheckboxButton.d.ts","sourceRoot":"","sources":["../../../../../modules/lightning/primitiveInputCheckboxButton/primitiveInputCheckboxButton.js"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"primitiveInputCheckboxButton.d.ts","sourceRoot":"","sources":["../../../../../modules/lightning/primitiveInputCheckboxButton/primitiveInputCheckboxButton.js"],"names":[],"mappings":"AAWA;IACI,eAAe;IACf,iBAAiB;IACjB,eAAe;IACf,UAAU;IACV,cAAc;IACd,cAAc;IACd,WAAW;IACX,sBAAsB;IACtB,kBAAkB;IAClB,yBAAyB;IAEzB,kBAAiB;IACjB,mBAAkB;IAClB,qBAAkB;IAElB,kBAAiB;IACjB,yBAAwB;IAwBxB,4BAOC;IAjBD,uBAQC;IAqBD,6BAGC;IARD,wBAGC;IAYD,iCAGC;IARD,0BAGC;IAOD,qCAOC;IAHO,qCAAsC;IAK9C,uCAGC;IAED,uCAGC;IAED,8BAGC;IAMG,yBAA8C;IAGlD,6BAIC;IAED,yBAMC;IAID,mBAEC;IAED,oBAEC;IAED,+BAIC;IAED,oBAIC;IAID,iDAOC;IAED,4BAMC;IAED,4BAEC;IAID,gCAKC;IAQD,mCAKC;CACJ;qCA7LoC,kCAAkC"}
|
|
@@ -5,7 +5,10 @@
|
|
|
5
5
|
*/
|
|
6
6
|
import { api } from 'lwc';
|
|
7
7
|
import { reflectAttribute, normalizeBoolean, isNativeComponent, } from 'lightning/utilsPrivate';
|
|
8
|
+
import { privateContext } from 'lightning/utilsInternal';
|
|
9
|
+
import { features } from 'lightning/features';
|
|
8
10
|
import LightningShadowBaseClass from 'lightning/shadowBaseClassPrivate';
|
|
11
|
+
const { setContext, assertContext } = privateContext;
|
|
9
12
|
export default class LightningPrimitiveInputColor extends LightningShadowBaseClass {
|
|
10
13
|
@api
|
|
11
14
|
ariaLabel;
|
|
@@ -32,6 +35,12 @@ export default class LightningPrimitiveInputColor extends LightningShadowBaseCla
|
|
|
32
35
|
_helpMessage = '';
|
|
33
36
|
rendered = false;
|
|
34
37
|
initialValueSet = false;
|
|
38
|
+
constructor() {
|
|
39
|
+
super();
|
|
40
|
+
if (features.enableAssertContext260) {
|
|
41
|
+
setContext(this);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
35
44
|
@api
|
|
36
45
|
get checked() {
|
|
37
46
|
if (this.initialValueSet) {
|
|
@@ -131,6 +140,9 @@ export default class LightningPrimitiveInputColor extends LightningShadowBaseCla
|
|
|
131
140
|
this.dispatchEvent(new CustomEvent('commit'));
|
|
132
141
|
}
|
|
133
142
|
setInputValue(value) {
|
|
143
|
+
if (features.enableAssertContext260) {
|
|
144
|
+
assertContext(this);
|
|
145
|
+
}
|
|
134
146
|
this.inputElement.value = value;
|
|
135
147
|
}
|
|
136
148
|
normalizeInput(value) {
|
|
@@ -9,63 +9,57 @@
|
|
|
9
9
|
:host([data-render-mode="shadow"]) [part~='input-container'] {
|
|
10
10
|
display: flex;
|
|
11
11
|
align-items: center;
|
|
12
|
-
gap: var(--sds-c-inputtext-spacing-gap, var(--
|
|
13
|
-
min-height: var(--sds-c-inputtext-sizing-height, var(--
|
|
12
|
+
gap: var(--sds-c-inputtext-spacing-gap, var(--slds-s-input-spacing-gap));
|
|
13
|
+
min-height: var(--sds-c-inputtext-sizing-height, var(--slds-s-input-sizing-height));
|
|
14
14
|
padding-inline-start: var(
|
|
15
15
|
--sds-c-inputtext-spacing-inlinestart,
|
|
16
|
-
var(--sds-c-inputtext-spacing-inline, var(--
|
|
16
|
+
var(--sds-c-inputtext-spacing-inline, var(--slds-s-input-spacing))
|
|
17
17
|
);
|
|
18
18
|
padding-inline-end: var(
|
|
19
19
|
--sds-c-inputtext-spacing-inlineend,
|
|
20
|
-
var(--sds-c-inputtext-spacing-inline, var(--
|
|
20
|
+
var(--sds-c-inputtext-spacing-inline, var(--slds-s-input-spacing))
|
|
21
21
|
);
|
|
22
22
|
padding-block-start: var(
|
|
23
23
|
--sds-c-inputtext-spacing-blockstart,
|
|
24
|
-
var(--sds-c-inputtext-spacing-block, var(--
|
|
24
|
+
var(--sds-c-inputtext-spacing-block, var(--slds-s-input-spacing))
|
|
25
25
|
);
|
|
26
26
|
padding-block-end: var(
|
|
27
27
|
--sds-c-inputtext-spacing-blockend,
|
|
28
|
-
var(--sds-c-inputtext-spacing-block, var(--
|
|
28
|
+
var(--sds-c-inputtext-spacing-block, var(--slds-s-input-spacing))
|
|
29
29
|
);
|
|
30
|
-
background: var(--sds-c-inputtext-color-background, var(--
|
|
30
|
+
background: var(--sds-c-inputtext-color-background, var(--slds-s-input-color-background));
|
|
31
31
|
border-block-start: var(
|
|
32
32
|
--sds-c-inputtext-sizing-border-blockstart,
|
|
33
|
-
var(--sds-c-inputtext-sizing-border,
|
|
33
|
+
var(--sds-c-inputtext-sizing-border, 1px)
|
|
34
34
|
)
|
|
35
35
|
solid
|
|
36
36
|
var(
|
|
37
37
|
--sds-c-inputtext-color-border-blockstart,
|
|
38
|
-
var(--sds-c-inputtext-color-border, var(--
|
|
38
|
+
var(--sds-c-inputtext-color-border, var(--slds-s-input-color-border, currentColor))
|
|
39
39
|
);
|
|
40
40
|
border-inline-start: var(
|
|
41
41
|
--sds-c-inputtext-sizing-border-inlinestart,
|
|
42
|
-
var(--sds-c-inputtext-sizing-border,
|
|
42
|
+
var(--sds-c-inputtext-sizing-border, 1px)
|
|
43
43
|
)
|
|
44
44
|
solid
|
|
45
45
|
var(
|
|
46
46
|
--sds-c-inputtext-color-border-inlinestart,
|
|
47
|
-
var(--sds-c-inputtext-color-border, var(--
|
|
47
|
+
var(--sds-c-inputtext-color-border, var(--slds-s-input-color-border, currentColor))
|
|
48
48
|
);
|
|
49
|
-
border-inline-end: var(
|
|
50
|
-
--sds-c-inputtext-sizing-border-inlineend,
|
|
51
|
-
var(--sds-c-inputtext-sizing-border, var(--sds-g-sizing-border-1))
|
|
52
|
-
)
|
|
49
|
+
border-inline-end: var(--sds-c-inputtext-sizing-border-inlineend, var(--sds-c-inputtext-sizing-border, 1px))
|
|
53
50
|
solid
|
|
54
51
|
var(
|
|
55
52
|
--sds-c-inputtext-color-border-inlineend,
|
|
56
|
-
var(--sds-c-inputtext-color-border, var(--
|
|
53
|
+
var(--sds-c-inputtext-color-border, var(--slds-s-input-color-border, currentColor))
|
|
57
54
|
);
|
|
58
|
-
border-block-end: var(
|
|
59
|
-
--sds-c-inputtext-sizing-border-blockend,
|
|
60
|
-
var(--sds-c-inputtext-sizing-border, var(--sds-g-sizing-border-1))
|
|
61
|
-
)
|
|
55
|
+
border-block-end: var(--sds-c-inputtext-sizing-border-blockend, var(--sds-c-inputtext-sizing-border, 1px))
|
|
62
56
|
solid
|
|
63
57
|
var(
|
|
64
58
|
--sds-c-inputtext-color-border-blockend,
|
|
65
|
-
var(--sds-c-inputtext-color-border, var(--
|
|
59
|
+
var(--sds-c-inputtext-color-border, var(--slds-s-input-color-border, currentColor))
|
|
66
60
|
);
|
|
67
|
-
border-radius: var(--sds-c-inputtext-radius-border, var(--
|
|
68
|
-
box-shadow: var(--sds-c-inputtext-shadow, var(--
|
|
61
|
+
border-radius: var(--sds-c-inputtext-radius-border, var(--slds-s-input-radius-border));
|
|
62
|
+
box-shadow: var(--sds-c-inputtext-shadow, var(--slds-s-input-shadow));
|
|
69
63
|
}
|
|
70
64
|
/**
|
|
71
65
|
* Input Control
|
|
@@ -77,8 +71,8 @@
|
|
|
77
71
|
width: 100%;
|
|
78
72
|
height: 100%;
|
|
79
73
|
padding: 0;
|
|
80
|
-
font-size: var(--sds-c-inputtext-font-size, var(--
|
|
81
|
-
color: var(--sds-c-inputtext-text-color, var(--
|
|
74
|
+
font-size: var(--sds-c-inputtext-font-size, var(--slds-s-input-font-size));
|
|
75
|
+
color: var(--sds-c-inputtext-text-color, var(--slds-s-input-text-color));
|
|
82
76
|
line-height: 1;
|
|
83
77
|
border: none;
|
|
84
78
|
background: transparent;
|
|
@@ -92,20 +86,20 @@
|
|
|
92
86
|
:host([data-render-mode="shadow"][active]) [part~='input-container'] {
|
|
93
87
|
--sds-c-inputtext-color-background: var(
|
|
94
88
|
--sds-c-inputtext-color-background-active,
|
|
95
|
-
var(--
|
|
89
|
+
var(--slds-s-input-color-background-active)
|
|
96
90
|
);
|
|
97
91
|
--sds-c-inputtext-color-border: var(
|
|
98
92
|
--sds-c-inputtext-color-border-active,
|
|
99
|
-
var(--
|
|
93
|
+
var(--slds-s-input-color-border-active)
|
|
100
94
|
);
|
|
101
|
-
--sds-c-inputtext-shadow: var(--sds-c-inputtext-shadow-active, var(--
|
|
95
|
+
--sds-c-inputtext-shadow: var(--sds-c-inputtext-shadow-active, var(--slds-s-input-shadow-active));
|
|
102
96
|
}
|
|
103
97
|
/**
|
|
104
98
|
* Placeholder text
|
|
105
99
|
*/
|
|
106
100
|
:host([data-render-mode="shadow"]) [part~='input']::placeholder {
|
|
107
|
-
color: var(--sds-c-inputtext-text-color-placeholder, var(--
|
|
108
|
-
font-style: var(--sds-c-inputtext-font-style-placeholder, var(--
|
|
101
|
+
color: var(--sds-c-inputtext-text-color-placeholder, var(--slds-s-input-text-color-placeholder));
|
|
102
|
+
font-style: var(--sds-c-inputtext-font-style-placeholder, var(--slds-s-input-font-style-placeholder));
|
|
109
103
|
}
|
|
110
104
|
/**
|
|
111
105
|
* Input container when it receives focus-within
|
|
@@ -115,16 +109,16 @@
|
|
|
115
109
|
:host([data-render-mode="shadow"]) [part~='input-container']:focus-within {
|
|
116
110
|
--sds-c-inputtext-color-border: var(
|
|
117
111
|
--sds-c-inputtext-color-border-focus,
|
|
118
|
-
var(--
|
|
112
|
+
var(--slds-s-input-color-border-focus, revert)
|
|
119
113
|
);
|
|
120
|
-
--sds-c-inputtext-shadow: var(--sds-c-inputtext-shadow-focus, var(--
|
|
114
|
+
--sds-c-inputtext-shadow: var(--sds-c-inputtext-shadow-focus, var(--slds-s-input-shadow-focus));
|
|
121
115
|
--sds-c-inputtext-color-background: var(
|
|
122
116
|
--sds-c-inputtext-color-background-focus,
|
|
123
|
-
var(--
|
|
117
|
+
var(--slds-s-input-color-background-focus, revert)
|
|
124
118
|
);
|
|
125
119
|
--sds-c-inputtext-text-color: var(
|
|
126
120
|
--sds-c-inputtext-text-color-focus,
|
|
127
|
-
var(--
|
|
121
|
+
var(--slds-s-input-text-color-focus, revert)
|
|
128
122
|
);
|
|
129
123
|
}
|
|
130
124
|
/**
|
|
@@ -143,28 +137,28 @@
|
|
|
143
137
|
align-items: center;
|
|
144
138
|
|
|
145
139
|
/* Need to tweak stylelint to merge new shared groups into existing set, label is not available */
|
|
146
|
-
gap: var(--sds-c-inputtext-label-spacing-gap, var(--
|
|
140
|
+
gap: var(--sds-c-inputtext-label-spacing-gap, var(--slds-s-label-spacing-gap));
|
|
147
141
|
padding-inline-start: var(
|
|
148
142
|
--sds-c-inputtext-label-spacing-inlinestart,
|
|
149
|
-
var(--sds-c-inputtext-label-spacing-inline, var(--
|
|
143
|
+
var(--sds-c-inputtext-label-spacing-inline, var(--slds-s-label-spacing))
|
|
150
144
|
);
|
|
151
145
|
padding-inline-end: var(
|
|
152
146
|
--sds-c-inputtext-label-spacing-inlineend,
|
|
153
|
-
var(--sds-c-inputtext-label-spacing-inline, var(--
|
|
147
|
+
var(--sds-c-inputtext-label-spacing-inline, var(--slds-s-label-spacing))
|
|
154
148
|
);
|
|
155
149
|
padding-block-start: var(
|
|
156
150
|
--sds-c-inputtext-label-spacing-blockstart,
|
|
157
|
-
var(--sds-c-inputtext-label-spacing-block, var(--
|
|
151
|
+
var(--sds-c-inputtext-label-spacing-block, var(--slds-s-label-spacing))
|
|
158
152
|
);
|
|
159
153
|
padding-block-end: var(
|
|
160
154
|
--sds-c-inputtext-label-spacing-blockend,
|
|
161
|
-
var(--sds-c-inputtext-label-spacing-block, var(--
|
|
155
|
+
var(--sds-c-inputtext-label-spacing-block, var(--slds-s-label-spacing))
|
|
162
156
|
);
|
|
163
|
-
color: var(--sds-c-inputtext-label-color, var(--
|
|
157
|
+
color: var(--sds-c-inputtext-label-color, var(--slds-s-label-color));
|
|
164
158
|
}
|
|
165
159
|
:host([data-render-mode="shadow"]) [part='label'] {
|
|
166
|
-
font-size: var(--sds-c-inputtext-label-font-size, var(--
|
|
167
|
-
font-weight: var(--sds-c-inputtext-label-font-weight, var(--
|
|
160
|
+
font-size: var(--sds-c-inputtext-label-font-size, var(--slds-s-label-font-size));
|
|
161
|
+
font-weight: var(--sds-c-inputtext-label-font-weight, var(--slds-s-label-font-weight));
|
|
168
162
|
}
|
|
169
163
|
/**
|
|
170
164
|
* Help text
|
|
@@ -174,23 +168,23 @@
|
|
|
174
168
|
*/
|
|
175
169
|
:host([data-render-mode="shadow"]) [part='help-text visible'] {
|
|
176
170
|
/* Need to tweak stylelint to merge new shared groups into existing set, helptext is not available */
|
|
177
|
-
font-size: var(--sds-c-inputtext-helptext-font-size, var(--
|
|
178
|
-
color: var(--sds-c-inputtext-helptext-text-color, var(--
|
|
171
|
+
font-size: var(--sds-c-inputtext-helptext-font-size, var(--slds-s-helptext-font-size));
|
|
172
|
+
color: var(--sds-c-inputtext-helptext-text-color, var(--slds-s-helptext-text-color));
|
|
179
173
|
padding-inline-start: var(
|
|
180
174
|
--sds-c-inputtext-helptext-spacing-inlinestart,
|
|
181
|
-
var(--sds-c-inputtext-helptext-spacing-inline, var(--
|
|
175
|
+
var(--sds-c-inputtext-helptext-spacing-inline, var(--slds-s-helptext-spacing))
|
|
182
176
|
);
|
|
183
177
|
padding-inline-end: var(
|
|
184
178
|
--sds-c-inputtext-helptext-spacing-inlineend,
|
|
185
|
-
var(--sds-c-inputtext-helptext-spacing-inline, var(--
|
|
179
|
+
var(--sds-c-inputtext-helptext-spacing-inline, var(--slds-s-helptext-spacing))
|
|
186
180
|
);
|
|
187
181
|
padding-block-start: var(
|
|
188
182
|
--sds-c-inputtext-helptext-spacing-blockstart,
|
|
189
|
-
var(--sds-c-inputtext-helptext-spacing-block, var(--
|
|
183
|
+
var(--sds-c-inputtext-helptext-spacing-block, var(--slds-s-helptext-spacing))
|
|
190
184
|
);
|
|
191
185
|
padding-block-end: var(
|
|
192
186
|
--sds-c-inputtext-helptext-spacing-blockend,
|
|
193
|
-
var(--sds-c-inputtext-helptext-spacing-block, var(--
|
|
187
|
+
var(--sds-c-inputtext-helptext-spacing-block, var(--slds-s-helptext-spacing))
|
|
194
188
|
);
|
|
195
189
|
}
|
|
196
190
|
/**
|
|
@@ -199,11 +193,11 @@
|
|
|
199
193
|
:host([data-render-mode="shadow"][disabled]) {
|
|
200
194
|
--sds-c-inputtext-color-background: var(
|
|
201
195
|
--sds-c-inputtext-color-background-disabled,
|
|
202
|
-
var(--
|
|
196
|
+
var(--slds-s-input-color-background-disabled)
|
|
203
197
|
);
|
|
204
198
|
--sds-c-inputtext-color-border: var(
|
|
205
199
|
--sds-c-inputtext-color-border-disabled,
|
|
206
|
-
var(--
|
|
200
|
+
var(--slds-s-input-color-border-disabled)
|
|
207
201
|
);
|
|
208
202
|
}
|
|
209
203
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"primitiveInputColor.d.ts","sourceRoot":"","sources":["../../../../../modules/lightning/primitiveInputColor/primitiveInputColor.js"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"primitiveInputColor.d.ts","sourceRoot":"","sources":["../../../../../modules/lightning/primitiveInputColor/primitiveInputColor.js"],"names":[],"mappings":";;AASA;IACI,sBAAsB;IACtB,cAAc;IACd,eAAe;IACf,WAAW;IACX,oBAAoB;IACpB,6BAA6B;IAC7B,iBAAiB;IACjB,cAAc;IACd,UAAU;IACV,kBAAkB;IAClB,eAAe;IACf,iBAAiB;IACjB,kBAAkB;IAClB,sBAAsB;IACtB,iBAAiB;IACjB,aAAa;IACb,aAAa;IAEb,eAAY;IAEZ,kBAAiB;IACjB,yBAAwB;IASxB,cAKC;IAOD,yBAKC;IAVD,oBAGC;IASD,qCAOC;IAHO,qCAAsC;IAK9C,uCAGC;IAED,uCAGC;IAED,8BAGC;IAMG,yBAA8C;IAGlD,6BAIC;IAED,yBASC;IAKD,kEAIC;IAED,6BAEC;IAID,mBAEC;IAED,oBAEC;IAED,+BAIC;IAOD,oCAaC;IAED,8BAGC;IAID,iDAQC;IAED,4BAIC;IAED,4BAEC;IAID,gCAKC;IAQD,mCAKC;CACJ;qCA3MoC,kCAAkC"}
|
|
@@ -8,6 +8,9 @@ import LightningShadowBaseClass from 'lightning/shadowBaseClassPrivate';
|
|
|
8
8
|
import { classSet } from 'lightning/utils';
|
|
9
9
|
import { VARIANT } from 'lightning/inputUtils';
|
|
10
10
|
import { reflectAttribute, isNativeComponent } from 'lightning/utilsPrivate';
|
|
11
|
+
import { privateContext } from 'lightning/utilsInternal';
|
|
12
|
+
import { features } from 'lightning/features';
|
|
13
|
+
const { setContext, assertContext } = privateContext;
|
|
11
14
|
export default class LightningPrimitiveInputColor extends LightningShadowBaseClass {
|
|
12
15
|
@api
|
|
13
16
|
hasExternalLabel;
|
|
@@ -46,6 +49,12 @@ export default class LightningPrimitiveInputColor extends LightningShadowBaseCla
|
|
|
46
49
|
_value = '';
|
|
47
50
|
rendered = false;
|
|
48
51
|
initialValueSet = false;
|
|
52
|
+
constructor() {
|
|
53
|
+
super();
|
|
54
|
+
if (features.enableAssertContext260) {
|
|
55
|
+
setContext(this);
|
|
56
|
+
}
|
|
57
|
+
}
|
|
49
58
|
@api
|
|
50
59
|
focus() {
|
|
51
60
|
if (this.rendered) {
|
|
@@ -151,6 +160,9 @@ export default class LightningPrimitiveInputColor extends LightningShadowBaseCla
|
|
|
151
160
|
this.dispatchEvent(new CustomEvent('commit'));
|
|
152
161
|
}
|
|
153
162
|
setInputValue(value) {
|
|
163
|
+
if (features.enableAssertContext260) {
|
|
164
|
+
assertContext(this);
|
|
165
|
+
}
|
|
154
166
|
this.inputElement.value = value;
|
|
155
167
|
}
|
|
156
168
|
normalizeInput(value) {
|
|
@@ -16,11 +16,11 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
|
|
|
16
16
|
*/
|
|
17
17
|
:host([data-render-mode="shadow"]) [part~='button'] {
|
|
18
18
|
display: inline-flex;
|
|
19
|
-
gap: var(--sds-c-button-spacing-gap, var(--
|
|
20
|
-
background: var(--sds-c-button-color-background, var(--
|
|
21
|
-
color: var(--sds-c-button-text-color, var(--
|
|
22
|
-
font-weight: var(--sds-c-button-font-weight, var(--
|
|
23
|
-
font-size: var(--sds-c-button-font-size, var(--
|
|
19
|
+
gap: var(--sds-c-button-spacing-gap, var(--slds-s-button-spacing-gap));
|
|
20
|
+
background: var(--sds-c-button-color-background, var(--slds-s-button-color-background));
|
|
21
|
+
color: var(--sds-c-button-text-color, var(--slds-s-button-color));
|
|
22
|
+
font-weight: var(--sds-c-button-font-weight, var(--slds-s-button-font-weight));
|
|
23
|
+
font-size: var(--sds-c-button-font-size, var(--slds-s-button-font-size, inherit));
|
|
24
24
|
line-height: var(--sds-c-button-font-lineheight);
|
|
25
25
|
height: var(--sds-c-button-sizing-height);
|
|
26
26
|
width: var(--sds-c-button-sizing-width);
|
|
@@ -28,62 +28,62 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
|
|
|
28
28
|
--sds-c-button-spacing-inlinestart,
|
|
29
29
|
var(
|
|
30
30
|
--sds-c-button-spacing-inline,
|
|
31
|
-
var(--sds-c-button-spacing, var(--
|
|
31
|
+
var(--sds-c-button-spacing, var(--slds-s-button-spacing-inline, var(--slds-s-button-spacing)))
|
|
32
32
|
)
|
|
33
33
|
);
|
|
34
34
|
padding-inline-end: var(
|
|
35
35
|
--sds-c-button-spacing-inlineend,
|
|
36
36
|
var(
|
|
37
37
|
--sds-c-button-spacing-inline,
|
|
38
|
-
var(--sds-c-button-spacing, var(--
|
|
38
|
+
var(--sds-c-button-spacing, var(--slds-s-button-spacing-inline, var(--slds-s-button-spacing)))
|
|
39
39
|
)
|
|
40
40
|
);
|
|
41
41
|
padding-block-start: var(
|
|
42
42
|
--sds-c-button-spacing-blockstart,
|
|
43
43
|
var(
|
|
44
44
|
--sds-c-button-spacing-block,
|
|
45
|
-
var(--sds-c-button-spacing, var(--
|
|
45
|
+
var(--sds-c-button-spacing, var(--slds-s-button-spacing-block, var(--slds-s-button-spacing)))
|
|
46
46
|
)
|
|
47
47
|
);
|
|
48
48
|
padding-block-end: var(
|
|
49
49
|
--sds-c-button-spacing-blockend,
|
|
50
50
|
var(
|
|
51
51
|
--sds-c-button-spacing-block,
|
|
52
|
-
var(--sds-c-button-spacing, var(--
|
|
52
|
+
var(--sds-c-button-spacing, var(--slds-s-button-spacing-block, var(--slds-s-button-spacing)))
|
|
53
53
|
)
|
|
54
54
|
);
|
|
55
|
-
border-width: var(--sds-c-button-sizing-border, var(--
|
|
55
|
+
border-width: var(--sds-c-button-sizing-border, var(--slds-s-button-sizing-border, 1px));
|
|
56
56
|
border-style: solid;
|
|
57
|
-
border-color: var(--sds-c-button-color-border, var(--
|
|
57
|
+
border-color: var(--sds-c-button-color-border, var(--slds-s-button-color-border, currentColor));
|
|
58
58
|
border-start-start-radius: var(
|
|
59
59
|
--sds-c-button-radius-border-startstart,
|
|
60
60
|
var(
|
|
61
61
|
--sds-c-button-radius-border,
|
|
62
|
-
var(--
|
|
62
|
+
var(--slds-s-button-radius-border-startstart, var(--slds-s-button-radius-border))
|
|
63
63
|
)
|
|
64
64
|
);
|
|
65
65
|
border-start-end-radius: var(
|
|
66
66
|
--sds-c-button-radius-border-startend,
|
|
67
67
|
var(
|
|
68
68
|
--sds-c-button-radius-border,
|
|
69
|
-
var(--
|
|
69
|
+
var(--slds-s-button-radius-border-startend, var(--slds-s-button-radius-border))
|
|
70
70
|
)
|
|
71
71
|
);
|
|
72
72
|
border-end-start-radius: var(
|
|
73
73
|
--sds-c-button-radius-border-endstart,
|
|
74
74
|
var(
|
|
75
75
|
--sds-c-button-radius-border,
|
|
76
|
-
var(--
|
|
76
|
+
var(--slds-s-button-radius-border-endstart, var(--slds-s-button-radius-border))
|
|
77
77
|
)
|
|
78
78
|
);
|
|
79
79
|
border-end-end-radius: var(
|
|
80
80
|
--sds-c-button-radius-border-endend,
|
|
81
81
|
var(
|
|
82
82
|
--sds-c-button-radius-border,
|
|
83
|
-
var(--
|
|
83
|
+
var(--slds-s-button-radius-border-endend, var(--slds-s-button-radius-border))
|
|
84
84
|
)
|
|
85
85
|
);
|
|
86
|
-
box-shadow: var(--sds-c-button-shadow, var(--
|
|
86
|
+
box-shadow: var(--sds-c-button-shadow, var(--slds-s-button-shadow));
|
|
87
87
|
text-decoration: var(--sds-c-button-font-decoration);
|
|
88
88
|
white-space: normal;
|
|
89
89
|
user-select: none;
|
|
@@ -97,16 +97,16 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
|
|
|
97
97
|
* Fallback order: Hover > Base
|
|
98
98
|
*/
|
|
99
99
|
:host([data-render-mode="shadow"]) [part~='button']:hover {
|
|
100
|
-
--sds-c-button-text-color: var(--sds-c-button-text-color-hover, var(--
|
|
100
|
+
--sds-c-button-text-color: var(--sds-c-button-text-color-hover, var(--slds-s-button-color-hover, revert));
|
|
101
101
|
--sds-c-button-color-background: var(
|
|
102
102
|
--sds-c-button-color-background-hover,
|
|
103
|
-
var(--
|
|
103
|
+
var(--slds-s-button-color-background-hover, revert)
|
|
104
104
|
);
|
|
105
105
|
--sds-c-button-color-border: var(
|
|
106
106
|
--sds-c-button-color-border-hover,
|
|
107
|
-
var(--
|
|
107
|
+
var(--slds-s-button-color-border-hover, revert)
|
|
108
108
|
);
|
|
109
|
-
--sds-c-button-shadow: var(--sds-c-button-shadow-hover, var(--
|
|
109
|
+
--sds-c-button-shadow: var(--sds-c-button-shadow-hover, var(--slds-s-button-shadow-hover, revert));
|
|
110
110
|
|
|
111
111
|
cursor: pointer;
|
|
112
112
|
}
|
|
@@ -118,14 +118,14 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
|
|
|
118
118
|
:host([data-render-mode="shadow"]) [part~='button']:focus {
|
|
119
119
|
--sds-c-button-color-background: var(
|
|
120
120
|
--sds-c-button-color-background-focus,
|
|
121
|
-
var(--
|
|
121
|
+
var(--slds-s-button-color-background-focus, revert)
|
|
122
122
|
);
|
|
123
123
|
--sds-c-button-color-border: var(
|
|
124
124
|
--sds-c-button-color-border-focus,
|
|
125
|
-
var(--
|
|
125
|
+
var(--slds-s-button-color-border-focus, revert)
|
|
126
126
|
);
|
|
127
|
-
--sds-c-button-text-color: var(--sds-c-button-text-color-focus, var(--
|
|
128
|
-
--sds-c-button-shadow: var(--sds-c-button-shadow-focus, var(--
|
|
127
|
+
--sds-c-button-text-color: var(--sds-c-button-text-color-focus, var(--slds-s-button-color-focus, revert));
|
|
128
|
+
--sds-c-button-shadow: var(--sds-c-button-shadow-focus, var(--slds-s-button-shadow-focus, revert));
|
|
129
129
|
|
|
130
130
|
outline: 0;
|
|
131
131
|
}
|
|
@@ -137,16 +137,16 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
|
|
|
137
137
|
* @TODO: keep this order (no hover) so active has feedback or go all out?
|
|
138
138
|
*/
|
|
139
139
|
:host([data-render-mode="shadow"]) [part~='button']:active {
|
|
140
|
-
--sds-c-button-text-color: var(--sds-c-button-text-color-active, var(--
|
|
140
|
+
--sds-c-button-text-color: var(--sds-c-button-text-color-active, var(--slds-s-button-color-active, revert));
|
|
141
141
|
--sds-c-button-color-background: var(
|
|
142
142
|
--sds-c-button-color-background-active,
|
|
143
|
-
var(--
|
|
143
|
+
var(--slds-s-button-color-background-active, revert)
|
|
144
144
|
);
|
|
145
145
|
--sds-c-button-color-border: var(
|
|
146
146
|
--sds-c-button-color-border-active,
|
|
147
|
-
var(--
|
|
147
|
+
var(--slds-s-button-color-border-active, revert)
|
|
148
148
|
);
|
|
149
|
-
--sds-c-button-shadow: var(--sds-c-button-shadow-active, var(--
|
|
149
|
+
--sds-c-button-shadow: var(--sds-c-button-shadow-active, var(--slds-s-button-shadow-active, revert));
|
|
150
150
|
}
|
|
151
151
|
/**
|
|
152
152
|
* Disabled button styles
|