@carbon/ibm-products 2.80.0 → 2.81.0-rc.0

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.d.ts

@@ -1,16 +0,0 @@
-export const InlineEditContext: React.Context<{
-    state: {};
-    dispatch: ({ type, payload }: {
-        type: any;
-        payload: any;
-    }) => void;
-}>;
-export function InlineEditProvider({ children }: {
-    children: any;
-}): React.JSX.Element;
-export namespace InlineEditProvider {
-    namespace propTypes {
-        let children: any;
-    }
-}
-import React from 'react';

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js

@@ -1,118 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-var React = require('react');
-var index = require('../../../../../../_virtual/index.js');
-var returnUpdatedActiveCell = require('./returnUpdatedActiveCell.js');
-var getCellIdAsObject = require('./getCellIdAsObject.js');
-
-const InlineEditContext = /*#__PURE__*/React.createContext({
-  state: {},
-  dispatch: _ref => {
-    let {
-      type,
-      payload
-    } = _ref;
-  }
-});
-const inlineEditReducer = (state, action) => {
-  switch (action.type) {
-    case 'ADD_GRID_ACTIVE_FOCUS':
-      {
-        return {
-          ...state,
-          gridActive: true,
-          activeCellId: action.payload,
-          // set default active cell when grid receives focus
-          previousActiveCellId: null
-        };
-      }
-    case 'REMOVE_GRID_ACTIVE_FOCUS':
-      {
-        return {
-          ...state,
-          gridActive: false,
-          editId: null,
-          activeCellId: null,
-          previousActiveCellId: action.payload
-        };
-      }
-    case 'ENTER_EDIT_MODE':
-      {
-        return {
-          ...state,
-          activeCellId: action.payload.activeCellId,
-          editId: action.payload.editId
-        };
-      }
-    case 'EXIT_EDIT_MODE':
-      {
-        return {
-          ...state,
-          activeCellId: action.payload,
-          editId: null
-        };
-      }
-    case 'UPDATE_ACTIVE_CELL_ID':
-      {
-        const {
-          direction,
-          oldId,
-          instance
-        } = action.payload;
-        if (!action.payload.direction) {
-          return {
-            ...state,
-            activeCellId: action.payload,
-            editId: null
-          };
-        }
-        if (direction && typeof direction === 'string') {
-          const activeCellCoords = getCellIdAsObject.getCellIdAsObject(oldId);
-          const totalVisibleColumns = instance.visibleColumns.filter(item => item.id !== 'spacer');
-          return returnUpdatedActiveCell.returnUpdatedActiveCell({
-            activeCellCoords,
-            direction,
-            totalVisibleColumns,
-            state,
-            instance
-          });
-        }
-        break;
-      }
-    case 'SET_FEATURE_FLAGS':
-      {
-        return {
-          ...state,
-          featureFlags: action.payload ?? {}
-        };
-      }
-    default:
-      return state;
-  }
-};
-const InlineEditProvider = _ref2 => {
-  let {
-    children
-  } = _ref2;
-  const initialState = {};
-  const [state, dispatch] = React.useReducer(inlineEditReducer, initialState);
-  return /*#__PURE__*/React.createElement(InlineEditContext.Provider, {
-    value: {
-      state,
-      dispatch
-    }
-  }, children);
-};
-InlineEditProvider.propTypes = {
-  children: index.default.element
-};
-
-exports.InlineEditContext = InlineEditContext;
-exports.InlineEditProvider = InlineEditProvider;

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/getCellIdAsObject.d.ts

@@ -1 +0,0 @@
-export function getCellIdAsObject(oldId: any): {};

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/getCellIdAsObject.js

@@ -1,29 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-// Turns activeCellId into an object to be able to
-// update cell coordinates more easily
-const getCellIdAsObject = oldId => {
-  const oldIdArr = oldId.split('-');
-  const updatedOldValuesArray = oldIdArr.map(item => {
-    if (isNaN(item)) {
-      return item;
-    }
-    return Number(item);
-  });
-  const indexArray = updatedOldValuesArray.filter(Number.isFinite);
-  const keyArray = updatedOldValuesArray.filter(item => typeof item === 'string');
-  const activeCellCoords = {};
-  keyArray.forEach((element, index) => {
-    activeCellCoords[element] = indexArray[index];
-  });
-  return activeCellCoords;
-};
-
-exports.getCellIdAsObject = getCellIdAsObject;

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/index.d.ts

@@ -1 +0,0 @@
-export { InlineEditProvider, InlineEditContext } from "./InlineEditContext";

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.d.ts

@@ -1,7 +0,0 @@
-export function returnUpdatedActiveCell({ activeCellCoords, direction, totalVisibleColumns, state, instance, }: {
-    activeCellCoords: any;
-    direction: any;
-    totalVisibleColumns: any;
-    state: any;
-    instance: any;
-}): any;

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js

@@ -1,40 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-var settings = require('../../../../../../settings.js');
-
-const blockClass = `${settings.pkg.prefix}--datagrid`;
-// This function returns the state back to the reducer after
-// determining the new active cell value
-const returnUpdatedActiveCell = _ref => {
-  let {
-    activeCellCoords,
-    direction,
-    totalVisibleColumns,
-    state,
-    instance
-  } = _ref;
-  const newActiveCoords = {
-    ...activeCellCoords,
-    column: direction === 'right' ? activeCellCoords.column < totalVisibleColumns.length - 1 ? activeCellCoords.column + 1 : activeCellCoords.column : direction === 'left' ? activeCellCoords.column === 0 ? 0 : activeCellCoords.column - 1 : activeCellCoords.column,
-    row: direction === 'up' ? activeCellCoords.row === 0 ? 0 : activeCellCoords.row - 1 : direction === 'down' ? activeCellCoords.row < instance.rows.length - 1 ? activeCellCoords.row + 1 : activeCellCoords.row : activeCellCoords.row
-  };
-  const newActiveCellId = `column-${newActiveCoords.column}-row-${newActiveCoords.row}`;
-  const newCellIdButton = document.querySelector(`#${instance.tableId} .${blockClass}__table-with-inline-edit [data-cell-id="${newActiveCellId}"] .${blockClass}__inline-edit-button`);
-  // Allows scrollable area to keep focused/active cell id visible
-  if (newCellIdButton) {
-    newCellIdButton?.focus();
-  }
-  return {
-    ...state,
-    activeCellId: newActiveCellId
-  };
-};
-
-exports.returnUpdatedActiveCell = returnUpdatedActiveCell;

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridFocus.d.ts

@@ -1 +0,0 @@
-export function handleGridFocus(state: any, dispatch: any): void;

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridFocus.js

@@ -1,24 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-const handleGridFocus = (state, dispatch) => {
-  const {
-    gridActive,
-    previousActiveCellId
-  } = state;
-  if (!gridActive) {
-    // Initialize grid active state
-    dispatch({
-      type: 'ADD_GRID_ACTIVE_FOCUS',
-      payload: previousActiveCellId || 'column-0-row-0' // If there is a previous active cell id that is found use that, otherwise use the first cell in the grid area
-    });
-  }
-};
-
-exports.handleGridFocus = handleGridFocus;

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.d.ts

@@ -1,10 +0,0 @@
-export function handleGridKeyPress({ event, dispatch, state, instance, keysPressedList, usingMac, ref, carbonPrefix, }: {
-    event: any;
-    dispatch: any;
-    state: any;
-    instance: any;
-    keysPressedList: any;
-    usingMac: any;
-    ref: any;
-    carbonPrefix: any;
-}): void;

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js

@@ -1,252 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-var settings = require('../../../../../settings.js');
-var handleMultipleKeys = require('./handleMultipleKeys.js');
-var getCellIdAsObject = require('./InlineEditContext/getCellIdAsObject.js');
-
-const blockClass = `${settings.pkg.prefix}--datagrid`;
-const handleGridKeyPress = _ref => {
-  let {
-    event,
-    dispatch,
-    state,
-    instance,
-    keysPressedList,
-    usingMac,
-    ref,
-    carbonPrefix
-  } = _ref;
-  const {
-    key
-  } = event;
-  const {
-    gridActive,
-    activeCellId,
-    editId
-  } = state;
-  const focusedCell = document.querySelector(`#${instance.tableId} .${blockClass}__table-with-inline-edit [data-cell-id="${activeCellId}"]`);
-
-  // If we reach this it means that tab was pressed while in
-  // edit mode which should not remove the focus from the grid
-  if (activeCellId === editId && key === 'Tab') {
-    // Attempting to exit date picker
-    if (focusedCell.getAttribute('data-inline-type') === 'date') {
-      dispatch({
-        type: 'EXIT_EDIT_MODE',
-        payload: activeCellId
-      });
-      const inlineEditArea = document.querySelector(`#${instance.tableId} .${blockClass}__table-with-inline-edit`);
-      inlineEditArea.focus();
-    }
-    event.preventDefault();
-    return;
-  }
-  if (activeCellId === editId && key === 'Escape') {
-    if (focusedCell.getAttribute('data-inline-type') === 'date') {
-      dispatch({
-        type: 'EXIT_EDIT_MODE',
-        payload: activeCellId
-      });
-      event.preventDefault();
-      const inlineEditArea = document.querySelector(`#${instance.tableId} .${blockClass}__table-with-inline-edit`);
-      inlineEditArea.focus();
-      return;
-    }
-  }
-
-  // Checks if the dropdown menu is open
-  const dropdownIsActive = () => {
-    const selectedDropdown = ref?.current.querySelector(`
-      #${instance.tableId} .${blockClass}__table-with-inline-edit [data-cell-id="${activeCellId}"] button[role='combobox']
-    `);
-    if (selectedDropdown) {
-      // Prevents arrow keys from scrolling any other content when dropdown menu is open
-      event.preventDefault();
-      return true;
-    }
-    return false;
-  };
-
-  // Checks if the date picker is open
-  const datePickerIsActive = () => {
-    const focusedCalendarElement = document.querySelector(`.${carbonPrefix}--date-picker__input.flatpickr-input.active`);
-    if (focusedCalendarElement || document.activeElement.classList.contains(`flatpickr-day`)) {
-      return true;
-    }
-    return false;
-  };
-
-  // Stop grid key listener when in edit mode
-  const isEditing = focusedCell.getAttribute('data-inline-type') !== 'checkbox' && document.activeElement.id === activeCellId && document.activeElement.id === editId || dropdownIsActive() || datePickerIsActive();
-  if (isEditing || !gridActive) {
-    return;
-  }
-  // Command keys need to be returned as there is default browser behavior with these keys
-  if (key === 'Meta' || key === 'Control') {
-    return;
-  }
-  // Prevent arrow keys, home key, and end key from scrolling the page when the data spreadsheet container has focus
-  if (['End', 'Home', 'ArrowLeft', 'ArrowUp', 'ArrowRight', 'ArrowDown'].indexOf(key) > -1 && !isEditing && keysPressedList.length < 2) {
-    event.preventDefault();
-  }
-  const isDisabledCell = focusedCell.getAttribute('data-disabled') === 'false' ? false : true;
-  const isEditableCell = !event.target.classList.contains(`${blockClass}__inline-edit-button--non-edit`);
-  const sharedUpdateParams = {
-    oldId: activeCellId,
-    instance
-  };
-  if (keysPressedList.length > 1) {
-    handleMultipleKeys.handleMultipleKeys({
-      usingMac,
-      keysPressedList,
-      dispatch,
-      activeCellId,
-      instance
-    });
-  }
-  if (keysPressedList.length < 2) {
-    switch (key) {
-      case 'Tab':
-        {
-          if (!editId) {
-            dispatch({
-              type: 'REMOVE_GRID_ACTIVE_FOCUS',
-              payload: activeCellId
-            });
-          }
-          break;
-        }
-      case 'ArrowRight':
-        {
-          dispatch({
-            type: 'UPDATE_ACTIVE_CELL_ID',
-            payload: {
-              direction: 'right',
-              ...sharedUpdateParams
-            }
-          });
-          break;
-        }
-      case 'ArrowLeft':
-        {
-          dispatch({
-            type: 'UPDATE_ACTIVE_CELL_ID',
-            payload: {
-              direction: 'left',
-              ...sharedUpdateParams
-            }
-          });
-          break;
-        }
-      case 'ArrowUp':
-        {
-          dispatch({
-            type: 'UPDATE_ACTIVE_CELL_ID',
-            payload: {
-              direction: 'up',
-              ...sharedUpdateParams
-            }
-          });
-          break;
-        }
-      case 'ArrowDown':
-        {
-          dispatch({
-            type: 'UPDATE_ACTIVE_CELL_ID',
-            payload: {
-              direction: 'down',
-              ...sharedUpdateParams
-            }
-          });
-          break;
-        }
-      // Move active cell to first column in current row
-      case 'Home':
-        {
-          const activeCellObject = getCellIdAsObject.getCellIdAsObject(activeCellId);
-          const newActiveCellCoords = {
-            ...activeCellObject,
-            column: 0
-          };
-          const newActiveCellId = `column-${newActiveCellCoords.column}-row-${newActiveCellCoords.row}`;
-          const scrollElement = document.querySelector(`#${instance.tableId} .${settings.pkg.prefix}--datagrid__table-container`);
-          // Scroll table container to the furthest left position
-          scrollElement.scrollLeft = 0;
-          dispatch({
-            type: 'UPDATE_ACTIVE_CELL_ID',
-            payload: newActiveCellId
-          });
-          break;
-        }
-      // Move active cell to last column in current row
-      case 'End':
-        {
-          const activeCellObject = getCellIdAsObject.getCellIdAsObject(activeCellId);
-          const totalVisibleColumns = instance.visibleColumns.filter(item => item.id !== 'spacer');
-          const newActiveCellCoords = {
-            ...activeCellObject,
-            column: totalVisibleColumns.length - 1
-          };
-          const newActiveCellId = `column-${newActiveCellCoords.column}-row-${newActiveCellCoords.row}`;
-          const scrollElement = document.querySelector(`#${instance.tableId} .${settings.pkg.prefix}--datagrid__table-container`);
-          // Scroll table container to the furthest right position
-          scrollElement.scrollLeft = scrollElement.scrollWidth;
-          dispatch({
-            type: 'UPDATE_ACTIVE_CELL_ID',
-            payload: newActiveCellId
-          });
-          break;
-        }
-      case ' ':
-      case 'F2':
-      case 'Enter':
-        {
-          // Disabled cells are not allowed to go into edit mode
-          if (isDisabledCell || !isEditableCell) {
-            return;
-          }
-          // Only go into edit mode if there is no editId, meaning that we're not already in edit mode
-          if (!editId) {
-            const focusedType = focusedCell.getAttribute('data-inline-type');
-            // Open dropdown immediately after entering edit mode for selection type
-            if (focusedType === 'selection') {
-              setTimeout(() => {
-                const dropdownTrigger = focusedCell.querySelector('button');
-                dropdownTrigger?.click();
-              }, 1);
-            }
-            if (focusedType === 'checkbox') {
-              setTimeout(() => {
-                const checkboxTrigger = focusedCell.querySelector('input');
-                checkboxTrigger?.click();
-                checkboxTrigger?.focus();
-              }, 1);
-            }
-            if (focusedType === 'date') {
-              setTimeout(() => {
-                const dateInputTrigger = focusedCell.querySelector('input');
-                dateInputTrigger?.click();
-                dateInputTrigger?.focus();
-              }, 1);
-            }
-            dispatch({
-              type: 'ENTER_EDIT_MODE',
-              payload: {
-                activeCellId,
-                editId: activeCellId
-              }
-            });
-          }
-        }
-    }
-  }
-};
-
-exports.handleGridKeyPress = handleGridKeyPress;

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.d.ts

@@ -1,7 +0,0 @@
-export function handleMultipleKeys({ usingMac, keysPressedList, dispatch, activeCellId, instance, }: {
-    usingMac: any;
-    keysPressedList: any;
-    dispatch: any;
-    activeCellId: any;
-    instance: any;
-}): void;

package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js

@@ -1,81 +0,0 @@
-/**
- * Copyright IBM Corp. 2020, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-'use strict';
-
-var handleMultipleKeys$1 = require('../../../../DataSpreadsheet/utils/handleMultipleKeys.js');
-var settings = require('../../../../../settings.js');
-var getFocusableElements = require('../../../../../global/js/utils/getFocusableElements.js');
-
-const blockClass = `${settings.pkg.prefix}--datagrid`;
-const handleMultipleKeys = _ref => {
-  let {
-    usingMac,
-    keysPressedList,
-    dispatch,
-    activeCellId,
-    instance
-  } = _ref;
-  // Resource key and Home
-  // Move active cell to first cell in first row and column
-  if (handleMultipleKeys$1.includesResourceKey(keysPressedList, usingMac) && keysPressedList.includes('Home')) {
-    const scrollElement = document.querySelector(`#${instance.tableId} .${settings.pkg.prefix}--datagrid__table-container`);
-    // Scroll table container to the furthest top left position
-    scrollElement.scrollTop = 0;
-    scrollElement.scrollLeft = 0;
-    dispatch({
-      type: 'UPDATE_ACTIVE_CELL_ID',
-      payload: 'column-0-row-0'
-    });
-  }
-
-  // Resource key and End
-  // Move active cell to last cell in in the last row and column
-  if (handleMultipleKeys$1.includesResourceKey(keysPressedList, usingMac) && keysPressedList.includes('End')) {
-    const totalVisibleColumns = instance.visibleColumns.filter(item => item.id !== 'spacer').length;
-    const totalRows = instance.rows?.length;
-    const lastCellDataId = `column-${totalVisibleColumns - 1}-row-${totalRows - 1}`;
-    const lastCellElement = document.querySelector(`#${instance.tableId} .${blockClass}__table-with-inline-edit [data-cell-id="${activeCellId}"]`);
-    const scrollElement = document.querySelector(`#${instance.tableId} .${settings.pkg.prefix}--datagrid__table-container`);
-    // Scroll table container to the furthest bottom right position
-    scrollElement.scrollTop = scrollElement.scrollHeight;
-    scrollElement.scrollLeft = scrollElement.scrollWidth;
-    if (lastCellElement) {
-      dispatch({
-        type: 'UPDATE_ACTIVE_CELL_ID',
-        payload: lastCellDataId
-      });
-    } else {
-      // If a Datagrid component is using virtualized data, it's possible that the last cell
-      // has not yet been rendered. In this case, we simply need to wait until the scrollable
-      // container has scrolled to the bottom/right most position, then we can dispatch the
-      // update active cell id action
-      setTimeout(() => {
-        dispatch({
-          type: 'UPDATE_ACTIVE_CELL_ID',
-          payload: lastCellDataId
-        });
-      }, 250);
-    }
-  }
-  // Shift + Tab
-  // This should remove the active grid state
-  if ((keysPressedList.includes('ShiftLeft') || keysPressedList.includes('ShiftRight')) && keysPressedList.includes('Tab')) {
-    dispatch({
-      type: 'REMOVE_GRID_ACTIVE_FOCUS',
-      payload: activeCellId
-    });
-    const tableElement = document.querySelector(`#${instance.tableId}`);
-    const datagridFocusableElements = getFocusableElements.getFocusableElements(tableElement);
-    const indexOfTable = datagridFocusableElements.findIndex(item => item instanceof HTMLTableElement);
-    if (indexOfTable && Number.isFinite(indexOfTable)) {
-      datagridFocusableElements[indexOfTable]?.focus();
-    }
-  }
-};
-
-exports.handleMultipleKeys = handleMultipleKeys;

package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.d.ts

@@ -1,19 +0,0 @@
-export default RowSizeDropdown;
-declare function RowSizeDropdown({ align, legendText, autoAlign, ...props }: {
-    [x: string]: any;
-    align?: string | undefined;
-    legendText?: string | undefined;
-    autoAlign: any;
-}): React.JSX.Element;
-declare namespace RowSizeDropdown {
-    namespace propTypes {
-        let align: any;
-        let autoAlign: any;
-        let datagridName: any;
-        let legendText: any;
-        let light: any;
-        let onChange: any;
-        let selectedOption: any;
-    }
-}
-import React from 'react';