lightning-base-components 1.26.4-alpha → 1.27.5-alpha

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

@@ -1,5 +1,5 @@
 /*******************************************
-* Imported dependency from @salesforce-ux/sds-primitives/src/sds/inputText/inputText.css
+* Imported dependency from @salesforce-ux/sds-components/src/sds/inputText/inputText.css
 *******************************************/
 /**
  * Input container
@@ -225,118 +225,102 @@
    * Input Text
    */
 :host([data-render-mode="shadow"]) [part='input-text'] {
-        /* Host reassignments to composed slds-icon */
-        --slds-c-icon-color-foreground: var(
-            --slds-c-inputtext-icon-color-foreground,
-            var(--slds-g-color-on-surface-1)
-        );
-        --slds-c-icon-sizing: var(--slds-c-inputtext-icon-sizing, 14px);
-        --sds-c-inputtext-sizing-height: var(
-            --slds-c-inputtext-sizing-height,
-            var(--slds-g-sizing-9)
-        );
-        --sds-c-inputtext-color-background: var(
-            --slds-c-inputtext-color-background,
-            var(--slds-g-color-surface-container-1)
-        );
-        --sds-c-inputtext-color-background-focus: var(
-            --slds-c-inputtext-color-background-focus,
-            var(--slds-g-color-surface-container-1)
-        );
-        --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-size-base)
-        );
-        --sds-c-inputtext-text-color-placeholder: var(
-            --slds-c-inputtext-text-color-placeholder,
-            var(--slds-g-color-on-surface-1)
-        );
-        --sds-c-inputtext-color-border: var(
-            --slds-c-inputtext-color-border,
-            var(--slds-g-color-border-2)
-        );
-        --sds-c-inputtext-sizing-border: var(--slds-c-inputtext-sizing-border);
-        --sds-c-inputtext-radius-border: var(
-            --slds-c-inputtext-radius-border,
-            var(--slds-g-radius-border-2)
-        );
+  /* Host reassignments to composed slds-icon */
+  --slds-c-icon-color-foreground: var(
+    --slds-c-inputtext-icon-color-foreground,
+    var(--slds-g-color-on-surface-1)
+  );
+  --slds-c-icon-sizing: var(--slds-c-inputtext-icon-sizing, 14px);
+  --sds-c-inputtext-sizing-height: var(--slds-c-inputtext-sizing-height, var(--slds-g-sizing-9));
+  --sds-c-inputtext-color-background: var(
+    --slds-c-inputtext-color-background,
+    var(--slds-g-color-surface-container-1)
+  );
+  --sds-c-inputtext-color-background-focus: var(
+    --slds-c-inputtext-color-background-focus,
+    var(--slds-g-color-surface-container-1)
+  );
+  --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-size-base));
+  --sds-c-inputtext-text-color-placeholder: var(
+    --slds-c-inputtext-text-color-placeholder,
+    var(--slds-g-color-on-surface-1)
+  );
+  --sds-c-inputtext-color-border: var(--slds-c-inputtext-color-border, var(--slds-g-color-border-2));
+  --sds-c-inputtext-sizing-border: var(--slds-c-inputtext-sizing-border);
+  --sds-c-inputtext-radius-border: var(--slds-c-inputtext-radius-border, var(--slds-g-radius-border-2));
 
-        display: flex;
-        flex-wrap: wrap;
-        flex-direction: column;
-    }
+  display: flex;
+  flex-wrap: wrap;
+  flex-direction: column;
+}
 /**
    * Input Container
    */
 :host([data-render-mode="shadow"]) [part='input-container'] {
-        flex: 1 0 100%;
-        align-items: stretch;
-        --sds-c-inputtext-spacing-inline: 0;
-        --sds-c-inputtext-spacing-block: 0;
-    }
+  flex: 1 0 100%;
+  align-items: stretch;
+  --sds-c-inputtext-spacing-inline: 0;
+  --sds-c-inputtext-spacing-block: 0;
+}
 :host([data-render-mode="shadow"]) [part='input-container'][type='range'] {
-        border: none;
-        display: inline-block;
-    }
+  border: none;
+  display: inline-block;
+}
 :host([data-render-mode="shadow"]) [part='input-container'] .slds-input__icon:not(button) {
-            pointer-events: none;
-    }
+  pointer-events: none;
+}
 :host([data-render-mode="shadow"]) [part='input'][type='range'] {
-        min-height: calc(1.875rem + (1px * 2));
-        margin: 0;
-    }
+  min-height: calc(1.875rem + (1px * 2));
+  margin: 0;
+}
 :host([data-render-mode="shadow"]) [part='input-container'][type='range']:focus-within,:host([data-render-mode="shadow"]) 
-    [part='input-container'][type='range']:active {
-        --sds-c-inputtext-color-border: var(--slds-g-color-border-accent-1);
-        --sds-c-inputtext-shadow: 0 0 3px var(--slds-g-color-accent-2);
-        --sds-c-inputtext-color-background: var(--slds-g-color-surface-container-1);
+[part='input-container'][type='range']:active {
+  --sds-c-inputtext-color-border: var(--slds-g-color-border-accent-1);
+  --sds-c-inputtext-shadow: 0 0 3px var(--slds-g-color-accent-2);
+  --sds-c-inputtext-color-background: var(--slds-g-color-surface-container-1);
 
-        outline: 0;
-        border-width: var(--sds-c-inputtext-sizing-border, var(--slds-g-sizing-border-1));
-        border-color: var(--sds-c-inputtext-color-border, var(--slds-g-color-border-2));
-    }
+  outline: 0;
+  border-width: var(--sds-c-inputtext-sizing-border, var(--slds-g-sizing-border-1));
+  border-color: var(--sds-c-inputtext-color-border, var(--slds-g-color-border-2));
+}
 /**
    * Input
    */
 :host([data-render-mode="shadow"]) [part='input'] {
-        padding-inline-start: var(
-            --slds-c-inputtext-spacing-inlinestart,
-            var(--slds-g-spacing-3));
-        padding-inline-end: var(
-            --slds-c-inputtext-spacing-inlineend,
-            var(--slds-g-spacing-4));
-        height: unset;
-        font-family: var(--slds-g-font-family);
-    }
+  padding-inline-start: var(--slds-c-inputtext-spacing-inlinestart, var(--slds-g-spacing-3));
+  padding-inline-end: var(--slds-c-inputtext-spacing-inlineend, var(--slds-g-spacing-4));
+  height: unset;
+  font-family: var(--slds-g-font-family);
+}
 /**
    * Focus / active State
    */
-:host(:not([disabled])) [part="input-container"]:focus-within,
-   :host(:not([disabled])) [part="input-container"]:active {
-      --sds-c-inputtext-color-border: var(--slds-g-color-border-accent-1);
-      --sds-c-inputtext-shadow: 0 0 var(--slds-g-sizing-border-3) var(--slds-g-color-accent-2);
-      --sds-c-inputtext-color-background: var(--slds-g-color-surface-container-1);
+:host(:not([disabled])) [part='input-container']:focus-within,
+:host(:not([disabled])) [part='input-container']:active {
+  --sds-c-inputtext-color-border: var(--slds-g-color-border-accent-1);
+  --sds-c-inputtext-shadow: 0 0 var(--slds-g-sizing-border-3) var(--slds-g-color-accent-2);
+  --sds-c-inputtext-color-background: var(--slds-g-color-surface-container-1);
 
-      outline: 0;
-    }
+  outline: 0;
+}
 /**
    * Read Only State
    */
 :host([data-render-mode="shadow"][readonly]) [part='input-text'] {
-        --sds-c-inputtext-spacing-inline-start-readonly: 0;
-        --sds-c-inputtext-color-border-focus: transparent;
-        --slds-c-inputtext-color-border: transparent;
-        --slds-c-inputtext-color-background: transparent;
-        --slds-c-inputtext-color-background-focus: transparent;
-    }
-:host([data-render-mode="shadow"][readonly]) [part="input-container"]:focus-within,:host([data-render-mode="shadow"][readonly]) [part="input-container"]:active {
-       --sds-c-inputtext-color-border: var(--slds-g-color-disabled-container-2);
-       --sds-c-inputtext-shadow: 0 0 var(--slds-g-sizing-border-3) var(--slds-g-color-accent-2);
-       --sds-c-inputtext-color-background: transparent;
+  --sds-c-inputtext-spacing-inline-start-readonly: 0;
+  --sds-c-inputtext-color-border-focus: transparent;
+  --slds-c-inputtext-color-border: transparent;
+  --slds-c-inputtext-color-background: transparent;
+  --slds-c-inputtext-color-background-focus: transparent;
+}
+:host([data-render-mode="shadow"][readonly]) [part='input-container']:focus-within,:host([data-render-mode="shadow"][readonly]) [part='input-container']:active {
+  --sds-c-inputtext-color-border: var(--slds-g-color-disabled-container-2);
+  --sds-c-inputtext-shadow: 0 0 var(--slds-g-sizing-border-3) var(--slds-g-color-accent-2);
+  --sds-c-inputtext-color-background: transparent;
 
-       outline: 0;
-     }
+  outline: 0;
+}
 /**
    * Invalid State
    *
@@ -345,25 +329,24 @@
    * uses :host([invalid]).
    */
 :host([data-render-mode="shadow"][invalid]) [part='input-text'] {
-        --sds-c-inputtext-shadow: 0 0 0 var(--slds-g-sizing-border-1) inset
-            var(--slds-g-color-error-1);
-        --slds-c-inputtext-color-border: var(--slds-g-color-border-error-1);
-        --slds-c-icon-color-foreground: var(--slds-g-color-error-1);
-    }
+  --sds-c-inputtext-shadow: 0 0 0 var(--slds-g-sizing-border-1) inset var(--slds-g-color-error-1);
+  --slds-c-inputtext-color-border: var(--slds-g-color-border-error-1);
+  --slds-c-icon-color-foreground: var(--slds-g-color-error-1);
+}
 :host([data-render-mode="shadow"][invalid]) .slds-input-has-icon .slds-button_icon:hover {
-        --slds-c-icon-color-foreground: var(--slds-g-color-error-1);
-     }
-:host([data-render-mode="shadow"][invalid]) input[type="search"] {
-      --slds-c-input-color-background: var(--slds-s-input-color-background-invalid);
-      --slds-c-input-color-border: var(--slds-g-color-border-error-1);
-      --slds-c-input-text-color: var(--slds-s-input-color-invalid);
+  --slds-c-icon-color-foreground: var(--slds-g-color-error-1);
+}
+:host([data-render-mode="shadow"][invalid]) input[type='search'] {
+  --slds-c-input-color-background: var(--slds-s-input-color-background-invalid);
+  --slds-c-input-color-border: var(--slds-g-color-border-error-1);
+  --slds-c-input-text-color: var(--slds-s-input-color-invalid);
 
-      background-clip: padding-box;
-    }
-:host([data-render-mode="shadow"][invalid]) input[type="search"] + lightning-primitive-icon::part(icon) {
-      fill: var(--slds-g-color-error-1);
-      color: var(--slds-g-color-error-1);
-    }
+  background-clip: padding-box;
+}
+:host([data-render-mode="shadow"][invalid]) input[type='search'] + lightning-primitive-icon::part(icon) {
+  fill: var(--slds-g-color-error-1);
+  color: var(--slds-g-color-error-1);
+}
 /**
    * Invalid State - Focus
    *
@@ -371,26 +354,28 @@
    * here to prevent a bug with the focus state border and box-shadow
    */
 :host([data-render-mode="shadow"][invalid]) [part='input-container']:focus-within {
-      --sds-c-inputtext-shadow:
-        var(--slds-g-color-error-base-50) 0 0 0 var(--slds-g-sizing-border-1) inset,
-        0 0 var(--slds-g-sizing-border-3) var(--slds-g-color-border-error-1);
-      --sds-c-inputtext-color-border: var(--slds-g-color-error-1);
-    }
+  --sds-c-inputtext-shadow:
+    var(--slds-g-color-error-base-50) 0 0 0 var(--slds-g-sizing-border-1) inset,
+    0 0 var(--slds-g-sizing-border-3) var(--slds-g-color-border-error-1);
+  --sds-c-inputtext-color-border: var(--slds-g-color-error-1);
+}
 /**
    * Disabled State
    *
    * Both parts form the visible form control.
    */
 :host([data-render-mode="shadow"][disabled]) [part='input-container'],:host([data-render-mode="shadow"][disabled]) [part='input'] {
-        cursor: not-allowed;
-        --sds-c-inputtext-color-background: var(--slds-s-input-color-background-disabled, var(--slds-g-color-disabled-container-1));
-        --sds-c-inputtext-color-border: var(--slds-g-color-border-disabled-1);
-        --sds-c-inputtext-text-color: var(--slds-g-color-on-disabled-2);
-    }
+  cursor: not-allowed;
+  --sds-c-inputtext-color-background: var(
+    --slds-s-input-color-background-disabled,
+    var(--slds-g-color-disabled-container-1)
+  );
+  --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);
-    }
+  --sds-c-inputtext-text-color-placeholder: var(--slds-g-color-on-disabled-2);
+}
 /**
    * Label
    *
@@ -398,17 +383,14 @@
    * avoid collisions with other components using [part='label'] (e.g. slds-input-checkbox)
    */
 :host([data-render-mode="shadow"]) [part='input-text'] [part='label'] {
-        padding-block-start: var(--slds-g-spacing-1);
-        padding-inline-end: var(--slds-g-spacing-2);
-        color: var(
-            --slds-c-inputtext-label-color,
-            var(--slds-g-color-on-surface-2)
-        );
-        margin-block-end: var(--slds-g-sizing-1);
+  padding-block-start: var(--slds-g-spacing-1);
+  padding-inline-end: var(--slds-g-spacing-2);
+  color: var(--slds-c-inputtext-label-color, var(--slds-g-color-on-surface-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 */
-        display: inline-flex;
-    }
+  /* We inline flex to control the spacing between elements and not have to rely on whitespace characters */
+  display: inline-flex;
+}
 /**
    * Start
    *
@@ -417,8 +399,8 @@
    * the icon in the inline help text.
    */
 :host([data-render-mode="shadow"]) [part='start'] {
-        --slds-c-icon-spacing-inlineend: var(--slds-g-spacing-2);
-    }
+  --slds-c-icon-spacing-inlineend: var(--slds-g-spacing-2);
+}
 /**
    * Label Inline Variant
    *
@@ -432,75 +414,79 @@
    * Ref: https://github.com/salesforce-ux/design-system-internal/blob/240-winter-23/ui/components/form-element/horizontal/_index.scss#L63
    */
 @media (width >= 48em) {
-        :host([data-render-mode="shadow"][variant='label-inline']) [part='input-text'] {
-            display: block;
-        }
+  :host([data-render-mode="shadow"][variant='label-inline']) [part='input-text'] {
+    display: block;
+  }
 
-        :host([data-render-mode="shadow"][variant='label-inline']) [part='label'] {
-            float: left;
+  :host([data-render-mode="shadow"][variant='label-inline']) [part='label'] {
+    float: left;
 
-            /* TODO: Get rid of these magic numbers */
-            max-width: calc(33% - 1.125rem);
-            padding-block-start: var(--slds-g-spacing-1);
-        }
+    /* TODO: Get rid of these magic numbers */
+    max-width: calc(33% - 1.125rem);
+    padding-block-start: var(--slds-g-spacing-1);
+  }
 
-        :host([data-render-mode="shadow"][variant='label-inline']) [part='input-container'] {
-            margin-inline-start: 33%;
-        }
+  :host([data-render-mode="shadow"][variant='label-inline']) [part='input-container'] {
+    margin-inline-start: 33%;
+  }
 
-        :host([data-render-mode="shadow"][variant='label-inline']) [part='inline-help'] {
-            float: left;
-            padding-block-start: var(--slds-g-spacing-1);
-        }
-    }
-:host([data-render-mode="shadow"]) input[type="search"] + lightning-primitive-icon::part(icon) {
-        left: var(--slds-g-spacing-3);
-        fill: var(--slds-g-color-on-surface-1);
-    }
+  :host([data-render-mode="shadow"][variant='label-inline']) [part='inline-help'] {
+    float: left;
+    padding-block-start: var(--slds-g-spacing-1);
+  }
+}
+:host([data-render-mode="shadow"]) input[type='search'] + lightning-primitive-icon::part(icon) {
+  left: var(--slds-g-spacing-3);
+  fill: var(--slds-g-color-on-surface-1);
+}
 :host([data-render-mode="shadow"]) .slds-input-has-icon .slds-button_icon {
-        background-color: transparent;
-    }
+  background-color: transparent;
+}
 :host([data-render-mode="shadow"]) .slds-input-has-icon .slds-button_icon:focus,:host([data-render-mode="shadow"]) 
-    .slds-input-has-icon .slds-button_icon:hover {
-        --slds-c-icon-color-foreground: var(--slds-g-color-accent-3);
-    }
+.slds-input-has-icon .slds-button_icon:hover {
+  --slds-c-icon-color-foreground: var(--slds-g-color-accent-3);
+}
 :host([data-render-mode="shadow"]) .slds-input-has-icon .slds-input__icon {
-        width: 0.875rem;
-        height: 0.875rem;
-        position: absolute;
-        top: 50%;
-        margin-top: -0.4375rem;
-        line-height: 1;
-        border: 0;
-        z-index: 2;
-    }
+  width: 0.875rem;
+  height: 0.875rem;
+  position: absolute;
+  top: 50%;
+  margin-top: -0.4375rem;
+  line-height: 1;
+  border: 0;
+  z-index: 2;
+}
 /**
    * Has Icon Left
    */
 :host([data-render-mode="shadow"]) .slds-input-has-icon_left {
-        --slds-c-inputtext-spacing-inlinestart: var(--slds-g-spacing-6);
-    }
+  --slds-c-inputtext-spacing-inlinestart: var(--slds-g-spacing-6);
+}
 :host([data-render-mode="shadow"]) .slds-input-has-icon_left .slds-input__icon,:host([data-render-mode="shadow"]) 
-    .slds-input-has-icon_left-right .slds-input__icon_left {
-        inset-inline-start: var(--slds-g-spacing-3);
-    }
+.slds-input-has-icon_left-right .slds-input__icon_left {
+  inset-inline-start: var(--slds-g-spacing-3);
+}
+:host([data-render-mode="shadow"]) .slds-input-has-icon_left lightning-primitive-icon::part(icon) {
+  /* Native Shadow CSS deviates from synthetic in that it does not require different styling for inline variant */
+  left: var(--slds-g-spacing-2);
+}
 /**
    * Has Icon Right
    */
 :host([data-render-mode="shadow"]) .slds-input-has-icon_right {
-        --slds-c-inputtext-spacing-inlineend: var(--slds-g-spacing-6);
-    }
+  --slds-c-inputtext-spacing-inlineend: var(--slds-g-spacing-6);
+}
 :host([data-render-mode="shadow"]) .slds-input-has-icon_right .slds-input__icon,:host([data-render-mode="shadow"]) 
-    .slds-input-has-icon_left-right .slds-input__icon_right {
-        inset-inline-end: var(--slds-g-spacing-3);
-    }
+.slds-input-has-icon_left-right .slds-input__icon_right {
+  inset-inline-end: var(--slds-g-spacing-3);
+}
 /**
    * Has Icon Left & Right
    */
 :host([data-render-mode="shadow"]) .slds-input-has-icon_left-right {
-        --slds-c-inputtext-spacing-inlinestart: var(--slds-g-spacing-6);
-        --slds-c-inputtext-spacing-inlineend: var(--slds-g-spacing-6);
-    }
+  --slds-c-inputtext-spacing-inlinestart: var(--slds-g-spacing-6);
+  --slds-c-inputtext-spacing-inlineend: var(--slds-g-spacing-6);
+}
 /**
  * A temporarily baked-in utility class until SLDS gets a proper utility package.
  *
@@ -509,14 +495,14 @@
  * utility package solution.
  */
 :host([data-render-mode="shadow"]) .slds-assistive-text {
-    position: absolute !important;
-    margin: -1px !important;
-    border: 0 !important;
-    padding: 0 !important;
-    width: 1px !important;
-    height: 1px !important;
-    overflow: hidden !important;
-    clip: rect(0 0 0 0) !important;
-    text-transform: none !important;
-    white-space: nowrap !important;
-  }
+  position: absolute !important;
+  margin: -1px !important;
+  border: 0 !important;
+  padding: 0 !important;
+  width: 1px !important;
+  height: 1px !important;
+  overflow: hidden !important;
+  clip: rect(0 0 0 0) !important;
+  text-transform: none !important;
+  white-space: nowrap !important;
+}

package/src/lightning/primitiveInputColor/primitiveInputColor.css

@@ -2,4 +2,4 @@
 
 :host(:not([invalid])) .slds-form-element__help {
     margin-top: 0px !important;
-}
+}

package/src/lightning/primitiveInputFile/button.slds.css

@@ -1,5 +1,5 @@
 /*******************************************
-* Imported dependency from @salesforce-ux/sds-primitives/src/sds/button/button.css
+* Imported dependency from @salesforce-ux/sds-components/src/sds/button/button.css
 *******************************************/
 /* Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
 Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
@@ -187,14 +187,13 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
   --slds-c-icon-sizing: 0.875rem;
   --slds-c-icon-color-foreground: currentcolor;
 
-
   --sds-c-button-font-lineheight: var(
     --slds-c-button-neutral-font-lineheight,
     var(--slds-s-button-font-lineheight, 1.875rem)
   );
   --sds-c-button-spacing-inline: var(
     --slds-c-button-neutral-spacing-inline,
-    var(--slds-s-button-spacing-inline, var(--slds-g-spacing-4));
+    var(--slds-s-button-spacing-inline, var(--slds-g-spacing-4)) ;
   );
   --sds-c-button-spacing-block: var(--slds-c-button-neutral-spacing-block);
 
@@ -214,7 +213,6 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
     * In all other variants, it is ok to use the previous state as a fallback value.
     */
 
-
   /* Border radius - shared */
   --sds-c-button-radius-border-startstart: var(
     --slds-c-button-radius-border-startstart,
@@ -257,7 +255,10 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
     --slds-c-button-neutral-color-background-hover,
     var(--slds-g-color-surface-container-2)
   );
-  --sds-c-button-color-background-focus: var(--slds-c-button-neutral-color-background-focus, var(--slds-g-color-surface-container-2));
+  --sds-c-button-color-background-focus: var(
+    --slds-c-button-neutral-color-background-focus,
+    var(--slds-g-color-surface-container-2)
+  );
   --sds-c-button-color-background-active: var(
     --slds-c-button-neutral-color-background-active,
     var(--slds-g-color-surface-container-2)
@@ -280,8 +281,14 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
 
   /* Text color */
   --sds-c-button-text-color: var(--slds-c-button-neutral-text-color, var(--slds-g-color-accent-2));
-  --sds-c-button-text-color-hover: var(--slds-c-button-neutral-text-color-hover, var(--slds-s-button-color-hover, var(--slds-g-color-accent-3)));
-  --sds-c-button-text-color-focus: var(--slds-c-button-neutral-text-color-focus, var(--slds-g-color-accent-3));
+  --sds-c-button-text-color-hover: var(
+    --slds-c-button-neutral-text-color-hover,
+    var(--slds-s-button-color-hover, var(--slds-g-color-accent-3))
+  );
+  --sds-c-button-text-color-focus: var(
+    --slds-c-button-neutral-text-color-focus,
+    var(--slds-g-color-accent-3)
+  );
   --sds-c-button-text-color-active: var(
     --slds-c-button-neutral-text-color-active,
     var(--slds-g-color-accent-3)
@@ -293,17 +300,17 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
 }
 /* Overriding primitiveBaseButton */
 :host([data-render-mode="shadow"]) [part~='button']:disabled {
-   --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);
+  --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;
+  pointer-events: auto;
+  cursor: default;
 }
 /**
   * A note about fallbacks on the default variant:
@@ -414,9 +421,18 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
   --slds-c-button-neutral-text-color-hover: var(--slds-g-color-error-1);
   --slds-c-button-neutral-text-color-focus: var(--slds-g-color-error-1);
   --slds-c-button-neutral-text-color-active: var(--slds-g-color-error-1);
-  --slds-c-button-neutral-color-border-hover: var(--slds-c-button-neutral-color-border, var(--slds-g-color-border-1));
-  --slds-c-button-neutral-color-border-focus: var(--slds-c-button-neutral-color-border, var(--slds-g-color-border-1));
-  --slds-c-button-neutral-color-border-active: var(--slds-c-button-neutral-color-border, var(--slds-g-color-border-1));
+  --slds-c-button-neutral-color-border-hover: var(
+    --slds-c-button-neutral-color-border,
+    var(--slds-g-color-border-1)
+  );
+  --slds-c-button-neutral-color-border-focus: var(
+    --slds-c-button-neutral-color-border,
+    var(--slds-g-color-border-1)
+  );
+  --slds-c-button-neutral-color-border-active: var(
+    --slds-c-button-neutral-color-border,
+    var(--slds-g-color-border-1)
+  );
 }
 :host([data-render-mode="shadow"][variant='brand']) [part~='button']:disabled,:host([data-render-mode="shadow"][variant='success']) [part~='button']:disabled,:host([data-render-mode="shadow"][variant='destructive']) [part~='button']:disabled {
   --sds-c-button-color-background: var(--slds-g-color-disabled-container-2);
@@ -436,7 +452,7 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
 /**
   * text variant is for button-stateful
 */
-:host([data-render-mode="shadow"][variant='base']) [part~='button'],:host([data-render-mode="shadow"][variant='text']) [part~='button']{
+:host([data-render-mode="shadow"][variant='base']) [part~='button'],:host([data-render-mode="shadow"][variant='text']) [part~='button'] {
   --sds-c-button-spacing-inline: 0;
   --slds-c-button-neutral-text-color: var(--slds-g-color-accent-2);
   --slds-c-button-neutral-color-border: transparent;
@@ -483,7 +499,6 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
 :host([data-render-mode="shadow"]) [part~='end'] {
   display: inline-flex;
   padding-inline-start: 0;
-
 }
 /**
  * A temporarily baked-in utility class until SLDS gets a proper utility package.

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

@@ -1,5 +1,4 @@
 
-
 /**
  * sldsFormElementUtils.css and form-element.css have many similarities
  * however, they are used for very different use cases, and this is why
@@ -255,7 +254,9 @@
   display: block;
 }
 
-:host([data-render-mode="shadow"][variant='label-stacked']) .slds-form-element__label,:host([data-render-mode="shadow"][variant="label-stacked"]) ::part(rich-text-label),:host([data-render-mode="shadow"][variant='label-stacked']) .slds-form-element__control,:host([data-render-mode="shadow"][variant="label-stacked"]) ::part(rich-text-editor-container) {/* for rich text via lightning-quill */
+:host([data-render-mode="shadow"][variant='label-stacked']) .slds-form-element__label,:host([data-render-mode="shadow"][variant="label-stacked"]) ::part(rich-text-label),:host([data-render-mode="shadow"][variant='label-stacked']) .slds-form-element__control,:host([data-render-mode="shadow"][variant="label-stacked"]) ::part(rich-text-editor-container) {
+  /* for rich text via lightning-quill */
+
   /* @W-14518344 The following line still exists in SLDS-internal
       but it was removed here because it was causing the input
       component to not display it's bottom border
@@ -294,8 +295,7 @@
 /* Force inner child input to not have padding and margin.
 The parent (ex. lightning-input-field) will provide it instead */
 
-:host([data-render-mode="shadow"][variant='label-inline']) .slds-form-element,:host([data-render-mode="shadow"][variant='label-inline']) [variant='label-inline']
-{
+:host([data-render-mode="shadow"][variant='label-inline']) .slds-form-element,:host([data-render-mode="shadow"][variant='label-inline']) [variant='label-inline'] {
   padding: 0;
   margin-block-end: 0;
 }