@carbon/ibm-products 2.33.0 → 2.35.0

package/lib/components/DataSpreadsheet/utils/commonEventHandlers.js

@@ -0,0 +1,311 @@
+/**
+ * Copyright IBM Corp. 2020, 2024
+ *
+ * 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';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var settings = require('../../../settings.js');
+var checkForHoldingKey = require('./checkForHoldingKey.js');
+var deepCloneObject = require('../../../global/js/utils/deepCloneObject.js');
+var uuidv4 = require('../../../global/js/utils/uuidv4.js');
+var removeCellSelections = require('./removeCellSelections.js');
+var handleHeaderCellSelection = require('./handleHeaderCellSelection.js');
+var handleMultipleKeys = require('./handleMultipleKeys.js');
+var handleActiveCellInSelectionEnter = require('./handleActiveCellInSelectionEnter.js');
+var handleActiveCellInSelectionTab = require('./handleActiveCellInSelectionTab.js');
+var handleCellDeletion = require('./handleCellDeletion.js');
+
+var blockClass = "".concat(settings.pkg.prefix, "--data-spreadsheet");
+
+// onClick fn for each cell in the data spreadsheet body,
+// adds the active cell highlight
+
+var handleBodyCellClick = function handleBodyCellClick(cell, columnIndex, event) {
+  for (var _len = arguments.length, rest = new Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) {
+    rest[_key - 3] = arguments[_key];
+  }
+  var currentMatcher = rest[0],
+    activeCellCoordinates = rest[1],
+    selectionAreas = rest[2],
+    setActiveCellCoordinates = rest[3],
+    setSelectionAreas = rest[4],
+    setContainerHasFocus = rest[5],
+    setClickAndHoldActive = rest[6],
+    setCurrentMatcher = rest[7],
+    ref = rest[8],
+    setSelectionAreaData = rest[9],
+    setActiveCellInsideSelectionArea = rest[10],
+    activeCellRef = rest[11],
+    setValidStartingPoint = rest[12];
+  event.preventDefault();
+  var closestBodyCell = event.target.closest(".".concat(blockClass, "__body--td"));
+  var isValidSelectionAreaStart = closestBodyCell.classList.contains("".concat(blockClass, "__body--td"));
+  setValidStartingPoint(isValidSelectionAreaStart);
+  var isHoldingCommandKey = checkForHoldingKey.checkForHoldingKey(event, 'cmd');
+  var isHoldingShiftKey = checkForHoldingKey.checkForHoldingKey(event, 'shiftKey');
+  setContainerHasFocus(true);
+  var activeCoordinates = {
+    row: cell.row.index,
+    column: columnIndex
+  };
+  var tempMatcher = uuidv4["default"]();
+  setClickAndHoldActive(true);
+
+  // prevent multiple selections unless cmd key is held
+  // meaning that selectionAreas should only have one item by default
+  if (isHoldingCommandKey) {
+    var activeCellElement = ref.current.querySelector(".".concat(blockClass, "__active-cell--highlight"));
+    activeCellElement.setAttribute('data-selection-id', tempMatcher);
+    setActiveCellInsideSelectionArea(true);
+    setActiveCellCoordinates(activeCoordinates);
+    setCurrentMatcher(tempMatcher);
+    setSelectionAreas(function (prev) {
+      return [].concat(_rollupPluginBabelHelpers.toConsumableArray(prev), [{
+        point1: activeCoordinates,
+        matcher: tempMatcher
+      }]);
+    });
+  } else if (isHoldingShiftKey) {
+    setContainerHasFocus(true);
+    var selectionAreaClone = deepCloneObject.deepCloneObject(selectionAreas);
+    var indexOfItemToUpdate = selectionAreaClone.findIndex(function (item) {
+      return item.matcher === currentMatcher;
+    });
+    if (indexOfItemToUpdate === -1) {
+      // There is always a selectionArea with a point1 object that updates
+      // whenever the activeCellCoordinates update, we should always be able
+      // to find an index, but if we do not for some reason we should return
+      // at this point.
+      return;
+    } else {
+      // Update the selectionArea that was found, do not update currentMatcher
+      selectionAreaClone[indexOfItemToUpdate].point1 = activeCellCoordinates;
+      selectionAreaClone[indexOfItemToUpdate].point2 = activeCoordinates;
+      selectionAreaClone[indexOfItemToUpdate].areaCreated = false;
+      selectionAreaClone[indexOfItemToUpdate].matcher = currentMatcher;
+      setSelectionAreas(selectionAreaClone);
+    }
+  } else {
+    activeCellRef.current.style.display = 'none';
+    setActiveCellInsideSelectionArea(false);
+    setActiveCellCoordinates(activeCoordinates);
+    // remove all previous cell selections
+    removeCellSelections.removeCellSelections({
+      spreadsheetRef: ref
+    });
+    setSelectionAreas([{
+      point1: activeCoordinates,
+      matcher: tempMatcher
+    }]);
+    setCurrentMatcher(tempMatcher);
+    setSelectionAreaData([]);
+  }
+};
+var handleBodyCellHover = function handleBodyCellHover(cell, columnIndex) {
+  for (var _len2 = arguments.length, rest = new Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
+    rest[_key2 - 2] = arguments[_key2];
+  }
+  var clickAndHoldActive = rest[0],
+    currentMatcher = rest[1],
+    setSelectionAreas = rest[2];
+  if (clickAndHoldActive) {
+    var cellCoordinates = {
+      row: cell.row.index,
+      column: columnIndex
+    };
+    setSelectionAreas(function (prev) {
+      var _selectionAreaClone$i, _selectionAreaClone$i2;
+      var selectionAreaClone = deepCloneObject.deepCloneObject(prev);
+      var indexOfItemToUpdate = selectionAreaClone.findIndex(function (item) {
+        return item.matcher === currentMatcher;
+      });
+      // No items in the array match up with the currentMatcher value
+      if (indexOfItemToUpdate === -1) {
+        return prev;
+      }
+      // Do not update state if you're still hovering on the same cell
+      if (((_selectionAreaClone$i = selectionAreaClone[indexOfItemToUpdate].point2) === null || _selectionAreaClone$i === void 0 ? void 0 : _selectionAreaClone$i.row) === cellCoordinates.row && ((_selectionAreaClone$i2 = selectionAreaClone[indexOfItemToUpdate].point2) === null || _selectionAreaClone$i2 === void 0 ? void 0 : _selectionAreaClone$i2.column) === cellCoordinates.column) {
+        return prev;
+      }
+      selectionAreaClone[indexOfItemToUpdate].point2 = cellCoordinates;
+      selectionAreaClone[indexOfItemToUpdate].areaCreated = false;
+      return selectionAreaClone;
+    });
+  }
+};
+var handleRowHeaderClick = function handleRowHeaderClick(index, event) {
+  for (var _len3 = arguments.length, rest = new Array(_len3 > 2 ? _len3 - 2 : 0), _key3 = 2; _key3 < _len3; _key3++) {
+    rest[_key3 - 2] = arguments[_key3];
+  }
+  var columns = rest[0],
+    ref = rest[1],
+    setSelectionAreas = rest[2],
+    setCurrentMatcher = rest[3],
+    setActiveCellCoordinates = rest[4],
+    activeCellCoordinates = rest[5],
+    rows = rest[6],
+    setSelectionAreaData = rest[7];
+  var isHoldingCommandKey = checkForHoldingKey.checkForHoldingKey(event, 'cmd');
+  handleHeaderCellSelection.handleHeaderCellSelection({
+    type: 'row',
+    activeCellCoordinates: activeCellCoordinates,
+    rows: rows,
+    columns: columns,
+    setActiveCellCoordinates: setActiveCellCoordinates,
+    setCurrentMatcher: setCurrentMatcher,
+    setSelectionAreas: setSelectionAreas,
+    spreadsheetRef: ref,
+    index: index,
+    setSelectionAreaData: setSelectionAreaData,
+    isHoldingCommandKey: isHoldingCommandKey
+  });
+};
+var handleKeyPress = function handleKeyPress(event) {
+  for (var _len4 = arguments.length, rest = new Array(_len4 > 1 ? _len4 - 1 : 0), _key4 = 1; _key4 < _len4; _key4++) {
+    rest[_key4 - 1] = arguments[_key4];
+  }
+  var activeCellInsideSelectionArea = rest[0],
+    updateActiveCellCoordinates = rest[1],
+    activeCellCoordinates = rest[2],
+    removeActiveCell = rest[3],
+    columns = rest[4],
+    rows = rest[5],
+    spreadsheetRef = rest[6],
+    currentMatcher = rest[7],
+    removeCellEditor = rest[8],
+    selectionAreas = rest[9],
+    handleHomeEndKey = rest[10],
+    keysPressedList = rest[11],
+    usingMac = rest[12],
+    updateData = rest[13],
+    checkForReturnCondition = rest[14],
+    handleArrowKeyPress = rest[15],
+    setSelectionAreas = rest[16],
+    setSelectionAreaData = rest[17],
+    setCurrentMatcher = rest[18],
+    activeCellRef = rest[19],
+    setActiveCellCoordinates = rest[20],
+    setContainerHasFocus = rest[21],
+    setActiveCellContent = rest[22];
+  var key = event.key;
+  // Command keys need to be returned as there is default browser behavior with these keys
+  // Needs to be returned in editing mode
+  if (checkForReturnCondition(key)) {
+    return;
+  }
+
+  // Clear out all cell selection areas if user uses any arrow key, except if the shift key is being held
+  if (['ArrowLeft', 'ArrowUp', 'ArrowRight', 'ArrowDown'].indexOf(key) > -1) {
+    if (selectionAreas !== null && selectionAreas !== void 0 && selectionAreas.length && keysPressedList.length < 2 && !handleMultipleKeys.includesShift(keysPressedList)) {
+      setSelectionAreas([]);
+      setSelectionAreaData([]);
+      removeCellSelections.removeCellSelections({
+        spreadsheetRef: spreadsheetRef
+      });
+    }
+  }
+  if ((keysPressedList === null || keysPressedList === void 0 ? void 0 : keysPressedList.length) > 1) {
+    handleMultipleKeys.handleMultipleKeys({
+      activeCellCoordinates: activeCellCoordinates,
+      event: event,
+      keysPressedList: keysPressedList,
+      selectionAreas: selectionAreas,
+      currentMatcher: currentMatcher,
+      rows: rows,
+      setSelectionAreas: setSelectionAreas,
+      columns: columns,
+      updateActiveCellCoordinates: updateActiveCellCoordinates,
+      spreadsheetRef: spreadsheetRef,
+      removeCellSelections: removeCellSelections.removeCellSelections,
+      blockClass: blockClass,
+      setCurrentMatcher: setCurrentMatcher,
+      usingMac: usingMac
+    });
+  }
+
+  // Allow arrow key navigation if there are less than two activeKeys OR
+  // if one of the activeCellCoordinates is in a header position
+  // Prevent arrow keys, home key, and end key from scrolling the page when the data spreadsheet container has focus
+
+  if (keysPressedList.length < 2 && !handleMultipleKeys.includesShift(keysPressedList) || activeCellCoordinates.row === 'header' || activeCellCoordinates.column === 'header') {
+    switch (key) {
+      case 'Backspace':
+      case 'Delete':
+        {
+          var deleteParams = {
+            selectionAreas: selectionAreas,
+            currentMatcher: currentMatcher,
+            rows: rows,
+            setActiveCellContent: setActiveCellContent,
+            updateData: updateData,
+            activeCellCoordinates: activeCellCoordinates
+          };
+          handleCellDeletion.handleCellDeletion(deleteParams);
+          break;
+        }
+      // Enter
+      case 'Enter':
+        {
+          handleActiveCellInSelectionEnter.handleActiveCellInSelectionEnter({
+            activeCellInsideSelectionArea: activeCellInsideSelectionArea,
+            activeCellCoordinates: activeCellCoordinates,
+            activeCellRef: activeCellRef,
+            selectionAreas: selectionAreas,
+            updateActiveCellCoordinates: updateActiveCellCoordinates
+          });
+          break;
+        }
+      // HOME
+      case 'Home':
+      case 'End':
+        {
+          event.preventDefault();
+          if (handleMultipleKeys.includesResourceKey(keysPressedList, usingMac)) {
+            return;
+          }
+          handleHomeEndKey({
+            type: key
+          });
+          break;
+        }
+      // Tab
+      case 'Tab':
+        {
+          if (activeCellInsideSelectionArea) {
+            event.preventDefault();
+            return handleActiveCellInSelectionTab.handleActiveCellInSelectionTab({
+              activeCellInsideSelectionArea: activeCellInsideSelectionArea,
+              activeCellCoordinates: activeCellCoordinates,
+              activeCellRef: activeCellRef,
+              selectionAreas: selectionAreas,
+              updateActiveCellCoordinates: updateActiveCellCoordinates
+            });
+          }
+          setSelectionAreas([]);
+          removeActiveCell();
+          removeCellEditor();
+          setContainerHasFocus(false);
+          setActiveCellCoordinates(null);
+          break;
+        }
+      case 'ArrowLeft':
+      case 'ArrowUp':
+      case 'ArrowRight':
+      case 'ArrowDown':
+        {
+          handleArrowKeyPress(key);
+        }
+    }
+  }
+};
+
+exports.handleBodyCellClick = handleBodyCellClick;
+exports.handleBodyCellHover = handleBodyCellHover;
+exports.handleKeyPress = handleKeyPress;
+exports.handleRowHeaderClick = handleRowHeaderClick;

package/lib/components/Datagrid/Datagrid/DatagridContent.js

@@ -107,7 +107,8 @@ var DatagridContent = function DatagridContent(_ref) {
           instance: datagridState,
           keysPressedList: keysPressedList,
           state: inlineEditState,
-          usingMac: usingMac
+          usingMac: usingMac,
+          ref: multiKeyTrackingRef
         });
       },
       onFocus: withInlineEdit && function () {

package/lib/components/Datagrid/Datagrid/DatagridEmptyBody.js

@@ -43,7 +43,10 @@ var DatagridEmptyBody = function DatagridEmptyBody(datagridState) {
     link: emptyStateLink
   };
   var validEmptyStates = ['error', 'noData', 'notFound'];
-  return /*#__PURE__*/React__default["default"].createElement(react.TableBody, _rollupPluginBabelHelpers["extends"]({}, getTableBodyProps(), {
+  return /*#__PURE__*/React__default["default"].createElement(react.TableBody, _rollupPluginBabelHelpers["extends"]({}, getTableBodyProps({
+    role: undefined
+  }), {
+    "aria-live": null,
     className: "".concat(blockClass, "__empty-state-body")
   }), /*#__PURE__*/React__default["default"].createElement(react.TableRow, null, /*#__PURE__*/React__default["default"].createElement(react.TableCell, {
     colSpan: headers.length,

package/lib/components/Datagrid/Datagrid/DatagridRefBody.js

@@ -29,7 +29,9 @@ var DatagridRefBody = function DatagridRefBody(datagridState) {
   var getTableBodyProps = datagridState.getTableBodyProps,
     rows = datagridState.rows,
     prepareRow = datagridState.prepareRow;
-  return /*#__PURE__*/React__default["default"].createElement("tbody", _rollupPluginBabelHelpers["extends"]({}, getTableBodyProps(), {
+  return /*#__PURE__*/React__default["default"].createElement("tbody", _rollupPluginBabelHelpers["extends"]({}, getTableBodyProps({
+    role: undefined
+  }), {
     className: cx__default["default"]("".concat(blockClass, "__simple-body"), getTableBodyProps().className)
   }), rows.map(function (row) {
     prepareRow(row);

package/lib/components/Datagrid/Datagrid/DatagridSimpleBody.js

@@ -25,7 +25,10 @@ var DatagridSimpleBody = function DatagridSimpleBody(datagridState) {
   var getTableBodyProps = datagridState.getTableBodyProps,
     rows = datagridState.rows,
     prepareRow = datagridState.prepareRow;
-  return /*#__PURE__*/React__default["default"].createElement(react.TableBody, _rollupPluginBabelHelpers["extends"]({}, getTableBodyProps(), {
+  return /*#__PURE__*/React__default["default"].createElement(react.TableBody, _rollupPluginBabelHelpers["extends"]({}, getTableBodyProps({
+    role: undefined
+  }), {
+    "aria-live": null,
     className: cx__default["default"]("".concat(blockClass, "__simple-body"), getTableBodyProps().className)
   }), rows.map(function (row) {
     prepareRow(row);

package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js

@@ -85,7 +85,11 @@ var DatagridVirtualBody = function DatagridVirtualBody(datagridState) {
       width: (_gridRef$current = gridRef.current) === null || _gridRef$current === void 0 ? void 0 : _gridRef$current.clientWidth,
       overflow: 'hidden'
     }
-  }, /*#__PURE__*/React__default["default"].createElement(DatagridHead["default"], datagridState)), /*#__PURE__*/React__default["default"].createElement(react.TableBody, getTableBodyProps(), /*#__PURE__*/React__default["default"].createElement(reactWindow.VariableSizeList, {
+  }, /*#__PURE__*/React__default["default"].createElement(DatagridHead["default"], datagridState)), /*#__PURE__*/React__default["default"].createElement(react.TableBody, _rollupPluginBabelHelpers["extends"]({}, getTableBodyProps({
+    role: undefined
+  }), {
+    "aria-live": null
+  }), /*#__PURE__*/React__default["default"].createElement(reactWindow.VariableSizeList, {
     height: virtualHeight || tableHeight,
     itemCount: visibleRows.length,
     itemSize: function itemSize(index) {

package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.d.ts

@@ -1,5 +1,5 @@
 export default Columns;
-declare function Columns({ getVisibleColumnsCount, filterString, columns, setColumnsObject, onSelectColumn, assistiveTextInstructionsLabel, assistiveTextDisabledInstructionsLabel, selectAllLabel, customizeTearsheetHeadingLabel }: {
+declare function Columns({ getVisibleColumnsCount, filterString, columns, setColumnsObject, onSelectColumn, assistiveTextInstructionsLabel, assistiveTextDisabledInstructionsLabel, selectAllLabel, customizeTearsheetHeadingLabel, }: {
     getVisibleColumnsCount: any;
     filterString: any;
     columns: any;

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

@@ -162,6 +162,10 @@ var InlineEditCell = function InlineEditCell(_ref) {
       if (type === 'number') {
         numberInputRef.current.focus();
       }
+      if (type === 'selection') {
+        var _dropdownRef$current;
+        dropdownRef === null || dropdownRef === void 0 || (_dropdownRef$current = dropdownRef.current) === null || _dropdownRef$current === void 0 || _dropdownRef$current.focus();
+      }
     }
   }, [inEditMode, type]);
 

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

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

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

@@ -21,7 +21,8 @@ var handleGridKeyPress = function handleGridKeyPress(_ref) {
     state = _ref.state,
     instance = _ref.instance,
     keysPressedList = _ref.keysPressedList,
-    usingMac = _ref.usingMac;
+    usingMac = _ref.usingMac,
+    ref = _ref.ref;
   var key = event.key;
   var gridActive = state.gridActive,
     activeCellId = state.activeCellId,
@@ -58,8 +59,8 @@ var handleGridKeyPress = function handleGridKeyPress(_ref) {
 
   // Checks if the dropdown menu is open
   var dropdownIsActive = function dropdownIsActive() {
-    var focusedElementRole = document.activeElement.getAttribute('role');
-    if (focusedElementRole === 'listbox' && document.activeElement.classList.contains("".concat(settings.carbon.prefix, "--list-box__menu"))) {
+    var selectedDropdown = ref === null || ref === void 0 ? void 0 : ref.current.querySelector("\n      #".concat(instance.tableId, " .").concat(blockClass, "__table-with-inline-edit [data-cell-id=\"").concat(activeCellId, "\"] button[role='combobox']\n    "));
+    if (selectedDropdown) {
       // Prevents arrow keys from scrolling any other content when dropdown menu is open
       event.preventDefault();
       return true;

package/lib/components/Datagrid/Datagrid/addons/stateReducer.js

@@ -94,7 +94,8 @@ var stateReducer = function stateReducer(newState, action) {
         if (rows) {
           var newSelectedRowData = {};
           rows.forEach(function (row) {
-            var props = row.getRowProps();
+            var _row$getRowProps;
+            var props = (_row$getRowProps = row.getRowProps) === null || _row$getRowProps === void 0 ? void 0 : _row$getRowProps.call(row);
             if (props && props.disabled) {
               return;
             }

package/lib/components/Datagrid/useEditableCell.js

@@ -0,0 +1,19 @@
+/**
+ * Copyright IBM Corp. 2020, 2024
+ *
+ * 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';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var useInlineEdit = require('./useInlineEdit.js');
+
+var useEditableCell = function useEditableCell(hooks) {
+  useInlineEdit["default"](hooks, 'usingEditableCell');
+};
+var useEditableCell$1 = useEditableCell;
+
+exports["default"] = useEditableCell$1;

package/lib/components/DelimitedList/DelimitedList.d.ts

@@ -1,6 +1,31 @@
+/**
+ * Copyright IBM Corp. 2024, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React, { PropsWithChildren } from 'react';
+interface DelimitedListProps extends PropsWithChildren {
+    /**
+     * Provide an optional class to be applied to the containing node.
+     */
+    className?: string;
+    /**
+     * The character(s) used to separate the items.
+     */
+    delimiter?: string;
+    /**
+     * Array of items to be listed.
+     */
+    items?: any[];
+    /**
+     * Toggle the component's ability to truncate or not.
+     */
+    truncate?: boolean;
+}
 /**
  * `DelimitedList` converts an array of items into a single line of
  * comma-separated values.
  */
-export let DelimitedList: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+export declare let DelimitedList: React.ForwardRefExoticComponent<DelimitedListProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/lib/components/DelimitedList/DelimitedList.js

@@ -29,7 +29,6 @@ var defaults = {
   items: [],
   truncate: true
 };
-
 /**
  * `DelimitedList` converts an array of items into a single line of
  * comma-separated values.

package/lib/components/EditInPlace/EditInPlace.d.ts

@@ -1,6 +1,98 @@
-export let EditInPlace: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-export namespace deprecatedProps {
-    let invalidText: PropTypes.Requireable<string>;
-}
-import React from 'react';
+/**
+ * Copyright IBM Corp. 2022, 2022
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React, { PropsWithChildren } from 'react';
 import PropTypes from 'prop-types';
+type Size = 'sm' | 'md' | 'lg';
+type AlignPropType = 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'right';
+type Shape = {
+    cancel: AlignPropType;
+    edit: AlignPropType;
+    save: AlignPropType;
+};
+interface EditInplaceProps extends PropsWithChildren {
+    /**
+     * label for cancel button
+     */
+    cancelLabel: string;
+    /**
+     * By default the edit icon is shown on hover only.
+     */
+    editAlwaysVisible?: boolean;
+    /**
+     * label for edit button
+     */
+    editLabel: string;
+    /**
+     * Specify a custom id for the input
+     */
+    id: string;
+    /**
+     * inheritTypography - causes the text entry field to inherit typography settings
+     * assigned to the container. This is useful when editing titles for instance.
+     *
+     * NOTE: The size property limits the vertical size of the input element.
+     * Inherited font's should be selected to fit within the size selected.
+     */
+    inheritTypography?: boolean;
+    /**
+     * determines if the input is invalid
+     */
+    invalid?: boolean;
+    /**
+     * text that is displayed if the input is invalid
+     */
+    invalidText?: string;
+    /**
+     * Provide the text that will be read by a screen reader when visiting this control
+     */
+    labelText: string;
+    /**
+     * handler that is called when the cancel button is pressed or when the user removes focus from the input and there is no new value
+     */
+    onCancel: (value: string) => void;
+    /**
+     * handler that is called when the input is updated
+     */
+    onChange: (value: string) => void;
+    /**
+     * handler that is called when the save button is pressed or when the user removes focus from the input if it has a new value
+     */
+    onSave: () => void;
+    /**
+     * determines if the input is in readOnly mode
+     */
+    /**
+     * label for the edit button that displays when in read only mode
+     */
+    /**
+     * label for save button
+     */
+    saveLabel: string;
+    /**
+     * vertical size of control
+     */
+    size?: Size;
+    /**
+     * tooltipAlignment from the standard tooltip. Default center.
+     *
+     * Can be passed either as one of tooltip options or as an object specifying cancel, edit and save separately
+     */
+    tooltipAlignment?: AlignPropType | Shape;
+    /**
+     * current value of the input
+     */
+    value: string;
+}
+export declare let EditInPlace: React.ForwardRefExoticComponent<EditInplaceProps & React.RefAttributes<HTMLDivElement>>;
+export declare const deprecatedProps: {
+    /**
+     * **Deprecated**
+     * invalidLabel was misnamed, using invalidText to match Carbon
+     */
+    invalidText: PropTypes.Requireable<string>;
+};
+export {};