lightning-base-components 1.19.6-alpha → 1.19.8-alpha

package/metadata/raptor.json

@@ -187,6 +187,11 @@
       {
         "name": "focus"
       }
+    ],
+    "staticProperties": [
+      {
+        "name": "validationOptOut"
+      }
     ]
   },
   "breadcrumbs": {
@@ -629,11 +634,18 @@
       {
         "name": "showHelpMessageIfInvalid"
       }
+    ],
+    "staticProperties": [
+      {
+        "name": "validationOptOut"
+      }
     ]
   },
   "commerceApi": {},
+  "commerceConfigurationApi": {},
   "commerceEsfApi": {},
   "commerceExtensionApi": {},
+  "commerceManagementApi": {},
   "commerceStoreManagementApi": {},
   "communityInfoApi": {},
   "communityMicrobatchingApi": {},
@@ -663,6 +675,16 @@
   "context": {
     "slotNames": [
       ""
+    ],
+    "statics": [
+      {
+        "name": "getDefaultContext"
+      }
+    ],
+    "staticProperties": [
+      {
+        "name": "Provider"
+      }
     ]
   },
   "dataProviderApi": {},
@@ -898,6 +920,7 @@
       }
     ]
   },
+  "einsteinllmApi": {},
   "empApi": {
     "minVersion": "44.0"
   },
@@ -1350,6 +1373,11 @@
       {
         "name": "value"
       }
+    ],
+    "staticProperties": [
+      {
+        "name": "validationOptOut"
+      }
     ]
   },
   "formattedText": {
@@ -1559,6 +1587,11 @@
       {
         "name": "variant"
       }
+    ],
+    "staticProperties": [
+      {
+        "name": "validationOptOut"
+      }
     ]
   },
   "iconSvgTemplates": {
@@ -1610,16 +1643,19 @@
   "industriesCriteriaBasedSearchFilterApi": {},
   "industriesDataloadingApi": {},
   "industriesDecisionMatrixDesignerApi": {},
+  "industriesDecisiontableApi": {},
   "industriesDocgenApi": {},
   "industriesDocumentmatrixApi": {},
   "industriesEducationApi": {},
   "industriesEinsteinAIAcceleratorApi": {},
+  "industriesEnergyUtilitiesApi": {},
   "industriesEpcApi": {},
   "industriesEriApi": {},
   "industriesExplainabilityApi": {},
   "industriesExternalDocumentApi": {},
   "industriesFeatureValidationApi": {},
   "industriesFieldsetApi": {},
+  "industriesFilebasedDataimportApi": {},
   "industriesFundraisingApi": {},
   "industriesGroupApi": {},
   "industriesHealthcloudApi": {},
@@ -1762,6 +1798,9 @@
       {
         "name": "required"
       },
+      {
+        "name": "role"
+      },
       {
         "name": "selectionEnd"
       },
@@ -2224,6 +2263,11 @@
       {
         "name": "verticalAlign"
       }
+    ],
+    "staticProperties": [
+      {
+        "name": "validationOptOut"
+      }
     ]
   },
   "layoutItem": {
@@ -2253,6 +2297,11 @@
       {
         "name": "smallDeviceSize"
       }
+    ],
+    "staticProperties": [
+      {
+        "name": "validationOptOut"
+      }
     ]
   },
   "logger": {
@@ -2881,6 +2930,7 @@
   },
   "placeOrderApi": {},
   "placeQuoteApi": {},
+  "platformContentTaxonomyApi": {},
   "platformExternalServicesApi": {},
   "platformGlobalizationApi": {},
   "platformNamedCredentialApi": {},
@@ -3320,6 +3370,11 @@
       {
         "name": "value"
       }
+    ],
+    "methods": [
+      {
+        "name": "focus"
+      }
     ]
   },
   "primitiveInputText": {
@@ -3715,6 +3770,11 @@
     "slotNames": [
       "",
       "copy-label"
+    ],
+    "methods": [
+      {
+        "name": "copyRichText"
+      }
     ]
   },
   "primitiveSelect": {
@@ -4134,6 +4194,9 @@
       {
         "name": "displayInfo"
       },
+      {
+        "name": "fieldLevelHelp"
+      },
       {
         "name": "filter"
       },
@@ -4353,6 +4416,11 @@
       {
         "name": "showHelpMessageIfInvalid"
       }
+    ],
+    "staticProperties": [
+      {
+        "name": "validationOptOut"
+      }
     ]
   },
   "serviceAutomationServiceCatalogApi": {},
@@ -4506,6 +4574,11 @@
       {
         "name": "variant"
       }
+    ],
+    "staticProperties": [
+      {
+        "name": "validationOptOut"
+      }
     ]
   },
   "stackedTab": {
@@ -4718,6 +4791,11 @@
       {
         "name": "focus"
       }
+    ],
+    "statics": [
+      {
+        "name": "show"
+      }
     ]
   },
   "toastContainer": {
@@ -4738,6 +4816,11 @@
       {
         "name": "close"
       }
+    ],
+    "statics": [
+      {
+        "name": "instance"
+      }
     ]
   },
   "tree": {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "lightning-base-components",
-    "version": "1.19.6-alpha",
+    "version": "1.19.8-alpha",
     "license": "MIT",
     "files": [
         "external",
@@ -366,6 +366,10 @@
                 "name": "@salesforce/label/LightningProgressBar.progressBar",
                 "path": "scopedImports/@salesforce-label-LightningProgressBar.progressBar.js"
             },
+            {
+                "name": "@salesforce/label/LightningProgressRing.progressRing",
+                "path": "scopedImports/@salesforce-label-LightningProgressRing.progressRing.js"
+            },
             {
                 "name": "@salesforce/label/LightningProgressRing.warning",
                 "path": "scopedImports/@salesforce-label-LightningProgressRing.warning.js"
@@ -1292,6 +1296,74 @@
             }
         ],
         "nativeShadowEnabledComponents": [],
+        "bestPerformanceTests": [
+            "lightning-accordion",
+            "lightning-breadcrumbs",
+            "lightning-button",
+            "lightning-button-group",
+            "lightning-button-icon",
+            "lightning-button-menu",
+            "lightning-button-stateful",
+            "lightning-card",
+            "lightning-carousel",
+            "lightning-layout",
+            "lightning-pill",
+            "lightning-select",
+            "lightning-tabset",
+            "lightning-tile",
+            "lightning-vertical-navigation",
+            "lightning-ai-form-control",
+            "lightning-ai-layout",
+            "lightning-avatar",
+            "lightning-badge",
+            "lightning-breadcrumb",
+            "lightning-bubble",
+            "lightning-button-icon-stateful",
+            "lightning-checkbox-group",
+            "lightning-click-to-dial",
+            "lightning-combobox",
+            "lightning-datatable",
+            "lightning-datepicker",
+            "lightning-datetimepicker",
+            "lightning-dual-listbox",
+            "lightning-dynamic-icon",
+            "lightning-formatted-address",
+            "lightning-formatted-date-time",
+            "lightning-formatted-email",
+            "lightning-formatted-location",
+            "lightning-formatted-name",
+            "lightning-formatted-number",
+            "lightning-formatted-phone",
+            "lightning-formatted-rich-text",
+            "lightning-formatted-text",
+            "lightning-formatted-time",
+            "lightning-formatted-url",
+            "lightning-grouped-combobox",
+            "lightning-helptext",
+            "lightning-icon",
+            "lightning-input",
+            "lightning-input-address",
+            "lightning-input-location",
+            "lightning-map",
+            "lightning-message-service-internal",
+            "lightning-pill-container",
+            "lightning-popup",
+            "lightning-primitive-bubble",
+            "lightning-progress-bar",
+            "lightning-progress-ring",
+            "lightning-radio-group",
+            "lightning-record-picker",
+            "lightning-record-picker-base",
+            "lightning-refresh",
+            "lightning-relative-date-time",
+            "lightning-slider",
+            "lightning-spinner",
+            "lightning-tab-bar",
+            "lightning-textarea",
+            "lightning-timepicker",
+            "lightning-tree",
+            "lightning-tree-grid"
+        ],
         "expose": [
             "lightning/accordion",
             "lightning/accordionSection",

package/scopedImports/@salesforce-label-LightningProgressRing.progressRing.js

@@ -0,0 +1 @@
+export default 'Progress Ring';

package/src/lightning/baseCombobox/baseCombobox.css

@@ -17,3 +17,11 @@ button:disabled,
 [type='button']:disabled {
     cursor: not-allowed;
 }
+
+/* W-14210059 - the input height automatically increases with font size
+ * to about 1.2em, but not the button. However, changing the line-height
+ * of the button will increase the height accordingly
+ */
+.fix-slds-input_faux {
+    line-height: max(1.875rem, calc(1.2em - 2px));
+}

package/src/lightning/baseCombobox/baseCombobox.js

@@ -669,6 +669,7 @@ export default class LightningBaseCombobox extends LightningElement {
         const classes = classSet('slds-combobox__input');
         classes.add({
             'slds-input_faux': this.isUserInputDisabled, //rendering button
+            'fix-slds-input_faux': this.isUserInputDisabled, // W-14210059
             'slds-input': !this.isUserInputDisabled, //rendering input
             'slds-is-disabled': this.disabled,
             'slds-combobox__input-value': this.computedInputValue,

package/src/lightning/datatable/README.md

@@ -49,4 +49,5 @@ However, Locker permits these features in internal implementations.
 -   Dispatching custom events on custom data types
 -   Accessibility and keyboard navigation on custom data types
 
-For more information, see [Extend lightning-datatable with Custom Data](https://salesforce.quip.com/mN9PAQnH9sjB).
+
+For more information, see [Extend lightning-datatable with Custom Data](https://gus.lightning.force.com/lightning/r/0D5EE00001TA1uZ0AT/view).

package/src/lightning/datatable/__examples__/sorting/sorting.js

@@ -1,14 +1,14 @@
 import { LightningElement } from 'lwc';
 
 const data = [
-    { id: 1, name: 'Billy Simonns', age: 40, email: 'billy@salesforce.com' },
-    { id: 2, name: 'Kelsey Denesik', age: 35, email: 'kelsey@salesforce.com' },
-    { id: 3, name: 'Kyle Ruecker', age: 50, email: 'kyle@salesforce.com' },
+    { id: 1, name: 'Billy Simonns', age: 40, email: 'billy@test.com' },
+    { id: 2, name: 'Kelsey Denesik', age: 35, email: 'kelsey@test.com' },
+    { id: 3, name: 'Kyle Ruecker', age: 50, email: 'kyle@test.com' },
     {
         id: 4,
         name: 'Krystina Kerluke',
         age: 37,
-        email: 'krystina@salesforce.com',
+        email: 'krystina@test.com',
     },
 ];
 

package/src/lightning/datatable/columnResizer.js

@@ -139,17 +139,19 @@ export function getCSSWidthStyleOfTable(widthsData) {
 export function adjustColumnsSizeFromState(state) {
     const columnsWidths = getColumnsWidths(state);
     let columnsWidthSum = 0;
-    getColumns(state).forEach((column, colIndex) => {
-        const width = columnsWidths[colIndex];
-        if (typeof columnsWidths[colIndex] !== 'undefined') {
+    const columns = getColumns(state);
+    for (let i = 0, { length } = columns; i < length; i += 1) {
+        const width = columnsWidths[i];
+        if (width !== undefined) {
+            const col = columns[i];
             if (isRTL()) {
-                column.offset = columnsWidthSum;
+                col.offset = columnsWidthSum;
             }
             columnsWidthSum += width;
-            column.columnWidth = columnsWidths[colIndex];
-            column.style = buildCSSWidthStyle(columnsWidths[colIndex]);
+            col.columnWidth = width;
+            col.style = buildCSSWidthStyle(width);
         }
-    });
+    }
     setTableWidth(state, columnsWidthSum);
 }
 
@@ -204,7 +206,8 @@ function updateColumnWidth(columns, widthsData, colIndex, newWidth) {
 }
 
 export function updateColumnWidthsMetadata(columns, widthsData) {
-    columns.forEach((col) => {
+    for (let i = 0, { length } = columns; i < length; i += 1) {
+        const col = columns[i];
         if (!col.internal) {
             col.minWidth = getMinColumnWidth(widthsData);
             col.maxWidth = getMaxColumnWidth(widthsData);
@@ -217,7 +220,7 @@ export function updateColumnWidthsMetadata(columns, widthsData) {
                 col.maxWidth
             );
         }
-    });
+    }
 }
 
 /**
@@ -230,10 +233,9 @@ export function updateColumnWidthsMetadata(columns, widthsData) {
  */
 function updateColumnOffsets(columns, colIndex, newDelta) {
     if (isRTL()) {
-        const offsetColumns = columns.slice(colIndex);
-        offsetColumns.forEach((column) => {
-            column.offset += newDelta;
-        });
+        for (let i = colIndex, { length } = columns; i < length; i += 1) {
+            columns[i].offset += newDelta;
+        }
     }
 }
 
@@ -245,12 +247,14 @@ function updateColumnOffsets(columns, colIndex, newDelta) {
  * belong to a column with the same index in column prop
  */
 export function getCustomerColumnWidths(columns, widthsData) {
-    return columns.reduce((prev, column, index) => {
-        if (isCustomerColumn(column)) {
-            prev.push(widthsData.columnWidths[index]);
+    const widths = [];
+    const { columnWidths } = widthsData;
+    for (let i = 0, { length } = columns; i < length; i += 1) {
+        if (isCustomerColumn(columns[i])) {
+            widths.push(columnWidths[i]);
         }
-        return prev;
-    }, []);
+    }
+    return widths;
 }
 
 /**

package/src/lightning/datatable/columnWidthManager.js

@@ -44,24 +44,27 @@ const tableTypes = {
  */
 export function computeColumnWidths(adjustedWidths, columnDefs, widthsData) {
     const { columnWidths } = adjustedWidths;
-    if (columnWidths.length !== columnDefs.length) {
+    const { length: columnDefsLength } = columnDefs;
+    if (columnWidths.length !== columnDefsLength) {
         return;
     }
     let columnWidthsSum = 0;
-    columnDefs.forEach((columnDef, index) => {
-        const newWidth = columnWidths[index];
-        widthsData.columnWidths[index] = newWidth;
-        columnDef.columnWidth = newWidth;
-        columnDef.style = buildCSSWidthStyle(newWidth);
+    const rtl = isRTL();
+    for (let i = 0; i < columnDefsLength; i += 1) {
+        const col = columnDefs[i];
+        const newWidth = columnWidths[i];
+        widthsData.columnWidths[i] = newWidth;
+        col.columnWidth = newWidth;
+        col.style = buildCSSWidthStyle(newWidth);
 
         // In RTL, we need to explicitly position the column headers.
         // We do this by providing the offset (in pixels) from the start of the table.
-        if (isRTL()) {
-            columnDef.offset = columnWidthsSum;
+        if (rtl) {
+            col.offset = columnWidthsSum;
         }
 
         columnWidthsSum += newWidth;
-    });
+    }
 
     // TODO: W-7679487 - `tableWidth` should match `columnWidthsSum`
     widthsData.tableWidth = columnWidthsSum;
@@ -144,9 +147,12 @@ export class ColumnWidthManager {
      * @param {Number} value The minimum column width
      */
     set minColumnWidth(value) {
-        Object.keys(this._widthStrategies).forEach((strategy) => {
-            this._widthStrategies[strategy].minColumnWidth = value;
-        });
+        const { _widthStrategies } = this;
+        const keys = Object.keys(_widthStrategies);
+        for (let i = 0, { length } = keys; i < length; i += 1) {
+            const strategy = keys[i];
+            _widthStrategies[strategy].minColumnWidth = value;
+        }
     }
 
     /**
@@ -155,9 +161,12 @@ export class ColumnWidthManager {
      * @param {Number} value The maximum column width
      */
     set maxColumnWidth(value) {
-        Object.keys(this._widthStrategies).forEach((strategy) => {
-            this._widthStrategies[strategy].maxColumnWidth = value;
-        });
+        const { _widthStrategies } = this;
+        const keys = Object.keys(_widthStrategies);
+        for (let i = 0, { length } = keys; i < length; i += 1) {
+            const strategy = keys[i];
+            _widthStrategies[strategy].maxColumnWidth = value;
+        }
     }
 
     /**
@@ -381,13 +390,12 @@ export class ColumnWidthManager {
         if (this.columnWidthMode === AUTO_WIDTH_MODE) {
             this._queueAutoResizingUpdate = true;
         }
-        if (columnDefs.length > 0) {
-            columnDefs.forEach((column) => {
-                if (!getColumnWidthFromDef(column)) {
-                    column.columnWidth = null;
-                    column.style = '';
-                }
-            });
+        for (let i = 0, { length } = columnDefs; i < length; i += 1) {
+            const col = columnDefs[i];
+            if (!getColumnWidthFromDef(col)) {
+                col.columnWidth = null;
+                col.style = '';
+            }
         }
     }
 

package/src/lightning/datatable/errors.js

@@ -24,7 +24,7 @@ export function setErrors(state, errors) {
  * Retrieves the row-level errors of a particular row from datatable's state object
  */
 export function getRowError(state, rowKey) {
-    const rows = getErrors(state).rows;
+    const { rows } = state.errors;
     return (rows && rows[rowKey]) || {};
 }
 
@@ -32,5 +32,5 @@ export function getRowError(state, rowKey) {
  * Retrieves the table-level errors from the datatable's state object
  */
 export function getTableError(state) {
-    return getErrors(state).table || {};
+    return state.errors.table || {};
 }

package/src/lightning/datatable/infiniteLoading.js

@@ -84,7 +84,8 @@ export function setLoadMoreOffset(state, value) {
  * @param {Event} event
  */
 export function handleLoadMoreCheck(event) {
-    if (isLoading(this.state)) {
+    const { state } = this;
+    if (state.isLoading) {
         return;
     }
 
@@ -94,7 +95,7 @@ export function handleLoadMoreCheck(event) {
     }
 
     const offset = getScrollOffsetFromTableEnd(contentContainer);
-    const threshold = getLoadMoreOffset(this.state);
+    const threshold = getLoadMoreOffset(state);
     if (offset < threshold) {
         this.dispatchEvent(new CustomEvent('loadmore'));
     }
@@ -109,12 +110,12 @@ export function handleLoadMoreCheck(event) {
  */
 export function handlePrefetch(root, state) {
     if (
-        !isInfiniteLoadingEnabled(state) ||
-        isLoading(state) ||
-        !hasData(root) ||
+        state.isLoading ||
+        !state.enableInfiniteLoading ||
         (this.viewportRendering &&
             this._renderManager &&
-            !this._renderManager.hasWrapperHeight())
+            !this._renderManager.hasWrapperHeight()) ||
+        !hasData(root)
     ) {
         // dont prefetch if already loading or data is not set yet
         return;
@@ -122,7 +123,7 @@ export function handlePrefetch(root, state) {
 
     const elem = root.querySelector('.slds-scrollable_y');
 
-    if (isScrollerVisible(elem) && !isScrollable(elem)) {
+    if (elem && isScrollerVisible(elem) && !isScrollable(elem)) {
         this.dispatchEvent(new CustomEvent('loadmore'));
     }
 }
@@ -137,10 +138,7 @@ export function handlePrefetch(root, state) {
  */
 function isScrollable(element) {
     // scrollHeight should be greater than clientHeight by some allowance
-    return (
-        element &&
-        element.scrollHeight > element.clientHeight + SCROLL_ALLOWANCE
-    );
+    return element.scrollHeight > element.clientHeight + SCROLL_ALLOWANCE;
 }
 
 /**
@@ -150,9 +148,10 @@ function isScrollable(element) {
  * @returns {Boolean} Whether or not the element's scroll bars are visible
  */
 function isScrollerVisible(element) {
-    return (
-        element &&
-        !!(element.offsetParent || element.offsetHeight || element.offsetWidth)
+    return !!(
+        element.offsetParent ||
+        element.offsetHeight ||
+        element.offsetWidth
     );
 }
 

package/src/lightning/datatable/sort.js

@@ -67,13 +67,14 @@ export function getSortedDirection(state) {
  * @param {String} value The value to update the sort direction to
  */
 export function setSortedDirection(state, value) {
+    const isValid = isValidSortDirection(value);
     assert(
-        isValidSortDirection(value),
+        isValid,
         `The "sortedDirection" value passed into lightning:datatable
         is incorrect, "sortedDirection" value should be one of
         ${Object.keys(VALID_SORT_DIRECTIONS).join()}.`
     );
-    state.sortedDirection = isValidSortDirection(value) ? value : undefined;
+    state.sortedDirection = isValid ? value : undefined;
 }
 
 /**
@@ -110,8 +111,10 @@ export function setSortedBy(state, value) {
  * @param {Object} state The current datatable state
  */
 export function updateSorting(state) {
-    const columns = state.columns;
-    columns.forEach((column) => updateColumnSortingState(column, state));
+    const { columns } = state;
+    for (let i = 0, { length } = columns; i < length; i += 1) {
+        updateColumnSortingState(columns[i], state);
+    }
 }
 
 /**
@@ -123,18 +126,14 @@ export function updateSorting(state) {
 export function updateColumnSortingState(column, state) {
     const { sortedBy, sortedDirection, defaultSortDirection } = state;
 
-    if (getColumnName(column) === sortedBy && column.sortable) {
-        Object.assign(column, {
-            sorted: true,
-            sortAriaLabel:
-                sortedDirection === 'desc' ? 'descending' : 'ascending',
-            sortedDirection,
-        });
+    if (column.sortable && getColumnName(column) === sortedBy) {
+        column.sorted = true;
+        column.sortAriaLabel =
+            sortedDirection === 'desc' ? 'descending' : 'ascending';
+        column.sortedDirection = sortedDirection;
     } else {
-        Object.assign(column, {
-            sorted: false,
-            sortAriaLabel: column.sortable ? 'other' : null,
-            sortedDirection: defaultSortDirection,
-        });
+        column.sorted = false;
+        column.sortAriaLabel = column.sortable ? 'other' : null;
+        column.sortedDirection = defaultSortDirection;
     }
 }