lightning-base-components 1.21.2-alpha → 1.21.4-alpha

package/src/lightning/datatable/columns.js

@@ -1,115 +1,34 @@
+import labelRowNumber from '@salesforce/label/LightningDatatable.rowNumber';
+import rowActionsDefaultAriaLabel from '@salesforce/label/LightningDatatable.rowActionsDefaultAriaLabel';
 import { normalizeBoolean } from 'lightning/utilsPrivate';
 import { isObjectLike } from './utils';
-import {
-    getRowNumberColumnDef,
-    hasRowNumberColumn,
-    setShowRowNumberColumn,
-} from './rowNumber';
-import { isTreeType, isValidTypeForTree } from './types';
-import { updateColumnSortingState } from './sort';
-import rowActionsDefaultAriaLabel from '@salesforce/label/LightningDatatable.rowActionsDefaultAriaLabel';
+import { ROW_NUMBER_INITIAL_WIDTH } from './rowNumber';
+import { SELECTABLE_HEADER_TYPE } from './rowSelectionShared';
 
 const i18n = {
     rowActionsDefaultAriaLabel,
+    rowNumber: labelRowNumber,
 };
 
-export const SELECTABLE_ROW_CHECKBOX = 'SELECTABLE_CHECKBOX';
+const ROW_NUMBER_COLUMN = {
+    type: 'rowNumber',
+    ariaLabel: i18n.rowNumber,
+    initialWidth: ROW_NUMBER_INITIAL_WIDTH,
+    internal: true,
+    minWidth: 52,
+    maxWidth: 1000,
+    resizable: false,
+    sortable: false,
+    tabIndex: -1,
+};
 
 const SELECTABLE_COLUMN = {
-    type: SELECTABLE_ROW_CHECKBOX,
+    type: SELECTABLE_HEADER_TYPE,
     fixedWidth: 32,
-    tabIndex: -1,
     internal: true,
+    tabIndex: -1,
 };
 
-/**
- * Returns the columns default state.
- *
- * @returns {Object} The default column state.
- */
-export function getColumnsDefaultState() {
-    return {
-        columns: [],
-    };
-}
-
-/**
- * Returns whether or not the datatable has columns.
- *
- * @param {Object} state The datatable's state.
- * @returns {Boolean} Whether the datatable has columns.
- */
-export function hasColumns(state) {
-    return getColumns(state).length > 0;
-}
-
-/**
- * Returns whether or not the column has been specified by the customer.
- *
- * @param {Object} column The column definition object.
- * @returns {Boolean} Whether the column is customer defined or not.
- */
-export function isCustomerColumn(column) {
-    return column.internal !== true;
-}
-
-/**
- * Returns the datatable's columns from state.
- *
- * @param {Object} state  The datatable's state.
- * @returns {Array} The datatable's columns definition.
- */
-export function getColumns(state) {
-    return state.columns;
-}
-
-/**
- * Returns whether any of the datatable's columns are editable.
- *
- * @param {Array} columns The datatable's column definition.
- * @returns {Boolean} Whether any of the columns are editable.
- */
-export function hasEditableColumn(columns) {
-    return columns.some((column) => column.editable);
-}
-
-/**
- * Given an array of column definitions, returns a filtered array containing only those
- * elements from the original array that are editable. For any two columns, C_1 and C_2,
- * that are present in both the input and output array, the relative ordering between
- * them that existed in the input array is maintained in the output array.
- *
- * @param {Array} columns The datatable's column definition. Must be truthy and must be
- *                        filled with truthy column definition objects.
- */
-export function getEditableColumns(columns) {
-    return columns.filter((column) => column.editable);
-}
-
-/**
- * Normalizes the editable property of the column after checking whether the column type
- * is a valid editable standard type or if it's a customType and uses standardCellLayout.
- * If column.editable is associated with an object that also has a 'fieldName' key, then
- * the invocation of this function results in a no-op because we instead rely on later
- * row level checks to determine cell editability.
- *
- * @param {Object} column The column definition object.
- * @param {Object} types The DatatableTypes object.
- */
-export function normalizeEditable(column, types) {
-    if (types.isEditableType(column.type)) {
-        if (
-            !(typeof column.editable === 'object' && column.editable.fieldName)
-        ) {
-            column.editable = normalizeBoolean(column.editable);
-        }
-        column.editTemplate = types.getCustomTypeEditTemplate(column.type);
-    } else {
-        column.editable = false;
-        column.editTemplate = undefined;
-    }
-}
-
 /**
  * Steps through and corrects column definitions inconsistencies.
  *
@@ -120,90 +39,179 @@ export function normalizeEditable(column, types) {
  * For tree-types, we verify all sub-type attributes are within our allowed
  * parameters. See `getNormalizedSubTypeAttribute`.
  *
- * @param {Object} state The datatable state.
- * @param {Array} columns The datatable's column definitions.
- * @param {Object} types  The type handling factory.
+ * @param {Object} state - The datatable state
+ * @param {Array} rawColumns - The user provided column definitions to normalize
+ * @param {Object} types - The type handling factory
  */
-export function normalizeColumns(state, columns, types) {
-    if (columns.length !== 0) {
-        let firstColumnForReaders = 0;
-        // Workaround: https://git.soma.salesforce.com/raptor/raptor/issues/763
-        const normalizedColumns = Object.assign([], columns);
-
-        if (!state.hideCheckboxColumn) {
-            firstColumnForReaders++;
-            normalizedColumns.unshift(SELECTABLE_COLUMN);
+export function normalizeColumns(state, rawColumns, types) {
+    const { length: colCount } = rawColumns;
+    if (colCount === 0) {
+        // Tracked state change.
+        state.columns = [];
+        return;
+    }
+    let normColCount = colCount;
+    let { showRowNumberColumn } = state;
+    const notHideCheckboxColumn = !state.hideCheckboxColumn;
+
+    if (!showRowNumberColumn) {
+        for (let colIndex = 0; colIndex < colCount; colIndex += 1) {
+            if (rawColumns[colIndex].editable) {
+                showRowNumberColumn = true;
+                // Untracked state change.
+                state.showRowNumberColumn = true;
+                break;
+            }
         }
+    }
+    if (showRowNumberColumn) {
+        normColCount += 1;
+    }
+    if (notHideCheckboxColumn) {
+        normColCount += 1;
+    }
+    const normalizedColumns = Array(normColCount);
 
-        if (hasRowNumberColumn(state) || hasEditableColumn(columns)) {
-            firstColumnForReaders++;
-            setShowRowNumberColumn(state, true);
-            normalizedColumns.unshift(getRowNumberColumnDef());
-        }
+    // Tracked state change.
+    state.columns = normalizedColumns;
 
-        const columnKeyMap = {};
-        state.columns = normalizedColumns.map((column, index) => {
-            // Verify `columnKey` is unique
-            const columnKey = column.columnKey;
-            if (columnKey && columnKeyMap[columnKey]) {
-                console.error(
-                    `The "columnKey" column property must be unique. Found a duplicate of columnKey "${columnKey}".`
-                );
-            }
-            columnKeyMap[columnKey] = true;
+    let firstColumnForReaders = 0;
+    if (showRowNumberColumn) {
+        normalizedColumns[firstColumnForReaders] = Object.assign(
+            {},
+            ROW_NUMBER_COLUMN
+        );
+        firstColumnForReaders += 1;
+    }
+    if (notHideCheckboxColumn) {
+        normalizedColumns[firstColumnForReaders] = Object.assign(
+            {},
+            SELECTABLE_COLUMN
+        );
+        firstColumnForReaders += 1;
+    }
+    for (let colIndex = 0; colIndex < colCount; colIndex += 1) {
+        normalizedColumns[colIndex + firstColumnForReaders] =
+            rawColumns[colIndex];
+    }
 
-            const normalizedColumn = Object.assign(
-                getColumnDefaults(column),
-                column
+    const { defaultSortDirection, sortedBy, sortedDirection } = state;
+    const seenColumnKeys = new Set();
+
+    for (let colIndex = 0; colIndex < normColCount; colIndex += 1) {
+        const refCol = normalizedColumns[colIndex];
+        const { columnKey } = refCol;
+
+        // Verify `columnKey` is unique
+        if (columnKey && seenColumnKeys.has(columnKey)) {
+            console.error(
+                `The "columnKey" column property must be unique. Found a duplicate of columnKey "${columnKey}".`
             );
-            normalizedColumn.ariaLabel =
-                normalizedColumn.label || normalizedColumn.ariaLabel || null;
+        }
+        seenColumnKeys.add(columnKey);
+
+        const { type: refColumnType } = refCol;
+        const colName = columnKey || refCol.fieldName;
+
+        // Normalize columns.
+        const normCol = {
+            ariaLabel: '',
+            cellAttributes: {},
+            resizable: true,
+            type: 'text',
+            typeAttributes: {},
+            subType: '',
+        };
+        if (refColumnType === 'action') {
+            normCol.ariaLabel = i18n.rowActionsDefaultAriaLabel;
+            normCol.fixedWidth = 50;
+            normCol.resizable = false;
+        } else if (refColumnType === 'tree') {
+            normCol.subType = 'text';
+        }
+        Object.assign(normCol, refCol);
 
-            // `customType` attribute is needed to render default iedit component
-            normalizedColumn.editableCustomType =
-                types.isStandardCellLayoutForCustomType(normalizedColumn.type);
+        // Store in caches early so data can be referenced by other methods
+        // during initialization.
+        normalizedColumns[colIndex] = normCol;
 
-            if (isCustomerColumn(normalizedColumn)) {
-                normalizeColumnDataType(normalizedColumn, types);
-                normalizeEditable(normalizedColumn, types);
-                updateColumnSortingState(normalizedColumn, state);
-            }
+        let { type: columnType } = normCol;
 
-            if (isTreeType(normalizedColumn.type)) {
-                normalizedColumn.typeAttributes = getNormalizedSubTypeAttribute(
-                    normalizedColumn.type,
-                    normalizedColumn.typeAttributes
-                );
+        normCol.ariaLabel = normCol.label || normCol.ariaLabel || null;
+        // `customType` attribute is needed to render default inline edit component
+        normCol.editableCustomType =
+            types.isStandardCellLayoutForCustomType(columnType);
+
+        // normalize customer column
+        if (!normCol.internal) {
+            // normalize column dataType
+            if (!types.isValidType(columnType)) {
+                columnType = 'text';
+                normCol.type = columnType;
+            }
+            // normalize editable
+            if (types.isEditableType(columnType)) {
+                const { editable } = normCol;
+                if (!(editable && editable.fieldName)) {
+                    normCol.editable = normalizeBoolean(editable);
+                }
+                normCol.editTemplate =
+                    types.getCustomTypeEditTemplate(columnType);
+            } else {
+                normCol.editable = false;
+                normCol.editTemplate = undefined;
             }
+            // update column sorting state
+            const { sortable } = normCol;
+            if (sortable && colName === sortedBy) {
+                normCol.sorted = true;
+                normCol.sortAriaLabel =
+                    sortedDirection === 'desc' ? 'descending' : 'ascending';
+                normCol.sortedDirection = sortedDirection;
+            } else {
+                normCol.sorted = false;
+                normCol.sortAriaLabel = sortable ? 'other' : null;
+                normCol.sortedDirection = defaultSortDirection;
+            }
+        }
 
-            return Object.assign(normalizedColumn, {
-                tabIndex: -1,
-                colKeyValue: generateColKeyValue(normalizedColumn, index),
-                isScopeCol: index === firstColumnForReaders,
-            });
-        });
-    } else {
-        state.columns = [];
-    }
-}
+        // Generate colKeyValue after normalizing customer column.
+        normCol.colKeyValue = generateColKeyValue(normCol, colIndex);
+        normCol.isScopeCol = colIndex === firstColumnForReaders;
+        normCol.isLastCol = colIndex === normColCount - 1;
+        normCol.tabIndex = -1;
+
+        // normalize tree column
+        if (normCol.type === 'tree') {
+            // normalized subType attributes
+            const { typeAttributes } = normCol;
+            const typeAttributesOverrides = {};
+            if (!types.isValidTypeForTree(typeAttributes.subType)) {
+                typeAttributesOverrides.subType = 'text';
+            }
+            if (!typeAttributes.subTypeAttributes) {
+                typeAttributesOverrides.subTypeAttributes = {};
+            }
+            normCol.typeAttributes = Object.assign(
+                {},
+                typeAttributes,
+                typeAttributesOverrides
+            );
+        }
 
-/**
- * Normalizes the subType and subTypeAttributes in the typeAttributes.
- *
- * @param {String} type The type of this column
- * @param {Object} typeAttributes The type attributes of the column
- * @returns {Object} A new typeAttributes object with the sybtype and subTypeAttributes normalized.
- */
-export function getNormalizedSubTypeAttribute(type, typeAttributes) {
-    const typeAttributesOverrides = {};
-    if (!isValidTypeForTree(typeAttributes.subType)) {
-        typeAttributesOverrides.subType = getColumnDefaults({ type }).subType;
+        // partially inline updateHeaderInternalActions from datatable/headerActions
+        const { actions } = normCol;
+        const isLastColumn = colIndex === normColCount - 1;
+        normCol.actions = {
+            menuAlignment:
+                isLastColumn ||
+                normalizedColumns[colIndex + 1].type === 'action'
+                    ? 'auto-right'
+                    : 'auto-left',
+            customerActions: Array.isArray(actions) ? actions : [],
+            internalActions: undefined,
+        };
     }
-    if (!typeAttributes.subTypeAttributes) {
-        typeAttributesOverrides.subTypeAttributes = {};
-    }
-
-    return Object.assign({}, typeAttributes, typeAttributesOverrides);
 }
 
 /**
@@ -213,10 +221,8 @@ export function getNormalizedSubTypeAttribute(type, typeAttributes) {
  * @returns Type attributes for the given column, if they exist.
  */
 export function getTypeAttributesValues(column) {
-    if (isObjectLike(column.typeAttributes)) {
-        return column.typeAttributes;
-    }
-    return {};
+    const { typeAttributes } = column;
+    return isObjectLike(typeAttributes) ? typeAttributes : {};
 }
 
 /**
@@ -226,10 +232,8 @@ export function getTypeAttributesValues(column) {
  * @returns {Object} Sub-type attributes for the given column, if they exist.
  */
 export function getSubTypeAttributesValues(column) {
-    if (isObjectLike(column.typeAttributes.subTypeAttributes)) {
-        return column.typeAttributes.subTypeAttributes;
-    }
-    return {};
+    const { subTypeAttributes } = column.typeAttributes;
+    return isObjectLike(subTypeAttributes) ? subTypeAttributes : {};
 }
 
 /**
@@ -239,10 +243,8 @@ export function getSubTypeAttributesValues(column) {
  * @returns {Object} Cell attributes for the given column, if they exist.
  */
 export function getCellAttributesValues(column) {
-    if (isObjectLike(column.cellAttributes)) {
-        return column.cellAttributes;
-    }
-    return {};
+    const { cellAttributes } = column;
+    return isObjectLike(cellAttributes) ? cellAttributes : {};
 }
 
 /**
@@ -267,20 +269,19 @@ export function generateColKeyValue(columnMetadata, index) {
  * @returns {Number} The index in `dt.columns`. -1 if not found or if its internal.
  */
 export function getUserColumnIndex(state, colKeyValue) {
-    const stateColumnIndex = getStateColumnIndex(state, colKeyValue);
-    let internalColumns = 0;
-
-    if (state.columns[stateColumnIndex].internal) {
+    const { columns } = state;
+    const colIndex = state.headerIndexes[colKeyValue];
+    if (columns[colIndex].internal) {
         return -1;
     }
-
-    for (let i = 0; i < stateColumnIndex; i++) {
-        if (state.columns[i].internal) {
-            internalColumns++;
+    let internalColumns = 0;
+    for (let i = 0; i < colIndex; i += 1) {
+        if (columns[i].internal) {
+            internalColumns += 1;
         }
     }
 
-    return stateColumnIndex - internalColumns;
+    return colIndex - internalColumns;
 }
 
 /**
@@ -310,95 +311,3 @@ export const generateHeaderIndexes = function (columns) {
 export function getStateColumnIndex(state, colKeyValue) {
     return state.headerIndexes[colKeyValue];
 }
-
-/**
- * Retrieves a column index number by its key.
- *
- * @param {Object} state The datatable state
- * @param {String} key The key of the column. Defaults to field name if 'columnKey' is not provided.
- * @returns {Number} The index in state.columns, -1 if it does not exist
- */
-export function getColumnIndexByColumnKey(state, key) {
-    let i = 0;
-    const columns = getColumns(state);
-    const existFieldName = columns.some((column, index) => {
-        i = index;
-        return (
-            column.columnKey === key ||
-            (!column.columnKey && column.fieldName === key)
-        );
-    });
-
-    return existFieldName ? i : -1;
-}
-
-/************************** PRIVATE METHODS ***************************/
-
-/**
- * If the specified column type is not supported, resets it to default.
- *
- * @param {Object} column The column definition object.
- * @param {Object} types The type handling factory.
- */
-function normalizeColumnDataType(column, types) {
-    if (!types.isValidType(column.type)) {
-        column.type = getRegularColumnDefaults().type;
-    }
-}
-
-/**
- * Returns the column defaults based on its type.
- *
- * @param {Object} column The column definition object.
- * @returns {Object} The column defaults.
- */
-function getColumnDefaults(column) {
-    switch (column.type) {
-        case 'action':
-            return getActionColumnDefaults();
-        case 'tree':
-            return getTreeColumnDefaults();
-        default:
-            return getRegularColumnDefaults();
-    }
-}
-
-/**
- * Retrieves the defaults for regular columns.
- *
- * @returns {Object} Regular column defaults
- */
-function getRegularColumnDefaults() {
-    return {
-        type: 'text',
-        typeAttributes: {},
-        cellAttributes: {},
-    };
-}
-
-/**
- * Retrieves the defaults for action columns.
- *
- * @returns {Object} Action column defaults
- */
-function getActionColumnDefaults() {
-    return {
-        fixedWidth: 50,
-        resizable: false,
-        ariaLabel: i18n.rowActionsDefaultAriaLabel,
-    };
-}
-
-/**
- * Retrieves the defaults for tree columns.
- *
- * @returns {Object} Tree column defaults
- */
-function getTreeColumnDefaults() {
-    return {
-        type: 'tree',
-        subType: 'text',
-        typeAttributes: {},
-        cellAttributes: {},
-    };
-}