@autoguru/overdrive 4.1.3 → 4.1.4

package/dist/components/Box/useBoxStyles.css.js

@@ -1,112 +1,132 @@
+"use strict";
+
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
+
+__vanilla_filescope__.setFileScope("lib/components/Box/useBoxStyles.css.ts", "@autoguru/overdrive");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 import { style, styleVariants } from '@vanilla-extract/css';
-import { vars } from '../../themes/base/vars.css';
-import { mapTokenToProperty } from '../../utils/mapTokenToProperty';
-import { makeResponsiveStyle } from '../../utils/responsiveProps.css';
+import { vars } from "../../themes/base/vars.css.js";
+import { mapTokenToProperty } from "../../utils/mapTokenToProperty.js";
+import { makeResponsiveStyle } from "../../utils/responsiveProps.css.js";
 export const padding = {
-    top: makeResponsiveStyle(vars.space, 'paddingTop'),
-    right: makeResponsiveStyle(vars.space, 'paddingRight'),
-    bottom: makeResponsiveStyle(vars.space, 'paddingBottom'),
-    left: makeResponsiveStyle(vars.space, 'paddingLeft'),
+  top: makeResponsiveStyle(vars.space, 'paddingTop'),
+  right: makeResponsiveStyle(vars.space, 'paddingRight'),
+  bottom: makeResponsiveStyle(vars.space, 'paddingBottom'),
+  left: makeResponsiveStyle(vars.space, 'paddingLeft')
 };
 export const margin = {
-    top: makeResponsiveStyle(vars.space, 'marginTop'),
-    right: makeResponsiveStyle(vars.space, 'marginRight'),
-    bottom: makeResponsiveStyle(vars.space, 'marginBottom'),
-    left: makeResponsiveStyle(vars.space, 'marginLeft'),
+  top: makeResponsiveStyle(vars.space, 'marginTop'),
+  right: makeResponsiveStyle(vars.space, 'marginRight'),
+  bottom: makeResponsiveStyle(vars.space, 'marginBottom'),
+  left: makeResponsiveStyle(vars.space, 'marginLeft')
 };
 export const boxShadow = makeResponsiveStyle(vars.elevation, 'boxShadow');
 export const border = {
-    style: style({
-        borderStyle: 'solid',
-    }),
-    colour: {
-        top: styleVariants(mapTokenToProperty(vars.border.colours, 'borderTopColor')),
-        right: styleVariants(mapTokenToProperty(vars.border.colours, 'borderRightColor')),
-        bottom: styleVariants(mapTokenToProperty(vars.border.colours, 'borderBottomColor')),
-        left: styleVariants(mapTokenToProperty(vars.border.colours, 'borderLeftColor')),
-    },
-    width: {
-        top: makeResponsiveStyle(vars.border.width, 'borderTopWidth'),
-        right: makeResponsiveStyle(vars.border.width, 'borderRightWidth'),
-        bottom: makeResponsiveStyle(vars.border.width, 'borderBottomWidth'),
-        left: makeResponsiveStyle(vars.border.width, 'borderLeftWidth'),
-    },
+  style: style({
+    borderStyle: 'solid'
+  }, "border_style"),
+  colour: {
+    top: styleVariants(mapTokenToProperty(vars.border.colours, 'borderTopColor'), "border_colour_top"),
+    right: styleVariants(mapTokenToProperty(vars.border.colours, 'borderRightColor'), "border_colour_right"),
+    bottom: styleVariants(mapTokenToProperty(vars.border.colours, 'borderBottomColor'), "border_colour_bottom"),
+    left: styleVariants(mapTokenToProperty(vars.border.colours, 'borderLeftColor'), "border_colour_left")
+  },
+  width: {
+    top: makeResponsiveStyle(vars.border.width, 'borderTopWidth'),
+    right: makeResponsiveStyle(vars.border.width, 'borderRightWidth'),
+    bottom: makeResponsiveStyle(vars.border.width, 'borderBottomWidth'),
+    left: makeResponsiveStyle(vars.border.width, 'borderLeftWidth')
+  }
 };
 export const borderRadius = makeResponsiveStyle(vars.border.radius, 'borderRadius');
-export const backgroundColours = styleVariants(mapTokenToProperty({
-    ...vars.colours.gamut,
-    transparent: 'transparent',
-}, 'backgroundColor'));
+export const backgroundColours = styleVariants(mapTokenToProperty(_objectSpread(_objectSpread({}, vars.colours.gamut), {}, {
+  transparent: 'transparent'
+}), 'backgroundColor'), "backgroundColours");
 export const width = styleVariants({
-    full: {
-        width: '100%',
-    },
-});
+  full: {
+    width: '100%'
+  }
+}, "width");
 export const height = styleVariants({
-    full: {
-        height: '100%',
-    },
-});
+  full: {
+    height: '100%'
+  }
+}, "height");
 export const position = styleVariants(mapTokenToProperty({
-    absolute: 'absolute',
-    fixed: 'fixed',
-    relative: 'relative',
-}, 'position'));
+  absolute: 'absolute',
+  fixed: 'fixed',
+  relative: 'relative'
+}, 'position'), "position");
 export const textAlign = styleVariants(mapTokenToProperty({
-    left: 'left',
-    center: 'center',
-    right: 'right',
-}, 'textAlign'));
+  left: 'left',
+  center: 'center',
+  right: 'right'
+}, 'textAlign'), "textAlign");
 export const overflow = styleVariants(mapTokenToProperty({
-    hidden: 'hidden',
-    scroll: 'scroll',
-    visible: 'visible',
-    auto: 'auto',
-}, 'overflow'));
+  hidden: 'hidden',
+  scroll: 'scroll',
+  visible: 'visible',
+  auto: 'auto'
+}, 'overflow'), "overflow");
 export const display = styleVariants(mapTokenToProperty({
-    contents: 'contents',
-    block: 'block',
-    flex: 'flex',
-    inlineFlex: 'inline-flex',
-    inline: 'inline',
-    inlineBlock: 'inline-block',
-    none: 'none',
-}, 'display'));
+  contents: 'contents',
+  block: 'block',
+  flex: 'flex',
+  inlineFlex: 'inline-flex',
+  inline: 'inline',
+  inlineBlock: 'inline-block',
+  none: 'none'
+}, 'display'), "display");
 export const opacity = styleVariants({
-    0: { opacity: 0 },
-    1: { opacity: 1 },
-});
+  0: {
+    opacity: 0
+  },
+  1: {
+    opacity: 1
+  }
+}, "opacity");
 export const userSelect = styleVariants({
-    none: { userSelect: 'none' },
-});
+  none: {
+    userSelect: 'none'
+  }
+}, "userSelect");
 export const alignItems = makeResponsiveStyle({
-    flexStart: 'flex-start',
-    center: 'center',
-    flexEnd: 'flex-end',
+  flexStart: 'flex-start',
+  center: 'center',
+  flexEnd: 'flex-end'
 }, 'alignItems');
 export const flexDirection = makeResponsiveStyle({
-    row: 'row',
-    rowReverse: 'row-reverse',
-    column: 'column',
-    columnReverse: 'column-reverse',
+  row: 'row',
+  rowReverse: 'row-reverse',
+  column: 'column',
+  columnReverse: 'column-reverse'
 }, 'flexDirection');
 export const flexGrow = styleVariants(mapTokenToProperty({
-    0: 0,
-    1: 1,
-}, 'flexGrow'));
+  0: 0,
+  1: 1
+}, 'flexGrow'), "flexGrow");
 export const flexShrink = styleVariants(mapTokenToProperty({
-    0: 0,
-}, 'flexShrink'));
+  0: 0
+}, 'flexShrink'), "flexShrink");
 export const flexWrap = styleVariants(mapTokenToProperty({
-    wrap: 'wrap',
-    nowrap: 'nowrap',
-}, 'flexWrap'));
+  wrap: 'wrap',
+  nowrap: 'nowrap'
+}, 'flexWrap'), "flexWrap");
 export const justifyContent = makeResponsiveStyle({
-    flexStart: 'flex-start',
-    center: 'center',
-    flexEnd: 'flex-end',
-    spaceBetween: 'space-between',
+  flexStart: 'flex-start',
+  center: 'center',
+  flexEnd: 'flex-end',
+  spaceBetween: 'space-between'
 }, 'justifyContent');
 export const pointerEvents = styleVariants({
-    none: { pointerEvents: 'none' },
-});
+  none: {
+    pointerEvents: 'none'
+  }
+}, "pointerEvents");
+
+__vanilla_filescope__.endFileScope();

package/dist/components/Box/useBoxStyles.js

@@ -1,48 +1,76 @@
+"use strict";
+
 import clsx from 'clsx';
-import * as resetStyles from '../../reset/reset.css';
-import { resolveResponsiveStyle } from '../../utils/resolveResponsiveProps';
-import * as styles from './useBoxStyles.css';
-export const useBoxStyles = ({ is, display, padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight, margin, marginX, marginY, marginTop, marginBottom, marginLeft, marginRight, boxShadow, borderWidth, borderWidthX, borderWidthY, borderWidthTop, borderWidthRight, borderWidthBottom, borderWidthLeft, borderColour, borderColourX, borderColourY, borderColourTop, borderColourRight, borderColourBottom, borderColourLeft, borderRadius, backgroundColour, opacity, width, height, position, overflow, userSelect, textAlign, pointerEvents, alignItems, flexDirection, flexGrow, flexShrink, flexWrap, justifyContent, className, }) => {
-    const resolvedPaddingTop = paddingTop || paddingY || padding;
-    const resolvedPaddingRight = paddingRight || paddingX || padding;
-    const resolvedPaddingBottom = paddingBottom || paddingY || padding;
-    const resolvedPaddingLeft = paddingLeft || paddingX || padding;
-    const resolvedMarginTop = marginTop || marginY || margin;
-    const resolvedMarginRight = marginRight || marginX || margin;
-    const resolvedMarginBottom = marginBottom || marginY || margin;
-    const resolvedMarginLeft = marginLeft || marginX || margin;
-    const resolvedBorderWidthTop = borderWidthTop || borderWidthY || borderWidth;
-    const resolvedBorderWidthRight = borderWidthRight || borderWidthX || borderWidth;
-    const resolvedBorderWidthBottom = borderWidthBottom || borderWidthY || borderWidth;
-    const resolvedBorderWidthLeft = borderWidthLeft || borderWidth || borderWidth;
-    const resolvedBorderColourTop = borderColourTop || borderColourY || borderColour;
-    const resolvedBorderColourRight = borderColourRight || borderColourX || borderColour;
-    const resolvedBorderColourBottom = borderColourBottom || borderColourY || borderColour;
-    const resolvedBorderColourLeft = borderColourLeft || borderColour || borderColour;
-    const hasBorder = resolvedBorderWidthTop ||
-        resolvedBorderWidthRight ||
-        resolvedBorderWidthBottom ||
-        resolvedBorderWidthLeft;
-    return clsx(typeof is === 'string'
-        ? [resetStyles.element[is]]
-        : [resetStyles.element.div], resolveResponsiveStyle(resolvedPaddingTop, styles.padding.top), resolveResponsiveStyle(resolvedPaddingRight, styles.padding.right), resolveResponsiveStyle(resolvedPaddingBottom, styles.padding.bottom), resolveResponsiveStyle(resolvedPaddingLeft, styles.padding.left), resolveResponsiveStyle(resolvedMarginTop, styles.margin.top), resolveResponsiveStyle(resolvedMarginRight, styles.margin.right), resolveResponsiveStyle(resolvedMarginBottom, styles.margin.bottom), resolveResponsiveStyle(resolvedMarginLeft, styles.margin.left), styles.display[display], styles.width[width], styles.height[height], styles.position[position], styles.overflow[overflow], styles.userSelect[userSelect], styles.textAlign[textAlign], styles.pointerEvents[pointerEvents], hasBorder && styles.border.style, hasBorder &&
-        resolvedBorderColourTop &&
-        styles.border.colour.top[resolvedBorderColourTop], hasBorder &&
-        resolvedBorderColourRight &&
-        styles.border.colour.right[resolvedBorderColourRight], hasBorder &&
-        resolvedBorderColourBottom &&
-        styles.border.colour.bottom[resolvedBorderColourBottom], hasBorder &&
-        resolvedBorderColourLeft &&
-        styles.border.colour.left[resolvedBorderColourLeft], hasBorder &&
-        resolvedBorderWidthTop &&
-        resolveResponsiveStyle(resolvedBorderWidthTop, styles.border.width.top), hasBorder &&
-        resolvedBorderWidthRight &&
-        resolveResponsiveStyle(resolvedBorderWidthRight, styles.border.width.right), hasBorder &&
-        resolvedBorderWidthBottom &&
-        resolveResponsiveStyle(resolvedBorderWidthBottom, styles.border.width.bottom), hasBorder &&
-        resolvedBorderWidthLeft &&
-        resolveResponsiveStyle(resolvedBorderWidthLeft, styles.border.width.left), resolveResponsiveStyle(boxShadow, styles.boxShadow), borderRadius &&
-        resolveResponsiveStyle(borderRadius, styles.borderRadius), styles.backgroundColours[backgroundColour], styles.opacity[opacity], alignItems && resolveResponsiveStyle(alignItems, styles.alignItems), flexDirection &&
-        resolveResponsiveStyle(flexDirection, styles.flexDirection), styles.flexGrow[flexGrow], styles.flexShrink[flexShrink], styles.flexWrap[flexWrap], justifyContent &&
-        resolveResponsiveStyle(justifyContent, styles.justifyContent), className);
-};
+import * as resetStyles from "../../reset/reset.css.js";
+import { resolveResponsiveStyle } from "../../utils/resolveResponsiveProps.js";
+import * as styles from "./useBoxStyles.css.js";
+export const useBoxStyles = _ref => {
+  let {
+    is,
+    display,
+    padding,
+    paddingX,
+    paddingY,
+    paddingTop,
+    paddingBottom,
+    paddingLeft,
+    paddingRight,
+    margin,
+    marginX,
+    marginY,
+    marginTop,
+    marginBottom,
+    marginLeft,
+    marginRight,
+    boxShadow,
+    borderWidth,
+    borderWidthX,
+    borderWidthY,
+    borderWidthTop,
+    borderWidthRight,
+    borderWidthBottom,
+    borderWidthLeft,
+    borderColour,
+    borderColourX,
+    borderColourY,
+    borderColourTop,
+    borderColourRight,
+    borderColourBottom,
+    borderColourLeft,
+    borderRadius,
+    backgroundColour,
+    opacity,
+    width,
+    height,
+    position,
+    overflow,
+    userSelect,
+    textAlign,
+    pointerEvents,
+    alignItems,
+    flexDirection,
+    flexGrow,
+    flexShrink,
+    flexWrap,
+    justifyContent,
+    className
+  } = _ref;
+  const resolvedPaddingTop = paddingTop || paddingY || padding;
+  const resolvedPaddingRight = paddingRight || paddingX || padding;
+  const resolvedPaddingBottom = paddingBottom || paddingY || padding;
+  const resolvedPaddingLeft = paddingLeft || paddingX || padding;
+  const resolvedMarginTop = marginTop || marginY || margin;
+  const resolvedMarginRight = marginRight || marginX || margin;
+  const resolvedMarginBottom = marginBottom || marginY || margin;
+  const resolvedMarginLeft = marginLeft || marginX || margin;
+  const resolvedBorderWidthTop = borderWidthTop || borderWidthY || borderWidth;
+  const resolvedBorderWidthRight = borderWidthRight || borderWidthX || borderWidth;
+  const resolvedBorderWidthBottom = borderWidthBottom || borderWidthY || borderWidth;
+  const resolvedBorderWidthLeft = borderWidthLeft || borderWidth || borderWidth;
+  const resolvedBorderColourTop = borderColourTop || borderColourY || borderColour;
+  const resolvedBorderColourRight = borderColourRight || borderColourX || borderColour;
+  const resolvedBorderColourBottom = borderColourBottom || borderColourY || borderColour;
+  const resolvedBorderColourLeft = borderColourLeft || borderColour || borderColour;
+  const hasBorder = resolvedBorderWidthTop || resolvedBorderWidthRight || resolvedBorderWidthBottom || resolvedBorderWidthLeft;
+  return clsx(typeof is === 'string' ? [resetStyles.element[is]] : [resetStyles.element.div], resolveResponsiveStyle(resolvedPaddingTop, styles.padding.top), resolveResponsiveStyle(resolvedPaddingRight, styles.padding.right), resolveResponsiveStyle(resolvedPaddingBottom, styles.padding.bottom), resolveResponsiveStyle(resolvedPaddingLeft, styles.padding.left), resolveResponsiveStyle(resolvedMarginTop, styles.margin.top), resolveResponsiveStyle(resolvedMarginRight, styles.margin.right), resolveResponsiveStyle(resolvedMarginBottom, styles.margin.bottom), resolveResponsiveStyle(resolvedMarginLeft, styles.margin.left), styles.display[display], styles.width[width], styles.height[height], styles.position[position], styles.overflow[overflow], styles.userSelect[userSelect], styles.textAlign[textAlign], styles.pointerEvents[pointerEvents], hasBorder && styles.border.style, hasBorder && resolvedBorderColourTop && styles.border.colour.top[resolvedBorderColourTop], hasBorder && resolvedBorderColourRight && styles.border.colour.right[resolvedBorderColourRight], hasBorder && resolvedBorderColourBottom && styles.border.colour.bottom[resolvedBorderColourBottom], hasBorder && resolvedBorderColourLeft && styles.border.colour.left[resolvedBorderColourLeft], hasBorder && resolvedBorderWidthTop && resolveResponsiveStyle(resolvedBorderWidthTop, styles.border.width.top), hasBorder && resolvedBorderWidthRight && resolveResponsiveStyle(resolvedBorderWidthRight, styles.border.width.right), hasBorder && resolvedBorderWidthBottom && resolveResponsiveStyle(resolvedBorderWidthBottom, styles.border.width.bottom), hasBorder && resolvedBorderWidthLeft && resolveResponsiveStyle(resolvedBorderWidthLeft, styles.border.width.left), resolveResponsiveStyle(boxShadow, styles.boxShadow), borderRadius && resolveResponsiveStyle(borderRadius, styles.borderRadius), styles.backgroundColours[backgroundColour], styles.opacity[opacity], alignItems && resolveResponsiveStyle(alignItems, styles.alignItems), flexDirection && resolveResponsiveStyle(flexDirection, styles.flexDirection), styles.flexGrow[flexGrow], styles.flexShrink[flexShrink], styles.flexWrap[flexWrap], justifyContent && resolveResponsiveStyle(justifyContent, styles.justifyContent), className);
+};

package/dist/components/BulletList/Bullet.css.js

@@ -1,45 +1,53 @@
+"use strict";
+
+import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
+
+__vanilla_filescope__.setFileScope("lib/components/BulletList/Bullet.css.ts", "@autoguru/overdrive");
+
 import { style, styleVariants } from '@vanilla-extract/css';
-import { vars } from '../../themes/base/vars.css';
+import { vars } from "../../themes/base/vars.css.js";
 export const root = styleVariants({
-    default: {
-        display: 'grid',
-        gridTemplateColumns: 'min-content 1fr',
-        gridGap: vars.space['4'],
-        marginBottom: vars.space['2'],
-        ':last-of-type': {
-            marginBottom: 0,
-        },
-        ':before': {
-            display: 'block',
-            alignSelf: 'flex-start',
-            width: vars.space['2'],
-            height: vars.space['2'],
-            marginTop: `calc((1.6em - ${vars.space['2']}) / 2)`,
-            content: "' '",
-            backgroundColor: vars.typography.colour.dark,
-        },
+  default: {
+    display: 'grid',
+    gridTemplateColumns: 'min-content 1fr',
+    gridGap: vars.space['4'],
+    marginBottom: vars.space['2'],
+    ':last-of-type': {
+      marginBottom: 0
     },
-    circle: {
-        ':before': {
-            borderRadius: '50%',
-        },
-    },
-    disc: {
-        ':before': {
-            border: `2px solid ${vars.typography.colour.dark}`,
-            borderRadius: '50%',
-            backgroundColor: 'transparent',
-        },
-    },
-    square: {
-        ':before': {
-            border: `2px solid ${vars.typography.colour.dark}`,
-            backgroundColor: 'transparent',
-        },
-    },
-});
-export const noDot = style({
     ':before': {
-        visibility: 'hidden',
-    },
-});
+      display: 'block',
+      alignSelf: 'flex-start',
+      width: vars.space['2'],
+      height: vars.space['2'],
+      marginTop: "calc((1.6em - ".concat(vars.space['2'], ") / 2)"),
+      content: "' '",
+      backgroundColor: vars.typography.colour.dark
+    }
+  },
+  circle: {
+    ':before': {
+      borderRadius: '50%'
+    }
+  },
+  disc: {
+    ':before': {
+      border: "2px solid ".concat(vars.typography.colour.dark),
+      borderRadius: '50%',
+      backgroundColor: 'transparent'
+    }
+  },
+  square: {
+    ':before': {
+      border: "2px solid ".concat(vars.typography.colour.dark),
+      backgroundColor: 'transparent'
+    }
+  }
+}, "root");
+export const noDot = style({
+  ':before': {
+    visibility: 'hidden'
+  }
+}, "noDot");
+
+__vanilla_filescope__.endFileScope();

package/dist/components/BulletList/Bullet.js

@@ -1,27 +1,41 @@
+"use strict";
+
 import * as React from 'react';
-import { isValidElement, useContext, } from 'react';
-import { Box } from '../Box';
-import * as styles from './Bullet.css';
-import { BulletList } from './BulletList';
-import { BulletListContext, bulletMap } from './context';
+import { isValidElement, useContext } from 'react';
+import { Box } from "../Box/index.js";
+import * as styles from "./Bullet.css.js";
+import { BulletList } from "./BulletList.js";
+import { BulletListContext, bulletMap } from "./context.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+
 const getBulletCls = (styles, type) => {
-    switch (type) {
-        case 'circle':
-            return styles.root.circle;
-        case 'square':
-            return styles.root.square;
-        case 'disc':
-            return styles.root.disc;
-        default:
-            return '';
-    }
+  switch (type) {
+    case 'circle':
+      return styles.root.circle;
+
+    case 'square':
+      return styles.root.square;
+
+    case 'disc':
+      return styles.root.disc;
+
+    default:
+      return '';
+  }
 };
-export const Bullet = ({ children, className }) => (React.createElement(Box, { is: "li", className: [
-        styles.root.default,
-        getBulletCls(styles, bulletMap[useContext(BulletListContext)]) ??
-            '',
-        {
-            [styles.noDot]: isValidElement(children) && children.type === BulletList,
-        },
-        className,
-    ] }, children));
+
+export const Bullet = _ref => {
+  var _getBulletCls;
+
+  let {
+    children,
+    className
+  } = _ref;
+  return _jsx(Box, {
+    is: "li",
+    className: [styles.root.default, (_getBulletCls = getBulletCls(styles, bulletMap[useContext(BulletListContext)])) !== null && _getBulletCls !== void 0 ? _getBulletCls : '', {
+      [styles.noDot]: isValidElement(children) && children.type === BulletList
+    }, className],
+    children: children
+  });
+};

package/dist/components/BulletList/BulletList.css.js

@@ -1,8 +1,16 @@
+"use strict";
+
+import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
+
+__vanilla_filescope__.setFileScope("lib/components/BulletList/BulletList.css.ts", "@autoguru/overdrive");
+
 import { style } from '@vanilla-extract/css';
-import { vars } from '../../themes/base/vars.css';
+import { vars } from "../../themes/base/vars.css.js";
 export const root = style({
-    listStyle: 'inside none',
-});
+  listStyle: 'inside none'
+}, "root");
 export const firstOccurrence = style({
-    paddingLeft: vars.space['6'],
-});
+  paddingLeft: vars.space['6']
+}, "firstOccurrence");
+
+__vanilla_filescope__.endFileScope();

package/dist/components/BulletList/BulletList.js

@@ -1,13 +1,26 @@
+"use strict";
+
 import clsx from 'clsx';
 import * as React from 'react';
 import { useContext } from 'react';
-import { Box } from '../Box';
-import * as styles from './BulletList.css';
-import { BulletListContext, bulletMap } from './context';
-export const BulletList = ({ children, className, }) => {
-    const stack = useContext(BulletListContext);
-    return (React.createElement(Box, { is: "ul", className: clsx(className, styles.root, {
-            [styles.firstOccurrence]: stack === -1,
-        }) },
-        React.createElement(BulletListContext.Provider, { value: stack + 1 >= bulletMap.length ? 0 : stack + 1 }, children)));
-};
+import { Box } from "../Box/index.js";
+import * as styles from "./BulletList.css.js";
+import { BulletListContext, bulletMap } from "./context.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const BulletList = _ref => {
+  let {
+    children,
+    className
+  } = _ref;
+  const stack = useContext(BulletListContext);
+  return _jsx(Box, {
+    is: "ul",
+    className: clsx(className, styles.root, {
+      [styles.firstOccurrence]: stack === -1
+    }),
+    children: _jsx(BulletListContext.Provider, {
+      value: stack + 1 >= bulletMap.length ? 0 : stack + 1,
+      children: children
+    })
+  });
+};

package/dist/components/BulletList/context.js

@@ -1,3 +1,5 @@
+"use strict";
+
 import { createContext } from 'react';
 export const bulletMap = ['circle', 'square', 'disc'];
-export const BulletListContext = createContext(-1);
+export const BulletListContext = createContext(-1);

package/dist/components/BulletList/index.js

@@ -1,2 +1,4 @@
-export { BulletList } from './BulletList';
-export { Bullet } from './Bullet';
+"use strict";
+
+export { BulletList } from "./BulletList.js";
+export { Bullet } from "./Bullet.js";

package/dist/components/BulletText/BulletText.css.js

@@ -1,19 +1,27 @@
+"use strict";
+
+import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
+
+__vanilla_filescope__.setFileScope("lib/components/BulletText/BulletText.css.ts", "@autoguru/overdrive");
+
 import { style } from '@vanilla-extract/css';
-import { vars } from '../../themes/base/vars.css';
+import { vars } from "../../themes/base/vars.css.js";
 export const bullet = style({
-    lineHeight: vars.typography.size['2'].lineHeight,
-    width: vars.space['6'],
-    height: vars.space['6'],
-});
+  lineHeight: vars.typography.size['2'].lineHeight,
+  width: vars.space['6'],
+  height: vars.space['6']
+}, "bullet");
 export const primary = style({
-    backgroundColor: vars.colours.intent.primary.background.mild,
-});
+  backgroundColor: vars.colours.intent.primary.background.mild
+}, "primary");
 export const secondary = style({
-    backgroundColor: vars.colours.background.light,
-});
+  backgroundColor: vars.colours.background.light
+}, "secondary");
 export const primaryText = style({
-    color: vars.colours.intent.primary.background.standard,
-});
+  color: vars.colours.intent.primary.background.standard
+}, "primaryText");
 export const secondaryText = style({
-    color: vars.typography.colour.dark,
-});
+  color: vars.typography.colour.dark
+}, "secondaryText");
+
+__vanilla_filescope__.endFileScope();