@citygross/components 0.8.11 → 0.8.13

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/Links/Link.d.ts +2 -1
  2. package/build/@types/components/Links/Link.styles.d.ts +10 -0
  3. package/build/cjs/components/src/components/CartCard/CartCard.styles.js +2 -2
  4. package/build/cjs/components/src/components/CouponCode/CouponCode.js +1 -1
  5. package/build/cjs/components/src/components/Links/Link.js +8 -2
  6. package/build/cjs/components/src/components/Links/Link.js.map +1 -1
  7. package/build/cjs/components/src/components/Links/Link.styles.js +7 -3
  8. package/build/cjs/components/src/components/Links/Link.styles.js.map +1 -1
  9. package/build/es/components/src/components/CartCard/CartCard.styles.js +2 -2
  10. package/build/es/components/src/components/CouponCode/CouponCode.js +1 -1
  11. package/build/es/components/src/components/Links/Link.js +9 -3
  12. package/build/es/components/src/components/Links/Link.js.map +1 -1
  13. package/build/es/components/src/components/Links/Link.styles.js +7 -5
  14. package/build/es/components/src/components/Links/Link.styles.js.map +1 -1
  15. package/package.json +2 -2
package/build/@types/components/Links/Link.d.ts CHANGED
@@ -23,5 +23,6 @@ export declare type TLink = {
23
23
  borderRadius?: number;
24
24
  tabIndex?: number;
25
25
  inverted?: boolean;
26
+ asButton?: boolean;
26
27
  };
27
- export declare function Link({ center, color, isDisabled, noWrap, onClick, hrefPath, icon, textDecoration, size, target, borderRadius, tabIndex, inverted, children, ...props }: TLink): JSX.Element;
28
+ export declare function Link({ center, color, isDisabled, noWrap, onClick, hrefPath, icon, textDecoration, size, target, borderRadius, tabIndex, inverted, children, asButton, ...props }: TLink): JSX.Element;
package/build/@types/components/Links/Link.styles.d.ts CHANGED
@@ -1,6 +1,16 @@
1
1
  import { TLink } from './Link';
2
+ declare type TBaseLinkButton = Omit<TLink, 'color'> & {
3
+ color: string;
4
+ borderRadius?: number;
5
+ };
6
+ export declare const LinkStyle: import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<TBaseLinkButton, import("styled-components").DefaultTheme>>;
2
7
  export declare const BaseLink: import("styled-components").StyledComponent<"a", import("styled-components").DefaultTheme, Omit<TLink, "color"> & {
3
8
  color: string;
4
9
  borderRadius?: number | undefined;
5
10
  }, never>;
6
11
  export declare const IconWrapper: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
12
+ export declare const LinkAsButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, Omit<TLink, "color"> & {
13
+ color: string;
14
+ borderRadius?: number | undefined;
15
+ }, never>;
16
+ export {};
package/build/cjs/components/src/components/CartCard/CartCard.styles.js CHANGED
@@ -16,8 +16,8 @@ var CartCardInfo = styled__default["default"].div(templateObject_3 || (templateO
16
16
  var CartCardInnerTop = styled__default["default"].div(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n"], ["\n display: flex;\n justify-content: space-between;\n"])));
17
17
  var CartCardInner = styled__default["default"].div(templateObject_5 || (templateObject_5 = _tslib.__makeTemplateObject(["\n flex: 1;\n"], ["\n flex: 1;\n"])));
18
18
  var CartCardPriceContainer = styled__default["default"].div(templateObject_6 || (templateObject_6 = _tslib.__makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-top: ", "px;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-top: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
19
- styled__default["default"].button(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n ", "\n width: ", "px;\n height: ", "px;\n display: grid;\n place-content: center;\n\n border-radius: ", "px;\n"], ["\n ", "\n width: ", "px;\n height: ", "px;\n display: grid;\n place-content: center;\n\n border-radius: ", "px;\n"])), global_styles.focusVisible, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
20
- var MaxWarningAnimate = styled.keyframes(templateObject_8 || (templateObject_8 = _tslib.__makeTemplateObject(["\n0% { display: block }\n100% { display: none }\n"], ["\n0% { display: block }\n100% { display: none }\n"])));
19
+ styled__default["default"].button(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n ", "\n width: ", "px;\n height: ", "px;\n display: grid;\n place-content: center;\n border-radius: ", "px;\n"], ["\n ", "\n width: ", "px;\n height: ", "px;\n display: grid;\n place-content: center;\n border-radius: ", "px;\n"])), global_styles.focusVisible, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
20
+ var MaxWarningAnimate = styled.keyframes(templateObject_8 || (templateObject_8 = _tslib.__makeTemplateObject(["\n0% { \n opacity: 1;\n display: block;\n }\n 90%{\n opacity: 1;\n display: block;\n }\n100% {\n opacity: 0;\n display: none;\n}\n"], ["\n0% { \n opacity: 1;\n display: block;\n }\n 90%{\n opacity: 1;\n display: block;\n }\n100% {\n opacity: 0;\n display: none;\n}\n"])));
21
21
  var PriceContainer = styled__default["default"].div(templateObject_9 || (templateObject_9 = _tslib.__makeTemplateObject(["\n position: relative;\n flex: 1;\n"], ["\n position: relative;\n flex: 1;\n"])));
22
22
  var MaxWarning = styled__default["default"].div(templateObject_10 || (templateObject_10 = _tslib.__makeTemplateObject(["\n color: ", ";\n animation: ", " 2s forwards;\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: ", ";\n font-size: ", "px;\n"], ["\n color: ", ";\n animation: ", " 2s forwards;\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: ", ";\n font-size: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.alertRed; }, MaxWarningAnimate, 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.typography) === null || _a === void 0 ? void 0 : _a.size.s2; });
23
23
  var MarkingsContainer = styled__default["default"].div(templateObject_11 || (templateObject_11 = _tslib.__makeTemplateObject(["\n margin-bottom: ", "px;\n"], ["\n margin-bottom: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
package/build/cjs/components/src/components/CouponCode/CouponCode.js CHANGED
@@ -52,7 +52,7 @@ function CouponCode(_a) {
52
52
  React__default["default"].createElement(CouponCode_styles.CouponResultMessage, null,
53
53
  React__default["default"].createElement(CouponResultIcon, { status: status === null || status === void 0 ? void 0 : status.status }),
54
54
  React__default["default"].createElement("p", null, status === null || status === void 0 ? void 0 : status.message)),
55
- React__default["default"].createElement(Link.Link, { color: "black", size: typography.TextTypes.TextSize.SMALL, textDecoration: "underline", onClick: function () { return onReset(); } }, resetLabel)))))));
55
+ React__default["default"].createElement(Link.Link, { asButton: true, color: "black", size: typography.TextTypes.TextSize.SMALL, textDecoration: "underline", onClick: function () { return onReset(); } }, resetLabel)))))));
56
56
  }
57
57
 
58
58
  exports.CouponCode = CouponCode;
package/build/cjs/components/src/components/Links/Link.js CHANGED
@@ -23,8 +23,14 @@ exports.LinkColors = void 0;
23
23
  LinkColors[LinkColors["black"] = 1] = "black";
24
24
  })(exports.LinkColors || (exports.LinkColors = {}));
25
25
  function Link(_a) {
26
- var _b = _a.center, center = _b === void 0 ? true : _b, _c = _a.color, color = _c === void 0 ? 'link' : _c, isDisabled = _a.isDisabled, noWrap = _a.noWrap, onClick = _a.onClick, hrefPath = _a.hrefPath, icon = _a.icon, _d = _a.textDecoration, textDecoration = _d === void 0 ? 'none' : _d, _e = _a.size, size = _e === void 0 ? typography.TextTypes.TextSize.REGULAR : _e, _f = _a.target, target = _f === void 0 ? '_self' : _f, borderRadius = _a.borderRadius, _g = _a.tabIndex, tabIndex = _g === void 0 ? 0 : _g, _h = _a.inverted, inverted = _h === void 0 ? false : _h, children = _a.children, props = _tslib.__rest(_a, ["center", "color", "isDisabled", "noWrap", "onClick", "hrefPath", "icon", "textDecoration", "size", "target", "borderRadius", "tabIndex", "inverted", "children"]);
27
- return (React__default["default"].createElement(Link_styles.BaseLink, _tslib.__assign({ center: center, tabIndex: isDisabled ? -1 : tabIndex, color: designTokens.theme && designTokens.theme.palette ? designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette[color] : 'black', href: hrefPath, isDisabled: isDisabled, textDecoration: textDecoration, noWrap: noWrap, onClick: onClick, onKeyDown: function (event) {
26
+ var _b = _a.center, center = _b === void 0 ? true : _b, _c = _a.color, color = _c === void 0 ? 'link' : _c, isDisabled = _a.isDisabled, noWrap = _a.noWrap, onClick = _a.onClick, hrefPath = _a.hrefPath, icon = _a.icon, _d = _a.textDecoration, textDecoration = _d === void 0 ? 'none' : _d, _e = _a.size, size = _e === void 0 ? typography.TextTypes.TextSize.REGULAR : _e, _f = _a.target, target = _f === void 0 ? '_self' : _f, borderRadius = _a.borderRadius, _g = _a.tabIndex, tabIndex = _g === void 0 ? 0 : _g, _h = _a.inverted, inverted = _h === void 0 ? false : _h, children = _a.children, asButton = _a.asButton, props = _tslib.__rest(_a, ["center", "color", "isDisabled", "noWrap", "onClick", "hrefPath", "icon", "textDecoration", "size", "target", "borderRadius", "tabIndex", "inverted", "children", "asButton"]);
27
+ return asButton ? (React__default["default"].createElement(Link_styles.LinkAsButton, _tslib.__assign({ center: center, tabIndex: isDisabled ? -1 : tabIndex, color: designTokens.theme && designTokens.theme.palette ? designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette[color] : 'black', isDisabled: isDisabled, textDecoration: textDecoration, noWrap: noWrap, onClick: onClick, onKeyDown: function (event) {
28
+ if (event.key === 'Enter') {
29
+ onClick && onClick();
30
+ }
31
+ }, size: size, icon: icon, borderRadius: borderRadius, inverted: inverted }, props),
32
+ React__default["default"].createElement(typography.LinkText, { size: size }, children),
33
+ icon && React__default["default"].createElement(Link_styles.IconWrapper, null, icon))) : (React__default["default"].createElement(Link_styles.BaseLink, _tslib.__assign({ center: center, tabIndex: isDisabled ? -1 : tabIndex, color: designTokens.theme && designTokens.theme.palette ? designTokens.theme === null || designTokens.theme === void 0 ? void 0 : designTokens.theme.palette[color] : 'black', href: hrefPath, isDisabled: isDisabled, textDecoration: textDecoration, noWrap: noWrap, onClick: onClick, onKeyDown: function (event) {
28
34
  if (event.key === 'Enter') {
29
35
  onClick && onClick();
30
36
  }
package/build/cjs/components/src/components/Links/Link.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Link.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Link.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/cjs/components/src/components/Links/Link.styles.js CHANGED
@@ -10,7 +10,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
10
10
 
11
11
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
12
12
 
13
- var BaseLink = styled__default["default"].a(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n user-select: ", ";\n pointer-events: ", ";\n cursor: pointer;\n text-decoration: ", ";\n\n /* typography */\n color: ", ";\n line-height: ", ";\n white-space: ", ";\n ", "\n\n &:hover {\n text-decoration: ", ";\n }\n border-radius: ", "px;\n\n ", "\n"], ["\n user-select: ", ";\n pointer-events: ", ";\n cursor: pointer;\n text-decoration: ", ";\n\n /* typography */\n color: ", ";\n line-height: ", ";\n white-space: ", ";\n ", "\n\n &:hover {\n text-decoration: ", ";\n }\n border-radius: ", "px;\n\n ", "\n"])), function (props) { return props.isDisabled && 'none'; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.textDecoration; }, function (props) {
13
+ var LinkStyle = styled.css(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n user-select: ", ";\n pointer-events: ", ";\n cursor: pointer;\n text-decoration: ", ";\n\n /* typography */\n color: ", ";\n line-height: ", ";\n white-space: ", ";\n ", "\n\n &:hover {\n text-decoration: ", ";\n }\n border-radius: ", "px;\n\n ", "\n"], ["\n user-select: ", ";\n pointer-events: ", ";\n cursor: pointer;\n text-decoration: ", ";\n\n /* typography */\n color: ", ";\n line-height: ", ";\n white-space: ", ";\n ", "\n\n &:hover {\n text-decoration: ", ";\n }\n border-radius: ", "px;\n\n ", "\n"])), function (props) { return props.isDisabled && 'none'; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.textDecoration; }, function (props) {
14
14
  var _a, _b, _c, _d;
15
15
  return props.inverted
16
16
  ? (props === null || props === void 0 ? void 0 : props.isDisabled)
@@ -41,9 +41,13 @@ var BaseLink = styled__default["default"].a(templateObject_1 || (templateObject_
41
41
  ? props.borderRadius
42
42
  : (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.extraSmall;
43
43
  }, global_styles.focusVisible);
44
- var IconWrapper = styled__default["default"].span(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n display: flex;\n flex: 1;\n justify-content: flex-end;\n"], ["\n display: flex;\n flex: 1;\n justify-content: flex-end;\n"])));
45
- var templateObject_1, templateObject_2;
44
+ var BaseLink = styled__default["default"].a(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), LinkStyle);
45
+ var IconWrapper = styled__default["default"].span(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n display: flex;\n flex: 1;\n justify-content: flex-end;\n"], ["\n display: flex;\n flex: 1;\n justify-content: flex-end;\n"])));
46
+ var LinkAsButton = styled__default["default"].button(templateObject_4 || (templateObject_4 = _tslib.__makeTemplateObject(["\n outline: none;\n border: none;\n background: transparent;\n display: flex;\n ", "\n"], ["\n outline: none;\n border: none;\n background: transparent;\n display: flex;\n ", "\n"])), LinkStyle);
47
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
46
48
 
47
49
  exports.BaseLink = BaseLink;
48
50
  exports.IconWrapper = IconWrapper;
51
+ exports.LinkAsButton = LinkAsButton;
52
+ exports.LinkStyle = LinkStyle;
49
53
  //# sourceMappingURL=Link.styles.js.map
package/build/cjs/components/src/components/Links/Link.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Link.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Link.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/CartCard/CartCard.styles.js CHANGED
@@ -8,8 +8,8 @@ var CartCardInfo = styled.div(templateObject_3 || (templateObject_3 = __makeTemp
8
8
  var CartCardInnerTop = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n"], ["\n display: flex;\n justify-content: space-between;\n"])));
9
9
  var CartCardInner = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n flex: 1;\n"], ["\n flex: 1;\n"])));
10
10
  var CartCardPriceContainer = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-top: ", "px;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-top: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
11
- styled.button(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n ", "\n width: ", "px;\n height: ", "px;\n display: grid;\n place-content: center;\n\n border-radius: ", "px;\n"], ["\n ", "\n width: ", "px;\n height: ", "px;\n display: grid;\n place-content: center;\n\n border-radius: ", "px;\n"])), focusVisible, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
12
- var MaxWarningAnimate = keyframes(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n0% { display: block }\n100% { display: none }\n"], ["\n0% { display: block }\n100% { display: none }\n"])));
11
+ styled.button(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n ", "\n width: ", "px;\n height: ", "px;\n display: grid;\n place-content: center;\n border-radius: ", "px;\n"], ["\n ", "\n width: ", "px;\n height: ", "px;\n display: grid;\n place-content: center;\n border-radius: ", "px;\n"])), focusVisible, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
12
+ var MaxWarningAnimate = keyframes(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n0% { \n opacity: 1;\n display: block;\n }\n 90%{\n opacity: 1;\n display: block;\n }\n100% {\n opacity: 0;\n display: none;\n}\n"], ["\n0% { \n opacity: 1;\n display: block;\n }\n 90%{\n opacity: 1;\n display: block;\n }\n100% {\n opacity: 0;\n display: none;\n}\n"])));
13
13
  var PriceContainer = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n position: relative;\n flex: 1;\n"], ["\n position: relative;\n flex: 1;\n"])));
14
14
  var MaxWarning = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n color: ", ";\n animation: ", " 2s forwards;\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: ", ";\n font-size: ", "px;\n"], ["\n color: ", ";\n animation: ", " 2s forwards;\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n background: ", ";\n font-size: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.alertRed; }, MaxWarningAnimate, 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.typography) === null || _a === void 0 ? void 0 : _a.size.s2; });
15
15
  var MarkingsContainer = styled.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n margin-bottom: ", "px;\n"], ["\n margin-bottom: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; });
package/build/es/components/src/components/CouponCode/CouponCode.js CHANGED
@@ -44,7 +44,7 @@ function CouponCode(_a) {
44
44
  React.createElement(CouponResultMessage, null,
45
45
  React.createElement(CouponResultIcon, { status: status === null || status === void 0 ? void 0 : status.status }),
46
46
  React.createElement("p", null, status === null || status === void 0 ? void 0 : status.message)),
47
- React.createElement(Link, { color: "black", size: TextTypes.TextSize.SMALL, textDecoration: "underline", onClick: function () { return onReset(); } }, resetLabel)))))));
47
+ React.createElement(Link, { asButton: true, color: "black", size: TextTypes.TextSize.SMALL, textDecoration: "underline", onClick: function () { return onReset(); } }, resetLabel)))))));
48
48
  }
49
49
 
50
50
  export { CouponCode, ECouponCodeStatus };
package/build/es/components/src/components/Links/Link.js CHANGED
@@ -2,7 +2,7 @@ import { __rest, __assign } from '../../../../_virtual/_tslib.js';
2
2
  import React from 'react';
3
3
  import { theme } from '@citygross/design-tokens';
4
4
  import { TextTypes, LinkText } from '@citygross/typography';
5
- import { BaseLink, IconWrapper } from './Link.styles.js';
5
+ import { LinkAsButton, IconWrapper, BaseLink } from './Link.styles.js';
6
6
 
7
7
  var LinkSize;
8
8
  (function (LinkSize) {
@@ -15,8 +15,14 @@ var LinkColors;
15
15
  LinkColors[LinkColors["black"] = 1] = "black";
16
16
  })(LinkColors || (LinkColors = {}));
17
17
  function Link(_a) {
18
- var _b = _a.center, center = _b === void 0 ? true : _b, _c = _a.color, color = _c === void 0 ? 'link' : _c, isDisabled = _a.isDisabled, noWrap = _a.noWrap, onClick = _a.onClick, hrefPath = _a.hrefPath, icon = _a.icon, _d = _a.textDecoration, textDecoration = _d === void 0 ? 'none' : _d, _e = _a.size, size = _e === void 0 ? TextTypes.TextSize.REGULAR : _e, _f = _a.target, target = _f === void 0 ? '_self' : _f, borderRadius = _a.borderRadius, _g = _a.tabIndex, tabIndex = _g === void 0 ? 0 : _g, _h = _a.inverted, inverted = _h === void 0 ? false : _h, children = _a.children, props = __rest(_a, ["center", "color", "isDisabled", "noWrap", "onClick", "hrefPath", "icon", "textDecoration", "size", "target", "borderRadius", "tabIndex", "inverted", "children"]);
19
- return (React.createElement(BaseLink, __assign({ center: center, tabIndex: isDisabled ? -1 : tabIndex, color: theme && theme.palette ? theme === null || theme === void 0 ? void 0 : theme.palette[color] : 'black', href: hrefPath, isDisabled: isDisabled, textDecoration: textDecoration, noWrap: noWrap, onClick: onClick, onKeyDown: function (event) {
18
+ var _b = _a.center, center = _b === void 0 ? true : _b, _c = _a.color, color = _c === void 0 ? 'link' : _c, isDisabled = _a.isDisabled, noWrap = _a.noWrap, onClick = _a.onClick, hrefPath = _a.hrefPath, icon = _a.icon, _d = _a.textDecoration, textDecoration = _d === void 0 ? 'none' : _d, _e = _a.size, size = _e === void 0 ? TextTypes.TextSize.REGULAR : _e, _f = _a.target, target = _f === void 0 ? '_self' : _f, borderRadius = _a.borderRadius, _g = _a.tabIndex, tabIndex = _g === void 0 ? 0 : _g, _h = _a.inverted, inverted = _h === void 0 ? false : _h, children = _a.children, asButton = _a.asButton, props = __rest(_a, ["center", "color", "isDisabled", "noWrap", "onClick", "hrefPath", "icon", "textDecoration", "size", "target", "borderRadius", "tabIndex", "inverted", "children", "asButton"]);
19
+ return asButton ? (React.createElement(LinkAsButton, __assign({ center: center, tabIndex: isDisabled ? -1 : tabIndex, color: theme && theme.palette ? theme === null || theme === void 0 ? void 0 : theme.palette[color] : 'black', isDisabled: isDisabled, textDecoration: textDecoration, noWrap: noWrap, onClick: onClick, onKeyDown: function (event) {
20
+ if (event.key === 'Enter') {
21
+ onClick && onClick();
22
+ }
23
+ }, size: size, icon: icon, borderRadius: borderRadius, inverted: inverted }, props),
24
+ React.createElement(LinkText, { size: size }, children),
25
+ icon && React.createElement(IconWrapper, null, icon))) : (React.createElement(BaseLink, __assign({ center: center, tabIndex: isDisabled ? -1 : tabIndex, color: theme && theme.palette ? theme === null || theme === void 0 ? void 0 : theme.palette[color] : 'black', href: hrefPath, isDisabled: isDisabled, textDecoration: textDecoration, noWrap: noWrap, onClick: onClick, onKeyDown: function (event) {
20
26
  if (event.key === 'Enter') {
21
27
  onClick && onClick();
22
28
  }
package/build/es/components/src/components/Links/Link.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Link.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Link.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/es/components/src/components/Links/Link.styles.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
2
- import styled from 'styled-components';
2
+ import styled, { css } from 'styled-components';
3
3
  import { focusVisible } from '../../shared/global.styles.js';
4
4
 
5
- var BaseLink = styled.a(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n user-select: ", ";\n pointer-events: ", ";\n cursor: pointer;\n text-decoration: ", ";\n\n /* typography */\n color: ", ";\n line-height: ", ";\n white-space: ", ";\n ", "\n\n &:hover {\n text-decoration: ", ";\n }\n border-radius: ", "px;\n\n ", "\n"], ["\n user-select: ", ";\n pointer-events: ", ";\n cursor: pointer;\n text-decoration: ", ";\n\n /* typography */\n color: ", ";\n line-height: ", ";\n white-space: ", ";\n ", "\n\n &:hover {\n text-decoration: ", ";\n }\n border-radius: ", "px;\n\n ", "\n"])), function (props) { return props.isDisabled && 'none'; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.textDecoration; }, function (props) {
5
+ var LinkStyle = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n user-select: ", ";\n pointer-events: ", ";\n cursor: pointer;\n text-decoration: ", ";\n\n /* typography */\n color: ", ";\n line-height: ", ";\n white-space: ", ";\n ", "\n\n &:hover {\n text-decoration: ", ";\n }\n border-radius: ", "px;\n\n ", "\n"], ["\n user-select: ", ";\n pointer-events: ", ";\n cursor: pointer;\n text-decoration: ", ";\n\n /* typography */\n color: ", ";\n line-height: ", ";\n white-space: ", ";\n ", "\n\n &:hover {\n text-decoration: ", ";\n }\n border-radius: ", "px;\n\n ", "\n"])), function (props) { return props.isDisabled && 'none'; }, function (props) { return (props.isDisabled ? 'none' : 'all'); }, function (props) { return props.textDecoration; }, function (props) {
6
6
  var _a, _b, _c, _d;
7
7
  return props.inverted
8
8
  ? (props === null || props === void 0 ? void 0 : props.isDisabled)
@@ -33,8 +33,10 @@ var BaseLink = styled.a(templateObject_1 || (templateObject_1 = __makeTemplateOb
33
33
  ? props.borderRadius
34
34
  : (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.extraSmall;
35
35
  }, focusVisible);
36
- var IconWrapper = styled.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n flex: 1;\n justify-content: flex-end;\n"], ["\n display: flex;\n flex: 1;\n justify-content: flex-end;\n"])));
37
- var templateObject_1, templateObject_2;
36
+ var BaseLink = styled.a(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), LinkStyle);
37
+ var IconWrapper = styled.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n flex: 1;\n justify-content: flex-end;\n"], ["\n display: flex;\n flex: 1;\n justify-content: flex-end;\n"])));
38
+ var LinkAsButton = styled.button(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n outline: none;\n border: none;\n background: transparent;\n display: flex;\n ", "\n"], ["\n outline: none;\n border: none;\n background: transparent;\n display: flex;\n ", "\n"])), LinkStyle);
39
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
38
40
 
39
- export { BaseLink, IconWrapper };
41
+ export { BaseLink, IconWrapper, LinkAsButton, LinkStyle };
40
42
  //# sourceMappingURL=Link.styles.js.map
package/build/es/components/src/components/Links/Link.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Link.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Link.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.8.11",
3
+ "version": "0.8.13",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./build/cjs/components/src/index.js",
@@ -76,5 +76,5 @@
76
76
  "react-slick": "^0.30.1",
77
77
  "slick-carousel": "^1.8.1"
78
78
  },
79
- "gitHead": "74636813fbee17b137d3d7b732f5ff3d45086aa0"
79
+ "gitHead": "c875e9e5b0dba0ea7150c3c561dbce9ad02f8ba2"
80
80
  }