@lumx/react 3.15.1 → 3.15.2-alpha.1

package/index.js

@@ -339,12 +339,11 @@ const _isEmpty = value => {
  * @param  value  The value of the type of the CSS class (e.g.: 'primary', 'button', ...).
  * @return The basic CSS class.
  */
-function getBasicClass(_ref) {
-  let {
-    prefix,
-    type,
-    value
-  } = _ref;
+function getBasicClass({
+  prefix,
+  type,
+  value
+}) {
   if (isBoolean(value)) {
     if (!value) {
       // False value should not return a class.
@@ -370,11 +369,11 @@ function getBasicClass(_ref) {
  *                be used in the classname to represent the value of the given prop.
  * @return All LumX basic CSS classes.
  */
-function handleBasicClasses(_ref2) {
+function handleBasicClasses(_ref) {
   let {
       prefix
-    } = _ref2,
-    props = _objectWithoutProperties(_ref2, _excluded$1t);
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded$1t);
   const otherClasses = {};
   if (!isEmpty(props)) {
     Object.keys(props).forEach(prop => {
@@ -751,8 +750,7 @@ AlertDialog.defaultProps = DEFAULT_PROPS$13;
  * @param element       Element to focus.
  * @param shouldFocus   Boolean flag to trigger the focus
  */
-function useFocus(element) {
-  let shouldFocus = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+function useFocus(element, shouldFocus = true) {
   const [wasFocus, setWasFocus] = useState(false);
   useEffect(() => {
     if (shouldFocus && wasFocus !== shouldFocus && element) {
@@ -770,10 +768,7 @@ function useFocus(element) {
  * @param  refs React references to merge.
  * @return the merged ref.
  */
-function mergeRefs() {
-  for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
-    refs[_key] = arguments[_key];
-  }
+function mergeRefs(...refs) {
   return value => refs.forEach(ref => {
     if (typeof ref === 'function') {
       ref(value);
@@ -787,10 +782,7 @@ function mergeRefs() {
 /**
  * Same as `mergeRefs` but memoized
  */
-const useMergeRefs = function () {
-  for (var _len2 = arguments.length, refs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-    refs[_key2] = arguments[_key2];
-  }
+const useMergeRefs = (...refs) => {
   return useMemo(() => mergeRefs(...refs),
   // eslint-disable-next-line react-hooks/exhaustive-deps
   refs);
@@ -1263,14 +1255,11 @@ const _excluded$1m = ["linkAs"];
  * @param children  Link children.
  * @return          A link.
  */
-const renderLink = function (_ref) {
+const renderLink = (_ref, ...children) => {
   let {
       linkAs
     } = _ref,
     forwardedProps = _objectWithoutProperties(_ref, _excluded$1m);
-  for (var _len = arguments.length, children = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-    children[_key - 1] = arguments[_key];
-  }
   return /*#__PURE__*/React__default.createElement(linkAs || 'a', forwardedProps, ...children);
 };
 
@@ -1862,8 +1851,7 @@ const INITIAL_STATE_ACTIVE_CHIP = -1;
  *
  * @return chip navigation tools.
  */
-const useChipGroupNavigation = function (chips, onChipDeleted) {
-  let initialActiveChip = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : INITIAL_STATE_ACTIVE_CHIP;
+const useChipGroupNavigation = (chips, onChipDeleted, initialActiveChip = INITIAL_STATE_ACTIVE_CHIP) => {
   const [wasBackspacePressed, setWasBackspacePressed] = useState(false);
   const [activeChip, setActiveChip] = useState(initialActiveChip);
 
@@ -2121,8 +2109,7 @@ const FIRST_DAY_FOR_LOCALES = [{
 }];
 
 /** Find first day of week for locale from the constant */
-const getFromConstant = function (locale) {
-  let searchBy = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'code';
+const getFromConstant = (locale, searchBy = 'code') => {
   // Search for locale (lang + region)
   for (const {
     localeRX,
@@ -2194,10 +2181,7 @@ const MONTH_ROW_COUNT = 6;
  * Get month calendar.
  * A list of weeks with days indexed by week day number
  */
-const getMonthCalendar = function (locale) {
-  let referenceDate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : new Date();
-  let rangeMinDate = arguments.length > 2 ? arguments[2] : undefined;
-  let rangeMaxDate = arguments.length > 3 ? arguments[3] : undefined;
+const getMonthCalendar = (locale, referenceDate = new Date(), rangeMinDate, rangeMaxDate) => {
   const month = referenceDate.getMonth();
   const iterDate = new Date(referenceDate);
   iterDate.setDate(1);
@@ -2452,22 +2436,19 @@ const DatePickerControlled = forwardRef((props, ref) => {
     className: `${CLASSNAME$17}__calendar`
   }, /*#__PURE__*/React__default.createElement("div", {
     className: `${CLASSNAME$17}__week-days ${CLASSNAME$17}__days-wrapper`
-  }, weekDays.map(_ref => {
-    let {
-      letter,
-      number,
-      long
-    } = _ref;
-    return /*#__PURE__*/React__default.createElement("div", {
-      key: number,
-      className: `${CLASSNAME$17}__day-wrapper`
-    }, /*#__PURE__*/React__default.createElement("span", {
-      className: `${CLASSNAME$17}__week-day`,
-      "aria-hidden": true
-    }, letter.toLocaleUpperCase()), /*#__PURE__*/React__default.createElement("span", {
-      className: "visually-hidden"
-    }, long));
-  })), /*#__PURE__*/React__default.createElement("div", {
+  }, weekDays.map(({
+    letter,
+    number,
+    long
+  }) => /*#__PURE__*/React__default.createElement("div", {
+    key: number,
+    className: `${CLASSNAME$17}__day-wrapper`
+  }, /*#__PURE__*/React__default.createElement("span", {
+    className: `${CLASSNAME$17}__week-day`,
+    "aria-hidden": true
+  }, letter.toLocaleUpperCase()), /*#__PURE__*/React__default.createElement("span", {
+    className: "visually-hidden"
+  }, long)))), /*#__PURE__*/React__default.createElement("div", {
     className: `${CLASSNAME$17}__month-days ${CLASSNAME$17}__days-wrapper`
   }, weeks.flatMap((week, weekIndex) => {
     return weekDays.map((weekDay, dayIndex) => {
@@ -2692,8 +2673,7 @@ const LISTENERS = makeListenerTowerContext();
  * @param callback      Callback
  * @param closeOnEscape Disables the hook when false
  */
-function useCallbackOnEscape(callback) {
-  let closeOnEscape = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+function useCallbackOnEscape(callback, closeOnEscape = true) {
   useEffect(() => {
     const rootElement = DOCUMENT === null || DOCUMENT === void 0 ? void 0 : DOCUMENT.body;
     if (!closeOnEscape || !callback || !rootElement) {
@@ -3424,10 +3404,7 @@ const INITIAL_INDEX$1 = -1;
  * @param  preventTabOnEnteredValue determines whether upon TAB, if there is a value entered, the event is prevented or not.
  * @return useKeyboardListNavigation helpers.
  */
-const useKeyboardListNavigation = function (items, ref, onListItemSelected, onListItemNavigated, onEnterPressed, onBackspacePressed) {
-  let keepFocusAfterSelection = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
-  let initialIndex = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : INITIAL_INDEX$1;
-  let preventTabOnEnteredValue = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : true;
+const useKeyboardListNavigation = (items, ref, onListItemSelected, onListItemNavigated, onEnterPressed, onBackspacePressed, keepFocusAfterSelection = false, initialIndex = INITIAL_INDEX$1, preventTabOnEnteredValue = true) => {
   const [activeItemIndex, setActiveItemIndex] = useState(initialIndex);
 
   /**
@@ -3601,11 +3578,10 @@ const DEFAULT_PROPS$R = {
  * Check if the list item is clickable.
  * @return `true` if the list item is clickable; `false` otherwise.
  */
-function isClickable(_ref) {
-  let {
-    linkProps,
-    onItemSelected
-  } = _ref;
+function isClickable({
+  linkProps,
+  onItemSelected
+}) {
   return !isEmpty(linkProps === null || linkProps === void 0 ? void 0 : linkProps.href) || !!onItemSelected;
 }
 
@@ -3942,8 +3918,7 @@ if (process.env.NODE_ENV === 'production') {
  *       remove this function and then remove react-is from the dependencies
  */
 function flattenChildren(children) {
-  function recur(nodes) {
-    let keys = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+  function recur(nodes, keys = []) {
     return Children.toArray(nodes).reduce((acc, node, index) => {
       var _get;
       const nodeKeys = keys.concat((_get = get(node, 'key')) !== null && _get !== void 0 ? _get : index);
@@ -4202,10 +4177,9 @@ const skipRender = (predicate, Component) => {
  *
  * The callback must be wrapped in a React ref to avoid updating the `useLayoutEffect` before the un-mount
  */
-const OnBeforeUnmount = _ref => {
-  let {
-    callbackRef
-  } = _ref;
+const OnBeforeUnmount = ({
+  callbackRef
+}) => {
   useLayoutEffect(() => {
     return () => {
       var _callbackRef$current;
@@ -4223,12 +4197,11 @@ const OnBeforeUnmount = _ref => {
  * Provides an unmount sentinel to inject in the popover to detect when it closes and restore the focus to the
  * anchor if needed.
  */
-function useRestoreFocusOnClose(_ref, popoverElement) {
-  let {
-    focusAnchorOnClose,
-    anchorRef,
-    parentElement
-  } = _ref;
+function useRestoreFocusOnClose({
+  focusAnchorOnClose,
+  anchorRef,
+  parentElement
+}, popoverElement) {
   const onBeforeUnmountRef = React__default.useRef();
   React__default.useEffect(() => {
     if (!popoverElement || !focusAnchorOnClose) {
@@ -6345,23 +6318,20 @@ var usePopper$1 = function usePopper(referenceElement, popperElement, options) {
 };
 
 /** Stub usePopper for use outside of browsers */
-const useStubPopper = (_a, _p, _ref) => {
-  let {
-    placement
-  } = _ref;
-  return {
-    attributes: {
-      popper: {
-        'data-popper-placement': placement
-      }
-    },
-    styles: {
-      popper: {
-        transform: 'translate(1, 1)'
-      }
+const useStubPopper = (_a, _p, {
+  placement
+}) => ({
+  attributes: {
+    popper: {
+      'data-popper-placement': placement
     }
-  };
-};
+  },
+  styles: {
+    popper: {
+      transform: 'translate(1, 1)'
+    }
+  }
+});
 
 /** Switch hook implementation between environment */
 const usePopper = IS_BROWSER ? usePopper$1 : useStubPopper;
@@ -6421,17 +6391,15 @@ const sameWidth = memoize(anchorWidthOption => ({
   enabled: true,
   phase: 'beforeWrite',
   requires: ['computeStyles'],
-  fn(_ref) {
-    let {
-      state
-    } = _ref;
+  fn({
+    state
+  }) {
     // eslint-disable-next-line no-param-reassign
     state.styles.popper[anchorWidthOption] = `${state.rects.reference.width}px`;
   },
-  effect(_ref2) {
-    let {
-      state
-    } = _ref2;
+  effect({
+    state
+  }) {
     // eslint-disable-next-line no-param-reassign
     state.elements.popper.style[anchorWidthOption] = `${state.elements.reference.offsetWidth}px`;
   }
@@ -6445,12 +6413,11 @@ const maxSize = {
   enabled: true,
   phase: 'main',
   requiresIfExists: ['offset', 'preventOverflow', 'flip'],
-  fn(_ref3) {
-    let {
-      state,
-      name,
-      options
-    } = _ref3;
+  fn({
+    state,
+    name,
+    options
+  }) {
     const overflow = detectOverflow(state, options);
     const {
       y = 0,
@@ -6479,10 +6446,9 @@ const applyMaxHeight = {
   enabled: true,
   phase: 'beforeWrite',
   requires: ['maxSize'],
-  fn(_ref4) {
-    let {
-      state
-    } = _ref4;
+  fn({
+    state
+  }) {
     const {
       height
     } = state.modifiersData.maxSize;
@@ -6490,19 +6456,18 @@ const applyMaxHeight = {
     state.elements.popper.style.maxHeight = `${height - ARROW_SIZE$1}px`;
   }
 };
-function usePopoverStyle(_ref5) {
+function usePopoverStyle({
+  offset,
+  hasArrow,
+  fitToAnchorWidth,
+  fitWithinViewportHeight,
+  boundaryRef,
+  anchorRef,
+  placement,
+  style,
+  zIndex
+}) {
   var _offset$along, _offset$away, _state$placement, _state$rects$popper$y, _state$rects, _state$rects$popper;
-  let {
-    offset,
-    hasArrow,
-    fitToAnchorWidth,
-    fitWithinViewportHeight,
-    boundaryRef,
-    anchorRef,
-    placement,
-    style,
-    zIndex
-  } = _ref5;
   const [popperElement, setPopperElement] = useState(null);
   const [arrowElement, setArrowElement] = useState(null);
   const actualOffset = [(_offset$along = offset === null || offset === void 0 ? void 0 : offset.along) !== null && _offset$along !== void 0 ? _offset$along : 0, ((_offset$away = offset === null || offset === void 0 ? void 0 : offset.away) !== null && _offset$away !== void 0 ? _offset$away : 0) + (hasArrow ? ARROW_SIZE$1 : 0)];
@@ -6752,9 +6717,7 @@ const SCROLL_TRIGGER_MARGIN = 5;
  * @param  [callback]        A callback function to call when the bottom of the reference element is reached.
  * @param  [callbackOnMount] A callback function to call when the component is mounted.
  */
-const useInfiniteScroll = function (ref, callback) {
-  let callbackOnMount = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
-  let scrollTriggerMargin = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : SCROLL_TRIGGER_MARGIN;
+const useInfiniteScroll = (ref, callback, callbackOnMount = false, scrollTriggerMargin = SCROLL_TRIGGER_MARGIN) => {
   useEffect(() => {
     const {
       current
@@ -7238,14 +7201,11 @@ const DEFAULT_VALUE = {};
  * Tooltip react context simply used as a marker to know when parent react node have a tooltip
  */
 const TooltipContext = /*#__PURE__*/React__default.createContext(undefined);
-const TooltipContextProvider = _ref => {
-  let {
-    children
-  } = _ref;
-  return /*#__PURE__*/React__default.createElement(TooltipContext.Provider, {
-    value: DEFAULT_VALUE
-  }, children);
-};
+const TooltipContextProvider = ({
+  children
+}) => /*#__PURE__*/React__default.createElement(TooltipContext.Provider, {
+  value: DEFAULT_VALUE
+}, children);
 const useTooltipContext = () => React__default.useContext(TooltipContext);
 
 /**
@@ -7449,11 +7409,10 @@ Heading.defaultProps = DEFAULT_PROPS$J;
 /**
  * Provide a new heading level context.
  */
-const HeadingLevelProvider = _ref => {
-  let {
-    children,
-    level
-  } = _ref;
+const HeadingLevelProvider = ({
+  children,
+  level
+}) => {
   const {
     level: contextLevel
   } = useHeadingLevel();
@@ -8020,18 +7979,12 @@ function usePointerZoom(scrollAreaRef, onScaleChange, animateScroll) {
 
       // Centered point between all pointers
       const centerPoint = {
-        x: pointers.reduce((x, _ref) => {
-          let {
-            clientX
-          } = _ref;
-          return x + clientX;
-        }, 0) / pointers.length,
-        y: pointers.reduce((y, _ref2) => {
-          let {
-            clientY
-          } = _ref2;
-          return y + clientY;
-        }, 0) / pointers.length
+        x: pointers.reduce((x, {
+          clientX
+        }) => x + clientX, 0) / pointers.length,
+        y: pointers.reduce((y, {
+          clientY
+        }) => y + clientY, 0) / pointers.length
       };
 
       // Movement of the center point
@@ -8235,19 +8188,18 @@ const ImageSlide = /*#__PURE__*/React__default.memo(props => {
 
 const _excluded$V = ["image", "imgRef"];
 /** Internal image slideshow component for ImageLightbox */
-const ImageSlideshow = _ref => {
+const ImageSlideshow = ({
+  activeImageIndex,
+  images,
+  slideGroupLabel,
+  zoomInButtonProps,
+  zoomOutButtonProps,
+  slideshowControlsProps,
+  currentPaginationItemRef,
+  footerRef,
+  activeImageRef
+}) => {
   var _images$activeIndex, _images$activeIndex2, _images$activeIndex3;
-  let {
-    activeImageIndex,
-    images,
-    slideGroupLabel,
-    zoomInButtonProps,
-    zoomOutButtonProps,
-    slideshowControlsProps,
-    currentPaginationItemRef,
-    footerRef,
-    activeImageRef
-  } = _ref;
   const {
     activeIndex,
     slideshowId,
@@ -8300,10 +8252,7 @@ const ImageSlideshow = _ref => {
   const onScaleChange = React__default.useMemo(() => {
     if (!zoomEnabled) return undefined;
     return newScale => {
-      setScale(function () {
-        let prevScale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
-        return Math.max(1, newScale * prevScale);
-      });
+      setScale((prevScale = 1) => Math.max(1, newScale * prevScale));
     };
   }, [zoomEnabled]);
   const zoomIn = React__default.useCallback(() => onScaleChange === null || onScaleChange === void 0 ? void 0 : onScaleChange(1.5), [onScaleChange]);
@@ -8326,12 +8275,7 @@ const ImageSlideshow = _ref => {
     return mergeRefs(images === null || images === void 0 ? void 0 : images[index].imgRef, isActive ? activeImageRef : undefined);
   },
   // memoize based on both arguments
-  function () {
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    return args.join();
-  }), [images, activeImageRef]);
+  (...args) => args.join()), [images, activeImageRef]);
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Slides, {
     activeIndex: activeIndex,
     slideGroupLabel: slideGroupLabel,
@@ -8340,12 +8284,12 @@ const ImageSlideshow = _ref => {
     ref: setSlideshow,
     slidesId: slideshowSlidesId,
     toggleAutoPlay: toggleAutoPlay
-  }, images.map((_ref2, index) => {
+  }, images.map((_ref, index) => {
     let {
         image,
         imgRef
-      } = _ref2,
-      imageProps = _objectWithoutProperties(_ref2, _excluded$V);
+      } = _ref,
+      imageProps = _objectWithoutProperties(_ref, _excluded$V);
     const isActive = index === activeIndex;
     return /*#__PURE__*/React__default.createElement(ImageSlide, {
       isActive: isActive,
@@ -8400,12 +8344,11 @@ function setupViewTransitionName(elementRef, name) {
  * @param changes                callback containing the changes to apply within the view transition.
  * @param setViewTransitionName  set the `viewTransitionName` style on a `source` & `target` to morph these elements.
  */
-async function startViewTransition(_ref) {
+async function startViewTransition({
+  changes,
+  viewTransitionName
+}) {
   var _document, _document$startViewTr;
-  let {
-    changes,
-    viewTransitionName
-  } = _ref;
   const start = (_document = document) === null || _document === void 0 ? void 0 : (_document$startViewTr = _document.startViewTransition) === null || _document$startViewTr === void 0 ? void 0 : _document$startViewTr.bind(document);
   const prefersReducedMotion = isReducedMotion();
   const {
@@ -8483,11 +8426,10 @@ function useImageLightbox(props) {
         }
       });
     }
-    async function open(triggerElement) {
+    async function open(triggerElement, {
+      activeImageIndex
+    } = {}) {
       var _triggerImageRefs, _propsRef$current, _propsRef$current$ima;
-      let {
-        activeImageIndex
-      } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
       // If we find an image inside the trigger, animate it in transition with the opening image
       const triggerImage = ((_triggerImageRefs = triggerImageRefs[activeImageIndex]) === null || _triggerImageRefs === void 0 ? void 0 : _triggerImageRefs.current) || findImage(triggerElement);
 
@@ -10217,14 +10159,13 @@ const ProgressTrackerProvider = props => {
 };
 ProgressTrackerProvider.defaultProps = DEFAULT_PROPS$s;
 
-const useRovingTabIndex = _ref => {
-  let {
-    parentRef,
-    elementSelector,
-    keepTabIndex,
-    onElementFocus,
-    extraDependencies = []
-  } = _ref;
+const useRovingTabIndex = ({
+  parentRef,
+  elementSelector,
+  keepTabIndex,
+  onElementFocus,
+  extraDependencies = []
+}) => {
   useEffect(() => {
     const parent = parentRef === null || parentRef === void 0 ? void 0 : parentRef.current;
     if (!parent) {
@@ -11105,15 +11046,12 @@ const _excluded$q = ["linkAs", "href"];
 /**
  * Render <button> HTML component, fallbacks to `<a>` when a `href` is provided or a custom component with `linkAs`.
  */
-const renderButtonOrLink = function (props) {
+const renderButtonOrLink = (props, ...children) => {
   const {
       linkAs,
       href
     } = props,
     forwardedProps = _objectWithoutProperties(props, _excluded$q);
-  for (var _len = arguments.length, children = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-    children[_key - 1] = arguments[_key];
-  }
   if (linkAs || href) return renderLink(props, ...children);
   return /*#__PURE__*/React__default.createElement('button', _objectSpread2({
     type: 'button'
@@ -11468,10 +11406,7 @@ const DEFAULT_PROPS$h = {
  * @param precision Precision.
  * @return Value in range min - max
  */
-const computeValueFromPercent = function (percent, min, max) {
-  let precision = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
-  return Number((min + percent * (max - min)).toFixed(precision));
-};
+const computeValueFromPercent = (percent, min, max, precision = 0) => Number((min + percent * (max - min)).toFixed(precision));
 
 /**
  * Convert a value in range min - max to a percent value.
@@ -11599,8 +11534,7 @@ const Slider = forwardRef((props, ref) => {
    * Move to the next or previous value (i.e. + or - 10%) or next step
    * @param previous Should seek the previous value.
    */
-  const hopToValue = function () {
-    let previous = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  const hopToValue = (previous = false) => {
     const oldPercent = computePercentFromValue(value, min, max);
     let percent = clamp(oldPercent + (previous ? -0.1 : 0.1), 0, 1);
     if (steps) {
@@ -11753,18 +11687,17 @@ const DEFAULT_OPTIONS = {
   groupBy: 1,
   interval: AUTOPLAY_DEFAULT_INTERVAL
 };
-const useSlideshowControls = _ref => {
-  let {
-    activeIndex = DEFAULT_OPTIONS.activeIndex,
-    groupBy = DEFAULT_OPTIONS.groupBy,
-    interval = DEFAULT_OPTIONS.interval,
-    autoPlay,
-    defaultActiveIndex,
-    onChange,
-    itemsCount,
-    id,
-    slidesId
-  } = _ref;
+const useSlideshowControls = ({
+  activeIndex = DEFAULT_OPTIONS.activeIndex,
+  groupBy = DEFAULT_OPTIONS.groupBy,
+  interval = DEFAULT_OPTIONS.interval,
+  autoPlay,
+  defaultActiveIndex,
+  onChange,
+  itemsCount,
+  id,
+  slidesId
+}) => {
   const [currentIndex, setCurrentIndex] = useState(activeIndex);
   // Use state instead of a ref to make the slideshow controls update directly when the element is set.
   const [element, setElement] = useState(null);
@@ -11773,8 +11706,7 @@ const useSlideshowControls = _ref => {
   const slidesCount = Math.ceil(itemsCount / Math.min(groupBy, itemsCount));
 
   // Change current index to display next slide.
-  const goToNextSlide = useCallback(function () {
-    let loopback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+  const goToNextSlide = useCallback((loopback = true) => {
     setCurrentIndex(index => {
       if (loopback && index === slidesCount - 1) {
         // Loopback to the start.
@@ -11789,8 +11721,7 @@ const useSlideshowControls = _ref => {
   }, [slidesCount, setCurrentIndex]);
 
   // Change current index to display previous slide.
-  const goToPreviousSlide = useCallback(function () {
-    let loopback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+  const goToPreviousSlide = useCallback((loopback = true) => {
     setCurrentIndex(index => {
       if (loopback && index === 0) {
         // Loopback to the end.
@@ -11834,16 +11765,14 @@ const useSlideshowControls = _ref => {
   }, [slidesCount, setCurrentIndex]);
 
   // Handle click or keyboard event to go to next slide.
-  const onNextClick = useCallback(function () {
-    let loopback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+  const onNextClick = useCallback((loopback = true) => {
     stopAutoPlay();
     setIsForcePaused(true);
     goToNextSlide(loopback);
   }, [goToNextSlide]);
 
   // Handle click or keyboard event to go to previous slide.
-  const onPreviousClick = useCallback(function () {
-    let loopback = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+  const onPreviousClick = useCallback((loopback = true) => {
     stopAutoPlay();
     setIsForcePaused(true);
     goToPreviousSlide(loopback);
@@ -11910,12 +11839,11 @@ const useSlideshowControls = _ref => {
  * that any element within the given target will trigger the focus in and focus out events.
  * @param options - UseFocusWithinOptions
  */
-const useFocusWithin = _ref => {
-  let {
-    element,
-    onFocusIn,
-    onFocusOut
-  } = _ref;
+const useFocusWithin = ({
+  element,
+  onFocusIn,
+  onFocusOut
+}) => {
   useEffect(() => {
     if (element) {
       element.addEventListener('focusin', onFocusIn);
@@ -11941,11 +11869,10 @@ const BLOCKED_FOCUS_CLASSNAME = 'focus-blocked';
  * Manage how slides must behave when visible or not.
  * When not visible, they should be hidden from screen readers and not focusable.
  */
-const useSlideFocusManagement = _ref => {
-  let {
-    isSlideDisplayed,
-    slideRef
-  } = _ref;
+const useSlideFocusManagement = ({
+  isSlideDisplayed,
+  slideRef
+}) => {
   useEffect(() => {
     const element = slideRef === null || slideRef === void 0 ? void 0 : slideRef.current;
     if (!element) {
@@ -13558,13 +13485,12 @@ function useImageLoad(imageURL, imgRef) {
 }
 
 // Calculate shift to center the focus point in the container.
-function shiftPosition(_ref) {
-  let {
-    scale,
-    focusPoint,
-    imageSize,
-    containerSize
-  } = _ref;
+function shiftPosition({
+  scale,
+  focusPoint,
+  imageSize,
+  containerSize
+}) {
   const scaledSize = imageSize / scale;
   if (scaledSize === containerSize) return 0;
   const scaledFocusHeight = focusPoint * scaledSize;
@@ -13574,16 +13500,15 @@ function shiftPosition(_ref) {
 }
 
 // Compute CSS properties to apply the focus point.
-const useFocusPointStyle = (_ref2, element, isLoaded) => {
-  let {
-    image,
-    aspectRatio,
-    focusPoint,
-    imgProps: {
-      width,
-      height
-    } = {}
-  } = _ref2;
+const useFocusPointStyle = ({
+  image,
+  aspectRatio,
+  focusPoint,
+  imgProps: {
+    width,
+    height
+  } = {}
+}, element, isLoaded) => {
   // Get natural image size from imgProps or img element.
   const imageSize = useMemo(() => {
     // Focus point is not applicable => exit early
@@ -14018,8 +13943,7 @@ function useTooltipOpen(delay, anchorElement) {
     };
 
     // Close or cancel opening of tooltip
-    const getClose = function () {
-      let overrideDelay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : closeDelay;
+    const getClose = (overrideDelay = closeDelay) => {
       if (!shouldOpen && !timer) return;
       shouldOpen = false;
       deferUpdate(overrideDelay);