@citygross/components 0.8.3 → 0.8.5

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.
@@ -13,7 +13,12 @@ export declare type TCouponCode = {
13
13
  label: string;
14
14
  resetLabel: string;
15
15
  placeholder: string;
16
- onSubmit: (value: string) => Promise<TSubmitResult>;
16
+ onSubmit: () => void;
17
+ status?: TSubmitResult;
18
+ loading?: boolean;
19
+ setValue: (value: string) => void;
20
+ value: string;
21
+ onReset: () => void;
17
22
  };
18
- export declare function CouponCode({ label, resetLabel, placeholder, onSubmit }: TCouponCode): JSX.Element;
23
+ export declare function CouponCode({ label, resetLabel, placeholder, onSubmit, status, loading, value, setValue, onReset }: TCouponCode): JSX.Element;
19
24
  export {};
@@ -40,44 +40,6 @@ function __rest(s, e) {
40
40
  return t;
41
41
  }
42
42
 
43
- function __awaiter(thisArg, _arguments, P, generator) {
44
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
45
- return new (P || (P = Promise))(function (resolve, reject) {
46
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
47
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
48
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
49
- step((generator = generator.apply(thisArg, _arguments || [])).next());
50
- });
51
- }
52
-
53
- function __generator(thisArg, body) {
54
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
55
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
56
- function verb(n) { return function (v) { return step([n, v]); }; }
57
- function step(op) {
58
- if (f) throw new TypeError("Generator is already executing.");
59
- while (g && (g = 0, op[0] && (_ = 0)), _) try {
60
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
61
- if (y = 0, t) op = [op[0] & 2, t.value];
62
- switch (op[0]) {
63
- case 0: case 1: t = op; break;
64
- case 4: _.label++; return { value: op[1], done: false };
65
- case 5: _.label++; y = op[1]; op = [0]; continue;
66
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
67
- default:
68
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
69
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
70
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
71
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
72
- if (t[2]) _.ops.pop();
73
- _.trys.pop(); continue;
74
- }
75
- op = body.call(thisArg, _);
76
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
77
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
78
- }
79
- }
80
-
81
43
  function __makeTemplateObject(cooked, raw) {
82
44
  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
83
45
  return cooked;
@@ -87,8 +49,6 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
87
49
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
88
50
  };
89
51
 
90
- exports.__awaiter = __awaiter;
91
- exports.__generator = __generator;
92
52
  exports.__makeTemplateObject = __makeTemplateObject;
93
53
  exports.__rest = __rest;
94
54
  //# sourceMappingURL=_tslib.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"_tslib.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"_tslib.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -2,7 +2,6 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var _tslib = require('../../../../_virtual/_tslib.js');
6
5
  var React = require('react');
7
6
  var CouponCode_styles = require('./CouponCode.styles.js');
8
7
  var CgButton = require('../CgButton/CgButton.js');
@@ -34,52 +33,26 @@ var CouponResultIcon = function (_a) {
34
33
  return (React__default["default"].createElement(icons.Icons.Alert, { color: (_d = designTokens.theme.palette) === null || _d === void 0 ? void 0 : _d.alertRed, width: 20, height: 20 }));
35
34
  }
36
35
  };
37
- var initialResult = {
38
- status: exports.ECouponCodeStatus.Empty,
39
- message: ''
40
- };
41
36
  function CouponCode(_a) {
42
- var _this = this;
43
- var label = _a.label, resetLabel = _a.resetLabel, placeholder = _a.placeholder, onSubmit = _a.onSubmit;
44
- var _b = React.useState(''), value = _b[0], setValue = _b[1];
45
- var _c = React.useState(false), loading = _c[0], setLoading = _c[1];
46
- var _d = React.useState(false), customFocus = _d[0], setCustomFocus = _d[1];
47
- var _e = React.useState(initialResult), result = _e[0], setResult = _e[1];
48
- var handleSubmit = function () { return _tslib.__awaiter(_this, void 0, void 0, function () {
49
- var result;
50
- return _tslib.__generator(this, function (_a) {
51
- switch (_a.label) {
52
- case 0:
53
- setLoading(true);
54
- return [4 /*yield*/, onSubmit(value)];
55
- case 1:
56
- result = _a.sent();
57
- setResult(result);
58
- setLoading(false);
59
- return [2 /*return*/];
60
- }
61
- });
62
- }); };
63
- return (React__default["default"].createElement(React__default["default"].Fragment, null, (result === null || result === void 0 ? void 0 : result.status) === exports.ECouponCodeStatus.Empty ? (React__default["default"].createElement(CouponCode_styles.CouponContainer, null,
37
+ var label = _a.label, resetLabel = _a.resetLabel, placeholder = _a.placeholder, onSubmit = _a.onSubmit, status = _a.status, loading = _a.loading, value = _a.value, setValue = _a.setValue, onReset = _a.onReset;
38
+ var _b = React.useState(false), customFocus = _b[0], setCustomFocus = _b[1];
39
+ return (React__default["default"].createElement(React__default["default"].Fragment, null, (status === null || status === void 0 ? void 0 : status.status) === exports.ECouponCodeStatus.Empty ? (React__default["default"].createElement(CouponCode_styles.CouponContainer, null,
64
40
  React__default["default"].createElement(CouponCode_styles.CouponInputContainer, null,
65
41
  React__default["default"].createElement(CouponCode_styles.CouponInput, { type: "text", placeholder: placeholder, value: value, onChange: function (e) { return setValue(e.currentTarget.value); }, onMouseDown: function () {
66
42
  setCustomFocus(true);
67
43
  }, onKeyDown: function (event) {
68
44
  if (event.key === 'Enter') {
69
- handleSubmit();
45
+ onSubmit();
70
46
  }
71
47
  }, onBlur: function () { return setCustomFocus(false); }, customFocus: customFocus })),
72
48
  React__default["default"].createElement("div", null,
73
- React__default["default"].createElement(CgButton.CgButton, { variant: CgButton.EButtonVariant.secondary, disabled: loading || !value, onClick: function () { return handleSubmit(); }, size: CgButton.ECgButtonSize.medium, fullWidth: true, loading: loading }, label)))) : (React__default["default"].createElement(CouponCode_styles.CouponResultContainer, { status: result === null || result === void 0 ? void 0 : result.status }, (result === null || result === void 0 ? void 0 : result.status) === exports.ECouponCodeStatus.Success ? (React__default["default"].createElement(CouponCode_styles.CouponResultMessage, null,
74
- React__default["default"].createElement(CouponResultIcon, { status: result === null || result === void 0 ? void 0 : result.status }),
75
- React__default["default"].createElement("p", null, result === null || result === void 0 ? void 0 :
76
- result.message,
77
- " ",
78
- value))) : (React__default["default"].createElement(React__default["default"].Fragment, null,
49
+ React__default["default"].createElement(CgButton.CgButton, { variant: CgButton.EButtonVariant.secondary, disabled: loading || !value, onClick: function () { return onSubmit(); }, size: CgButton.ECgButtonSize.medium, fullWidth: true, loading: loading }, label)))) : (React__default["default"].createElement(CouponCode_styles.CouponResultContainer, { status: status === null || status === void 0 ? void 0 : status.status }, (status === null || status === void 0 ? void 0 : status.status) === exports.ECouponCodeStatus.Success ? (React__default["default"].createElement(CouponCode_styles.CouponResultMessage, null,
50
+ React__default["default"].createElement(CouponResultIcon, { status: status === null || status === void 0 ? void 0 : status.status }),
51
+ React__default["default"].createElement("p", null, status === null || status === void 0 ? void 0 : status.message))) : (React__default["default"].createElement(React__default["default"].Fragment, null,
79
52
  React__default["default"].createElement(CouponCode_styles.CouponResultMessage, null,
80
- React__default["default"].createElement(CouponResultIcon, { status: result.status }),
81
- React__default["default"].createElement("p", null, result === null || result === void 0 ? void 0 : result.message)),
82
- React__default["default"].createElement(Link.Link, { color: "black", size: typography.TextTypes.TextSize.SMALL, textDecoration: "underline", onClick: function () { return setResult(initialResult); } }, resetLabel)))))));
53
+ React__default["default"].createElement(CouponResultIcon, { status: status === null || status === void 0 ? void 0 : status.status }),
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)))))));
83
56
  }
84
57
 
85
58
  exports.CouponCode = CouponCode;
@@ -1 +1 @@
1
- {"version":3,"file":"CouponCode.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"CouponCode.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -12,8 +12,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
12
12
  var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
13
13
 
14
14
  var CouponContainer = styled__default["default"].div(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n display: flex;\n gap: ", "px;\n width: 100%;\n"], ["\n display: flex;\n gap: ", "px;\n width: 100%;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs2; });
15
- var CouponInput = styled__default["default"].input(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n border-radius: ", "px;\n border: 1px solid ", ";\n background: ", ";\n padding: ", ";\n outline: none;\n background: white;\n font-size: ", "px;\n width: 100%;\n\n ", "\n &:focus-visible {\n border: 1px solid ", ";\n }\n"], ["\n border-radius: ", "px;\n border: 1px solid ", ";\n background: ", ";\n padding: ", ";\n outline: none;\n background: white;\n font-size: ", "px;\n width: 100%;\n\n ", "\n &:focus-visible {\n border: 1px solid ", ";\n }\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.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a, _b; return "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs2, "px"); }, function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.s3; }, function (props) { return !props.customFocus && global_styles.focusVisible; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.brandBlue; });
16
- var CouponResultContainer = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n padding: ", ";\n background: ", ";\n display: flex;\n height: ", "px;\n border-radius: ", "px;\n justify-content: space-between;\n"], ["\n font-size: ", "px;\n padding: ", ";\n background: ", ";\n display: flex;\n height: ", "px;\n border-radius: ", "px;\n justify-content: space-between;\n"])), function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.s2; }, function (props) { var _a, _b; return "".concat((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.couponContainerPadding, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs, "px"); }, function (props) {
15
+ var CouponInput = styled__default["default"].input(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n border-radius: ", "px;\n border: 1px solid ", ";\n background: ", ";\n padding: ", ";\n outline: none;\n background: white;\n font-size: ", "px;\n width: 100%;\n ::placeholder {\n color: ", ";\n opacity: 1; /* Firefox */\n }\n\n ::-ms-input-placeholder {\n color: ", ";\n }\n ", "\n &:focus-visible {\n border: 1px solid ", ";\n }\n"], ["\n border-radius: ", "px;\n border: 1px solid ", ";\n background: ", ";\n padding: ", ";\n outline: none;\n background: white;\n font-size: ", "px;\n width: 100%;\n ::placeholder {\n color: ", ";\n opacity: 1; /* Firefox */\n }\n\n ::-ms-input-placeholder {\n color: ", ";\n }\n ", "\n &:focus-visible {\n border: 1px solid ", ";\n }\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.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a, _b; return "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs2, "px"); }, function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.s3; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; }, function (props) { return !props.customFocus && global_styles.focusVisible; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.brandBlue; });
16
+ var CouponResultContainer = styled__default["default"].div(templateObject_3 || (templateObject_3 = _tslib.__makeTemplateObject(["\n font-size: ", "px;\n padding: ", ";\n background: ", ";\n display: flex;\n min-height: ", "px;\n border-radius: ", "px;\n justify-content: space-between;\n"], ["\n font-size: ", "px;\n padding: ", ";\n background: ", ";\n display: flex;\n min-height: ", "px;\n border-radius: ", "px;\n justify-content: space-between;\n"])), function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.s2; }, function (props) { var _a, _b; return "".concat((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.couponContainerPadding, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs, "px"); }, function (props) {
17
17
  var _a, _b;
18
18
  return props.status === CouponCode.ECouponCodeStatus.Success
19
19
  ? (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.greenLight
@@ -24,7 +24,11 @@ exports.LinkColors = void 0;
24
24
  })(exports.LinkColors || (exports.LinkColors = {}));
25
25
  function Link(_a) {
26
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, size: size, icon: icon, borderRadius: borderRadius, inverted: inverted, target: target }, props),
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) {
28
+ if (event.key === 'Enter') {
29
+ onClick && onClick();
30
+ }
31
+ }, size: size, icon: icon, borderRadius: borderRadius, inverted: inverted, target: target }, props),
28
32
  React__default["default"].createElement(typography.LinkText, { size: size }, children),
29
33
  icon && React__default["default"].createElement(Link_styles.IconWrapper, null, icon)));
30
34
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Link.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Link.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -36,44 +36,6 @@ function __rest(s, e) {
36
36
  return t;
37
37
  }
38
38
 
39
- function __awaiter(thisArg, _arguments, P, generator) {
40
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
41
- return new (P || (P = Promise))(function (resolve, reject) {
42
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
43
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
44
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
45
- step((generator = generator.apply(thisArg, _arguments || [])).next());
46
- });
47
- }
48
-
49
- function __generator(thisArg, body) {
50
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
51
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
52
- function verb(n) { return function (v) { return step([n, v]); }; }
53
- function step(op) {
54
- if (f) throw new TypeError("Generator is already executing.");
55
- while (g && (g = 0, op[0] && (_ = 0)), _) try {
56
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
57
- if (y = 0, t) op = [op[0] & 2, t.value];
58
- switch (op[0]) {
59
- case 0: case 1: t = op; break;
60
- case 4: _.label++; return { value: op[1], done: false };
61
- case 5: _.label++; y = op[1]; op = [0]; continue;
62
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
63
- default:
64
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
65
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
66
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
67
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
68
- if (t[2]) _.ops.pop();
69
- _.trys.pop(); continue;
70
- }
71
- op = body.call(thisArg, _);
72
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
73
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
74
- }
75
- }
76
-
77
39
  function __makeTemplateObject(cooked, raw) {
78
40
  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
79
41
  return cooked;
@@ -83,5 +45,5 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
83
45
  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
84
46
  };
85
47
 
86
- export { __assign, __awaiter, __generator, __makeTemplateObject, __rest };
48
+ export { __assign, __makeTemplateObject, __rest };
87
49
  //# sourceMappingURL=_tslib.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"_tslib.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"_tslib.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,4 +1,3 @@
1
- import { __awaiter, __generator } from '../../../../_virtual/_tslib.js';
2
1
  import React, { useState } from 'react';
3
2
  import { CouponContainer, CouponInputContainer, CouponInput, CouponResultContainer, CouponResultMessage } from './CouponCode.styles.js';
4
3
  import { CgButton, EButtonVariant, ECgButtonSize } from '../CgButton/CgButton.js';
@@ -26,52 +25,26 @@ var CouponResultIcon = function (_a) {
26
25
  return (React.createElement(Icons.Alert, { color: (_d = theme.palette) === null || _d === void 0 ? void 0 : _d.alertRed, width: 20, height: 20 }));
27
26
  }
28
27
  };
29
- var initialResult = {
30
- status: ECouponCodeStatus.Empty,
31
- message: ''
32
- };
33
28
  function CouponCode(_a) {
34
- var _this = this;
35
- var label = _a.label, resetLabel = _a.resetLabel, placeholder = _a.placeholder, onSubmit = _a.onSubmit;
36
- var _b = useState(''), value = _b[0], setValue = _b[1];
37
- var _c = useState(false), loading = _c[0], setLoading = _c[1];
38
- var _d = useState(false), customFocus = _d[0], setCustomFocus = _d[1];
39
- var _e = useState(initialResult), result = _e[0], setResult = _e[1];
40
- var handleSubmit = function () { return __awaiter(_this, void 0, void 0, function () {
41
- var result;
42
- return __generator(this, function (_a) {
43
- switch (_a.label) {
44
- case 0:
45
- setLoading(true);
46
- return [4 /*yield*/, onSubmit(value)];
47
- case 1:
48
- result = _a.sent();
49
- setResult(result);
50
- setLoading(false);
51
- return [2 /*return*/];
52
- }
53
- });
54
- }); };
55
- return (React.createElement(React.Fragment, null, (result === null || result === void 0 ? void 0 : result.status) === ECouponCodeStatus.Empty ? (React.createElement(CouponContainer, null,
29
+ var label = _a.label, resetLabel = _a.resetLabel, placeholder = _a.placeholder, onSubmit = _a.onSubmit, status = _a.status, loading = _a.loading, value = _a.value, setValue = _a.setValue, onReset = _a.onReset;
30
+ var _b = useState(false), customFocus = _b[0], setCustomFocus = _b[1];
31
+ return (React.createElement(React.Fragment, null, (status === null || status === void 0 ? void 0 : status.status) === ECouponCodeStatus.Empty ? (React.createElement(CouponContainer, null,
56
32
  React.createElement(CouponInputContainer, null,
57
33
  React.createElement(CouponInput, { type: "text", placeholder: placeholder, value: value, onChange: function (e) { return setValue(e.currentTarget.value); }, onMouseDown: function () {
58
34
  setCustomFocus(true);
59
35
  }, onKeyDown: function (event) {
60
36
  if (event.key === 'Enter') {
61
- handleSubmit();
37
+ onSubmit();
62
38
  }
63
39
  }, onBlur: function () { return setCustomFocus(false); }, customFocus: customFocus })),
64
40
  React.createElement("div", null,
65
- React.createElement(CgButton, { variant: EButtonVariant.secondary, disabled: loading || !value, onClick: function () { return handleSubmit(); }, size: ECgButtonSize.medium, fullWidth: true, loading: loading }, label)))) : (React.createElement(CouponResultContainer, { status: result === null || result === void 0 ? void 0 : result.status }, (result === null || result === void 0 ? void 0 : result.status) === ECouponCodeStatus.Success ? (React.createElement(CouponResultMessage, null,
66
- React.createElement(CouponResultIcon, { status: result === null || result === void 0 ? void 0 : result.status }),
67
- React.createElement("p", null, result === null || result === void 0 ? void 0 :
68
- result.message,
69
- " ",
70
- value))) : (React.createElement(React.Fragment, null,
41
+ React.createElement(CgButton, { variant: EButtonVariant.secondary, disabled: loading || !value, onClick: function () { return onSubmit(); }, size: ECgButtonSize.medium, fullWidth: true, loading: loading }, label)))) : (React.createElement(CouponResultContainer, { status: status === null || status === void 0 ? void 0 : status.status }, (status === null || status === void 0 ? void 0 : status.status) === ECouponCodeStatus.Success ? (React.createElement(CouponResultMessage, null,
42
+ React.createElement(CouponResultIcon, { status: status === null || status === void 0 ? void 0 : status.status }),
43
+ React.createElement("p", null, status === null || status === void 0 ? void 0 : status.message))) : (React.createElement(React.Fragment, null,
71
44
  React.createElement(CouponResultMessage, null,
72
- React.createElement(CouponResultIcon, { status: result.status }),
73
- React.createElement("p", null, result === null || result === void 0 ? void 0 : result.message)),
74
- React.createElement(Link, { color: "black", size: TextTypes.TextSize.SMALL, textDecoration: "underline", onClick: function () { return setResult(initialResult); } }, resetLabel)))))));
45
+ React.createElement(CouponResultIcon, { status: status === null || status === void 0 ? void 0 : status.status }),
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)))))));
75
48
  }
76
49
 
77
50
  export { CouponCode, ECouponCodeStatus };
@@ -1 +1 @@
1
- {"version":3,"file":"CouponCode.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"CouponCode.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -4,8 +4,8 @@ import { focusVisible } from '../../shared/global.styles.js';
4
4
  import { ECouponCodeStatus } from './CouponCode.js';
5
5
 
6
6
  var CouponContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n gap: ", "px;\n width: 100%;\n"], ["\n display: flex;\n gap: ", "px;\n width: 100%;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs2; });
7
- var CouponInput = styled.input(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-radius: ", "px;\n border: 1px solid ", ";\n background: ", ";\n padding: ", ";\n outline: none;\n background: white;\n font-size: ", "px;\n width: 100%;\n\n ", "\n &:focus-visible {\n border: 1px solid ", ";\n }\n"], ["\n border-radius: ", "px;\n border: 1px solid ", ";\n background: ", ";\n padding: ", ";\n outline: none;\n background: white;\n font-size: ", "px;\n width: 100%;\n\n ", "\n &:focus-visible {\n border: 1px solid ", ";\n }\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.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a, _b; return "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs2, "px"); }, function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.s3; }, function (props) { return !props.customFocus && focusVisible; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.brandBlue; });
8
- var CouponResultContainer = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-size: ", "px;\n padding: ", ";\n background: ", ";\n display: flex;\n height: ", "px;\n border-radius: ", "px;\n justify-content: space-between;\n"], ["\n font-size: ", "px;\n padding: ", ";\n background: ", ";\n display: flex;\n height: ", "px;\n border-radius: ", "px;\n justify-content: space-between;\n"])), function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.s2; }, function (props) { var _a, _b; return "".concat((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.couponContainerPadding, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs, "px"); }, function (props) {
7
+ var CouponInput = styled.input(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-radius: ", "px;\n border: 1px solid ", ";\n background: ", ";\n padding: ", ";\n outline: none;\n background: white;\n font-size: ", "px;\n width: 100%;\n ::placeholder {\n color: ", ";\n opacity: 1; /* Firefox */\n }\n\n ::-ms-input-placeholder {\n color: ", ";\n }\n ", "\n &:focus-visible {\n border: 1px solid ", ";\n }\n"], ["\n border-radius: ", "px;\n border: 1px solid ", ";\n background: ", ";\n padding: ", ";\n outline: none;\n background: white;\n font-size: ", "px;\n width: 100%;\n ::placeholder {\n color: ", ";\n opacity: 1; /* Firefox */\n }\n\n ::-ms-input-placeholder {\n color: ", ";\n }\n ", "\n &:focus-visible {\n border: 1px solid ", ";\n }\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.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a, _b; return "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs2, "px"); }, function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.s3; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.disabledGray; }, function (props) { return !props.customFocus && focusVisible; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.brandBlue; });
8
+ var CouponResultContainer = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n font-size: ", "px;\n padding: ", ";\n background: ", ";\n display: flex;\n min-height: ", "px;\n border-radius: ", "px;\n justify-content: space-between;\n"], ["\n font-size: ", "px;\n padding: ", ";\n background: ", ";\n display: flex;\n min-height: ", "px;\n border-radius: ", "px;\n justify-content: space-between;\n"])), function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.s2; }, function (props) { var _a, _b; return "".concat((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.couponContainerPadding, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs, "px"); }, function (props) {
9
9
  var _a, _b;
10
10
  return props.status === ECouponCodeStatus.Success
11
11
  ? (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.greenLight
@@ -16,7 +16,11 @@ var LinkColors;
16
16
  })(LinkColors || (LinkColors = {}));
17
17
  function Link(_a) {
18
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, size: size, icon: icon, borderRadius: borderRadius, inverted: inverted, target: target }, props),
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) {
20
+ if (event.key === 'Enter') {
21
+ onClick && onClick();
22
+ }
23
+ }, size: size, icon: icon, borderRadius: borderRadius, inverted: inverted, target: target }, props),
20
24
  React.createElement(LinkText, { size: size }, children),
21
25
  icon && React.createElement(IconWrapper, null, icon)));
22
26
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Link.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"Link.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.8.3",
3
+ "version": "0.8.5",
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": "c10e60eb7ba6f2588bb83d19af343a79daa77148"
79
+ "gitHead": "6596580388476813cf16b117eed842a89cafdcfe"
80
80
  }