lightning-base-components 1.28.7-alpha → 1.28.8-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.
Files changed (114) hide show
  1. package/package.json +17 -8
  2. package/src/lightning/accordionSection/accordionSection.d.ts +1 -1
  3. package/src/lightning/accordionSection/accordionSection.d.ts.map +1 -1
  4. package/src/lightning/accordionSection/button.slds.css +28 -28
  5. package/src/lightning/avatar/avatar.d.ts +0 -1
  6. package/src/lightning/avatar/avatar.d.ts.map +1 -1
  7. package/src/lightning/baseCombobox/baseCombobox.d.ts.map +1 -1
  8. package/src/lightning/baseCombobox/baseCombobox.js +5 -0
  9. package/src/lightning/baseCombobox/baseComboboxEvents.d.ts.map +1 -1
  10. package/src/lightning/baseCombobox/baseComboboxEvents.js +6 -0
  11. package/src/lightning/baseCombobox/input-text.slds.css +44 -50
  12. package/src/lightning/button/button.slds.css +28 -28
  13. package/src/lightning/buttonIcon/button-icon.slds.css +28 -28
  14. package/src/lightning/buttonIconStateful/button-icon.slds.css +28 -28
  15. package/src/lightning/buttonIconStateful/button.slds.css +28 -28
  16. package/src/lightning/buttonMenu/button-icon.slds.css +28 -28
  17. package/src/lightning/buttonMenu/button.slds.css +28 -28
  18. package/src/lightning/buttonStateful/button.slds.css +28 -28
  19. package/src/lightning/carousel/button.slds.css +28 -28
  20. package/src/lightning/checkboxGroup/checkboxGroup.d.ts +1 -0
  21. package/src/lightning/checkboxGroup/checkboxGroup.d.ts.map +1 -1
  22. package/src/lightning/checkboxGroup/checkboxGroup.html +23 -2
  23. package/src/lightning/checkboxGroup/checkboxGroup.js +5 -1
  24. package/src/lightning/colorPickerCustom/input-text.slds.css +44 -50
  25. package/src/lightning/datatable/button-icon.slds.css +28 -28
  26. package/src/lightning/datatable/datatable.d.ts.map +1 -1
  27. package/src/lightning/datatable/datatable.js +3 -0
  28. package/src/lightning/datatable/icon.slds.css +11 -11
  29. package/src/lightning/datatable/input-checkbox.slds.css +20 -20
  30. package/src/lightning/datepicker/datepicker.d.ts +0 -1
  31. package/src/lightning/datepicker/datepicker.d.ts.map +1 -1
  32. package/src/lightning/datepicker/input-text.slds.css +44 -50
  33. package/src/lightning/datetimepicker/datetimepicker.d.ts.map +1 -1
  34. package/src/lightning/datetimepicker/datetimepicker.js +9 -0
  35. package/src/lightning/datetimepicker/input-text.slds.css +44 -50
  36. package/src/lightning/features/gates/imports.d.ts +1 -37
  37. package/src/lightning/features/gates/imports.js +4 -2
  38. package/src/lightning/formattedRichText/formattedRichText.d.ts +2 -0
  39. package/src/lightning/formattedRichText/formattedRichText.d.ts.map +1 -1
  40. package/src/lightning/formattedRichText/formattedRichText.html +13 -4
  41. package/src/lightning/formattedRichText/formattedRichText.js +15 -0
  42. package/src/lightning/groupedCombobox/groupedCombobox.d.ts +0 -1
  43. package/src/lightning/groupedCombobox/groupedCombobox.d.ts.map +1 -1
  44. package/src/lightning/groupedCombobox/input-text.slds.css +44 -50
  45. package/src/lightning/helptext/button-icon.slds.css +28 -28
  46. package/src/lightning/icon/icon.slds.css +11 -11
  47. package/src/lightning/input/input.d.ts.map +1 -1
  48. package/src/lightning/input/input.js +3 -0
  49. package/src/lightning/inputAddress/input-text.slds.css +44 -50
  50. package/src/lightning/inputLocation/input-text.slds.css +44 -50
  51. package/src/lightning/inputName/input-text.slds.css +44 -50
  52. package/src/lightning/inputName/inputName.d.ts.map +1 -1
  53. package/src/lightning/inputName/inputName.js +4 -0
  54. package/src/lightning/interactiveDialogBase/button.slds.css +28 -28
  55. package/src/lightning/layout/styleUtils.d.ts +0 -1
  56. package/src/lightning/layout/styleUtils.d.ts.map +1 -1
  57. package/src/lightning/layoutItem/styleUtils.d.ts +0 -1
  58. package/src/lightning/layoutItem/styleUtils.d.ts.map +1 -1
  59. package/src/lightning/modalBase/modalBase.d.ts +0 -1
  60. package/src/lightning/modalBase/modalBase.d.ts.map +1 -1
  61. package/src/lightning/multiColumnSortingModal/multiColumnSortingModal.d.ts +1 -4
  62. package/src/lightning/multiColumnSortingModal/multiColumnSortingModal.d.ts.map +1 -1
  63. package/src/lightning/pillContainer/button.slds.css +28 -28
  64. package/src/lightning/positionLibrary/__examples__/playground/playground.d.ts +0 -1
  65. package/src/lightning/positionLibrary/__examples__/playground/playground.d.ts.map +1 -1
  66. package/src/lightning/positionLibrary/elementProxy.d.ts +2 -1
  67. package/src/lightning/positionLibrary/elementProxy.d.ts.map +1 -1
  68. package/src/lightning/positionLibrary/elementProxy.js +32 -3
  69. package/src/lightning/primitiveCellCheckbox/input-checkbox.slds.css +20 -20
  70. package/src/lightning/primitiveCellFactory/button-icon.slds.css +28 -28
  71. package/src/lightning/primitiveCoordinateItem/button.slds.css +28 -28
  72. package/src/lightning/primitiveDatatableStatusBar/button.slds.css +28 -28
  73. package/src/lightning/primitiveDatatableTooltip/button-icon.slds.css +28 -28
  74. package/src/lightning/primitiveDatatableTooltip/button.slds.css +28 -28
  75. package/src/lightning/primitiveFigure/primitiveFigure.css +64 -0
  76. package/src/lightning/primitiveFigure/primitiveFigure.d.ts +33 -0
  77. package/src/lightning/primitiveFigure/primitiveFigure.d.ts.map +1 -0
  78. package/src/lightning/primitiveFigure/primitiveFigure.html +5 -0
  79. package/src/lightning/primitiveFigure/primitiveFigure.js +155 -0
  80. package/src/lightning/primitiveFigure/primitiveFigure.js-meta.xml +4 -0
  81. package/src/lightning/primitiveHeaderFactory/input-checkbox.slds.css +20 -20
  82. package/src/lightning/primitiveIcon/icon.slds.css +11 -11
  83. package/src/lightning/primitiveInputCheckbox/input-checkbox.slds.css +20 -20
  84. package/src/lightning/primitiveInputCheckbox/primitiveInputCheckbox.d.ts.map +1 -1
  85. package/src/lightning/primitiveInputCheckbox/primitiveInputCheckbox.js +1 -11
  86. package/src/lightning/primitiveInputCheckboxButton/primitiveInputCheckboxButton.d.ts.map +1 -1
  87. package/src/lightning/primitiveInputCheckboxButton/primitiveInputCheckboxButton.js +12 -0
  88. package/src/lightning/primitiveInputColor/input-text.slds.css +44 -50
  89. package/src/lightning/primitiveInputColor/primitiveInputColor.d.ts +0 -1
  90. package/src/lightning/primitiveInputColor/primitiveInputColor.d.ts.map +1 -1
  91. package/src/lightning/primitiveInputColor/primitiveInputColor.js +12 -0
  92. package/src/lightning/primitiveInputFile/button.slds.css +28 -28
  93. package/src/lightning/primitiveInputSimple/input-text.slds.css +44 -50
  94. package/src/lightning/primitiveInputSimple/primitiveInputSimple.d.ts.map +1 -1
  95. package/src/lightning/primitiveInputSimple/primitiveInputSimple.js +8 -0
  96. package/src/lightning/primitiveInputToggle/primitiveInputToggle.d.ts.map +1 -1
  97. package/src/lightning/primitiveInputToggle/primitiveInputToggle.js +12 -0
  98. package/src/lightning/primitiveTreegridCellToggle/button-icon.slds.css +28 -28
  99. package/src/lightning/progressIndicator/progressIndicator.d.ts +0 -1
  100. package/src/lightning/progressIndicator/progressIndicator.d.ts.map +1 -1
  101. package/src/lightning/progressStep/progressStep.d.ts +0 -1
  102. package/src/lightning/progressStep/progressStep.d.ts.map +1 -1
  103. package/src/lightning/prompt/input-text.slds.css +44 -50
  104. package/src/lightning/toast/button-icon.slds.css +28 -28
  105. package/src/lightning/toast/icon.slds.css +11 -11
  106. package/src/lightning/toast/toast.d.ts +0 -1
  107. package/src/lightning/toast/toast.d.ts.map +1 -1
  108. package/src/lightning/toastContainer/toastContainer.d.ts +0 -1
  109. package/src/lightning/toastContainer/toastContainer.d.ts.map +1 -1
  110. package/src/lightning/tree/treeData.d.ts.map +1 -1
  111. package/src/lightning/tree/treeData.js +18 -0
  112. package/src/lightning/utilsPrivate/normalize.d.ts +1 -1
  113. package/src/lightning/utilsPrivate/normalize.d.ts.map +1 -1
  114. package/src/lightning/verticalNavigationOverflow/button.slds.css +28 -28
@@ -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(--sds-s-button-spacing-gap));
20
- background: var(--sds-c-button-color-background, var(--sds-s-button-color-background));
21
- color: var(--sds-c-button-text-color, var(--sds-s-button-color));
22
- font-weight: var(--sds-c-button-font-weight, var(--sds-s-button-font-weight));
23
- font-size: var(--sds-c-button-font-size, var(--sds-s-button-font-size, inherit));
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(--sds-s-button-spacing-inline, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-inline, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-block, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-block, var(--sds-s-button-spacing)))
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(--sds-s-button-sizing-border, 1px));
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(--sds-s-button-color-border, currentColor));
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(--sds-s-button-radius-border-startstart, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-startend, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-endstart, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-endend, var(--sds-s-button-radius-border))
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(--sds-s-button-shadow));
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(--sds-s-button-color-hover, revert));
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(--sds-s-button-color-background-hover, revert)
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(--sds-s-button-color-border-hover, revert)
107
+ var(--slds-s-button-color-border-hover, revert)
108
108
  );
109
- --sds-c-button-shadow: var(--sds-c-button-shadow-hover, var(--sds-s-button-shadow-hover, revert));
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(--sds-s-button-color-background-focus, revert)
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(--sds-s-button-color-border-focus, revert)
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(--sds-s-button-color-focus, revert));
128
- --sds-c-button-shadow: var(--sds-c-button-shadow-focus, var(--sds-s-button-shadow-focus, revert));
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(--sds-s-button-color-active, revert));
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(--sds-s-button-color-background-active, revert)
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(--sds-s-button-color-border-active, revert)
147
+ var(--slds-s-button-color-border-active, revert)
148
148
  );
149
- --sds-c-button-shadow: var(--sds-c-button-shadow-active, var(--sds-s-button-shadow-active, revert));
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
@@ -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(--sds-s-button-spacing-gap));
20
- background: var(--sds-c-button-color-background, var(--sds-s-button-color-background));
21
- color: var(--sds-c-button-text-color, var(--sds-s-button-color));
22
- font-weight: var(--sds-c-button-font-weight, var(--sds-s-button-font-weight));
23
- font-size: var(--sds-c-button-font-size, var(--sds-s-button-font-size, inherit));
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(--sds-s-button-spacing-inline, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-inline, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-block, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-block, var(--sds-s-button-spacing)))
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(--sds-s-button-sizing-border, 1px));
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(--sds-s-button-color-border, currentColor));
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(--sds-s-button-radius-border-startstart, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-startend, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-endstart, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-endend, var(--sds-s-button-radius-border))
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(--sds-s-button-shadow));
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(--sds-s-button-color-hover, revert));
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(--sds-s-button-color-background-hover, revert)
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(--sds-s-button-color-border-hover, revert)
107
+ var(--slds-s-button-color-border-hover, revert)
108
108
  );
109
- --sds-c-button-shadow: var(--sds-c-button-shadow-hover, var(--sds-s-button-shadow-hover, revert));
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(--sds-s-button-color-background-focus, revert)
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(--sds-s-button-color-border-focus, revert)
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(--sds-s-button-color-focus, revert));
128
- --sds-c-button-shadow: var(--sds-c-button-shadow-focus, var(--sds-s-button-shadow-focus, revert));
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(--sds-s-button-color-active, revert));
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(--sds-s-button-color-background-active, revert)
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(--sds-s-button-color-border-active, revert)
147
+ var(--slds-s-button-color-border-active, revert)
148
148
  );
149
- --sds-c-button-shadow: var(--sds-c-button-shadow-active, var(--sds-s-button-shadow-active, revert));
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
@@ -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(--sds-s-button-spacing-gap));
20
- background: var(--sds-c-button-color-background, var(--sds-s-button-color-background));
21
- color: var(--sds-c-button-text-color, var(--sds-s-button-color));
22
- font-weight: var(--sds-c-button-font-weight, var(--sds-s-button-font-weight));
23
- font-size: var(--sds-c-button-font-size, var(--sds-s-button-font-size, inherit));
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(--sds-s-button-spacing-inline, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-inline, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-block, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-block, var(--sds-s-button-spacing)))
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(--sds-s-button-sizing-border, 1px));
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(--sds-s-button-color-border, currentColor));
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(--sds-s-button-radius-border-startstart, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-startend, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-endstart, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-endend, var(--sds-s-button-radius-border))
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(--sds-s-button-shadow));
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(--sds-s-button-color-hover, revert));
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(--sds-s-button-color-background-hover, revert)
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(--sds-s-button-color-border-hover, revert)
107
+ var(--slds-s-button-color-border-hover, revert)
108
108
  );
109
- --sds-c-button-shadow: var(--sds-c-button-shadow-hover, var(--sds-s-button-shadow-hover, revert));
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(--sds-s-button-color-background-focus, revert)
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(--sds-s-button-color-border-focus, revert)
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(--sds-s-button-color-focus, revert));
128
- --sds-c-button-shadow: var(--sds-c-button-shadow-focus, var(--sds-s-button-shadow-focus, revert));
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(--sds-s-button-color-active, revert));
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(--sds-s-button-color-background-active, revert)
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(--sds-s-button-color-border-active, revert)
147
+ var(--slds-s-button-color-border-active, revert)
148
148
  );
149
- --sds-c-button-shadow: var(--sds-c-button-shadow-active, var(--sds-s-button-shadow-active, revert));
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
@@ -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(--sds-s-button-spacing-gap));
20
- background: var(--sds-c-button-color-background, var(--sds-s-button-color-background));
21
- color: var(--sds-c-button-text-color, var(--sds-s-button-color));
22
- font-weight: var(--sds-c-button-font-weight, var(--sds-s-button-font-weight));
23
- font-size: var(--sds-c-button-font-size, var(--sds-s-button-font-size, inherit));
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(--sds-s-button-spacing-inline, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-inline, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-block, var(--sds-s-button-spacing)))
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(--sds-s-button-spacing-block, var(--sds-s-button-spacing)))
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(--sds-s-button-sizing-border, 1px));
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(--sds-s-button-color-border, currentColor));
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(--sds-s-button-radius-border-startstart, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-startend, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-endstart, var(--sds-s-button-radius-border))
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(--sds-s-button-radius-border-endend, var(--sds-s-button-radius-border))
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(--sds-s-button-shadow));
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(--sds-s-button-color-hover, revert));
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(--sds-s-button-color-background-hover, revert)
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(--sds-s-button-color-border-hover, revert)
107
+ var(--slds-s-button-color-border-hover, revert)
108
108
  );
109
- --sds-c-button-shadow: var(--sds-c-button-shadow-hover, var(--sds-s-button-shadow-hover, revert));
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(--sds-s-button-color-background-focus, revert)
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(--sds-s-button-color-border-focus, revert)
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(--sds-s-button-color-focus, revert));
128
- --sds-c-button-shadow: var(--sds-c-button-shadow-focus, var(--sds-s-button-shadow-focus, revert));
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(--sds-s-button-color-active, revert));
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(--sds-s-button-color-background-active, revert)
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(--sds-s-button-color-border-active, revert)
147
+ var(--slds-s-button-color-border-active, revert)
148
148
  );
149
- --sds-c-button-shadow: var(--sds-c-button-shadow-active, var(--sds-s-button-shadow-active, revert));
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