@pingux/astro 2.143.0 → 2.144.0-alpha.1

package/lib/cjs/components/AIComponents/Response/ResponseMarkdown/MarkdownContainer.js

@@ -38,8 +38,8 @@ var MarkdownContainer = function MarkdownContainer(props) {
     stateIndex = _useContext.stateIndex,
     delay = _useContext.delay;
   var containerChildren = _react.Children.toArray(children);
-  var containsBlocks = checkContainsBlocks(containerChildren);
-  if (containsBlocks) {
+  var hasBlocks = checkContainsBlocks(containerChildren);
+  if (hasBlocks) {
     return (0, _react2.jsx)(_Box["default"], others, (0, _map["default"])(_react.Children).call(_react.Children, containerChildren, function (child, i) {
       return /*#__PURE__*/_react["default"].cloneElement(child, {
         animationIndex: i,

package/lib/cjs/components/Calendar/Calendar.js

@@ -42,7 +42,8 @@ var Calendar = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     hasAutoFocus = props.hasAutoFocus,
     maxValue = props.maxValue,
     minValue = props.minValue,
-    value = props.value;
+    value = props.value,
+    calendarWrapperProps = props.calendarWrapperProps;
   var _useLocale = (0, _i18n.useLocale)(),
     locale = _useLocale.locale;
   var calenderRef = (0, _hooks.useLocalOrForwardRef)(ref);
@@ -115,7 +116,7 @@ var Calendar = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     fontWeight: 3,
     flex: 1
   }, title);
-  return (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({}, calendarProps, {
+  return (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({}, calendarProps, calendarWrapperProps, {
     ref: calenderRef,
     variant: "calendar.calendarContainer",
     role: "group"

package/lib/cjs/components/Checkbox/CheckboxBase.js

@@ -56,8 +56,10 @@ var IndeterminateCheckboxIcon = function IndeterminateCheckboxIcon(props) {
   }));
 };
 IndeterminateCheckboxIcon.propTypes = {
+  // TODO: [Astro 3.0.0] Remove this boolean in favor of the proper naming convention - isDisabled
   // eslint-disable-next-line react/boolean-prop-naming
-  disabled: _propTypes["default"].bool
+  disabled: _propTypes["default"].bool,
+  isDisabled: _propTypes["default"].bool
 };
 
 /**

package/lib/cjs/components/ComboBox/ComboBoxInput.js

@@ -76,14 +76,14 @@ var ComboBoxInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       loadingState: loadingState,
       inputValue: inputProps.value
     }),
-    showLoading = _useInputLoader.showLoading;
+    isLoading = _useInputLoader.isLoading;
   (0, _hooks.usePropWarning)(props, 'disabled', 'isDisabled');
   var button = !isReadOnly && (0, _react2.jsx)(_.Box, {
     isRow: true,
     variant: "forms.comboBox.inputInContainerSlot"
   },
   // Render loader after delay if filtering or loading
-  showLoading && (isOpen || menuTrigger === 'manual' || loadingState === _loadingStates["default"].LOADING) && (0, _react2.jsx)(_.Loader, {
+  isLoading && (isOpen || menuTrigger === 'manual' || loadingState === _loadingStates["default"].LOADING) && (0, _react2.jsx)(_.Loader, {
     variant: "loader.withinInput"
   }), (0, _react2.jsx)(_interactions.PressResponder, {
     preventFocusOnPress: true,

package/lib/cjs/components/DataTable/DataTable.js

@@ -140,8 +140,8 @@ var DataTable = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     gridProps = _useTable.gridProps;
   var _useState3 = (0, _react.useState)(false),
     _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    headerMenuOpen = _useState4[0],
-    setHeaderMenuOpen = _useState4[1];
+    isHeaderMenuOpen = _useState4[0],
+    setIsHeaderMenuOpen = _useState4[1];
 
   // This overrides collection view's renderWrapper to support DOM hierarchy.
   var renderWrapper = function renderWrapper(parent, reusableView, children, renderChildren) {
@@ -257,8 +257,8 @@ var DataTable = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       setIsInResizeMode: setIsInResizeMode,
       isEmpty: isEmpty,
       onFocusedResizer: onFocusedResizer,
-      headerMenuOpen: headerMenuOpen,
-      setHeaderMenuOpen: setHeaderMenuOpen
+      headerMenuOpen: isHeaderMenuOpen,
+      setHeaderMenuOpen: setIsHeaderMenuOpen
     }
   }, (0, _react2.jsx)(_DataTableVirtualizer["default"], (0, _extends2["default"])({}, mergedProps, {
     layout: layout,

package/lib/cjs/components/DataTable/DataTable.stories.js

@@ -491,7 +491,7 @@ Dynamic.parameters = {
 var Sortable = function Sortable(args) {
   var _useState = (0, _react.useState)(true),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    firstSortFlag = _useState2[0],
+    hasFirstSortFlag = _useState2[0],
     setFirstSortFlag = _useState2[1];
   var columns = [{
     name: 'Country',
@@ -593,14 +593,14 @@ var Sortable = function Sortable(args) {
     }
   });
   (0, _react.useEffect)(function () {
-    if (firstSortFlag && !list.isLoading && list.items.length > 0) {
+    if (hasFirstSortFlag && !list.isLoading && list.items.length > 0) {
       (0, _sort["default"])(list).call(list, {
         column: 'country',
         direction: 'ascending'
       });
       setFirstSortFlag(false);
     }
-  }, [firstSortFlag, list, list.isLoading, list.items]);
+  }, [hasFirstSortFlag, list, list.isLoading, list.items]);
   return (0, _react2.jsx)(_index.DataTable, (0, _extends2["default"])({}, args, {
     "aria-label": "Sortable table",
     sortDescriptor: list.sortDescriptor,

package/lib/cjs/components/DatePicker/DateField.js

@@ -39,7 +39,7 @@ var _index = require("../../index");
 var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
 var _DateSegment = _interopRequireDefault(require("./DateSegment"));
 var _react2 = require("@emotion/react");
-var _excluded = ["buttonProps", "className", "fieldProps", "groupProps", "groupRef", "hasFormatHelpText", "helperText", "isDisabled", "isOpen", "isReadOnly", "isRequired", "status", "datePickerState", "minValue", "maxValue", "unavailableRanges"],
+var _excluded = ["buttonProps", "className", "fieldProps", "groupProps", "groupRef", "hasFormatHelpText", "helperText", "isDisabled", "isOpen", "isReadOnly", "isRequired", "status", "datePickerState", "minValue", "maxValue", "unavailableRanges", "fieldControlProps"],
   _excluded2 = ["defaultValue"];
 /**
  * DateFields allow users to enter and edit date using a keyboard.
@@ -71,6 +71,7 @@ var DateField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     minValue = props.minValue,
     maxValue = props.maxValue,
     unavailableRanges = props.unavailableRanges,
+    fieldControlProps = props.fieldControlProps,
     other = (0, _objectWithoutProperties2["default"])(props, _excluded);
   var _useState = (0, _react.useState)(''),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
@@ -234,7 +235,7 @@ var DateField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   })))), (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
     isRow: true,
     variant: "forms.datePicker.inputField"
-  }, dateFieldProps, {
+  }, dateFieldProps, fieldControlProps, {
     ref: fieldRef,
     className: classNames
   }), (0, _react2.jsx)(_reactAria.FocusScope, null, (0, _map["default"])(_context3 = isLocalEnUS ? enUSSegments : segments).call(_context3, function (segment, index) {
@@ -320,7 +321,9 @@ DateField.propTypes = {
   /** The ranges of unavailable dates passed  */
   unavailableRanges: _propTypes["default"].arrayOf(_propTypes["default"].arrayOf(_propTypes["default"].string)),
   /** Props object that is spread directly into the input wrapper element. */
-  wrapperProps: _propTypes["default"].shape({})
+  wrapperProps: _propTypes["default"].shape({}),
+  /** Props object that spread into date segment wrapper element. */
+  fieldControlProps: _propTypes["default"].shape({})
 };
 DateField.defaultProps = {
   hasAutoFocus: false,

package/lib/cjs/components/DatePicker/DatePicker.js

@@ -51,7 +51,9 @@ var DatePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     minValue = props.minValue,
     status = props.status,
     value = props.value,
-    unavailableRanges = props.unavailableRanges;
+    unavailableRanges = props.unavailableRanges,
+    fieldControlProps = props.fieldControlProps,
+    calendarWrapperProps = props.calendarWrapperProps;
   var groupRef = (0, _react.useRef)();
   var popoverRef = (0, _react.useRef)();
 
@@ -107,12 +109,15 @@ var DatePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     autoFocus: true,
     contain: true,
     restoreFocus: true
-  }, (0, _react2.jsx)(_index.Calendar, calendarProps)));
+  }, (0, _react2.jsx)(_index.Calendar, (0, _extends2["default"])({}, calendarProps, {
+    calendarWrapperProps: calendarWrapperProps
+  }))));
   return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_DateField["default"], (0, _extends2["default"])({}, (0, _pendoID.getPendoID)('DatePicker'), props, {
     ref: ref,
     buttonProps: buttonProps,
     fieldProps: fieldProps,
     groupProps: (0, _object.omit)(groupProps, 'data-pendo-id'),
+    fieldControlProps: fieldControlProps,
     groupRef: groupRef,
     helperText: helperText,
     labelProps: labelProps,
@@ -177,7 +182,11 @@ DatePicker.propTypes = {
   /** Determines the textarea status indicator and helper text styling. */
   status: _propTypes["default"].oneOf((0, _values["default"])(_statuses["default"])),
   /** The ranges of unavailable dates passed  */
-  unavailableRanges: _propTypes["default"].arrayOf(_propTypes["default"].arrayOf(_propTypes["default"].string))
+  unavailableRanges: _propTypes["default"].arrayOf(_propTypes["default"].arrayOf(_propTypes["default"].string)),
+  /** Props object that spread into date segment wrapper element. */
+  fieldControlProps: _propTypes["default"].shape({}),
+  /** Props object that spread into calendar element. */
+  calendarWrapperProps: _propTypes["default"].shape({})
 };
 _DateField["default"].defaultProps = {
   isDisabled: false,

package/lib/cjs/components/DatePicker/DatePicker.stories.js

@@ -14,7 +14,7 @@ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequ
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.UnavailableDates = exports.Required = exports.ReadOnly = exports.MinimumDate = exports.MaximumDate = exports.FormatHelperText = exports.Error = exports.Disabled = exports.DefaultValue = exports.DefaultOpen = exports.Default = exports.Controlled = void 0;
+exports["default"] = exports.UnavailableDates = exports.Required = exports.ReadOnly = exports.MinimumDate = exports.MaximumDate = exports.FormatHelperText = exports.Error = exports.Disabled = exports.DefaultValue = exports.DefaultOpen = exports.Default = exports.CustomWidth = exports.Controlled = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
@@ -276,4 +276,23 @@ Error.parameters = {
     type: 'figma',
     url: _figmaLinks.FIGMA_LINKS.datePicker.error
   }
-};
+};
+var CustomWidth = function CustomWidth(args) {
+  return (0, _react2.jsx)(_DatePicker["default"], (0, _extends2["default"])({}, args, {
+    fieldControlProps: {
+      sx: {
+        width: '500px'
+      }
+    },
+    calendarWrapperProps: {
+      sx: {
+        maxWidth: '500px',
+        width: '400px',
+        '&  tr': {
+          gap: '20px'
+        }
+      }
+    }
+  }));
+};
+exports.CustomWidth = CustomWidth;

package/lib/cjs/components/GridList/GridList.stories.d.ts

@@ -44,13 +44,13 @@ declare const _default: {
                 disable: boolean;
             };
         };
-        allowDuplicateSelectionEvents: {
+        shouldAllowDuplicateSelectionEvents: {
             description: string;
             control: {
                 type: string;
             };
         };
-        autoFocus: {
+        hasAutoFocus: {
             description: string;
             control: {
                 type: string;
@@ -75,13 +75,13 @@ declare const _default: {
                 options: string[];
             };
         };
-        disallowEmptySelection: {
+        shouldDisallowEmptySelection: {
             description: string;
             control: {
                 type: string;
             };
         };
-        disallowTypeAhead: {
+        shouldDisallowTypeAhead: {
             description: string;
             control: {
                 type: string;

package/lib/cjs/components/GridList/gridListAttributes.d.ts

@@ -29,13 +29,13 @@ export declare const gridListArgTypes: {
             disable: boolean;
         };
     };
-    allowDuplicateSelectionEvents: {
+    shouldAllowDuplicateSelectionEvents: {
         description: string;
         control: {
             type: string;
         };
     };
-    autoFocus: {
+    hasAutoFocus: {
         description: string;
         control: {
             type: string;
@@ -60,13 +60,13 @@ export declare const gridListArgTypes: {
             options: string[];
         };
     };
-    disallowEmptySelection: {
+    shouldDisallowEmptySelection: {
         description: string;
         control: {
             type: string;
         };
     };
-    disallowTypeAhead: {
+    shouldDisallowTypeAhead: {
         description: string;
         control: {
             type: string;

package/lib/cjs/components/GridList/gridListAttributes.js

@@ -36,13 +36,13 @@ var gridListArgTypes = {
       disable: true
     }
   },
-  allowDuplicateSelectionEvents: {
+  shouldAllowDuplicateSelectionEvents: {
     description: 'Whether duplicate selection events are allowed.',
     control: {
       type: 'boolean'
     }
   },
-  autoFocus: {
+  hasAutoFocus: {
     description: 'Whether the grid should automatically focus on mount.',
     control: {
       type: 'boolean'
@@ -67,13 +67,13 @@ var gridListArgTypes = {
       options: ['all', 'selection']
     }
   },
-  disallowEmptySelection: {
+  shouldDisallowEmptySelection: {
     description: 'Whether empty selection is disallowed.',
     control: {
       type: 'boolean'
     }
   },
-  disallowTypeAhead: {
+  shouldDisallowTypeAhead: {
     description: 'Whether type-ahead functionality is disabled.',
     control: {
       type: 'boolean'

package/lib/cjs/components/IconButtonToggle/IconButtonToggle.js

@@ -28,7 +28,7 @@ var IconButtonToggle = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
   var conditionalRenderProps = {
     ComponentToRenderIfTrue: toggledIcon,
     ComponentToRenderIfFalse: defaultIcon,
-    condition: isToggled,
+    isToggled: isToggled,
     onConditionChange: onToggle
   };
   var _useComponentToggle = (0, _hooks.useComponentToggle)(conditionalRenderProps),

package/lib/cjs/components/Image/Image.js

@@ -42,8 +42,8 @@ var Image = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     setIsLoading = _useState2[1];
   var _useState3 = (0, _react.useState)(false),
     _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    loadedSuccessfully = _useState4[0],
-    setLoadedSuccessfully = _useState4[1];
+    isLoadedSuccessfully = _useState4[0],
+    setIsLoadedSuccessfully = _useState4[1];
   var _useState5 = (0, _react.useState)(false),
     _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
     shouldShowFallback = _useState6[0],
@@ -55,7 +55,7 @@ var Image = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     setIsLoading(newState);
     isLoadingRef.current = newState;
   };
-  var shouldUseFallbackProps = !loadedSuccessfully && !(isLoadingRef !== null && isLoadingRef !== void 0 && isLoadingRef.current) || shouldShowFallback;
+  var shouldUseFallbackProps = !isLoadedSuccessfully && !(isLoadingRef !== null && isLoadingRef !== void 0 && isLoadingRef.current) || shouldShowFallback;
   var setImgAttribute = function setImgAttribute(attribute, fallbackAttribute) {
     return shouldUseFallbackProps ? fallbackAttribute : attribute;
   };
@@ -88,7 +88,7 @@ var Image = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var onImageLoad = function onImageLoad() {
     if (isLoadingRef !== null && isLoadingRef !== void 0 && isLoadingRef.current) {
       setIsLoadingWithRef(false);
-      setLoadedSuccessfully(true);
+      setIsLoadedSuccessfully(true);
     }
   };
   var onImageError = function onImageError() {
@@ -133,7 +133,7 @@ var Image = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     sx: sx,
     "aria-live": "polite"
   }, others, hoverProps));
-  if (isLoading || !loadedSuccessfully && !fallbackImage) {
+  if (isLoading || !isLoadedSuccessfully && !fallbackImage) {
     return (0, _react2.jsx)(Skeleton, null);
   }
   return themeUiImage;

package/lib/cjs/components/ListBox/ListBox.js

@@ -36,7 +36,7 @@ var _index = require("./index");
 var _ListBoxContext = require("./ListBoxContext");
 var _ListBoxSection = _interopRequireDefault(require("./ListBoxSection"));
 var _react2 = require("@emotion/react");
-var _excluded = ["defaultSelectedKeys", "disabledKeys", "hasAutoFocus", "hasFocusWrap", "hasNoEmptySelection", "hasVirtualFocus", "id", "isCondensed", "isLoading", "isFocusedOnHover", "isSelectedOnPressUp", "isVirtualized", "items", "keyboardDelegate", "label", "loadingState", "onLoadMore", "onLoadPrev", "onScroll", "onSelectionChange", "renderEmptyState", "selectedKeys", "selectionMode", "state", "aria-label", "aria-labelledby", "aria-describedby", "aria-details", "showSelectedOption"];
+var _excluded = ["defaultSelectedKeys", "disabledKeys", "hasAutoFocus", "hasFocusWrap", "hasNoEmptySelection", "hasVirtualFocus", "id", "isCondensed", "isLoading", "isFocusedOnHover", "isSelectedOnPressUp", "isVirtualized", "items", "keyboardDelegate", "label", "loadingState", "onLoadMore", "onLoadPrev", "onScroll", "onSelectionChange", "renderEmptyState", "selectedKeys", "selectionMode", "state", "aria-label", "aria-labelledby", "aria-describedby", "aria-details", "shouldShowSelectedOption"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty2(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -96,7 +96,7 @@ var ListBox = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     ariaLabelledby = props['aria-labelledby'],
     ariaDescribedby = props['aria-describedby'],
     ariaDetails = props['aria-details'],
-    showSelectedOption = props.showSelectedOption,
+    shouldShowSelectedOption = props.shouldShowSelectedOption,
     others = (0, _objectWithoutProperties2["default"])(props, _excluded);
 
   // Object matching React Aria API with all options
@@ -198,7 +198,7 @@ var ListBox = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
         item: item,
         hasVirtualFocus: hasVirtualFocus,
         isCondensed: isCondensed,
-        showSelectedOption: showSelectedOption
+        shouldShowSelectedOption: shouldShowSelectedOption
       });
     }
     if (type === collectionTypes.LOADER) {

package/lib/cjs/components/ListBox/Option.js

@@ -28,7 +28,7 @@ var _Box = _interopRequireDefault(require("../Box"));
 var _Icon = _interopRequireDefault(require("../Icon"));
 var _ListBoxContext = require("./ListBoxContext");
 var _react2 = require("@emotion/react");
-var _excluded = ["item", "hasVirtualFocus", "isCondensed", "showSelectedOption"],
+var _excluded = ["item", "hasVirtualFocus", "isCondensed", "shouldShowSelectedOption"],
   _excluded2 = ["onPressStart", "onPressUp"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -67,7 +67,7 @@ var Option = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var item = props.item,
     hasVirtualFocus = props.hasVirtualFocus,
     isCondensed = props.isCondensed,
-    showSelectedOption = props.showSelectedOption,
+    shouldShowSelectedOption = props.shouldShowSelectedOption,
     others = (0, _objectWithoutProperties2["default"])(props, _excluded);
   var key = item.key,
     itemProps = item.props,
@@ -95,9 +95,9 @@ var Option = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     isFocused = _useOption.isFocused,
     isFocusVisible = _useOption.isFocusVisible,
     isPressed = _useOption.isPressed;
-  var focused = isFocused || (state === null || state === void 0 || (_state$selectionManag = state.selectionManager) === null || _state$selectionManag === void 0 ? void 0 : _state$selectionManag.focusedKey) === item.key;
+  var hasFocus = isFocused || (state === null || state === void 0 || (_state$selectionManag = state.selectionManager) === null || _state$selectionManag === void 0 ? void 0 : _state$selectionManag.focusedKey) === item.key;
   var setFocusOnHover = function setFocusOnHover() {
-    if (!focused && !isCondensed) {
+    if (!hasFocus && !isCondensed) {
       state.selectionManager.setFocusedKey(item.key);
     }
   };
@@ -105,8 +105,8 @@ var Option = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     isOnyx = _useGetTheme.themeState.isOnyx;
   var _useStatusClasses = (0, _hooks.useStatusClasses)(null, {
       isDisabled: isDisabled || isSeparator,
-      isFocused: focused,
-      isSelected: showSelectedOption ? isSelected : false,
+      isFocused: hasFocus,
+      isSelected: shouldShowSelectedOption ? isSelected : false,
       isCondensed: isCondensed,
       isFocusVisible: isFocusVisible,
       isPressed: isPressed
@@ -143,12 +143,12 @@ var Option = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     mr: "xs",
     className: classNames,
     variant: "listBox.checkboxIcon"
-  }) : isSelected && !isOnyx && showSelectedOption && (0, _react2.jsx)(_Icon["default"], {
+  }) : isSelected && !isOnyx && shouldShowSelectedOption && (0, _react2.jsx)(_Icon["default"], {
     icon: _CircleSmallIcon["default"],
     title: {
       name: 'Circle Small Icon'
     }
-  }), rendered, isSelected && isOnyx && showSelectedOption && (0, _react2.jsx)(_Icon["default"], {
+  }), rendered, isSelected && isOnyx && shouldShowSelectedOption && (0, _react2.jsx)(_Icon["default"], {
     icon: _CheckIcon["default"],
     title: {
       name: 'Check Icon'
@@ -157,7 +157,7 @@ var Option = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }));
 });
 Option.defaultProps = {
-  showSelectedOption: true
+  shouldShowSelectedOption: true
 };
 var _default = Option;
 exports["default"] = _default;

package/lib/cjs/components/MenuItem/MenuItem.js

@@ -29,14 +29,14 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "functi
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var MenuItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var item = props.item,
-    propIsDisabled = props.isDisabled,
+    isPropDisabled = props.isDisabled,
     isFocusVisible = props.isFocusVisible,
     isNotFocusedOnHover = props.isNotFocusedOnHover,
     className = props.className,
     state = props.state;
   var _useMenuContext = (0, _MenuContext.useMenuContext)(),
     onClose = _useMenuContext.onClose,
-    closeOnSelect = _useMenuContext.closeOnSelect;
+    shouldCloseOnSelect = _useMenuContext.shouldCloseOnSelect;
   var _ref = item,
     key = _ref.key,
     rendered = _ref.rendered,
@@ -45,7 +45,7 @@ var MenuItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     propIsPressed = itemProps.isPressed,
     dataId = itemProps['data-id'],
     others = (0, _objectWithoutProperties2["default"])(itemProps, _excluded);
-  var isDisabled = propIsDisabled || state.disabledKeys.has(key);
+  var isDisabled = isPropDisabled || state.disabledKeys.has(key);
   var isSelected = state.selectionManager.isSelected(key);
   (0, _hooks.usePropWarning)(props, 'disabled', 'isDisabled');
   var menuItemRef = (0, _hooks.useLocalOrForwardRef)(ref);
@@ -55,7 +55,7 @@ var MenuItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       isDisabled: isDisabled,
       isSelected: isSelected,
       onClose: onClose,
-      closeOnSelect: closeOnSelect
+      closeOnSelect: shouldCloseOnSelect
     }, state, menuItemRef),
     menuItemProps = _useMenuItem.menuItemProps;
   var _useState = (0, _react.useState)(false),

package/lib/cjs/components/MultivaluesField/CondensedMultivaluesField.js

@@ -122,7 +122,7 @@ var CondensedMultivaluesField = /*#__PURE__*/(0, _react.forwardRef)(function (pr
       loadingState: loadingState,
       inputValue: filterString
     }),
-    showLoading = _useInputLoader.showLoading;
+    isLoading = _useInputLoader.isLoading;
   (0, _react.useEffect)(function () {
     setInitialItems((0, _from["default"])(items));
   }, []);
@@ -391,7 +391,7 @@ var CondensedMultivaluesField = /*#__PURE__*/(0, _react.forwardRef)(function (pr
     variant: "forms.comboBox.inputInContainerSlot"
   },
   // Render loader after delay if filtering or loading
-  showLoading && (isOpen || loadingState === _loadingStates["default"].LOADING) && (0, _react2.jsx)(_.Loader, {
+  isLoading && (isOpen || loadingState === _loadingStates["default"].LOADING) && (0, _react2.jsx)(_.Loader, {
     variant: "loader.withinInput"
   }), (0, _react2.jsx)(_.Box, {
     as: "button",

package/lib/cjs/components/MultivaluesField/DefaultMultivaluesField.js

@@ -159,7 +159,7 @@ var DefaultMultivaluesField = /*#__PURE__*/(0, _react.forwardRef)(function (prop
       loadingState: loadingState,
       inputValue: filterString
     }),
-    showLoading = _useInputLoader.showLoading;
+    isLoading = _useInputLoader.isLoading;
   var closeBadgeRefs = (0, _react.useRef)([]);
   var inputWrapperRef = (0, _react.useRef)();
   var inputRef = (0, _react.useRef)();
@@ -518,7 +518,7 @@ var DefaultMultivaluesField = /*#__PURE__*/(0, _react.forwardRef)(function (prop
     variant: "forms.comboBox.inputInContainerSlot"
   },
   // Render loader after delay if filtering or loading
-  showLoading && loadingState === _loadingStates["default"].LOADING && (0, _react2.jsx)(_.Loader, {
+  isLoading && loadingState === _loadingStates["default"].LOADING && (0, _react2.jsx)(_.Loader, {
     variant: "loader.withinInput"
   }));
   return (0, _react2.jsx)(_MultivaluesContext.MultivaluesContext.Provider, {

package/lib/cjs/components/NavBarSection/NavBarItemHeader.js

@@ -51,22 +51,22 @@ var NavBarSectionItemHeader = function NavBarSectionItemHeader(_ref2) {
   var array = (item === null || item === void 0 ? void 0 : item.children) && (0, _map["default"])(_context = item.children).call(_context, function (i) {
     return i.key;
   });
-  var childSelected = array && (0, _includes["default"])(array).call(array, navBarState.selectedKey);
+  var isChildSelected = array && (0, _includes["default"])(array).call(array, navBarState.selectedKey);
   (0, _react.useEffect)(function () {
-    if (childSelected && isExpanded === false) {
+    if (isChildSelected && isExpanded === false) {
       var _context2;
       setExpandedKeys((0, _concat["default"])(_context2 = []).call(_context2, expandedKeys, [key]));
     }
   }, [selectedKey]);
   var _useStatusClasses = (0, _hooks.useStatusClasses)(className, {
-      isSelected: childSelected && !isExpanded
+      isSelected: isChildSelected && !isExpanded
     }),
     classNames = _useStatusClasses.classNames;
   var getIconColor = function getIconColor() {
     if (navStyles.navBarItemHeader === 'navBar.popUpItemHeaderContainer') {
-      return childSelected && !isExpanded ? 'white' : 'text.primary';
+      return isChildSelected && !isExpanded ? 'white' : 'text.primary';
     }
-    return childSelected && !isExpanded ? 'white' : 'neutral.95';
+    return isChildSelected && !isExpanded ? 'white' : 'neutral.95';
   };
   return (0, _react2.jsx)(_index.Box, {
     variant: navStyles.navBarItemHeader,

package/lib/cjs/components/NavSideBar/NavSideBarSectionHeader.js

@@ -43,23 +43,23 @@ var NavSideBarSectionHeader = function NavSideBarSectionHeader(props) {
     navStyles = navBarState.navStyles,
     selectedKey = navBarState.selectedKey;
   var isExpanded = (0, _includes["default"])(expandedKeys).call(expandedKeys, id);
-  var childSelected = (0, _isArray["default"])(items) && (0, _includes["default"])(_context = (0, _map["default"])(items).call(items, function (i) {
+  var isChildSelected = (0, _isArray["default"])(items) && (0, _includes["default"])(_context = (0, _map["default"])(items).call(items, function (i) {
     return i.key;
   })).call(_context, selectedKey);
   (0, _react.useEffect)(function () {
-    if (childSelected && isExpanded === false) {
+    if (isChildSelected && isExpanded === false) {
       var _context2;
       setExpandedKeys((0, _concat["default"])(_context2 = []).call(_context2, expandedKeys, [id]));
     }
   }, []);
   var _useStatusClasses = (0, _hooks.useStatusClasses)(className, {
-      isSelected: childSelected && !isExpanded
+      isSelected: isChildSelected && !isExpanded
     }),
     classNames = _useStatusClasses.classNames;
-  var variant = childSelected && !isExpanded ? navStyles.navBarItemIcon : navStyles.navBarItemIconSelected;
+  var variant = isChildSelected && !isExpanded ? navStyles.navBarItemIcon : navStyles.navBarItemIconSelected;
   var handleButtonPress = function handleButtonPress() {
     onExpandedChange(!isExpanded);
-    if (childSelected && isExpanded === false) {
+    if (isChildSelected && isExpanded === false) {
       var _context3;
       setExpandedKeys((0, _concat["default"])(_context3 = []).call(_context3, expandedKeys, [id]));
     }

package/lib/cjs/components/PopoverMenu/PopoverMenu.js

@@ -77,7 +77,7 @@ var PopoverMenu = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     ref: menuRef,
     onClose: state.close,
     // Our API preference is for default false so we invert this since it should be default true
-    closeOnSelect: !isNotClosedOnSelect,
+    shouldCloseOnSelect: !isNotClosedOnSelect,
     autoFocus: state.focusStrategy || true
   });
   var contents = (0, _react2.jsx)(_reactAria.FocusScope, {

package/lib/cjs/components/ProgressBar/ProgressBar.js

@@ -33,8 +33,8 @@ exports.calculateBarWidth = calculateBarWidth;
 var ProgressBar = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _props$label = props.label,
     label = _props$label === void 0 ? '' : _props$label,
-    _props$showValueLabel = props.showValueLabel,
-    showValueLabel = _props$showValueLabel === void 0 ? true : _props$showValueLabel,
+    _props$shouldShowValu = props.shouldShowValueLabel,
+    shouldShowValueLabel = _props$shouldShowValu === void 0 ? true : _props$shouldShowValu,
     value = props.value,
     _props$minValue = props.minValue,
     minValue = _props$minValue === void 0 ? 0 : _props$minValue,
@@ -58,7 +58,7 @@ var ProgressBar = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }, label && (0, _react2.jsx)(_.Text, (0, _extends2["default"])({
     fontSize: "xs",
     fontWeight: "3"
-  }, labelProps), label), showValueLabel && (0, _react2.jsx)(_.Text, {
+  }, labelProps), label), shouldShowValueLabel && (0, _react2.jsx)(_.Text, {
     fontSize: "xs",
     fontWeight: "3"
   }, progressBarProps['aria-valuetext'])), (0, _react2.jsx)(_.Box, {