@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.
- package/build/@types/components/CouponCode/CouponCode.d.ts +7 -2
- package/build/cjs/_virtual/_tslib.js +0 -40
- package/build/cjs/_virtual/_tslib.js.map +1 -1
- package/build/cjs/components/src/components/CouponCode/CouponCode.js +10 -37
- package/build/cjs/components/src/components/CouponCode/CouponCode.js.map +1 -1
- package/build/cjs/components/src/components/CouponCode/CouponCode.styles.js +2 -2
- package/build/cjs/components/src/components/Links/Link.js +5 -1
- package/build/cjs/components/src/components/Links/Link.js.map +1 -1
- package/build/es/_virtual/_tslib.js +1 -39
- package/build/es/_virtual/_tslib.js.map +1 -1
- package/build/es/components/src/components/CouponCode/CouponCode.js +10 -37
- package/build/es/components/src/components/CouponCode/CouponCode.js.map +1 -1
- package/build/es/components/src/components/CouponCode/CouponCode.styles.js +2 -2
- package/build/es/components/src/components/Links/Link.js +5 -1
- package/build/es/components/src/components/Links/Link.js.map +1 -1
- package/package.json +2 -2
|
@@ -13,7 +13,12 @@ export declare type TCouponCode = {
|
|
|
13
13
|
label: string;
|
|
14
14
|
resetLabel: string;
|
|
15
15
|
placeholder: string;
|
|
16
|
-
onSubmit: (
|
|
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
|
|
43
|
-
var
|
|
44
|
-
|
|
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
|
-
|
|
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
|
|
74
|
-
React__default["default"].createElement(CouponResultIcon, { status:
|
|
75
|
-
React__default["default"].createElement("p", null,
|
|
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:
|
|
81
|
-
React__default["default"].createElement("p", null,
|
|
82
|
-
React__default["default"].createElement(Link.Link, { color: "black", size: typography.TextTypes.TextSize.SMALL, textDecoration: "underline", onClick: function () { return
|
|
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,
|
|
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,
|
|
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
|
|
35
|
-
var
|
|
36
|
-
|
|
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
|
-
|
|
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
|
|
66
|
-
React.createElement(CouponResultIcon, { status:
|
|
67
|
-
React.createElement("p", null,
|
|
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:
|
|
73
|
-
React.createElement("p", null,
|
|
74
|
-
React.createElement(Link, { color: "black", size: TextTypes.TextSize.SMALL, textDecoration: "underline", onClick: function () { return
|
|
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,
|
|
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
|
+
"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": "
|
|
79
|
+
"gitHead": "6596580388476813cf16b117eed842a89cafdcfe"
|
|
80
80
|
}
|