@autoguru/overdrive 4.44.4-next.0 → 4.44.4

package/dist/components/OptionList/OptionListItem.js

@@ -62,11 +62,10 @@ OptionListItem.displayName = 'OptionList.Item';
 /**
  * Helper component part to display a checkbox button label with a second column justified to the end
  */
-export const ItemSplitLabel = _ref => {
-  let {
-    children,
-    content
-  } = _ref;
+export const ItemSplitLabel = ({
+  children,
+  content
+}) => {
   if (!children && !content) return null;
   return /*#__PURE__*/_jsx("div", {
     className: sprinkles({

package/dist/components/OrderedList/OrderedList.js

@@ -9,13 +9,12 @@ import * as styles from "./OrderedList.css.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const cycles = ['decimal', 'lower-roman', 'lower-alpha', 'upper-alpha', 'lower-roman'];
 const OrderedListContext = /*#__PURE__*/createContext(-1);
-export const OrderedList = _ref => {
-  let {
-    children,
-    className,
-    type = null,
-    start
-  } = _ref;
+export const OrderedList = ({
+  children,
+  className,
+  type = null,
+  start
+}) => {
   const cycle = useContext(OrderedListContext);
   let myCycle;
   if (cycle + 1 > cycles.length) {
@@ -46,15 +45,12 @@ export const OrderedList = _ref => {
     })
   });
 };
-const Item = _ref2 => {
-  let {
-    className,
-    children
-  } = _ref2;
-  return /*#__PURE__*/_jsx(Box, {
-    as: "li",
-    className: className,
-    children: children
-  });
-};
+const Item = ({
+  className,
+  children
+}) => /*#__PURE__*/_jsx(Box, {
+  as: "li",
+  className: className,
+  children: children
+});
 OrderedList.Item = Item;

package/dist/components/OutsideClick/OutsideClick.js

@@ -28,11 +28,10 @@ const bindEvent = (node, event, callback) => {
     node.removeEventListener(event, callback);
   };
 };
-export const OutsideClick = _ref => {
-  let {
-    children,
-    onOutsideClick = noop
-  } = _ref;
+export const OutsideClick = ({
+  children,
+  onOutsideClick = noop
+}) => {
   const child = Children.only(children);
   const rootClickRef = useRef(null);
   const hasRef = Object.prototype.hasOwnProperty.call(child.props, 'ref');

package/dist/components/OverdriveProvider/FallbackProvider.js

@@ -7,10 +7,9 @@ import React from 'react';
  * @deprecated `<OverdriveProvider>` includes the theme context and theme overrides
  */
 import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-export const FallbackProvider = _ref => {
-  let {
-    children
-  } = _ref;
+export const FallbackProvider = ({
+  children
+}) => {
   process.env.NODE_ENV !== "production" ? warning(false, 'This application is using a provider which is now deprecated. The theme context and overrides are available from <OverdriveProvider>') : void 0;
   return /*#__PURE__*/_jsx(_Fragment, {
     children: children

package/dist/components/OverdriveProvider/OverdriveProvider.js

@@ -27,15 +27,14 @@ export const useRuntimeTokens = () => {
 const isSafeElement = element => {
   return element instanceof HTMLElement && !element.hasAttribute('onclick') && !element.hasAttribute('onerror');
 };
-export const Provider = _ref => {
-  let {
-    breakpoints,
-    children,
-    colorOverrides,
-    noBodyLevelTheming = false,
-    portalMountPoint,
-    theme = baseTheme
-  } = _ref;
+export const Provider = ({
+  breakpoints,
+  children,
+  colorOverrides,
+  noBodyLevelTheming = false,
+  portalMountPoint,
+  theme = baseTheme
+}) => {
   const runtimeTokens = useMemo(() => makeRuntimeTokens(breakpoints), [breakpoints]);
   const styles = useColorOverrides(colorOverrides, String(theme.vars.mode));
   const themeValues = useMemo(() => ({

package/dist/components/Pagination/Bubble.js

@@ -6,15 +6,14 @@ import { textStyles } from "../../styles/typography.js";
 import { Box } from "../Box/index.js";
 import * as styles from "./Pagination.css.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-export const Bubble = _ref => {
-  let {
-    className = '',
-    selected = false,
-    gap = false,
-    children,
-    disabled,
-    onClick
-  } = _ref;
+export const Bubble = ({
+  className = '',
+  selected = false,
+  gap = false,
+  children,
+  disabled,
+  onClick
+}) => {
   let backgroundColour = 'transparent';
   if (selected) backgroundColour = 'green900';else if (disabled) backgroundColour = 'gray200';
   return /*#__PURE__*/_jsx(Box, {

package/dist/components/Pagination/Pagination.js

@@ -12,69 +12,62 @@ import { Inline } from "../Inline/Inline.js";
 import { Bubble } from "./Bubble.js";
 import * as styles from "./Pagination.css.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const NavButton = _ref => {
-  let {
-    icon,
-    disabled,
-    label = '',
-    onClick = noop
-  } = _ref;
-  return /*#__PURE__*/_jsx(Box, {
-    as: "button",
-    "aria-disabled": disabled,
-    "aria-label": label,
-    display: "flex",
-    overflow: "hidden",
-    alignItems: "center",
-    flexDirection: "row",
-    justifyContent: "center",
-    textAlign: "center",
-    borderRadius: "pill",
-    padding: "2",
-    userSelect: "none",
-    pointerEvents: disabled ? 'none' : void 0,
-    className: clsx(textStyles({
-      colour: 'light'
-    }), {
-      [styles.disabled]: disabled
-    }),
-    onClick: onClick,
-    children: /*#__PURE__*/_jsx(Icon, {
-      size: "medium",
-      icon: icon
-    })
-  });
-};
-const Loading = _ref2 => {
-  let {
-    placeholderBubblesNum = 3
-  } = _ref2;
-  return /*#__PURE__*/_jsxs(Inline, {
-    as: "span",
-    space: "3",
-    children: [/*#__PURE__*/_jsx(NavButton, {
-      disabled: true,
-      icon: ChevronLeftIcon
-    }), Array.from({
-      length: placeholderBubblesNum
-    }).fill('').map((_, index) => /*#__PURE__*/_jsx(Bubble, {
-      disabled: true,
-      className: styles.disabled
-    }, index)), /*#__PURE__*/_jsx(NavButton, {
-      disabled: true,
-      icon: ChevronRightIcon
-    })]
-  });
-};
-export const Pagination = _ref3 => {
-  let {
-    total,
-    pageSize,
-    activePage,
-    numPagesDisplayed = 5,
-    loading = false,
-    onChange = noop
-  } = _ref3;
+const NavButton = ({
+  icon,
+  disabled,
+  label = '',
+  onClick = noop
+}) => /*#__PURE__*/_jsx(Box, {
+  as: "button",
+  "aria-disabled": disabled,
+  "aria-label": label,
+  display: "flex",
+  overflow: "hidden",
+  alignItems: "center",
+  flexDirection: "row",
+  justifyContent: "center",
+  textAlign: "center",
+  borderRadius: "pill",
+  padding: "2",
+  userSelect: "none",
+  pointerEvents: disabled ? 'none' : void 0,
+  className: clsx(textStyles({
+    colour: 'light'
+  }), {
+    [styles.disabled]: disabled
+  }),
+  onClick: onClick,
+  children: /*#__PURE__*/_jsx(Icon, {
+    size: "medium",
+    icon: icon
+  })
+});
+const Loading = ({
+  placeholderBubblesNum = 3
+}) => /*#__PURE__*/_jsxs(Inline, {
+  as: "span",
+  space: "3",
+  children: [/*#__PURE__*/_jsx(NavButton, {
+    disabled: true,
+    icon: ChevronLeftIcon
+  }), Array.from({
+    length: placeholderBubblesNum
+  }).fill('').map((_, index) => /*#__PURE__*/_jsx(Bubble, {
+    disabled: true,
+    className: styles.disabled
+  }, index)), /*#__PURE__*/_jsx(NavButton, {
+    disabled: true,
+    icon: ChevronRightIcon
+  })]
+});
+export const Pagination = ({
+  total,
+  pageSize,
+  activePage,
+  numPagesDisplayed = 5,
+  loading = false,
+  onChange = noop
+}) => {
   const numPages = useMemo(() => calcPagesNum(total, pageSize), [total, pageSize]);
   const handleClick = useCallback(num => () => {
     onChange({

package/dist/components/Portal/Portal.js

@@ -5,12 +5,11 @@ import { createPortal } from 'react-dom';
 import { isBrowser, isHtmlElement, setRef } from "../../utils/index.js";
 import { useTheme } from "../OverdriveProvider/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-function Portal(_ref, ref) {
-  let {
-    children,
-    container,
-    noThemedWrapper
-  } = _ref;
+function Portal({
+  children,
+  container,
+  noThemedWrapper
+}, ref) {
   const {
     themeClass,
     portalMountPoint

package/dist/components/ProgressBar/ProgressBar.js

@@ -13,23 +13,20 @@ const backgroundColorMap = {
   yellow: 'yellow600',
   neutral: 'gray500'
 };
-export const ProgressBar = _ref => {
-  let {
-    value = 0,
-    colour = 'green'
-  } = _ref;
-  return /*#__PURE__*/_jsx(Box, {
-    className: styles.container,
+export const ProgressBar = ({
+  value = 0,
+  colour = 'green'
+}) => /*#__PURE__*/_jsx(Box, {
+  className: styles.container,
+  borderRadius: "1",
+  backgroundColour: "gray100",
+  odComponent: "progress-bar",
+  children: /*#__PURE__*/_jsx(Box, {
     borderRadius: "1",
-    backgroundColour: "gray100",
-    odComponent: "progress-bar",
-    children: /*#__PURE__*/_jsx(Box, {
-      borderRadius: "1",
-      backgroundColour: backgroundColorMap[colour],
-      className: [styles.bar, styles.container],
-      style: {
-        width: `${clamp(value, 0, 1) * 100}%`
-      }
-    })
-  });
-};
+    backgroundColour: backgroundColorMap[colour],
+    className: [styles.bar, styles.container],
+    style: {
+      width: `${clamp(value, 0, 1) * 100}%`
+    }
+  })
+});

package/dist/components/ProgressBarGroup/ProgressBarGroup.js

@@ -7,14 +7,13 @@ import { ProgressBar } from "../ProgressBar/ProgressBar.js";
 import { Text } from "../Text/Text.js";
 import * as styles from "./ProgressBarGroup.css.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const ProgressBarGroup = _ref => {
-  let {
-    prefixLabels,
-    suffixLabels,
-    values,
-    count = values.reduce((result, item) => result + item, 0),
-    colour
-  } = _ref;
+export const ProgressBarGroup = ({
+  prefixLabels,
+  suffixLabels,
+  values,
+  count = values.reduce((result, item) => result + item, 0),
+  colour
+}) => {
   const hasPrefixLabels = Array.isArray(prefixLabels);
   const hasSuffixLabels = Array.isArray(suffixLabels);
   return /*#__PURE__*/_jsx(Box, {

package/dist/components/ProgressSpinner/ProgressSpinner.js

@@ -6,30 +6,27 @@ import { elementStyles } from "../../styles/index.js";
 import { Box } from "../Box/Box.js";
 import * as styles from "./ProgressSpinner.css.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-export const ProgressSpinner = _ref => {
-  let {
-    className = '',
-    colour = 'primary',
-    size = 'medium'
-  } = _ref;
-  return /*#__PURE__*/_jsx(Box, {
-    className: [styles.size[size].circular, styles.colours[colour], className],
-    odComponent: "progress-spinner",
-    children: /*#__PURE__*/_jsx("svg", {
-      className: clsx(elementStyles({
-        as: 'svg',
-        display: 'block',
-        overflow: 'hidden'
-      }), styles.circular),
-      viewBox: "25 25 50 50",
-      children: /*#__PURE__*/_jsx("circle", {
-        className: clsx(styles.path, styles.size[size].path),
-        cx: "50",
-        cy: "50",
-        r: "20",
-        fill: "none",
-        strokeMiterlimit: "10"
-      })
+export const ProgressSpinner = ({
+  className = '',
+  colour = 'primary',
+  size = 'medium'
+}) => /*#__PURE__*/_jsx(Box, {
+  className: [styles.size[size].circular, styles.colours[colour], className],
+  odComponent: "progress-spinner",
+  children: /*#__PURE__*/_jsx("svg", {
+    className: clsx(elementStyles({
+      as: 'svg',
+      display: 'block',
+      overflow: 'hidden'
+    }), styles.circular),
+    viewBox: "25 25 50 50",
+    children: /*#__PURE__*/_jsx("circle", {
+      className: clsx(styles.path, styles.size[size].path),
+      cx: "50",
+      cy: "50",
+      r: "20",
+      fill: "none",
+      strokeMiterlimit: "10"
     })
-  });
-};
+  })
+});

package/dist/components/Radio/Radio.js

@@ -9,13 +9,12 @@ import { checkableIndicator } from "../private/CheckableBase/CheckableBase.css.j
 import * as styles from "./Radio.css.js";
 import { useRadioContext } from "./RadioGroup.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const Radio = /*#__PURE__*/forwardRef((_ref, ref) => {
-  let {
-    value,
-    className = '',
-    children,
-    disabled = false
-  } = _ref;
+export const Radio = /*#__PURE__*/forwardRef(({
+  value,
+  className = '',
+  children,
+  disabled = false
+}, ref) => {
   const radioContext = useRadioContext();
   const isChecked = value === radioContext.value;
   const handleClick = () => {

package/dist/components/Radio/RadioGroup.js

@@ -5,14 +5,13 @@ import { Box } from "../Box/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export const RadioContext = /*#__PURE__*/createContext(null);
 export const useRadioContext = () => useContext(RadioContext);
-export const RadioGroup = /*#__PURE__*/forwardRef((_ref, ref) => {
-  let {
-    name,
-    value,
-    className = '',
-    onChange,
-    children
-  } = _ref;
+export const RadioGroup = /*#__PURE__*/forwardRef(({
+  name,
+  value,
+  className = '',
+  onChange,
+  children
+}, ref) => {
   const contextValue = useMemo(() => ({
     value,
     inputName: name,

package/dist/components/Section/Section.js

@@ -4,18 +4,15 @@ import React from 'react';
 import { Box } from "../Box/Box.js";
 import * as styles from "./Section.css.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-export const Section = _ref => {
-  let {
-    children,
-    width = 'medium',
-    paddingX,
-    ref
-  } = _ref;
-  return /*#__PURE__*/_jsx(Box, {
-    ref: ref,
-    className: [styles.root, styles.width[width]],
-    width: "full",
-    paddingX: paddingX,
-    children: children
-  });
-};
+export const Section = ({
+  children,
+  width = 'medium',
+  paddingX,
+  ref
+}) => /*#__PURE__*/_jsx(Box, {
+  ref: ref,
+  className: [styles.root, styles.width[width]],
+  width: "full",
+  paddingX: paddingX,
+  children: children
+});

package/dist/components/SimplePagination/SimplePagination.js

@@ -12,12 +12,11 @@ export let EChangeDirection = /*#__PURE__*/function (EChangeDirection) {
   EChangeDirection["Next"] = "next";
   return EChangeDirection;
 }({});
-export const SimplePagination = _ref => {
-  let {
-    hasNext = false,
-    hasPrevious = false,
-    onChange = noop
-  } = _ref;
+export const SimplePagination = ({
+  hasNext = false,
+  hasPrevious = false,
+  onChange = noop
+}) => {
   const handleClick = direction => () => {
     onChange(direction);
   };

package/dist/components/SliderProgress/ProgressStep.js

@@ -6,16 +6,15 @@ import { useAnimationEvents } from "../../hooks/useAnimationEvents/index.js";
 import { Box } from "../Box/index.js";
 import * as styles from "./ProgressStep.css.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const ProgressStep = /*#__PURE__*/memo(_ref => {
-  let {
-    className = '',
-    paused,
-    isActive,
-    hasPassed,
-    duration,
-    backgroundColour = 'white',
-    onFinished
-  } = _ref;
+export const ProgressStep = /*#__PURE__*/memo(({
+  className = '',
+  paused,
+  isActive,
+  hasPassed,
+  duration,
+  backgroundColour = 'white',
+  onFinished
+}) => {
   const {
     elementRef
   } = useAnimationEvents({

package/dist/components/SliderProgress/SliderProgress.js

@@ -6,32 +6,29 @@ import { memo } from 'react';
 import { ProgressStep } from "./ProgressStep.js";
 import * as styles from "./SliderProgress.css.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-export const SliderProgress = /*#__PURE__*/memo(_ref => {
-  let {
-    className = '',
-    paused,
-    totalCount,
-    activeIndex,
-    duration,
-    backgroundColour,
-    onRequestNext
-  } = _ref;
-  return /*#__PURE__*/_jsx("div", {
-    className: clsx(className, styles.root),
-    style: {
-      gridTemplateColumns: `repeat(${totalCount}, 1fr)`
-    },
-    children: Array.from({
-      length: totalCount
-    }).fill('').map((_, index) => /*#__PURE__*/_jsx(ProgressStep, {
-      className: styles.step,
-      paused: paused,
-      duration: duration,
-      backgroundColour: backgroundColour,
-      hasPassed: index < activeIndex,
-      isActive: index === activeIndex,
-      onFinished: onRequestNext
-    }, index))
-  });
-});
+export const SliderProgress = /*#__PURE__*/memo(({
+  className = '',
+  paused,
+  totalCount,
+  activeIndex,
+  duration,
+  backgroundColour,
+  onRequestNext
+}) => /*#__PURE__*/_jsx("div", {
+  className: clsx(className, styles.root),
+  style: {
+    gridTemplateColumns: `repeat(${totalCount}, 1fr)`
+  },
+  children: Array.from({
+    length: totalCount
+  }).fill('').map((_, index) => /*#__PURE__*/_jsx(ProgressStep, {
+    className: styles.step,
+    paused: paused,
+    duration: duration,
+    backgroundColour: backgroundColour,
+    hasPassed: index < activeIndex,
+    isActive: index === activeIndex,
+    onFinished: onRequestNext
+  }, index))
+}));
 SliderProgress.displayName = 'SliderProgress';

package/dist/components/Stack/Stack.js

@@ -37,16 +37,15 @@ const Divider = () => /*#__PURE__*/_jsx("hr", {
  *   <Card>Card 2</Card>
  * </Stack>
  */
-export const Stack = _ref => {
-  let {
-    alignItems,
-    as = 'div',
-    className,
-    children,
-    dividers = false,
-    space = '2',
-    width
-  } = _ref;
+export const Stack = ({
+  alignItems,
+  as = 'div',
+  className,
+  children,
+  dividers = false,
+  space = '2',
+  width
+}) => {
   const items = useMemo(() => flattenChildren(children), [children]);
   if (items.length === 0) {
     return null;

package/dist/components/StandardModal/StandardModal.js

@@ -21,18 +21,17 @@ export let ESize = /*#__PURE__*/function (ESize) {
   ESize["Standard"] = "standard"; // 800px wide
   return ESize;
 }({});
-export const StandardModal = _ref => {
-  let {
-    isOpen,
-    size = 'standard',
-    className = '',
-    title,
-    container,
-    noThemedWrapper,
-    ref,
-    onRequestClose,
-    children
-  } = _ref;
+export const StandardModal = ({
+  isOpen,
+  size = 'standard',
+  className = '',
+  title,
+  container,
+  noThemedWrapper,
+  ref,
+  onRequestClose,
+  children
+}) => {
   const titleId = useId();
   const locked = useRef(true);
   const closeButtonHandler = useEventCallback(() => {