@citygross/components 0.16.10 → 0.16.12

package/build/@types/components/FormElements/Checkbox/Checkbox.styles.d.ts

@@ -2,3 +2,4 @@ import type { TCheckbox } from './Checkbox';
 import type { TOptionInputContainer } from '../FormElement.types';
 export declare const CheckboxContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, TOptionInputContainer & Pick<TCheckbox, "alignItems">, never>;
 export declare const IconContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const CheckboxInput: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;

package/build/cjs/components/src/components/AddressBlock/AddressBlock.js

@@ -47,11 +47,11 @@ require('../Flex/Flex.styles.js');
 require('../Form/Form.styles.js');
 require('../FormControl/FormControl.js');
 require('../FormElements/FormElement.types.js');
-require('../ScreenReader/ScreenReader.styles.js');
 require('../FormElements/FormElement.styles.js');
 require('../FormElements/Checkbox/Checkbox.styles.js');
 require('../FormElements/Input/Input.js');
 require('../FormElements/InputOld/InputOld.styles.js');
+require('../ScreenReader/ScreenReader.styles.js');
 require('../FormElements/Radio/Radio.styles.js');
 require('../FormElements/Select/Select.styles.js');
 require('../FormElements/Switch/Switch.styles.js');

package/build/cjs/components/src/components/DeliverySlotItem/DeliverySlotItem.js

@@ -13,14 +13,14 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 function DeliverySlotItem(_a) {
     var date = _a.date, selected = _a.selected, children = _a.children, onSelect = _a.onSelect, icon = _a.icon;
-    var momentDate = utils.moment(date);
+    var dateInfo = utils.getDateInfo(date);
     var width = utils.useWindowSize().width;
-    var _b = React.useState(momentDate.format('dddd').toLocaleLowerCase()), weekDay = _b[0], setWeekDay = _b[1];
-    var dayNumber = momentDate.format('D');
-    var month = momentDate.format('MMMM').toLocaleLowerCase();
+    var _b = React.useState(dateInfo.day.name.toLocaleLowerCase()), weekDay = _b[0], setWeekDay = _b[1];
+    var dayNumber = dateInfo.day.number;
+    var month = dateInfo.month.name.toLocaleLowerCase();
     React.useEffect(function () {
-        setWeekDay(momentDate.format('dddd').toLocaleLowerCase());
-    }, [width]);
+        setWeekDay(dateInfo.day.name.toLocaleLowerCase());
+    }, [dateInfo.day.name, width]);
     var slotRef = React.useRef(null);
     return (React__default["default"].createElement(DeliverySlotItem_styles.DeliverySlotItemContainer, { onClick: onSelect, onKeyDown: function (event) {
             if (event.key === 'Enter') {

package/build/cjs/components/src/components/DeliveryTimeBlock/DeliveryTimeBlock.js

@@ -12,14 +12,13 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 function DeliveryTimeBlock(_a) {
-    var _b, _c;
-    var deliveryDate = _a.deliveryDate, deliveryFromTime = _a.deliveryFromTime, deliveryToTime = _a.deliveryToTime, icon = _a.icon, _d = _a.localTimeVar, localTimeVar = _d === void 0 ? 'kl' : _d, deliverOption = _a.deliverOption, children = _a.children;
+    var deliveryDate = _a.deliveryDate, deliveryFromTime = _a.deliveryFromTime, deliveryToTime = _a.deliveryToTime, icon = _a.icon, _b = _a.localTimeVar, localTimeVar = _b === void 0 ? 'kl' : _b, deliverOption = _a.deliverOption, children = _a.children;
     return (React__default["default"].createElement(DeliveryTimeBlock_styles.DeliveryTimeBlock, null,
         React__default["default"].createElement(DeliveryTimeBlock_styles.DeliverOption, null,
             icon && icon,
             deliverOption && React__default["default"].createElement(typography.H3, null, deliverOption)),
-        React__default["default"].createElement(typography.BodyText, null, (_c = (_b = utils.moment(deliveryDate)) === null || _b === void 0 ? void 0 : _b.format('dddd D MMMM')) === null || _c === void 0 ? void 0 :
-            _c.toLocaleLowerCase(),
+        React__default["default"].createElement(typography.BodyText, null,
+            utils.formatDateToLocale(deliveryDate, false, true),
             ' ',
             deliveryFromTime && deliveryToTime && (React__default["default"].createElement("span", { style: { whiteSpace: 'nowrap' } }, "".concat(localTimeVar, " ").concat(deliveryFromTime, " - ").concat(deliveryToTime)))),
         children));

package/build/cjs/components/src/components/DeliveryTimeBlock/DeliveryTimeBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeliveryTimeBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"DeliveryTimeBlock.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/FormElements/Checkbox/Checkbox.js

@@ -7,7 +7,6 @@ var React = require('react');
 var icons = require('@citygross/icons');
 var typography = require('@citygross/typography');
 var formElement = require('../../../helpers/form-element.js');
-var ScreenReader = require('../../ScreenReader/ScreenReader.js');
 var FormElement_styles = require('../FormElement.styles.js');
 var Checkbox_styles = require('./Checkbox.styles.js');
 
@@ -19,11 +18,11 @@ var Checkbox = function (_a) {
     var alignItems = _a.alignItems, checked = _a.checked, disabled = _a.disabled, hideLabel = _a.hideLabel, label = _a.label, props = _tslib.__rest(_a, ["alignItems", "checked", "disabled", "hideLabel", "label"]);
     var _b = formElement.getColorAttributes(checked, disabled), iconColor = _b.iconColor, labelColor = _b.labelColor, attributes = _tslib.__rest(_b, ["iconColor", "labelColor"]);
     return (React__default["default"].createElement(FormElement_styles.OptionInputWrapper, { alignItems: alignItems, as: "label", disabled: disabled },
-        React__default["default"].createElement(FormElement_styles.HiddenInput, _tslib.__assign({ checked: checked, disabled: disabled, type: "checkbox" }, props)),
-        React__default["default"].createElement(Checkbox_styles.CheckboxContainer, { attributes: attributes, alignItems: alignItems },
+        React__default["default"].createElement(Checkbox_styles.CheckboxInput, _tslib.__assign({ "aria-label": label, checked: checked, disabled: disabled, type: "checkbox" }, props)),
+        React__default["default"].createElement(Checkbox_styles.CheckboxContainer, { "aria-hidden": "true", attributes: attributes, alignItems: alignItems },
             React__default["default"].createElement(Checkbox_styles.IconContainer, null,
-                React__default["default"].createElement(icons.Icons.CheckMark, { color: iconColor, "aria-hidden": "true" }))),
-        hideLabel ? (React__default["default"].createElement(ScreenReader.ScreenReader, { string: label })) : (React__default["default"].createElement(typography.BodyText, { color: labelColor }, label))));
+                React__default["default"].createElement(icons.Icons.CheckMark, { color: iconColor }))),
+        !hideLabel && (React__default["default"].createElement(typography.BodyText, { "aria-hidden": "true", color: labelColor }, label))));
 };
 
 exports.Checkbox = Checkbox;

package/build/cjs/components/src/components/FormElements/Checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Checkbox.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/cjs/components/src/components/FormElements/Checkbox/Checkbox.styles.js

@@ -38,8 +38,10 @@ var CheckboxContainer = styled__default["default"].div(templateObject_2 || (temp
     return styled.css(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n    --checkbox-hover-bg: ", ";\n\n    ", ":hover & {\n      background: var(--checkbox-hover-bg);\n    }\n  "], ["\n    --checkbox-hover-bg: ", ";\n\n    ", ":hover & {\n      background: var(--checkbox-hover-bg);\n    }\n  "])), (_b = attributes.hoverBackgroundColor) !== null && _b !== void 0 ? _b : attributes.backgroundColor, FormElement_styles.OptionInputWrapper);
 });
 var IconContainer = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n"])));
-var templateObject_1, templateObject_2, templateObject_3;
+var CheckboxInput = styled__default["default"].input(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  opacity: 0;\n  cursor: inherit;\n"], ["\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  opacity: 0;\n  cursor: inherit;\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
 
 exports.CheckboxContainer = CheckboxContainer;
+exports.CheckboxInput = CheckboxInput;
 exports.IconContainer = IconContainer;
 //# sourceMappingURL=Checkbox.styles.js.map

package/build/cjs/components/src/components/FormElements/Checkbox/Checkbox.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Checkbox.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}