@citygross/components 0.7.41 → 0.7.42

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.
@@ -1,8 +1,9 @@
1
+ import React from 'react';
1
2
  export declare type TDeliverySlotItem = {
2
3
  date: string;
3
4
  selected: boolean;
4
- disabledLabel?: string;
5
- showWarningIndicator?: boolean;
5
+ disabled: boolean;
6
+ children: React.ReactNode;
6
7
  onSelect: () => void;
7
8
  };
8
- export declare function DeliverySlotItem({ date, disabledLabel, showWarningIndicator, selected, onSelect }: TDeliverySlotItem): JSX.Element;
9
+ export declare function DeliverySlotItem({ date, selected, disabled, children, onSelect }: TDeliverySlotItem): JSX.Element;
@@ -8,6 +8,4 @@ export declare const DeliverySlotHeaderContainer: import("styled-components").St
8
8
  export declare const DeliverySlotHeaderText: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TDeliverySlotItem, never>;
9
9
  export declare const DeliverySlotContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TDeliverySlotItem, never>;
10
10
  export declare const DeliverySlotBody: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TDeliverySlotItem, never>;
11
- export declare const DisabledLabel: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
12
- export declare const DotContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
13
11
  export {};
@@ -7,23 +7,21 @@ var designTokens = require('@citygross/design-tokens');
7
7
  var utils = require('@citygross/utils');
8
8
  var typography = require('@citygross/typography');
9
9
  var DeliverySlotItem_styles = require('./DeliverySlotItem.styles.js');
10
- var DotIndicator = require('../DotIndicator/DotIndicator.js');
11
10
 
12
11
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
13
12
 
14
13
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
15
14
 
16
15
  function DeliverySlotItem(_a) {
17
- var _b, _c;
18
- var date = _a.date, disabledLabel = _a.disabledLabel, showWarningIndicator = _a.showWarningIndicator, selected = _a.selected, onSelect = _a.onSelect;
16
+ var _b;
17
+ var date = _a.date, selected = _a.selected, disabled = _a.disabled, children = _a.children, onSelect = _a.onSelect;
19
18
  var momentDate = utils.moment(date);
20
19
  var width = utils.useWindowSize().width;
21
- var _d = React.useState(momentDate
20
+ var _c = React.useState(momentDate
22
21
  .format(width < (((_b = designTokens.theme.breakpoints) === null || _b === void 0 ? void 0 : _b.md) || 768) ? 'ddd' : 'dddd')
23
- .toLocaleLowerCase()), weekDay = _d[0], setWeekDay = _d[1];
22
+ .toLocaleLowerCase()), weekDay = _c[0], setWeekDay = _c[1];
24
23
  var dayNumber = momentDate.format('D');
25
24
  var month = momentDate.format('MMM').toLocaleLowerCase();
26
- var disabled = disabledLabel !== undefined;
27
25
  React.useEffect(function () {
28
26
  var _a;
29
27
  setWeekDay(momentDate
@@ -31,7 +29,7 @@ function DeliverySlotItem(_a) {
31
29
  .toLocaleLowerCase());
32
30
  }, [width]);
33
31
  var slotRef = React.useRef(null);
34
- var _e = React.useState(true), isVisible = _e[0], setIsVisible = _e[1];
32
+ var _d = React.useState(true), isVisible = _d[0], setIsVisible = _d[1];
35
33
  var callbackFn = function (entries) {
36
34
  var entry = entries[0];
37
35
  // gets zoom level
@@ -83,10 +81,7 @@ function DeliverySlotItem(_a) {
83
81
  React__default['default'].createElement(DeliverySlotItem_styles.DeliverySlotBody, { disabled: disabled },
84
82
  React__default['default'].createElement(typography.H2, { color: 'darkest' }, removeLeadingZero(dayNumber)),
85
83
  React__default['default'].createElement(typography.BodyText, { color: 'darker' }, utils.capitalizeFirstLetter(month))),
86
- disabledLabel && (React__default['default'].createElement(DeliverySlotItem_styles.DisabledLabel, null,
87
- React__default['default'].createElement(typography.BodyText, { size: typography.TextTypes.TextSize.EXTRASMALL }, disabledLabel))),
88
- !disabledLabel && showWarningIndicator && (React__default['default'].createElement(DeliverySlotItem_styles.DotContainer, null,
89
- React__default['default'].createElement(DotIndicator.Dot, { color: (_c = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _c === void 0 ? void 0 : _c.alertRed }))))));
84
+ children)));
90
85
  }
91
86
 
92
87
  exports.DeliverySlotItem = DeliverySlotItem;
@@ -1 +1 @@
1
- {"version":3,"file":"DeliverySlotItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"DeliverySlotItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -29,15 +29,11 @@ var DeliverySlotContainer = styled__default['default'].div(templateObject_4 || (
29
29
  : (_b = props.theme.palette) === null || _b === void 0 ? void 0 : _b.white;
30
30
  });
31
31
  var DeliverySlotBody = styled__default['default'].div(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n ", ";\n"])), function (props) { return props.disabled && 'opacity: 0.4'; });
32
- var DisabledLabel = styled__default['default'].div(templateObject_6 || (templateObject_6 = _tslib.__makeTemplateObject(["\n display: flex;\n justify-content: center;\n padding: ", "px 0;\n"], ["\n display: flex;\n justify-content: center;\n padding: ", "px 0;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
33
- var DotContainer = styled__default['default'].div(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n justify-content: center;\n display: flex;\n padding: ", "px 0;\n"], ["\n justify-content: center;\n display: flex;\n padding: ", "px 0;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
34
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
32
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
35
33
 
36
34
  exports.DeliverySlotBody = DeliverySlotBody;
37
35
  exports.DeliverySlotContainer = DeliverySlotContainer;
38
36
  exports.DeliverySlotHeaderContainer = DeliverySlotHeaderContainer;
39
37
  exports.DeliverySlotHeaderText = DeliverySlotHeaderText;
40
38
  exports.DeliverySlotItemContainer = DeliverySlotItemContainer;
41
- exports.DisabledLabel = DisabledLabel;
42
- exports.DotContainer = DotContainer;
43
39
  //# sourceMappingURL=DeliverySlotItem.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DeliverySlotItem.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"DeliverySlotItem.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,21 +1,19 @@
1
1
  import React, { useState, useEffect, useRef } from 'react';
2
2
  import { theme } from '@citygross/design-tokens';
3
3
  import { moment, useWindowSize, capitalizeFirstLetter } from '@citygross/utils';
4
- import { BodyText, H2, TextTypes } from '@citygross/typography';
5
- import { DeliverySlotItemContainer, DeliverySlotHeaderContainer, DeliverySlotHeaderText, DeliverySlotContainer, DeliverySlotBody, DisabledLabel, DotContainer } from './DeliverySlotItem.styles.js';
6
- import { Dot } from '../DotIndicator/DotIndicator.js';
4
+ import { BodyText, H2 } from '@citygross/typography';
5
+ import { DeliverySlotItemContainer, DeliverySlotHeaderContainer, DeliverySlotHeaderText, DeliverySlotContainer, DeliverySlotBody } from './DeliverySlotItem.styles.js';
7
6
 
8
7
  function DeliverySlotItem(_a) {
9
- var _b, _c;
10
- var date = _a.date, disabledLabel = _a.disabledLabel, showWarningIndicator = _a.showWarningIndicator, selected = _a.selected, onSelect = _a.onSelect;
8
+ var _b;
9
+ var date = _a.date, selected = _a.selected, disabled = _a.disabled, children = _a.children, onSelect = _a.onSelect;
11
10
  var momentDate = moment(date);
12
11
  var width = useWindowSize().width;
13
- var _d = useState(momentDate
12
+ var _c = useState(momentDate
14
13
  .format(width < (((_b = theme.breakpoints) === null || _b === void 0 ? void 0 : _b.md) || 768) ? 'ddd' : 'dddd')
15
- .toLocaleLowerCase()), weekDay = _d[0], setWeekDay = _d[1];
14
+ .toLocaleLowerCase()), weekDay = _c[0], setWeekDay = _c[1];
16
15
  var dayNumber = momentDate.format('D');
17
16
  var month = momentDate.format('MMM').toLocaleLowerCase();
18
- var disabled = disabledLabel !== undefined;
19
17
  useEffect(function () {
20
18
  var _a;
21
19
  setWeekDay(momentDate
@@ -23,7 +21,7 @@ function DeliverySlotItem(_a) {
23
21
  .toLocaleLowerCase());
24
22
  }, [width]);
25
23
  var slotRef = useRef(null);
26
- var _e = useState(true), isVisible = _e[0], setIsVisible = _e[1];
24
+ var _d = useState(true), isVisible = _d[0], setIsVisible = _d[1];
27
25
  var callbackFn = function (entries) {
28
26
  var entry = entries[0];
29
27
  // gets zoom level
@@ -75,10 +73,7 @@ function DeliverySlotItem(_a) {
75
73
  React.createElement(DeliverySlotBody, { disabled: disabled },
76
74
  React.createElement(H2, { color: 'darkest' }, removeLeadingZero(dayNumber)),
77
75
  React.createElement(BodyText, { color: 'darker' }, capitalizeFirstLetter(month))),
78
- disabledLabel && (React.createElement(DisabledLabel, null,
79
- React.createElement(BodyText, { size: TextTypes.TextSize.EXTRASMALL }, disabledLabel))),
80
- !disabledLabel && showWarningIndicator && (React.createElement(DotContainer, null,
81
- React.createElement(Dot, { color: (_c = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _c === void 0 ? void 0 : _c.alertRed }))))));
76
+ children)));
82
77
  }
83
78
 
84
79
  export { DeliverySlotItem };
@@ -1 +1 @@
1
- {"version":3,"file":"DeliverySlotItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"DeliverySlotItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -21,9 +21,7 @@ var DeliverySlotContainer = styled.div(templateObject_4 || (templateObject_4 = _
21
21
  : (_b = props.theme.palette) === null || _b === void 0 ? void 0 : _b.white;
22
22
  });
23
23
  var DeliverySlotBody = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n ", ";\n"])), function (props) { return props.disabled && 'opacity: 0.4'; });
24
- var DisabledLabel = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n padding: ", "px 0;\n"], ["\n display: flex;\n justify-content: center;\n padding: ", "px 0;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
25
- var DotContainer = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n justify-content: center;\n display: flex;\n padding: ", "px 0;\n"], ["\n justify-content: center;\n display: flex;\n padding: ", "px 0;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
26
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
24
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
27
25
 
28
- export { DeliverySlotBody, DeliverySlotContainer, DeliverySlotHeaderContainer, DeliverySlotHeaderText, DeliverySlotItemContainer, DisabledLabel, DotContainer };
26
+ export { DeliverySlotBody, DeliverySlotContainer, DeliverySlotHeaderContainer, DeliverySlotHeaderText, DeliverySlotItemContainer };
29
27
  //# sourceMappingURL=DeliverySlotItem.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DeliverySlotItem.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"DeliverySlotItem.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.41",
3
+ "version": "0.7.42",
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": "4195c8f4c0da1552ce4e174d5f6d2aa38d06a29b"
74
+ "gitHead": "c798a4e09ec67571f1d42c3fb6aaec4c9c2b8198"
75
75
  }