@autoguru/overdrive 4.34.0 → 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.
- package/dist/components/Alert/Alert.js +1 -2
- package/dist/components/Anchor/Anchor.js +3 -4
- package/dist/components/AutoSuggest/AutoSuggest.css.js +3 -3
- package/dist/components/AutoSuggest/AutoSuggest.d.ts.map +1 -1
- package/dist/components/AutoSuggest/AutoSuggest.js +8 -9
- package/dist/components/Box/Box.js +2 -2
- package/dist/components/Box/argTypes.d.ts.map +1 -1
- package/dist/components/Box/argTypes.js +2 -2
- package/dist/components/Box/useBoxStyles.css.d.ts +1 -1
- package/dist/components/Box/useBoxStyles.css.d.ts.map +1 -1
- package/dist/components/Box/useBoxStyles.css.js +5 -11
- package/dist/components/BulletList/Bullet.css.js +3 -3
- package/dist/components/BulletList/Bullet.d.ts.map +1 -1
- package/dist/components/BulletList/Bullet.js +12 -4
- package/dist/components/BulletText/BulletText.js +1 -2
- package/dist/components/Button/Button.css.js +21 -21
- package/dist/components/Button/Button.js +3 -5
- package/dist/components/CheckBox/CheckBox.css.js +3 -3
- package/dist/components/CheckBox/CheckBox.js +1 -2
- package/dist/components/ColourInput/ColourInput.css.js +2 -2
- package/dist/components/ColourInput/ColourInput.js +3 -4
- package/dist/components/Columns/Column.css.js +1 -1
- package/dist/components/Columns/Column.js +2 -2
- package/dist/components/Columns/Columns.js +2 -2
- package/dist/components/DateInput/DateInput.js +2 -2
- package/dist/components/DatePicker/DatePicker.js +3 -4
- package/dist/components/DividerLine/DividerLine.d.ts +1 -1
- package/dist/components/DividerLine/DividerLine.d.ts.map +1 -1
- package/dist/components/DividerLine/DividerLine.js +1 -1
- package/dist/components/DropDown/DropDown.js +3 -5
- package/dist/components/DropDown/DropDownOption.css.js +2 -2
- package/dist/components/DropDown/DropDownOption.js +3 -4
- package/dist/components/EditableText/EditableText.css.js +1 -1
- package/dist/components/EditableText/EditableText.d.ts.map +1 -1
- package/dist/components/EditableText/EditableText.js +5 -6
- package/dist/components/FillHeightBox/FillHeightBox.js +2 -2
- package/dist/components/Flyout/Flyout.js +2 -2
- package/dist/components/HorizontalAutoScroller/HorizontalAutoScroller.css.js +1 -1
- package/dist/components/HorizontalAutoScroller/HorizontalAutoScroller.d.ts +1 -1
- package/dist/components/HorizontalAutoScroller/HorizontalAutoScroller.d.ts.map +1 -1
- package/dist/components/HorizontalAutoScroller/HorizontalAutoScroller.js +5 -7
- package/dist/components/HorizontalAutoScroller/useHorizontalAutoScroller.d.ts.map +1 -1
- package/dist/components/HorizontalAutoScroller/useHorizontalAutoScroller.js +5 -9
- package/dist/components/Image/Image.js +2 -2
- package/dist/components/Image/ImageServerProvider.js +9 -8
- package/dist/components/Image/ResponsiveImage.js +2 -2
- package/dist/components/Image/SimpleImage.js +2 -2
- package/dist/components/Inline/Inline.js +1 -3
- package/dist/components/LoadingBox/LoadingBox.js +3 -3
- package/dist/components/Meta/Meta.js +2 -3
- package/dist/components/MinimalModal/MinimalModal.js +2 -2
- package/dist/components/Modal/Modal.css.js +1 -1
- package/dist/components/Modal/Modal.d.ts.map +1 -1
- package/dist/components/Modal/Modal.js +16 -9
- package/dist/components/NumberBubble/NumberBubble.js +2 -2
- package/dist/components/NumberInput/NumberInput.js +3 -3
- package/dist/components/OrderedList/OrderedList.css.js +1 -1
- package/dist/components/OutsideClick/OutsideClick.js +1 -1
- package/dist/components/Pagination/Pagination.css.js +6 -6
- package/dist/components/Pagination/Pagination.js +1 -2
- package/dist/components/Positioner/Positioner.d.ts.map +1 -1
- package/dist/components/Positioner/Positioner.js +17 -7
- package/dist/components/Positioner/alignment.js +3 -3
- package/dist/components/ProgressBar/ProgressBar.css.js +1 -1
- package/dist/components/ProgressBar/ProgressBar.js +1 -1
- package/dist/components/ProgressBarGroup/ProgressBarGroup.css.js +1 -1
- package/dist/components/ProgressBarGroup/ProgressBarGroup.js +2 -3
- package/dist/components/Radio/Radio.css.js +4 -4
- package/dist/components/Radio/Radio.js +1 -2
- package/dist/components/ScrollPane/ScrollPane.css.js +3 -3
- package/dist/components/ScrollPane/ScrollPane.js +2 -2
- package/dist/components/SelectInput/SelectInput.css.js +3 -3
- package/dist/components/SelectInput/SelectInput.d.ts +1 -1
- package/dist/components/SelectInput/SelectInput.d.ts.map +1 -1
- package/dist/components/SelectInput/SelectInput.js +5 -5
- package/dist/components/SimplePagination/SimplePagination.js +4 -5
- package/dist/components/SliderProgress/ProgressStep.js +1 -2
- package/dist/components/SliderProgress/SliderProgress.css.js +1 -1
- package/dist/components/SliderProgress/SliderProgress.js +1 -1
- package/dist/components/Stack/Divider.css.js +1 -1
- package/dist/components/Stack/Stack.js +1 -3
- package/dist/components/StandardModal/StandardModal.css.js +8 -8
- package/dist/components/StandardModal/StandardModal.js +4 -5
- package/dist/components/StarRating/StarRating.js +7 -8
- package/dist/components/Stepper/Stepper.css.js +4 -4
- package/dist/components/Stepper/Stepper.d.ts.map +1 -1
- package/dist/components/Stepper/Stepper.js +19 -10
- package/dist/components/StickyBox/StickyBox.css.js +4 -4
- package/dist/components/StickyBox/StickyBox.js +3 -3
- package/dist/components/Switch/Switch.css.js +18 -18
- package/dist/components/Switch/Switch.js +4 -5
- package/dist/components/Table/TableCell.css.js +1 -1
- package/dist/components/Table/TableHeadCell.css.js +5 -5
- package/dist/components/Table/TableHeadCell.js +1 -2
- package/dist/components/Tabs/Tab.css.js +4 -4
- package/dist/components/Tabs/Tab.js +2 -3
- package/dist/components/Tabs/TabList.css.js +1 -1
- package/dist/components/Tabs/TabList.js +1 -2
- package/dist/components/Tabs/TabPane.js +1 -1
- package/dist/components/Text/useTextStyles.css.js +2 -2
- package/dist/components/TextAreaInput/TextAreaInput.js +2 -2
- package/dist/components/TextBubble/TextBubble.d.ts.map +1 -1
- package/dist/components/TextBubble/TextBubble.js +14 -6
- package/dist/components/TextContainer/TextContainer.js +1 -2
- package/dist/components/TextInput/TextInput.js +2 -2
- package/dist/components/TextLink/TextLink.css.js +4 -4
- package/dist/components/TextLink/TextLink.js +3 -4
- package/dist/components/ThemeOverrideProvider/ThemeOverrideDebugger.js +1 -2
- package/dist/components/ThemeOverrideProvider/ThemeOverrideProvider.js +2 -2
- package/dist/components/ThemeOverrideProvider/useBuildThemeOverrides.d.ts.map +1 -1
- package/dist/components/ThemeOverrideProvider/useBuildThemeOverrides.js +5 -3
- package/dist/components/Toaster/Toast.css.js +1 -1
- package/dist/components/Toaster/Toast.d.ts.map +1 -1
- package/dist/components/Toaster/Toast.js +24 -20
- package/dist/components/Tooltip/Tooltip.css.js +2 -2
- package/dist/components/Tooltip/Tooltip.js +1 -3
- package/dist/components/private/CheckableBase/CheckableBase.css.js +8 -8
- package/dist/components/private/CheckableBase/CheckableBase.js +1 -2
- package/dist/components/private/InputBase/HintText.css.js +1 -1
- package/dist/components/private/InputBase/NotchedBase.css.js +20 -20
- package/dist/components/private/InputBase/NotchedBase.js +1 -2
- package/dist/components/private/InputBase/withEnhancedInput.css.js +16 -16
- package/dist/components/private/InputBase/withEnhancedInput.d.ts.map +1 -1
- package/dist/components/private/InputBase/withEnhancedInput.js +3 -4
- package/dist/hooks/useAttachedBoxes/useAttachedBoxes.d.ts +1 -1
- package/dist/hooks/useAttachedBoxes/useAttachedBoxes.d.ts.map +1 -1
- package/dist/hooks/useAttachedBoxes/useAttachedBoxes.js +5 -5
- package/dist/hooks/useMedia/useMedia.js +4 -4
- package/dist/hooks/useNegativeMargin/useNegativeMarginLeft.css.js +2 -2
- package/dist/hooks/useNegativeMargin/useNegativeMarginTop.css.js +1 -1
- package/dist/hooks/useNullCheck/useNullCheck.js +1 -1
- package/dist/hooks/useWindowHeightFill/useWindowHeightFill.d.ts.map +1 -1
- package/dist/hooks/useWindowHeightFill/useWindowHeightFill.js +4 -3
- package/dist/reset/globalFonts.css.js +3 -3
- package/dist/reset/reset.css.js +2 -2
- package/dist/themes/base/tokens.js +3 -3
- package/dist/themes/flat_red/tokens.js +2 -2
- package/dist/themes/helpers.d.ts.map +1 -1
- package/dist/themes/helpers.js +2 -2
- package/dist/themes/makeTheme.js +3 -3
- package/dist/themes/neutral/tokens.js +3 -3
- package/dist/themes/theme.css.js +2 -2
- package/dist/utils/css.js +1 -1
- package/dist/utils/index.d.ts +1 -1
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +6 -5
- package/dist/utils/mapTokenToProperty.js +2 -2
- package/dist/utils/number.js +1 -1
- package/dist/utils/responsiveProps.css.d.ts.map +1 -1
- package/dist/utils/responsiveProps.css.js +2 -2
- package/dist/utils/responsiveStyle.js +3 -3
- package/package.json +118 -26
- package/dist/components/Actions/stories.js +0 -53
- package/dist/components/Alert/stories.js +0 -106
- package/dist/components/Anchor/stories.js +0 -65
- package/dist/components/AutoSuggest/stories.js +0 -213
- package/dist/components/Badge/stories.js +0 -64
- package/dist/components/Box/stories.js +0 -43
- package/dist/components/BulletList/stories.js +0 -72
- package/dist/components/BulletText/stories.js +0 -88
- package/dist/components/Button/stories.js +0 -291
- package/dist/components/CheckBox/stories.js +0 -206
- package/dist/components/ColourInput/stories.js +0 -173
- package/dist/components/Columns/stories.js +0 -209
- package/dist/components/DateInput/stories.js +0 -181
- package/dist/components/DatePicker/stories.js +0 -89
- package/dist/components/DividerLine/stories.js +0 -117
- package/dist/components/DropDown/stories.js +0 -117
- package/dist/components/EditableText/stories.js +0 -84
- package/dist/components/FillHeightBox/stories.js +0 -47
- package/dist/components/Flyout/stories.js +0 -88
- package/dist/components/Heading/stories.js +0 -127
- package/dist/components/HorizontalAutoScroller/stories.js +0 -88
- package/dist/components/Icon/stories.js +0 -62
- package/dist/components/Image/stories.js +0 -183
- package/dist/components/Inline/stories.js +0 -122
- package/dist/components/IntentStripe/stories.js +0 -76
- package/dist/components/LinearProgressIndicator/stories.js +0 -26
- package/dist/components/LoadingBox/stories.js +0 -41
- package/dist/components/Meta/stories.js +0 -45
- package/dist/components/MinimalModal/stories.js +0 -83
- package/dist/components/Modal/stories.js +0 -52
- package/dist/components/NumberBubble/stories.js +0 -23
- package/dist/components/NumberInput/stories.js +0 -218
- package/dist/components/OrderedList/stories.js +0 -58
- package/dist/components/OutsideClick/stories.js +0 -39
- package/dist/components/Pagination/stories.js +0 -112
- package/dist/components/Portal/stories.js +0 -72
- package/dist/components/Positioner/stories.js +0 -124
- package/dist/components/ProgressBar/stories.js +0 -44
- package/dist/components/ProgressBarGroup/stories.js +0 -21
- package/dist/components/ProgressSpinner/stories.js +0 -36
- package/dist/components/Radio/stories.js +0 -215
- package/dist/components/ScrollPane/stories.js +0 -55
- package/dist/components/Section/stories.js +0 -43
- package/dist/components/SelectInput/stories.js +0 -188
- package/dist/components/SimplePagination/stories.js +0 -42
- package/dist/components/SliderProgress/stories.js +0 -44
- package/dist/components/Stack/stories.js +0 -75
- package/dist/components/StandardModal/stories.js +0 -62
- package/dist/components/StarRating/stories.js +0 -50
- package/dist/components/Stepper/stories.js +0 -61
- package/dist/components/StickyBox/stories.js +0 -70
- package/dist/components/Switch/stories.js +0 -42
- package/dist/components/Table/stories.js +0 -302
- package/dist/components/Tabs/stories.js +0 -253
- package/dist/components/Text/stories.js +0 -154
- package/dist/components/TextAreaInput/stories.js +0 -129
- package/dist/components/TextBubble/stories.js +0 -30
- package/dist/components/TextContainer/stories.js +0 -128
- package/dist/components/TextInput/stories.js +0 -260
- package/dist/components/TextLink/stories.js +0 -111
- package/dist/components/Toaster/stories.js +0 -59
- package/dist/components/Tooltip/stories.js +0 -90
- package/dist/components/VisuallyHidden/stories.js +0 -36
- package/dist/hooks/useAttachedBoxes/stories.js +0 -94
- package/dist/hooks/useMedia/stories.js +0 -46
- package/dist/hooks/useResponsiveValue/stories.js +0 -38
package/dist/themes/helpers.js
CHANGED
|
@@ -24,7 +24,7 @@ export const hexToRGB = hex => {
|
|
|
24
24
|
} : null;
|
|
25
25
|
};
|
|
26
26
|
export const rgbStrToRGB = rgb => {
|
|
27
|
-
const components = rgb.
|
|
27
|
+
const components = rgb.replaceAll(/[^\d,]/g, '').split(',');
|
|
28
28
|
return {
|
|
29
29
|
r: Number.parseInt(components[0]),
|
|
30
30
|
g: Number.parseInt(components[1]),
|
|
@@ -41,7 +41,7 @@ export const getColourLuminance = rgb => {
|
|
|
41
41
|
} = rgb;
|
|
42
42
|
const a = [r, g, b].map(v => {
|
|
43
43
|
v /= 255;
|
|
44
|
-
return v <= 0.
|
|
44
|
+
return v <= 0.039_28 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
|
|
45
45
|
});
|
|
46
46
|
return a[0] * 0.2126 + a[1] * 0.7152 + a[2] * 0.0722;
|
|
47
47
|
};
|
package/dist/themes/makeTheme.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
function ownKeys(
|
|
5
|
-
function _objectSpread(
|
|
4
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
5
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
6
6
|
export const breakpoints = {
|
|
7
7
|
mobile: '0px',
|
|
8
8
|
tablet: '768px',
|
|
@@ -20,7 +20,7 @@ export const buildColourGamut = colours => Object.entries(colours).reduce((resul
|
|
|
20
20
|
return _objectSpread(_objectSpread({}, result), Object.entries(colourGrades).reduce((grades, _ref2) => {
|
|
21
21
|
let [colourGradeName, colour] = _ref2;
|
|
22
22
|
return _objectSpread(_objectSpread({}, grades), {}, {
|
|
23
|
-
[
|
|
23
|
+
[`${name}${colourGradeName}`]: colour
|
|
24
24
|
});
|
|
25
25
|
}, {}));
|
|
26
26
|
}, {});
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
function ownKeys(
|
|
5
|
-
function _objectSpread(
|
|
4
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
5
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
6
6
|
import { buildColourGamut } from "../makeTheme.js";
|
|
7
7
|
const colours = {
|
|
8
8
|
black: {
|
|
@@ -217,7 +217,7 @@ export const tokens = {
|
|
|
217
217
|
},
|
|
218
218
|
radius: {
|
|
219
219
|
none: 'none',
|
|
220
|
-
pill:
|
|
220
|
+
pill: `${1e9}px`,
|
|
221
221
|
full: '50%',
|
|
222
222
|
'1': '4px',
|
|
223
223
|
min: '2px'
|
package/dist/themes/theme.css.js
CHANGED
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
4
|
import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
|
|
5
5
|
__vanilla_filescope__.setFileScope("lib/themes/theme.css.ts", "@autoguru/overdrive");
|
|
6
|
-
function ownKeys(
|
|
7
|
-
function _objectSpread(
|
|
6
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
7
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
8
8
|
import { createThemeContract, style } from '@vanilla-extract/css';
|
|
9
9
|
import { buildColourGamut } from "./makeTheme.js";
|
|
10
10
|
const colours = {
|
package/dist/utils/css.js
CHANGED
|
@@ -9,7 +9,7 @@ export const getThemeTokenValue = (themeClass, token) => {
|
|
|
9
9
|
var _getComputedStyle$get;
|
|
10
10
|
if (!themeClass || !token) return '';
|
|
11
11
|
const cssVar = cssVarUnwrap(token);
|
|
12
|
-
const themedElement = document.querySelector(
|
|
12
|
+
const themedElement = document.querySelector(`.${themeClass}`);
|
|
13
13
|
if (!themedElement || !cssVar) return '';
|
|
14
14
|
return ((_getComputedStyle$get = getComputedStyle(themedElement).getPropertyValue(cssVar)) === null || _getComputedStyle$get === void 0 ? void 0 : _getComputedStyle$get.trim()) || '';
|
|
15
15
|
};
|
package/dist/utils/index.d.ts
CHANGED
|
@@ -8,8 +8,8 @@ export declare const useId: (idFromProps?: string) => string | null;
|
|
|
8
8
|
export declare const setRef: <T>(ref: Ref<T>, value: T) => void;
|
|
9
9
|
export declare const isHtmlElement: (element: any) => element is Element;
|
|
10
10
|
export declare const hex2rgba: (c: any, alpha?: string) => string;
|
|
11
|
-
export declare const ownerWindow: (node?: Node) => Window;
|
|
12
11
|
export declare const ownerDocument: (node?: Node) => Document;
|
|
12
|
+
export declare const ownerWindow: (node?: Node) => Window;
|
|
13
13
|
export declare const useEventCallback: <T extends Function>(fn: T) => (...args: any[]) => undefined;
|
|
14
14
|
export declare const animate: <T extends HTMLElement>(element: T, property: keyof T, to: number, duration?: number) => (() => void) | void;
|
|
15
15
|
export type Alignment = 'left' | 'right' | 'center';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../lib/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAGN,eAAe,EAGf,MAAM,OAAO,CAAC;AAEf,eAAO,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../lib/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAGN,eAAe,EAGf,MAAM,OAAO,CAAC;AAEf,eAAO,MAAM,SAAS,SAAoC,CAAC;AAE3D,eAAO,MAAM,sBAAsB,wBAA0C,CAAC;AAE9E,eAAO,MAAM,oBAAoB,0DAEP,IAAI,oCACT,IAAI,CAOxB,CAAC;AAGF,eAAO,MAAM,uBAAuB,sEAenC,CAAC;AAaF,eAAO,MAAM,KAAK,iBAAkB,MAAM,KAAG,MAAM,GAAG,IAmBrD,CAAC;AAEF,eAAO,MAAM,MAAM,oCAMlB,CAAC;AAEF,eAAO,MAAM,aAAa,YAAa,GAAG,uBACoB,CAAC;AAE/D,eAAO,MAAM,QAAQ,oCAKsB,CAAC;AAE5C,eAAO,MAAM,aAAa,UAAW,IAAI,KAAG,QACZ,CAAC;AAEjC,eAAO,MAAM,WAAW,UAAW,IAAI,KAAG,MAEK,CAAC;AAShD,eAAO,MAAM,gBAAgB,8DAO5B,CAAC;AAMF,eAAO,MAAM,OAAO,6DAGf,MAAM,wBAER,CAAC,MAAM,IAAI,CAAC,GAAG,IA8BjB,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AACpD,eAAO,MAAM,wBAAwB,UAAW,SAAS,uCAKT,CAAC;AAYjD,eAAO,MAAM,eAAe,0EAK3B,CAAC;AAGF,eAAO,MAAM,IAAI,YAAW,CAAC"}
|
package/dist/utils/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
|
|
4
|
-
export const isBrowser = typeof
|
|
4
|
+
export const isBrowser = typeof globalThis !== 'undefined';
|
|
5
5
|
export const isomorphicLayoutEffect = isBrowser ? useLayoutEffect : useEffect;
|
|
6
6
|
export const useUncontrolledState = (value, onChange) => {
|
|
7
7
|
if (typeof onChange === 'function') {
|
|
@@ -34,7 +34,7 @@ export const useId = idFromProps => {
|
|
|
34
34
|
serverHandoffComplete = true;
|
|
35
35
|
}
|
|
36
36
|
}, []);
|
|
37
|
-
return id === null ? null :
|
|
37
|
+
return id === null ? null : `od-${String(id)}`;
|
|
38
38
|
};
|
|
39
39
|
export const setRef = (ref, value) => {
|
|
40
40
|
if (typeof ref === 'function') {
|
|
@@ -46,13 +46,14 @@ export const setRef = (ref, value) => {
|
|
|
46
46
|
export const isHtmlElement = element => element instanceof Element || element instanceof HTMLDocument;
|
|
47
47
|
export const hex2rgba = function (c) {
|
|
48
48
|
let alpha = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '1';
|
|
49
|
-
return
|
|
49
|
+
return `rgb(${c.slice(1).match(/../g).map(x => Number(`0x${x}`))},${alpha})`;
|
|
50
50
|
};
|
|
51
|
+
export const ownerDocument = node => (node === null || node === void 0 ? void 0 : node.ownerDocument) || document;
|
|
51
52
|
export const ownerWindow = node => {
|
|
52
53
|
var _ownerDocument;
|
|
53
|
-
return ((_ownerDocument = ownerDocument(node)) === null || _ownerDocument === void 0 ? void 0 : _ownerDocument.defaultView) ||
|
|
54
|
+
return (((_ownerDocument = ownerDocument(node)) === null || _ownerDocument === void 0 ? void 0 : _ownerDocument.defaultView) || globalThis
|
|
55
|
+
);
|
|
54
56
|
};
|
|
55
|
-
export const ownerDocument = node => (node === null || node === void 0 ? void 0 : node.ownerDocument) || document;
|
|
56
57
|
export const useEventCallback = fn => {
|
|
57
58
|
const ref = useRef(fn);
|
|
58
59
|
isomorphicLayoutEffect(() => {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
function ownKeys(
|
|
5
|
-
function _objectSpread(
|
|
4
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
5
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
6
6
|
export const mapTokenToProperty = function (record, property) {
|
|
7
7
|
let omitKeys = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
|
|
8
8
|
return Object.entries(record).filter(_ref => {
|
package/dist/utils/number.js
CHANGED
|
@@ -18,6 +18,6 @@ export const toPrettyBigNumber = function (number) {
|
|
|
18
18
|
let fractionDigits = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
|
|
19
19
|
const formatChunks = bigNumFormatter(number);
|
|
20
20
|
const value = Number.isInteger(formatChunks.value) ? formatChunks.value : formatChunks.value.toFixed(fractionDigits);
|
|
21
|
-
return
|
|
21
|
+
return `${value}${formatChunks.descriptor}`;
|
|
22
22
|
};
|
|
23
23
|
export const addWithSafeDecimal = (a, b) => Number((a + b).toFixed(12));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"responsiveProps.css.d.ts","sourceRoot":"","sources":["../../lib/utils/responsiveProps.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAS,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAMrC,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;AAIpD,eAAO,MAAM,mBAAmB,+EAEZ,GAAG,KAAK,aAAa,
|
|
1
|
+
{"version":3,"file":"responsiveProps.css.d.ts","sourceRoot":"","sources":["../../lib/utils/responsiveProps.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAS,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAMrC,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;AAIpD,eAAO,MAAM,mBAAmB,+EAEZ,GAAG,KAAK,aAAa,iFAuBvC,CAAC"}
|
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
4
|
import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
|
|
5
5
|
__vanilla_filescope__.setFileScope("lib/utils/responsiveProps.css.ts", "@autoguru/overdrive");
|
|
6
|
-
function ownKeys(
|
|
7
|
-
function _objectSpread(
|
|
6
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
7
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
8
8
|
import { style } from '@vanilla-extract/css';
|
|
9
9
|
import { breakpoints } from "../themes/makeTheme.js";
|
|
10
10
|
import { responsiveStyle } from "./responsiveStyle.js";
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
4
|
-
function ownKeys(
|
|
5
|
-
function _objectSpread(
|
|
4
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
5
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
6
6
|
import { breakpoints } from "../themes/makeTheme.js";
|
|
7
7
|
export const responsiveStyle = breakpointsEntries => {
|
|
8
8
|
const styles = {};
|
|
@@ -13,7 +13,7 @@ export const responsiveStyle = breakpointsEntries => {
|
|
|
13
13
|
}
|
|
14
14
|
Object.assign(styles, {
|
|
15
15
|
'@media': _objectSpread(_objectSpread({}, styles['@media']), {}, {
|
|
16
|
-
[
|
|
16
|
+
[`screen and (min-width: ${breakpoints[query]})`]: style
|
|
17
17
|
})
|
|
18
18
|
});
|
|
19
19
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@autoguru/overdrive",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.35.0",
|
|
4
4
|
"description": "Overdrive is a product component library, and design system for AutoGuru.",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"autoguru"
|
|
15
15
|
],
|
|
16
16
|
"homepage": "https://overdrive.autoguru.io",
|
|
17
|
-
"repository": "autoguru-au/overdrive",
|
|
17
|
+
"repository": "https://github.com/autoguru-au/overdrive",
|
|
18
18
|
"license": "MIT",
|
|
19
19
|
"sideEffects": [
|
|
20
20
|
"./lib/reset/**/*",
|
|
@@ -31,36 +31,123 @@
|
|
|
31
31
|
"access": "public"
|
|
32
32
|
},
|
|
33
33
|
"scripts": {
|
|
34
|
-
"
|
|
35
|
-
"
|
|
36
|
-
"
|
|
34
|
+
"build": "babel lib --out-dir dist --extensions '.ts,.tsx,.css' --ignore 'lib/**/*.stories.tsx'",
|
|
35
|
+
"chromatic": "chromatic test --exit-zero-on-changes --build-script-name storybook:build",
|
|
36
|
+
"copy:public": "node scripts/copyPublic.js",
|
|
37
|
+
"check-deps": "npx npm-check-updates@latest --interactive --format group",
|
|
38
|
+
"format": "prettier --list-different --write \"**/*.+(js|jsx|ts|tsx|json|yml|md|mdx|html)\"",
|
|
39
|
+
"postinstall": "patch-package",
|
|
37
40
|
"prepublishOnly": "yarn run build && yarn run typeEmit",
|
|
41
|
+
"lint:tsc": "tsc --noEmit --skipLibCheck",
|
|
42
|
+
"lint:eslint": "eslint \"lib/**/*.+(ts|tsx)\" --fix --quiet",
|
|
43
|
+
"lint": "yarn run lint:eslint && yarn run lint:tsc",
|
|
44
|
+
"release": "changeset publish",
|
|
45
|
+
"start": "concurrently -k \"yarn:storybook\"",
|
|
46
|
+
"storybook:extract": "npx sb extract",
|
|
47
|
+
"storybook": "storybook dev -p 6006",
|
|
48
|
+
"storybook:build": "storybook build",
|
|
49
|
+
"test": "cd jest/ && jest",
|
|
50
|
+
"typeEmit": "tsc -d --declarationDir dist --emitDeclarationOnly",
|
|
38
51
|
"watch": "tsc --watch"
|
|
39
52
|
},
|
|
53
|
+
"browserslist": "extends browserslist-config-autoguru",
|
|
54
|
+
"prettier": {
|
|
55
|
+
"bracketSpacing": true,
|
|
56
|
+
"printWidth": 80,
|
|
57
|
+
"proseWrap": "always",
|
|
58
|
+
"singleQuote": true,
|
|
59
|
+
"tabWidth": 4,
|
|
60
|
+
"trailingComma": "all",
|
|
61
|
+
"useTabs": true
|
|
62
|
+
},
|
|
40
63
|
"devDependencies": {
|
|
41
|
-
"@autoguru/
|
|
42
|
-
"@autoguru/
|
|
43
|
-
"@autoguru/
|
|
44
|
-
"@
|
|
45
|
-
"@
|
|
46
|
-
"@
|
|
47
|
-
"@
|
|
64
|
+
"@autoguru/babel-preset": "^3.0.0",
|
|
65
|
+
"@autoguru/eslint-plugin": "1.6.0",
|
|
66
|
+
"@autoguru/icons": "^1.8.2",
|
|
67
|
+
"@autoguru/jest-preset": "3.0.0",
|
|
68
|
+
"@autoguru/tsconfig": "^1.2.0",
|
|
69
|
+
"@autoguru/utilities": "^1.2.2",
|
|
70
|
+
"@babel/cli": "^7.25.9",
|
|
71
|
+
"@babel/core": "^7.26.0",
|
|
72
|
+
"@babel/plugin-proposal-class-properties": "^7.18.6",
|
|
73
|
+
"@babel/plugin-proposal-export-default-from": "^7.25.9",
|
|
74
|
+
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
|
|
75
|
+
"@babel/plugin-proposal-object-rest-spread": "^7.20.7",
|
|
76
|
+
"@babel/plugin-proposal-optional-chaining": "^7.21.0",
|
|
77
|
+
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
|
|
78
|
+
"@babel/plugin-transform-classes": "^7.25.9",
|
|
79
|
+
"@babel/plugin-transform-runtime": "^7.25.9",
|
|
80
|
+
"@babel/plugin-transform-spread": "^7.25.9",
|
|
81
|
+
"@babel/plugin-transform-strict-mode": "^7.25.9",
|
|
82
|
+
"@babel/preset-env": "^7.26.0",
|
|
83
|
+
"@babel/preset-react": "^7.25.9",
|
|
84
|
+
"@babel/preset-typescript": "^7.26.0",
|
|
85
|
+
"@babel/runtime-corejs3": "^7.26.0",
|
|
86
|
+
"@changesets/cli": "^2.27.10",
|
|
87
|
+
"@chromatic-com/storybook": "^3.2.2",
|
|
88
|
+
"@octokit/rest": "^21.0.2",
|
|
89
|
+
"@popperjs/core": "^2.11.8",
|
|
90
|
+
"@react-stately/toggle": "^3.8.0",
|
|
91
|
+
"@storybook/addon-a11y": "^8.4.5",
|
|
92
|
+
"@storybook/addon-actions": "^8.4.5",
|
|
93
|
+
"@storybook/addon-essentials": "^8.4.5",
|
|
94
|
+
"@storybook/addon-interactions": "^8.4.5",
|
|
95
|
+
"@storybook/addon-links": "^8.4.5",
|
|
96
|
+
"@storybook/addon-onboarding": "^8.4.5",
|
|
97
|
+
"@storybook/blocks": "^8.4.5",
|
|
98
|
+
"@storybook/react": "^8.4.5",
|
|
99
|
+
"@storybook/react-vite": "^8.4.5",
|
|
100
|
+
"@storybook/test": "^8.4.5",
|
|
101
|
+
"@testing-library/jest-dom": "^5.16.5",
|
|
102
|
+
"@testing-library/react": "^13.3.0",
|
|
103
|
+
"@testing-library/react-hooks": "^8.0.1",
|
|
104
|
+
"@types/node": "^20.17.8",
|
|
105
|
+
"@types/react": "^18.3.12",
|
|
106
|
+
"@types/react-dom": "^18.3.1",
|
|
107
|
+
"@types/webpack-env": "^1.18.5",
|
|
108
|
+
"@vanilla-extract/babel-plugin": "^1.2.0",
|
|
109
|
+
"@vanilla-extract/css": "^1.16.1",
|
|
48
110
|
"@vanilla-extract/dynamic": "^2.1.2",
|
|
49
|
-
"
|
|
50
|
-
"
|
|
111
|
+
"@vanilla-extract/vite-plugin": "^4.0.18",
|
|
112
|
+
"@vanilla-extract/webpack-plugin": "^2.3.15",
|
|
113
|
+
"babel-plugin-add-import-extension": "^1.6.0",
|
|
114
|
+
"babel-plugin-dev-expression": "^0.2.3",
|
|
115
|
+
"babel-plugin-macros": "^3.1.0",
|
|
116
|
+
"browserslist-config-autoguru": "^2.4.0",
|
|
117
|
+
"chromatic": "^11.19.0",
|
|
118
|
+
"clsx": "^2.1.1",
|
|
119
|
+
"colord": "^2.9.3",
|
|
120
|
+
"concurrently": "^9.1.0",
|
|
121
|
+
"core-js": "^3.39.0",
|
|
51
122
|
"csstype": "^3.1.3",
|
|
52
|
-
"deepmerge": "^4.
|
|
53
|
-
"eslint
|
|
123
|
+
"deepmerge": "^4.3.1",
|
|
124
|
+
"eslint": "^8.57.1",
|
|
125
|
+
"eslint-plugin-jest": "28.9.0",
|
|
126
|
+
"eslint-plugin-storybook": "^0.11.1",
|
|
127
|
+
"eslint-plugin-unicorn": "^56.0.1",
|
|
54
128
|
"intersection-observer": "^0.12.2",
|
|
55
|
-
"
|
|
56
|
-
"
|
|
57
|
-
"
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
"
|
|
61
|
-
"
|
|
62
|
-
"
|
|
63
|
-
"
|
|
129
|
+
"jest": "26.6.3",
|
|
130
|
+
"magic-string": "^0.30.14",
|
|
131
|
+
"mini-css-extract-plugin": "^2.9.2",
|
|
132
|
+
"patch-package": "^8.0.0",
|
|
133
|
+
"plop": "^4.0.1",
|
|
134
|
+
"postcss": "^8.4.49",
|
|
135
|
+
"prettier": "^3.4.1",
|
|
136
|
+
"prop-types": "^15.8.1",
|
|
137
|
+
"rand-seed": "^2.1.7",
|
|
138
|
+
"react": "^18.3.1",
|
|
139
|
+
"react-aria": "^3.36.0",
|
|
140
|
+
"react-dom": "^18.3.1",
|
|
141
|
+
"react-focus-lock": "2.13.2",
|
|
142
|
+
"react-intersection-observer": "^9.13.1",
|
|
143
|
+
"react-keyed-flatten-children": "^2.2.1",
|
|
144
|
+
"react-swipeable": "^7.0.2",
|
|
145
|
+
"react-test-renderer": "^18.3.1",
|
|
146
|
+
"storybook": "^8.4.5",
|
|
147
|
+
"typescript": "^4.9.5",
|
|
148
|
+
"url-loader": "^4.1.1",
|
|
149
|
+
"vite": "^6.0.1",
|
|
150
|
+
"webpack": "^5.96.1"
|
|
64
151
|
},
|
|
65
152
|
"peerDependencies": {
|
|
66
153
|
"@autoguru/icons": "^1.7.28",
|
|
@@ -78,5 +165,10 @@
|
|
|
78
165
|
"react-keyed-flatten-children": "^1.3.0",
|
|
79
166
|
"react-swipeable": ">=7.0.0",
|
|
80
167
|
"webpack": "*"
|
|
81
|
-
}
|
|
168
|
+
},
|
|
169
|
+
"volta": {
|
|
170
|
+
"node": "20.18.1",
|
|
171
|
+
"yarn": "4.5.3"
|
|
172
|
+
},
|
|
173
|
+
"packageManager": "yarn@4.5.3"
|
|
82
174
|
}
|
|
@@ -1,53 +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 { Button } from "../Button/index.js";
|
|
8
|
-
import { Actions } from "./index.js";
|
|
9
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
|
-
export default {
|
|
12
|
-
title: 'Components/Actions',
|
|
13
|
-
component: Actions,
|
|
14
|
-
decorators: [story => _jsx("div", {
|
|
15
|
-
style: {
|
|
16
|
-
maxWidth: 300,
|
|
17
|
-
width: '100%'
|
|
18
|
-
},
|
|
19
|
-
children: story()
|
|
20
|
-
})]
|
|
21
|
-
};
|
|
22
|
-
const template = args => _jsxs(Actions, _objectSpread(_objectSpread({}, args), {}, {
|
|
23
|
-
children: [_jsx(Button, {
|
|
24
|
-
children: "Login"
|
|
25
|
-
}), _jsx(Button, {
|
|
26
|
-
variant: "primary",
|
|
27
|
-
children: "Sign up"
|
|
28
|
-
}), _jsx(Button, {
|
|
29
|
-
variant: "secondary",
|
|
30
|
-
children: "Action 1"
|
|
31
|
-
}), _jsx(Button, {
|
|
32
|
-
variant: "secondary",
|
|
33
|
-
children: "Action 2"
|
|
34
|
-
}), _jsx(Button, {
|
|
35
|
-
isLoading: true,
|
|
36
|
-
variant: "secondary",
|
|
37
|
-
children: "Action 3"
|
|
38
|
-
}), _jsx(Button, {
|
|
39
|
-
minimal: true,
|
|
40
|
-
variant: "secondary",
|
|
41
|
-
children: "Action 4"
|
|
42
|
-
})]
|
|
43
|
-
}));
|
|
44
|
-
const standardProps = {
|
|
45
|
-
noWrap: false
|
|
46
|
-
};
|
|
47
|
-
const noWrapProps = {
|
|
48
|
-
noWrap: true
|
|
49
|
-
};
|
|
50
|
-
export const standard = template.bind(standardProps);
|
|
51
|
-
export const noWrap = template.bind(noWrapProps);
|
|
52
|
-
standard.args = standardProps;
|
|
53
|
-
noWrap.args = noWrapProps;
|
|
@@ -1,106 +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 { Text } from "../Text/index.js";
|
|
9
|
-
import { Alert } from "./index.js";
|
|
10
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
|
-
const onRequestClose = action('onRequestClose');
|
|
13
|
-
export default {
|
|
14
|
-
title: 'Components/Alert',
|
|
15
|
-
component: Alert,
|
|
16
|
-
argTypes: {
|
|
17
|
-
intent: {
|
|
18
|
-
options: ['information', 'success', 'warning', 'danger'],
|
|
19
|
-
defaultValue: 'primary',
|
|
20
|
-
control: {
|
|
21
|
-
type: 'select'
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
};
|
|
26
|
-
const template = args => _jsx("div", {
|
|
27
|
-
style: {
|
|
28
|
-
display: 'grid',
|
|
29
|
-
gridAutoFlow: 'row dense',
|
|
30
|
-
gridGap: '24px'
|
|
31
|
-
},
|
|
32
|
-
children: _jsx("div", {
|
|
33
|
-
children: _jsx(Alert, _objectSpread(_objectSpread({}, args), {}, {
|
|
34
|
-
onRequestClose: onRequestClose,
|
|
35
|
-
children: _jsxs(Text, {
|
|
36
|
-
children: ["Your invoice was sent to ", _jsx(Text, {
|
|
37
|
-
strong: true,
|
|
38
|
-
children: "abc@supplier.co"
|
|
39
|
-
})]
|
|
40
|
-
})
|
|
41
|
-
}))
|
|
42
|
-
})
|
|
43
|
-
});
|
|
44
|
-
const templateAllIntents = args => _jsxs("div", {
|
|
45
|
-
style: {
|
|
46
|
-
display: 'grid',
|
|
47
|
-
gridAutoFlow: 'row dense',
|
|
48
|
-
gridGap: '24px'
|
|
49
|
-
},
|
|
50
|
-
children: [_jsx("div", {
|
|
51
|
-
children: _jsx(Alert, _objectSpread(_objectSpread({}, args), {}, {
|
|
52
|
-
intent: "success",
|
|
53
|
-
onRequestClose: onRequestClose,
|
|
54
|
-
children: _jsxs(Text, {
|
|
55
|
-
children: ["Your invoice was sent to ", _jsx(Text, {
|
|
56
|
-
strong: true,
|
|
57
|
-
children: "abc@supplier.co"
|
|
58
|
-
})]
|
|
59
|
-
})
|
|
60
|
-
}))
|
|
61
|
-
}), _jsx("div", {
|
|
62
|
-
children: _jsx(Alert, _objectSpread(_objectSpread({}, args), {}, {
|
|
63
|
-
intent: "warning",
|
|
64
|
-
onRequestClose: onRequestClose,
|
|
65
|
-
children: "This will affect job changes"
|
|
66
|
-
}))
|
|
67
|
-
}), _jsx("div", {
|
|
68
|
-
children: _jsx(Alert, _objectSpread(_objectSpread({}, args), {}, {
|
|
69
|
-
intent: "danger",
|
|
70
|
-
onRequestClose: onRequestClose,
|
|
71
|
-
children: "Something went wrong"
|
|
72
|
-
}))
|
|
73
|
-
}), _jsx("div", {
|
|
74
|
-
children: _jsx(Alert, _objectSpread(_objectSpread({}, args), {}, {
|
|
75
|
-
intent: "information",
|
|
76
|
-
onRequestClose: onRequestClose,
|
|
77
|
-
children: "Something worth noting happened"
|
|
78
|
-
}))
|
|
79
|
-
}), _jsx("div", {
|
|
80
|
-
children: _jsx(Alert, _objectSpread(_objectSpread({}, args), {}, {
|
|
81
|
-
intent: "information",
|
|
82
|
-
onRequestClose: onRequestClose,
|
|
83
|
-
children: "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a,"
|
|
84
|
-
}))
|
|
85
|
-
})]
|
|
86
|
-
});
|
|
87
|
-
const standardProps = {
|
|
88
|
-
dismissible: void 0,
|
|
89
|
-
intent: void 0,
|
|
90
|
-
inline: void 0,
|
|
91
|
-
className: void 0
|
|
92
|
-
};
|
|
93
|
-
export const Standard = template.bind(standardProps);
|
|
94
|
-
Standard.args = standardProps;
|
|
95
|
-
export const StandardAllIntents = templateAllIntents.bind(standardProps);
|
|
96
|
-
StandardAllIntents.args = standardProps;
|
|
97
|
-
const inlineProps = _objectSpread(_objectSpread({}, standardProps), {}, {
|
|
98
|
-
inline: true
|
|
99
|
-
});
|
|
100
|
-
export const InlineAllIntents = templateAllIntents.bind(inlineProps);
|
|
101
|
-
InlineAllIntents.args = inlineProps;
|
|
102
|
-
const noneDismissibleProps = _objectSpread(_objectSpread({}, standardProps), {}, {
|
|
103
|
-
dismissible: false
|
|
104
|
-
});
|
|
105
|
-
export const NoneDismissibleAllIntents = templateAllIntents.bind(noneDismissibleProps);
|
|
106
|
-
NoneDismissibleAllIntents.args = noneDismissibleProps;
|
|
@@ -1,65 +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, MagnifyIcon, PhoneIcon, PlusIcon, StarIcon } from '@autoguru/icons';
|
|
7
|
-
import * as React from 'react';
|
|
8
|
-
import { Button } from "../Button/index.js";
|
|
9
|
-
import { Anchor } from "./index.js";
|
|
10
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
|
-
const iconOptions = {
|
|
12
|
-
MagnifyIcon,
|
|
13
|
-
CarIcon,
|
|
14
|
-
CarMultipleIcon,
|
|
15
|
-
CalendarIcon,
|
|
16
|
-
AccountEditIcon,
|
|
17
|
-
AlertCircleIcon,
|
|
18
|
-
CurrencyUsdIcon,
|
|
19
|
-
PlusIcon,
|
|
20
|
-
StarIcon,
|
|
21
|
-
CheckIcon
|
|
22
|
-
};
|
|
23
|
-
export default {
|
|
24
|
-
title: 'Foundation/Typography/Anchor',
|
|
25
|
-
component: Anchor,
|
|
26
|
-
decorators: [],
|
|
27
|
-
argTypes: {
|
|
28
|
-
icon: {
|
|
29
|
-
defaultValue: void 0,
|
|
30
|
-
description: 'Input field Icon',
|
|
31
|
-
options: iconOptions,
|
|
32
|
-
control: {
|
|
33
|
-
type: 'select'
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
is: {
|
|
37
|
-
control: {
|
|
38
|
-
disable: true
|
|
39
|
-
}
|
|
40
|
-
},
|
|
41
|
-
children: {
|
|
42
|
-
defaultValue: '07 5612 5347',
|
|
43
|
-
control: {
|
|
44
|
-
type: 'string'
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
};
|
|
49
|
-
const Template = args => _jsx(Anchor, _objectSpread({}, args));
|
|
50
|
-
const standardProps = {
|
|
51
|
-
href: 'tel:07 5612 5347',
|
|
52
|
-
children: '07 5612 5347'
|
|
53
|
-
};
|
|
54
|
-
export const standard = Template.bind(standardProps);
|
|
55
|
-
standard.args = standardProps;
|
|
56
|
-
const withIconProps = _objectSpread(_objectSpread({}, standardProps), {}, {
|
|
57
|
-
icon: PhoneIcon
|
|
58
|
-
});
|
|
59
|
-
export const withIcon = Template.bind(withIconProps);
|
|
60
|
-
withIcon.args = withIconProps;
|
|
61
|
-
const withButtonProps = _objectSpread(_objectSpread({}, withIconProps), {}, {
|
|
62
|
-
is: Button
|
|
63
|
-
});
|
|
64
|
-
export const withButton = Template.bind(withButtonProps);
|
|
65
|
-
withButton.args = withButtonProps;
|