@invoicebox/ui 0.1.0-alpha.326 → 0.1.0-alpha.327

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 (58) hide show
  1. package/dist/components/common/AdaptiveModalDrawer/index.d.ts +11 -0
  2. package/dist/components/common/AdaptiveModalDrawer/index.js +31 -0
  3. package/dist/components/common/AdaptiveModalDrawer/index.stories.d.ts +5 -0
  4. package/dist/components/common/AdaptiveModalDrawer/index.stories.js +44 -0
  5. package/dist/components/common/Modal/assets/CollapseIcon.d.ts +1 -0
  6. package/dist/components/common/Modal/assets/CollapseIcon.js +42 -0
  7. package/dist/components/common/Modal/assets/ExpandIcon.d.ts +1 -0
  8. package/dist/components/common/Modal/assets/ExpandIcon.js +42 -0
  9. package/dist/components/common/Modal/context.d.ts +9 -0
  10. package/dist/components/common/Modal/context.js +14 -0
  11. package/dist/components/common/Modal/index.d.ts +15 -0
  12. package/dist/components/common/Modal/index.js +165 -0
  13. package/dist/components/common/Modal/index.stories.d.ts +6 -0
  14. package/dist/components/common/Modal/index.stories.js +76 -0
  15. package/dist/components/common/Modal/palette.d.ts +9 -0
  16. package/dist/components/common/Modal/palette.js +23 -0
  17. package/dist/components/common/Modal/styles.d.ts +25 -0
  18. package/dist/components/common/Modal/styles.js +69 -0
  19. package/dist/components/common/WentWrongModal/assets/icons.d.ts +3 -0
  20. package/dist/components/common/WentWrongModal/assets/icons.js +84 -0
  21. package/dist/components/common/WentWrongModal/assets/racoonImage.d.ts +1 -0
  22. package/dist/components/common/WentWrongModal/assets/racoonImage.js +9 -0
  23. package/dist/components/common/WentWrongModal/index.d.ts +23 -0
  24. package/dist/components/common/WentWrongModal/index.js +193 -0
  25. package/dist/components/common/WentWrongModal/index.stories.d.ts +6 -0
  26. package/dist/components/common/WentWrongModal/index.stories.js +60 -0
  27. package/dist/components/common/WentWrongModal/index.test.d.ts +1 -0
  28. package/dist/components/common/WentWrongModal/index.test.js +209 -0
  29. package/dist/components/common/WentWrongModal/palette.d.ts +11 -0
  30. package/dist/components/common/WentWrongModal/palette.js +22 -0
  31. package/dist/components/common/WentWrongModal/styles.d.ts +24 -0
  32. package/dist/components/common/WentWrongModal/styles.js +88 -0
  33. package/dist/esm/components/common/AdaptiveModalDrawer/index.js +24 -0
  34. package/dist/esm/components/common/AdaptiveModalDrawer/index.stories.js +37 -0
  35. package/dist/esm/components/common/Modal/assets/CollapseIcon.js +35 -0
  36. package/dist/esm/components/common/Modal/assets/ExpandIcon.js +35 -0
  37. package/dist/esm/components/common/Modal/context.js +8 -0
  38. package/dist/esm/components/common/Modal/index.js +147 -0
  39. package/dist/esm/components/common/Modal/index.stories.js +69 -0
  40. package/dist/esm/components/common/Modal/palette.js +16 -0
  41. package/dist/esm/components/common/Modal/styles.js +61 -0
  42. package/dist/esm/components/common/WentWrongModal/assets/icons.js +77 -0
  43. package/dist/esm/components/common/WentWrongModal/assets/racoonImage.js +3 -0
  44. package/dist/esm/components/common/WentWrongModal/index.js +186 -0
  45. package/dist/esm/components/common/WentWrongModal/index.stories.js +53 -0
  46. package/dist/esm/components/common/WentWrongModal/index.test.js +208 -0
  47. package/dist/esm/components/common/WentWrongModal/palette.js +15 -0
  48. package/dist/esm/components/common/WentWrongModal/styles.js +81 -0
  49. package/dist/esm/index.js +3 -1
  50. package/dist/esm/palette/context.js +5 -1
  51. package/dist/esm/palette/provider.js +5 -1
  52. package/dist/index.d.ts +6 -0
  53. package/dist/index.js +39 -0
  54. package/dist/palette/context.d.ts +4 -0
  55. package/dist/palette/context.js +5 -1
  56. package/dist/palette/provider.js +5 -1
  57. package/dist/palette/usePalette.d.ts +2 -0
  58. package/package.json +1 -1
@@ -0,0 +1,186 @@
1
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
+ function _regeneratorRuntime() { "use strict"; var r = _regenerator(), e = r.m(_regeneratorRuntime), t = (Object.getPrototypeOf ? Object.getPrototypeOf(e) : e.__proto__).constructor; function n(r) { var e = "function" == typeof r && r.constructor; return !!e && (e === t || "GeneratorFunction" === (e.displayName || e.name)); } var o = { "throw": 1, "return": 2, "break": 3, "continue": 3 }; function a(r) { var e, t; return function (n) { e || (e = { stop: function stop() { return t(n.a, 2); }, "catch": function _catch() { return n.v; }, abrupt: function abrupt(r, e) { return t(n.a, o[r], e); }, delegateYield: function delegateYield(r, o, a) { return e.resultName = o, t(n.d, _regeneratorValues(r), a); }, finish: function finish(r) { return t(n.f, r); } }, t = function t(r, _t, o) { n.p = e.prev, n.n = e.next; try { return r(_t, o); } finally { e.next = n.n; } }), e.resultName && (e[e.resultName] = n.v, e.resultName = void 0), e.sent = n.v, e.next = n.n; try { return r.call(this, e); } finally { n.p = e.prev, n.n = e.next; } }; } return (_regeneratorRuntime = function _regeneratorRuntime() { return { wrap: function wrap(e, t, n, o) { return r.w(a(e), t, n, o && o.reverse()); }, isGeneratorFunction: n, mark: r.m, awrap: function awrap(r, e) { return new _OverloadYield(r, e); }, AsyncIterator: _regeneratorAsyncIterator, async: function async(r, e, t, o, u) { return (n(e) ? _regeneratorAsyncGen : _regeneratorAsync)(a(r), e, t, o, u); }, keys: _regeneratorKeys, values: _regeneratorValues }; })(); }
3
+ function _regeneratorValues(e) { if (null != e) { var t = e["function" == typeof Symbol && Symbol.iterator || "@@iterator"], r = 0; if (t) return t.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) return { next: function next() { return e && r >= e.length && (e = void 0), { value: e && e[r++], done: !e }; } }; } throw new TypeError(_typeof(e) + " is not iterable"); }
4
+ function _regeneratorKeys(e) { var n = Object(e), r = []; for (var t in n) r.unshift(t); return function e() { for (; r.length;) if ((t = r.pop()) in n) return e.value = t, e.done = !1, e; return e.done = !0, e; }; }
5
+ function _regeneratorAsync(n, e, r, t, o) { var a = _regeneratorAsyncGen(n, e, r, t, o); return a.next().then(function (n) { return n.done ? n.value : a.next(); }); }
6
+ function _regeneratorAsyncGen(r, e, t, o, n) { return new _regeneratorAsyncIterator(_regenerator().w(r, e, t, o), n || Promise); }
7
+ function _regeneratorAsyncIterator(t, e) { function n(r, o, i, f) { try { var c = t[r](o), u = c.value; return u instanceof _OverloadYield ? e.resolve(u.v).then(function (t) { n("next", t, i, f); }, function (t) { n("throw", t, i, f); }) : e.resolve(u).then(function (t) { c.value = t, i(c); }, function (t) { return n("throw", t, i, f); }); } catch (t) { f(t); } } var r; this.next || (_regeneratorDefine2(_regeneratorAsyncIterator.prototype), _regeneratorDefine2(_regeneratorAsyncIterator.prototype, "function" == typeof Symbol && Symbol.asyncIterator || "@asyncIterator", function () { return this; })), _regeneratorDefine2(this, "_invoke", function (t, o, i) { function f() { return new e(function (e, r) { n(t, i, e, r); }); } return r = r ? r.then(f, f) : f(); }, !0); }
8
+ function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
9
+ function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
10
+ function _OverloadYield(e, d) { this.v = e, this.k = d; }
11
+ function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
12
+ function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
13
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
14
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
15
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
16
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
17
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
18
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
19
+ import React, { useEffect, useRef, useState } from 'react';
20
+ import { useMobile } from '../../../hooks/useMedia';
21
+ import { useComponentPalette } from '../../../palette';
22
+ import { AdaptiveModalDrawer } from '../AdaptiveModalDrawer';
23
+ import { SecondaryButton } from '../SecondaryButton';
24
+ import { toast } from '../Toast';
25
+ import { Tooltip } from '../Tooltip';
26
+ import { Typography } from '../Typography';
27
+ import { CopyIcon, MailIcon, PhoneIcon } from './assets/icons';
28
+ import { racoonImage } from './assets/racoonImage';
29
+ import * as S from './styles';
30
+ /** сколько держим подтверждение «Скопировано» после копирования ID */
31
+ var COPIED_FEEDBACK_MS = 2000;
32
+ var SUPPORT_PHONE_LABEL = '8 (800) 100-76-20';
33
+ var SUPPORT_PHONE = '+78001007620';
34
+ var SUPPORT_MAIL = 'c-support@invoicebox.ru';
35
+ export var WENT_WRONG_MODAL_DEFAULT_CONTACTS = [{
36
+ label: SUPPORT_PHONE_LABEL,
37
+ href: "tel:".concat(SUPPORT_PHONE),
38
+ icon: /*#__PURE__*/React.createElement(PhoneIcon, null)
39
+ }, {
40
+ label: SUPPORT_MAIL,
41
+ href: "mailto:".concat(SUPPORT_MAIL),
42
+ icon: /*#__PURE__*/React.createElement(MailIcon, null)
43
+ }];
44
+ export var WentWrongModal = function WentWrongModal(_ref) {
45
+ var isOpen = _ref.isOpen,
46
+ onClose = _ref.onClose,
47
+ title = _ref.title,
48
+ description = _ref.description,
49
+ requestErrorId = _ref.requestErrorId,
50
+ _ref$contacts = _ref.contacts,
51
+ contacts = _ref$contacts === void 0 ? WENT_WRONG_MODAL_DEFAULT_CONTACTS : _ref$contacts,
52
+ _ref$headerImage = _ref.headerImage,
53
+ headerImage = _ref$headerImage === void 0 ? racoonImage : _ref$headerImage,
54
+ _ref$closeButtonText = _ref.closeButtonText,
55
+ closeButtonText = _ref$closeButtonText === void 0 ? 'Закрыть' : _ref$closeButtonText,
56
+ palette = _ref.palette;
57
+ var mergedPalette = useComponentPalette('wentWrongModal', palette);
58
+ var isMobile = useMobile();
59
+ var _useState = useState(false),
60
+ _useState2 = _slicedToArray(_useState, 2),
61
+ isCopied = _useState2[0],
62
+ setIsCopied = _useState2[1];
63
+ var copiedTimerRef = useRef();
64
+
65
+ // При закрытии окна и смене ID подтверждение сбрасываем, таймер не переживает размонтирование
66
+ useEffect(function () {
67
+ setIsCopied(false);
68
+ clearTimeout(copiedTimerRef.current);
69
+ }, [isOpen, requestErrorId]);
70
+ useEffect(function () {
71
+ return function () {
72
+ return clearTimeout(copiedTimerRef.current);
73
+ };
74
+ }, []);
75
+ var copyRequestId = /*#__PURE__*/function () {
76
+ var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
77
+ var _navigator$clipboard;
78
+ return _regeneratorRuntime().wrap(function _callee$(_context) {
79
+ while (1) switch (_context.prev = _context.next) {
80
+ case 0:
81
+ if (!(!requestErrorId || !((_navigator$clipboard = navigator.clipboard) !== null && _navigator$clipboard !== void 0 && _navigator$clipboard.writeText))) {
82
+ _context.next = 2;
83
+ break;
84
+ }
85
+ return _context.abrupt("return");
86
+ case 2:
87
+ _context.prev = 2;
88
+ _context.next = 5;
89
+ return navigator.clipboard.writeText(requestErrorId);
90
+ case 5:
91
+ setIsCopied(true);
92
+ clearTimeout(copiedTimerRef.current);
93
+ copiedTimerRef.current = setTimeout(function () {
94
+ return setIsCopied(false);
95
+ }, COPIED_FEEDBACK_MS);
96
+ _context.next = 13;
97
+ break;
98
+ case 10:
99
+ _context.prev = 10;
100
+ _context.t0 = _context["catch"](2);
101
+ toast.error('Не удалось скопировать');
102
+ case 13:
103
+ case "end":
104
+ return _context.stop();
105
+ }
106
+ }, _callee, null, [[2, 10]]);
107
+ }));
108
+ return function copyRequestId() {
109
+ return _ref2.apply(this, arguments);
110
+ };
111
+ }();
112
+
113
+ // Уводим курсор/фокус с ID — подтверждение гасим, при возврате тултип снова подсказывает про копирование
114
+ var resetCopied = function resetCopied() {
115
+ clearTimeout(copiedTimerRef.current);
116
+ setIsCopied(false);
117
+ };
118
+ var handleCopy = function handleCopy() {
119
+ void copyRequestId();
120
+ };
121
+ return /*#__PURE__*/React.createElement(AdaptiveModalDrawer, {
122
+ onClose: onClose,
123
+ isOpen: isOpen,
124
+ drawerProps: {
125
+ isPadding: false
126
+ }
127
+ }, /*#__PURE__*/React.createElement(S.ModalInner, {
128
+ $palette: mergedPalette
129
+ }, /*#__PURE__*/React.createElement(S.Header, {
130
+ $palette: mergedPalette,
131
+ $image: headerImage
132
+ }), /*#__PURE__*/React.createElement(S.Content, null, /*#__PURE__*/React.createElement(S.Title, {
133
+ variant: "headline3"
134
+ }, title), /*#__PURE__*/React.createElement(S.Description, {
135
+ variant: "bodyMRegular",
136
+ $palette: mergedPalette
137
+ }, description), contacts.length > 0 && /*#__PURE__*/React.createElement(S.Contacts, {
138
+ $marginBottom: requestErrorId ? '0' : '24px'
139
+ }, contacts.map(function (contact) {
140
+ return /*#__PURE__*/React.createElement(S.ContactItem, {
141
+ key: contact.href,
142
+ href: contact.href
143
+ }, contact.icon, /*#__PURE__*/React.createElement(Typography, {
144
+ variant: "buttonM",
145
+ element: "span"
146
+ }, contact.label));
147
+ })), requestErrorId && /*#__PURE__*/React.createElement(S.RequestIdWrapper, {
148
+ $palette: mergedPalette
149
+ }, /*#__PURE__*/React.createElement(Typography, {
150
+ variant: "bodyMRegular",
151
+ element: "span"
152
+ }, "ID \u0437\u0430\u043F\u0440\u043E\u0441\u0430:"), isMobile ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(S.RequestIdValue, {
153
+ variant: "bodyMRegular",
154
+ element: "span",
155
+ $palette: mergedPalette
156
+ }, requestErrorId), /*#__PURE__*/React.createElement(S.ButtonCopyCode, {
157
+ type: "button",
158
+ onClick: handleCopy,
159
+ "aria-label": "\u0421\u043A\u043E\u043F\u0438\u0440\u043E\u0432\u0430\u0442\u044C ID \u0437\u0430\u043F\u0440\u043E\u0441\u0430",
160
+ $palette: mergedPalette
161
+ }, /*#__PURE__*/React.createElement(CopyIcon, null))) : /*#__PURE__*/React.createElement(Tooltip, {
162
+ overlay: /*#__PURE__*/React.createElement(S.CopyText, null, /*#__PURE__*/React.createElement(Typography, {
163
+ variant: "captionRegular"
164
+ }, isCopied ? 'Скопировано' : 'Нажмите, чтобы скопировать')),
165
+ placement: "top"
166
+ }, /*#__PURE__*/React.createElement(S.RequestIdValue, {
167
+ variant: "bodyMRegular",
168
+ element: "button",
169
+ type: "button",
170
+ onClick: handleCopy,
171
+ onMouseLeave: resetCopied,
172
+ onBlur: resetCopied,
173
+ $palette: mergedPalette
174
+ }, requestErrorId)), /*#__PURE__*/React.createElement(S.CopiedStatus, {
175
+ role: "status",
176
+ $isVisuallyHidden: !isMobile
177
+ }, isCopied && /*#__PURE__*/React.createElement(Typography, {
178
+ variant: "bodyMRegular",
179
+ element: "span"
180
+ }, "\u0421\u043A\u043E\u043F\u0438\u0440\u043E\u0432\u0430\u043D\u043E"))), /*#__PURE__*/React.createElement(SecondaryButton, {
181
+ onClick: onClose,
182
+ borderRadius: "50px",
183
+ padding: isMobile ? '16px 40px' : '8px 16px',
184
+ fullWidth: isMobile
185
+ }, closeButtonText))));
186
+ };
@@ -0,0 +1,53 @@
1
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
+ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
5
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
6
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
7
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
8
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
9
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
10
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
11
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
12
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
13
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
14
+ import React from 'react';
15
+ import { useModal } from '../../../hooks/useModal';
16
+ import { ToastContainer } from '../Toast';
17
+ import { WentWrongModal } from '.';
18
+ var meta = {
19
+ title: 'common/WentWrongModal',
20
+ component: WentWrongModal,
21
+ tags: ['autodocs']
22
+ };
23
+ export default meta;
24
+ var Render = function Render(args) {
25
+ var _useModal = useModal(false),
26
+ _useModal2 = _slicedToArray(_useModal, 3),
27
+ isOpen = _useModal2[0],
28
+ open = _useModal2[1],
29
+ close = _useModal2[2];
30
+ return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
31
+ type: "button",
32
+ onClick: open
33
+ }, "Open"), /*#__PURE__*/React.createElement(WentWrongModal, _extends({}, args, {
34
+ isOpen: isOpen,
35
+ onClose: close
36
+ })), /*#__PURE__*/React.createElement(ToastContainer, null));
37
+ };
38
+ var commonArgs = {
39
+ title: 'Что-то пошло не так...',
40
+ description: 'К сожалению, произошла ошибка при обработке вашего запроса. Пожалуйста, попробуйте ещё раз или обратитесь в службу поддержки'
41
+ };
42
+ export var Default = {
43
+ args: commonArgs,
44
+ render: Render
45
+ };
46
+ export var WithRequestId = {
47
+ args: _objectSpread(_objectSpread({}, commonArgs), {}, {
48
+ title: 'Доступ заблокирован',
49
+ description: 'Вы исчерпали количество попыток входа на сегодня. Пожалуйста, повторите попытку позже или обратитесь в службу поддержки',
50
+ requestErrorId: '7f3c2a9e-41b8-4d0e-9a51-2c6f8e1b0d47'
51
+ }),
52
+ render: Render
53
+ };
@@ -0,0 +1,208 @@
1
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
+ function _regeneratorRuntime() { "use strict"; var r = _regenerator(), e = r.m(_regeneratorRuntime), t = (Object.getPrototypeOf ? Object.getPrototypeOf(e) : e.__proto__).constructor; function n(r) { var e = "function" == typeof r && r.constructor; return !!e && (e === t || "GeneratorFunction" === (e.displayName || e.name)); } var o = { "throw": 1, "return": 2, "break": 3, "continue": 3 }; function a(r) { var e, t; return function (n) { e || (e = { stop: function stop() { return t(n.a, 2); }, "catch": function _catch() { return n.v; }, abrupt: function abrupt(r, e) { return t(n.a, o[r], e); }, delegateYield: function delegateYield(r, o, a) { return e.resultName = o, t(n.d, _regeneratorValues(r), a); }, finish: function finish(r) { return t(n.f, r); } }, t = function t(r, _t, o) { n.p = e.prev, n.n = e.next; try { return r(_t, o); } finally { e.next = n.n; } }), e.resultName && (e[e.resultName] = n.v, e.resultName = void 0), e.sent = n.v, e.next = n.n; try { return r.call(this, e); } finally { n.p = e.prev, n.n = e.next; } }; } return (_regeneratorRuntime = function _regeneratorRuntime() { return { wrap: function wrap(e, t, n, o) { return r.w(a(e), t, n, o && o.reverse()); }, isGeneratorFunction: n, mark: r.m, awrap: function awrap(r, e) { return new _OverloadYield(r, e); }, AsyncIterator: _regeneratorAsyncIterator, async: function async(r, e, t, o, u) { return (n(e) ? _regeneratorAsyncGen : _regeneratorAsync)(a(r), e, t, o, u); }, keys: _regeneratorKeys, values: _regeneratorValues }; })(); }
3
+ function _regeneratorValues(e) { if (null != e) { var t = e["function" == typeof Symbol && Symbol.iterator || "@@iterator"], r = 0; if (t) return t.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) return { next: function next() { return e && r >= e.length && (e = void 0), { value: e && e[r++], done: !e }; } }; } throw new TypeError(_typeof(e) + " is not iterable"); }
4
+ function _regeneratorKeys(e) { var n = Object(e), r = []; for (var t in n) r.unshift(t); return function e() { for (; r.length;) if ((t = r.pop()) in n) return e.value = t, e.done = !1, e; return e.done = !0, e; }; }
5
+ function _regeneratorAsync(n, e, r, t, o) { var a = _regeneratorAsyncGen(n, e, r, t, o); return a.next().then(function (n) { return n.done ? n.value : a.next(); }); }
6
+ function _regeneratorAsyncGen(r, e, t, o, n) { return new _regeneratorAsyncIterator(_regenerator().w(r, e, t, o), n || Promise); }
7
+ function _regeneratorAsyncIterator(t, e) { function n(r, o, i, f) { try { var c = t[r](o), u = c.value; return u instanceof _OverloadYield ? e.resolve(u.v).then(function (t) { n("next", t, i, f); }, function (t) { n("throw", t, i, f); }) : e.resolve(u).then(function (t) { c.value = t, i(c); }, function (t) { return n("throw", t, i, f); }); } catch (t) { f(t); } } var r; this.next || (_regeneratorDefine2(_regeneratorAsyncIterator.prototype), _regeneratorDefine2(_regeneratorAsyncIterator.prototype, "function" == typeof Symbol && Symbol.asyncIterator || "@asyncIterator", function () { return this; })), _regeneratorDefine2(this, "_invoke", function (t, o, i) { function f() { return new e(function (e, r) { n(t, i, e, r); }); } return r = r ? r.then(f, f) : f(); }, !0); }
8
+ function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
9
+ function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
10
+ function _OverloadYield(e, d) { this.v = e, this.k = d; }
11
+ function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
12
+ function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
13
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
14
+ /**
15
+ * @jest-environment jsdom
16
+ */
17
+ import React, { act } from 'react';
18
+ import { createRoot } from 'react-dom/client';
19
+ import { WentWrongModal } from '.';
20
+
21
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
22
+ globalThis.IS_REACT_ACT_ENVIRONMENT = true;
23
+ var container;
24
+ var root;
25
+ beforeEach(function () {
26
+ window.matchMedia = jest.fn().mockReturnValue({
27
+ matches: false,
28
+ addEventListener: jest.fn(),
29
+ removeEventListener: jest.fn()
30
+ });
31
+ container = document.createElement('div');
32
+ document.body.appendChild(container);
33
+ root = createRoot(container);
34
+ });
35
+ afterEach(function () {
36
+ act(function () {
37
+ return root.unmount();
38
+ });
39
+ container.remove();
40
+ });
41
+ var render = function render() {
42
+ var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
43
+ return act(function () {
44
+ root.render(/*#__PURE__*/React.createElement(WentWrongModal, _extends({
45
+ isOpen: true,
46
+ onClose: jest.fn(),
47
+ title: "\u0417\u0430\u0433\u043E\u043B\u043E\u0432\u043E\u043A",
48
+ description: "\u041E\u043F\u0438\u0441\u0430\u043D\u0438\u0435"
49
+ }, props)));
50
+ });
51
+ };
52
+ describe('WentWrongModal', function () {
53
+ test('рендерит заголовок, описание и контакты поддержки по умолчанию', function () {
54
+ render();
55
+ var dialog = document.querySelector('[role="dialog"]');
56
+ expect(dialog === null || dialog === void 0 ? void 0 : dialog.textContent).toContain('Заголовок');
57
+ expect(dialog === null || dialog === void 0 ? void 0 : dialog.textContent).toContain('Описание');
58
+ var hrefs = Array.from(document.querySelectorAll('a')).map(function (a) {
59
+ return a.getAttribute('href');
60
+ });
61
+ expect(hrefs).toEqual(['tel:+78001007620', 'mailto:c-support@invoicebox.ru']);
62
+ });
63
+ test('показывает ID запроса только когда он передан', function () {
64
+ render();
65
+ expect(document.body.textContent).not.toContain('ID запроса');
66
+ render({
67
+ requestErrorId: 'req-123'
68
+ });
69
+ expect(document.body.textContent).toContain('ID запроса');
70
+ expect(document.body.textContent).toContain('req-123');
71
+ });
72
+ test('контакты и текст кнопки задаются пропами', function () {
73
+ render({
74
+ contacts: [{
75
+ label: 'help@example.com',
76
+ href: 'mailto:help@example.com'
77
+ }],
78
+ closeButtonText: 'Ок'
79
+ });
80
+ var hrefs = Array.from(document.querySelectorAll('a')).map(function (a) {
81
+ return a.getAttribute('href');
82
+ });
83
+ expect(hrefs).toEqual(['mailto:help@example.com']);
84
+ expect(document.body.textContent).toContain('Ок');
85
+ });
86
+ test('Escape и кнопка закрытия вызывают onClose', function () {
87
+ var onClose = jest.fn();
88
+ render({
89
+ onClose: onClose
90
+ });
91
+ act(function () {
92
+ document.dispatchEvent(new KeyboardEvent('keydown', {
93
+ key: 'Escape'
94
+ }));
95
+ });
96
+ expect(onClose).toHaveBeenCalledTimes(1);
97
+ var closeButton = Array.from(document.querySelectorAll('button')).find(function (button) {
98
+ return button.textContent === 'Закрыть';
99
+ });
100
+ act(function () {
101
+ return closeButton === null || closeButton === void 0 ? void 0 : closeButton.click();
102
+ });
103
+ expect(onClose).toHaveBeenCalledTimes(2);
104
+ });
105
+ test('после копирования ID показывает «Скопировано» и через 2 секунды убирает', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
106
+ var writeText, status, idButton;
107
+ return _regeneratorRuntime().wrap(function _callee2$(_context2) {
108
+ while (1) switch (_context2.prev = _context2.next) {
109
+ case 0:
110
+ jest.useFakeTimers();
111
+ writeText = jest.fn().mockResolvedValue(undefined);
112
+ Object.assign(navigator, {
113
+ clipboard: {
114
+ writeText: writeText
115
+ }
116
+ });
117
+ render({
118
+ requestErrorId: 'req-123'
119
+ });
120
+ status = function status() {
121
+ var _document$querySelect;
122
+ return (_document$querySelect = document.querySelector('[role="status"]')) === null || _document$querySelect === void 0 ? void 0 : _document$querySelect.textContent;
123
+ };
124
+ expect(status()).toBe('');
125
+ idButton = Array.from(document.querySelectorAll('button')).find(function (button) {
126
+ return button.textContent === 'req-123';
127
+ });
128
+ _context2.next = 9;
129
+ return act(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
130
+ return _regeneratorRuntime().wrap(function _callee$(_context) {
131
+ while (1) switch (_context.prev = _context.next) {
132
+ case 0:
133
+ idButton === null || idButton === void 0 || idButton.click();
134
+ case 1:
135
+ case "end":
136
+ return _context.stop();
137
+ }
138
+ }, _callee);
139
+ })));
140
+ case 9:
141
+ expect(writeText).toHaveBeenCalledWith('req-123');
142
+ expect(status()).toBe('Скопировано');
143
+ act(function () {
144
+ jest.advanceTimersByTime(2000);
145
+ });
146
+ expect(status()).toBe('');
147
+ jest.useRealTimers();
148
+ case 14:
149
+ case "end":
150
+ return _context2.stop();
151
+ }
152
+ }, _callee2);
153
+ })));
154
+ test('уход курсора с ID сбрасывает «Скопировано»', /*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
155
+ var status, idButton;
156
+ return _regeneratorRuntime().wrap(function _callee4$(_context4) {
157
+ while (1) switch (_context4.prev = _context4.next) {
158
+ case 0:
159
+ Object.assign(navigator, {
160
+ clipboard: {
161
+ writeText: jest.fn().mockResolvedValue(undefined)
162
+ }
163
+ });
164
+ render({
165
+ requestErrorId: 'req-123'
166
+ });
167
+ status = function status() {
168
+ var _document$querySelect2;
169
+ return (_document$querySelect2 = document.querySelector('[role="status"]')) === null || _document$querySelect2 === void 0 ? void 0 : _document$querySelect2.textContent;
170
+ };
171
+ idButton = Array.from(document.querySelectorAll('button')).find(function (button) {
172
+ return button.textContent === 'req-123';
173
+ });
174
+ _context4.next = 6;
175
+ return act(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
176
+ return _regeneratorRuntime().wrap(function _callee3$(_context3) {
177
+ while (1) switch (_context3.prev = _context3.next) {
178
+ case 0:
179
+ idButton === null || idButton === void 0 || idButton.click();
180
+ case 1:
181
+ case "end":
182
+ return _context3.stop();
183
+ }
184
+ }, _callee3);
185
+ })));
186
+ case 6:
187
+ expect(status()).toBe('Скопировано');
188
+ act(function () {
189
+ idButton === null || idButton === void 0 || idButton.dispatchEvent(new MouseEvent('mouseout', {
190
+ bubbles: true,
191
+ relatedTarget: document.body
192
+ }));
193
+ });
194
+ expect(status()).toBe('');
195
+ case 9:
196
+ case "end":
197
+ return _context4.stop();
198
+ }
199
+ }, _callee4);
200
+ })));
201
+ test('закрытое окно ничего не рендерит и не блокирует скролл', function () {
202
+ render({
203
+ isOpen: false
204
+ });
205
+ expect(document.querySelector('[role="dialog"]')).toBeNull();
206
+ expect(document.body.style.overflow).toBe('');
207
+ });
208
+ });
@@ -0,0 +1,15 @@
1
+ import hexToRgba from '../../../utils/hexToRgba';
2
+ export var generateWentWrongModalPalette = function generateWentWrongModalPalette(abstractPalette) {
3
+ return {
4
+ text: abstractPalette.primary,
5
+ // на белом фоне совпадает с grey800 (#868C91) из макета
6
+ description: hexToRgba(abstractPalette.primary, 0.6),
7
+ // на белом фоне ≈ text.secondary (#72777B)
8
+ requestId: hexToRgba(abstractPalette.primary, 0.7),
9
+ headerBg: '#EDF5F8',
10
+ // на белом фоне совпадает с grey700 (#9A9FA3)
11
+ copyIcon: hexToRgba(abstractPalette.primary, 0.5),
12
+ copyButtonBg: abstractPalette.neutralUsual,
13
+ copyValueHoverBg: abstractPalette.neutralHeavy
14
+ };
15
+ };
@@ -0,0 +1,81 @@
1
+ import styled from 'styled-components';
2
+ import { breakpoints } from '../../../breakpoints';
3
+ import { Typography } from '../Typography';
4
+ export var ModalInner = styled.div.withConfig({
5
+ displayName: "styles__ModalInner",
6
+ componentId: "sc-1sxwtvv-0"
7
+ })(["width:624px;color:", ";@media ", "{width:100%;}"], function (_ref) {
8
+ var $palette = _ref.$palette;
9
+ return $palette.text;
10
+ }, breakpoints.md);
11
+ export var Header = styled.div.withConfig({
12
+ displayName: "styles__Header",
13
+ componentId: "sc-1sxwtvv-1"
14
+ })(["height:171px;background:url(", ") no-repeat center bottom,", ";background-size:184px;@media ", "{background-size:163px;}"], function (_ref2) {
15
+ var $image = _ref2.$image;
16
+ return $image;
17
+ }, function (_ref3) {
18
+ var $palette = _ref3.$palette;
19
+ return $palette.headerBg;
20
+ }, breakpoints.sm);
21
+ export var Content = styled.div.withConfig({
22
+ displayName: "styles__Content",
23
+ componentId: "sc-1sxwtvv-2"
24
+ })(["padding:30px;text-align:center;@media ", "{padding:24px 16px 32px;}"], breakpoints.sm);
25
+ export var Title = styled(Typography).withConfig({
26
+ displayName: "styles__Title",
27
+ componentId: "sc-1sxwtvv-3"
28
+ })(["margin-bottom:12px;"]);
29
+ export var Description = styled(Typography).withConfig({
30
+ displayName: "styles__Description",
31
+ componentId: "sc-1sxwtvv-4"
32
+ })(["margin-bottom:24px;color:", ";@media ", "{margin-bottom:16px;}"], function (_ref4) {
33
+ var $palette = _ref4.$palette;
34
+ return $palette.description;
35
+ }, breakpoints.sm);
36
+ export var Contacts = styled.div.withConfig({
37
+ displayName: "styles__Contacts",
38
+ componentId: "sc-1sxwtvv-5"
39
+ })(["display:flex;align-items:center;gap:12px;justify-content:center;margin-bottom:", ";@media ", "{flex-direction:column;gap:0;}"], function (_ref5) {
40
+ var $marginBottom = _ref5.$marginBottom;
41
+ return $marginBottom;
42
+ }, breakpoints.sm);
43
+ export var ContactItem = styled.a.withConfig({
44
+ displayName: "styles__ContactItem",
45
+ componentId: "sc-1sxwtvv-6"
46
+ })(["padding:8px 16px 8px 12px;display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none;@media ", "{gap:6px;}"], breakpoints.sm);
47
+ export var RequestIdWrapper = styled.div.withConfig({
48
+ displayName: "styles__RequestIdWrapper",
49
+ componentId: "sc-1sxwtvv-7"
50
+ })(["margin-bottom:24px;display:flex;justify-content:center;align-items:center;gap:4px;color:", ";"], function (_ref6) {
51
+ var $palette = _ref6.$palette;
52
+ return $palette.requestId;
53
+ });
54
+ export var CopyText = styled.div.withConfig({
55
+ displayName: "styles__CopyText",
56
+ componentId: "sc-1sxwtvv-8"
57
+ })(["padding:4px 12px;pointer-events:none;"]);
58
+ export var RequestIdValue = styled(Typography).withConfig({
59
+ displayName: "styles__RequestIdValue",
60
+ componentId: "sc-1sxwtvv-9"
61
+ })(["max-width:320px;padding:0;border:none;background:transparent;color:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;&:is(button){cursor:pointer;}&:is(button):hover{background-color:", ";}@media ", "{max-width:200px;}"], function (_ref7) {
62
+ var $palette = _ref7.$palette;
63
+ return $palette.copyValueHoverBg;
64
+ }, breakpoints.sm);
65
+ export var ButtonCopyCode = styled.button.withConfig({
66
+ displayName: "styles__ButtonCopyCode",
67
+ componentId: "sc-1sxwtvv-10"
68
+ })(["flex-shrink:0;height:24px;width:24px;padding:0;border:none;border-radius:50%;cursor:pointer;color:", ";background:", ";display:flex;justify-content:center;align-items:center;"], function (_ref8) {
69
+ var $palette = _ref8.$palette;
70
+ return $palette.copyIcon;
71
+ }, function (_ref9) {
72
+ var $palette = _ref9.$palette;
73
+ return $palette.copyButtonBg;
74
+ });
75
+ export var CopiedStatus = styled.span.withConfig({
76
+ displayName: "styles__CopiedStatus",
77
+ componentId: "sc-1sxwtvv-11"
78
+ })(["flex-shrink:0;", ""], function (_ref0) {
79
+ var $isVisuallyHidden = _ref0.$isVisuallyHidden;
80
+ return $isVisuallyHidden && "\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n white-space: nowrap;\n border: 0;\n ";
81
+ });
package/dist/esm/index.js CHANGED
@@ -22,7 +22,9 @@ export { ToastContainer, toast } from './components/common/Toast';
22
22
  export { AppCardLink } from './components/common/AppCardLink';
23
23
  export { InvoiceboxLogo } from './components/common/InvoiceboxLogo';
24
24
  export { QRCode } from './components/common/QRCode';
25
-
25
+ export { Modal, useModalExpansion, modalExpansionFlexItem } from './components/common/Modal';
26
+ export { AdaptiveModalDrawer } from './components/common/AdaptiveModalDrawer';
27
+ export { WentWrongModal, WENT_WRONG_MODAL_DEFAULT_CONTACTS } from './components/common/WentWrongModal';
26
28
  // form
27
29
  export { InputLabel } from './components/form/InputLabel';
28
30
  export { PureInput } from './components/form/PureInput';
@@ -33,6 +33,8 @@ import { generateDateTimeInputPalette } from '../components/form/DateTimeInput/p
33
33
  import { generateDrawerHeaderPalette } from '../components/form/common/DrawerHeader/palette';
34
34
  import { generateCheckboxPalette } from '../components/form/Checkbox/palette';
35
35
  import { generateTooltipPalette } from '../components/common/Tooltip/palette';
36
+ import { generateModalPalette } from '../components/common/Modal/palette';
37
+ import { generateWentWrongModalPalette } from '../components/common/WentWrongModal/palette';
36
38
  export var PaletteContext = /*#__PURE__*/createContext({
37
39
  skeleton: generateSkeletonPalette(defaultAbstractPalette),
38
40
  invoiceboxSpinner: generateInvoiceboxSpinnerPalette(defaultAbstractPalette),
@@ -66,5 +68,7 @@ export var PaletteContext = /*#__PURE__*/createContext({
66
68
  dateTimeInput: generateDateTimeInputPalette(defaultAbstractPalette),
67
69
  drawerHeader: generateDrawerHeaderPalette(defaultAbstractPalette),
68
70
  checkbox: generateCheckboxPalette(defaultAbstractPalette),
69
- tooltip: generateTooltipPalette(defaultAbstractPalette)
71
+ tooltip: generateTooltipPalette(defaultAbstractPalette),
72
+ modal: generateModalPalette(defaultAbstractPalette),
73
+ wentWrongModal: generateWentWrongModalPalette(defaultAbstractPalette)
70
74
  });
@@ -40,6 +40,8 @@ import { generateDateTimeInputPalette } from '../components/form/DateTimeInput/p
40
40
  import { generateDrawerHeaderPalette } from '../components/form/common/DrawerHeader/palette';
41
41
  import { generateCheckboxPalette } from '../components/form/Checkbox/palette';
42
42
  import { generateTooltipPalette } from '../components/common/Tooltip/palette';
43
+ import { generateModalPalette } from '../components/common/Modal/palette';
44
+ import { generateWentWrongModalPalette } from '../components/common/WentWrongModal/palette';
43
45
  export var PaletteProvider = function PaletteProvider(_ref) {
44
46
  var children = _ref.children,
45
47
  _abstract = _ref["abstract"],
@@ -84,7 +86,9 @@ export var PaletteProvider = function PaletteProvider(_ref) {
84
86
  dateTimeInput: generateDateTimeInputPalette(mergedAbstractPalette),
85
87
  drawerHeader: generateDrawerHeaderPalette(mergedAbstractPalette),
86
88
  checkbox: generateCheckboxPalette(mergedAbstractPalette),
87
- tooltip: generateTooltipPalette(mergedAbstractPalette)
89
+ tooltip: generateTooltipPalette(mergedAbstractPalette),
90
+ modal: generateModalPalette(mergedAbstractPalette),
91
+ wentWrongModal: generateWentWrongModalPalette(mergedAbstractPalette)
88
92
  };
89
93
  }, [mergedSkeletonPalette, mergedAbstractPalette]);
90
94
  return /*#__PURE__*/React.createElement(PaletteContext.Provider, {
package/dist/index.d.ts CHANGED
@@ -32,6 +32,12 @@ export { ToastContainer, toast } from './components/common/Toast';
32
32
  export { AppCardLink } from './components/common/AppCardLink';
33
33
  export { InvoiceboxLogo } from './components/common/InvoiceboxLogo';
34
34
  export { QRCode } from './components/common/QRCode';
35
+ export { Modal, useModalExpansion, modalExpansionFlexItem } from './components/common/Modal';
36
+ export type { TProps as TModalProps, TModalExpansion } from './components/common/Modal';
37
+ export { AdaptiveModalDrawer } from './components/common/AdaptiveModalDrawer';
38
+ export type { TProps as TAdaptiveModalDrawerProps } from './components/common/AdaptiveModalDrawer';
39
+ export { WentWrongModal, WENT_WRONG_MODAL_DEFAULT_CONTACTS } from './components/common/WentWrongModal';
40
+ export type { TProps as TWentWrongModalProps, TWentWrongModalContact, } from './components/common/WentWrongModal';
35
41
  export { InputLabel } from './components/form/InputLabel';
36
42
  export { PureInput } from './components/form/PureInput';
37
43
  export { PositiveIntegerInput } from './components/form/PositiveIntegerInput';