lightning-base-components 1.21.5-alpha → 1.21.7-alpha

package/src/lightning/datatable/templates/div/div.lbc.synthetic.css

@@ -14,8 +14,8 @@
 /* Cells */
 [part='cell'] {
     position: relative;
-    padding-inline: var(--slds-g-sizing-3);
-    padding-block: var(--slds-g-sizing-2);
+    padding-inline: var(--slds-g-sizing-3, 0.5rem);
+    padding-block: var(--slds-g-sizing-2, 0.25rem);
     white-space: nowrap;
     align-items: center;
 }
@@ -38,7 +38,7 @@
 
 /* Row borders */
 [data-row-key-value] {
-    border-top: var(--slds-g-sizing-border-1) solid var(--slds-g-color-border-1);
+    border-top: var(--slds-g-sizing-border-1, 1px) solid var(--slds-g-color-border-1);
 }
 
 /* row border on hover */
@@ -78,3 +78,29 @@
 .slds-cell-edit:hover {
     background-color: var(--slds-g-color-surface-container-1);
 }
+
+/* Avoid overwriting wrapping styles in inline mode */
+[part='cell'].slds-cell-wrap {
+    white-space: pre-line;
+    overflow-wrap: break-word;
+    word-wrap: break-word;
+}
+
+/* Inline styles from formattedNumber.css and formattedPhone.css */
+div[role='grid'][data-render-mode-inline='true']
+    > div[role='rowgroup'][data-rowgroup-body]
+    > div[role='row']
+    > div[role='gridcell']
+    > span
+    > div
+    > span[data-inline-type='formatted-number']:dir(rtl),
+div[role='grid'][data-render-mode-inline='true']
+    > div[role='rowgroup'][data-rowgroup-body]
+    > div[role='row']
+    > div[role='gridcell']
+    > span
+    > div
+    > a[data-inline-type='formatted-phone']:dir(rtl) {
+    direction: ltr;
+    unicode-bidi: embed;
+}

package/src/lightning/datatable/templates/table/table.css

@@ -5,6 +5,34 @@
 .slds-table_header-fixed_container > .slds-scrollable_y::before {
     width: 100%;
     border-bottom: 1px solid var(--lwc-colorGray5, #dddbda);
-    content: "";
+    content: '';
     display: block;
 }
+
+.slds-table[role='grid'][data-render-mode-inline='true'] > tbody {
+    contain: strict;
+    content-visibility: auto;
+}
+
+.slds-table[role='grid'][data-render-mode-inline='true'] > tbody > tr {
+    contain-intrinsic-height: auto 29px;
+}
+
+/* Inline styles from formattedNumber.css and formattedPhone.css */
+.slds-table[role='grid'][data-render-mode-inline='true']
+    > tbody
+    > tr
+    > td
+    > span
+    > div
+    > span[data-inline-type='formatted-number']:dir(rtl),
+.slds-table[role='grid'][data-render-mode-inline='true']
+    > tbody
+    > tr
+    > td
+    > span
+    > div
+    > a[data-inline-type='formatted-phone']:dir(rtl) {
+    direction: ltr;
+    unicode-bidi: embed;
+}