@citygross/components 0.7.67 → 0.7.70

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 (17) hide show
  1. package/build/@types/components/AddressBlock/AddressBlock.d.ts +6 -1
  2. package/build/@types/components/AddressBlock/AddressBlock.stories.d.ts +4 -0
  3. package/build/@types/components/FormElements/Input/Input.d.ts +1 -1
  4. package/build/@types/components/FormElements/Input/Input.styles.d.ts +1 -0
  5. package/build/cjs/components/src/components/AddressBlock/AddressBlock.js +76 -2
  6. package/build/cjs/components/src/components/AddressBlock/AddressBlock.js.map +1 -1
  7. package/build/cjs/components/src/components/AddressBlock/AddressBlock.styles.js +1 -1
  8. package/build/cjs/components/src/components/FormElements/Input/Input.js +2 -2
  9. package/build/cjs/components/src/components/FormElements/Input/Input.styles.js +6 -1
  10. package/build/cjs/components/src/components/FormElements/Input/Input.styles.js.map +1 -1
  11. package/build/es/components/src/components/AddressBlock/AddressBlock.js +76 -2
  12. package/build/es/components/src/components/AddressBlock/AddressBlock.js.map +1 -1
  13. package/build/es/components/src/components/AddressBlock/AddressBlock.styles.js +1 -1
  14. package/build/es/components/src/components/FormElements/Input/Input.js +2 -2
  15. package/build/es/components/src/components/FormElements/Input/Input.styles.js +6 -1
  16. package/build/es/components/src/components/FormElements/Input/Input.styles.js.map +1 -1
  17. package/package.json +2 -2
package/build/@types/components/AddressBlock/AddressBlock.d.ts CHANGED
@@ -1,3 +1,5 @@
1
+ import React from 'react';
2
+ import { Spacings } from '@citygross/design-tokens';
1
3
  export declare type TAddressBlock = {
2
4
  deliverOption?: string;
3
5
  icon?: JSX.Element;
@@ -8,5 +10,8 @@ export declare type TAddressBlock = {
8
10
  city: string;
9
11
  doorCode?: string;
10
12
  floor?: string;
13
+ deliveryInstructions?: React.ReactNode;
14
+ xsSpacing?: keyof Spacings;
15
+ lgSpacing?: keyof Spacings;
11
16
  };
12
- export declare function AddressBlock({ deliverOption, icon, storeName, customerName, street, zipCode, city, doorCode, floor }: TAddressBlock): JSX.Element;
17
+ export declare function AddressBlock({ deliverOption, icon, storeName, customerName, street, zipCode, city, doorCode, floor, deliveryInstructions, xsSpacing, lgSpacing }: TAddressBlock): JSX.Element;
package/build/@types/components/AddressBlock/AddressBlock.stories.d.ts CHANGED
@@ -10,9 +10,13 @@ declare const _default: {
10
10
  address: {
11
11
  control: boolean;
12
12
  };
13
+ deliveryInstructions: {
14
+ control: boolean;
15
+ };
13
16
  };
14
17
  };
15
18
  export default _default;
16
19
  export declare const Store: Story<TAddressBlock>;
17
20
  export declare const Customer: Story<TAddressBlock>;
18
21
  export declare const WithIcon: Story<TAddressBlock>;
22
+ export declare const WithSpacers: Story<TAddressBlock>;
package/build/@types/components/FormElements/Input/Input.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import * as styles from './Input.styles';
2
- export declare function Input({ flexGrow, isValid, fontSize, ...props }: styles.InputProps): JSX.Element;
2
+ export declare function Input({ flexGrow, isValid, fontSize, inputSize, ...props }: styles.InputProps): JSX.Element;
package/build/@types/components/FormElements/Input/Input.styles.d.ts CHANGED
@@ -3,5 +3,6 @@ export interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
3
3
  readonly isValid?: boolean;
4
4
  flexGrow?: number;
5
5
  fontSize?: number;
6
+ inputSize?: 'small' | 'medium';
6
7
  }
7
8
  export declare const Input: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, InputProps, never>;
package/build/cjs/components/src/components/AddressBlock/AddressBlock.js CHANGED
@@ -5,26 +5,100 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var React = require('react');
6
6
  var typography = require('@citygross/typography');
7
7
  var AddressBlock_styles = require('./AddressBlock.styles.js');
8
+ require('../../../../design-tokens/build/index.js');
9
+ require('../AlertBox/AlertBox.styles.js');
10
+ require('../Button/Button.js');
11
+ require('@citygross/utils');
12
+ require('@citygross/design-tokens');
13
+ require('@citygross/icons');
14
+ require('../Logo/Logo.styles.js');
15
+ require('../Header/Header.styles.js');
16
+ require('../HeaderLink/HeaderLink.styles.js');
17
+ require('../BackgroundImage/BackgroundImage.styles.js');
18
+ require('../Badge/Badge.styles.js');
19
+ require('../Box/Box.styles.js');
20
+ require('../Button/Button.styles.js');
21
+ require('../BackButton/BackButton.styles.js');
22
+ require('../Chips/Chip.styles.js');
23
+ require('../Spinner/Spinner.styles.js');
24
+ require('react-loading-skeleton');
25
+ require('../CartItemSummary/CartItemSummary.styles.js');
26
+ require('../Divider/Divider.styles.js');
27
+ require('../CartSummary/CartSummary.styles.js');
28
+ require('../CustomerInfoBlock/CustomerInfoBlock.styles.js');
29
+ require('../Collapsable/Collapsable.styles.js');
30
+ require('../DeliverySlotItem/DeliverySlotItem.styles.js');
31
+ require('../Slider/Slider.styles.js');
32
+ require('../DeliveryTimeBlock/DeliveryTimeBlock.styles.js');
33
+ require('../Menu/Menu.styles.js');
34
+ require('../DateBox/DateBox.styles.js');
35
+ require('../DotIndicator/DotIndicator.styles.js');
36
+ require('../Form/Form.styles.js');
37
+ require('../FormControl/FormControl.js');
38
+ require('../FormElements/Checkbox/Checkbox.styles.js');
39
+ require('../FormElements/Input/Input.styles.js');
40
+ require('../FormElements/Radio/Radio.styles.js');
41
+ require('../FormElements/Switch/Switch.styles.js');
42
+ require('../FormGroup/FormGroup.styles.js');
43
+ require('../GridContainer/GridContainer.styles.js');
44
+ require('../HighlightBox/HighlightBox.styles.js');
45
+ require('../IconToolTip/IconToolTip.styles.js');
46
+ var Spacer = require('../Spacer/Spacer.js');
47
+ require('../InfoTextBlock/InfoTextBlock.styles.js');
48
+ require('../LayoutBox/LayoutBox.styles.js');
49
+ require('../ListItem/ListItem.styles.js');
50
+ require('../ListItemWithRadio/ListItemWithRadio.styles.js');
51
+ require('../Links/Link.js');
52
+ require('react-dom');
53
+ require('../Modal/Modal.styles.js');
54
+ require('../RadioBox/RadioBoxItem.styles.js');
55
+ require('../RadioBox/RadioBoxList.styles.js');
56
+ require('../RadioGroup/RadioGroup.styles.js');
57
+ require('../RadioListItem/RadioListItem.styles.js');
58
+ require('../ProgressBar/ProgressBar.styled.js');
59
+ require('../RippleContainer/RippleContainer.styles.js');
60
+ require('../Select/Select.styles.js');
61
+ require('../Stepper/Stepper.styles.js');
62
+ require('../ToolTip/ToolTip.styles.js');
63
+ require('../StepperMobile/StepperMobile.styles.js');
64
+ require('../FormElements/TextArea/TextArea.styles.js');
65
+ require('../Table/Table.styles.js');
66
+ require('../Timeline/Timeline.styles.js');
67
+ require('../QuantitySelector/QuantitySelector.styles.js');
68
+ require('../Pagination/Pagination.styles.js');
69
+ require('../../containers/PageContainer/PageContainer.styles.js');
70
+ require('../../../../utils/build/index.js');
71
+ require('../../containers/TwoColumnsContainer/TwoColumnsPageContainer.styles.js');
72
+ require('../UnorderedList/UnorderedList.styles.js');
73
+ require('../WarningLabel/WarningLabel.styles.js');
8
74
 
9
75
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
76
 
11
77
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
78
 
13
79
  function AddressBlock(_a) {
14
- var _b = _a.deliverOption, deliverOption = _b === void 0 ? 'Address' : _b, icon = _a.icon, storeName = _a.storeName, customerName = _a.customerName, street = _a.street, zipCode = _a.zipCode, city = _a.city, doorCode = _a.doorCode, floor = _a.floor;
80
+ var _b = _a.deliverOption, deliverOption = _b === void 0 ? 'Address' : _b, icon = _a.icon, storeName = _a.storeName, customerName = _a.customerName, street = _a.street, zipCode = _a.zipCode, city = _a.city, doorCode = _a.doorCode, floor = _a.floor, deliveryInstructions = _a.deliveryInstructions, xsSpacing = _a.xsSpacing, lgSpacing = _a.lgSpacing;
81
+ var spacingsDefined = (xsSpacing || lgSpacing);
15
82
  return (React__default['default'].createElement(React__default['default'].Fragment, null,
16
83
  React__default['default'].createElement(AddressBlock_styles.AddressOption, null,
17
84
  icon && icon,
18
85
  deliverOption && React__default['default'].createElement(typography.H3, null, deliverOption)),
86
+ spacingsDefined && React__default['default'].createElement(Spacer.Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
19
87
  storeName && React__default['default'].createElement(typography.H3, null, storeName),
20
88
  customerName && React__default['default'].createElement(typography.BodyText, null, customerName),
89
+ spacingsDefined && React__default['default'].createElement(Spacer.Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
21
90
  React__default['default'].createElement(typography.BodyText, null, street),
91
+ spacingsDefined && React__default['default'].createElement(Spacer.Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
22
92
  React__default['default'].createElement(typography.BodyText, null,
23
93
  zipCode,
24
94
  " ",
25
95
  city),
96
+ spacingsDefined && React__default['default'].createElement(Spacer.Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
26
97
  doorCode && (React__default['default'].createElement(typography.BodyText, null, doorCode)),
27
- floor && (React__default['default'].createElement(typography.BodyText, null, floor))));
98
+ spacingsDefined && React__default['default'].createElement(Spacer.Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
99
+ floor && (React__default['default'].createElement(typography.BodyText, null, floor)),
100
+ spacingsDefined && React__default['default'].createElement(Spacer.Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
101
+ deliveryInstructions && (deliveryInstructions)));
28
102
  }
29
103
 
30
104
  exports.AddressBlock = AddressBlock;
package/build/cjs/components/src/components/AddressBlock/AddressBlock.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/cjs/components/src/components/AddressBlock/AddressBlock.styles.js CHANGED
@@ -9,7 +9,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
9
9
 
10
10
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
11
11
 
12
- var AddressOption = styled__default['default'].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n display: flex;\n gap: ", "px;\n margin-bottom: ", "px;\n align-items: center;\n"], ["\n display: flex;\n gap: ", "px;\n margin-bottom: ", "px;\n align-items: center;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
12
+ var AddressOption = styled__default['default'].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n display: flex;\n gap: ", "px;\n align-items: center;\n"], ["\n display: flex;\n gap: ", "px;\n align-items: center;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
13
13
  var templateObject_1;
14
14
 
15
15
  exports.AddressOption = AddressOption;
package/build/cjs/components/src/components/FormElements/Input/Input.js CHANGED
@@ -11,8 +11,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
 
13
13
  function Input(_a) {
14
- var flexGrow = _a.flexGrow, isValid = _a.isValid, fontSize = _a.fontSize, props = _tslib.__rest(_a, ["flexGrow", "isValid", "fontSize"]);
15
- return (React__default['default'].createElement(Input_styles.Input, _tslib.__assign({ flexGrow: flexGrow, fontSize: fontSize, isValid: isValid }, props)));
14
+ var flexGrow = _a.flexGrow, isValid = _a.isValid, fontSize = _a.fontSize, _b = _a.inputSize, inputSize = _b === void 0 ? 'medium' : _b, props = _tslib.__rest(_a, ["flexGrow", "isValid", "fontSize", "inputSize"]);
15
+ return (React__default['default'].createElement(Input_styles.Input, _tslib.__assign({ flexGrow: flexGrow, fontSize: fontSize, isValid: isValid, inputSize: inputSize }, props)));
16
16
  }
17
17
 
18
18
  exports.Input = Input;
package/build/cjs/components/src/components/FormElements/Input/Input.styles.js CHANGED
@@ -16,7 +16,12 @@ var Input = styled__default['default'].input(templateObject_1 || (templateObject
16
16
  : (props === null || props === void 0 ? void 0 : props.isValid) === false
17
17
  ? 'red'
18
18
  : (_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.dark;
19
- }, function (props) { var _a, _b; return ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs) + "px " + ((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.sm) + "px"; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.darkest; }, function (props) { var _a; return (_a = props.flexGrow) !== null && _a !== void 0 ? _a : 1; }, function (props) { var _a, _b, _c; return props.fontSize ? props.fontSize : (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.size) === null || _c === void 0 ? void 0 : _c.s3; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.transition.inputTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.brandBlue; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) {
19
+ }, function (props) {
20
+ var _a, _b, _c, _d;
21
+ return props.inputSize === 'small'
22
+ ? ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs) + "px " + ((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs) + "px"
23
+ : ((_c = props.theme.spacings) === null || _c === void 0 ? void 0 : _c.xs) + "px " + ((_d = props.theme.spacings) === null || _d === void 0 ? void 0 : _d.sm) + "px";
24
+ }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.darkest; }, function (props) { var _a; return (_a = props.flexGrow) !== null && _a !== void 0 ? _a : 1; }, function (props) { var _a, _b, _c; return props.fontSize ? props.fontSize : (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.size) === null || _c === void 0 ? void 0 : _c.s3; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.transition.inputTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.brandBlue; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) {
20
25
  var _a, _b, _c, _d;
21
26
  return props.disabled
22
27
  ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium
package/build/cjs/components/src/components/FormElements/Input/Input.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Input.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Input.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/AddressBlock/AddressBlock.js CHANGED
@@ -1,22 +1,96 @@
1
1
  import React from 'react';
2
2
  import { H3, BodyText } from '@citygross/typography';
3
3
  import { AddressOption } from './AddressBlock.styles.js';
4
+ import '../../../../design-tokens/build/index.js';
5
+ import '../AlertBox/AlertBox.styles.js';
6
+ import '../Button/Button.js';
7
+ import '@citygross/utils';
8
+ import '@citygross/design-tokens';
9
+ import '@citygross/icons';
10
+ import '../Logo/Logo.styles.js';
11
+ import '../Header/Header.styles.js';
12
+ import '../HeaderLink/HeaderLink.styles.js';
13
+ import '../BackgroundImage/BackgroundImage.styles.js';
14
+ import '../Badge/Badge.styles.js';
15
+ import '../Box/Box.styles.js';
16
+ import '../Button/Button.styles.js';
17
+ import '../BackButton/BackButton.styles.js';
18
+ import '../Chips/Chip.styles.js';
19
+ import '../Spinner/Spinner.styles.js';
20
+ import 'react-loading-skeleton';
21
+ import '../CartItemSummary/CartItemSummary.styles.js';
22
+ import '../Divider/Divider.styles.js';
23
+ import '../CartSummary/CartSummary.styles.js';
24
+ import '../CustomerInfoBlock/CustomerInfoBlock.styles.js';
25
+ import '../Collapsable/Collapsable.styles.js';
26
+ import '../DeliverySlotItem/DeliverySlotItem.styles.js';
27
+ import '../Slider/Slider.styles.js';
28
+ import '../DeliveryTimeBlock/DeliveryTimeBlock.styles.js';
29
+ import '../Menu/Menu.styles.js';
30
+ import '../DateBox/DateBox.styles.js';
31
+ import '../DotIndicator/DotIndicator.styles.js';
32
+ import '../Form/Form.styles.js';
33
+ import '../FormControl/FormControl.js';
34
+ import '../FormElements/Checkbox/Checkbox.styles.js';
35
+ import '../FormElements/Input/Input.styles.js';
36
+ import '../FormElements/Radio/Radio.styles.js';
37
+ import '../FormElements/Switch/Switch.styles.js';
38
+ import '../FormGroup/FormGroup.styles.js';
39
+ import '../GridContainer/GridContainer.styles.js';
40
+ import '../HighlightBox/HighlightBox.styles.js';
41
+ import '../IconToolTip/IconToolTip.styles.js';
42
+ import { Spacer } from '../Spacer/Spacer.js';
43
+ import '../InfoTextBlock/InfoTextBlock.styles.js';
44
+ import '../LayoutBox/LayoutBox.styles.js';
45
+ import '../ListItem/ListItem.styles.js';
46
+ import '../ListItemWithRadio/ListItemWithRadio.styles.js';
47
+ import '../Links/Link.js';
48
+ import 'react-dom';
49
+ import '../Modal/Modal.styles.js';
50
+ import '../RadioBox/RadioBoxItem.styles.js';
51
+ import '../RadioBox/RadioBoxList.styles.js';
52
+ import '../RadioGroup/RadioGroup.styles.js';
53
+ import '../RadioListItem/RadioListItem.styles.js';
54
+ import '../ProgressBar/ProgressBar.styled.js';
55
+ import '../RippleContainer/RippleContainer.styles.js';
56
+ import '../Select/Select.styles.js';
57
+ import '../Stepper/Stepper.styles.js';
58
+ import '../ToolTip/ToolTip.styles.js';
59
+ import '../StepperMobile/StepperMobile.styles.js';
60
+ import '../FormElements/TextArea/TextArea.styles.js';
61
+ import '../Table/Table.styles.js';
62
+ import '../Timeline/Timeline.styles.js';
63
+ import '../QuantitySelector/QuantitySelector.styles.js';
64
+ import '../Pagination/Pagination.styles.js';
65
+ import '../../containers/PageContainer/PageContainer.styles.js';
66
+ import '../../../../utils/build/index.js';
67
+ import '../../containers/TwoColumnsContainer/TwoColumnsPageContainer.styles.js';
68
+ import '../UnorderedList/UnorderedList.styles.js';
69
+ import '../WarningLabel/WarningLabel.styles.js';
4
70
 
5
71
  function AddressBlock(_a) {
6
- var _b = _a.deliverOption, deliverOption = _b === void 0 ? 'Address' : _b, icon = _a.icon, storeName = _a.storeName, customerName = _a.customerName, street = _a.street, zipCode = _a.zipCode, city = _a.city, doorCode = _a.doorCode, floor = _a.floor;
72
+ var _b = _a.deliverOption, deliverOption = _b === void 0 ? 'Address' : _b, icon = _a.icon, storeName = _a.storeName, customerName = _a.customerName, street = _a.street, zipCode = _a.zipCode, city = _a.city, doorCode = _a.doorCode, floor = _a.floor, deliveryInstructions = _a.deliveryInstructions, xsSpacing = _a.xsSpacing, lgSpacing = _a.lgSpacing;
73
+ var spacingsDefined = (xsSpacing || lgSpacing);
7
74
  return (React.createElement(React.Fragment, null,
8
75
  React.createElement(AddressOption, null,
9
76
  icon && icon,
10
77
  deliverOption && React.createElement(H3, null, deliverOption)),
78
+ spacingsDefined && React.createElement(Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
11
79
  storeName && React.createElement(H3, null, storeName),
12
80
  customerName && React.createElement(BodyText, null, customerName),
81
+ spacingsDefined && React.createElement(Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
13
82
  React.createElement(BodyText, null, street),
83
+ spacingsDefined && React.createElement(Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
14
84
  React.createElement(BodyText, null,
15
85
  zipCode,
16
86
  " ",
17
87
  city),
88
+ spacingsDefined && React.createElement(Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
18
89
  doorCode && (React.createElement(BodyText, null, doorCode)),
19
- floor && (React.createElement(BodyText, null, floor))));
90
+ spacingsDefined && React.createElement(Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
91
+ floor && (React.createElement(BodyText, null, floor)),
92
+ spacingsDefined && React.createElement(Spacer, { xsSpacing: xsSpacing, lgSpacing: lgSpacing }),
93
+ deliveryInstructions && (deliveryInstructions)));
20
94
  }
21
95
 
22
96
  export { AddressBlock };
package/build/es/components/src/components/AddressBlock/AddressBlock.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"AddressBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/AddressBlock/AddressBlock.styles.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
2
2
  import styled from 'styled-components';
3
3
 
4
- var AddressOption = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n gap: ", "px;\n margin-bottom: ", "px;\n align-items: center;\n"], ["\n display: flex;\n gap: ", "px;\n margin-bottom: ", "px;\n align-items: center;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
4
+ var AddressOption = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n gap: ", "px;\n align-items: center;\n"], ["\n display: flex;\n gap: ", "px;\n align-items: center;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
5
5
  var templateObject_1;
6
6
 
7
7
  export { AddressOption };
package/build/es/components/src/components/FormElements/Input/Input.js CHANGED
@@ -3,8 +3,8 @@ import { Input as Input$1 } from './Input.styles.js';
3
3
  import React from 'react';
4
4
 
5
5
  function Input(_a) {
6
- var flexGrow = _a.flexGrow, isValid = _a.isValid, fontSize = _a.fontSize, props = __rest(_a, ["flexGrow", "isValid", "fontSize"]);
7
- return (React.createElement(Input$1, __assign({ flexGrow: flexGrow, fontSize: fontSize, isValid: isValid }, props)));
6
+ var flexGrow = _a.flexGrow, isValid = _a.isValid, fontSize = _a.fontSize, _b = _a.inputSize, inputSize = _b === void 0 ? 'medium' : _b, props = __rest(_a, ["flexGrow", "isValid", "fontSize", "inputSize"]);
7
+ return (React.createElement(Input$1, __assign({ flexGrow: flexGrow, fontSize: fontSize, isValid: isValid, inputSize: inputSize }, props)));
8
8
  }
9
9
 
10
10
  export { Input };
package/build/es/components/src/components/FormElements/Input/Input.styles.js CHANGED
@@ -8,7 +8,12 @@ var Input = styled.input(templateObject_1 || (templateObject_1 = __makeTemplateO
8
8
  : (props === null || props === void 0 ? void 0 : props.isValid) === false
9
9
  ? 'red'
10
10
  : (_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.dark;
11
- }, function (props) { var _a, _b; return ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs) + "px " + ((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.sm) + "px"; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.darkest; }, function (props) { var _a; return (_a = props.flexGrow) !== null && _a !== void 0 ? _a : 1; }, function (props) { var _a, _b, _c; return props.fontSize ? props.fontSize : (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.size) === null || _c === void 0 ? void 0 : _c.s3; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.transition.inputTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.brandBlue; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) {
11
+ }, function (props) {
12
+ var _a, _b, _c, _d;
13
+ return props.inputSize === 'small'
14
+ ? ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs) + "px " + ((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs) + "px"
15
+ : ((_c = props.theme.spacings) === null || _c === void 0 ? void 0 : _c.xs) + "px " + ((_d = props.theme.spacings) === null || _d === void 0 ? void 0 : _d.sm) + "px";
16
+ }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.darkest; }, function (props) { var _a; return (_a = props.flexGrow) !== null && _a !== void 0 ? _a : 1; }, function (props) { var _a, _b, _c; return props.fontSize ? props.fontSize : (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.size) === null || _c === void 0 ? void 0 : _c.s3; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.transition.inputTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.brandBlue; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) {
12
17
  var _a, _b, _c, _d;
13
18
  return props.disabled
14
19
  ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium
package/build/es/components/src/components/FormElements/Input/Input.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Input.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Input.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.67",
3
+ "version": "0.7.70",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./build/cjs/components/src/index.js",
@@ -71,5 +71,5 @@
71
71
  "moment": "^2.29.1",
72
72
  "react-loading-skeleton": "^2.2.0"
73
73
  },
74
- "gitHead": "d3e70d3ccf91ea2cbe3f2d67624f2755e780d365"
74
+ "gitHead": "42123de4fd41df07008cc53f537cd5ac35e79196"
75
75
  }