@autoguru/overdrive 4.11.2 → 4.11.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Actions/stories.js +0 -5
- package/dist/components/Alert/Alert.css.d.ts +1 -2
- package/dist/components/Alert/Alert.css.d.ts.map +1 -1
- package/dist/components/Alert/Alert.css.js +8 -21
- package/dist/components/Alert/Alert.d.ts +2 -2
- package/dist/components/Alert/Alert.d.ts.map +1 -1
- package/dist/components/Alert/Alert.js +10 -4
- package/dist/components/Alert/stories.js +0 -10
- package/dist/components/Anchor/Anchor.css.js +0 -3
- package/dist/components/Anchor/Anchor.js +0 -2
- package/dist/components/Anchor/stories.js +0 -9
- package/dist/components/AutoSuggest/AutoSuggest.css.js +0 -3
- package/dist/components/AutoSuggest/AutoSuggest.js +56 -102
- package/dist/components/AutoSuggest/stories.js +1 -31
- package/dist/components/AutoSuggest/useLayoutSuggestionVisible.js +0 -2
- package/dist/components/Badge/Badge.css.js +0 -3
- package/dist/components/Badge/stories.js +0 -12
- package/dist/components/Box/Box.js +53 -57
- package/dist/components/Box/argTypes.d.ts.map +1 -1
- package/dist/components/Box/argTypes.js +0 -3
- package/dist/components/Box/stories.js +0 -5
- package/dist/components/Box/useBoxStyles.css.d.ts.map +1 -1
- package/dist/components/Box/useBoxStyles.css.js +0 -8
- package/dist/components/Box/useBoxStyles.d.ts.map +1 -1
- package/dist/components/BulletList/Bullet.css.d.ts +1 -1
- package/dist/components/BulletList/Bullet.css.js +0 -3
- package/dist/components/BulletList/Bullet.js +0 -6
- package/dist/components/BulletList/BulletList.css.js +0 -3
- package/dist/components/BulletList/stories.js +0 -6
- package/dist/components/BulletText/BulletText.css.js +0 -3
- package/dist/components/BulletText/stories.js +0 -5
- package/dist/components/Button/Button.css.js +0 -3
- package/dist/components/Button/Button.js +0 -11
- package/dist/components/Button/stories.js +0 -6
- package/dist/components/CheckBox/CheckBox.css.js +0 -3
- package/dist/components/CheckBox/stories.js +3 -11
- package/dist/components/ColourInput/ColourInput.css.js +0 -3
- package/dist/components/ColourInput/ColourInput.js +9 -13
- package/dist/components/ColourInput/stories.js +1 -26
- package/dist/components/Columns/Column.css.js +0 -5
- package/dist/components/Columns/Column.d.ts +1 -1
- package/dist/components/Columns/Column.js +10 -14
- package/dist/components/Columns/Columns.css.js +0 -3
- package/dist/components/Columns/Columns.d.ts +1 -1
- package/dist/components/Columns/Columns.js +11 -15
- package/dist/components/Columns/stories.js +0 -6
- package/dist/components/DateInput/DateInput.js +9 -13
- package/dist/components/DateInput/stories.js +1 -28
- package/dist/components/DatePicker/DatePicker.css.js +0 -3
- package/dist/components/DatePicker/DatePicker.js +8 -13
- package/dist/components/DatePicker/stories.js +0 -5
- package/dist/components/DividerLine/DividerLine.css.d.ts +0 -5
- package/dist/components/DividerLine/DividerLine.css.d.ts.map +1 -1
- package/dist/components/DividerLine/DividerLine.css.js +1 -31
- package/dist/components/DividerLine/DividerLine.d.ts +2 -1
- package/dist/components/DividerLine/DividerLine.d.ts.map +1 -1
- package/dist/components/DividerLine/DividerLine.js +2 -1
- package/dist/components/DividerLine/stories.js +0 -9
- package/dist/components/Flyout/Flyout.js +7 -11
- package/dist/components/Flyout/stories.js +1 -9
- package/dist/components/Heading/stories.js +0 -7
- package/dist/components/Icon/Icon.css.js +0 -3
- package/dist/components/Icon/stories.js +0 -11
- package/dist/components/Image/Image.js +3 -7
- package/dist/components/Image/ResponsiveImage.js +6 -10
- package/dist/components/Image/SimpleImage.js +7 -11
- package/dist/components/Image/stories.js +0 -13
- package/dist/components/Inline/Inline.js +0 -6
- package/dist/components/Inline/stories.js +0 -6
- package/dist/components/LinearProgressIndicator/LinearProgressIndicator.css.js +0 -3
- package/dist/components/LinearProgressIndicator/stories.js +0 -5
- package/dist/components/LoadingBox/LoadingBox.css.js +0 -3
- package/dist/components/LoadingBox/LoadingBox.js +8 -14
- package/dist/components/LoadingBox/stories.js +0 -5
- package/dist/components/Meta/Meta.css.js +0 -3
- package/dist/components/Meta/stories.js +0 -5
- package/dist/components/MinimalModal/MinimalModal.css.js +0 -3
- package/dist/components/MinimalModal/MinimalModal.js +0 -2
- package/dist/components/MinimalModal/stories.js +0 -11
- package/dist/components/Modal/Modal.css.d.ts.map +1 -1
- package/dist/components/Modal/Modal.css.js +0 -5
- package/dist/components/Modal/Modal.d.ts.map +1 -1
- package/dist/components/Modal/Modal.js +5 -18
- package/dist/components/Modal/stories.js +0 -5
- package/dist/components/NumberBubble/NumberBubble.css.js +0 -3
- package/dist/components/NumberBubble/NumberBubble.js +5 -9
- package/dist/components/NumberBubble/stories.js +0 -5
- package/dist/components/NumberInput/NumberInput.js +14 -20
- package/dist/components/NumberInput/stories.js +1 -28
- package/dist/components/OrderedList/OrderedList.css.js +0 -3
- package/dist/components/OrderedList/OrderedList.js +0 -4
- package/dist/components/OrderedList/stories.js +0 -5
- package/dist/components/OutsideClick/OutsideClick.js +0 -3
- package/dist/components/OutsideClick/stories.js +0 -6
- package/dist/components/OverdriveProvider/OverdriveProvider.js +0 -1
- package/dist/components/Pagination/Pagination.css.js +0 -3
- package/dist/components/Pagination/Pagination.js +0 -20
- package/dist/components/Pagination/stories.js +0 -25
- package/dist/components/Portal/Portal.js +0 -7
- package/dist/components/Portal/stories.js +0 -9
- package/dist/components/Positioner/Positioner.css.js +0 -3
- package/dist/components/Positioner/Positioner.js +7 -19
- package/dist/components/Positioner/alignment.js +0 -1
- package/dist/components/Positioner/stories.js +1 -13
- package/dist/components/ProgressBar/ProgressBar.css.js +0 -3
- package/dist/components/ProgressBar/stories.js +0 -6
- package/dist/components/ProgressBarGroup/ProgressBarGroup.css.js +0 -3
- package/dist/components/ProgressBarGroup/stories.js +0 -5
- package/dist/components/ProgressSpinner/ProgressSpinner.css.js +0 -3
- package/dist/components/ProgressSpinner/stories.js +0 -5
- package/dist/components/Radio/Radio.css.js +0 -3
- package/dist/components/Radio/Radio.js +0 -3
- package/dist/components/Radio/stories.js +8 -17
- package/dist/components/Section/Section.css.js +0 -3
- package/dist/components/Section/stories.js +0 -5
- package/dist/components/SelectInput/SelectInput.css.js +0 -3
- package/dist/components/SelectInput/SelectInput.js +10 -14
- package/dist/components/SelectInput/stories.js +1 -26
- package/dist/components/SimplePagination/SimplePagination.js +0 -4
- package/dist/components/SimplePagination/stories.js +0 -9
- package/dist/components/Stack/Divider.css.js +0 -3
- package/dist/components/Stack/Stack.css.js +0 -3
- package/dist/components/Stack/Stack.js +0 -2
- package/dist/components/Stack/stories.js +0 -11
- package/dist/components/StandardModal/StandardModal.css.js +0 -5
- package/dist/components/StandardModal/StandardModal.js +0 -4
- package/dist/components/StandardModal/stories.js +0 -5
- package/dist/components/StarRating/StarRating.css.js +0 -3
- package/dist/components/StarRating/StarRating.js +0 -12
- package/dist/components/StarRating/stories.js +0 -5
- package/dist/components/Stepper/Stepper.css.d.ts.map +1 -1
- package/dist/components/Stepper/Stepper.css.js +1 -5
- package/dist/components/Stepper/Stepper.d.ts.map +1 -1
- package/dist/components/Stepper/Stepper.js +4 -8
- package/dist/components/Stepper/stories.js +4 -12
- package/dist/components/Switch/Switch.css.js +0 -3
- package/dist/components/Switch/Switch.js +0 -1
- package/dist/components/Switch/stories.js +4 -16
- package/dist/components/Table/Table.css.js +0 -3
- package/dist/components/Table/TableCell.css.js +0 -3
- package/dist/components/Table/TableCell.js +0 -1
- package/dist/components/Table/TableHeadCell.css.js +0 -5
- package/dist/components/Table/TableHeadCell.js +0 -6
- package/dist/components/Table/stories.js +0 -7
- package/dist/components/Tabs/Tab.css.js +0 -3
- package/dist/components/Tabs/Tab.js +0 -3
- package/dist/components/Tabs/TabList.css.js +0 -3
- package/dist/components/Tabs/TabList.js +0 -7
- package/dist/components/Tabs/TabPane.css.js +0 -3
- package/dist/components/Tabs/TabPanes.css.js +0 -3
- package/dist/components/Tabs/stories.js +0 -7
- package/dist/components/Text/stories.js +0 -10
- package/dist/components/Text/useTextStyles.css.js +0 -5
- package/dist/components/TextAreaInput/TextAreaInput.js +9 -13
- package/dist/components/TextAreaInput/stories.js +1 -23
- package/dist/components/TextBubble/TextBubble.css.js +0 -3
- package/dist/components/TextBubble/TextBubble.js +5 -13
- package/dist/components/TextBubble/stories.js +0 -5
- package/dist/components/TextContainer/TextContainer.js +0 -2
- package/dist/components/TextContainer/stories.js +0 -5
- package/dist/components/TextInput/TextInput.js +9 -14
- package/dist/components/TextInput/stories.js +1 -38
- package/dist/components/TextLink/TextLink.css.js +0 -3
- package/dist/components/TextLink/TextLink.js +9 -18
- package/dist/components/TextLink/stories.js +0 -6
- package/dist/components/ThemeOverrideProvider/ThemeOverrideProvider.js +0 -3
- package/dist/components/ThemeOverrideProvider/useBuildThemeOverrides.js +7 -15
- package/dist/components/ThemeProvider/ThemeProvider.d.ts +5 -4
- package/dist/components/ThemeProvider/ThemeProvider.d.ts.map +1 -1
- package/dist/components/Toaster/Toast.css.js +0 -3
- package/dist/components/Toaster/Toast.js +0 -27
- package/dist/components/Tooltip/Tooltip.css.js +0 -5
- package/dist/components/Tooltip/Tooltip.js +0 -1
- package/dist/components/Tooltip/stories.js +0 -5
- package/dist/components/VisuallyHidden/VisuallyHidden.css.js +0 -3
- package/dist/components/VisuallyHidden/stories.js +0 -5
- package/dist/components/private/CheckableBase/CheckableBase.css.js +0 -3
- package/dist/components/private/CheckableBase/CheckableBase.js +0 -2
- package/dist/components/private/InputBase/HintText.css.js +0 -3
- package/dist/components/private/InputBase/InputState.css.js +0 -3
- package/dist/components/private/InputBase/NotchedBase.css.js +0 -6
- package/dist/components/private/InputBase/NotchedBase.js +0 -1
- package/dist/components/private/InputBase/withEnhancedInput.css.js +0 -3
- package/dist/components/private/InputBase/withEnhancedInput.js +28 -39
- package/dist/hooks/useAttachedBoxes/useAttachedBoxes.css.js +0 -3
- package/dist/hooks/useAttachedBoxes/useAttachedBoxes.js +4 -12
- package/dist/hooks/useMedia/stories.js +0 -1
- package/dist/hooks/useMedia/useMedia.js +0 -4
- package/dist/hooks/useNegativeMargin/useNegativeMarginLeft.css.js +0 -3
- package/dist/hooks/useNegativeMargin/useNegativeMarginTop.css.js +0 -3
- package/dist/hooks/useResponsiveValue/stories.js +0 -1
- package/dist/reset/globalFonts.css.js +0 -3
- package/dist/reset/globalReset.css.js +0 -3
- package/dist/reset/reset.css.js +0 -5
- package/dist/themes/base/index.d.ts +177 -177
- package/dist/themes/base/tokens.js +0 -3
- package/dist/themes/base/vars.css.js +0 -3
- package/dist/themes/flat_red/index.d.ts +177 -177
- package/dist/themes/flat_red/tokens.js +0 -3
- package/dist/themes/flat_red/vars.css.js +0 -3
- package/dist/themes/helpers.js +0 -2
- package/dist/themes/makeTheme.js +0 -3
- package/dist/themes/neutral/index.d.ts +177 -177
- package/dist/themes/neutral/tokens.js +0 -3
- package/dist/themes/neutral/vars.css.js +0 -3
- package/dist/themes/theme.css.d.ts +177 -177
- package/dist/themes/theme.css.d.ts.map +1 -1
- package/dist/themes/theme.css.js +0 -5
- package/dist/themes/tokens.d.ts +3 -1
- package/dist/themes/tokens.d.ts.map +1 -1
- package/dist/utils/index.js +0 -13
- package/dist/utils/mapTokenToProperty.js +0 -3
- package/dist/utils/resolveResponsiveProps.js +0 -6
- package/dist/utils/responsiveProps.css.js +0 -5
- package/dist/utils/responsiveStyle.d.ts +2 -2
- package/dist/utils/responsiveStyle.d.ts.map +1 -1
- package/dist/utils/responsiveStyle.js +0 -6
- package/package.json +1 -1
- package/readme.md +1 -2
|
@@ -3,23 +3,19 @@
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
5
5
|
const _excluded = ["eager", "syncDecoding", "className", "src", "srcSet"];
|
|
6
|
-
|
|
7
6
|
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; }
|
|
8
|
-
|
|
9
7
|
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; }
|
|
10
|
-
|
|
11
8
|
import * as React from 'react';
|
|
12
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
10
|
export const SimpleImage = _ref => {
|
|
14
11
|
let {
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
12
|
+
eager = 'false',
|
|
13
|
+
syncDecoding = 'false',
|
|
14
|
+
className = '',
|
|
15
|
+
src,
|
|
16
|
+
srcSet
|
|
17
|
+
} = _ref,
|
|
18
|
+
imgProps = _objectWithoutProperties(_ref, _excluded);
|
|
23
19
|
return _jsx("img", _objectSpread({
|
|
24
20
|
loading: eager ? 'eager' : 'lazy',
|
|
25
21
|
decoding: syncDecoding ? 'sync' : 'async',
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
|
|
5
4
|
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; }
|
|
6
|
-
|
|
7
5
|
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; }
|
|
8
|
-
|
|
9
6
|
import * as React from 'react';
|
|
10
7
|
import { Stack } from "../Stack/index.js";
|
|
11
8
|
import { Text } from "../Text/index.js";
|
|
@@ -54,9 +51,7 @@ export default {
|
|
|
54
51
|
}
|
|
55
52
|
}
|
|
56
53
|
};
|
|
57
|
-
|
|
58
54
|
const calcWidth = width => width === 'full' ? '100%' : widthMap[width];
|
|
59
|
-
|
|
60
55
|
const SimpleTemplate = args => _jsx("div", {
|
|
61
56
|
style: {
|
|
62
57
|
width: '100%',
|
|
@@ -66,13 +61,11 @@ const SimpleTemplate = args => _jsx("div", {
|
|
|
66
61
|
width: calcWidth(args.width)
|
|
67
62
|
}))
|
|
68
63
|
});
|
|
69
|
-
|
|
70
64
|
const standardProps = {
|
|
71
65
|
src: 'https://cdn.autoguru.com.au/images/autoguru-og.jpg'
|
|
72
66
|
};
|
|
73
67
|
export const standard = SimpleTemplate.bind(standardProps);
|
|
74
68
|
standard.args = standardProps;
|
|
75
|
-
|
|
76
69
|
const srcUrlMapper = _ref => {
|
|
77
70
|
let {
|
|
78
71
|
src,
|
|
@@ -81,7 +74,6 @@ const srcUrlMapper = _ref => {
|
|
|
81
74
|
} = _ref;
|
|
82
75
|
return "https://images.autoguru.com.au/?url=".concat(src, "&w=").concat(width, "&q=").concat(quality);
|
|
83
76
|
};
|
|
84
|
-
|
|
85
77
|
const WidthProviderTemplate = args => _jsx(ImageServerProvider, {
|
|
86
78
|
srcUrlMapper: srcUrlMapper,
|
|
87
79
|
children: _jsx("div", {
|
|
@@ -94,7 +86,6 @@ const WidthProviderTemplate = args => _jsx(ImageServerProvider, {
|
|
|
94
86
|
}))
|
|
95
87
|
})
|
|
96
88
|
});
|
|
97
|
-
|
|
98
89
|
const withImageServerUnoptimisedProps = {
|
|
99
90
|
src: 'https://cdn.autoguru.com.au/images/autoguru-test-highres-image.jpg',
|
|
100
91
|
unoptimised: true
|
|
@@ -124,7 +115,6 @@ const withResponsiveSizesProps = {
|
|
|
124
115
|
};
|
|
125
116
|
export const withResponsiveSizes = WidthProviderTemplate.bind(withResponsiveSizesProps);
|
|
126
117
|
withResponsiveSizes.args = withResponsiveSizesProps;
|
|
127
|
-
|
|
128
118
|
const AllQualityTemplate = args => _jsx(ImageServerProvider, {
|
|
129
119
|
srcUrlMapper: srcUrlMapper,
|
|
130
120
|
children: _jsx("div", {
|
|
@@ -150,10 +140,8 @@ const AllQualityTemplate = args => _jsx(ImageServerProvider, {
|
|
|
150
140
|
})
|
|
151
141
|
})
|
|
152
142
|
});
|
|
153
|
-
|
|
154
143
|
export const withImageServerQualities = AllQualityTemplate.bind(withImageServerProps);
|
|
155
144
|
withImageServerQualities.args = withImageServerProps;
|
|
156
|
-
|
|
157
145
|
const AllSizeTemplate = args => _jsx(ImageServerProvider, {
|
|
158
146
|
srcUrlMapper: srcUrlMapper,
|
|
159
147
|
children: _jsx("div", {
|
|
@@ -184,7 +172,6 @@ const AllSizeTemplate = args => _jsx(ImageServerProvider, {
|
|
|
184
172
|
})
|
|
185
173
|
})
|
|
186
174
|
});
|
|
187
|
-
|
|
188
175
|
const withImageServerResizingProps = {
|
|
189
176
|
src: 'https://cdn.autoguru.com.au/images/autoguru-test-highres-image.jpg',
|
|
190
177
|
quality: 20,
|
|
@@ -24,13 +24,11 @@ export const Inline = _ref => {
|
|
|
24
24
|
const negativeMarginLeft = useNegativeMarginLeft(space);
|
|
25
25
|
const negativeMarginTop = useNegativeMarginTop(space);
|
|
26
26
|
const items = flattenChildren(children);
|
|
27
|
-
|
|
28
27
|
if (items.length < 2) {
|
|
29
28
|
return _jsx(_Fragment, {
|
|
30
29
|
children: items
|
|
31
30
|
});
|
|
32
31
|
}
|
|
33
|
-
|
|
34
32
|
const divider = renderDivider(dividers);
|
|
35
33
|
let listItem = 'div';
|
|
36
34
|
if (typeof is === 'string') listItem = supportedListTypes.includes(is) ? 'li' : 'div';
|
|
@@ -59,21 +57,17 @@ export const Inline = _ref => {
|
|
|
59
57
|
}) : null)
|
|
60
58
|
});
|
|
61
59
|
};
|
|
62
|
-
|
|
63
60
|
const renderDivider = dividers => {
|
|
64
61
|
if (typeof dividers === 'boolean') {
|
|
65
62
|
return dividers ? _jsx(Text, {
|
|
66
63
|
children: "\u2022"
|
|
67
64
|
}) : null;
|
|
68
65
|
}
|
|
69
|
-
|
|
70
66
|
if (isValidElement(dividers)) {
|
|
71
67
|
return dividers;
|
|
72
68
|
}
|
|
73
|
-
|
|
74
69
|
return _jsx(Text, {
|
|
75
70
|
children: dividers
|
|
76
71
|
});
|
|
77
72
|
};
|
|
78
|
-
|
|
79
73
|
export default Inline;
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
|
|
5
4
|
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; }
|
|
6
|
-
|
|
7
5
|
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; }
|
|
8
|
-
|
|
9
6
|
import * as React from 'react';
|
|
10
7
|
import { scaleOptions } from "../Box/argTypes.js";
|
|
11
8
|
import { Button } from "../Button/index.js";
|
|
@@ -43,7 +40,6 @@ export default {
|
|
|
43
40
|
}
|
|
44
41
|
}
|
|
45
42
|
};
|
|
46
|
-
|
|
47
43
|
const Template = args => _jsxs(Inline, _objectSpread(_objectSpread({}, args), {}, {
|
|
48
44
|
children: [_jsx(Text, {
|
|
49
45
|
children: "Mazda"
|
|
@@ -55,7 +51,6 @@ const Template = args => _jsxs(Inline, _objectSpread(_objectSpread({}, args), {}
|
|
|
55
51
|
children: "2020"
|
|
56
52
|
})]
|
|
57
53
|
}));
|
|
58
|
-
|
|
59
54
|
const DiffSizeTemplate = args => _jsxs(Stack, {
|
|
60
55
|
children: [_jsxs(Inline, _objectSpread(_objectSpread({}, args), {}, {
|
|
61
56
|
children: [_jsx(Text, {
|
|
@@ -95,7 +90,6 @@ const DiffSizeTemplate = args => _jsxs(Stack, {
|
|
|
95
90
|
})]
|
|
96
91
|
}))]
|
|
97
92
|
});
|
|
98
|
-
|
|
99
93
|
const standardProps = {};
|
|
100
94
|
export const standard = Template.bind(standardProps);
|
|
101
95
|
standard.args = standardProps;
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
|
|
4
|
-
|
|
5
4
|
__vanilla_filescope__.setFileScope("lib/components/LinearProgressIndicator/LinearProgressIndicator.css.ts", "@autoguru/overdrive");
|
|
6
|
-
|
|
7
5
|
import { keyframes, style } from '@vanilla-extract/css';
|
|
8
6
|
import { themeContractVars as vars } from "../../themes/theme.css.js";
|
|
9
7
|
export const root = style({
|
|
@@ -58,5 +56,4 @@ export const linearProgressBarInner = style({
|
|
|
58
56
|
animationIterationCount: 'infinite',
|
|
59
57
|
animationName: layerTwoAnim
|
|
60
58
|
}, "linearProgressBarInner");
|
|
61
|
-
|
|
62
59
|
__vanilla_filescope__.endFileScope();
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
|
|
5
4
|
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; }
|
|
6
|
-
|
|
7
5
|
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; }
|
|
8
|
-
|
|
9
6
|
import * as React from 'react';
|
|
10
7
|
import { LinearProgressIndicator } from "./index.js";
|
|
11
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -25,7 +22,5 @@ export default {
|
|
|
25
22
|
}
|
|
26
23
|
}
|
|
27
24
|
};
|
|
28
|
-
|
|
29
25
|
const Template = args => _jsx(LinearProgressIndicator, _objectSpread({}, args));
|
|
30
|
-
|
|
31
26
|
export const standard = Template.bind({});
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
|
|
4
|
-
|
|
5
4
|
__vanilla_filescope__.setFileScope("lib/components/LoadingBox/LoadingBox.css.ts", "@autoguru/overdrive");
|
|
6
|
-
|
|
7
5
|
import { keyframes, style } from '@vanilla-extract/css';
|
|
8
6
|
import { themeContractVars as vars } from "../../themes/theme.css.js";
|
|
9
7
|
export const root = style({
|
|
@@ -26,5 +24,4 @@ export const blinking = style({
|
|
|
26
24
|
animationIterationCount: 'infinite',
|
|
27
25
|
animationName: blinker
|
|
28
26
|
}, "blinking");
|
|
29
|
-
|
|
30
27
|
__vanilla_filescope__.endFileScope();
|
|
@@ -3,26 +3,22 @@
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
5
5
|
const _excluded = ["className", "randomWidth", "blinking", "backgroundColour", "display", "is"];
|
|
6
|
-
|
|
7
6
|
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; }
|
|
8
|
-
|
|
9
7
|
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; }
|
|
10
|
-
|
|
11
8
|
import * as React from 'react';
|
|
12
9
|
import { Box } from "../Box/index.js";
|
|
13
10
|
import * as styles from "./LoadingBox.css.js";
|
|
14
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
12
|
export const LoadingBox = _ref => {
|
|
16
13
|
let {
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
14
|
+
className = '',
|
|
15
|
+
randomWidth = false,
|
|
16
|
+
blinking = true,
|
|
17
|
+
backgroundColour = 'gray200',
|
|
18
|
+
display = 'block',
|
|
19
|
+
is = 'span'
|
|
20
|
+
} = _ref,
|
|
21
|
+
boxStyles = _objectWithoutProperties(_ref, _excluded);
|
|
26
22
|
return _jsx(Box, _objectSpread(_objectSpread({
|
|
27
23
|
is: is,
|
|
28
24
|
display: display,
|
|
@@ -35,7 +31,5 @@ export const LoadingBox = _ref => {
|
|
|
35
31
|
}
|
|
36
32
|
}));
|
|
37
33
|
};
|
|
38
|
-
|
|
39
34
|
const getRandomIntWidth = (max, min) => "".concat(Math.random() * (max - min) + min, "%");
|
|
40
|
-
|
|
41
35
|
export default LoadingBox;
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
|
|
5
4
|
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; }
|
|
6
|
-
|
|
7
5
|
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; }
|
|
8
|
-
|
|
9
6
|
import * as React from 'react';
|
|
10
7
|
import { boxArgTypes } from "../Box/argTypes.js";
|
|
11
8
|
import { LoadingBox } from "./index.js";
|
|
@@ -28,9 +25,7 @@ export default {
|
|
|
28
25
|
},
|
|
29
26
|
argTypes: boxArgTypes
|
|
30
27
|
};
|
|
31
|
-
|
|
32
28
|
const Template = args => _jsx(LoadingBox, _objectSpread({}, args));
|
|
33
|
-
|
|
34
29
|
const standardProps = {};
|
|
35
30
|
export const standard = Template.bind(standardProps);
|
|
36
31
|
standard.args = standardProps;
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
|
|
4
|
-
|
|
5
4
|
__vanilla_filescope__.setFileScope("lib/components/Meta/Meta.css.ts", "@autoguru/overdrive");
|
|
6
|
-
|
|
7
5
|
import { styleVariants } from '@vanilla-extract/css';
|
|
8
6
|
import { themeContractVars as vars } from "../../themes/theme.css.js";
|
|
9
7
|
export const variant = styleVariants({
|
|
@@ -14,5 +12,4 @@ export const variant = styleVariants({
|
|
|
14
12
|
color: vars.typography.colour.dark
|
|
15
13
|
}
|
|
16
14
|
}, "variant");
|
|
17
|
-
|
|
18
15
|
__vanilla_filescope__.endFileScope();
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
|
|
5
4
|
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; }
|
|
6
|
-
|
|
7
5
|
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; }
|
|
8
|
-
|
|
9
6
|
import { AccountEditIcon, AlertCircleIcon, CalendarIcon, CarMultipleIcon, CurrencyUsdIcon, PlusIcon, StarIcon } from '@autoguru/icons';
|
|
10
7
|
import * as React from 'react';
|
|
11
8
|
import { Meta } from "./index.js";
|
|
@@ -31,9 +28,7 @@ export default {
|
|
|
31
28
|
}
|
|
32
29
|
}
|
|
33
30
|
};
|
|
34
|
-
|
|
35
31
|
const Template = args => _jsx(Meta, _objectSpread({}, args));
|
|
36
|
-
|
|
37
32
|
const standardProps = {
|
|
38
33
|
variant: 'primary',
|
|
39
34
|
icon: CalendarIcon,
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
|
|
4
|
-
|
|
5
4
|
__vanilla_filescope__.setFileScope("lib/components/MinimalModal/MinimalModal.css.ts", "@autoguru/overdrive");
|
|
6
|
-
|
|
7
5
|
import { style } from '@vanilla-extract/css';
|
|
8
6
|
export const container = style({
|
|
9
7
|
outline: '0'
|
|
@@ -14,5 +12,4 @@ export const content = style({
|
|
|
14
12
|
webkitOverflowScrolling: 'touch',
|
|
15
13
|
'-webkit-overflow-scrolling': 'touch'
|
|
16
14
|
}, "content");
|
|
17
|
-
|
|
18
15
|
__vanilla_filescope__.endFileScope();
|
|
@@ -24,7 +24,6 @@ export const MinimalModal = _ref => {
|
|
|
24
24
|
if (locked.current || event.target !== event.currentTarget) return;
|
|
25
25
|
if (typeof onRequestClose === 'function') onRequestClose('backdrop');
|
|
26
26
|
});
|
|
27
|
-
|
|
28
27
|
if (isBrowser) {
|
|
29
28
|
useLayoutEffect(() => {
|
|
30
29
|
document.body.style.overflow = isOpen ? 'hidden' : '';
|
|
@@ -33,7 +32,6 @@ export const MinimalModal = _ref => {
|
|
|
33
32
|
};
|
|
34
33
|
}, [isOpen]);
|
|
35
34
|
}
|
|
36
|
-
|
|
37
35
|
return _jsx(Modal, {
|
|
38
36
|
isOpen: isOpen,
|
|
39
37
|
onRequestClose: onRequestClose,
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
|
|
5
4
|
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; }
|
|
6
|
-
|
|
7
5
|
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; }
|
|
8
|
-
|
|
9
6
|
import { action } from '@storybook/addon-actions';
|
|
10
7
|
import * as React from 'react';
|
|
11
8
|
import { Box } from "../Box/index.js";
|
|
@@ -31,7 +28,6 @@ export default {
|
|
|
31
28
|
}
|
|
32
29
|
}
|
|
33
30
|
};
|
|
34
|
-
|
|
35
31
|
const Template = args => _jsxs(_Fragment, {
|
|
36
32
|
children: [_jsx(MinimalModal, _objectSpread(_objectSpread({}, args), {}, {
|
|
37
33
|
children: _jsxs(Box, {
|
|
@@ -60,7 +56,6 @@ const Template = args => _jsxs(_Fragment, {
|
|
|
60
56
|
children: "Nulla condimentum iaculis nisi, quis lobortis ligula. Nulla tempus semper velit, id ullamcorper orci molestie vel. Sed maximus nisi ac risus malesuada, quis varius purus interdum. Donec volutpat dolor in euismod hendrerit. Integer posuere tortor sit amet turpis viverra euismod. Mauris scelerisque ex diam, eget sodales erat accumsan vel. Etiam interdum odio a tortor fermentum, molestie interdum tellus bibendum. Vivamus vitae pulvinar ante. Aenean convallis aliquam velit congue ultricies. Aenean vel blandit erat. Mauris quis auctor nibh. Morbi dui ipsum, lobortis non nisi vitae, convallis pulvinar nunc."
|
|
61
57
|
})]
|
|
62
58
|
});
|
|
63
|
-
|
|
64
59
|
const standardProps = {
|
|
65
60
|
isOpen: true,
|
|
66
61
|
onRequestClose: action('onChange')
|
|
@@ -68,27 +63,21 @@ const standardProps = {
|
|
|
68
63
|
export const Standard = Template.bind(standardProps);
|
|
69
64
|
Standard.args = standardProps;
|
|
70
65
|
Standard.argTypes = argTypes;
|
|
71
|
-
|
|
72
66
|
const pinnedToTopProps = _objectSpread(_objectSpread({}, standardProps), {}, {
|
|
73
67
|
alignItems: 'flexStart'
|
|
74
68
|
});
|
|
75
|
-
|
|
76
69
|
export const PinnedToTop = Template.bind(pinnedToTopProps);
|
|
77
70
|
PinnedToTop.args = pinnedToTopProps;
|
|
78
71
|
PinnedToTop.argTypes = argTypes;
|
|
79
|
-
|
|
80
72
|
const pinnedToTopCentreProps = _objectSpread(_objectSpread({}, standardProps), {}, {
|
|
81
73
|
alignItems: 'center'
|
|
82
74
|
});
|
|
83
|
-
|
|
84
75
|
export const pinnedToTopCentre = Template.bind(pinnedToTopCentreProps);
|
|
85
76
|
pinnedToTopCentre.args = pinnedToTopCentreProps;
|
|
86
77
|
pinnedToTopCentre.argTypes = argTypes;
|
|
87
|
-
|
|
88
78
|
const pinnedToTopBottomProps = _objectSpread(_objectSpread({}, standardProps), {}, {
|
|
89
79
|
alignItems: 'flexEnd'
|
|
90
80
|
});
|
|
91
|
-
|
|
92
81
|
export const pinnedToTopBottom = Template.bind(pinnedToTopBottomProps);
|
|
93
82
|
pinnedToTopBottom.args = pinnedToTopBottomProps;
|
|
94
83
|
pinnedToTopBottom.argTypes = argTypes;
|
|
@@ -1 +1 @@
|
|
|
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,
|
|
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,sCAanB,CAAC"}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
|
|
4
|
-
|
|
5
4
|
__vanilla_filescope__.setFileScope("lib/components/Modal/Modal.css.ts", "@autoguru/overdrive");
|
|
6
|
-
|
|
7
5
|
import { style, styleVariants } from '@vanilla-extract/css';
|
|
8
6
|
import { themeContractVars as vars } from "../../themes/theme.css.js";
|
|
9
7
|
export const root = style({
|
|
@@ -31,14 +29,11 @@ export const backdrop = styleVariants({
|
|
|
31
29
|
bottom: 0,
|
|
32
30
|
left: 0,
|
|
33
31
|
zIndex: 999,
|
|
34
|
-
backgroundColor: vars.colours.intent.neutral.background.standard,
|
|
35
32
|
opacity: 0.75,
|
|
36
33
|
backdropFilter: 'blur(5px)'
|
|
37
34
|
},
|
|
38
35
|
invisible: {
|
|
39
|
-
backgroundColor: 'transparent',
|
|
40
36
|
backdropFilter: 'none'
|
|
41
37
|
}
|
|
42
38
|
}, "backdrop");
|
|
43
|
-
|
|
44
39
|
__vanilla_filescope__.endFileScope();
|
|
@@ -1 +1 @@
|
|
|
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,
|
|
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,CAuE1C,CAAC;AAEF,eAAO,MAAM,SAAS,wIAmBpB,CAAC;AAEH,eAAe,KAAK,CAAC"}
|
|
@@ -3,11 +3,8 @@
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
5
5
|
const _excluded = ["onRequestClose", "isOpen"];
|
|
6
|
-
|
|
7
6
|
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; }
|
|
8
|
-
|
|
9
7
|
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; }
|
|
10
|
-
|
|
11
8
|
import { warning } from '@autoguru/utilities';
|
|
12
9
|
import * as React from 'react';
|
|
13
10
|
import { useEffect, useReducer } from 'react';
|
|
@@ -18,7 +15,6 @@ import { Portal } from "../Portal/index.js";
|
|
|
18
15
|
import * as styles from "./Modal.css.js";
|
|
19
16
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
20
17
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
21
|
-
|
|
22
18
|
const reducer = (prevState, action) => {
|
|
23
19
|
switch (action) {
|
|
24
20
|
case 'OPEN_MODAL':
|
|
@@ -30,12 +26,10 @@ const reducer = (prevState, action) => {
|
|
|
30
26
|
{
|
|
31
27
|
return 'OPENING';
|
|
32
28
|
}
|
|
33
|
-
|
|
34
29
|
default:
|
|
35
30
|
return prevState;
|
|
36
31
|
}
|
|
37
32
|
}
|
|
38
|
-
|
|
39
33
|
case 'CLOSE_MODAL':
|
|
40
34
|
{
|
|
41
35
|
switch (prevState) {
|
|
@@ -44,12 +38,10 @@ const reducer = (prevState, action) => {
|
|
|
44
38
|
{
|
|
45
39
|
return 'CLOSING';
|
|
46
40
|
}
|
|
47
|
-
|
|
48
41
|
default:
|
|
49
42
|
return prevState;
|
|
50
43
|
}
|
|
51
44
|
}
|
|
52
|
-
|
|
53
45
|
case 'ANIMATION_COMPLETE':
|
|
54
46
|
{
|
|
55
47
|
switch (prevState) {
|
|
@@ -57,22 +49,18 @@ const reducer = (prevState, action) => {
|
|
|
57
49
|
{
|
|
58
50
|
return 'CLOSED';
|
|
59
51
|
}
|
|
60
|
-
|
|
61
52
|
case 'OPENING':
|
|
62
53
|
{
|
|
63
54
|
return 'OPEN';
|
|
64
55
|
}
|
|
65
|
-
|
|
66
56
|
default:
|
|
67
57
|
return prevState;
|
|
68
58
|
}
|
|
69
59
|
}
|
|
70
|
-
|
|
71
60
|
default:
|
|
72
61
|
return prevState;
|
|
73
62
|
}
|
|
74
63
|
};
|
|
75
|
-
|
|
76
64
|
export const Modal = _ref => {
|
|
77
65
|
let {
|
|
78
66
|
isOpen,
|
|
@@ -95,7 +83,6 @@ export const Modal = _ref => {
|
|
|
95
83
|
}, 300);
|
|
96
84
|
return () => clearTimeout(timer);
|
|
97
85
|
}
|
|
98
|
-
|
|
99
86
|
return undefined;
|
|
100
87
|
}, [state]);
|
|
101
88
|
return _jsx(Portal, {
|
|
@@ -110,6 +97,7 @@ export const Modal = _ref => {
|
|
|
110
97
|
position: "fixed",
|
|
111
98
|
pointerEvents: state === 'CLOSING' ? 'none' : undefined,
|
|
112
99
|
opacity: state === 'OPEN' ? undefined : 0,
|
|
100
|
+
backgroundColour: hideBackdrop ? 'transparent' : 'neutral',
|
|
113
101
|
className: [styles.backdrop.root, styles.transition, hideBackdrop && styles.backdrop.invisible],
|
|
114
102
|
onClick: handleBackdropClick
|
|
115
103
|
}), _jsx(Box, {
|
|
@@ -125,11 +113,10 @@ export const Modal = _ref => {
|
|
|
125
113
|
};
|
|
126
114
|
export const withModal = WrappedComponent => _ref2 => {
|
|
127
115
|
let {
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
116
|
+
onRequestClose,
|
|
117
|
+
isOpen
|
|
118
|
+
} = _ref2,
|
|
119
|
+
rest = _objectWithoutProperties(_ref2, _excluded);
|
|
133
120
|
process.env.NODE_ENV !== "production" ? warning(false, 'Using withModal is now an anti-pattern. Use <Modal /> instead') : void 0;
|
|
134
121
|
return _jsx(Modal, {
|
|
135
122
|
isOpen: isOpen,
|
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
|
|
5
4
|
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; }
|
|
6
|
-
|
|
7
5
|
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; }
|
|
8
|
-
|
|
9
6
|
import { action } from '@storybook/addon-actions';
|
|
10
7
|
import * as React from 'react';
|
|
11
8
|
import { Box } from "../Box/index.js";
|
|
@@ -23,7 +20,6 @@ export default {
|
|
|
23
20
|
}
|
|
24
21
|
}
|
|
25
22
|
};
|
|
26
|
-
|
|
27
23
|
const Template = args => _jsxs(_Fragment, {
|
|
28
24
|
children: [_jsx(Modal, _objectSpread(_objectSpread({}, args), {}, {
|
|
29
25
|
children: _jsx(Box, {
|
|
@@ -48,7 +44,6 @@ const Template = args => _jsxs(_Fragment, {
|
|
|
48
44
|
children: "Nunc ac congue lacus, ac vulputate lectus. Suspendisse vel malesuada tellus. In nec fringilla elit. Cras vitae metus et leo convallis consectetur. Cras quis congue sapien, vitae aliquet ante. Integer sed lorem pretium, vestibulum arcu eu, imperdiet mauris. Nam blandit pharetra feugiat. Maecenas eget ante metus. Vivamus pretium ipsum justo, a faucibus ex dictum non. Vestibulum et dui diam."
|
|
49
45
|
})]
|
|
50
46
|
});
|
|
51
|
-
|
|
52
47
|
const standardProps = {
|
|
53
48
|
isOpen: true,
|
|
54
49
|
onRequestClose: action('onRequestClose')
|
|
@@ -1,14 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
|
|
4
|
-
|
|
5
4
|
__vanilla_filescope__.setFileScope("lib/components/NumberBubble/NumberBubble.css.ts", "@autoguru/overdrive");
|
|
6
|
-
|
|
7
5
|
import { style } from '@vanilla-extract/css';
|
|
8
6
|
export const bubbleText = style({
|
|
9
7
|
top: '50%',
|
|
10
8
|
left: '50%',
|
|
11
9
|
transform: 'translate(-50%, -50%)'
|
|
12
10
|
}, "bubbleText");
|
|
13
|
-
|
|
14
11
|
__vanilla_filescope__.endFileScope();
|
|
@@ -3,11 +3,8 @@
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
5
5
|
const _excluded = ["value", "textColour", "rawNumbers"];
|
|
6
|
-
|
|
7
6
|
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; }
|
|
8
|
-
|
|
9
7
|
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; }
|
|
10
|
-
|
|
11
8
|
import clsx from 'clsx';
|
|
12
9
|
import * as React from 'react';
|
|
13
10
|
import { useMemo } from 'react';
|
|
@@ -24,12 +21,11 @@ const valuePaddingMap = {
|
|
|
24
21
|
};
|
|
25
22
|
export const NumberBubble = _ref => {
|
|
26
23
|
let {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
24
|
+
value,
|
|
25
|
+
textColour = 'white',
|
|
26
|
+
rawNumbers = false
|
|
27
|
+
} = _ref,
|
|
28
|
+
boxProps = _objectWithoutProperties(_ref, _excluded);
|
|
33
29
|
const size = useMemo(() => {
|
|
34
30
|
if (value > 9 && value < 100) return 'MEDIUM';
|
|
35
31
|
if (value > 99 && value < 9999) return 'LARGE';
|