@carbon/ibm-products 2.70.1 → 2.71.0

package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.js

@@ -156,7 +156,7 @@ const ConditionBlock = props => {
       'aria-setsize': aria.setsize
     } : {};
   };
-  const renderChildren = popoverRef => {
+  const renderChildren = (popoverRef, closePopover) => {
     return /*#__PURE__*/React.createElement(ItemComponent, {
       conditionState: {
         property,
@@ -167,7 +167,21 @@ const ConditionBlock = props => {
       config: config,
       "data-name": "valueField",
       parentRef: popoverRef,
-      type: type
+      type: type,
+      closePopover: closePopover
+    });
+  };
+  const renderItemOption = (popoverRef, closePopover) => {
+    return /*#__PURE__*/React.createElement(ItemOption.ItemOption, {
+      conditionState: {
+        value: property,
+        label: propertyText
+      },
+      onChange: onPropertyChangeHandler,
+      config: {
+        options: inputConfig?.properties
+      },
+      closePopover: closePopover
     });
   };
   return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({
@@ -217,17 +231,9 @@ const ConditionBlock = props => {
     condition: condition,
     type: type,
     description: description,
-    onChange: onPropertyChangeHandler
-  }, /*#__PURE__*/React.createElement(ItemOption.ItemOption, {
-    conditionState: {
-      value: property,
-      label: propertyText
-    },
     onChange: onPropertyChangeHandler,
-    config: {
-      options: inputConfig?.properties
-    }
-  })), util.checkIsValid(property) && /*#__PURE__*/React.createElement(ConditionBuilderItem.ConditionBuilderItem, {
+    renderChildren: renderItemOption
+  }), util.checkIsValid(property) && /*#__PURE__*/React.createElement(ConditionBuilderItem.ConditionBuilderItem, {
     label: operator,
     title: operatorText,
     "data-name": "operatorField",

package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.d.ts

@@ -18,7 +18,7 @@ interface ConditionBuilderItemProps extends PropsWithChildren {
     description?: string;
     condition?: Action & Condition;
     config?: ConfigType;
-    renderChildren?: (ref: Ref<HTMLDivElement>) => ReactNode;
+    renderChildren?: (ref: Ref<HTMLDivElement | null>, closePopover: () => void) => ReactNode;
     onChange?: (val: string) => void;
     tabIndex?: number;
     onMouseEnter?: (e: React.MouseEvent<HTMLButtonElement>) => void;

package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js

@@ -91,7 +91,9 @@ const ConditionBuilderItem = _ref => {
       }
       if (condition.popoverToOpen == currentField) {
         //current popover need to be opened
-        openPopOver();
+        setTimeout(() => {
+          openPopOver();
+        });
       }
     } else {
       // when we change any statement(if/ excl.if) which is not part of condition state, label change is triggered.
@@ -128,7 +130,7 @@ const ConditionBuilderItem = _ref => {
     }
   };
   const handleKeyDownHandler = evt => {
-    handleKeyboardEvents.handleKeyDownForPopover(evt, conditionBuilderRef, popoverRef);
+    handleKeyboardEvents.handleKeyDownForPopover(evt, conditionBuilderRef, popoverRef, closePopover);
     if (evt.key === 'Escape') {
       manageInvalidSelection();
     }
@@ -180,7 +182,7 @@ const ConditionBuilderItem = _ref => {
     className: `${util.blockClass}__item__title`
   }, title), /*#__PURE__*/React.createElement("div", {
     className: `${util.blockClass}__popover-content`
-  }, renderChildren ? renderChildren(popoverRef) : children)))));
+  }, renderChildren ? renderChildren(popoverRef, closePopover) : children)))));
 };
 ConditionBuilderItem.propTypes = {
   /**

package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.d.ts

@@ -17,9 +17,10 @@ interface ItemOptionProps {
         isStatement?: boolean;
     };
     onChange: (value: string, e: Event) => void;
+    closePopover?: () => void;
 }
 export declare const ItemOption: {
-    ({ conditionState, config, onChange, }: ItemOptionProps): React.JSX.Element | undefined;
+    ({ conditionState, config, onChange, closePopover, }: ItemOptionProps): React.JSX.Element | undefined;
     propTypes: {
         /**
          * current condition object

package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOption.js

@@ -19,7 +19,8 @@ const ItemOption = _ref => {
   let {
     conditionState = {},
     config = {},
-    onChange
+    onChange,
+    closePopover
   } = _ref;
   const {
     popOverSearchThreshold
@@ -73,7 +74,9 @@ const ItemOption = _ref => {
     labelText: clearSearchText,
     closeButtonLabelText: clearSearchText,
     onChange: onSearchChangeHandler,
-    onKeyDown: evt => util.onKeyDownHandlerForSearch(evt, conditionBuilderRef)
+    onKeyDown: evt => {
+      util.onKeyDownHandlerForSearch(evt, conditionBuilderRef, closePopover);
+    }
   })), /*#__PURE__*/React.createElement("ul", {
     "aria-label": getAriaLabel(),
     role: "listbox"

package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.d.ts

@@ -12,9 +12,10 @@ interface ItemOptionForValueFieldProps {
     };
     config: PropertyConfigOption['config'];
     onChange: (value: any, e?: Event) => void;
+    closePopover?: () => void;
 }
 export declare const ItemOptionForValueField: {
-    ({ conditionState, config, onChange, }: ItemOptionForValueFieldProps): React.JSX.Element;
+    ({ conditionState, config, onChange, closePopover, }: ItemOptionForValueFieldProps): React.JSX.Element;
     propTypes: {
         /**
          * current condition object

package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ItemOptionForValueField.js

@@ -20,7 +20,8 @@ const ItemOptionForValueField = _ref => {
   let {
     conditionState = {},
     config = {},
-    onChange
+    onChange,
+    closePopover
   } = _ref;
   const multiSelectable = util.checkForMultiSelectOperator(conditionState, config);
   const {
@@ -125,7 +126,9 @@ const ItemOptionForValueField = _ref => {
     labelText: clearSearchText,
     closeButtonLabelText: clearSearchText,
     onChange: onSearchChangeHandler,
-    onKeyDown: evt => util.onKeyDownHandlerForSearch(evt, conditionBuilderRef)
+    onKeyDown: evt => {
+      util.onKeyDownHandlerForSearch(evt, conditionBuilderRef, closePopover);
+    }
   })), multiSelectable && /*#__PURE__*/React.createElement("div", {
     className: `${util.blockClass}__multiselectSelectionStatusContainer`
   }, /*#__PURE__*/React.createElement("label", null, selection.length, "/", allOptions.length, " Selected"), /*#__PURE__*/React.createElement(react.Button, {

package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.d.ts

@@ -9,10 +9,18 @@ import { PropertyConfigTime } from '../../ConditionBuilder.types';
 interface ConditionBuilderItemTime {
     onChange: (value: string | undefined) => void;
     config: PropertyConfigTime['config'];
+    conditionState: {
+        label?: string;
+        value?: string;
+    };
 }
 export declare const ConditionBuilderItemTime: {
-    ({ onChange, config, }: ConditionBuilderItemTime): React.JSX.Element;
+    ({ onChange, config, conditionState, }: ConditionBuilderItemTime): React.JSX.Element;
     propTypes: {
+        /**
+         * current condition object
+         */
+        conditionState: any;
         /**
          * current config object that this property is part of
          */

package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js

@@ -16,14 +16,26 @@ var _SelectItem, _SelectItem2;
 const ConditionBuilderItemTime = _ref => {
   let {
     onChange,
-    config
+    config,
+    conditionState
   } = _ref;
-  const [timeValue, setTimeValue] = React.useState('');
-  const [dayZoneValue, setDayZoneValue] = React.useState('AM');
-  const [timeZoneValue, setTimeZoneValue] = React.useState(config?.timeZones?.[0]);
+  const getInitialValue = itemType => {
+    const itemMap = {
+      time: 0,
+      dayZone: 1,
+      timeZone: 2
+    };
+    return conditionState.value !== 'INVALID' ? conditionState.value?.split(' ')[itemMap[itemType]] ?? undefined : undefined;
+  };
+  const initialTimeValue = getInitialValue('time');
+  const initialDayZone = getInitialValue('dayZone');
+  const initialTimeZone = getInitialValue('timeZone');
+  const [timeValue, setTimeValue] = React.useState(initialTimeValue);
+  const [dayZoneValue, setDayZoneValue] = React.useState(initialDayZone ?? 'AM');
+  const [timeZoneValue, setTimeZoneValue] = React.useState(initialTimeZone ?? config?.timeZones?.[0]);
   React.useEffect(() => {
     const timeToUpdate = `${timeValue ?? ''} ${dayZoneValue ?? ''} ${timeZoneValue ?? ''}`;
-    onChange(timeValue ? timeToUpdate : undefined);
+    onChange(timeValue ? timeToUpdate : 'INVALID');
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [timeValue, dayZoneValue, timeZoneValue]);
   const setTimeZone = evt => {
@@ -38,11 +50,13 @@ const ConditionBuilderItemTime = _ref => {
   return /*#__PURE__*/React.createElement("div", {
     className: `${util.blockClass}__item-time`
   }, /*#__PURE__*/React.createElement(react.TimePicker, {
+    defaultValue: initialTimeValue,
     id: "time-picker",
     labelText: "Select a time",
     onChange: setTime
   }, /*#__PURE__*/React.createElement(react.TimePickerSelect, {
     id: "time-picker-day-zone",
+    defaultValue: initialDayZone,
     onChange: setDayZone
   }, _SelectItem || (_SelectItem = /*#__PURE__*/React.createElement(react.SelectItem, {
     value: "AM",
@@ -52,6 +66,7 @@ const ConditionBuilderItemTime = _ref => {
     text: "PM"
   }))), /*#__PURE__*/React.createElement(react.TimePickerSelect, {
     id: "time-picker-time-zone",
+    defaultValue: initialTimeZone,
     onChange: setTimeZone
   }, config?.timeZones?.map((timeZone, index) => /*#__PURE__*/React.createElement(react.SelectItem, {
     key: index,
@@ -60,6 +75,10 @@ const ConditionBuilderItemTime = _ref => {
   })))));
 };
 ConditionBuilderItemTime.propTypes = {
+  /**
+   * current condition object
+   */
+  conditionState: index.default.object,
   /**
    * current config object that this property is part of
    */

package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.d.ts

@@ -1,2 +1,2 @@
 export function handleKeyDown(evt: any, conditionBuilderRef: any, variant: any): void;
-export function handleKeyDownForPopover(evt: any, conditionBuilderRef: any, popoverRef: any): void;
+export function handleKeyDownForPopover(evt: any, conditionBuilderRef: any, popoverRef: any, closePopover: any): void;

package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.js

@@ -15,18 +15,18 @@ const handleKeyDown = (evt, conditionBuilderRef, variant) => {
     handleKeyPressForMainContent(evt, conditionBuilderRef, variant);
   }
 };
-const handleKeyDownForPopover = (evt, conditionBuilderRef, popoverRef) => {
+const handleKeyDownForPopover = (evt, conditionBuilderRef, popoverRef, closePopover) => {
   if (excludeKeyPress(evt)) {
     return;
   }
-  handleKeyPressForPopover(evt, popoverRef?.current, conditionBuilderRef);
+  handleKeyPressForPopover(evt, popoverRef?.current, conditionBuilderRef, closePopover);
 };
 
 //skipping keyboard handling for date and time fields to get take carbon's
 const excludeKeyPress = evt => {
   return !['Escape'].includes(evt.key) && evt.target.closest(`.${util.blockClass}__item-date`);
 };
-const handleKeyPressForPopover = (evt, parentContainer, conditionBuilderRef) => {
+const handleKeyPressForPopover = (evt, parentContainer, conditionBuilderRef, closePopover) => {
   const key = evt.key;
   const isHoldingShiftKey = util.checkForHoldingKey(evt, 'shiftKey');
   const isMultiSelect = parentContainer.querySelector('ul')?.dataset.multiSelect;
@@ -34,6 +34,8 @@ const handleKeyPressForPopover = (evt, parentContainer, conditionBuilderRef) =>
   let allItems = [];
   if (key === 'Escape') {
     //focus the corresponding field in which the popover is triggered from
+
+    closePopover?.();
     util.focusThisField(evt, conditionBuilderRef);
     evt.preventDefault();
     evt.stopPropagation();
@@ -90,8 +92,8 @@ const handleKeyPressForPopover = (evt, parentContainer, conditionBuilderRef) =>
     if (key === 'Enter' && !isHoldingShiftKey) {
       if (document.activeElement.type !== 'button') {
         //for button , enter key is click which already handled by framework, else trigger click
+        closePopover?.();
         util.focusThisField(evt, conditionBuilderRef);
-        document.activeElement?.click();
       }
     }
   }

package/lib/components/ConditionBuilder/utils/util.d.ts

@@ -10,4 +10,4 @@ export function checkIsValid(item: any): any;
 export function manageTabIndexAndFocus(currentElement: any, conditionBuilderRef: any): void;
 export function getValue(type: any, value: any, config: any): any;
 export function checkForMultiSelectOperator(condition: any, config: any): any;
-export function onKeyDownHandlerForSearch(evt: any, conditionBuilderRef: any): void;
+export function onKeyDownHandlerForSearch(evt: any, conditionBuilderRef: any, closePopover: any): void;

package/lib/components/ConditionBuilder/utils/util.js

@@ -14,10 +14,16 @@ const NON_HIERARCHICAL_VARIANT = 'Non-Hierarchical';
 const HIERARCHICAL_VARIANT = 'Hierarchical';
 const focusThisField = (evt, conditionBuilderRef) => {
   if (evt) {
+    const target = evt.target;
+    const itemRow = evt.target.closest('[role="row"]');
+    const buttonName = evt.target.closest('[role="gridcell"]')?.querySelector('button').dataset.name;
     setTimeout(() => {
-      manageTabIndexAndFocus(evt.target.closest('[role="gridcell"]')?.querySelector('button'), conditionBuilderRef);
-      evt.target.closest('[role="gridcell"]')?.querySelector('button')?.click();
-      evt.target.closest('[role="gridcell"]')?.querySelector('button')?.focus();
+      const selector = itemRow.querySelector(`button[data-name="${buttonName}"]`);
+      manageTabIndexAndFocus(selector, conditionBuilderRef);
+      if (document.contains(target)) {
+        evt.target.closest('[role="gridcell"]')?.querySelector('button')?.click();
+        evt.target.closest('[role="gridcell"]')?.querySelector('button')?.focus();
+      }
     }, 0);
   }
 };
@@ -80,9 +86,10 @@ const checkForMultiSelectOperator = (condition, config) => {
   return condition?.operator === 'oneOf' || config?.operators?.find(operator => condition?.operator === operator.id && operator.isMultiSelect);
 };
 //this will close the popover on escape key on search box
-const onKeyDownHandlerForSearch = (evt, conditionBuilderRef) => {
+const onKeyDownHandlerForSearch = (evt, conditionBuilderRef, closePopover) => {
   if (!evt.currentTarget.value && evt.key === 'Escape') {
     focusThisField(evt, conditionBuilderRef);
+    closePopover?.();
   }
 };
 

package/lib/components/CreateModal/CreateModal.d.ts

@@ -1,12 +1,11 @@
 /**
- * Copyright IBM Corp. 2021, 2024
+ * Copyright IBM Corp. 2021, 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.
  */
-import { ComposedModal } from '@carbon/react';
-import React, { ReactNode } from 'react';
-export interface CreateModalProps extends React.ComponentProps<typeof ComposedModal> {
+import React, { PropsWithChildren, ReactNode } from 'react';
+export interface CreateModalProps extends PropsWithChildren {
     /**
      * Specify an optional className to be applied to the modal root node
      */
@@ -65,6 +64,4 @@ resource. It is triggered by a user’s action, appears on top of the main page
 content, and is persistent until dismissed. The purpose of this modal should be
 immediately apparent to the user, with a clear and obvious path to completion.
  */
-export declare let CreateModal: React.ForwardRefExoticComponent<CreateModalProps & {
-    children?: ReactNode | undefined;
-} & React.RefAttributes<HTMLDivElement>>;
+export declare let CreateModal: React.ForwardRefExoticComponent<CreateModalProps & React.RefAttributes<HTMLDivElement>>;

package/lib/components/CreateModal/CreateModal.js

@@ -18,27 +18,14 @@ var usePortalTarget = require('../../global/js/hooks/usePortalTarget.js');
 
 const componentName = 'CreateModal';
 const blockClass = `${settings.pkg.prefix}--create-modal`;
-
-// Custom PropType validator which checks and ensures that the children property has no more than 4 nodes
-const isValidChildren = () => _ref => {
-  let {
-    children
-  } = _ref;
-  if (children && children.length > 4) {
-    throw new Error('The `CreateModal` component does not take more than 4 nodes as children. This is to ensure that the modal does not overflow. Please remove 1 or more nodes.');
-  }
-  return;
-};
 /**
  * The `CreateModal` component provides a way for a user to quickly generate a new
 resource. It is triggered by a user’s action, appears on top of the main page
 content, and is persistent until dismissed. The purpose of this modal should be
 immediately apparent to the user, with a clear and obvious path to completion.
  */
-exports.CreateModal = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
-  let {
-    // The component props, in alphabetical order (for consistency).
-
+exports.CreateModal = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const {
     className,
     children,
     onRequestClose,
@@ -52,9 +39,8 @@ exports.CreateModal = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
     primaryButtonText,
     disableSubmit,
     selectorPrimaryFocus,
-    // Collect any other property values passed in.
     ...rest
-  } = _ref2;
+  } = props;
   const renderPortalUse = usePortalTarget.usePortalTarget(portalTargetIn);
   return renderPortalUse(/*#__PURE__*/React.createElement(react.ComposedModal, _rollupPluginBabelHelpers.extends({}, rest, {
     selectorPrimaryFocus: selectorPrimaryFocus,
@@ -98,8 +84,7 @@ exports.CreateModal.propTypes = {
   /**
    * Children refers to all form items within a form inside of the modal's body.
    */
-  /**@ts-ignore*/
-  children: isValidChildren(),
+  children: index.default.node,
   /**
    * Specify an optional className to be applied to the modal root node
    */

package/lib/components/CreateTearsheet/CreateTearsheetStep.d.ts

@@ -18,6 +18,9 @@ type fieldsetLegendTextProps = {
      * Otherwise, use CSS to hide/remove this label text.
      */
     fieldsetLegendText?: string;
+    /**
+     * This is the required legend id that appears as the aria-labelledby of fieldset for accessibility purposes.
+     */
     fieldsetLegendId?: React.ReactNode;
 } | {
     /**
@@ -32,6 +35,9 @@ type fieldsetLegendTextProps = {
      * Otherwise, use CSS to hide/remove this label text.
      */
     fieldsetLegendText: string;
+    /**
+     * This is the required legend id that appears as the aria-labelledby of fieldset for accessibility purposes.
+     */
     fieldsetLegendId: React.ReactNode;
 };
 interface CreateTearsheetStepBaseProps extends PropsWithChildren {

package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js

@@ -149,8 +149,16 @@ const DraggableItemsList = _ref => {
     strategy: sortable.verticalListSortingStrategy
   }, visibleCols.map(colDef => {
     const colHeaderTitle = getNodeTextContent.getNodeTextContent(colDef.Header);
-    const parts = colHeaderTitle.split(new RegExp(`(${filterString})`, 'gi'));
-    const highlightedText = parts.map(part => part.toLowerCase() === filterString.toLowerCase() ? /*#__PURE__*/React.createElement("strong", null, part) : part);
+    // const parts = colHeaderTitle.split(
+    //   new RegExp(`(${filterString})`, 'gi')
+    // );
+    // const highlightedText = parts.map((part) =>
+    //   part.toLowerCase() === filterString.toLowerCase() ? (
+    //     <strong>{part}</strong>
+    //   ) : (
+    //     part
+    //   )
+    // );
     const isFrozenColumn = !!colDef.sticky;
     const isDisabled = colDef.disabled;
     const listContents = /*#__PURE__*/React.createElement(react.Checkbox, {
@@ -163,7 +171,8 @@ const DraggableItemsList = _ref => {
         return onSelectColumn(colDef, checked);
       },
       id: `${blockClass}__customization-column-${colDef.id}`,
-      labelText: highlightedText,
+      labelText: colHeaderTitle //filterString ? highlightedText : colHeaderTitle
+      ,
       className: `${blockClass}__customize-columns-checkbox`,
       onKeyDown: event => handleCheckboxKeydown(event, colDef)
     });

package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.d.ts

@@ -1,21 +1,46 @@
-export const FilterContext: React.Context<any>;
-export function clearSingleFilter({ key, value, tableId }: {
+/**
+ * Copyright IBM Corp. 2022, 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 from 'react';
+import { SAVED_FILTERS } from './constants';
+import { Filter } from '../../../../FilterSummary/FilterSummary';
+type ActionType = typeof SAVED_FILTERS;
+interface Action {
+    type: ActionType;
+    payload?: any;
+}
+export interface ContextType {
+    EventEmitter: any;
+    dispatch: React.Dispatch<Action>;
+    state: {
+        savedFilters: object[];
+    };
+    setPanelOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    panelOpen: boolean;
+    tableId: string;
+    filterTags: Filter[];
+}
+export declare const FilterContext: React.Context<ContextType>;
+export declare const clearSingleFilter: ({ key, value, tableId }: {
     key: any;
     value: any;
     tableId: any;
-}, setAllFilters: any, state: any, contextTableId: any): void;
-export function FilterProvider({ children, filters, filterProps, tableId }: {
-    children: any;
-    filters: any;
-    filterProps: any;
-    tableId: any;
-}): React.JSX.Element;
-export namespace FilterProvider {
-    namespace propTypes {
-        let children: any;
-        let filterProps: any;
-        let filters: any;
-        let tableId: any;
-    }
-}
-import React from 'react';
+}, setAllFilters: any, state: any, contextTableId: any) => void;
+export declare const FilterProvider: {
+    ({ children, filters, filterProps, tableId }: {
+        children: any;
+        filters: any;
+        filterProps: any;
+        tableId: any;
+    }): React.JSX.Element;
+    propTypes: {
+        children: any;
+        filterProps: any;
+        filters: any;
+        tableId: any;
+    };
+};
+export {};

package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js

@@ -11,7 +11,7 @@ var React = require('react');
 var index = require('../../../../../_virtual/index.js');
 var constants = require('./constants.js');
 
-const FilterContext = /*#__PURE__*/React.createContext();
+const FilterContext = /*#__PURE__*/React.createContext({});
 const EventEmitter = {
   events: {},
   dispatch: function (event, data) {

package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilterContext.d.ts

@@ -4,5 +4,5 @@
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-declare const useFilterContext: () => any;
+declare const useFilterContext: () => import("../FilterProvider").ContextType;
 export default useFilterContext;

package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilterContext.js

@@ -16,8 +16,8 @@ const useFilterContext = () => {
   // get the context
   const context = React.useContext(FilterProvider.FilterContext);
 
-  // if `undefined`, throw an error
-  if (context === undefined) {
+  // if empty object, throw an error
+  if (Object.entries(context).length === 0) {
     throw new Error('useFilterContext was used outside of its Provider');
   }
   return context;

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

@@ -1,4 +1,10 @@
-export const InlineEditContext: React.Context<any>;
+export const InlineEditContext: React.Context<{
+    state: {};
+    dispatch: ({ type, payload }: {
+        type: any;
+        payload: any;
+    }) => void;
+}>;
 export function InlineEditProvider({ children }: {
     children: any;
 }): React.JSX.Element;

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

@@ -12,7 +12,15 @@ var index = require('../../../../../../_virtual/index.js');
 var returnUpdatedActiveCell = require('./returnUpdatedActiveCell.js');
 var getCellIdAsObject = require('./getCellIdAsObject.js');
 
-const InlineEditContext = /*#__PURE__*/React.createContext();
+const InlineEditContext = /*#__PURE__*/React.createContext({
+  state: {},
+  dispatch: _ref => {
+    let {
+      type,
+      payload
+    } = _ref;
+  }
+});
 const inlineEditReducer = (state, action) => {
   switch (action.type) {
     case 'ADD_GRID_ACTIVE_FOCUS':
@@ -89,10 +97,10 @@ const inlineEditReducer = (state, action) => {
       return state;
   }
 };
-const InlineEditProvider = _ref => {
+const InlineEditProvider = _ref2 => {
   let {
     children
-  } = _ref;
+  } = _ref2;
   const initialState = {};
   const [state, dispatch] = React.useReducer(inlineEditReducer, initialState);
   return /*#__PURE__*/React.createElement(InlineEditContext.Provider, {

package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js

@@ -15,10 +15,20 @@ var react = require('@carbon/react');
 var settings = require('../../../../../settings.js');
 
 const blockClass = `${settings.pkg.prefix}--datagrid__row-size`;
-const RowSizeRadioGroup = /*#__PURE__*/React.forwardRef((_ref, ref) => {
-  let {
-    rowSizes,
-    selectedOption,
+const RowSizeRadioGroup = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const {
+    rowSizes = [{
+      value: 'xl' // 64
+    }, {
+      value: 'lg' // 48
+    }, {
+      value: 'md' // 40
+    }, {
+      value: 'sm' // 32
+    }, {
+      value: 'xs' // 24
+    }],
+    selectedOption = 'lg',
     onChange,
     legendText,
     rowSizeLabels = {
@@ -29,7 +39,7 @@ const RowSizeRadioGroup = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       xs: 'Extra small'
     },
     tableId
-  } = _ref;
+  } = props;
   return /*#__PURE__*/React.createElement("div", {
     className: `${blockClass}-dropdown`,
     role: "presentation",
@@ -67,20 +77,6 @@ const getBackwardCompatibleRowSize = rowSize => {
   };
   return rowSizeMap[rowSize] || rowSize;
 };
-RowSizeRadioGroup.defaultProps = {
-  rowSizes: [{
-    value: 'xl' // 64
-  }, {
-    value: 'lg' // 48
-  }, {
-    value: 'md' // 40
-  }, {
-    value: 'sm' // 32
-  }, {
-    value: 'xs' // 24
-  }],
-  selectedOption: 'lg'
-};
 RowSizeRadioGroup.propTypes = {
   legendText: index.default.string,
   onChange: index.default.func.isRequired,