@citygross/components 0.7.31 → 0.7.35

package/build/cjs/components/src/components/Menu/Menu.styles.js

@@ -0,0 +1,20 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../../../_virtual/_tslib.js');
+var styled = require('styled-components');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+var MenuContainer = styled__default['default'].nav(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  position: relative;\n  width: 100%;\n  display: flex;\n  flex-wrap: nowrap;\n  overflow-x: auto;\n  overflow-y: hidden;\n  -webkit-overflow-scrolling: touch;\n  -ms-overflow-style: -ms-autohiding-scrollbar;\n  max-width: ", "px;\n  margin-left: auto;\n  margin-right: auto;\n\n  ::-webkit-scrollbar {\n    background: ", ";\n    height: 2px;\n  }\n\n  ::-webkit-scrollbar-thumb {\n    border-radius: ", "px;\n    background-color: ", ";\n  }\n  /* for mozilla */\n  scrollbar-width: thin;\n  scrollbar-color: ", ";\n\n  @media (min-width: ", "px) {\n    /* for mozila scroll bar */\n    padding: 0 20px;\n    width: calc(100% - 40px);\n  }\n"], ["\n  position: relative;\n  width: 100%;\n  display: flex;\n  flex-wrap: nowrap;\n  overflow-x: auto;\n  overflow-y: hidden;\n  -webkit-overflow-scrolling: touch;\n  -ms-overflow-style: -ms-autohiding-scrollbar;\n  max-width: ", "px;\n  margin-left: auto;\n  margin-right: auto;\n\n  ::-webkit-scrollbar {\n    background: ", ";\n    height: 2px;\n  }\n\n  ::-webkit-scrollbar-thumb {\n    border-radius: ", "px;\n    background-color: ", ";\n  }\n  /* for mozilla */\n  scrollbar-width: thin;\n  scrollbar-color: ", ";\n\n  @media (min-width: ", "px) {\n    /* for mozila scroll bar */\n    padding: 0 20px;\n    width: calc(100% - 40px);\n  }\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.twoColumnsContainerMaxWidth; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.default; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.dark; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.dark; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; });
+var MenuItem = styled__default['default'].a(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  flex: 0 0 auto;\n  font-weight: ", ";\n  padding: ", "px 0;\n  margin: 0 ", "px;\n  display: block;\n  border-bottom: ", "px solid;\n  border-bottom-color: ", ";\n  cursor: pointer;\n  font-size: ", "px;\n\n  &:last-child {\n    position: relative;\n    &::after {\n      position: absolute;\n      content: '';\n      right: -", "px;\n      width: ", "px;\n      height: 100%;\n    }\n  }\n  @media (min-width: ", "px) {\n    &:hover {\n      border-bottom-color: ", ";\n    }\n  }\n"], ["\n  flex: 0 0 auto;\n  font-weight: ", ";\n  padding: ", "px 0;\n  margin: 0 ", "px;\n  display: block;\n  border-bottom: ", "px solid;\n  border-bottom-color: ", ";\n  cursor: pointer;\n  font-size: ", "px;\n\n  &:last-child {\n    position: relative;\n    &::after {\n      position: absolute;\n      content: '';\n      right: -", "px;\n      width: ", "px;\n      height: 100%;\n    }\n  }\n  @media (min-width: ", "px) {\n    &:hover {\n      border-bottom-color: ", ";\n    }\n  }\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.weight.bold; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.tableHeaderVerticalPadding; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return props.active ? "" + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary) : 'transparent'; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary; });
+var Fade = styled__default['default'].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 100%;\n  height: 100%;\n  background: linear-gradient(\n    to right,\n    rgba(255, 255, 255, 0) 80%,\n    rgba(255, 255, 255, 1)\n  );\n  transition: all 0.5s;\n  opacity: ", ";\n"], ["\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 100%;\n  height: 100%;\n  background: linear-gradient(\n    to right,\n    rgba(255, 255, 255, 0) 80%,\n    rgba(255, 255, 255, 1)\n  );\n  transition: all 0.5s;\n  opacity: ", ";\n"])), function (props) { return ((props === null || props === void 0 ? void 0 : props.isVisible) ? '1' : '0'); });
+var templateObject_1, templateObject_2, templateObject_3;
+
+exports.Fade = Fade;
+exports.MenuContainer = MenuContainer;
+exports.MenuItem = MenuItem;
+//# sourceMappingURL=Menu.styles.js.map

package/build/cjs/components/src/components/Menu/Menu.styles.js.map

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

package/build/cjs/components/src/components/Menu/MenuItem.js

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../../../_virtual/_tslib.js');
+var React = require('react');
+var Menu_styles = require('./Menu.styles.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function MenuItem(_a) {
+    var active = _a.active, children = _a.children, props = _tslib.__rest(_a, ["active", "children"]);
+    return (React__default['default'].createElement(Menu_styles.MenuItem, _tslib.__assign({}, props, { active: active }), children));
+}
+
+exports.MenuItem = MenuItem;
+//# sourceMappingURL=MenuItem.js.map

package/build/cjs/components/src/components/Menu/MenuItem.js.map

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

package/build/cjs/components/src/components/Table/Table.styles.js

@@ -0,0 +1,29 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../../../_virtual/_tslib.js');
+var styled = require('styled-components');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+var Table = styled__default['default'].table(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  width: 100%;\n  border: none;\n  border-collapse: collapse;\n  border-spacing: 0;\n"], ["\n  width: 100%;\n  border: none;\n  border-collapse: collapse;\n  border-spacing: 0;\n"])));
+var Thead = styled__default['default'].thead(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  border-bottom: 1px solid\n    ", ";\n"], ["\n  border-bottom: 1px solid\n    ", ";\n"])), function (props) { var _a; return props.borderColor || ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.light); });
+var Th = styled__default['default'].th(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n  position: relative;\n  padding: ", ";\n  font-size: ", "px;\n  font-weight: ", ";\n  text-align: left;\n  &:last-child {\n    text-align: right;\n  }\n  &:first-child {\n    text-align: start;\n  }\n"], ["\n  position: relative;\n  padding: ", ";\n  font-size: ", "px;\n  font-weight: ", ";\n  text-align: left;\n  &:last-child {\n    text-align: right;\n  }\n  &:first-child {\n    text-align: start;\n  }\n"])), function (props) { var _a, _b; return ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.tableHeaderVerticalPadding) + "px " + ((_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.tableRowHorizontalPadding) + "px"; }, function (props) { var _a; return props.fontSize || ((_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3); }, function (props) { var _a; return props.weight || ((_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.weight.regular); });
+var Tr = styled__default['default'].tr(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n  cursor: pointer;\n  &:hover {\n    background-color: ", ";\n  }\n"], ["\n  cursor: pointer;\n  &:hover {\n    background-color: ", ";\n  }\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.lightest; });
+var Td = styled__default['default'].td(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n  padding: ", ";\n  font-size: ", "px;\n  text-align: left;\n  border-bottom: 1px solid\n    ", ";\n  &:last-child {\n    text-align: right;\n  }\n  &:first-child {\n    text-align: start;\n  }\n  text-decoration: ", ";\n  color: ", ";\n"], ["\n  padding: ", ";\n  font-size: ", "px;\n  text-align: left;\n  border-bottom: 1px solid\n    ", ";\n  &:last-child {\n    text-align: right;\n  }\n  &:first-child {\n    text-align: start;\n  }\n  text-decoration: ", ";\n  color: ", ";\n"])), function (props) { var _a, _b; return ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.tableRowVerticalPadding) + "px " + ((_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.tableRowHorizontalPadding) + "px"; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return props.borderColor || ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.light); }, function (props) { return (props.strikeThrough ? 'line-through' : 'none'); }, function (props) {
+    var _a, _b;
+    return props.strikeThrough
+        ? (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.dark
+        : (_b = props.theme.palette) === null || _b === void 0 ? void 0 : _b.darkest;
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
+
+exports.Table = Table;
+exports.Td = Td;
+exports.Th = Th;
+exports.Thead = Thead;
+exports.Tr = Tr;
+//# sourceMappingURL=Table.styles.js.map

package/build/cjs/components/src/components/Table/Table.styles.js.map

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

package/build/cjs/components/src/components/UnorderedList/UnorderedList.styles.js

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../../../_virtual/_tslib.js');
+var styled = require('styled-components');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+var UnorderedList = styled__default['default'].ul(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  padding: 0 ", "px\n    ", "px;\n  list-style: inside disc;\n"], ["\n  padding: 0 ", "px\n    ", "px;\n  list-style: inside disc;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; });
+var UnorderedListItem = styled__default['default'].li(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  margin: ", "px 0;\n  font-size: ", "px;\n  line-height: ", "px;\n"], ["\n  margin: ", "px 0;\n  font-size: ", "px;\n  line-height: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight.s2; });
+var templateObject_1, templateObject_2;
+
+exports.UnorderedList = UnorderedList;
+exports.UnorderedListItem = UnorderedListItem;
+//# sourceMappingURL=UnorderedList.styles.js.map

package/build/cjs/components/src/components/UnorderedList/UnorderedList.styles.js.map

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

package/build/cjs/components/src/containers/TwoColumnsContainer/TwoColumnsPageContainer.js

@@ -15,12 +15,12 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var TwoColumnsPageContainer = function (_a) {
     var _b, _c;
-    var _d = _a.rightColumnWidth, rightColumnWidth = _d === void 0 ? 30 : _d, leftColumn = _a.leftColumn, rightColumn = _a.rightColumn, containerBackground = _a.containerBackground, rightColumnCollapsebleHeader = _a.rightColumnCollapsebleHeader, hideRightColumnBefore = _a.hideRightColumnBefore, _e = _a.breakpoint, breakpoint = _e === void 0 ? (_b = index.theme.breakpoints) === null || _b === void 0 ? void 0 : _b.xl : _e, props = _tslib.__rest(_a, ["rightColumnWidth", "leftColumn", "rightColumn", "containerBackground", "rightColumnCollapsebleHeader", "hideRightColumnBefore", "breakpoint"]);
+    var _d = _a.rightColumnWidth, rightColumnWidth = _d === void 0 ? 30 : _d, leftColumn = _a.leftColumn, rightColumn = _a.rightColumn, containerBackground = _a.containerBackground, rightColumnCollapsebleHeader = _a.rightColumnCollapsebleHeader, hideRightColumnBefore = _a.hideRightColumnBefore, _e = _a.breakpoint, breakpoint = _e === void 0 ? (_b = index.theme.breakpoints) === null || _b === void 0 ? void 0 : _b.xl : _e, _f = _a.noCollapsable, noCollapsable = _f === void 0 ? false : _f, props = _tslib.__rest(_a, ["rightColumnWidth", "leftColumn", "rightColumn", "containerBackground", "rightColumnCollapsebleHeader", "hideRightColumnBefore", "breakpoint", "noCollapsable"]);
     var width = index$1.useWindowSize().width;
     return (React__default['default'].createElement(TwoColumnsPageContainer_styles.Container, _tslib.__assign({ background: containerBackground }, props),
-        React__default['default'].createElement(TwoColumnsPageContainer_styles.ColumnWraper, null,
+        React__default['default'].createElement(TwoColumnsPageContainer_styles.ColumnWraper, { noCollapsable: noCollapsable },
             React__default['default'].createElement(TwoColumnsPageContainer_styles.LeftColumn, null, leftColumn),
-            React__default['default'].createElement(TwoColumnsPageContainer_styles.RightColumn, { columnWidth: rightColumnWidth, hideRightColumnBefore: hideRightColumnBefore }, width > ((breakpoint && breakpoint) || 1060) ? (React__default['default'].createElement(React__default['default'].Fragment, null, rightColumn)) : (React__default['default'].createElement(Collapsable.Collapsable, { heading: rightColumnCollapsebleHeader, backgroundColor: (_c = index.theme.palette) === null || _c === void 0 ? void 0 : _c.white }, rightColumn))))));
+            React__default['default'].createElement(TwoColumnsPageContainer_styles.RightColumn, { columnWidth: rightColumnWidth, hideRightColumnBefore: hideRightColumnBefore }, width > ((breakpoint && breakpoint) || 1060) || noCollapsable ? (React__default['default'].createElement(React__default['default'].Fragment, null, rightColumn)) : (React__default['default'].createElement(Collapsable.Collapsable, { heading: rightColumnCollapsebleHeader, backgroundColor: (_c = index.theme.palette) === null || _c === void 0 ? void 0 : _c.white }, rightColumn))))));
 };
 
 exports.TwoColumnsPageContainer = TwoColumnsPageContainer;

package/build/cjs/components/src/containers/TwoColumnsContainer/TwoColumnsPageContainer.styles.js

@@ -10,7 +10,9 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
 var Container = styled__default['default'].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  padding: ", "px 0px;\n  background: ", ";\n\n  @media (min-width: ", "px) {\n    padding: ", "px\n      ", "px;\n  }\n"], ["\n  padding: ", "px 0px;\n  background: ", ";\n\n  @media (min-width: ", "px) {\n    padding: ", "px\n      ", "px;\n  }\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a, _b; return (_a = props.background) !== null && _a !== void 0 ? _a : (_b = props.theme.palette) === null || _b === void 0 ? void 0 : _b.lightest; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xl; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md; });
-var ColumnWraper = styled__default['default'].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  display: flex;\n  flex-direction: column-reverse;\n  gap: ", "px;\n  max-width: ", "px;\n  margin: 0 auto;\n\n  @media (min-width: ", "px) {\n    flex-direction: row;\n    gap: ", "px;\n  }\n"], ["\n  display: flex;\n  flex-direction: column-reverse;\n  gap: ", "px;\n  max-width: ", "px;\n  margin: 0 auto;\n\n  @media (min-width: ", "px) {\n    flex-direction: row;\n    gap: ", "px;\n  }\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.pageContentMaxWidth; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xl; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
+var ColumnWraper = styled__default['default'].div(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  display: flex;\n  flex-direction: ", ";\n  gap: ", "px;\n  max-width: ", "px;\n  margin: 0 auto;\n\n  @media (min-width: ", "px) {\n    flex-direction: row;\n    gap: ", "px;\n  }\n"], ["\n  display: flex;\n  flex-direction: ", ";\n  gap: ", "px;\n  max-width: ", "px;\n  margin: 0 auto;\n\n  @media (min-width: ", "px) {\n    flex-direction: row;\n    gap: ", "px;\n  }\n"])), function (props) {
+    return props.noCollapsable ? 'column' : 'column-reverse';
+}, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.pageContentMaxWidth; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xl; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
 var LeftColumn = styled__default['default'].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n  flex-grow: 1;\n"], ["\n  flex-grow: 1;\n"])));
 var RightColumn = styled__default['default'].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n  width: 100%;\n  ", "\n\n  @media (min-width: ", "px) {\n    width: ", "%;\n  }\n"], ["\n  width: 100%;\n  ", "\n\n  @media (min-width: ", "px) {\n    width: ", "%;\n  }\n"])), function (props) {
     return props.hideRightColumnBefore &&

package/build/cjs/components/src/containers/TwoColumnsContainer/TwoColumnsPageContainer.styles.js.map

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

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

@@ -17,6 +17,8 @@ var Collapsable = require('./components/Collapsable/Collapsable.js');
 var DeliverySlotItem = require('./components/DeliverySlotItem/DeliverySlotItem.js');
 var Slider = require('./components/Slider/Slider.js');
 var DeliveryTimeBlock = require('./components/DeliveryTimeBlock/DeliveryTimeBlock.js');
+var Menu = require('./components/Menu/Menu.js');
+var MenuItem = require('./components/Menu/MenuItem.js');
 var Divider = require('./components/Divider/Divider.js');
 var DotIndicator = require('./components/DotIndicator/DotIndicator.js');
 var Form = require('./components/Form/Form.js');
@@ -26,6 +28,7 @@ var Input = require('./components/FormElements/Input/Input.js');
 var Radio = require('./components/FormElements/Radio/Radio.js');
 var Switch = require('./components/FormElements/Switch/Switch.js');
 var FormGroup = require('./components/FormGroup/FormGroup.js');
+var GridContainer = require('./components/GridContainer/GridContainer.js');
 var InfoTextBlock = require('./components/InfoTextBlock/InfoTextBlock.js');
 var LayoutBox = require('./components/LayoutBox/LayoutBox.js');
 var ListItem = require('./components/ListItem/ListItem.js');
@@ -43,11 +46,13 @@ var StepperList = require('./components/Stepper/StepperList.js');
 var StepperListItem = require('./components/Stepper/StepperListItem.js');
 var StepperMobile = require('./components/StepperMobile/StepperMobile.js');
 var TextArea = require('./components/FormElements/TextArea/TextArea.js');
+var Table_styles = require('./components/Table/Table.styles.js');
 var Timeline = require('./components/Timeline/Timeline.js');
 var ToolTip = require('./components/ToolTip/ToolTip.js');
 var QuantitySelector = require('./components/QuantitySelector/QuantitySelector.js');
 var PageContainer = require('./containers/PageContainer/PageContainer.js');
 var TwoColumnsPageContainer = require('./containers/TwoColumnsContainer/TwoColumnsPageContainer.js');
+var UnorderedList_styles = require('./components/UnorderedList/UnorderedList.styles.js');
 
 
 
@@ -78,6 +83,8 @@ exports.Collapsable = Collapsable.Collapsable;
 exports.DeliverySlotItem = DeliverySlotItem.DeliverySlotItem;
 exports.Slider = Slider.Slider;
 exports.DeliveryTimeBlock = DeliveryTimeBlock.DeliveryTimeBlock;
+exports.Menu = Menu.Menu;
+exports.MenuItem = MenuItem.MenuItem;
 exports.Divider = Divider.Divider;
 exports.Dot = DotIndicator.Dot;
 exports.Form = Form.Form;
@@ -93,6 +100,7 @@ exports.Input = Input.Input;
 exports.Radio = Radio.Radio;
 exports.Switch = Switch.Switch;
 exports.FormGroup = FormGroup.FormGroup;
+exports.GridContainer = GridContainer.GridContainer;
 exports.InfoWithButtonBlock = InfoTextBlock.InfoWithButtonBlock;
 exports.LayoutBox = LayoutBox.LayoutBox;
 exports.ListItem = ListItem.ListItem;
@@ -122,9 +130,16 @@ exports.StepperList = StepperList.StepperList;
 exports.StepperListItem = StepperListItem.StepperListItem;
 exports.StepperMobile = StepperMobile.StepperMobile;
 exports.TextArea = TextArea.TextArea;
+exports.Table = Table_styles.Table;
+exports.Td = Table_styles.Td;
+exports.Th = Table_styles.Th;
+exports.Thead = Table_styles.Thead;
+exports.Tr = Table_styles.Tr;
 exports.Timeline = Timeline.Timeline;
 exports.ToolTip = ToolTip.ToolTip;
 exports.QuantitySelector = QuantitySelector.QuantitySelector;
 exports.PageContainer = PageContainer.PageContainer;
 exports.TwoColumnsPageContainer = TwoColumnsPageContainer.TwoColumnsPageContainer;
+exports.UnorderedList = UnorderedList_styles.UnorderedList;
+exports.UnorderedListItem = UnorderedList_styles.UnorderedListItem;
 //# sourceMappingURL=index.js.map

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

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

package/build/cjs/design-tokens/build/index.js

@@ -59,7 +59,10 @@ var constants = {
     infoBlockImageMaxWidthDesktop: 100,
     chipCheckBox: 12,
     pageContentMaxWidth: 1232,
-    infoBlockBorderWidth: 4
+    infoBlockBorderWidth: 4,
+    tableRowVerticalPadding: 16,
+    tableRowHorizontalPadding: 14,
+    tableHeaderVerticalPadding: 12
 };
 
 var palette = {

package/build/cjs/design-tokens/build/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../design-tokens/build/index.js"],"sourcesContent":["'use strict';\n\nObject.defineProperty(exports, '__esModule', { value: true });\n\nvar attributes = {\n    borderRadius: {\n        extraSmall: 2,\n        small: 5,\n        default: 10,\n        big: 20\n    },\n    boxShadow: {\n        small: '0 0 46px 0 rgba(0, 0, 0, 0.13)',\n        hover: '0 0 15px 0 rgba(0, 0, 0, 0.13)',\n        buttonHover: '0 1px 5px rgba(0, 0, 0, 0.35)',\n        buttonActive: 'inset 0 0px 5px rgba(0, 0, 0, 0.15)',\n        iconButtonHover: '0 1px 8px rgba(0, 0, 0, 0.35)',\n        layoutShadowInset: 'inset 0 -1px 0 rgba(0, 0, 0, 0.15)',\n        layoutShadow: '0 1px 0 rgba(0, 0, 0, 0.15)',\n        stepperShadow: '0px -5px 20px rgba(0, 0, 0, 0.04), 0px -2px 6px rgba(0, 0, 0, 0.04), 0px 0px 1px rgba(0, 0, 0, 0.04)'\n    },\n    zIndex: {\n        modal: 5,\n        footer: 4,\n        high: 3,\n        middle: 2,\n        low: 1\n    },\n    transition: {\n        t1: '550ms cubic-bezier(0.19, 1, 0.22, 1)',\n        inputTransition: 'box-shadow 250ms ease'\n    }\n};\n\nvar breakpoints = {\n    xs: 480,\n    sm: 576,\n    md: 768,\n    lg: 960,\n    xl: 1060,\n    xxl: 1280,\n    xxxl: 1400\n};\n\nvar constants = {\n    headerScrollFadeRange: 50,\n    modalContainerMaxWidth: 615,\n    modalConfirmMaxWidth: 480,\n    pageContainerMaxWidth: 776,\n    twoColumnsContainerMaxWidth: 1024,\n    deliverySlotItemWidth: 80,\n    deliverySlotItemWidthDesktop: 120,\n    itemGap: 2,\n    ListImageMaxWidth: 64,\n    infoBlockImageMaxWidthDesktop: 100,\n    chipCheckBox: 12,\n    pageContentMaxWidth: 1232,\n    infoBlockBorderWidth: 4\n};\n\nvar palette = {\n    // pallette same as brand colors\n    primary: '#FFE522',\n    secondary: '#0069AE',\n    // brand colors\n    brandYellow: '#FFE522',\n    brandBlue: '#0069AE',\n    brandPurple: '#A71680',\n    // shades\n    yellowLighter: '#FFFBE7',\n    yellowLight: '#FFF7D1',\n    blueLight: '#ECF7FE',\n    blueMedium: '#92B9D3',\n    greenLight: '#F2FDF2',\n    greenMedium: '#BEE5BE',\n    // link same as alert blue\n    link: '#0072BB',\n    // black / white\n    white: '#FFFFFF',\n    black: '#000000',\n    // grayscale\n    lightest: '#F7F7F7',\n    lighter: '#F1F1F1',\n    light: '#E8E8E8',\n    medium: '#DBDBDB',\n    dark: '#979797',\n    darker: '#4A4A4A',\n    darkest: '#333333',\n    border: '#0069AE',\n    boxShadow: '#E1E1E1',\n    boxShadowActive: 'rgba(7, 52, 99, 0.15)',\n    // Alerts\n    alertRed: '#E02721',\n    alertBlue: '#0072BB',\n    alertGreen: '#3F9A3C',\n    // overlay\n    darkOverlay: 'rgba(0, 0, 0, 0.6)',\n    // transparent\n    transparent: '#ffffff00',\n    none: 'none'\n};\n\nvar spacings = {\n    xxs: 4,\n    xs: 8,\n    sm: 16,\n    md: 24,\n    lg: 32,\n    xl: 40,\n    xxl: 56\n    // More in figma, but talk with Johan to generalize it more.\n    // xxx: 72, 88, 120, 152 ?\n};\n\nvar typography = {\n    type: {\n        primary: '\"Poppins\", \"Helvetica Neue\", Helvetica, Arial, sans-serif',\n        code: '\"SFMono-Regular\", Consolas, \"Liberation Mono\", Menlo, Courier, monospace'\n    },\n    weight: {\n        regular: '400',\n        medium: '500',\n        semiBold: '600',\n        bold: '700'\n    },\n    size: {\n        // s all from 0-20\n        s1: 12,\n        s2: 13,\n        s3: 15,\n        s4: 18,\n        // m all from 21-40\n        m1: 24,\n        m2: 30,\n        // l all from 41 >\n        code: 90\n    },\n    lineHeight: {\n        // s all from 0-20\n        s1: 18,\n        s2: 19,\n        // m all from 21-40\n        m1: 22,\n        m2: 27,\n        m3: 36,\n        // l all from 41 >\n        l1: 45\n    }\n};\n\nvar animations = {\n    tapScale: 0.9,\n    hoverScale: 1.1,\n    buttonTransition: 'all 250ms cubic-bezier(0.165, 0.84, 0.44, 1)',\n    rippleTransition: '750ms cubic-bezier(0.19, 1, 0.22, 1)'\n};\n\nvar createTheme = function (_a) {\n    var palette = _a.palette, typography = _a.typography, attributes = _a.attributes, breakpoints = _a.breakpoints, spacings = _a.spacings, constants = _a.constants, animations = _a.animations;\n    return ({\n        palette: palette,\n        typography: typography,\n        attributes: attributes,\n        breakpoints: breakpoints,\n        spacings: spacings,\n        constants: constants,\n        animations: animations\n    });\n};\nvar theme = createTheme({\n    palette: palette,\n    typography: typography,\n    attributes: attributes,\n    breakpoints: breakpoints,\n    spacings: spacings,\n    constants: constants,\n    animations: animations\n});\n\nexports.animations = animations;\nexports.attributes = attributes;\nexports.breakpoints = breakpoints;\nexports.constants = constants;\nexports.palette = palette;\nexports.spacings = spacings;\nexports.theme = theme;\nexports.typography = typography;\n//# sourceMappingURL=index.js.map\n"],"names":["build"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../design-tokens/build/index.js"],"sourcesContent":["'use strict';\n\nObject.defineProperty(exports, '__esModule', { value: true });\n\nvar attributes = {\n    borderRadius: {\n        extraSmall: 2,\n        small: 5,\n        default: 10,\n        big: 20\n    },\n    boxShadow: {\n        small: '0 0 46px 0 rgba(0, 0, 0, 0.13)',\n        hover: '0 0 15px 0 rgba(0, 0, 0, 0.13)',\n        buttonHover: '0 1px 5px rgba(0, 0, 0, 0.35)',\n        buttonActive: 'inset 0 0px 5px rgba(0, 0, 0, 0.15)',\n        iconButtonHover: '0 1px 8px rgba(0, 0, 0, 0.35)',\n        layoutShadowInset: 'inset 0 -1px 0 rgba(0, 0, 0, 0.15)',\n        layoutShadow: '0 1px 0 rgba(0, 0, 0, 0.15)',\n        stepperShadow: '0px -5px 20px rgba(0, 0, 0, 0.04), 0px -2px 6px rgba(0, 0, 0, 0.04), 0px 0px 1px rgba(0, 0, 0, 0.04)'\n    },\n    zIndex: {\n        modal: 5,\n        footer: 4,\n        high: 3,\n        middle: 2,\n        low: 1\n    },\n    transition: {\n        t1: '550ms cubic-bezier(0.19, 1, 0.22, 1)',\n        inputTransition: 'box-shadow 250ms ease'\n    }\n};\n\nvar breakpoints = {\n    xs: 480,\n    sm: 576,\n    md: 768,\n    lg: 960,\n    xl: 1060,\n    xxl: 1280,\n    xxxl: 1400\n};\n\nvar constants = {\n    headerScrollFadeRange: 50,\n    modalContainerMaxWidth: 615,\n    modalConfirmMaxWidth: 480,\n    pageContainerMaxWidth: 776,\n    twoColumnsContainerMaxWidth: 1024,\n    deliverySlotItemWidth: 80,\n    deliverySlotItemWidthDesktop: 120,\n    itemGap: 2,\n    ListImageMaxWidth: 64,\n    infoBlockImageMaxWidthDesktop: 100,\n    chipCheckBox: 12,\n    pageContentMaxWidth: 1232,\n    infoBlockBorderWidth: 4,\n    tableRowVerticalPadding: 16,\n    tableRowHorizontalPadding: 14,\n    tableHeaderVerticalPadding: 12\n};\n\nvar palette = {\n    // pallette same as brand colors\n    primary: '#FFE522',\n    secondary: '#0069AE',\n    // brand colors\n    brandYellow: '#FFE522',\n    brandBlue: '#0069AE',\n    brandPurple: '#A71680',\n    // shades\n    yellowLighter: '#FFFBE7',\n    yellowLight: '#FFF7D1',\n    blueLight: '#ECF7FE',\n    blueMedium: '#92B9D3',\n    greenLight: '#F2FDF2',\n    greenMedium: '#BEE5BE',\n    // link same as alert blue\n    link: '#0072BB',\n    // black / white\n    white: '#FFFFFF',\n    black: '#000000',\n    // grayscale\n    lightest: '#F7F7F7',\n    lighter: '#F1F1F1',\n    light: '#E8E8E8',\n    medium: '#DBDBDB',\n    dark: '#979797',\n    darker: '#4A4A4A',\n    darkest: '#333333',\n    border: '#0069AE',\n    boxShadow: '#E1E1E1',\n    boxShadowActive: 'rgba(7, 52, 99, 0.15)',\n    // Alerts\n    alertRed: '#E02721',\n    alertBlue: '#0072BB',\n    alertGreen: '#3F9A3C',\n    // overlay\n    darkOverlay: 'rgba(0, 0, 0, 0.6)',\n    // transparent\n    transparent: '#ffffff00',\n    none: 'none'\n};\n\nvar spacings = {\n    xxs: 4,\n    xs: 8,\n    sm: 16,\n    md: 24,\n    lg: 32,\n    xl: 40,\n    xxl: 56\n    // More in figma, but talk with Johan to generalize it more.\n    // xxx: 72, 88, 120, 152 ?\n};\n\nvar typography = {\n    type: {\n        primary: '\"Poppins\", \"Helvetica Neue\", Helvetica, Arial, sans-serif',\n        code: '\"SFMono-Regular\", Consolas, \"Liberation Mono\", Menlo, Courier, monospace'\n    },\n    weight: {\n        regular: '400',\n        medium: '500',\n        semiBold: '600',\n        bold: '700'\n    },\n    size: {\n        // s all from 0-20\n        s1: 12,\n        s2: 13,\n        s3: 15,\n        s4: 18,\n        // m all from 21-40\n        m1: 24,\n        m2: 30,\n        // l all from 41 >\n        code: 90\n    },\n    lineHeight: {\n        // s all from 0-20\n        s1: 18,\n        s2: 19,\n        // m all from 21-40\n        m1: 22,\n        m2: 27,\n        m3: 36,\n        // l all from 41 >\n        l1: 45\n    }\n};\n\nvar animations = {\n    tapScale: 0.9,\n    hoverScale: 1.1,\n    buttonTransition: 'all 250ms cubic-bezier(0.165, 0.84, 0.44, 1)',\n    rippleTransition: '750ms cubic-bezier(0.19, 1, 0.22, 1)'\n};\n\nvar createTheme = function (_a) {\n    var palette = _a.palette, typography = _a.typography, attributes = _a.attributes, breakpoints = _a.breakpoints, spacings = _a.spacings, constants = _a.constants, animations = _a.animations;\n    return ({\n        palette: palette,\n        typography: typography,\n        attributes: attributes,\n        breakpoints: breakpoints,\n        spacings: spacings,\n        constants: constants,\n        animations: animations\n    });\n};\nvar theme = createTheme({\n    palette: palette,\n    typography: typography,\n    attributes: attributes,\n    breakpoints: breakpoints,\n    spacings: spacings,\n    constants: constants,\n    animations: animations\n});\n\nexports.animations = animations;\nexports.attributes = attributes;\nexports.breakpoints = breakpoints;\nexports.constants = constants;\nexports.palette = palette;\nexports.spacings = spacings;\nexports.theme = theme;\nexports.typography = typography;\n//# sourceMappingURL=index.js.map\n"],"names":["build"],"mappings":"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"}

package/build/cjs/utils/build/index.js

@@ -47,20 +47,20 @@ var useDetectDevice = function () {
 
 function useWindowSize() {
     var _a = React.useState({
-        width: window.innerWidth,
-        height: window.innerHeight
+        width: typeof window !== 'undefined' ? window.innerWidth : 0,
+        height: typeof window !== 'undefined' ? window.innerHeight : 0
     }), windowSize = _a[0], setWindowSize = _a[1];
     React.useEffect(function () {
         function handleResize() {
             setWindowSize({
                 width: window.innerWidth,
-                height: window.innerHeight,
+                height: window.innerHeight
             });
         }
-        window.addEventListener("resize", handleResize);
+        window.addEventListener('resize', handleResize);
         handleResize();
         // Remove event listener on cleanup
-        return function () { return window.removeEventListener("resize", handleResize); };
+        return function () { return window.removeEventListener('resize', handleResize); };
     }, []);
     return { width: windowSize.width, height: windowSize.height };
 }