@autoguru/overdrive 4.3.4 → 4.4.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"LinearProgressIndicator.d.ts","sourceRoot":"","sources":["../../../lib/components/LinearProgressIndicator/LinearProgressIndicator.tsx"],"names":[],"mappings":"AACA,OAAO,EAAQ,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAMnD,MAAM,WAAW,KAAK;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,uBAAuB,EAAE,oBAAoB,CAAC,KAAK,CA0B/D,CAAC"}

package/dist/components/LinearProgressIndicator/LinearProgressIndicator.js

@@ -1,33 +1,9 @@
-"use strict";
-
 import * as React from 'react';
 import { memo } from 'react';
-import { Box } from "../Box/index.js";
-import * as styles from "./LinearProgressIndicator.css.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export const LinearProgressIndicator = memo(_ref => {
-  let {
-    className = ''
-  } = _ref;
-  return _jsx(Box, {
-    position: "relative",
-    overflow: "hidden",
-    width: "full",
-    backgroundColour: "gray200",
-    className: [styles.root, className],
-    children: _jsx(Box, {
-      position: "absolute",
-      width: "full",
-      height: "full",
-      className: styles.linearProgressBar,
-      children: _jsx(Box, {
-        is: "span",
-        backgroundColour: "green300",
-        position: "absolute",
-        width: "full",
-        height: "full",
-        className: styles.linearProgressBarInner
-      })
-    })
-  });
-});
+import { Box } from '../Box';
+import * as styles from './LinearProgressIndicator.css';
+export const LinearProgressIndicator = memo(({ className = '' }) => {
+    return (React.createElement(Box, { position: "relative", overflow: "hidden", width: "full", backgroundColour: "gray200", className: [styles.root, className] },
+        React.createElement(Box, { position: "absolute", width: "full", height: "full", className: styles.linearProgressBar },
+            React.createElement(Box, { is: "span", backgroundColour: "green300", position: "absolute", width: "full", height: "full", className: styles.linearProgressBarInner }))));
+});

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

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

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

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

package/dist/components/LinearProgressIndicator/index.js

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

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

@@ -0,0 +1,3 @@
+export declare const root: string;
+export declare const blinking: string;
+//# sourceMappingURL=LoadingBox.css.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingBox.css.d.ts","sourceRoot":"","sources":["../../../lib/components/LoadingBox/LoadingBox.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,QAEf,CAAC;AAgBH,eAAO,MAAM,QAAQ,QAKnB,CAAC"}

package/dist/components/LoadingBox/LoadingBox.css.js

@@ -1,30 +1,22 @@
-"use strict";
-
-import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
-
-__vanilla_filescope__.setFileScope("lib/components/LoadingBox/LoadingBox.css.ts", "@autoguru/overdrive");
-
 import { keyframes, style } from '@vanilla-extract/css';
-import { vars } from "../../themes/base/vars.css.js";
+import { vars } from '../../themes/base/vars.css';
 export const root = style({
-  minHeight: vars.typography.size['3'].fontSize
-}, "root");
+    minHeight: vars.typography.size['3'].fontSize,
+});
 const blinker = keyframes({
-  '0%': {
-    opacity: 0.4
-  },
-  '50%': {
-    opacity: 1
-  },
-  '100%': {
-    opacity: 0.4
-  }
-}, "blinker");
+    '0%': {
+        opacity: 0.4,
+    },
+    '50%': {
+        opacity: 1,
+    },
+    '100%': {
+        opacity: 0.4,
+    },
+});
 export const blinking = style({
-  animationDuration: '1.5s',
-  animationTimingFunction: vars.animation.easing.standard,
-  animationIterationCount: 'infinite',
-  animationName: blinker
-}, "blinking");
-
-__vanilla_filescope__.endFileScope();
+    animationDuration: '1.5s',
+    animationTimingFunction: vars.animation.easing.standard,
+    animationIterationCount: 'infinite',
+    animationName: blinker,
+});

package/dist/components/LoadingBox/LoadingBox.d.ts

@@ -0,0 +1,9 @@
+import { ComponentProps, FunctionComponent } from 'react';
+import { Box } from '../Box';
+export interface Props extends Omit<ComponentProps<typeof Box>, 'width'> {
+    className?: string;
+    randomWidth?: boolean;
+    blinking?: boolean;
+}
+export declare const LoadingBox: FunctionComponent<Props>;
+//# sourceMappingURL=LoadingBox.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingBox.d.ts","sourceRoot":"","sources":["../../../lib/components/LoadingBox/LoadingBox.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAI7B,MAAM,WAAW,KAAM,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,OAAO,CAAC;IACvE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,UAAU,EAAE,iBAAiB,CAAC,KAAK,CAoB/C,CAAC"}

package/dist/components/LoadingBox/LoadingBox.js

@@ -1,39 +1,7 @@
-"use strict";
-
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["className", "randomWidth", "blinking", "backgroundColour", "display", "is"];
-
-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 { Box } from "../Box/index.js";
-import * as styles from "./LoadingBox.css.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export const LoadingBox = _ref => {
-  let {
-    className = '',
-    randomWidth = false,
-    blinking = true,
-    backgroundColour = 'gray200',
-    display = 'block',
-    is = 'span'
-  } = _ref,
-      boxStyles = _objectWithoutProperties(_ref, _excluded);
-
-  return _jsx(Box, _objectSpread(_objectSpread({
-    is: is,
-    display: display,
-    width: randomWidth ? undefined : 'full',
-    backgroundColour: backgroundColour
-  }, boxStyles), {}, {
-    className: [styles.root, blinking && styles.blinking, className],
-    style: {
-      width: randomWidth ? getRandomIntWidth(60, 40) : undefined
-    }
-  }));
-};
-
-const getRandomIntWidth = (max, min) => "".concat(Math.random() * (max - min) + min, "%");
+import { Box } from '../Box';
+import * as styles from './LoadingBox.css';
+export const LoadingBox = ({ className = '', randomWidth = false, blinking = true, backgroundColour = 'gray200', display = 'block', is = 'span', ...boxStyles }) => (React.createElement(Box, { is: is, display: display, width: randomWidth ? undefined : 'full', backgroundColour: backgroundColour, ...boxStyles, className: [styles.root, blinking && styles.blinking, className], style: {
+        width: randomWidth ? getRandomIntWidth(60, 40) : undefined,
+    } }));
+const getRandomIntWidth = (max, min) => `${Math.random() * (max - min) + min}%`;

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

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

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

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

package/dist/components/LoadingBox/index.js

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

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

@@ -0,0 +1,2 @@
+export declare const variant: Record<"primary" | "secondary", string>;
+//# sourceMappingURL=Meta.css.d.ts.map

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

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

package/dist/components/Meta/Meta.css.js

@@ -1,18 +1,10 @@
-"use strict";
-
-import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
-
-__vanilla_filescope__.setFileScope("lib/components/Meta/Meta.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 variant = styleVariants({
-  primary: {
-    color: vars.colours.intent.primary.background.strong
-  },
-  secondary: {
-    color: vars.typography.colour.dark
-  }
-}, "variant");
-
-__vanilla_filescope__.endFileScope();
+    primary: {
+        color: vars.colours.intent.primary.background.strong,
+    },
+    secondary: {
+        color: vars.typography.colour.dark,
+    },
+});

package/dist/components/Meta/Meta.d.ts

@@ -0,0 +1,11 @@
+import { IconType } from '@autoguru/icons';
+import { ComponentProps, FunctionComponent } from 'react';
+import { Text } from '../Text';
+import * as styles from './Meta.css';
+export interface Props extends Pick<ComponentProps<typeof Text>, 'breakWord'> {
+    icon: IconType;
+    label: string;
+    variant?: keyof typeof styles.variant;
+}
+export declare const Meta: FunctionComponent<Props>;
+//# sourceMappingURL=Meta.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Meta.d.ts","sourceRoot":"","sources":["../../../lib/components/Meta/Meta.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE3C,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAI1D,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,OAAO,KAAK,MAAM,MAAM,YAAY,CAAC;AAErC,MAAM,WAAW,KAAM,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EAAE,WAAW,CAAC;IAC5E,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,OAAO,MAAM,CAAC,OAAO,CAAC;CACtC;AAED,eAAO,MAAM,IAAI,EAAE,iBAAiB,CAAC,KAAK,CAUzC,CAAC"}

package/dist/components/Meta/Meta.js

@@ -1,30 +1,8 @@
-"use strict";
-
 import * as React from 'react';
-import { Inline } from "../index.js";
-import { Icon } from "../Icon/index.js";
-import { Text } from "../Text/index.js";
-import * as styles from "./Meta.css.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export const Meta = _ref => {
-  let {
-    icon,
-    label,
-    variant = 'primary',
-    breakWord
-  } = _ref;
-  return _jsxs(Inline, {
-    noWrap: true,
-    is: "span",
-    space: "2",
-    alignY: "center",
-    children: [icon && _jsx(Icon, {
-      icon: icon,
-      className: styles.variant[variant]
-    }), _jsx(Text, {
-      breakWord: breakWord,
-      children: label
-    })]
-  });
-};
+import { Inline } from '..';
+import { Icon } from '../Icon';
+import { Text } from '../Text';
+import * as styles from './Meta.css';
+export const Meta = ({ icon, label, variant = 'primary', breakWord, }) => (React.createElement(Inline, { noWrap: true, is: "span", space: "2", alignY: "center" },
+    icon && React.createElement(Icon, { icon: icon, className: styles.variant[variant] }),
+    React.createElement(Text, { breakWord: breakWord }, label)));

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

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

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

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

package/dist/components/Meta/index.js

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

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

@@ -0,0 +1,3 @@
+export declare const container: string;
+export declare const content: string;
+//# sourceMappingURL=MinimalModal.css.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MinimalModal.css.d.ts","sourceRoot":"","sources":["../../../lib/components/MinimalModal/MinimalModal.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS,QAEpB,CAAC;AAEH,eAAO,MAAM,OAAO,QAMlB,CAAC"}

package/dist/components/MinimalModal/MinimalModal.css.js

@@ -1,18 +1,10 @@
-"use strict";
-
-import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
-
-__vanilla_filescope__.setFileScope("lib/components/MinimalModal/MinimalModal.css.ts", "@autoguru/overdrive");
-
 import { style } from '@vanilla-extract/css';
 export const container = style({
-  outline: '0'
-}, "container");
+    outline: '0',
+});
 export const content = style({
-  overflowY: 'auto',
-  overscrollBehavior: 'contain',
-  webkitOverflowScrolling: 'touch',
-  '-webkit-overflow-scrolling': 'touch'
-}, "content");
-
-__vanilla_filescope__.endFileScope();
+    overflowY: 'auto',
+    overscrollBehavior: 'contain',
+    webkitOverflowScrolling: 'touch',
+    '-webkit-overflow-scrolling': 'touch',
+});

package/dist/components/MinimalModal/MinimalModal.d.ts

@@ -0,0 +1,9 @@
+import type { ComponentProps, FunctionComponent } from 'react';
+import { ReactNode } from 'react';
+import { Modal } from '../Modal';
+export interface Props extends ComponentProps<typeof Modal> {
+    className?: string;
+    children?: ReactNode;
+}
+export declare const MinimalModal: FunctionComponent<Props>;
+//# sourceMappingURL=MinimalModal.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MinimalModal.d.ts","sourceRoot":"","sources":["../../../lib/components/MinimalModal/MinimalModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACX,cAAc,EACd,iBAAiB,EAEjB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,SAAS,EAA2B,MAAM,OAAO,CAAC;AAI3D,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAIjC,MAAM,WAAW,KAAM,SAAQ,cAAc,CAAC,OAAO,KAAK,CAAC;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,EAAE,iBAAiB,CAAC,KAAK,CA+DjD,CAAC"}

package/dist/components/MinimalModal/MinimalModal.js

@@ -1,64 +1,29 @@
-"use strict";
-
 import * as React from 'react';
 import { useLayoutEffect, useRef } from 'react';
-import { useEventCallback, useId } from "../../utils/index.js";
-import { Box } from "../Box/index.js";
-import { Modal } from "../Modal/index.js";
-import * as styles from "./MinimalModal.css.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export const MinimalModal = _ref => {
-  let {
-    isOpen,
-    className = '',
-    onRequestClose,
-    children
-  } = _ref;
-  const titleId = useId();
-  const locked = useRef(true);
-  const unlockModal = useEventCallback(event => {
-    locked.current = event.target !== event.currentTarget;
-  });
-  const backdropHandler = useEventCallback(event => {
-    if (locked.current || event.target !== event.currentTarget) return;
-    if (typeof onRequestClose === 'function') onRequestClose('backdrop');
-  });
-  useLayoutEffect(() => {
-    document.body.style.overflow = isOpen ? 'hidden' : '';
-    return () => {
-      document.body.style.overflow = '';
-    };
-  }, [isOpen]);
-  return _jsx(Modal, {
-    isOpen: isOpen,
-    onRequestClose: onRequestClose,
-    children: _jsx(Box, {
-      className: [styles.container, className],
-      height: "full",
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      "aria-hidden": isOpen ? 'false' : 'true',
-      role: "none presentation",
-      onMouseDown: unlockModal,
-      onClick: backdropHandler,
-      children: _jsx(Box, {
-        is: "article",
-        role: "dialog",
-        "aria-modal": "true",
-        "aria-labelledby": titleId,
-        display: "flex",
-        flexDirection: "column",
-        children: _jsx(Box, {
-          is: "main",
-          display: "flex",
-          flexDirection: "column",
-          flexGrow: 1,
-          height: "full",
-          className: styles.content,
-          children: children
-        })
-      })
-    })
-  });
-};
+import { useEventCallback, useId } from '../../utils';
+import { Box } from '../Box';
+import { Modal } from '../Modal';
+import * as styles from './MinimalModal.css';
+export const MinimalModal = ({ isOpen, className = '', onRequestClose, children, }) => {
+    const titleId = useId();
+    const locked = useRef(true);
+    const unlockModal = useEventCallback((event) => {
+        locked.current = event.target !== event.currentTarget;
+    });
+    const backdropHandler = useEventCallback((event) => {
+        if (locked.current || event.target !== event.currentTarget)
+            return;
+        if (typeof onRequestClose === 'function')
+            onRequestClose('backdrop');
+    });
+    useLayoutEffect(() => {
+        document.body.style.overflow = isOpen ? 'hidden' : '';
+        return () => {
+            document.body.style.overflow = '';
+        };
+    }, [isOpen]);
+    return (React.createElement(Modal, { isOpen: isOpen, onRequestClose: onRequestClose },
+        React.createElement(Box, { className: [styles.container, className], height: "full", display: "flex", alignItems: "center", justifyContent: "center", "aria-hidden": isOpen ? 'false' : 'true', role: "none presentation", onMouseDown: unlockModal, onClick: backdropHandler },
+            React.createElement(Box, { is: "article", role: "dialog", "aria-modal": "true", "aria-labelledby": titleId, display: "flex", flexDirection: "column" },
+                React.createElement(Box, { is: "main", display: "flex", flexDirection: "column", flexGrow: 1, height: "full", className: styles.content }, children)))));
+};

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

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

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

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

package/dist/components/MinimalModal/index.js

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

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

@@ -0,0 +1,5 @@
+export declare const root: string;
+export declare const transition: string;
+export declare const entry: string;
+export declare const backdrop: Record<"root" | "invisible", string>;
+//# sourceMappingURL=Modal.css.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.css.d.ts","sourceRoot":"","sources":["../../../lib/components/Modal/Modal.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,QAMf,CAAC;AAEH,eAAO,MAAM,UAAU,QAErB,CAAC;AAEH,eAAO,MAAM,KAAK,QAOhB,CAAC;AAEH,eAAO,MAAM,QAAQ,sCAenB,CAAC"}

package/dist/components/Modal/Modal.css.js

@@ -1,44 +1,36 @@
-"use strict";
-
-import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
-
-__vanilla_filescope__.setFileScope("lib/components/Modal/Modal.css.ts", "@autoguru/overdrive");
-
 import { style, styleVariants } from '@vanilla-extract/css';
-import { vars } from "../../themes/base/vars.css.js";
+import { vars } from '../../themes/base/vars.css';
 export const root = style({
-  top: 0,
-  right: 0,
-  bottom: 0,
-  left: 0,
-  zIndex: 1000
-}, "root");
-export const transition = style({
-  transition: "transform .175s ".concat(vars.animation.easing.standard, ", opacity 0.3s ").concat(vars.animation.easing.standard)
-}, "transition");
-export const entry = style({
-  '@media': {
-    'screen and (prefers-reduced-motion)': {
-      transform: 'none !important'
-    }
-  },
-  transform: 'scale(.95)'
-}, "entry");
-export const backdrop = styleVariants({
-  root: {
     top: 0,
     right: 0,
     bottom: 0,
     left: 0,
-    zIndex: 999,
-    backgroundColor: vars.colours.intent.neutral.background.standard,
-    opacity: 0.75,
-    backdropFilter: 'blur(5px)'
-  },
-  invisible: {
-    backgroundColor: 'transparent',
-    backdropFilter: 'none'
-  }
-}, "backdrop");
-
-__vanilla_filescope__.endFileScope();
+    zIndex: 1000,
+});
+export const transition = style({
+    transition: `transform .175s ${vars.animation.easing.standard}, opacity 0.3s ${vars.animation.easing.standard}`,
+});
+export const entry = style({
+    '@media': {
+        'screen and (prefers-reduced-motion)': {
+            transform: 'none !important',
+        },
+    },
+    transform: 'scale(.95)',
+});
+export const backdrop = styleVariants({
+    root: {
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0,
+        zIndex: 999,
+        backgroundColor: vars.colours.intent.neutral.background.standard,
+        opacity: 0.75,
+        backdropFilter: 'blur(5px)',
+    },
+    invisible: {
+        backgroundColor: 'transparent',
+        backdropFilter: 'none',
+    },
+});

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

@@ -0,0 +1,11 @@
+import type { ComponentType, FunctionComponent } from 'react';
+import { ReactNode } from 'react';
+export interface Props {
+    isOpen: boolean;
+    hideBackdrop?: boolean;
+    children?: ReactNode;
+    onRequestClose?(e: 'backdrop' | 'escapeKeyDown' | string): void;
+}
+export declare const Modal: FunctionComponent<Props>;
+export declare const withModal: <TIncomingProps extends {} = {}>(WrappedComponent: ComponentType<Props & TIncomingProps>) => FunctionComponent<Props & TIncomingProps>;
+//# sourceMappingURL=Modal.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../lib/components/Modal/Modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAW,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAE,SAAS,EAAyB,MAAM,OAAO,CAAC;AASzD,MAAM,WAAW,KAAK;IACrB,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,cAAc,CAAC,CAAC,CAAC,EAAE,UAAU,GAAG,eAAe,GAAG,MAAM,GAAG,IAAI,CAAC;CAChE;AAqDD,eAAO,MAAM,KAAK,EAAE,iBAAiB,CAAC,KAAK,CAkE1C,CAAC;AAEF,eAAO,MAAM,SAAS,wIAqBrB,CAAC"}