@autoguru/overdrive 4.33.1 → 4.35.0

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.
Files changed (218) hide show
  1. package/dist/components/Alert/Alert.js +1 -2
  2. package/dist/components/Anchor/Anchor.js +3 -4
  3. package/dist/components/AutoSuggest/AutoSuggest.css.js +3 -3
  4. package/dist/components/AutoSuggest/AutoSuggest.d.ts.map +1 -1
  5. package/dist/components/AutoSuggest/AutoSuggest.js +8 -9
  6. package/dist/components/Box/Box.js +2 -2
  7. package/dist/components/Box/argTypes.d.ts.map +1 -1
  8. package/dist/components/Box/argTypes.js +2 -2
  9. package/dist/components/Box/useBoxStyles.css.d.ts +1 -1
  10. package/dist/components/Box/useBoxStyles.css.d.ts.map +1 -1
  11. package/dist/components/Box/useBoxStyles.css.js +5 -11
  12. package/dist/components/BulletList/Bullet.css.js +3 -3
  13. package/dist/components/BulletList/Bullet.d.ts.map +1 -1
  14. package/dist/components/BulletList/Bullet.js +12 -4
  15. package/dist/components/BulletText/BulletText.js +1 -2
  16. package/dist/components/Button/Button.css.js +21 -21
  17. package/dist/components/Button/Button.js +3 -5
  18. package/dist/components/CheckBox/CheckBox.css.js +3 -3
  19. package/dist/components/CheckBox/CheckBox.js +1 -2
  20. package/dist/components/ColourInput/ColourInput.css.js +2 -2
  21. package/dist/components/ColourInput/ColourInput.js +3 -4
  22. package/dist/components/Columns/Column.css.js +1 -1
  23. package/dist/components/Columns/Column.js +2 -2
  24. package/dist/components/Columns/Columns.js +2 -2
  25. package/dist/components/DateInput/DateInput.js +2 -2
  26. package/dist/components/DatePicker/DatePicker.js +3 -4
  27. package/dist/components/DividerLine/DividerLine.d.ts +1 -1
  28. package/dist/components/DividerLine/DividerLine.d.ts.map +1 -1
  29. package/dist/components/DividerLine/DividerLine.js +1 -1
  30. package/dist/components/DropDown/DropDown.js +3 -5
  31. package/dist/components/DropDown/DropDownOption.css.js +2 -2
  32. package/dist/components/DropDown/DropDownOption.js +3 -4
  33. package/dist/components/EditableText/EditableText.css.js +1 -1
  34. package/dist/components/EditableText/EditableText.d.ts.map +1 -1
  35. package/dist/components/EditableText/EditableText.js +5 -6
  36. package/dist/components/FillHeightBox/FillHeightBox.js +2 -2
  37. package/dist/components/Flyout/Flyout.js +2 -2
  38. package/dist/components/HorizontalAutoScroller/HorizontalAutoScroller.css.js +1 -1
  39. package/dist/components/HorizontalAutoScroller/HorizontalAutoScroller.d.ts +1 -1
  40. package/dist/components/HorizontalAutoScroller/HorizontalAutoScroller.d.ts.map +1 -1
  41. package/dist/components/HorizontalAutoScroller/HorizontalAutoScroller.js +5 -7
  42. package/dist/components/HorizontalAutoScroller/useHorizontalAutoScroller.d.ts.map +1 -1
  43. package/dist/components/HorizontalAutoScroller/useHorizontalAutoScroller.js +5 -9
  44. package/dist/components/Image/Image.js +2 -2
  45. package/dist/components/Image/ImageServerProvider.js +9 -8
  46. package/dist/components/Image/ResponsiveImage.js +2 -2
  47. package/dist/components/Image/SimpleImage.js +2 -2
  48. package/dist/components/Inline/Inline.js +1 -3
  49. package/dist/components/LoadingBox/LoadingBox.js +3 -3
  50. package/dist/components/Meta/Meta.js +2 -3
  51. package/dist/components/MinimalModal/MinimalModal.js +2 -2
  52. package/dist/components/Modal/Modal.css.js +1 -1
  53. package/dist/components/Modal/Modal.d.ts.map +1 -1
  54. package/dist/components/Modal/Modal.js +16 -9
  55. package/dist/components/NumberBubble/NumberBubble.js +2 -2
  56. package/dist/components/NumberInput/NumberInput.js +3 -3
  57. package/dist/components/OrderedList/OrderedList.css.js +1 -1
  58. package/dist/components/OutsideClick/OutsideClick.js +1 -1
  59. package/dist/components/Pagination/Pagination.css.js +6 -6
  60. package/dist/components/Pagination/Pagination.js +1 -2
  61. package/dist/components/Positioner/Positioner.d.ts.map +1 -1
  62. package/dist/components/Positioner/Positioner.js +17 -7
  63. package/dist/components/Positioner/alignment.js +3 -3
  64. package/dist/components/ProgressBar/ProgressBar.css.js +1 -1
  65. package/dist/components/ProgressBar/ProgressBar.js +1 -1
  66. package/dist/components/ProgressBarGroup/ProgressBarGroup.css.js +1 -1
  67. package/dist/components/ProgressBarGroup/ProgressBarGroup.js +2 -3
  68. package/dist/components/Radio/Radio.css.js +4 -4
  69. package/dist/components/Radio/Radio.js +1 -2
  70. package/dist/components/ScrollPane/ScrollPane.css.js +3 -3
  71. package/dist/components/ScrollPane/ScrollPane.js +2 -2
  72. package/dist/components/SelectInput/SelectInput.css.js +3 -3
  73. package/dist/components/SelectInput/SelectInput.d.ts +1 -1
  74. package/dist/components/SelectInput/SelectInput.d.ts.map +1 -1
  75. package/dist/components/SelectInput/SelectInput.js +5 -5
  76. package/dist/components/SimplePagination/SimplePagination.js +4 -5
  77. package/dist/components/SliderProgress/ProgressStep.js +1 -2
  78. package/dist/components/SliderProgress/SliderProgress.css.js +1 -1
  79. package/dist/components/SliderProgress/SliderProgress.js +1 -1
  80. package/dist/components/Stack/Divider.css.js +1 -1
  81. package/dist/components/Stack/Stack.js +1 -3
  82. package/dist/components/StandardModal/StandardModal.css.js +8 -8
  83. package/dist/components/StandardModal/StandardModal.js +4 -5
  84. package/dist/components/StarRating/StarRating.js +7 -8
  85. package/dist/components/Stepper/Stepper.css.js +4 -4
  86. package/dist/components/Stepper/Stepper.d.ts.map +1 -1
  87. package/dist/components/Stepper/Stepper.js +19 -10
  88. package/dist/components/StickyBox/StickyBox.css.js +4 -4
  89. package/dist/components/StickyBox/StickyBox.js +3 -3
  90. package/dist/components/Switch/Switch.css.js +18 -18
  91. package/dist/components/Switch/Switch.js +4 -5
  92. package/dist/components/Table/TableCell.css.js +1 -1
  93. package/dist/components/Table/TableHeadCell.css.js +5 -5
  94. package/dist/components/Table/TableHeadCell.js +1 -2
  95. package/dist/components/Tabs/Tab.css.js +4 -4
  96. package/dist/components/Tabs/Tab.js +2 -3
  97. package/dist/components/Tabs/TabList.css.js +1 -1
  98. package/dist/components/Tabs/TabList.js +1 -2
  99. package/dist/components/Tabs/TabPane.js +1 -1
  100. package/dist/components/Text/useTextStyles.css.js +2 -2
  101. package/dist/components/TextAreaInput/TextAreaInput.js +2 -2
  102. package/dist/components/TextBubble/TextBubble.d.ts.map +1 -1
  103. package/dist/components/TextBubble/TextBubble.js +14 -6
  104. package/dist/components/TextContainer/TextContainer.js +1 -2
  105. package/dist/components/TextInput/TextInput.js +2 -2
  106. package/dist/components/TextLink/TextLink.css.js +4 -4
  107. package/dist/components/TextLink/TextLink.js +3 -4
  108. package/dist/components/ThemeOverrideProvider/ThemeOverrideDebugger.js +1 -2
  109. package/dist/components/ThemeOverrideProvider/ThemeOverrideProvider.js +2 -2
  110. package/dist/components/ThemeOverrideProvider/useBuildThemeOverrides.d.ts.map +1 -1
  111. package/dist/components/ThemeOverrideProvider/useBuildThemeOverrides.js +5 -3
  112. package/dist/components/Toaster/Toast.css.js +1 -1
  113. package/dist/components/Toaster/Toast.d.ts.map +1 -1
  114. package/dist/components/Toaster/Toast.js +24 -20
  115. package/dist/components/Tooltip/Tooltip.css.js +2 -2
  116. package/dist/components/Tooltip/Tooltip.js +1 -3
  117. package/dist/components/private/CheckableBase/CheckableBase.css.js +8 -8
  118. package/dist/components/private/CheckableBase/CheckableBase.js +1 -2
  119. package/dist/components/private/InputBase/HintText.css.js +1 -1
  120. package/dist/components/private/InputBase/NotchedBase.css.js +20 -20
  121. package/dist/components/private/InputBase/NotchedBase.js +1 -2
  122. package/dist/components/private/InputBase/withEnhancedInput.css.js +16 -16
  123. package/dist/components/private/InputBase/withEnhancedInput.d.ts.map +1 -1
  124. package/dist/components/private/InputBase/withEnhancedInput.js +3 -4
  125. package/dist/hooks/useAttachedBoxes/useAttachedBoxes.d.ts +1 -1
  126. package/dist/hooks/useAttachedBoxes/useAttachedBoxes.d.ts.map +1 -1
  127. package/dist/hooks/useAttachedBoxes/useAttachedBoxes.js +5 -5
  128. package/dist/hooks/useMedia/useMedia.js +4 -4
  129. package/dist/hooks/useNegativeMargin/useNegativeMarginLeft.css.js +2 -2
  130. package/dist/hooks/useNegativeMargin/useNegativeMarginTop.css.js +1 -1
  131. package/dist/hooks/useNullCheck/useNullCheck.js +1 -1
  132. package/dist/hooks/useWindowHeightFill/useWindowHeightFill.d.ts.map +1 -1
  133. package/dist/hooks/useWindowHeightFill/useWindowHeightFill.js +4 -3
  134. package/dist/reset/globalFonts.css.js +3 -3
  135. package/dist/reset/reset.css.js +2 -2
  136. package/dist/themes/base/tokens.js +3 -3
  137. package/dist/themes/flat_red/tokens.js +2 -2
  138. package/dist/themes/helpers.d.ts.map +1 -1
  139. package/dist/themes/helpers.js +2 -2
  140. package/dist/themes/makeTheme.js +3 -3
  141. package/dist/themes/neutral/tokens.js +3 -3
  142. package/dist/themes/theme.css.js +2 -2
  143. package/dist/utils/css.js +1 -1
  144. package/dist/utils/index.d.ts +1 -1
  145. package/dist/utils/index.d.ts.map +1 -1
  146. package/dist/utils/index.js +6 -5
  147. package/dist/utils/mapTokenToProperty.js +2 -2
  148. package/dist/utils/number.js +1 -1
  149. package/dist/utils/responsiveProps.css.d.ts.map +1 -1
  150. package/dist/utils/responsiveProps.css.js +2 -2
  151. package/dist/utils/responsiveStyle.js +3 -3
  152. package/package.json +118 -26
  153. package/dist/components/Actions/stories.js +0 -53
  154. package/dist/components/Alert/stories.js +0 -106
  155. package/dist/components/Anchor/stories.js +0 -65
  156. package/dist/components/AutoSuggest/stories.js +0 -213
  157. package/dist/components/Badge/stories.js +0 -64
  158. package/dist/components/Box/stories.js +0 -43
  159. package/dist/components/BulletList/stories.js +0 -72
  160. package/dist/components/BulletText/stories.js +0 -88
  161. package/dist/components/Button/stories.js +0 -291
  162. package/dist/components/CheckBox/stories.js +0 -206
  163. package/dist/components/ColourInput/stories.js +0 -173
  164. package/dist/components/Columns/stories.js +0 -209
  165. package/dist/components/DateInput/stories.js +0 -181
  166. package/dist/components/DatePicker/stories.js +0 -89
  167. package/dist/components/DividerLine/stories.js +0 -117
  168. package/dist/components/DropDown/stories.js +0 -117
  169. package/dist/components/EditableText/stories.js +0 -84
  170. package/dist/components/FillHeightBox/stories.js +0 -47
  171. package/dist/components/Flyout/stories.js +0 -88
  172. package/dist/components/Heading/stories.js +0 -127
  173. package/dist/components/HorizontalAutoScroller/stories.js +0 -88
  174. package/dist/components/Icon/stories.js +0 -62
  175. package/dist/components/Image/stories.js +0 -183
  176. package/dist/components/Inline/stories.js +0 -122
  177. package/dist/components/IntentStripe/stories.js +0 -76
  178. package/dist/components/LinearProgressIndicator/stories.js +0 -26
  179. package/dist/components/LoadingBox/stories.js +0 -41
  180. package/dist/components/Meta/stories.js +0 -45
  181. package/dist/components/MinimalModal/stories.js +0 -83
  182. package/dist/components/Modal/stories.js +0 -52
  183. package/dist/components/NumberBubble/stories.js +0 -23
  184. package/dist/components/NumberInput/stories.js +0 -218
  185. package/dist/components/OrderedList/stories.js +0 -58
  186. package/dist/components/OutsideClick/stories.js +0 -39
  187. package/dist/components/Pagination/stories.js +0 -112
  188. package/dist/components/Portal/stories.js +0 -72
  189. package/dist/components/Positioner/stories.js +0 -124
  190. package/dist/components/ProgressBar/stories.js +0 -44
  191. package/dist/components/ProgressBarGroup/stories.js +0 -21
  192. package/dist/components/ProgressSpinner/stories.js +0 -36
  193. package/dist/components/Radio/stories.js +0 -215
  194. package/dist/components/ScrollPane/stories.js +0 -55
  195. package/dist/components/Section/stories.js +0 -43
  196. package/dist/components/SelectInput/stories.js +0 -188
  197. package/dist/components/SimplePagination/stories.js +0 -42
  198. package/dist/components/SliderProgress/stories.js +0 -44
  199. package/dist/components/Stack/stories.js +0 -75
  200. package/dist/components/StandardModal/stories.js +0 -62
  201. package/dist/components/StarRating/stories.js +0 -50
  202. package/dist/components/Stepper/stories.js +0 -61
  203. package/dist/components/StickyBox/stories.js +0 -70
  204. package/dist/components/Switch/stories.js +0 -42
  205. package/dist/components/Table/stories.js +0 -302
  206. package/dist/components/Tabs/stories.js +0 -253
  207. package/dist/components/Text/stories.js +0 -154
  208. package/dist/components/TextAreaInput/stories.js +0 -129
  209. package/dist/components/TextBubble/stories.js +0 -30
  210. package/dist/components/TextContainer/stories.js +0 -128
  211. package/dist/components/TextInput/stories.js +0 -260
  212. package/dist/components/TextLink/stories.js +0 -111
  213. package/dist/components/Toaster/stories.js +0 -59
  214. package/dist/components/Tooltip/stories.js +0 -90
  215. package/dist/components/VisuallyHidden/stories.js +0 -36
  216. package/dist/hooks/useAttachedBoxes/stories.js +0 -94
  217. package/dist/hooks/useMedia/stories.js +0 -46
  218. package/dist/hooks/useResponsiveValue/stories.js +0 -38
@@ -1,21 +0,0 @@
1
- "use strict";
2
-
3
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
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; }
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; }
6
- import * as React from 'react';
7
- import { ProgressBarGroup } from "./index.js";
8
- import { jsx as _jsx } from "react/jsx-runtime";
9
- export default {
10
- title: 'Components/Progress/ProgressBarGroup',
11
- component: ProgressBarGroup
12
- };
13
- const Template = args => _jsx(ProgressBarGroup, _objectSpread({}, args));
14
- const values = [48, 16, 24, 0, 3];
15
- const standardProps = {
16
- values,
17
- prefixLabels: ['5 star', '4 star', '3 star', '2 star', '1 star'],
18
- suffixLabels: values.map(item => item.toString())
19
- };
20
- export const standard = Template.bind(standardProps);
21
- standard.args = standardProps;
@@ -1,36 +0,0 @@
1
- "use strict";
2
-
3
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
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; }
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; }
6
- import * as React from 'react';
7
- import { ProgressSpinner } from "./index.js";
8
- import { jsx as _jsx } from "react/jsx-runtime";
9
- export default {
10
- title: 'Components/Progress/Spinner',
11
- component: ProgressSpinner,
12
- decorators: [story => _jsx("div", {
13
- style: {
14
- width: '100%',
15
- height: '100%',
16
- flexDirection: 'row',
17
- display: 'flex',
18
- alignItems: 'center',
19
- justifyContent: 'center'
20
- },
21
- children: story()
22
- })],
23
- parameters: {
24
- chromatic: {
25
- disable: true
26
- }
27
- }
28
- };
29
- export const Standard = () => _jsx(ProgressSpinner, {
30
- colour: "primary",
31
- size: "medium"
32
- });
33
- const Template = args => _jsx(ProgressSpinner, _objectSpread({}, args));
34
- const standardProps = {};
35
- export const standard = Template.bind(standardProps);
36
- standard.args = standardProps;
@@ -1,215 +0,0 @@
1
- "use strict";
2
-
3
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
4
- import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
5
- const _excluded = ["value", "children"],
6
- _excluded2 = ["value"];
7
- 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
- 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; }
9
- import * as React from 'react';
10
- import { Badge } from "../Badge/index.js";
11
- import { Heading } from "../Heading/index.js";
12
- import { StarRating } from "../StarRating/index.js";
13
- import { Text } from "../Text/index.js";
14
- import { Radio, RadioGroup } from "./index.js";
15
- import { jsx as _jsx } from "react/jsx-runtime";
16
- import { jsxs as _jsxs } from "react/jsx-runtime";
17
- export default {
18
- title: 'Components/Inputs/Radio',
19
- component: Radio,
20
- decorators: [story => _jsx("div", {
21
- style: {
22
- maxWidth: '500px',
23
- width: '100%'
24
- },
25
- children: story()
26
- })]
27
- };
28
- const listData = [{
29
- label: 'Avocado',
30
- value: 'avocado'
31
- }, {
32
- label: 'Blueberries',
33
- value: 'blueberries'
34
- }, {
35
- label: 'Cherries',
36
- value: 'cherries'
37
- }, {
38
- label: 'Coconut',
39
- value: 'coconut'
40
- }, {
41
- label: 'Strawberries',
42
- value: 'strawberries'
43
- }];
44
- const argTypes = {
45
- value: {
46
- options: ['avocado', 'blueberries', 'cherries', 'coconut', 'strawberries'],
47
- defaultValue: null,
48
- control: {
49
- type: 'select'
50
- }
51
- }
52
- };
53
- export const list = _ref => {
54
- let {
55
- value,
56
- children
57
- } = _ref,
58
- args = _objectWithoutProperties(_ref, _excluded);
59
- return _jsx(RadioGroup, {
60
- value: value,
61
- name: "favourite fruit",
62
- children: listData.map(item => {
63
- return _jsx(Radio, _objectSpread({
64
- children: item.label,
65
- value: item.value
66
- }, args), item.value);
67
- })
68
- });
69
- };
70
- list.args = {
71
- value: 'avocado',
72
- disabled: false
73
- };
74
- list.argTypes = argTypes;
75
- const Template = _ref2 => {
76
- let {
77
- value
78
- } = _ref2,
79
- args = _objectWithoutProperties(_ref2, _excluded2);
80
- return _jsx(RadioGroup, {
81
- value: value,
82
- name: "favourite fruit",
83
- children: _jsx(Radio, _objectSpread({
84
- value: "avocado"
85
- }, args))
86
- });
87
- };
88
- const uncheckedProps = {
89
- disabled: false,
90
- children: 'check me!',
91
- value: 'berry'
92
- };
93
- const checkedProps = {
94
- checked: true,
95
- disabled: false,
96
- children: 'check me!',
97
- value: 'avocado'
98
- };
99
- const disabledProps = {
100
- disabled: true,
101
- children: 'check me!',
102
- value: 'berry'
103
- };
104
- const emptyProps = {
105
- disabled: true,
106
- children: null,
107
- value: 'berry'
108
- };
109
- const disabledCheckedProps = {
110
- checked: true,
111
- disabled: true,
112
- children: 'check me!',
113
- value: 'avocado'
114
- };
115
- const multipleLinesProps = {
116
- disabled: false,
117
- children: 'There is a very good reason why this thing is a multi-line, sometimes we need to show people a lot of things. And thus this exists.',
118
- value: 'berry'
119
- };
120
- const Item = _ref3 => {
121
- let {
122
- label,
123
- rating
124
- } = _ref3;
125
- return _jsxs("div", {
126
- style: {
127
- display: 'grid',
128
- gridGap: '8px',
129
- gridTemplateColumns: '1fr auto'
130
- },
131
- children: [_jsx(Text, {
132
- children: label
133
- }), _jsx(StarRating, {
134
- rating: rating
135
- })]
136
- });
137
- };
138
- const withComponentProps = {
139
- disabled: false,
140
- children: _jsx(Item, {
141
- label: "Avocados",
142
- rating: "4.3"
143
- }),
144
- value: 'berry'
145
- };
146
- const withMultiLineComponentProps = {
147
- disabled: false,
148
- children: _jsxs("div", {
149
- style: {
150
- display: 'grid',
151
- gridGap: '8px',
152
- gridTemplateColumns: '1fr auto auto'
153
- },
154
- children: [_jsx(Heading, {
155
- is: "h5",
156
- children: "Your last order"
157
- }), _jsx(Badge, {
158
- colour: "neutral",
159
- label: "SUBSCRIBE"
160
- }), _jsx(Badge, {
161
- colour: "neutral",
162
- label: "AUTO TOP-UP"
163
- }), _jsxs("div", {
164
- style: {
165
- gridColumn: '1/4',
166
- display: 'grid',
167
- gridGap: '8px',
168
- gridTemplateColumns: '1fr auto'
169
- },
170
- children: [_jsx(Text, {
171
- size: "2",
172
- children: "Ending in 5678"
173
- }), _jsx(Text, {
174
- size: "2",
175
- children: "Updated 12 Dec 2018"
176
- })]
177
- })]
178
- }),
179
- value: '1'
180
- };
181
- export const unchecked = Template.bind(uncheckedProps);
182
- unchecked.args = uncheckedProps;
183
- unchecked.argTypes = argTypes;
184
- export const checked = Template.bind(checkedProps);
185
- checked.args = checkedProps;
186
- checked.argTypes = argTypes;
187
- export const disabled = Template.bind(disabledProps);
188
- disabled.args = disabledProps;
189
- disabled.argTypes = argTypes;
190
- export const disabledChecked = Template.bind(disabledCheckedProps);
191
- disabledChecked.args = disabledCheckedProps;
192
- disabledChecked.argTypes = argTypes;
193
- export const withNoChildren = Template.bind(emptyProps);
194
- withNoChildren.args = emptyProps;
195
- export const multipleLines = Template.bind(multipleLinesProps);
196
- multipleLines.args = multipleLinesProps;
197
- multipleLines.argTypes = argTypes;
198
- export const withComponent = Template.bind(withComponentProps);
199
- withComponent.args = withComponentProps;
200
- withComponent.argTypes = _objectSpread(_objectSpread({}, argTypes), {}, {
201
- children: {
202
- control: {
203
- disable: true
204
- }
205
- }
206
- });
207
- export const withMultiLineComponent = Template.bind(withMultiLineComponentProps);
208
- withMultiLineComponent.args = withMultiLineComponentProps;
209
- withMultiLineComponent.argTypes = _objectSpread(_objectSpread({}, argTypes), {}, {
210
- children: {
211
- control: {
212
- disable: true
213
- }
214
- }
215
- });
@@ -1,55 +0,0 @@
1
- "use strict";
2
-
3
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
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; }
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; }
6
- import * as React from 'react';
7
- import { Box } from "../Box/index.js";
8
- import { Heading } from "../Heading/index.js";
9
- import { StickyBox } from "../StickyBox/index.js";
10
- import { Text } from "../Text/index.js";
11
- import { ScrollPane } from "./index.js";
12
- import { jsx as _jsx } from "react/jsx-runtime";
13
- import { jsxs as _jsxs } from "react/jsx-runtime";
14
- export default {
15
- title: 'Foundation/Layout/ScrollPane',
16
- component: ScrollPane
17
- };
18
- const Template = args => _jsxs(ScrollPane, _objectSpread(_objectSpread({
19
- style: {
20
- maxHeight: '300px'
21
- }
22
- }, args), {}, {
23
- children: [_jsx(StickyBox, {
24
- width: "full",
25
- children: _jsx(Box, {
26
- matginTop: "8",
27
- padding: "3",
28
- width: "full",
29
- backgroundColour: "yellow700",
30
- borderRadius: "1",
31
- overflow: "hidden",
32
- children: _jsx(Heading, {
33
- is: "h2",
34
- align: "center",
35
- colour: "white",
36
- children: "I'm a sticky header"
37
- })
38
- })
39
- }), _jsx(Box, {
40
- padding: "5",
41
- width: "full",
42
- style: {
43
- minHeight: '300vh'
44
- },
45
- children: Array.from({
46
- length: 100
47
- }).map((_, i) => _jsxs(Text, {
48
- is: "p",
49
- children: ["I am page content ", i + 1]
50
- }, i))
51
- })]
52
- }));
53
- const standardProps = {};
54
- export const standard = Template.bind(standardProps);
55
- standard.args = standardProps;
@@ -1,43 +0,0 @@
1
- "use strict";
2
-
3
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
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; }
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; }
6
- import * as React from 'react';
7
- import { Box } from "../Box/index.js";
8
- import { boxArgTypes } from "../Box/argTypes.js";
9
- import { Section } from "./index.js";
10
- import { jsx as _jsx } from "react/jsx-runtime";
11
- import { jsxs as _jsxs } from "react/jsx-runtime";
12
- export default {
13
- title: 'Foundation/Section',
14
- component: Section,
15
- argTypes: {
16
- paddingX: boxArgTypes.paddingX
17
- }
18
- };
19
- const template = args => _jsxs(Section, _objectSpread(_objectSpread({}, args), {}, {
20
- children: [_jsx(Box, _objectSpread(_objectSpread({}, boxPropsProps), {}, {
21
- children: "Box 1"
22
- })), _jsx(Box, _objectSpread(_objectSpread({}, boxPropsProps), {}, {
23
- children: "Box 2"
24
- }))]
25
- }));
26
- const boxPropsProps = {
27
- width: 'full',
28
- borderColour: 'dark',
29
- borderWidth: ['none', 'none', '1', '2'],
30
- padding: ['2', '4'],
31
- backgroundColour: 'primary',
32
- colour: 'primary',
33
- marginBottom: ['2', '4', '5', '8'],
34
- marginX: ['none', '3', '5'],
35
- borderRadius: 'pill',
36
- boxShadow: ['none', '1', '2', '3']
37
- };
38
- const standardProps = {
39
- width: 'small',
40
- paddingX: ['none', '3', '5']
41
- };
42
- export const standard = template.bind(standardProps);
43
- standard.args = standardProps;
@@ -1,188 +0,0 @@
1
- "use strict";
2
-
3
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
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; }
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; }
6
- import { AccountEditIcon, AlertCircleIcon, CalendarIcon, CarIcon, CarMultipleIcon, CheckIcon, CurrencyUsdIcon, PlusIcon, StarIcon } from '@autoguru/icons';
7
- import { action } from '@storybook/addon-actions';
8
- import * as React from 'react';
9
- import { SelectInput } from "./index.js";
10
- import { jsx as _jsx } from "react/jsx-runtime";
11
- import { jsxs as _jsxs } from "react/jsx-runtime";
12
- const valueOptions = ['Kia', 'Toyota', 'BMW', 'Mitsubishi', 'Hyundai'];
13
- const selectOptions = valueOptions.map(item => _jsx("option", {
14
- value: item,
15
- children: item
16
- }, item));
17
- export default {
18
- title: 'Components/Inputs/Select',
19
- component: SelectInput,
20
- parameters: {
21
- chromatic: {}
22
- }
23
- };
24
- const defaultValue = valueOptions[4];
25
- const defaultPlaceholder = 'What is the make of your car?';
26
- const iconOptions = {
27
- CarIcon,
28
- CarMultipleIcon,
29
- CalendarIcon,
30
- AccountEditIcon,
31
- AlertCircleIcon,
32
- CurrencyUsdIcon,
33
- PlusIcon,
34
- StarIcon,
35
- CheckIcon
36
- };
37
- const attachOptions = {
38
- NONE: 'NONE',
39
- TOP: 'TOP',
40
- RIGHT: 'RIGHT',
41
- LEFT: 'LEFT',
42
- BOTTOM: 'BOTTOM',
43
- ALL: 'ALL'
44
- };
45
- const argTypes = {
46
- value: {
47
- options: valueOptions,
48
- defaultValue: null,
49
- control: {
50
- type: 'select'
51
- }
52
- },
53
- attach: {
54
- defaultValue: 'NONE',
55
- description: 'Input attach',
56
- options: attachOptions,
57
- control: {
58
- type: 'select'
59
- }
60
- },
61
- prefixIcon: {
62
- defaultValue: null,
63
- description: 'Input prefix Icon',
64
- options: iconOptions,
65
- control: {
66
- type: 'select'
67
- }
68
- }
69
- };
70
- const Template = args => _jsxs(SelectInput, _objectSpread(_objectSpread({}, args), {}, {
71
- children: [_jsx("option", {
72
- disabled: true,
73
- children: "Select an option"
74
- }), selectOptions]
75
- }));
76
- const sharedProps = {
77
- disabled: false,
78
- name: 'text',
79
- placeholder: defaultPlaceholder,
80
- isValid: false,
81
- isTouched: false,
82
- isLoading: false,
83
- isFocused: false,
84
- reserveHintSpace: false,
85
- hintText: '',
86
- notch: true,
87
- prefixIcon: void 0,
88
- onChange: action('onChange'),
89
- onFocus: action('onFocus'),
90
- onBlur: action('onBlur')
91
- };
92
- const standardProps = sharedProps;
93
- const withAValueProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
94
- value: defaultValue,
95
- placeholder: defaultPlaceholder
96
- });
97
- const withHintTextProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
98
- hintText: 'Hint Text',
99
- placeholder: defaultPlaceholder
100
- });
101
- const withPrefixIconProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
102
- prefixIcon: CarIcon
103
- });
104
- const disabledProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
105
- value: defaultValue,
106
- placeholder: defaultPlaceholder,
107
- disabled: true
108
- });
109
- const validProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
110
- value: defaultValue,
111
- placeholder: defaultPlaceholder,
112
- isTouched: true,
113
- isValid: true
114
- });
115
- const invalidProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
116
- placeholder: defaultPlaceholder,
117
- isTouched: true,
118
- isValid: false,
119
- hintText: 'Vehicle make is mandatory'
120
- });
121
- const noNotchProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
122
- placeholder: defaultPlaceholder,
123
- notch: false
124
- });
125
- const noNotchWithValueProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
126
- value: defaultValue,
127
- placeholder: defaultPlaceholder,
128
- notch: false
129
- });
130
- const loadingProps = _objectSpread(_objectSpread({}, sharedProps), {}, {
131
- isLoading: true
132
- });
133
- export const standard = Template.bind(standardProps);
134
- standard.args = standardProps;
135
- standard.argTypes = argTypes;
136
- export const withAValue = Template.bind(withAValueProps);
137
- withAValue.args = withAValueProps;
138
- withAValue.argTypes = argTypes;
139
- export const withHintText = Template.bind(withHintTextProps);
140
- withHintText.args = withHintTextProps;
141
- withHintText.argTypes = argTypes;
142
- export const notchDisabled = Template.bind(noNotchProps);
143
- notchDisabled.args = noNotchProps;
144
- notchDisabled.argTypes = argTypes;
145
- export const notchDisabledWithValue = Template.bind(noNotchWithValueProps);
146
- notchDisabledWithValue.args = noNotchWithValueProps;
147
- notchDisabledWithValue.argTypes = argTypes;
148
- export const withPrefixIcon = Template.bind(withPrefixIconProps);
149
- withPrefixIcon.args = withPrefixIconProps;
150
- withPrefixIcon.argTypes = argTypes;
151
- export const disabled = Template.bind(disabledProps);
152
- disabled.args = disabledProps;
153
- disabled.argTypes = argTypes;
154
- export const valid = Template.bind(validProps);
155
- valid.args = validProps;
156
- valid.argTypes = argTypes;
157
- export const invalid = Template.bind(invalidProps);
158
- invalid.args = invalidProps;
159
- invalid.argTypes = argTypes;
160
- export const loading = Template.bind(loadingProps);
161
- loading.args = loadingProps;
162
- loading.argTypes = argTypes;
163
- const smallProps = _objectSpread(_objectSpread({}, standardProps), {}, {
164
- size: 'small'
165
- });
166
- export const small = Template.bind(smallProps);
167
- small.args = smallProps;
168
- small.argTypes = argTypes;
169
- const withValueSmallProps = _objectSpread(_objectSpread({}, withAValueProps), {}, {
170
- size: 'small'
171
- });
172
- export const withValueSmall = Template.bind(withValueSmallProps);
173
- withValueSmall.args = withValueSmallProps;
174
- withValueSmall.argTypes = argTypes;
175
- const withIconSmallProps = _objectSpread(_objectSpread({}, withAValueProps), {}, {
176
- prefixIcon: CarIcon,
177
- size: 'small'
178
- });
179
- export const withIconSmall = Template.bind(withIconSmallProps);
180
- withIconSmall.args = withIconSmallProps;
181
- withIconSmall.argTypes = argTypes;
182
- const loadingSmallProps = _objectSpread(_objectSpread({}, withAValueProps), {}, {
183
- isLoading: true,
184
- size: 'small'
185
- });
186
- export const loadingSmall = Template.bind(loadingSmallProps);
187
- loadingSmall.args = loadingSmallProps;
188
- loadingSmall.argTypes = argTypes;
@@ -1,42 +0,0 @@
1
- "use strict";
2
-
3
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
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; }
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; }
6
- import { action } from '@storybook/addon-actions';
7
- import * as React from 'react';
8
- import { Box } from "../Box/index.js";
9
- import { SimplePagination } from "./index.js";
10
- import { jsx as _jsx } from "react/jsx-runtime";
11
- export default {
12
- title: 'Components/Pagination/Simple',
13
- component: SimplePagination
14
- };
15
- const Template = args => _jsx(Box, {
16
- style: {
17
- height: '100vh',
18
- width: '100vw',
19
- maxHeight: '120px'
20
- },
21
- display: "flex",
22
- alignItems: "center",
23
- justifyContent: "center",
24
- children: _jsx(SimplePagination, _objectSpread({}, args))
25
- });
26
- const standardProps = {
27
- hasNext: true,
28
- hasPrevious: true,
29
- onChange: action('onChange')
30
- };
31
- export const middlePage = Template.bind(standardProps);
32
- middlePage.args = standardProps;
33
- const firstPageProps = _objectSpread(_objectSpread({}, standardProps), {}, {
34
- hasPrevious: false
35
- });
36
- export const firstPage = Template.bind(firstPageProps);
37
- firstPage.args = firstPageProps;
38
- const lastPageProps = _objectSpread(_objectSpread({}, standardProps), {}, {
39
- hasNext: false
40
- });
41
- export const lastPage = Template.bind(lastPageProps);
42
- lastPage.args = lastPageProps;
@@ -1,44 +0,0 @@
1
- "use strict";
2
-
3
- import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
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; }
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; }
6
- import { action } from '@storybook/addon-actions';
7
- import * as React from 'react';
8
- import { Box } from "../Box/index.js";
9
- import { boxArgTypes } from "../Box/argTypes.js";
10
- import { SliderProgress } from "./index.js";
11
- import { jsx as _jsx } from "react/jsx-runtime";
12
- export default {
13
- title: 'Components/Progress/SliderProgress',
14
- component: SliderProgress,
15
- argTypes: {
16
- backgroundColour: boxArgTypes.backgroundColour
17
- }
18
- };
19
- const template = args => _jsx(Box, {
20
- paddingY: "8",
21
- paddingX: "3",
22
- backgroundColour: "gray800",
23
- children: _jsx(SliderProgress, _objectSpread({}, args))
24
- });
25
- const standardProps = {
26
- paused: false,
27
- totalCount: 3,
28
- activeIndex: 1,
29
- duration: '1s',
30
- onRequestNext: () => action('onRequestNext')
31
- };
32
- export const standard = template.bind(standardProps);
33
- standard.args = standardProps;
34
- const withBackgroundColourProps = _objectSpread(_objectSpread({}, standardProps), {}, {
35
- backgroundColour: 'yellow500'
36
- });
37
- export const withBackgroundColour = template.bind(withBackgroundColourProps);
38
- withBackgroundColour.args = withBackgroundColourProps;
39
- const withManySlidesProps = _objectSpread(_objectSpread({}, standardProps), {}, {
40
- activeIndex: 5,
41
- totalCount: 20
42
- });
43
- export const withManySlides = template.bind(withManySlidesProps);
44
- withManySlides.args = withManySlidesProps;