lightning-base-components 1.22.1-alpha → 1.22.2-alpha

package/src/lightning/colorPickerPanel/colorPickerPanel.js

@@ -5,7 +5,7 @@ import labelDoneButton from '@salesforce/label/LightningColorPicker.doneButton';
 import { api, track } from 'lwc';
 import LightningShadowBaseClass from 'lightning/shadowBaseClassPrivate';
 import { classSet } from 'lightning/utils';
-import { keyCodes, isCSR } from 'lightning/utilsPrivate';
+import { keyCodes } from 'lightning/utilsPrivate';
 
 const i18n = {
     cancelButton: labelCancelButton,
@@ -26,16 +26,6 @@ export default class LightningColorPickerPanel extends LightningShadowBaseClass
         this._selectedColor = this.currentColor || DEFAULT_COLOR;
     }
 
-    renderedCallback() {
-        // W-14600421 bug fix: prevent panel from falling outside user focus,
-        // like when viewports are too small
-        if (isCSR && typeof document.body.scrollIntoView === 'function') {
-            this.template
-                .querySelector('lightning-color-picker-custom')
-                .scrollIntoView();
-        }
-    }
-
     get i18n() {
         return i18n;
     }

package/src/lightning/combobox/combobox.html

@@ -34,7 +34,7 @@
                 variant={variant}></lightning-base-combobox>
         </div>
         <template if:true={_helpMessage}>
-            <div id="help-text" data-help-text class="slds-form-element__help" aria-live="assertive">{_helpMessage}</div>
+            <div id="help-text" data-help-text class="slds-form-element__help" aria-live="polite">{_helpMessage}</div>
         </template>
     </div>
 </template>

package/src/lightning/combobox/form-element.slds.css

@@ -46,7 +46,7 @@
         hyphens: auto;
         display: inline-block;
         color: var(--slds-g-color-on-surface-2);
-        font-size: var(--slds-g-font-scale-neg-3);
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         padding-inline-end: var(--slds-g-spacing-2);
         padding-block-start: var(--slds-g-spacing-1);
         margin-block-end: calc(var(--slds-g-spacing-1) / 2);

package/src/lightning/datatable/autoWidthStrategy.js

@@ -19,27 +19,27 @@ function getTotalColumnWidth(columnWidths) {
 }
 
 /**
- * Determines whether or not a specified width can be removed from a column
+ * Determines the new width of a column of after removing a set amount
  *
  * @param {Number} currentWidth The current width of the column in pixels
  * @param {Number} widthToRemove The proposed amount of width to remove in pixels
  * @param {Number} minColumnWidth The minimum width the column can be in pixels
- * @returns {Boolean} Whether or not the specified width can be removed
+ * @returns {Number} The new width of the column in pixels
  */
-function canRemoveWidth(currentWidth, widthToRemove, minColumnWidth) {
-    return currentWidth - widthToRemove >= minColumnWidth;
+function getReducedWidth(currentWidth, widthToRemove, minColumnWidth) {
+    return Math.max(currentWidth - widthToRemove, minColumnWidth);
 }
 
 /**
- * Determines whether or not a specified width can be added to a column
+ * Determines the new width of a column of after adding a set amount
  *
  * @param {Number} currentWidth The current width of the column in pixels
- * @param {Number} widthToAdd The proposed amount of width to add in pixels
+ * @param {Number} widthToRemove The proposed amount of width to add in pixels
  * @param {Number} maxColumnWidth The maximum width the column can be in pixels
- * @returns {Boolean} Whether or not the specified width can be added
+ * @returns {Number} The new width of the column in pixels
  */
-function canAddWidth(currentWidth, widthToAdd, maxColumnWidth) {
-    return currentWidth + widthToAdd <= maxColumnWidth;
+function getEnlargedWidth(currentWidth, widthToAdd, maxColumnWidth) {
+    return Math.min(currentWidth + widthToAdd, maxColumnWidth);
 }
 
 /**
@@ -397,17 +397,13 @@ export class AutoWidthStrategy {
             for (let i = 0; i < colsWithMinWidthLength; i += 1) {
                 const colIndex = colsWithMinWidth[i];
                 const currentWidth = columnWidths[colIndex];
-                if (
-                    canAddWidth(
-                        currentWidth,
-                        extraWidthPerColumn,
-                        maxColumnWidth
-                    )
-                ) {
-                    const newWidth = currentWidth + extraWidthPerColumn;
-                    columnWidthsSum += extraWidthPerColumn;
-                    columnWidths[colIndex] = newWidth;
-                }
+                const newWidth = getEnlargedWidth(
+                    currentWidth,
+                    extraWidthPerColumn,
+                    maxColumnWidth
+                );
+                columnWidthsSum += newWidth - currentWidth;
+                columnWidths[colIndex] = newWidth;
             }
         }
 
@@ -428,16 +424,13 @@ export class AutoWidthStrategy {
             for (let colIndex = 0; colIndex < colCount; colIndex += 1) {
                 const col = columns[colIndex];
                 const currentWidth = columnWidths[colIndex];
-                if (
-                    !getColumnWidth(col) &&
-                    canAddWidth(
+                if (!getColumnWidth(col)) {
+                    const newWidth = getEnlargedWidth(
                         currentWidth,
                         extraWidthPerColumn,
                         maxColumnWidth
-                    )
-                ) {
-                    const newWidth = currentWidth + extraWidthPerColumn;
-                    columnWidthsSum += extraWidthPerColumn;
+                    );
+                    columnWidthsSum += newWidth - currentWidth;
                     columnWidths[colIndex] = newWidth;
                 }
             }
@@ -474,17 +467,13 @@ export class AutoWidthStrategy {
             for (let i = 0, { length } = colsWithMaxWidth; i < length; i += 1) {
                 const colIndex = colsWithMaxWidth[i];
                 const currentWidth = columnWidths[colIndex];
-                if (
-                    canRemoveWidth(
-                        currentWidth,
-                        extraWidthPerColumn,
-                        minColumnWidth
-                    )
-                ) {
-                    const newWidth = currentWidth - extraWidthPerColumn;
-                    columnWidthsSum -= extraWidthPerColumn;
-                    columnWidths[colIndex] = newWidth;
-                }
+                const newWidth = getReducedWidth(
+                    currentWidth,
+                    extraWidthPerColumn,
+                    minColumnWidth
+                );
+                columnWidthsSum -= currentWidth - newWidth;
+                columnWidths[colIndex] = newWidth;
             }
         }
 
@@ -508,15 +497,14 @@ export class AutoWidthStrategy {
                 const currentWidth = columnWidths[colIndex];
                 if (
                     !colsWithMinWidth.includes(colIndex) &&
-                    !getColumnWidth(col) &&
-                    canRemoveWidth(
+                    !getColumnWidth(col)
+                ) {
+                    const newWidth = getReducedWidth(
                         currentWidth,
                         extraWidthPerColumn,
                         minColumnWidth
-                    )
-                ) {
-                    const newWidth = currentWidth - extraWidthPerColumn;
-                    columnWidthsSum -= extraWidthPerColumn;
+                    );
+                    columnWidthsSum -= currentWidth - newWidth;
                     columnWidths[colIndex] = newWidth;
                 }
             }

package/src/lightning/datatable/columns.js

@@ -273,11 +273,14 @@ export function setColumns(state, rawColumns, types) {
         }
 
         // partially inline updateHeaderInternalActions from datatable/headerActions
+        // change alignment for last col and second-to-last col when last col is
+        // has a fixedWith under 100 (this includes action columns)
         const { actions } = normCol;
         normCol.actions = {
             menuAlignment:
                 normCol.isLastCol ||
-                normalizedColumns[colIndex + 1].type === 'action'
+                normalizedColumns[colIndex + 1].type === 'action' ||
+                normalizedColumns[colIndex + 1].fixedWidth < 100
                     ? 'auto-right'
                     : 'auto-left',
             customerActions: Array.isArray(actions) ? actions : [],

package/src/lightning/datatable/datatable.js

@@ -622,14 +622,11 @@ export default class LightningDatatable extends LightningElement {
                 this.getWrapperHeight,
                 value
             );
-            // if renderConfig already exists, update rendering
-            if (this._renderConfig) {
-                this._renderManager.updateViewportRendering(
-                    this.state,
-                    this.gridContainer,
-                    true
-                );
-            }
+            this._renderManager.updateViewportRendering(
+                this.state,
+                this.gridContainer,
+                true
+            );
             this._renderConfig = value;
         }
     }
@@ -1101,6 +1098,8 @@ export default class LightningDatatable extends LightningElement {
 
         this._columnWidthManager = new ColumnWidthManager(this.widthsData);
         this._privateTypes = new DatatableTypes(this.constructor.customTypes);
+        this._hasSetInitialCustomTypes =
+            !!this._privateTypes.privateCustomTypes.size;
 
         this._renderManager = new RenderManager();
         this.getWrapperHeight = () => getScrollerX(this.template).offsetHeight;

package/src/lightning/datatable/keyboard.js

@@ -481,10 +481,10 @@ export function reactToKeyboardOnRow(dt, event) {
                 reactToArrowRightOnRow(dt, state, template, event);
                 break;
             case ARROW_UP:
-                reactToArrowUpOnRow(dt, state, template, event);
+                reactToArrowUpOnRow(state, template, event);
                 break;
             case ARROW_DOWN:
-                reactToArrowDownOnRow(dt, state, template, event);
+                reactToArrowDownOnRow(state, template, event);
                 break;
             default:
                 break;

package/src/lightning/datatable/rows.js

@@ -404,7 +404,8 @@ export function updateCell(state, rowIndex, colIndex) {
         cell.typeAttribute0 = getRowNumberError(rowErrors, cell.scopeColValue);
     }
 
-    let cellClass = cell.class || '';
+    const cellAttributes = getCellAttributesValues(col);
+    let cellClass = resolveAttributeValue(cellAttributes.class, rowData) || '';
     if (cell.hasTreeData && !cellClass) {
         cellClass += (cellClass.length ? ' ' : '') + TREE__ITEM_CLASS;
     }

package/src/lightning/datepicker/form-element.slds.css

@@ -46,7 +46,7 @@
         hyphens: auto;
         display: inline-block;
         color: var(--slds-g-color-on-surface-2);
-        font-size: var(--slds-g-font-scale-neg-3);
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         padding-inline-end: var(--slds-g-spacing-2);
         padding-block-start: var(--slds-g-spacing-1);
         margin-block-end: calc(var(--slds-g-spacing-1) / 2);

package/src/lightning/datepicker/input-text.slds.css

@@ -246,7 +246,7 @@
         --sds-c-inputtext-text-color: var(--slds-c-inputtext-text-color);
         --sds-c-inputtext-font-size: var(
             --slds-c-inputtext-font-size,
-            var(--slds-g-font-scale-neg-2)
+            var(--slds-g-font-size-base)
         );
         --sds-c-inputtext-text-color-placeholder: var(
             --slds-c-inputtext-text-color-placeholder,
@@ -264,7 +264,7 @@
 
         display: flex;
         flex-wrap: wrap;
-        align-items: center;
+        flex-direction: column;
     }
 /**
    * Input Container
@@ -371,6 +371,10 @@
         --sds-c-inputtext-color-border: var(--slds-g-color-border-disabled-1);
         --sds-c-inputtext-text-color: var(--slds-g-color-on-disabled-2);
     }
+:host([data-render-mode="shadow"][disabled]) [part='input-text'] {
+        --sds-c-inputtext-text-color-placeholder:
+            var(--slds-g-color-on-disabled-2);
+    }
 /**
    * Label
    *
@@ -384,10 +388,7 @@
             --slds-c-inputtext-label-color,
             var(--slds-g-color-on-surface-2)
         );
-        font-size: var(
-            --slds-c-inputtext-label-font-size,
-            var(--slds-g-font-scale-neg-3)
-        );
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         margin-block-end: var(--slds-g-sizing-1);
 
         /* We inline flex to control the spacing between elements and not have to rely on whitespace characters */

package/src/lightning/datetimepicker/form-element.slds.css

@@ -46,7 +46,7 @@
         hyphens: auto;
         display: inline-block;
         color: var(--slds-g-color-on-surface-2);
-        font-size: var(--slds-g-font-scale-neg-3);
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         padding-inline-end: var(--slds-g-spacing-2);
         padding-block-start: var(--slds-g-spacing-1);
         margin-block-end: calc(var(--slds-g-spacing-1) / 2);

package/src/lightning/datetimepicker/input-text.slds.css

@@ -246,7 +246,7 @@
         --sds-c-inputtext-text-color: var(--slds-c-inputtext-text-color);
         --sds-c-inputtext-font-size: var(
             --slds-c-inputtext-font-size,
-            var(--slds-g-font-scale-neg-2)
+            var(--slds-g-font-size-base)
         );
         --sds-c-inputtext-text-color-placeholder: var(
             --slds-c-inputtext-text-color-placeholder,
@@ -264,7 +264,7 @@
 
         display: flex;
         flex-wrap: wrap;
-        align-items: center;
+        flex-direction: column;
     }
 /**
    * Input Container
@@ -371,6 +371,10 @@
         --sds-c-inputtext-color-border: var(--slds-g-color-border-disabled-1);
         --sds-c-inputtext-text-color: var(--slds-g-color-on-disabled-2);
     }
+:host([data-render-mode="shadow"][disabled]) [part='input-text'] {
+        --sds-c-inputtext-text-color-placeholder:
+            var(--slds-g-color-on-disabled-2);
+    }
 /**
    * Label
    *
@@ -384,10 +388,7 @@
             --slds-c-inputtext-label-color,
             var(--slds-g-color-on-surface-2)
         );
-        font-size: var(
-            --slds-c-inputtext-label-font-size,
-            var(--slds-g-font-scale-neg-3)
-        );
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         margin-block-end: var(--slds-g-sizing-1);
 
         /* We inline flex to control the spacing between elements and not have to rely on whitespace characters */

package/src/lightning/dualListbox/form-element.slds.css

@@ -46,7 +46,7 @@
         hyphens: auto;
         display: inline-block;
         color: var(--slds-g-color-on-surface-2);
-        font-size: var(--slds-g-font-scale-neg-3);
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         padding-inline-end: var(--slds-g-spacing-2);
         padding-block-start: var(--slds-g-spacing-1);
         margin-block-end: calc(var(--slds-g-spacing-1) / 2);

package/src/lightning/groupedCombobox/form-element.slds.css

@@ -46,7 +46,7 @@
         hyphens: auto;
         display: inline-block;
         color: var(--slds-g-color-on-surface-2);
-        font-size: var(--slds-g-font-scale-neg-3);
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         padding-inline-end: var(--slds-g-spacing-2);
         padding-block-start: var(--slds-g-spacing-1);
         margin-block-end: calc(var(--slds-g-spacing-1) / 2);

package/src/lightning/groupedCombobox/groupedCombobox.js

@@ -382,10 +382,7 @@ export default class LightningGroupedCombobox extends LightningShadowBaseClass {
         this.interactingState.enter();
         this._expandPillContainer = true;
 
-        if (!this._hasFocus) {
-            this._hasFocus = true;
-            this.dispatchEvent(new CustomEvent('focus'));
-        }
+        this.dispatchEvent(new CustomEvent('focus'));
     }
 
     handlePillsFocus() {
@@ -401,36 +398,32 @@ export default class LightningGroupedCombobox extends LightningShadowBaseClass {
     }
 
     handleBlur() {
-        this._hasFocus = false;
-
         // Once https://github.com/salesforce/lwc/issues/444 is fixed, consider switching to
         // `onfocusout` and `event.relatedTarget` to determine whether the focus stayed in the component,
         // this way the use of async blur can be avoided.
         // eslint-disable-next-line @lwc/lwc/no-async-operation
         requestAnimationFrame(() => {
-            if (!this._hasFocus) {
-                this.interactingState.leave();
-
-                this.dispatchEvent(new CustomEvent('blur'));
-                if (this.pills && this.pills.length > 0) {
-                    // Sometimes (involves focusing on lower pills) the pill container scrolls and the top
-                    // line with the "+ n more" button does not show so we have to manually scroll to the top.
-                    // We need to figure a better solution for this.
-                    // eslint-disable-next-line @lwc/lwc/no-async-operation
-                    requestAnimationFrame(() => {
-                        if (this._connected) {
-                            // If a new pill has been added but the markup-conditional hasn't had a chance to
-                            // initialize the pill container, and causes a null gack. Adding a quick safety
-                            // check here to avoid this case
-                            const pillContainer = this.template.querySelector(
-                                'lightning-pill-container'
-                            );
-                            if (pillContainer) {
-                                pillContainer.scrollTop = 0;
-                            }
+            this.interactingState.leave();
+
+            this.dispatchEvent(new CustomEvent('blur'));
+            if (this.pills && this.pills.length > 0) {
+                // Sometimes (involves focusing on lower pills) the pill container scrolls and the top
+                // line with the "+ n more" button does not show so we have to manually scroll to the top.
+                // We need to figure a better solution for this.
+                // eslint-disable-next-line @lwc/lwc/no-async-operation
+                requestAnimationFrame(() => {
+                    if (this._connected) {
+                        // If a new pill has been added but the markup-conditional hasn't had a chance to
+                        // initialize the pill container, and causes a null gack. Adding a quick safety
+                        // check here to avoid this case
+                        const pillContainer = this.template.querySelector(
+                            'lightning-pill-container'
+                        );
+                        if (pillContainer) {
+                            pillContainer.scrollTop = 0;
                         }
-                    });
-                }
+                    }
+                });
             }
         });
     }

package/src/lightning/groupedCombobox/input-text.slds.css

@@ -246,7 +246,7 @@
         --sds-c-inputtext-text-color: var(--slds-c-inputtext-text-color);
         --sds-c-inputtext-font-size: var(
             --slds-c-inputtext-font-size,
-            var(--slds-g-font-scale-neg-2)
+            var(--slds-g-font-size-base)
         );
         --sds-c-inputtext-text-color-placeholder: var(
             --slds-c-inputtext-text-color-placeholder,
@@ -264,7 +264,7 @@
 
         display: flex;
         flex-wrap: wrap;
-        align-items: center;
+        flex-direction: column;
     }
 /**
    * Input Container
@@ -371,6 +371,10 @@
         --sds-c-inputtext-color-border: var(--slds-g-color-border-disabled-1);
         --sds-c-inputtext-text-color: var(--slds-g-color-on-disabled-2);
     }
+:host([data-render-mode="shadow"][disabled]) [part='input-text'] {
+        --sds-c-inputtext-text-color-placeholder:
+            var(--slds-g-color-on-disabled-2);
+    }
 /**
    * Label
    *
@@ -384,10 +388,7 @@
             --slds-c-inputtext-label-color,
             var(--slds-g-color-on-surface-2)
         );
-        font-size: var(
-            --slds-c-inputtext-label-font-size,
-            var(--slds-g-font-scale-neg-3)
-        );
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         margin-block-end: var(--slds-g-sizing-1);
 
         /* We inline flex to control the spacing between elements and not have to rely on whitespace characters */

package/src/lightning/helptext/button-icon.slds.css

@@ -299,6 +299,14 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
    --sds-c-button-color-border-disabled: var(--slds-g-color-border-disabled-1);
    --sds-c-button-text-color-disabled: var(--slds-g-color-on-disabled-1);
    --sds-c-button-color-background-disabled: var(--slds-g-color-disabled-container-1);
+
+   /** 
+    * Needed to override 
+    * `pointer-event: none` coming from sds
+    * that prevent tooltip from showing
+   */
+   pointer-events: auto;
+   cursor: default;
 }
 /**
   * A note about fallbacks on the default variant:
@@ -545,19 +553,19 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
   --sds-c-button-color-border-disabled: var(--slds-g-color-border-disabled-1);
 }
 /* slds-icon interaction states */
-:host([data-render-mode="shadow"]) [part~='button-icon']:not(.slds-is-selected):hover {
+:host([data-render-mode="shadow"]) [part~='button-icon']:hover {
   --slds-c-icon-color-foreground: var(
-    --slds-c-buttonicon-color-foreground-hover,
+    --slds-c-buttonicon-color-foreground-hover, 
     var(--slds-g-color-accent-3)
   );
 }
-:host([data-render-mode="shadow"]) [part~='button-icon']:not(.slds-is-selected):focus {
+:host([data-render-mode="shadow"]) [part~='button-icon']:focus {
   --slds-c-icon-color-foreground: var(
     --slds-c-buttonicon-color-foreground-focus,
     var(--slds-g-color-accent-3)
   );
 }
-:host([data-render-mode="shadow"]) [part~='button-icon']:not(.slds-is-selected):active {
+:host([data-render-mode="shadow"]) [part~='button-icon']:active {
   --slds-c-icon-color-foreground: var(
     --slds-c-buttonicon-color-foreground-active,
     var(--slds-g-color-accent-3)
@@ -635,7 +643,7 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
 
   /* Icon */
   --slds-c-buttonicon-color-foreground: var(--slds-g-color-neutral-base-100);
-  --slds-c-buttonicon-color-foreground-hover: var(--slds-g-color-neutral-base-95);
+  --slds-c-buttonicon-color-foreground-hover: color-mix(in oklab, var(--slds-g-color-on-surface-inverse-1), transparent 25%);
   --slds-c-buttonicon-color-foreground-focus: var(--slds-g-color-neutral-base-95);
   --slds-c-buttonicon-color-foreground-active: var(--slds-g-color-neutral-base-90);
 

package/src/lightning/helptext/form-element.slds.css

@@ -46,7 +46,7 @@
         hyphens: auto;
         display: inline-block;
         color: var(--slds-g-color-on-surface-2);
-        font-size: var(--slds-g-font-scale-neg-3);
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         padding-inline-end: var(--slds-g-spacing-2);
         padding-block-start: var(--slds-g-spacing-1);
         margin-block-end: calc(var(--slds-g-spacing-1) / 2);

package/src/lightning/helptext/helptext.html

@@ -5,9 +5,10 @@
             icon-class={computedIconClass}
             variant={computedButtonVariant}
             alternative-text={alternativeText}
+            disable-alternative-text-title
             tooltip={content}
-            onprivatebuttoniconregister={handleButtonIconRegister}
             tabindex={tabIndex}
+            tooltip-type="toggle"
         ></lightning-button-icon>
     </div>
 </template>

package/src/lightning/helptext/helptext.js

@@ -3,7 +3,6 @@ import { api, track } from 'lwc';
 import LightningShadowBaseClass from 'lightning/shadowBaseClassPrivate';
 import { isValidName } from 'lightning/iconUtils';
 import { normalizeString } from 'lightning/utilsPrivate';
-import { TooltipType } from 'lightning/tooltipLibrary';
 
 const DEFAULT_BUTTON_ALT_TEXT = labelButtonAlternativeText;
 const DEFAULT_ICON_NAME = 'utility:info';
@@ -145,15 +144,4 @@ export default class LightningHelptext extends LightningShadowBaseClass {
                 return '';
         }
     }
-
-    /**
-     * Set lightning-button-icon tooltips to be created with toggle events
-     * and without the title attribute computed from alternative text (see W-12496300)
-     * @param {*} event
-     */
-    handleButtonIconRegister(event) {
-        event.stopPropagation();
-        event.detail.setTooltipType(TooltipType.Toggle);
-        event.detail.showTitle(false);
-    }
 }

package/src/lightning/input/form-element.slds.css

@@ -46,7 +46,7 @@
         hyphens: auto;
         display: inline-block;
         color: var(--slds-g-color-on-surface-2);
-        font-size: var(--slds-g-font-scale-neg-3);
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         padding-inline-end: var(--slds-g-spacing-2);
         padding-block-start: var(--slds-g-spacing-1);
         margin-block-end: calc(var(--slds-g-spacing-1) / 2);

package/src/lightning/inputAddress/form-element.slds.css

@@ -46,7 +46,7 @@
         hyphens: auto;
         display: inline-block;
         color: var(--slds-g-color-on-surface-2);
-        font-size: var(--slds-g-font-scale-neg-3);
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         padding-inline-end: var(--slds-g-spacing-2);
         padding-block-start: var(--slds-g-spacing-1);
         margin-block-end: calc(var(--slds-g-spacing-1) / 2);

package/src/lightning/inputAddress/input-text.slds.css

@@ -246,7 +246,7 @@
         --sds-c-inputtext-text-color: var(--slds-c-inputtext-text-color);
         --sds-c-inputtext-font-size: var(
             --slds-c-inputtext-font-size,
-            var(--slds-g-font-scale-neg-2)
+            var(--slds-g-font-size-base)
         );
         --sds-c-inputtext-text-color-placeholder: var(
             --slds-c-inputtext-text-color-placeholder,
@@ -264,7 +264,7 @@
 
         display: flex;
         flex-wrap: wrap;
-        align-items: center;
+        flex-direction: column;
     }
 /**
    * Input Container
@@ -371,6 +371,10 @@
         --sds-c-inputtext-color-border: var(--slds-g-color-border-disabled-1);
         --sds-c-inputtext-text-color: var(--slds-g-color-on-disabled-2);
     }
+:host([data-render-mode="shadow"][disabled]) [part='input-text'] {
+        --sds-c-inputtext-text-color-placeholder:
+            var(--slds-g-color-on-disabled-2);
+    }
 /**
    * Label
    *
@@ -384,10 +388,7 @@
             --slds-c-inputtext-label-color,
             var(--slds-g-color-on-surface-2)
         );
-        font-size: var(
-            --slds-c-inputtext-label-font-size,
-            var(--slds-g-font-scale-neg-3)
-        );
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         margin-block-end: var(--slds-g-sizing-1);
 
         /* We inline flex to control the spacing between elements and not have to rely on whitespace characters */

package/src/lightning/inputLocation/form-element.slds.css

@@ -46,7 +46,7 @@
         hyphens: auto;
         display: inline-block;
         color: var(--slds-g-color-on-surface-2);
-        font-size: var(--slds-g-font-scale-neg-3);
+        font-size: var(--slds-s-label-font-size, var(--slds-g-font-scale-neg-2));
         padding-inline-end: var(--slds-g-spacing-2);
         padding-block-start: var(--slds-g-spacing-1);
         margin-block-end: calc(var(--slds-g-spacing-1) / 2);