@autoguru/overdrive 4.3.4 → 4.4.0

package/dist/components/Modal/Modal.js

@@ -1,142 +1,86 @@
-"use strict";
-
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["onRequestClose", "isOpen"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 import { warning } from '@autoguru/utilities';
 import * as React from 'react';
 import { useEffect, useReducer } from 'react';
 import FocusLock from 'react-focus-lock';
-import { useEventCallback } from "../../utils/index.js";
-import { Box } from "../Box/index.js";
-import { Portal } from "../Portal/index.js";
-import * as styles from "./Modal.css.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-
+import { useEventCallback } from '../../utils';
+import { Box } from '../Box';
+import { Portal } from '../Portal';
+import * as styles from './Modal.css';
 const reducer = (prevState, action) => {
-  switch (action) {
-    case 'OPEN_MODAL':
-      {
-        switch (prevState) {
-          case 'INITIAL':
-          case 'CLOSING':
-          case 'CLOSED':
-            {
-              return 'OPENING';
+    switch (action) {
+        case 'OPEN_MODAL': {
+            switch (prevState) {
+                case 'INITIAL':
+                case 'CLOSING':
+                case 'CLOSED': {
+                    return 'OPENING';
+                }
+                default:
+                    return prevState;
             }
-
-          default:
-            return prevState;
         }
-      }
-
-    case 'CLOSE_MODAL':
-      {
-        switch (prevState) {
-          case 'OPEN':
-          case 'OPENING':
-            {
-              return 'CLOSING';
+        case 'CLOSE_MODAL': {
+            switch (prevState) {
+                case 'OPEN':
+                case 'OPENING': {
+                    return 'CLOSING';
+                }
+                default:
+                    return prevState;
             }
-
-          default:
-            return prevState;
         }
-      }
-
-    case 'ANIMATION_COMPLETE':
-      {
-        switch (prevState) {
-          case 'CLOSING':
-            {
-              return 'CLOSED';
+        case 'ANIMATION_COMPLETE': {
+            switch (prevState) {
+                case 'CLOSING': {
+                    return 'CLOSED';
+                }
+                case 'OPENING': {
+                    return 'OPEN';
+                }
+                default:
+                    return prevState;
             }
-
-          case 'OPENING':
-            {
-              return 'OPEN';
-            }
-
-          default:
+        }
+        default:
             return prevState;
+    }
+};
+export const Modal = ({ isOpen, hideBackdrop = false, onRequestClose, children, }) => {
+    const [state, dispatch] = useReducer(reducer, 'INITIAL');
+    const handleBackdropClick = useEventCallback((event) => {
+        if (event.target !== event.currentTarget)
+            return;
+        if (typeof onRequestClose === 'function')
+            onRequestClose('backdrop');
+    });
+    useEffect(() => {
+        dispatch(isOpen ? 'OPEN_MODAL' : 'CLOSE_MODAL');
+    }, [isOpen]);
+    useEffect(() => {
+        if (state === 'CLOSING') {
+            const timer = setTimeout(() => {
+                dispatch('ANIMATION_COMPLETE');
+            }, 300);
+            return () => clearTimeout(timer);
         }
-      }
-
-    default:
-      return prevState;
-  }
+        return undefined;
+    }, [state]);
+    return (React.createElement(Portal, null, state === 'OPENING' || state === 'OPEN' || state === 'CLOSING' ? (React.createElement(FocusLock, { returnFocus: true, autoFocus: false, onActivation: () => {
+            dispatch('ANIMATION_COMPLETE');
+        } },
+        React.createElement(Box, { "aria-hidden": "true", position: "fixed", pointerEvents: state === 'CLOSING' ? 'none' : undefined, opacity: state === 'OPEN' ? undefined : 0, className: [
+                styles.backdrop.root,
+                styles.transition,
+                hideBackdrop && styles.backdrop.invisible,
+            ], onClick: handleBackdropClick }),
+        React.createElement(Box, { role: "presentation", position: "fixed", overflow: "hidden", opacity: state === 'OPEN' ? undefined : 0, className: [
+                styles.root,
+                styles.transition,
+                state === 'OPENING' && styles.entry,
+            ] }, children))) : null));
 };
-
-export const Modal = _ref => {
-  let {
-    isOpen,
-    hideBackdrop = false,
-    onRequestClose,
-    children
-  } = _ref;
-  const [state, dispatch] = useReducer(reducer, 'INITIAL');
-  const handleBackdropClick = useEventCallback(event => {
-    if (event.target !== event.currentTarget) return;
-    if (typeof onRequestClose === 'function') onRequestClose('backdrop');
-  });
-  useEffect(() => {
-    dispatch(isOpen ? 'OPEN_MODAL' : 'CLOSE_MODAL');
-  }, [isOpen]);
-  useEffect(() => {
-    if (state === 'CLOSING') {
-      const timer = setTimeout(() => {
-        dispatch('ANIMATION_COMPLETE');
-      }, 300);
-      return () => clearTimeout(timer);
-    }
-
-    return undefined;
-  }, [state]);
-  return _jsx(Portal, {
-    children: state === 'OPENING' || state === 'OPEN' || state === 'CLOSING' ? _jsxs(FocusLock, {
-      returnFocus: true,
-      autoFocus: false,
-      onActivation: () => {
-        dispatch('ANIMATION_COMPLETE');
-      },
-      children: [_jsx(Box, {
-        "aria-hidden": "true",
-        position: "fixed",
-        pointerEvents: state === 'CLOSING' ? 'none' : undefined,
-        opacity: state === 'OPEN' ? undefined : 0,
-        className: [styles.backdrop.root, styles.transition, hideBackdrop && styles.backdrop.invisible],
-        onClick: handleBackdropClick
-      }), _jsx(Box, {
-        role: "presentation",
-        position: "fixed",
-        overflow: "hidden",
-        opacity: state === 'OPEN' ? undefined : 0,
-        className: [styles.root, styles.transition, state === 'OPENING' && styles.entry],
-        children: children
-      })]
-    }) : null
-  });
+export const withModal = (WrappedComponent) => ({ onRequestClose, isOpen, ...rest }) => {
+    warning(false, 'Using withModal is now an anti-pattern. Use <Modal /> instead');
+    return (React.createElement(Modal, { isOpen: isOpen, onRequestClose: onRequestClose },
+        React.createElement(WrappedComponent, { isOpen: isOpen, onRequestClose: onRequestClose, ...rest })));
 };
-export const withModal = WrappedComponent => _ref2 => {
-  let {
-    onRequestClose,
-    isOpen
-  } = _ref2,
-      rest = _objectWithoutProperties(_ref2, _excluded);
-
-  process.env.NODE_ENV !== "production" ? warning(false, 'Using withModal is now an anti-pattern. Use <Modal /> instead') : void 0;
-  return _jsx(Modal, {
-    isOpen: isOpen,
-    onRequestClose: onRequestClose,
-    children: _jsx(WrappedComponent, _objectSpread({
-      isOpen: isOpen,
-      onRequestClose: onRequestClose
-    }, rest))
-  });
-};

package/dist/components/Modal/index.d.ts

@@ -0,0 +1,2 @@
+export { withModal, Modal } from './Modal';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Modal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/Modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}

package/dist/components/Modal/index.js

@@ -1,3 +1 @@
-"use strict";
-
-export { withModal, Modal } from "./Modal.js";
+export { withModal, Modal } from './Modal';

package/dist/components/NumberBubble/NumberBubble.css.d.ts

@@ -0,0 +1,2 @@
+export declare const bubbleText: string;
+//# sourceMappingURL=NumberBubble.css.d.ts.map

package/dist/components/NumberBubble/NumberBubble.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberBubble.css.d.ts","sourceRoot":"","sources":["../../../lib/components/NumberBubble/NumberBubble.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,QAIrB,CAAC"}

package/dist/components/NumberBubble/NumberBubble.css.js

@@ -1,14 +1,6 @@
-"use strict";
-
-import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
-
-__vanilla_filescope__.setFileScope("lib/components/NumberBubble/NumberBubble.css.ts", "@autoguru/overdrive");
-
 import { style } from '@vanilla-extract/css';
 export const bubbleText = style({
-  top: '50%',
-  left: '50%',
-  transform: 'translate(-50%, -50%)'
-}, "bubbleText");
-
-__vanilla_filescope__.endFileScope();
+    top: '50%',
+    left: '50%',
+    transform: 'translate(-50%, -50%)',
+});

package/dist/components/NumberBubble/NumberBubble.d.ts

@@ -0,0 +1,10 @@
+import { ComponentProps, FunctionComponent } from 'react';
+import { Box } from '../Box';
+import { Text } from '../Text';
+export interface Props extends Omit<ComponentProps<typeof Box>, 'borderRadius' | 'position' | 'padding'> {
+    value: number;
+    rawNumbers?: boolean;
+    textColour?: ComponentProps<typeof Text>['colour'];
+}
+export declare const NumberBubble: FunctionComponent<Props>;
+//# sourceMappingURL=NumberBubble.d.ts.map

package/dist/components/NumberBubble/NumberBubble.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberBubble.d.ts","sourceRoot":"","sources":["../../../lib/components/NumberBubble/NumberBubble.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAW,MAAM,OAAO,CAAC;AAGnE,OAAO,EAAE,GAAG,EAAgB,MAAM,QAAQ,CAAC;AAC3C,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAI/B,MAAM,WAAW,KAChB,SAAQ,IAAI,CACX,cAAc,CAAC,OAAO,GAAG,CAAC,EAC1B,cAAc,GAAG,UAAU,GAAG,SAAS,CACvC;IACD,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC;CACnD;AAaD,eAAO,MAAM,YAAY,EAAE,iBAAiB,CAAC,KAAK,CAkCjD,CAAC"}

package/dist/components/NumberBubble/NumberBubble.js

@@ -1,56 +1,28 @@
-"use strict";
-
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["value", "textColour", "rawNumbers"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 import clsx from 'clsx';
 import * as React from 'react';
 import { useMemo } from 'react';
-import { toPrettyBigNumber } from "../../utils/number.js";
-import { Box, useBoxStyles } from "../Box/index.js";
-import { Text } from "../Text/index.js";
-import * as styles from "./NumberBubble.css.js";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { toPrettyBigNumber } from '../../utils/number';
+import { Box, useBoxStyles } from '../Box';
+import { Text } from '../Text';
+import * as styles from './NumberBubble.css';
 const valuePaddingMap = {
-  SMALL: '2',
-  MEDIUM: '3',
-  LARGE: '4',
-  X_LARGE: '5'
+    SMALL: '2',
+    MEDIUM: '3',
+    LARGE: '4',
+    X_LARGE: '5',
+};
+export const NumberBubble = ({ value, textColour = 'white', rawNumbers = false, ...boxProps }) => {
+    const size = useMemo(() => {
+        if (value > 9 && value < 100)
+            return 'MEDIUM';
+        if (value > 99 && value < 9999)
+            return 'LARGE';
+        if (value >= 9999)
+            return 'LARGE';
+        return 'SMALL';
+    }, [value]);
+    return (React.createElement(Box, { borderRadius: "full", backgroundColour: "gray900", display: "inlineBlock", position: "relative", padding: valuePaddingMap[size], ...boxProps },
+        React.createElement(Text, { size: "2", strong: true, className: clsx(styles.bubbleText, useBoxStyles({
+                position: 'absolute',
+            })), colour: textColour }, rawNumbers ? value : toPrettyBigNumber(value))));
 };
-export const NumberBubble = _ref => {
-  let {
-    value,
-    textColour = 'white',
-    rawNumbers = false
-  } = _ref,
-      boxProps = _objectWithoutProperties(_ref, _excluded);
-
-  const size = useMemo(() => {
-    if (value > 9 && value < 100) return 'MEDIUM';
-    if (value > 99 && value < 9999) return 'LARGE';
-    if (value >= 9999) return 'LARGE';
-    return 'SMALL';
-  }, [value]);
-  return _jsx(Box, _objectSpread(_objectSpread({
-    borderRadius: "full",
-    backgroundColour: "gray900",
-    display: "inlineBlock",
-    position: "relative",
-    padding: valuePaddingMap[size]
-  }, boxProps), {}, {
-    children: _jsx(Text, {
-      size: "2",
-      strong: true,
-      className: clsx(styles.bubbleText, useBoxStyles({
-        position: 'absolute'
-      })),
-      colour: textColour,
-      children: rawNumbers ? value : toPrettyBigNumber(value)
-    })
-  }));
-};

package/dist/components/NumberBubble/index.d.ts

@@ -0,0 +1,2 @@
+export { NumberBubble } from './NumberBubble';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/NumberBubble/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/NumberBubble/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/NumberBubble/index.js

@@ -1,3 +1 @@
-"use strict";
-
-export { NumberBubble } from "./NumberBubble.js";
+export { NumberBubble } from './NumberBubble';

package/dist/components/NumberInput/NumberInput.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+interface Props extends Partial<Pick<HTMLInputElement, 'min' | 'max' | 'step'>> {
+    preventMouseWheel?: boolean;
+}
+export declare const NumberInput: React.ForwardRefExoticComponent<Props & import("../private/InputBase/withEnhancedInput").EnhanceInputPrimitiveProps & import("../private/InputBase/withEnhancedInput").EventHandlers<HTMLInputElement> & import("../private/InputBase/withEnhancedInput").ValidationProps & React.RefAttributes<HTMLInputElement>>;
+export {};
+//# sourceMappingURL=NumberInput.d.ts.map

package/dist/components/NumberInput/NumberInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../lib/components/NumberInput/NumberInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,UAAU,KACT,SAAQ,OAAO,CAAC,IAAI,CAAC,gBAAgB,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,CAAC,CAAC;IAC/D,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,eAAO,MAAM,WAAW,oTA8EvB,CAAC"}

package/dist/components/NumberInput/NumberInput.js

@@ -1,71 +1,34 @@
-"use strict";
-
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["ref"],
-      _excluded2 = ["field", "eventHandlers", "validation", "isLoading", "suffixed", "prefixed", "preventMouseWheel"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 import * as React from 'react';
 import { useCallback, useEffect, useRef } from 'react';
-import { Box } from "../Box/index.js";
-import { withEnhancedInput } from "../private/InputBase/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { Box } from '../Box';
+import { withEnhancedInput } from '../private/InputBase';
 const isEdge = typeof navigator !== 'undefined' && /edge/i.test(navigator.userAgent);
 const type = isEdge ? 'text' : 'number';
-export const NumberInput = withEnhancedInput(_ref => {
-  let {
-    field: {
-      ref
-    },
-    eventHandlers,
-    validation,
-    isLoading,
-    suffixed,
-    prefixed,
-    preventMouseWheel = false
-  } = _ref,
-      incomingFieldProps = _objectWithoutProperties(_ref.field, _excluded),
-      rest = _objectWithoutProperties(_ref, _excluded2);
-
-  const inputRef = useRef(ref === null || ref === void 0 ? void 0 : ref.current);
-  const preventWheel = useCallback(e => {
-    e.preventDefault();
-    e.stopPropagation();
-  }, []);
-  useEffect(() => {
-    let mouseWheelListener;
-    let onWheelListener;
-    let wheelListener;
-
-    if (preventMouseWheel && inputRef !== null && inputRef !== void 0 && inputRef.current) {
-      mouseWheelListener = inputRef.current.addEventListener('mousewheel', preventWheel, {
-        passive: false
-      });
-      onWheelListener = inputRef.current.addEventListener('onwheel', preventWheel, {
-        passive: false
-      });
-      wheelListener = inputRef.current.addEventListener('wheel', preventWheel, {
-        passive: false
-      });
-    }
-
-    return () => {
-      if (mouseWheelListener) inputRef.current.removeEventListener('mousewheel', mouseWheelListener);
-      if (onWheelListener) inputRef.current.removeEventListener('onwheel', onWheelListener);
-      if (wheelListener) inputRef.current.removeEventListener('wheel', wheelListener);
-    };
-  }, [preventMouseWheel, inputRef.current]);
-  return _jsx(Box, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
-    is: "input",
-    ref: inputRef
-  }, eventHandlers), incomingFieldProps), rest), {}, {
-    autoComplete: "off",
-    type: type
-  }));
+export const NumberInput = withEnhancedInput(({ field: { ref, ...incomingFieldProps }, eventHandlers, validation, isLoading, suffixed, prefixed, preventMouseWheel = false, size, ...rest }) => {
+    const inputRef = useRef(ref?.current);
+    const preventWheel = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+    }, []);
+    useEffect(() => {
+        let mouseWheelListener;
+        let onWheelListener;
+        let wheelListener;
+        if (preventMouseWheel && inputRef?.current) {
+            mouseWheelListener = inputRef.current.addEventListener('mousewheel', preventWheel, { passive: false });
+            onWheelListener = inputRef.current.addEventListener('onwheel', preventWheel, { passive: false });
+            wheelListener = inputRef.current.addEventListener('wheel', preventWheel, { passive: false });
+        }
+        return () => {
+            if (mouseWheelListener)
+                inputRef.current.removeEventListener('mousewheel', mouseWheelListener);
+            if (onWheelListener)
+                inputRef.current.removeEventListener('onwheel', onWheelListener);
+            if (wheelListener)
+                inputRef.current.removeEventListener('wheel', wheelListener);
+        };
+    }, [preventMouseWheel, inputRef.current]);
+    return (React.createElement(Box, { is: "input", ref: inputRef, ...eventHandlers, ...incomingFieldProps, ...rest, autoComplete: "off", type: type }));
 }, {
-  primitiveType: type
-});
+    primitiveType: type,
+});

package/dist/components/NumberInput/index.d.ts

@@ -0,0 +1,2 @@
+export { NumberInput } from './NumberInput';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/NumberInput/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/NumberInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/NumberInput/index.js

@@ -1,3 +1 @@
-"use strict";
-
-export { NumberInput } from "./NumberInput.js";
+export { NumberInput } from './NumberInput';

package/dist/components/NumberInput/stories.js

@@ -6,7 +6,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import { AccountEditIcon, AlertCircleIcon, CalendarIcon, CarMultipleIcon, CheckIcon, CurrencyUsdIcon, PlusIcon, StarIcon } from '@autoguru/icons';
+import { AccountEditIcon, AlertCircleIcon, CalendarIcon, CarIcon, CarMultipleIcon, CheckIcon, CurrencyUsdIcon, PlusIcon, StarIcon } from '@autoguru/icons';
 import { action } from '@storybook/addon-actions';
 import isChromatic from 'chromatic/isChromatic';
 import * as React from 'react';
@@ -167,4 +167,38 @@ invalid.args = invalidProps;
 invalid.argTypes = argTypes;
 export const loading = Template.bind(loadingProps);
 loading.args = loadingProps;
-loading.argTypes = argTypes;
+loading.argTypes = argTypes;
+
+const smallProps = _objectSpread(_objectSpread({}, standardProps), {}, {
+  size: 'small'
+});
+
+export const small = Template.bind(smallProps);
+small.args = smallProps;
+small.argTypes = argTypes;
+
+const withValueSmallProps = _objectSpread(_objectSpread({}, withAValueProps), {}, {
+  size: 'small'
+});
+
+export const withValueSmall = Template.bind(withValueSmallProps);
+withValueSmall.args = withValueSmallProps;
+withValueSmall.argTypes = argTypes;
+
+const withIconSmallProps = _objectSpread(_objectSpread({}, withAValueProps), {}, {
+  prefixIcon: CarIcon,
+  size: 'small'
+});
+
+export const withIconSmall = Template.bind(withIconSmallProps);
+withIconSmall.args = withIconSmallProps;
+withIconSmall.argTypes = argTypes;
+
+const loadingSmallProps = _objectSpread(_objectSpread({}, withAValueProps), {}, {
+  isLoading: true,
+  size: 'small'
+});
+
+export const loadingSmall = Template.bind(loadingSmallProps);
+loadingSmall.args = loadingSmallProps;
+loadingSmall.argTypes = argTypes;

package/dist/components/OrderedList/OrderedList.css.d.ts

@@ -0,0 +1,2 @@
+export declare const root: Record<"default" | "firstOccurrence", string>;
+//# sourceMappingURL=OrderedList.css.d.ts.map

package/dist/components/OrderedList/OrderedList.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedList.css.d.ts","sourceRoot":"","sources":["../../../lib/components/OrderedList/OrderedList.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,+CAOf,CAAC"}

package/dist/components/OrderedList/OrderedList.css.js

@@ -1,18 +1,10 @@
-"use strict";
-
-import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
-
-__vanilla_filescope__.setFileScope("lib/components/OrderedList/OrderedList.css.ts", "@autoguru/overdrive");
-
 import { styleVariants } from '@vanilla-extract/css';
-import { vars } from "../../themes/base/vars.css.js";
+import { vars } from '../../themes/base/vars.css';
 export const root = styleVariants({
-  default: {
-    listStyle: 'outside lower-roman'
-  },
-  firstOccurrence: {
-    paddingLeft: "calc(".concat(vars.space['6'], " * 2)")
-  }
-}, "root");
-
-__vanilla_filescope__.endFileScope();
+    default: {
+        listStyle: 'outside lower-roman',
+    },
+    firstOccurrence: {
+        paddingLeft: `calc(${vars.space['6']} * 2)`,
+    },
+});

package/dist/components/OrderedList/OrderedList.d.ts

@@ -0,0 +1,16 @@
+import { FunctionComponent, OlHTMLAttributes, ReactNode } from 'react';
+declare type ListStyleType = 'decimal' | 'lower-roman' | 'lower-alpha' | 'upper-alpha';
+export interface Props extends Pick<OlHTMLAttributes<HTMLOListElement>, 'start'> {
+    type?: ListStyleType;
+    className?: string;
+    children?: ReactNode;
+}
+export interface ItemProps {
+    className?: string;
+    children?: ReactNode;
+}
+export declare const OrderedList: FunctionComponent<Props> & {
+    Item: FunctionComponent<ItemProps>;
+};
+export {};
+//# sourceMappingURL=OrderedList.d.ts.map

package/dist/components/OrderedList/OrderedList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderedList.d.ts","sourceRoot":"","sources":["../../../lib/components/OrderedList/OrderedList.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEN,iBAAiB,EACjB,gBAAgB,EAChB,SAAS,EAET,MAAM,OAAO,CAAC;AAQf,aAAK,aAAa,GAAG,SAAS,GAAG,aAAa,GAAG,aAAa,GAAG,aAAa,CAAC;AAU/E,MAAM,WAAW,KAChB,SAAQ,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IACzD,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,SAAS;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAID,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,KAAK,CAAC,GAAG;IACpD,IAAI,EAAE,iBAAiB,CAAC,SAAS,CAAC,CAAC;CA6BnC,CAAC"}