@citygross/components 0.7.95 → 0.7.97

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 (15) hide show
  1. package/build/@types/components/Menu/Menu.stories.d.ts +1 -0
  2. package/build/@types/components/Menu/Menu.styles.d.ts +4 -0
  3. package/build/@types/components/Menu/MenuItem.d.ts +5 -1
  4. package/build/@types/components/Timeline/Timeline.d.ts +2 -1
  5. package/build/cjs/components/src/components/Menu/Menu.styles.js +13 -1
  6. package/build/cjs/components/src/components/Menu/Menu.styles.js.map +1 -1
  7. package/build/cjs/components/src/components/Menu/MenuItem.js +2 -2
  8. package/build/cjs/components/src/components/Timeline/Timeline.js +8 -2
  9. package/build/cjs/components/src/components/Timeline/Timeline.js.map +1 -1
  10. package/build/es/components/src/components/Menu/Menu.styles.js +13 -1
  11. package/build/es/components/src/components/Menu/Menu.styles.js.map +1 -1
  12. package/build/es/components/src/components/Menu/MenuItem.js +2 -2
  13. package/build/es/components/src/components/Timeline/Timeline.js +8 -2
  14. package/build/es/components/src/components/Timeline/Timeline.js.map +1 -1
  15. package/package.json +2 -2
package/build/@types/components/Menu/Menu.stories.d.ts CHANGED
@@ -13,3 +13,4 @@ declare const _default: {
13
13
  export default _default;
14
14
  export declare const Default: Story<TMenu>;
15
15
  export declare const Item: Story<TMenuItem>;
16
+ export declare const DeliveryTabs: Story<TMenuItem>;
package/build/@types/components/Menu/Menu.styles.d.ts CHANGED
@@ -3,6 +3,10 @@ export declare type TMenuItem = {
3
3
  active?: boolean;
4
4
  isFirstChild?: boolean;
5
5
  isLastChild?: boolean;
6
+ borderColor?: string;
7
+ fontWeight?: string;
8
+ minWidth?: number;
9
+ textAlign?: string;
6
10
  };
7
11
  export declare type FadeProps = {
8
12
  readonly isVisible?: boolean;
package/build/@types/components/Menu/MenuItem.d.ts CHANGED
@@ -4,5 +4,9 @@ export declare type TMenuItem = AnchorHTMLAttributes<HTMLAnchorElement> & {
4
4
  active?: boolean;
5
5
  isFirstChild?: boolean;
6
6
  isLastChild?: boolean;
7
+ borderColor?: string;
8
+ fontWeight?: string;
9
+ minWidth?: number;
10
+ textAlign?: string;
7
11
  };
8
- export declare function MenuItem({ active, isFirstChild, isLastChild, children, ...props }: TMenuItem): JSX.Element;
12
+ export declare function MenuItem({ active, isFirstChild, isLastChild, borderColor, fontWeight, minWidth, textAlign, children, ...props }: TMenuItem): JSX.Element;
package/build/@types/components/Timeline/Timeline.d.ts CHANGED
@@ -17,5 +17,6 @@ export declare type TTimeline = {
17
17
  borderColor?: string;
18
18
  completedColor?: string;
19
19
  color?: string;
20
+ reversed?: boolean;
20
21
  };
21
- export declare function Timeline({ items, title, mobileTitle, current, dotColor, dotActiveColor, dotShadow, borderStyle, borderColor, color, completedColor }: TTimeline): JSX.Element;
22
+ export declare function Timeline({ items, title, mobileTitle, current, dotColor, dotActiveColor, dotShadow, borderStyle, borderColor, color, reversed, completedColor }: TTimeline): JSX.Element;
package/build/cjs/components/src/components/Menu/Menu.styles.js CHANGED
@@ -10,7 +10,19 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
10
10
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
11
11
 
12
12
  var MenuContainer = styled__default["default"].nav(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n position: relative;\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\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 width: calc(100% - 40px);\n }\n"], ["\n position: relative;\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\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 width: calc(100% - 40px);\n }\n"])), 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; });
13
- 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 display: block;\n border-bottom: ", "px solid;\n border-bottom-color: ", ";\n cursor: pointer;\n font-size: ", "px;\n margin-left: ", "px;\n margin-right: ", "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 display: block;\n border-bottom: ", "px solid;\n border-bottom-color: ", ";\n cursor: pointer;\n font-size: ", "px;\n margin-left: ", "px;\n margin-right: ", "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.semiBold; }, 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.xxs; }, function (props) { var _a; return props.active ? "".concat((_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 props.isFirstChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, function (props) { var _a; return props.isLastChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, 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; });
13
+ var MenuItem = styled__default["default"].a(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n min-width: ", "px;\n text-align: ", ";\n flex: 0 0 auto;\n font-weight: ", ";\n padding: ", "px 0;\n display: block;\n border-bottom: ", "px solid;\n border-bottom-color: ", ";\n cursor: pointer;\n font-size: ", "px;\n margin-left: ", "px;\n margin-right: ", "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 min-width: ", "px;\n text-align: ", ";\n flex: 0 0 auto;\n font-weight: ", ";\n padding: ", "px 0;\n display: block;\n border-bottom: ", "px solid;\n border-bottom-color: ", ";\n cursor: pointer;\n font-size: ", "px;\n margin-left: ", "px;\n margin-right: ", "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) { return props.minWidth && props.minWidth; }, function (props) { return props.textAlign && props.textAlign; }, function (props) {
14
+ var _a;
15
+ return props.fontWeight
16
+ ? props.fontWeight
17
+ : (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.weight.semiBold;
18
+ }, 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.xxs; }, function (props) {
19
+ var _a;
20
+ return props.active
21
+ ? props.borderColor
22
+ ? "".concat(props.borderColor)
23
+ : "".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary)
24
+ : 'transparent';
25
+ }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return props.isFirstChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, function (props) { var _a; return props.isLastChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, 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 props.borderColor ? props.borderColor : (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary; });
14
26
  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'); });
15
27
  var templateObject_1, templateObject_2, templateObject_3;
16
28
 
package/build/cjs/components/src/components/Menu/Menu.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Menu.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Menu.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/cjs/components/src/components/Menu/MenuItem.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 MenuItem(_a) {
14
- var active = _a.active, isFirstChild = _a.isFirstChild, isLastChild = _a.isLastChild, children = _a.children, props = _tslib.__rest(_a, ["active", "isFirstChild", "isLastChild", "children"]);
15
- return (React__default["default"].createElement(Menu_styles.MenuItem, _tslib.__assign({}, props, { isFirstChild: isFirstChild, isLastChild: isLastChild, active: active }), children));
14
+ var active = _a.active, isFirstChild = _a.isFirstChild, isLastChild = _a.isLastChild, borderColor = _a.borderColor, fontWeight = _a.fontWeight, minWidth = _a.minWidth, textAlign = _a.textAlign, children = _a.children, props = _tslib.__rest(_a, ["active", "isFirstChild", "isLastChild", "borderColor", "fontWeight", "minWidth", "textAlign", "children"]);
15
+ return (React__default["default"].createElement(Menu_styles.MenuItem, _tslib.__assign({}, props, { isFirstChild: isFirstChild, isLastChild: isLastChild, active: active, borderColor: borderColor, fontWeight: fontWeight, minWidth: minWidth, textAlign: textAlign }), children));
16
16
  }
17
17
 
18
18
  exports.MenuItem = MenuItem;
package/build/cjs/components/src/components/Timeline/Timeline.js CHANGED
@@ -15,12 +15,18 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
15
15
 
16
16
  function Timeline(_a) {
17
17
  var _b, _c, _d;
18
- var items = _a.items, _e = _a.title, title = _e === void 0 ? 'Vi skickar löpande information när:' : _e, _f = _a.mobileTitle, mobileTitle = _f === void 0 ? 'När din...' : _f, current = _a.current, _g = _a.dotColor, dotColor = _g === void 0 ? (_b = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _b === void 0 ? void 0 : _b.greenLight : _g, _h = _a.dotActiveColor, dotActiveColor = _h === void 0 ? (_c = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _c === void 0 ? void 0 : _c.alertGreen : _h, _j = _a.dotShadow, dotShadow = _j === void 0 ? (_d = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _d === void 0 ? void 0 : _d.greenMedium : _j, _k = _a.borderStyle, borderStyle = _k === void 0 ? 'dashed' : _k, borderColor = _a.borderColor, color = _a.color, completedColor = _a.completedColor;
18
+ var items = _a.items, _e = _a.title, title = _e === void 0 ? 'Vi skickar löpande information när:' : _e, _f = _a.mobileTitle, mobileTitle = _f === void 0 ? 'När din...' : _f, current = _a.current, _g = _a.dotColor, dotColor = _g === void 0 ? (_b = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _b === void 0 ? void 0 : _b.greenLight : _g, _h = _a.dotActiveColor, dotActiveColor = _h === void 0 ? (_c = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _c === void 0 ? void 0 : _c.alertGreen : _h, _j = _a.dotShadow, dotShadow = _j === void 0 ? (_d = designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette) === null || _d === void 0 ? void 0 : _d.greenMedium : _j, _k = _a.borderStyle, borderStyle = _k === void 0 ? 'dashed' : _k, borderColor = _a.borderColor, color = _a.color, reversed = _a.reversed, completedColor = _a.completedColor;
19
19
  var isMobile = utils.useDetectDevice().isMobile;
20
20
  return (React__default["default"].createElement(Timeline_styles.BaseTimeline, null,
21
21
  React__default["default"].createElement(Timeline_styles.TimeLineH3, null, isMobile ? mobileTitle : title),
22
22
  React__default["default"].createElement(Timeline_styles.BaseTimelineList, { borderStyle: borderStyle, borderColor: borderColor }, items.map(function (item, index) { return (React__default["default"].createElement(Timeline_styles.BaseTimelineItem, { key: item.primaryText },
23
- React__default["default"].createElement(DotIndicator.Dot, { color: index <= current ? dotActiveColor : dotColor, shadow: dotShadow }),
23
+ React__default["default"].createElement(DotIndicator.Dot, { color: reversed
24
+ ? index >= current
25
+ ? dotActiveColor
26
+ : dotColor
27
+ : index <= current
28
+ ? dotActiveColor
29
+ : dotColor, shadow: dotShadow }),
24
30
  current === index ? (React__default["default"].createElement(typography.H3, { color: color }, isMobile
25
31
  ? "".concat(item.primaryText, " (").concat(item.time, ")")
26
32
  : "".concat(item.primaryText, " - ").concat(item.time))) : (React__default["default"].createElement(typography.BodyText, { color: completedColor !== null && completedColor !== void 0 ? completedColor : color }, isMobile
package/build/cjs/components/src/components/Timeline/Timeline.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Timeline.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Timeline.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/Menu/Menu.styles.js CHANGED
@@ -2,7 +2,19 @@ import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
2
2
  import styled from 'styled-components';
3
3
 
4
4
  var MenuContainer = styled.nav(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\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\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 width: calc(100% - 40px);\n }\n"], ["\n position: relative;\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\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 width: calc(100% - 40px);\n }\n"])), 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; });
5
- var MenuItem = styled.a(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n flex: 0 0 auto;\n font-weight: ", ";\n padding: ", "px 0;\n display: block;\n border-bottom: ", "px solid;\n border-bottom-color: ", ";\n cursor: pointer;\n font-size: ", "px;\n margin-left: ", "px;\n margin-right: ", "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 display: block;\n border-bottom: ", "px solid;\n border-bottom-color: ", ";\n cursor: pointer;\n font-size: ", "px;\n margin-left: ", "px;\n margin-right: ", "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.semiBold; }, 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.xxs; }, function (props) { var _a; return props.active ? "".concat((_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 props.isFirstChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, function (props) { var _a; return props.isLastChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, 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; });
5
+ var MenuItem = styled.a(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n min-width: ", "px;\n text-align: ", ";\n flex: 0 0 auto;\n font-weight: ", ";\n padding: ", "px 0;\n display: block;\n border-bottom: ", "px solid;\n border-bottom-color: ", ";\n cursor: pointer;\n font-size: ", "px;\n margin-left: ", "px;\n margin-right: ", "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 min-width: ", "px;\n text-align: ", ";\n flex: 0 0 auto;\n font-weight: ", ";\n padding: ", "px 0;\n display: block;\n border-bottom: ", "px solid;\n border-bottom-color: ", ";\n cursor: pointer;\n font-size: ", "px;\n margin-left: ", "px;\n margin-right: ", "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) { return props.minWidth && props.minWidth; }, function (props) { return props.textAlign && props.textAlign; }, function (props) {
6
+ var _a;
7
+ return props.fontWeight
8
+ ? props.fontWeight
9
+ : (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.weight.semiBold;
10
+ }, 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.xxs; }, function (props) {
11
+ var _a;
12
+ return props.active
13
+ ? props.borderColor
14
+ ? "".concat(props.borderColor)
15
+ : "".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary)
16
+ : 'transparent';
17
+ }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return props.isFirstChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, function (props) { var _a; return props.isLastChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, 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 props.borderColor ? props.borderColor : (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary; });
6
18
  var Fade = styled.div(templateObject_3 || (templateObject_3 = __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'); });
7
19
  var templateObject_1, templateObject_2, templateObject_3;
8
20
 
package/build/es/components/src/components/Menu/Menu.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Menu.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
1
+ {"version":3,"file":"Menu.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/Menu/MenuItem.js CHANGED
@@ -3,8 +3,8 @@ import React from 'react';
3
3
  import { MenuItem as MenuItem$1 } from './Menu.styles.js';
4
4
 
5
5
  function MenuItem(_a) {
6
- var active = _a.active, isFirstChild = _a.isFirstChild, isLastChild = _a.isLastChild, children = _a.children, props = __rest(_a, ["active", "isFirstChild", "isLastChild", "children"]);
7
- return (React.createElement(MenuItem$1, __assign({}, props, { isFirstChild: isFirstChild, isLastChild: isLastChild, active: active }), children));
6
+ var active = _a.active, isFirstChild = _a.isFirstChild, isLastChild = _a.isLastChild, borderColor = _a.borderColor, fontWeight = _a.fontWeight, minWidth = _a.minWidth, textAlign = _a.textAlign, children = _a.children, props = __rest(_a, ["active", "isFirstChild", "isLastChild", "borderColor", "fontWeight", "minWidth", "textAlign", "children"]);
7
+ return (React.createElement(MenuItem$1, __assign({}, props, { isFirstChild: isFirstChild, isLastChild: isLastChild, active: active, borderColor: borderColor, fontWeight: fontWeight, minWidth: minWidth, textAlign: textAlign }), children));
8
8
  }
9
9
 
10
10
  export { MenuItem };
package/build/es/components/src/components/Timeline/Timeline.js CHANGED
@@ -7,12 +7,18 @@ import { BaseTimeline, TimeLineH3, BaseTimelineList, BaseTimelineItem } from './
7
7
 
8
8
  function Timeline(_a) {
9
9
  var _b, _c, _d;
10
- var items = _a.items, _e = _a.title, title = _e === void 0 ? 'Vi skickar löpande information när:' : _e, _f = _a.mobileTitle, mobileTitle = _f === void 0 ? 'När din...' : _f, current = _a.current, _g = _a.dotColor, dotColor = _g === void 0 ? (_b = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _b === void 0 ? void 0 : _b.greenLight : _g, _h = _a.dotActiveColor, dotActiveColor = _h === void 0 ? (_c = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _c === void 0 ? void 0 : _c.alertGreen : _h, _j = _a.dotShadow, dotShadow = _j === void 0 ? (_d = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _d === void 0 ? void 0 : _d.greenMedium : _j, _k = _a.borderStyle, borderStyle = _k === void 0 ? 'dashed' : _k, borderColor = _a.borderColor, color = _a.color, completedColor = _a.completedColor;
10
+ var items = _a.items, _e = _a.title, title = _e === void 0 ? 'Vi skickar löpande information när:' : _e, _f = _a.mobileTitle, mobileTitle = _f === void 0 ? 'När din...' : _f, current = _a.current, _g = _a.dotColor, dotColor = _g === void 0 ? (_b = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _b === void 0 ? void 0 : _b.greenLight : _g, _h = _a.dotActiveColor, dotActiveColor = _h === void 0 ? (_c = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _c === void 0 ? void 0 : _c.alertGreen : _h, _j = _a.dotShadow, dotShadow = _j === void 0 ? (_d = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _d === void 0 ? void 0 : _d.greenMedium : _j, _k = _a.borderStyle, borderStyle = _k === void 0 ? 'dashed' : _k, borderColor = _a.borderColor, color = _a.color, reversed = _a.reversed, completedColor = _a.completedColor;
11
11
  var isMobile = useDetectDevice().isMobile;
12
12
  return (React.createElement(BaseTimeline, null,
13
13
  React.createElement(TimeLineH3, null, isMobile ? mobileTitle : title),
14
14
  React.createElement(BaseTimelineList, { borderStyle: borderStyle, borderColor: borderColor }, items.map(function (item, index) { return (React.createElement(BaseTimelineItem, { key: item.primaryText },
15
- React.createElement(Dot, { color: index <= current ? dotActiveColor : dotColor, shadow: dotShadow }),
15
+ React.createElement(Dot, { color: reversed
16
+ ? index >= current
17
+ ? dotActiveColor
18
+ : dotColor
19
+ : index <= current
20
+ ? dotActiveColor
21
+ : dotColor, shadow: dotShadow }),
16
22
  current === index ? (React.createElement(H3, { color: color }, isMobile
17
23
  ? "".concat(item.primaryText, " (").concat(item.time, ")")
18
24
  : "".concat(item.primaryText, " - ").concat(item.time))) : (React.createElement(BodyText, { color: completedColor !== null && completedColor !== void 0 ? completedColor : color }, isMobile
package/build/es/components/src/components/Timeline/Timeline.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Timeline.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Timeline.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.7.95",
3
+ "version": "0.7.97",
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": "613d3bae224dcb241b7c9968c5a2dca30c81d8c9"
74
+ "gitHead": "5d3438e2c9972e0318a6db8266f7691ec650df6b"
75
75
  }