@citygross/components 0.7.229 → 0.7.230
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/build/@types/components/QuantitySelector/QuantitySelector.d.ts +8 -7
- package/build/@types/components/QuantitySelector/QuantitySelector.styles.d.ts +6 -2
- package/build/@types/shared/global.styles.d.ts +1 -0
- package/build/cjs/components/src/components/BackButton/BackButton.js +2 -2
- package/build/cjs/components/src/components/BoxArrow/BoxArrow.js +2 -2
- package/build/cjs/components/src/components/Chips/Chip.js +2 -2
- package/build/cjs/components/src/components/Collapsable/Collapsable.js +2 -2
- package/build/cjs/components/src/components/FormElements/Checkbox/Checkbox.js +2 -2
- package/build/cjs/components/src/components/Header/Header.js +2 -2
- package/build/cjs/components/src/components/IconToolTip/IconToolTip.js +3 -3
- package/build/cjs/components/src/components/MenuListItem/MenuListHeader.js +2 -2
- package/build/cjs/components/src/components/MenuListItem/MenuListItem.js +2 -2
- package/build/cjs/components/src/components/Modal/Modal.js +2 -2
- package/build/cjs/components/src/components/QuantitySelector/QuantitySelector.js +7 -29
- package/build/cjs/components/src/components/QuantitySelector/QuantitySelector.js.map +1 -1
- package/build/cjs/components/src/components/QuantitySelector/QuantitySelector.styles.js +11 -6
- package/build/cjs/components/src/components/QuantitySelector/QuantitySelector.styles.js.map +1 -1
- package/build/cjs/components/src/components/Slider/Slider.js +3 -3
- package/build/cjs/components/src/components/Stepper/StepperListItem.js +2 -2
- package/build/cjs/components/src/components/StepperMobile/StepperMobile.js +3 -3
- package/build/cjs/components/src/shared/global.styles.js +12 -0
- package/build/cjs/components/src/shared/global.styles.js.map +1 -0
- package/build/es/components/src/components/QuantitySelector/QuantitySelector.js +8 -11
- package/build/es/components/src/components/QuantitySelector/QuantitySelector.js.map +1 -1
- package/build/es/components/src/components/QuantitySelector/QuantitySelector.styles.js +11 -6
- package/build/es/components/src/components/QuantitySelector/QuantitySelector.styles.js.map +1 -1
- package/build/es/components/src/shared/global.styles.js +8 -0
- package/build/es/components/src/shared/global.styles.js.map +1 -0
- package/package.json +2 -2
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
import React from 'react';
|
|
2
2
|
export declare type TQuantitySelector = {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
3
|
+
onAdd: () => void;
|
|
4
|
+
onSubtract: () => void;
|
|
5
|
+
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
6
|
+
maxValue: number;
|
|
7
|
+
value: number;
|
|
8
|
+
inCart?: boolean;
|
|
8
9
|
};
|
|
9
|
-
export declare function QuantitySelector({
|
|
10
|
+
export declare function QuantitySelector({ onAdd, onSubtract, onChange, maxValue, value, }: TQuantitySelector): JSX.Element;
|
|
@@ -1,3 +1,7 @@
|
|
|
1
|
+
declare type TQuantityButton = {
|
|
2
|
+
direction: 'left' | 'right';
|
|
3
|
+
};
|
|
1
4
|
export declare const QuantitySelectorContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
2
|
-
export declare const
|
|
3
|
-
export declare const
|
|
5
|
+
export declare const QuantityButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, TQuantityButton, never>;
|
|
6
|
+
export declare const QuantityInput: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;
|
|
7
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const focusVisible: import("styled-components").FlattenSimpleInterpolation;
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var BackButton_styles = require('./BackButton.styles.js');
|
|
7
|
-
var
|
|
7
|
+
var icons = require('@citygross/icons');
|
|
8
8
|
var typography = require('@citygross/typography');
|
|
9
9
|
|
|
10
10
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -12,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
12
12
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
13
13
|
|
|
14
14
|
function BackButton(_a) {
|
|
15
|
-
var label = _a.label, color = _a.color, _b = _a.icon, icon = _b === void 0 ? React__default["default"].createElement(
|
|
15
|
+
var label = _a.label, color = _a.color, _b = _a.icon, icon = _b === void 0 ? React__default["default"].createElement(icons.Icons.ChevronLeft, null) : _b, onClick = _a.onClick, children = _a.children;
|
|
16
16
|
return (React__default["default"].createElement(BackButton_styles.BackButtonFlex, { onClick: onClick },
|
|
17
17
|
icon,
|
|
18
18
|
React__default["default"].createElement(BackButton_styles.BackText, null,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var icons = require('@citygross/icons');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var BoxArrow_styles = require('./BoxArrow.styles.js');
|
|
6
6
|
|
|
@@ -11,7 +11,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
|
11
11
|
var BoxArrow = function (_a) {
|
|
12
12
|
var arrowPlacement = _a.arrowPlacement, arrowSpacing = _a.arrowSpacing, background = _a.background;
|
|
13
13
|
return (React__default["default"].createElement(BoxArrow_styles.BoxArrowContainer, { margin: arrowSpacing, placement: arrowPlacement },
|
|
14
|
-
React__default["default"].createElement(
|
|
14
|
+
React__default["default"].createElement(icons.Icons.BoxArrow, { width: 17, height: 8, color: background })));
|
|
15
15
|
};
|
|
16
16
|
|
|
17
17
|
module.exports = BoxArrow;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
-
var
|
|
6
|
+
var icons = require('@citygross/icons');
|
|
7
7
|
var typography = require('@citygross/typography');
|
|
8
8
|
var Chip_styles = require('./Chip.styles.js');
|
|
9
9
|
var designTokens = require('@citygross/design-tokens');
|
|
@@ -18,7 +18,7 @@ function Chip(_a) {
|
|
|
18
18
|
var label = _a.label, checked = _a.checked, onClick = _a.onClick, _e = _a.background, background = _e === void 0 ? (_b = designTokens.theme.palette) === null || _b === void 0 ? void 0 : _b.lighter : _e, _f = _a.activeBackground, activeBackground = _f === void 0 ? (_c = designTokens.theme.palette) === null || _c === void 0 ? void 0 : _c.white : _f, loading = _a.loading;
|
|
19
19
|
return (React__default["default"].createElement(Chip_styles.BaseChip, { checked: checked, onClick: onClick, background: background, activeBackground: activeBackground, loading: loading },
|
|
20
20
|
loading ? (React__default["default"].createElement(Spinner.Spinner, { size: 12 })) : (React__default["default"].createElement(React__default["default"].Fragment, null, checked ? (React__default["default"].createElement(Chip_styles.ChipCheckbox, null,
|
|
21
|
-
React__default["default"].createElement(
|
|
21
|
+
React__default["default"].createElement(icons.Icons.CheckMark, { color: (_d = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _d === void 0 ? void 0 : _d.alertGreen, width: 12, height: 12, viewBox: '0 0 25 25' }))) : (React__default["default"].createElement(Chip_styles.ChipCheckbox, null)))),
|
|
22
22
|
React__default["default"].createElement(Chip_styles.ChipLabel, { forwardedAs: 'label', size: typography.TextTypes.TextSize.SMALL }, label)));
|
|
23
23
|
}
|
|
24
24
|
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var Box = require('../Box/Box.js');
|
|
7
|
-
var
|
|
7
|
+
var icons = require('@citygross/icons');
|
|
8
8
|
var typography = require('@citygross/typography');
|
|
9
9
|
var Collapsable_styles = require('./Collapsable.styles.js');
|
|
10
10
|
|
|
@@ -20,7 +20,7 @@ var Collapsable = function (_a) {
|
|
|
20
20
|
React__default["default"].createElement(Box.Box, null,
|
|
21
21
|
React__default["default"].createElement(Collapsable_styles.PreviewInner, null,
|
|
22
22
|
React__default["default"].createElement(typography.H2, null, heading),
|
|
23
|
-
open ? React__default["default"].createElement(
|
|
23
|
+
open ? React__default["default"].createElement(icons.Icons.ChevronUp, null) : React__default["default"].createElement(icons.Icons.ChevronDown, null)))),
|
|
24
24
|
React__default["default"].createElement(Collapsable_styles.CollapsedContainer, { open: open }, children)));
|
|
25
25
|
};
|
|
26
26
|
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var _tslib = require('../../../../../_virtual/_tslib.js');
|
|
6
6
|
var React = require('react');
|
|
7
7
|
var designTokens = require('@citygross/design-tokens');
|
|
8
|
-
var
|
|
8
|
+
var icons = require('@citygross/icons');
|
|
9
9
|
var Checkbox_styles = require('./Checkbox.styles.js');
|
|
10
10
|
|
|
11
11
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -17,7 +17,7 @@ function Checkbox(_a) {
|
|
|
17
17
|
return (React__default["default"].createElement(Checkbox_styles.CheckboxWrapper, { size: size, whileTap: { scale: 0.9 }, whileHover: { scale: 1.1 } },
|
|
18
18
|
React__default["default"].createElement(Checkbox_styles.Checkbox, _tslib.__assign({ type: "checkbox", onChange: onChange, size: size }, inputProps)),
|
|
19
19
|
React__default["default"].createElement(Checkbox_styles.CheckIcon, null,
|
|
20
|
-
React__default["default"].createElement(
|
|
20
|
+
React__default["default"].createElement(icons.Icons.CheckMark, { color: designTokens.theme && designTokens.theme.palette ? designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette.alertGreen : 'white', width: iconSize }))));
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
exports.Checkbox = Checkbox;
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var utils = require('@citygross/utils');
|
|
7
7
|
var designTokens = require('@citygross/design-tokens');
|
|
8
|
-
var
|
|
8
|
+
var icons = require('@citygross/icons');
|
|
9
9
|
var Button = require('../Button/Button.js');
|
|
10
10
|
var Logo = require('../Logo/Logo.js');
|
|
11
11
|
var Header_styles = require('./Header.styles.js');
|
|
@@ -20,7 +20,7 @@ function Header(_a) {
|
|
|
20
20
|
var logOut = _a.logOut, logOutLabel = _a.logOutLabel, _d = _a.topLinkHref, topLinkHref = _d === void 0 ? '/' : _d, topLinkLabel = _a.topLinkLabel, logoImage = _a.logoImage, _e = _a.lowerContainerMaxWidth, lowerContainerMaxWidth = _e === void 0 ? (_b = designTokens.theme.constants) === null || _b === void 0 ? void 0 : _b.pageContentMaxWidth : _e, children = _a.children;
|
|
21
21
|
var device = utils.useDetectDevice();
|
|
22
22
|
return (React__default["default"].createElement(Header_styles.Wrapper, null,
|
|
23
|
-
topLinkLabel && topLinkHref && (React__default["default"].createElement(HeaderLink.HeaderLink, { linkHref: topLinkHref, icon: React__default["default"].createElement(
|
|
23
|
+
topLinkLabel && topLinkHref && (React__default["default"].createElement(HeaderLink.HeaderLink, { linkHref: topLinkHref, icon: React__default["default"].createElement(icons.Icons.ChevronLeft, { width: 20, height: 20, color: (_c = designTokens.theme.palette) === null || _c === void 0 ? void 0 : _c.white }), linkLabel: topLinkLabel })),
|
|
24
24
|
(logoImage || logOutLabel) && (React__default["default"].createElement(Header_styles.HeaderWrapper, null,
|
|
25
25
|
React__default["default"].createElement(Header_styles.HeaderContainer, { maxWidth: lowerContainerMaxWidth },
|
|
26
26
|
logoImage && React__default["default"].createElement(Logo.Logo, { logoImage: logoImage }),
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
-
var
|
|
6
|
+
var icons = require('@citygross/icons');
|
|
7
7
|
var IconToolTip_styles = require('./IconToolTip.styles.js');
|
|
8
8
|
var Spacer = require('../Spacer/Spacer.js');
|
|
9
9
|
var index = require('../../../../design-tokens/build/index.js');
|
|
@@ -14,7 +14,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
|
14
14
|
|
|
15
15
|
function IconToolTip(_a) {
|
|
16
16
|
var _b, _c;
|
|
17
|
-
var _d = _a.icon, icon = _d === void 0 ? React__default["default"].createElement(
|
|
17
|
+
var _d = _a.icon, icon = _d === void 0 ? React__default["default"].createElement(icons.Icons.Info, { width: 17, height: 17, color: (_b = index.theme.palette) === null || _b === void 0 ? void 0 : _b.dark }) : _d, header = _a.header, right = _a.right, left = _a.left, children = _a.children;
|
|
18
18
|
var _e = React.useState(false), open = _e[0], setOpen = _e[1];
|
|
19
19
|
return (React__default["default"].createElement(IconToolTip_styles.IconToolTipContainer, null,
|
|
20
20
|
React__default["default"].createElement("div", { onClick: function () { return setOpen(!open); } }, icon),
|
|
@@ -24,7 +24,7 @@ function IconToolTip(_a) {
|
|
|
24
24
|
React__default["default"].createElement(IconToolTip_styles.ToolTipheader, null,
|
|
25
25
|
header,
|
|
26
26
|
React__default["default"].createElement(IconToolTip_styles.ToolTipIconContainer, { onClick: function () { return setOpen(false); } },
|
|
27
|
-
React__default["default"].createElement(
|
|
27
|
+
React__default["default"].createElement(icons.Icons.Cross, { color: (_c = index.theme.palette) === null || _c === void 0 ? void 0 : _c.white }))),
|
|
28
28
|
React__default["default"].createElement(Spacer.Spacer, null),
|
|
29
29
|
children)))));
|
|
30
30
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var icons = require('@citygross/icons');
|
|
6
6
|
var React = require('react');
|
|
7
7
|
var MenuListItem_styles = require('./MenuListItem.styles.js');
|
|
8
8
|
|
|
@@ -14,7 +14,7 @@ var MenuListHeader = function (_a) {
|
|
|
14
14
|
var onClick = _a.onClick, dropdownHeader = _a.dropdownHeader, mainCategorySelected = _a.mainCategorySelected, hoverBackground = _a.hoverBackground;
|
|
15
15
|
return (React__default["default"].createElement(MenuListItem_styles.MainCategoryWrapper, { onClick: onClick, hoverBackground: hoverBackground },
|
|
16
16
|
React__default["default"].createElement(MenuListItem_styles.HeaderText, null, dropdownHeader),
|
|
17
|
-
!mainCategorySelected && React__default["default"].createElement(
|
|
17
|
+
!mainCategorySelected && React__default["default"].createElement(icons.Icons.ChevronRight, null)));
|
|
18
18
|
};
|
|
19
19
|
|
|
20
20
|
exports.MenuListHeader = MenuListHeader;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var designTokens = require('@citygross/design-tokens');
|
|
6
|
-
var
|
|
6
|
+
var icons = require('@citygross/icons');
|
|
7
7
|
var React = require('react');
|
|
8
8
|
var Dropdown = require('../Dropdown/Dropdown.js');
|
|
9
9
|
var MenuListItem_styles = require('./MenuListItem.styles.js');
|
|
@@ -18,7 +18,7 @@ var MenuListItem = function (_a) {
|
|
|
18
18
|
return (React__default["default"].createElement(MenuListItem_styles.MenuListItemWrapper, null,
|
|
19
19
|
React__default["default"].createElement(Dropdown.Dropdown, { onClick: onClick, isOpen: isOpen, dropdownHeader: React__default["default"].createElement(MenuListItem_styles.HeaderWrapper, { paddingLeft: paddingLeft, backgroundColor: backgroundColor, isOpen: isOpen, hoverBackground: hoverBackground, iconWidth: iconWidth },
|
|
20
20
|
React__default["default"].createElement(MenuListItem_styles.BodyText, { isOpen: isOpen }, dropdownHeader),
|
|
21
|
-
isOpen ? (React__default["default"].createElement(
|
|
21
|
+
isOpen ? (React__default["default"].createElement(icons.Icons.Minus, { width: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_b = designTokens.theme.constants) === null || _b === void 0 ? void 0 : _b.menuListItemIconSize, height: iconWidth !== null && iconWidth !== void 0 ? iconWidth : (_c = designTokens.theme.constants) === null || _c === void 0 ? void 0 : _c.menuListItemIconSize })) : (React__default["default"].createElement(icons.Icons.Plus, { width: (_d = designTokens.theme.constants) === null || _d === void 0 ? void 0 : _d.menuListItemIconSize, height: (_e = designTokens.theme.constants) === null || _e === void 0 ? void 0 : _e.menuListItemIconSize }))) },
|
|
22
22
|
React__default["default"].createElement(MenuListItem_styles.NestedWrapper, { nested: true, paddingLeft: paddingLeft }, children))));
|
|
23
23
|
};
|
|
24
24
|
|
|
@@ -6,7 +6,7 @@ var React = require('react');
|
|
|
6
6
|
var reactDom = require('react-dom');
|
|
7
7
|
var typography = require('@citygross/typography');
|
|
8
8
|
var Modal_styles = require('./Modal.styles.js');
|
|
9
|
-
var
|
|
9
|
+
var icons = require('@citygross/icons');
|
|
10
10
|
var designTokens = require('@citygross/design-tokens');
|
|
11
11
|
var Spacer = require('../Spacer/Spacer.js');
|
|
12
12
|
|
|
@@ -26,7 +26,7 @@ var Modal = function (_a) {
|
|
|
26
26
|
React__default["default"].createElement(Modal_styles.ModalHeader, null,
|
|
27
27
|
React__default["default"].createElement(typography.H2, null, title),
|
|
28
28
|
!hideCancel && (React__default["default"].createElement(Modal_styles.CloseButtonWrapper, { onClick: onBackdropClick },
|
|
29
|
-
React__default["default"].createElement(
|
|
29
|
+
React__default["default"].createElement(icons.Icons.Cross, null)))),
|
|
30
30
|
React__default["default"].createElement(typography.BodyText, null, subTitle)))),
|
|
31
31
|
children && (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
32
32
|
React__default["default"].createElement(Modal_styles.ChildrenWrapper, null, children))),
|
|
@@ -3,43 +3,21 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
-
var IconButton = require('../Button/IconButton.js');
|
|
7
6
|
var QuantitySelector_styles = require('./QuantitySelector.styles.js');
|
|
8
|
-
var
|
|
9
|
-
var typography = require('@citygross/typography');
|
|
7
|
+
var icons = require('@citygross/icons');
|
|
10
8
|
|
|
11
9
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
12
10
|
|
|
13
|
-
function _interopNamespace(e) {
|
|
14
|
-
if (e && e.__esModule) return e;
|
|
15
|
-
var n = Object.create(null);
|
|
16
|
-
if (e) {
|
|
17
|
-
Object.keys(e).forEach(function (k) {
|
|
18
|
-
if (k !== 'default') {
|
|
19
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
20
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
21
|
-
enumerable: true,
|
|
22
|
-
get: function () { return e[k]; }
|
|
23
|
-
});
|
|
24
|
-
}
|
|
25
|
-
});
|
|
26
|
-
}
|
|
27
|
-
n["default"] = e;
|
|
28
|
-
return Object.freeze(n);
|
|
29
|
-
}
|
|
30
|
-
|
|
31
11
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
32
|
-
var Icon__namespace = /*#__PURE__*/_interopNamespace(Icon);
|
|
33
12
|
|
|
34
13
|
function QuantitySelector(_a) {
|
|
35
|
-
var
|
|
14
|
+
var onAdd = _a.onAdd, onSubtract = _a.onSubtract, onChange = _a.onChange, maxValue = _a.maxValue, value = _a.value;
|
|
36
15
|
return (React__default["default"].createElement(QuantitySelector_styles.QuantitySelectorContainer, null,
|
|
37
|
-
React__default["default"].createElement(QuantitySelector_styles.
|
|
38
|
-
React__default["default"].createElement(
|
|
39
|
-
React__default["default"].createElement(QuantitySelector_styles.
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
React__default["default"].createElement(IconButton.IconButton, { height: 28, width: 28, icon: React__default["default"].createElement(Icon__namespace.Icons.Plus, null), color: 'white', onClick: onIncrement, isDisabled: incrementDisabled }))));
|
|
16
|
+
React__default["default"].createElement(QuantitySelector_styles.QuantityButton, { direction: 'left', disabled: value <= 0, onClick: onSubtract, tabIndex: -1 },
|
|
17
|
+
React__default["default"].createElement(icons.Icons.Minus, { width: 16, height: 16 })),
|
|
18
|
+
React__default["default"].createElement(QuantitySelector_styles.QuantityInput, { max: maxValue, value: value, type: "number", onChange: function (e) { return onChange(e); } }),
|
|
19
|
+
React__default["default"].createElement(QuantitySelector_styles.QuantityButton, { direction: 'right', disabled: value >= maxValue, onClick: onAdd, tabIndex: -1 },
|
|
20
|
+
React__default["default"].createElement(icons.Icons.Plus, { width: 16, height: 16 }))));
|
|
43
21
|
}
|
|
44
22
|
|
|
45
23
|
exports.QuantitySelector = QuantitySelector;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuantitySelector.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"QuantitySelector.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -4,17 +4,22 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var _tslib = require('../../../../_virtual/_tslib.js');
|
|
6
6
|
var styled = require('styled-components');
|
|
7
|
+
var global_styles = require('../../shared/global.styles.js');
|
|
7
8
|
|
|
8
9
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
9
10
|
|
|
10
11
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
11
12
|
|
|
12
|
-
var
|
|
13
|
-
var
|
|
14
|
-
var
|
|
15
|
-
var
|
|
13
|
+
var quantityButton = styled.css(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n &:disabled {\n background-color: ", ";\n opacity: 0.5;\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n"], ["\n &:disabled {\n background-color: ", ";\n opacity: 0.5;\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.lighter; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.lightest; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.lighter; });
|
|
14
|
+
var border = styled.css(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n border: 1px solid ", ";"], ["\n border: 1px solid ", ";"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; });
|
|
15
|
+
var borderRadiusLeft = styled.css(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n border-top-left-radius: ", "px;\n border-bottom-left-radius: ", "px;\n"], ["\n border-top-left-radius: ", "px;\n border-bottom-left-radius: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.small; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.small; });
|
|
16
|
+
var borderRadiusRight = styled.css(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n border-top-right-radius: ", "px;\n border-bottom-right-radius: ", "px;\n"], ["\n border-top-right-radius: ", "px;\n border-bottom-right-radius: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.small; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.small; });
|
|
17
|
+
var QuantitySelectorContainer = styled__default["default"].div(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n display: grid;\n grid-template-columns: 40px 48px 40px;\n height: 40px;\n background: ", ";\n width: 128px;\n\n @media (min-width: ", "px) {\n grid-template-columns: 32px 40px 32px;\n width: 104px;\n height: 32px;\n }\n"], ["\n display: grid;\n grid-template-columns: 40px 48px 40px;\n height: 40px;\n background: ", ";\n width: 128px;\n\n @media (min-width: ", "px) {\n grid-template-columns: 32px 40px 32px;\n width: 104px;\n height: 32px;\n }\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.transparent; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; });
|
|
18
|
+
var QuantityButton = styled__default["default"].button(templateObject_6 || (templateObject_6 = _tslib.__makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ", ";\n ", "\n ", "\n ", "\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ", ";\n ", "\n ", "\n ", "\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, quantityButton, border, function (props) { return (props.direction === 'left' ? borderRadiusLeft : borderRadiusRight); });
|
|
19
|
+
var QuantityInput = styled__default["default"].input(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n ", "\n z-index: 1;\n border-left: none;\n border-right: none;\n text-align: center;\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n &:focus-visible {\n border-left: 1px solid ", ";\n border-right: 1px solid ", ";\n }\n ", "\n"], ["\n ", "\n z-index: 1;\n border-left: none;\n border-right: none;\n text-align: center;\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n &:focus-visible {\n border-left: 1px solid ", ";\n border-right: 1px solid ", ";\n }\n ", "\n"])), border, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; }, global_styles.focusVisible);
|
|
20
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
|
16
21
|
|
|
17
|
-
exports.
|
|
18
|
-
exports.
|
|
22
|
+
exports.QuantityButton = QuantityButton;
|
|
23
|
+
exports.QuantityInput = QuantityInput;
|
|
19
24
|
exports.QuantitySelectorContainer = QuantitySelectorContainer;
|
|
20
25
|
//# sourceMappingURL=QuantitySelector.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuantitySelector.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"QuantitySelector.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -6,7 +6,7 @@ var _tslib = require('../../../../_virtual/_tslib.js');
|
|
|
6
6
|
var React = require('react');
|
|
7
7
|
var Slider_styles = require('./Slider.styles.js');
|
|
8
8
|
var IconButton = require('../Button/IconButton.js');
|
|
9
|
-
var
|
|
9
|
+
var icons = require('@citygross/icons');
|
|
10
10
|
var SlickSlider = require('react-slick');
|
|
11
11
|
var utils = require('@citygross/utils');
|
|
12
12
|
|
|
@@ -69,14 +69,14 @@ var Slider = function (_a) {
|
|
|
69
69
|
React__default["default"].createElement(Slider_styles.Container, null,
|
|
70
70
|
React__default["default"].createElement(SlickSlider__default["default"], _tslib.__assign({ ref: ref }, settings), children),
|
|
71
71
|
React__default["default"].createElement(Slider_styles.LeftIconButtonContainer, null,
|
|
72
|
-
React__default["default"].createElement(IconButton.IconButton, { isDisabled: currentPage < 1, color: iconColor, icon: React__default["default"].createElement(
|
|
72
|
+
React__default["default"].createElement(IconButton.IconButton, { isDisabled: currentPage < 1, color: iconColor, icon: React__default["default"].createElement(icons.Icons.ChevronLeft, { color: 'white' }), height: iconHeight, width: iconWidth, borderRadius: 100, onClick: function () {
|
|
73
73
|
var _a;
|
|
74
74
|
var prevSections = pageSections.slice().reverse();
|
|
75
75
|
var prevPage = prevSections.find(function (section) { return section < currentPage; }) || 0;
|
|
76
76
|
(_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.slickGoTo(prevPage);
|
|
77
77
|
} })),
|
|
78
78
|
React__default["default"].createElement(Slider_styles.RightIconButtonContainer, null,
|
|
79
|
-
React__default["default"].createElement(IconButton.IconButton, { isDisabled: currentPage + resizeSlides >= slotsLength, color: iconColor, icon: React__default["default"].createElement(
|
|
79
|
+
React__default["default"].createElement(IconButton.IconButton, { isDisabled: currentPage + resizeSlides >= slotsLength, color: iconColor, icon: React__default["default"].createElement(icons.Icons.ChevronRight, { color: 'white' }), height: iconHeight, width: iconWidth, borderRadius: 100, onClick: function () {
|
|
80
80
|
var _a;
|
|
81
81
|
var nextPage = pageSections.find(function (section) { return section > currentPage; }) ||
|
|
82
82
|
pageSections[(pageSections === null || pageSections === void 0 ? void 0 : pageSections.length) - 1];
|
|
@@ -6,7 +6,7 @@ var React = require('react');
|
|
|
6
6
|
var Stepper_styles = require('./Stepper.styles.js');
|
|
7
7
|
var Badge = require('../Badge/Badge.js');
|
|
8
8
|
var ToolTip = require('../ToolTip/ToolTip.js');
|
|
9
|
-
var
|
|
9
|
+
var icons = require('@citygross/icons');
|
|
10
10
|
var typography = require('@citygross/typography');
|
|
11
11
|
var designTokens = require('@citygross/design-tokens');
|
|
12
12
|
|
|
@@ -33,7 +33,7 @@ function StepperListItem(_a) {
|
|
|
33
33
|
? (_g = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _g === void 0 ? void 0 : _g.white
|
|
34
34
|
: (_h = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _h === void 0 ? void 0 : _h.black, borderColor: designTokens.theme && (designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) && (isHover || active)
|
|
35
35
|
? (_j = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _j === void 0 ? void 0 : _j.brandBlue
|
|
36
|
-
: undefined }, complete ? (React__default["default"].createElement(
|
|
36
|
+
: undefined }, complete ? (React__default["default"].createElement(icons.Icons.CheckMark, { fillType: icons.FillType.STROKE, color: (_k = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _k === void 0 ? void 0 : _k.alertGreen, width: 18 })) : (Number(step) + 1)),
|
|
37
37
|
React__default["default"].createElement(typography.BodyText, null, children))));
|
|
38
38
|
}
|
|
39
39
|
|
|
@@ -6,7 +6,7 @@ var React = require('react');
|
|
|
6
6
|
var PaginationButton = require('../Button/PaginationButton.js');
|
|
7
7
|
var Button = require('../Button/Button.js');
|
|
8
8
|
var typography = require('@citygross/typography');
|
|
9
|
-
var
|
|
9
|
+
var icons = require('@citygross/icons');
|
|
10
10
|
var StepperMobile_styles = require('./StepperMobile.styles.js');
|
|
11
11
|
var designTokens = require('@citygross/design-tokens');
|
|
12
12
|
|
|
@@ -20,7 +20,7 @@ function StepperMobile(_a) {
|
|
|
20
20
|
return (React__default["default"].createElement(StepperMobile_styles.MobileStepperContainer, null,
|
|
21
21
|
React__default["default"].createElement(StepperMobile_styles.Leftside, null,
|
|
22
22
|
current > 0 && (React__default["default"].createElement(PaginationButton.PaginationButton, { color: 'white', onClick: setPrevious, width: 36, height: 36 },
|
|
23
|
-
React__default["default"].createElement(
|
|
23
|
+
React__default["default"].createElement(icons.Icons.ChevronLeft, null))),
|
|
24
24
|
React__default["default"].createElement("div", null,
|
|
25
25
|
React__default["default"].createElement(typography.BodyText, { color: (_b = designTokens.theme.palette) === null || _b === void 0 ? void 0 : _b.dark, size: typography.TextTypes.TextSize.SMALL },
|
|
26
26
|
"Steg ",
|
|
@@ -28,7 +28,7 @@ function StepperMobile(_a) {
|
|
|
28
28
|
"/",
|
|
29
29
|
steps.length),
|
|
30
30
|
React__default["default"].createElement(typography.H3, null, steps[current].text))),
|
|
31
|
-
current !== steps.length - 1 && (React__default["default"].createElement(Button.Button, { color: 'secondary', icon: React__default["default"].createElement(
|
|
31
|
+
current !== steps.length - 1 && (React__default["default"].createElement(Button.Button, { color: 'secondary', icon: React__default["default"].createElement(icons.Icons.ChevronRight, { color: (_c = designTokens.theme.palette) === null || _c === void 0 ? void 0 : _c.white }), flexReverse: true, isDisabled: !steps[current].complete, onClick: setCurrent, size: 'medium' }, buttonText))));
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
exports.StepperMobile = StepperMobile;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var _tslib = require('../../../_virtual/_tslib.js');
|
|
6
|
+
var styled = require('styled-components');
|
|
7
|
+
|
|
8
|
+
var focusVisible = styled.css(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px #fff,0 0 0 4px #000,0 0 0 6px #fff;\n transition: all 0.1s ease-in-out;\n }\n"], ["\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px #fff,0 0 0 4px #000,0 0 0 6px #fff;\n transition: all 0.1s ease-in-out;\n }\n"])));
|
|
9
|
+
var templateObject_1;
|
|
10
|
+
|
|
11
|
+
exports.focusVisible = focusVisible;
|
|
12
|
+
//# sourceMappingURL=global.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"global.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
|
|
@@ -1,18 +1,15 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import * as Icon from '@citygross/icons';
|
|
5
|
-
import { H3 } from '@citygross/typography';
|
|
2
|
+
import { QuantitySelectorContainer, QuantityButton, QuantityInput } from './QuantitySelector.styles.js';
|
|
3
|
+
import { Icons } from '@citygross/icons';
|
|
6
4
|
|
|
7
5
|
function QuantitySelector(_a) {
|
|
8
|
-
var
|
|
6
|
+
var onAdd = _a.onAdd, onSubtract = _a.onSubtract, onChange = _a.onChange, maxValue = _a.maxValue, value = _a.value;
|
|
9
7
|
return (React.createElement(QuantitySelectorContainer, null,
|
|
10
|
-
React.createElement(
|
|
11
|
-
React.createElement(
|
|
12
|
-
React.createElement(
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
React.createElement(IconButton, { height: 28, width: 28, icon: React.createElement(Icon.Icons.Plus, null), color: 'white', onClick: onIncrement, isDisabled: incrementDisabled }))));
|
|
8
|
+
React.createElement(QuantityButton, { direction: 'left', disabled: value <= 0, onClick: onSubtract, tabIndex: -1 },
|
|
9
|
+
React.createElement(Icons.Minus, { width: 16, height: 16 })),
|
|
10
|
+
React.createElement(QuantityInput, { max: maxValue, value: value, type: "number", onChange: function (e) { return onChange(e); } }),
|
|
11
|
+
React.createElement(QuantityButton, { direction: 'right', disabled: value >= maxValue, onClick: onAdd, tabIndex: -1 },
|
|
12
|
+
React.createElement(Icons.Plus, { width: 16, height: 16 }))));
|
|
16
13
|
}
|
|
17
14
|
|
|
18
15
|
export { QuantitySelector };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuantitySelector.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"QuantitySelector.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}
|
|
@@ -1,10 +1,15 @@
|
|
|
1
1
|
import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
|
|
2
|
-
import styled from 'styled-components';
|
|
2
|
+
import styled, { css } from 'styled-components';
|
|
3
|
+
import { focusVisible } from '../../shared/global.styles.js';
|
|
3
4
|
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
5
|
+
var quantityButton = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n &:disabled {\n background-color: ", ";\n opacity: 0.5;\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n"], ["\n &:disabled {\n background-color: ", ";\n opacity: 0.5;\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.lighter; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.lightest; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.lighter; });
|
|
6
|
+
var border = css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border: 1px solid ", ";"], ["\n border: 1px solid ", ";"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; });
|
|
7
|
+
var borderRadiusLeft = css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n border-top-left-radius: ", "px;\n border-bottom-left-radius: ", "px;\n"], ["\n border-top-left-radius: ", "px;\n border-bottom-left-radius: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.small; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.small; });
|
|
8
|
+
var borderRadiusRight = css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n border-top-right-radius: ", "px;\n border-bottom-right-radius: ", "px;\n"], ["\n border-top-right-radius: ", "px;\n border-bottom-right-radius: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.small; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.small; });
|
|
9
|
+
var QuantitySelectorContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: grid;\n grid-template-columns: 40px 48px 40px;\n height: 40px;\n background: ", ";\n width: 128px;\n\n @media (min-width: ", "px) {\n grid-template-columns: 32px 40px 32px;\n width: 104px;\n height: 32px;\n }\n"], ["\n display: grid;\n grid-template-columns: 40px 48px 40px;\n height: 40px;\n background: ", ";\n width: 128px;\n\n @media (min-width: ", "px) {\n grid-template-columns: 32px 40px 32px;\n width: 104px;\n height: 32px;\n }\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.transparent; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; });
|
|
10
|
+
var QuantityButton = styled.button(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ", ";\n ", "\n ", "\n ", "\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ", ";\n ", "\n ", "\n ", "\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, quantityButton, border, function (props) { return (props.direction === 'left' ? borderRadiusLeft : borderRadiusRight); });
|
|
11
|
+
var QuantityInput = styled.input(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n ", "\n z-index: 1;\n border-left: none;\n border-right: none;\n text-align: center;\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n &:focus-visible {\n border-left: 1px solid ", ";\n border-right: 1px solid ", ";\n }\n ", "\n"], ["\n ", "\n z-index: 1;\n border-left: none;\n border-right: none;\n text-align: center;\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n &:focus-visible {\n border-left: 1px solid ", ";\n border-right: 1px solid ", ";\n }\n ", "\n"])), border, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; }, focusVisible);
|
|
12
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
|
8
13
|
|
|
9
|
-
export {
|
|
14
|
+
export { QuantityButton, QuantityInput, QuantitySelectorContainer };
|
|
10
15
|
//# sourceMappingURL=QuantitySelector.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"QuantitySelector.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"QuantitySelector.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { __makeTemplateObject } from '../../../_virtual/_tslib.js';
|
|
2
|
+
import { css } from 'styled-components';
|
|
3
|
+
|
|
4
|
+
var focusVisible = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px #fff,0 0 0 4px #000,0 0 0 6px #fff;\n transition: all 0.1s ease-in-out;\n }\n"], ["\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px #fff,0 0 0 4px #000,0 0 0 6px #fff;\n transition: all 0.1s ease-in-out;\n }\n"])));
|
|
5
|
+
var templateObject_1;
|
|
6
|
+
|
|
7
|
+
export { focusVisible };
|
|
8
|
+
//# sourceMappingURL=global.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"global.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@citygross/components",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.230",
|
|
4
4
|
"license": "ISC",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"main": "./build/cjs/components/src/index.js",
|
|
@@ -74,5 +74,5 @@
|
|
|
74
74
|
"react-slick": "^0.30.1",
|
|
75
75
|
"slick-carousel": "^1.8.1"
|
|
76
76
|
},
|
|
77
|
-
"gitHead": "
|
|
77
|
+
"gitHead": "91b97c8a52ee36fe846ceff07089697dfe308187"
|
|
78
78
|
}
|