@livechat/design-system-react-components 1.17.1-alpha.4 → 1.17.1

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 (109) hide show
  1. package/dist/components/Tag/Tag.d.ts +17 -3
  2. package/dist/components/Tag/constants.d.ts +2 -0
  3. package/dist/components/Tag/index.d.ts +1 -0
  4. package/dist/components/Tag/types.d.ts +3 -0
  5. package/dist/index.cjs.js +1 -1
  6. package/dist/index.es.js +5252 -133
  7. package/dist/preview-stats.json +1204 -1204
  8. package/dist/style.css +1 -1
  9. package/package.json +3 -4
  10. package/dist/chunks/Heading-617540b6.js +0 -1
  11. package/dist/chunks/Heading-6b95d08b.js +0 -64
  12. package/dist/chunks/Text-b31d1e9a.js +0 -66
  13. package/dist/chunks/Text-df483689.js +0 -1
  14. package/dist/chunks/Tooltip-1c5cb6fe.js +0 -182
  15. package/dist/chunks/Tooltip-f9f79274.js +0 -1
  16. package/dist/chunks/Typography.module-2558416b.js +0 -1
  17. package/dist/chunks/Typography.module-93efb34d.js +0 -23
  18. package/dist/chunks/keyCodes-30323e90.js +0 -15
  19. package/dist/chunks/keyCodes-c4c35e49.js +0 -1
  20. package/dist/components/ActionBar/index.cjs.js +0 -1
  21. package/dist/components/ActionBar/index.es.js +0 -192
  22. package/dist/components/ActionMenu/index.cjs.js +0 -1
  23. package/dist/components/ActionMenu/index.es.js +0 -199
  24. package/dist/components/Alert/index.cjs.js +0 -1
  25. package/dist/components/Alert/index.es.js +0 -129
  26. package/dist/components/Avatar/index.cjs.js +0 -1
  27. package/dist/components/Avatar/index.es.js +0 -190
  28. package/dist/components/Badge/index.cjs.js +0 -1
  29. package/dist/components/Badge/index.es.js +0 -65
  30. package/dist/components/Button/index.cjs.js +0 -1
  31. package/dist/components/Button/index.es.js +0 -143
  32. package/dist/components/Card/index.cjs.js +0 -1
  33. package/dist/components/Card/index.es.js +0 -96
  34. package/dist/components/Checkbox/index.cjs.js +0 -1
  35. package/dist/components/Checkbox/index.es.js +0 -64
  36. package/dist/components/DatePicker/index.cjs.js +0 -1
  37. package/dist/components/DatePicker/index.es.js +0 -516
  38. package/dist/components/DetailsCard/index.cjs.js +0 -1
  39. package/dist/components/DetailsCard/index.es.js +0 -140
  40. package/dist/components/DetailsCardInfo/index.cjs.js +0 -1
  41. package/dist/components/DetailsCardInfo/index.es.js +0 -12
  42. package/dist/components/FieldDescription/index.cjs.js +0 -1
  43. package/dist/components/FieldDescription/index.es.js +0 -41
  44. package/dist/components/FieldError/index.cjs.js +0 -1
  45. package/dist/components/FieldError/index.es.js +0 -51
  46. package/dist/components/FieldGroup/index.cjs.js +0 -1
  47. package/dist/components/FieldGroup/index.es.js +0 -58
  48. package/dist/components/FileUploadProgress/index.cjs.js +0 -1
  49. package/dist/components/FileUploadProgress/index.es.js +0 -109
  50. package/dist/components/Form/index.cjs.js +0 -1
  51. package/dist/components/Form/index.es.js +0 -50
  52. package/dist/components/FormField/index.cjs.js +0 -1
  53. package/dist/components/FormField/index.es.js +0 -116
  54. package/dist/components/FormGroup/index.cjs.js +0 -1
  55. package/dist/components/FormGroup/index.es.js +0 -58
  56. package/dist/components/Icon/index.cjs.js +0 -1
  57. package/dist/components/Icon/index.es.js +0 -103
  58. package/dist/components/Input/index.cjs.js +0 -1
  59. package/dist/components/Input/index.es.js +0 -123
  60. package/dist/components/Link/index.cjs.js +0 -1
  61. package/dist/components/Link/index.es.js +0 -47
  62. package/dist/components/Loader/index.cjs.js +0 -1
  63. package/dist/components/Loader/index.es.js +0 -39
  64. package/dist/components/Modal/index.cjs.js +0 -1
  65. package/dist/components/Modal/index.es.js +0 -249
  66. package/dist/components/NumericInput/index.cjs.js +0 -1
  67. package/dist/components/NumericInput/index.es.js +0 -139
  68. package/dist/components/Picker/index.cjs.js +0 -1
  69. package/dist/components/Picker/index.es.js +0 -740
  70. package/dist/components/Popover/index.cjs.js +0 -1
  71. package/dist/components/Popover/index.es.js +0 -75
  72. package/dist/components/Progress/index.cjs.js +0 -1
  73. package/dist/components/Progress/index.es.js +0 -160
  74. package/dist/components/PromoBanner/index.cjs.js +0 -1
  75. package/dist/components/PromoBanner/index.es.js +0 -74
  76. package/dist/components/PromoBannerV2/index.cjs.js +0 -1
  77. package/dist/components/PromoBannerV2/index.es.js +0 -79
  78. package/dist/components/RadioButton/index.cjs.js +0 -1
  79. package/dist/components/RadioButton/index.es.js +0 -58
  80. package/dist/components/Search/index.cjs.js +0 -1
  81. package/dist/components/Search/index.es.js +0 -117
  82. package/dist/components/SegmentedControl/index.cjs.js +0 -1
  83. package/dist/components/SegmentedControl/index.es.js +0 -55
  84. package/dist/components/Switch/index.cjs.js +0 -1
  85. package/dist/components/Switch/index.es.js +0 -145
  86. package/dist/components/Tab/index.cjs.js +0 -1
  87. package/dist/components/Tab/index.es.js +0 -93
  88. package/dist/components/Tag/index.cjs.js +0 -1
  89. package/dist/components/Tag/index.es.js +0 -143
  90. package/dist/components/TagInput/index.cjs.js +0 -1
  91. package/dist/components/TagInput/index.es.js +0 -244
  92. package/dist/components/Textarea/index.cjs.js +0 -1
  93. package/dist/components/Textarea/index.es.js +0 -55
  94. package/dist/components/Toast/index.cjs.js +0 -1
  95. package/dist/components/Toast/index.es.js +0 -163
  96. package/dist/components/Tooltip/components/UserGuide/index.cjs.js +0 -1
  97. package/dist/components/Tooltip/components/UserGuide/index.es.js +0 -196
  98. package/dist/components/Tooltip/components/index.cjs.js +0 -1
  99. package/dist/components/Tooltip/components/index.es.js +0 -117
  100. package/dist/components/Tooltip/index.cjs.js +0 -1
  101. package/dist/components/Tooltip/index.es.js +0 -21
  102. package/dist/components/Typography/index.cjs.js +0 -1
  103. package/dist/components/Typography/index.es.js +0 -48
  104. package/dist/components/UploadBar/index.cjs.js +0 -1
  105. package/dist/components/UploadBar/index.es.js +0 -111
  106. package/dist/foundations/index.cjs.js +0 -1
  107. package/dist/foundations/index.es.js +0 -353
  108. package/dist/utils/index.cjs.js +0 -1
  109. package/dist/utils/index.es.js +0 -4
@@ -1,244 +0,0 @@
1
- var X = Object.defineProperty, j = Object.defineProperties;
2
- var q = Object.getOwnPropertyDescriptors;
3
- var E = Object.getOwnPropertySymbols;
4
- var w = Object.prototype.hasOwnProperty, N = Object.prototype.propertyIsEnumerable;
5
- var h = (t, e, n) => e in t ? X(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n, D = (t, e) => {
6
- for (var n in e || (e = {}))
7
- w.call(e, n) && h(t, n, e[n]);
8
- if (E)
9
- for (var n of E(e))
10
- N.call(e, n) && h(t, n, e[n]);
11
- return t;
12
- }, $ = (t, e) => j(t, q(e));
13
- var z = (t, e) => {
14
- var n = {};
15
- for (var r in t)
16
- w.call(t, r) && e.indexOf(r) < 0 && (n[r] = t[r]);
17
- if (t != null && E)
18
- for (var r of E(t))
19
- e.indexOf(r) < 0 && N.call(t, r) && (n[r] = t[r]);
20
- return n;
21
- };
22
- import * as c from "react";
23
- import O from "clsx";
24
- import { K as i } from "../../chunks/keyCodes-30323e90.js";
25
- import { FieldError as A } from "../FieldError/index.es.js";
26
- import "../../chunks/Typography.module-93efb34d.js";
27
- import { T as J } from "../../chunks/Text-b31d1e9a.js";
28
- import { Tag as Q } from "../Tag/index.es.js";
29
- import P from "lodash.escape";
30
- import "@livechat/design-system-icons";
31
- import "../Icon/index.es.js";
32
- import "polished";
33
- const U = ({
34
- className: t = "",
35
- innerEditableRef: e,
36
- inputRef: n,
37
- change: r,
38
- remove: u,
39
- value: _
40
- }) => {
41
- const [m, x] = c.useState(!1), s = () => e.current, p = () => {
42
- const o = s();
43
- return o ? o.innerText : "";
44
- }, f = () => {
45
- n && n.current && n.current.focus();
46
- }, y = (o) => {
47
- if (o.key === i.enter) {
48
- o.preventDefault(), f();
49
- return;
50
- }
51
- o.key === i.backspace && p() === "" && (x(!0), u(), f());
52
- }, R = () => {
53
- const o = s();
54
- if (!(m || !o)) {
55
- if (o.innerText === "") {
56
- u();
57
- return;
58
- }
59
- r(o.innerText);
60
- }
61
- }, b = (o) => {
62
- o.preventDefault();
63
- const I = o.clipboardData.getData("text/plain");
64
- document.execCommand("insertHTML", !1, P(I));
65
- };
66
- return /* @__PURE__ */ c.createElement(
67
- "div",
68
- {
69
- ref: e,
70
- className: t,
71
- contentEditable: !0,
72
- onPaste: b,
73
- onBlur: R,
74
- onKeyDown: y,
75
- dangerouslySetInnerHTML: { __html: P(_) }
76
- }
77
- );
78
- }, T = {
79
- "tag-input": "lc-TagInput-module__tag-input___CLVY-",
80
- "tag-input--error": "lc-TagInput-module__tag-input--error___RP0SB",
81
- "tag-input__input": "lc-TagInput-module__tag-input__input___dgEYB",
82
- "tag-input__input--medium": "lc-TagInput-module__tag-input__input--medium___DYF7X",
83
- "tag-input__input--large": "lc-TagInput-module__tag-input__input--large___G6iEO",
84
- "tag-input__tag__content": "lc-TagInput-module__tag-input__tag__content___x95-M"
85
- }, W = "tag-input__tag", Z = ({
86
- children: t,
87
- index: e,
88
- remove: n,
89
- validator: r,
90
- inputRef: u,
91
- update: _,
92
- size: m
93
- }) => {
94
- const x = c.useMemo(() => r !== void 0 ? r(t) : !0, [t, r]), s = c.useRef(null), p = () => n(e);
95
- return /* @__PURE__ */ c.createElement(
96
- Q,
97
- {
98
- kind: x ? "default" : "error",
99
- dismissible: !0,
100
- size: m,
101
- onRemove: p
102
- },
103
- /* @__PURE__ */ c.createElement(
104
- U,
105
- {
106
- value: t,
107
- inputRef: u,
108
- innerEditableRef: s,
109
- className: T[`${W}__content`],
110
- change: (f) => _(e, f),
111
- remove: p,
112
- validator: r
113
- }
114
- )
115
- );
116
- }, v = "tag-input", ee = [
117
- i.enter,
118
- i.spacebar,
119
- i.tab,
120
- i.semicolon,
121
- i.comma
122
- ], te = [i.backspace, i.delete], ne = (R) => {
123
- var b = R, {
124
- id: t,
125
- tags: e,
126
- onChange: n,
127
- validator: r,
128
- error: u,
129
- placeholder: _,
130
- size: m = "medium",
131
- className: x,
132
- inputClassName: s,
133
- onBlur: p,
134
- addOnBlur: f = !0
135
- } = b, y = z(b, [
136
- "id",
137
- "tags",
138
- "onChange",
139
- "validator",
140
- "error",
141
- "placeholder",
142
- "size",
143
- "className",
144
- "inputClassName",
145
- "onBlur",
146
- "addOnBlur"
147
- ]);
148
- const o = O(
149
- T[v],
150
- {
151
- [T[`${v}--error`]]: u
152
- },
153
- x
154
- ), I = O(
155
- s,
156
- T[`${v}__input`],
157
- T[`${v}__input--${m}`]
158
- ), [g, k] = c.useState(""), V = c.useRef(null), C = (a) => {
159
- n([...e || [], a]), k("");
160
- }, K = (a) => {
161
- const l = [...e || []];
162
- l.splice(a, 1), n(l);
163
- }, S = (a) => k(a.target.value), M = (a) => {
164
- if (ee.includes(a.key)) {
165
- if (a.preventDefault(), g === "")
166
- return;
167
- C(g);
168
- } else if (te.includes(a.key)) {
169
- if (g !== "" || !(e != null && e.length))
170
- return;
171
- K(e.length - 1);
172
- }
173
- }, F = (a) => {
174
- f && C(g), p == null || p(a);
175
- }, L = (a, l) => {
176
- const d = [...e || []];
177
- d.reduce(
178
- (H, B, G) => H + (B === l && G !== a ? 1 : 0),
179
- 0
180
- ) > 0 ? d.splice(a, 1) : d[a] = l, n(d);
181
- }, Y = (a) => {
182
- a.preventDefault();
183
- const d = a.clipboardData.getData("text/plain").split(/[\s,;\n]+/);
184
- n([...e || [], ...d]);
185
- };
186
- return /* @__PURE__ */ c.createElement(c.Fragment, null, /* @__PURE__ */ c.createElement(J, { as: "div", className: o }, e == null ? void 0 : e.map((a, l) => /* @__PURE__ */ c.createElement(
187
- Z,
188
- {
189
- index: l,
190
- key: `${l}${a}`,
191
- update: L,
192
- remove: K,
193
- inputRef: V,
194
- validator: r,
195
- size: m
196
- },
197
- a
198
- )), /* @__PURE__ */ c.createElement(
199
- "input",
200
- $(D({}, y), {
201
- id: t,
202
- ref: V,
203
- className: I,
204
- placeholder: _,
205
- value: g,
206
- onChange: S,
207
- onKeyDown: M,
208
- onPaste: Y,
209
- onBlur: F
210
- })
211
- )), u && /* @__PURE__ */ c.createElement(A, null, u));
212
- }, ae = /^(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)])$/i, re = "name@company.com", oe = (t) => ae.test(t), Te = (x) => {
213
- var s = x, {
214
- id: t,
215
- tags: e,
216
- onChange: n,
217
- error: r,
218
- placeholder: u = re,
219
- size: _
220
- } = s, m = z(s, [
221
- "id",
222
- "tags",
223
- "onChange",
224
- "error",
225
- "placeholder",
226
- "size"
227
- ]);
228
- return /* @__PURE__ */ c.createElement(
229
- ne,
230
- $(D({}, m), {
231
- id: t,
232
- tags: e,
233
- error: r,
234
- onChange: n,
235
- placeholder: u,
236
- validator: oe,
237
- size: _
238
- })
239
- );
240
- };
241
- export {
242
- Te as EmailTagInput,
243
- ne as TagInput
244
- };
@@ -1 +0,0 @@
1
- "use strict";var v=Object.defineProperty,S=Object.defineProperties;var E=Object.getOwnPropertyDescriptors;var s=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable;var x=(e,a,t)=>a in e?v(e,a,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[a]=t,b=(e,a)=>{for(var t in a||(a={}))f.call(a,t)&&x(e,t,a[t]);if(s)for(var t of s(a))m.call(a,t)&&x(e,t,a[t]);return e},T=(e,a)=>S(e,E(a));var g=(e,a)=>{var t={};for(var r in e)f.call(e,r)&&a.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&s)for(var r of s(e))a.indexOf(r)<0&&m.call(e,r)&&(t[r]=e[r]);return t};Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const F=require("react"),N=require("clsx");require("../../chunks/Typography.module-2558416b.js");const R=require("../../chunks/Text-df483689.js");function $(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const c=$(F),h="lc-Textarea-module__textarea___g6U8F",o={textarea:h,"textarea--focused":"lc-Textarea-module__textarea--focused___1vtEx","textarea--disabled":"lc-Textarea-module__textarea--disabled___xXaGv","textarea--error":"lc-Textarea-module__textarea--error___0EGuq"},n="textarea",w=c.forwardRef((C,r)=>{var _=C,{className:e,error:a}=_,t=g(_,["className","error"]);const{disabled:O,onBlur:l,onFocus:u}=t,[p,i]=c.useState(!1),y=N(e,o[n],{[o[`${n}--disabled`]]:O,[o[`${n}--focused`]]:p,[o[`${n}--error`]]:a}),j=d=>{i(!1),l==null||l(d)},q=d=>{i(!0),u==null||u(d)};return c.createElement(R.Text,{as:"div",className:y},c.createElement("textarea",T(b({},t),{ref:r,onFocus:q,onBlur:j})))});exports.Textarea=w;
@@ -1,55 +0,0 @@
1
- var h = Object.defineProperty, C = Object.defineProperties;
2
- var G = Object.getOwnPropertyDescriptors;
3
- var s = Object.getOwnPropertySymbols;
4
- var f = Object.prototype.hasOwnProperty, i = Object.prototype.propertyIsEnumerable;
5
- var u = (e, a, t) => a in e ? h(e, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[a] = t, T = (e, a) => {
6
- for (var t in a || (a = {}))
7
- f.call(a, t) && u(e, t, a[t]);
8
- if (s)
9
- for (var t of s(a))
10
- i.call(a, t) && u(e, t, a[t]);
11
- return e;
12
- }, b = (e, a) => C(e, G(a));
13
- var p = (e, a) => {
14
- var t = {};
15
- for (var r in e)
16
- f.call(e, r) && a.indexOf(r) < 0 && (t[r] = e[r]);
17
- if (e != null && s)
18
- for (var r of s(e))
19
- a.indexOf(r) < 0 && i.call(e, r) && (t[r] = e[r]);
20
- return t;
21
- };
22
- import * as o from "react";
23
- import N from "clsx";
24
- import "../../chunks/Typography.module-93efb34d.js";
25
- import { T as O } from "../../chunks/Text-b31d1e9a.js";
26
- const R = "lc-Textarea-module__textarea___g6U8F", c = {
27
- textarea: R,
28
- "textarea--focused": "lc-Textarea-module__textarea--focused___1vtEx",
29
- "textarea--disabled": "lc-Textarea-module__textarea--disabled___xXaGv",
30
- "textarea--error": "lc-Textarea-module__textarea--error___0EGuq"
31
- }, l = "textarea", S = o.forwardRef(
32
- (q, r) => {
33
- var m = q, { className: e, error: a } = m, t = p(m, ["className", "error"]);
34
- const { disabled: E, onBlur: d, onFocus: x } = t, [F, n] = o.useState(!1), v = N(e, c[l], {
35
- [c[`${l}--disabled`]]: E,
36
- [c[`${l}--focused`]]: F,
37
- [c[`${l}--error`]]: a
38
- }), $ = (_) => {
39
- n(!1), d == null || d(_);
40
- }, g = (_) => {
41
- n(!0), x == null || x(_);
42
- };
43
- return /* @__PURE__ */ o.createElement(O, { as: "div", className: v }, /* @__PURE__ */ o.createElement(
44
- "textarea",
45
- b(T({}, t), {
46
- ref: r,
47
- onFocus: g,
48
- onBlur: $
49
- })
50
- ));
51
- }
52
- );
53
- export {
54
- S as Textarea
55
- };
@@ -1 +0,0 @@
1
- "use strict";var O=Object.defineProperty,j=Object.defineProperties;var M=Object.getOwnPropertyDescriptors;var d=Object.getOwnPropertySymbols;var $=Object.prototype.hasOwnProperty,N=Object.prototype.propertyIsEnumerable;var x=(t,o,e)=>o in t?O(t,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[o]=e,w=(t,o)=>{for(var e in o||(o={}))$.call(o,e)&&x(t,e,o[e]);if(d)for(var e of d(o))N.call(o,e)&&x(t,e,o[e]);return t},C=(t,o)=>j(t,M(o));var E=(t,o)=>{var e={};for(var a in t)$.call(t,a)&&o.indexOf(a)<0&&(e[a]=t[a]);if(t!=null&&d)for(var a of d(t))o.indexOf(a)<0&&N.call(t,a)&&(e[a]=t[a]);return e};Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),u=require("@livechat/design-system-icons"),v=require("clsx"),h=require("../Button/index.cjs.js"),I=require("../Icon/index.cjs.js");require("../../chunks/Typography.module-2558416b.js");const y=require("../../chunks/Text-df483689.js"),k=require("react-transition-group");require("../Loader/index.cjs.js");function S(t){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const a=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(o,e,a.get?a:{enumerable:!0,get:()=>t[e]})}}return o.default=t,Object.freeze(o)}const _=S(G),B="lc-Toast-module__toast___j5Amn",W="lc-Toast-module__toast__content___HjaNw",D="lc-Toast-module__toast__actions___JWu-1",H="lc-Toast-module__toast__actions__button___Iblrl",s={toast:B,toast__content:W,toast__actions:D,toast__actions__button:H,"toast__actions__button--success":"lc-Toast-module__toast__actions__button--success___5JmFw","toast__actions__button--warning":"lc-Toast-module__toast__actions__button--warning___zGQ-Q","toast__actions__button--error":"lc-Toast-module__toast__actions__button--error___PuTv3","toast__actions__button--info":"lc-Toast-module__toast__actions__button--info___fNtsj","toast__actions--custom":"lc-Toast-module__toast__actions--custom___lm-pM","toast--success":"lc-Toast-module__toast--success___7UC6m","toast--warning":"lc-Toast-module__toast--warning___pteb7","toast--error":"lc-Toast-module__toast--error___trg--","toast--info":"lc-Toast-module__toast--info___IOp44","toast-wrapper":"lc-Toast-module__toast-wrapper___Oiwqp","toast-wrapper--fixed":"lc-Toast-module__toast-wrapper--fixed___QYxRI","toast-wrapper--block":"lc-Toast-module__toast-wrapper--block___j0kGt","toast-wrapper--horizontal-center":"lc-Toast-module__toast-wrapper--horizontal-center___t9AFd","toast-wrapper--horizontal-left":"lc-Toast-module__toast-wrapper--horizontal-left___-GY4I","toast-wrapper--horizontal-right":"lc-Toast-module__toast-wrapper--horizontal-right___VVMgm","toast-wrapper--vertical-top":"lc-Toast-module__toast-wrapper--vertical-top___uBfEG","toast-appear--slide":"lc-Toast-module__toast-appear--slide___G7GAp","toast-appear-active--slide":"lc-Toast-module__toast-appear-active--slide___brfgK","toast-exit--slide":"lc-Toast-module__toast-exit--slide___aqiBq","toast-exit-active--slide":"lc-Toast-module__toast-exit-active--slide___WryMi","toast-wrapper--vertical-bottom":"lc-Toast-module__toast-wrapper--vertical-bottom___erPuH","toast-appear--fade":"lc-Toast-module__toast-appear--fade___oUwHm","toast-appear-active--fade":"lc-Toast-module__toast-appear-active--fade___D3--J","toast-exit--fade":"lc-Toast-module__toast-exit--fade___iDA1p","toast-exit-active--fade":"lc-Toast-module__toast-exit-active--fade___tL7sb"},J={success:{source:u.CheckCircle},warning:{source:u.Warning},error:{source:u.Block},info:{source:u.Info}},r="toast",q=g=>{var m=g,{action:t,className:o,children:e,removable:a,kind:c="info",onClose:n}=m,p=E(m,["action","className","children","removable","kind","onClose"]);const T=v(s[r],s[`${r}--${c}`],o),f=typeof e=="string",b=l=>l&&l.closesOnClick&&n?(l.onClick(),n()):l.onClick();return _.createElement("div",w({className:T},p),_.createElement("div",{className:s[`${r}__icon`]},_.createElement(I.Icon,C(w({},J[c]),{size:"medium"}))),_.createElement("div",{className:s[`${r}__content`]},f?_.createElement(y.Text,{as:"div"},e):e),(t||a)&&_.createElement("div",{className:s[`${r}__actions`]},t&&_.createElement(h.Button,{className:s[`${r}__actions--custom`],kind:"text",size:"compact",onClick:()=>b(t)},t.label),a&&_.createElement("button",{className:v(s[`${r}__actions__button`],s[`${r}__actions__button--${c}`]),"aria-label":"Close toast",onClick:n},_.createElement(I.Icon,{source:u.Close,size:"medium"}))))},z=200,i="toast-wrapper",P=({className:t,toasts:o=[],fixed:e=!0,block:a=!1,animationType:c="slide",verticalPosition:n="top",horizontalPosition:p="center"})=>{const g=v(s[i],{[s[`${i}--fixed`]]:e,[s[`${i}--block`]]:!e&&a,[s[`${i}--horizontal-${p}`]]:p,[s[`${i}--vertical-${n}`]]:n},t);return _.createElement("div",{className:g},_.createElement(k.TransitionGroup,{component:null},o.map(({id:m,kind:T,content:f,removable:b,action:l,onClose:A})=>_.createElement(k.CSSTransition,{key:m,classNames:{enter:s[`toast-appear--${c}`],enterActive:s[`toast-appear-active--${c}`],exit:s[`toast-exit--${c}`],exitActive:s[`toast-exit-active--${c}`]},timeout:z},_.createElement(q,{kind:T,onClose:A,removable:b,action:l},f)))))};exports.ANIMATION_TIME=z;exports.Toast=q;exports.ToastWrapper=P;
@@ -1,163 +0,0 @@
1
- var z = Object.defineProperty, A = Object.defineProperties;
2
- var I = Object.getOwnPropertyDescriptors;
3
- var u = Object.getOwnPropertySymbols;
4
- var $ = Object.prototype.hasOwnProperty, C = Object.prototype.propertyIsEnumerable;
5
- var x = (t, a, o) => a in t ? z(t, a, { enumerable: !0, configurable: !0, writable: !0, value: o }) : t[a] = o, b = (t, a) => {
6
- for (var o in a || (a = {}))
7
- $.call(a, o) && x(t, o, a[o]);
8
- if (u)
9
- for (var o of u(a))
10
- C.call(a, o) && x(t, o, a[o]);
11
- return t;
12
- }, g = (t, a) => A(t, I(a));
13
- var E = (t, a) => {
14
- var o = {};
15
- for (var _ in t)
16
- $.call(t, _) && a.indexOf(_) < 0 && (o[_] = t[_]);
17
- if (t != null && u)
18
- for (var _ of u(t))
19
- a.indexOf(_) < 0 && C.call(t, _) && (o[_] = t[_]);
20
- return o;
21
- };
22
- import * as s from "react";
23
- import { Close as h, CheckCircle as G, Warning as M, Block as j, Info as B } from "@livechat/design-system-icons";
24
- import w from "clsx";
25
- import { Button as O } from "../Button/index.es.js";
26
- import { Icon as N } from "../Icon/index.es.js";
27
- import "../../chunks/Typography.module-93efb34d.js";
28
- import { T as W } from "../../chunks/Text-b31d1e9a.js";
29
- import { TransitionGroup as q, CSSTransition as H } from "react-transition-group";
30
- import "../Loader/index.es.js";
31
- const J = "lc-Toast-module__toast___j5Amn", Q = "lc-Toast-module__toast__content___HjaNw", D = "lc-Toast-module__toast__actions___JWu-1", F = "lc-Toast-module__toast__actions__button___Iblrl", e = {
32
- toast: J,
33
- toast__content: Q,
34
- toast__actions: D,
35
- toast__actions__button: F,
36
- "toast__actions__button--success": "lc-Toast-module__toast__actions__button--success___5JmFw",
37
- "toast__actions__button--warning": "lc-Toast-module__toast__actions__button--warning___zGQ-Q",
38
- "toast__actions__button--error": "lc-Toast-module__toast__actions__button--error___PuTv3",
39
- "toast__actions__button--info": "lc-Toast-module__toast__actions__button--info___fNtsj",
40
- "toast__actions--custom": "lc-Toast-module__toast__actions--custom___lm-pM",
41
- "toast--success": "lc-Toast-module__toast--success___7UC6m",
42
- "toast--warning": "lc-Toast-module__toast--warning___pteb7",
43
- "toast--error": "lc-Toast-module__toast--error___trg--",
44
- "toast--info": "lc-Toast-module__toast--info___IOp44",
45
- "toast-wrapper": "lc-Toast-module__toast-wrapper___Oiwqp",
46
- "toast-wrapper--fixed": "lc-Toast-module__toast-wrapper--fixed___QYxRI",
47
- "toast-wrapper--block": "lc-Toast-module__toast-wrapper--block___j0kGt",
48
- "toast-wrapper--horizontal-center": "lc-Toast-module__toast-wrapper--horizontal-center___t9AFd",
49
- "toast-wrapper--horizontal-left": "lc-Toast-module__toast-wrapper--horizontal-left___-GY4I",
50
- "toast-wrapper--horizontal-right": "lc-Toast-module__toast-wrapper--horizontal-right___VVMgm",
51
- "toast-wrapper--vertical-top": "lc-Toast-module__toast-wrapper--vertical-top___uBfEG",
52
- "toast-appear--slide": "lc-Toast-module__toast-appear--slide___G7GAp",
53
- "toast-appear-active--slide": "lc-Toast-module__toast-appear-active--slide___brfgK",
54
- "toast-exit--slide": "lc-Toast-module__toast-exit--slide___aqiBq",
55
- "toast-exit-active--slide": "lc-Toast-module__toast-exit-active--slide___WryMi",
56
- "toast-wrapper--vertical-bottom": "lc-Toast-module__toast-wrapper--vertical-bottom___erPuH",
57
- "toast-appear--fade": "lc-Toast-module__toast-appear--fade___oUwHm",
58
- "toast-appear-active--fade": "lc-Toast-module__toast-appear-active--fade___D3--J",
59
- "toast-exit--fade": "lc-Toast-module__toast-exit--fade___iDA1p",
60
- "toast-exit-active--fade": "lc-Toast-module__toast-exit-active--fade___tL7sb"
61
- }, R = {
62
- success: {
63
- source: G
64
- },
65
- warning: {
66
- source: M
67
- },
68
- error: {
69
- source: j
70
- },
71
- info: {
72
- source: B
73
- }
74
- }, r = "toast", S = (v) => {
75
- var p = v, {
76
- action: t,
77
- className: a,
78
- children: o,
79
- removable: _,
80
- kind: c = "info",
81
- onClose: l
82
- } = p, m = E(p, [
83
- "action",
84
- "className",
85
- "children",
86
- "removable",
87
- "kind",
88
- "onClose"
89
- ]);
90
- const d = w(
91
- e[r],
92
- e[`${r}--${c}`],
93
- a
94
- ), T = typeof o == "string", f = (n) => n && n.closesOnClick && l ? (n.onClick(), l()) : n.onClick();
95
- return /* @__PURE__ */ s.createElement("div", b({ className: d }, m), /* @__PURE__ */ s.createElement("div", { className: e[`${r}__icon`] }, /* @__PURE__ */ s.createElement(N, g(b({}, R[c]), { size: "medium" }))), /* @__PURE__ */ s.createElement("div", { className: e[`${r}__content`] }, T ? /* @__PURE__ */ s.createElement(W, { as: "div" }, o) : o), (t || _) && /* @__PURE__ */ s.createElement("div", { className: e[`${r}__actions`] }, t && /* @__PURE__ */ s.createElement(
96
- O,
97
- {
98
- className: e[`${r}__actions--custom`],
99
- kind: "text",
100
- size: "compact",
101
- onClick: () => f(t)
102
- },
103
- t.label
104
- ), _ && /* @__PURE__ */ s.createElement(
105
- "button",
106
- {
107
- className: w(
108
- e[`${r}__actions__button`],
109
- e[`${r}__actions__button--${c}`]
110
- ),
111
- "aria-label": "Close toast",
112
- onClick: l
113
- },
114
- /* @__PURE__ */ s.createElement(N, { source: h, size: "medium" })
115
- )));
116
- }, U = 200, i = "toast-wrapper", ot = ({
117
- className: t,
118
- toasts: a = [],
119
- fixed: o = !0,
120
- block: _ = !1,
121
- animationType: c = "slide",
122
- verticalPosition: l = "top",
123
- horizontalPosition: m = "center"
124
- }) => {
125
- const v = w(
126
- e[i],
127
- {
128
- [e[`${i}--fixed`]]: o,
129
- [e[`${i}--block`]]: !o && _,
130
- [e[`${i}--horizontal-${m}`]]: m,
131
- [e[`${i}--vertical-${l}`]]: l
132
- },
133
- t
134
- );
135
- return /* @__PURE__ */ s.createElement("div", { className: v }, /* @__PURE__ */ s.createElement(q, { component: null }, a.map(({ id: p, kind: d, content: T, removable: f, action: n, onClose: k }) => /* @__PURE__ */ s.createElement(
136
- H,
137
- {
138
- key: p,
139
- classNames: {
140
- enter: e[`toast-appear--${c}`],
141
- enterActive: e[`toast-appear-active--${c}`],
142
- exit: e[`toast-exit--${c}`],
143
- exitActive: e[`toast-exit-active--${c}`]
144
- },
145
- timeout: U
146
- },
147
- /* @__PURE__ */ s.createElement(
148
- S,
149
- {
150
- kind: d,
151
- onClose: k,
152
- removable: f,
153
- action: n
154
- },
155
- T
156
- )
157
- ))));
158
- };
159
- export {
160
- U as ANIMATION_TIME,
161
- S as Toast,
162
- ot as ToastWrapper
163
- };
@@ -1 +0,0 @@
1
- "use strict";var R=Object.defineProperty,S=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var p=Object.getOwnPropertySymbols;var N=Object.prototype.hasOwnProperty,B=Object.prototype.propertyIsEnumerable;var v=(e,t,n)=>t in e?R(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,_=(e,t)=>{for(var n in t||(t={}))N.call(t,n)&&v(e,n,t[n]);if(p)for(var n of p(t))B.call(t,n)&&v(e,n,t[n]);return e},$=(e,t)=>S(e,C(t));var f=(e,t,n)=>(v(e,typeof t!="symbol"?t+"":t,n),n);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O=require("react"),h=require("clsx"),l=require("../../../../chunks/Tooltip-f9f79274.js");require("@floating-ui/react");require("../../../../chunks/Typography.module-2558416b.js");require("../../../../chunks/Text-df483689.js");function P(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const s=P(O),i="guide-tooltip",q=({gap:e,isVisible:t,slide:n,disablePointerEvents:o})=>{if(!e)return null;const c={top:`${e.top}px`,left:"0",width:`${e.left}px`,height:`${e.height}px`},r={top:`${e.top}px`,left:`${e.right}px`,width:`calc(100% - ${e.right}px)`,height:`${e.height}px`},d={top:"0",left:"0",width:"100%",height:`${e.top}px`},a={top:`${e.bottom}px`,left:"0",width:"100%",height:`calc(100% - ${e.bottom}px)`},u={top:`${e.top}px`,left:`${e.left}px`,width:`${e.width}px`,height:`${e.height}px`,backgroundColor:"transparent"};return s.createElement(s.Fragment,null,s.createElement("div",{className:h({[l.styles[`${i}__overlay`]]:!0,[l.styles[`${i}__overlay--visible`]]:t,[l.styles[`${i}__overlay--slide`]]:n}),style:c}),s.createElement("div",{className:h({[l.styles[`${i}__overlay`]]:!0,[l.styles[`${i}__overlay--visible`]]:t,[l.styles[`${i}__overlay--slide`]]:n}),style:d}),s.createElement("div",{className:h({[l.styles[`${i}__overlay`]]:!0,[l.styles[`${i}__overlay--visible`]]:t,[l.styles[`${i}__overlay--slide`]]:n}),style:r}),s.createElement("div",{className:h({[l.styles[`${i}__overlay`]]:!0,[l.styles[`${i}__overlay--visible`]]:t,[l.styles[`${i}__overlay--slide`]]:n}),style:a}),o&&s.createElement("div",{className:h({[l.styles[`${i}__overlay`]]:!0,[l.styles[`${i}__overlay--visible`]]:t,[l.styles[`${i}__overlay--slide`]]:n}),style:u}))};class M{constructor(t,n){f(this,"element");f(this,"padding");this.element=t,this.padding=n}addPadding(t){const n=Math.round(t.left)-this.padding,o=Math.round(t.top)-this.padding,c=Math.round(t.width)+2*this.padding,r=Math.round(t.height)+2*this.padding,d=o,a=n,u=d+r,y=a+c;return{x:n,y:o,width:c,height:r,top:d,left:a,bottom:u,right:y}}getBoundingClientRect(){return this.addPadding(this.element.getBoundingClientRect())}get clientWidth(){return this.getBoundingClientRect().width}get clientHeight(){return this.getBoundingClientRect().height}}const E=8,w="guide-tooltip",b=(e,t)=>new M(e,t),j=e=>{const{className:t,parentElementName:n,isVisible:o=!1,shouldSlide:c=!0}=e,[r,d]=s.useState(null),[a,u]=s.useState(null),[y,m]=s.useState(c),g=()=>{r&&(u(b(r,E).getBoundingClientRect()),m(!1))};return s.useEffect(()=>{if(r!==null)return window.addEventListener("resize",g),window.addEventListener("scroll",g),()=>{window.addEventListener("resize",g),window.addEventListener("resize",g)}},[r,n]),s.useEffect(()=>{if(n){const x=document.querySelector(n);d(x)}},[n]),s.useEffect(()=>{r&&u(b(r,E).getBoundingClientRect()),m(!0)},[r]),r&&o?s.createElement("div",null,s.createElement(q,{gap:a,isVisible:o,slide:y,disablePointerEvents:!0}),s.createElement(l.Tooltip,$(_({},e),{referenceElement:{getBoundingClientRect:()=>a,contextElement:r},arrowOffsetY:25,className:h({[l.styles[w]]:!0,[l.styles[`${w}--slide`]]:y,className:t})}),e.children)):null};exports.UserGuide=j;
@@ -1,196 +0,0 @@
1
- var C = Object.defineProperty, b = Object.defineProperties;
2
- var B = Object.getOwnPropertyDescriptors;
3
- var f = Object.getOwnPropertySymbols;
4
- var N = Object.prototype.hasOwnProperty, S = Object.prototype.propertyIsEnumerable;
5
- var v = (e, t, n) => t in e ? C(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, _ = (e, t) => {
6
- for (var n in t || (t = {}))
7
- N.call(t, n) && v(e, n, t[n]);
8
- if (f)
9
- for (var n of f(t))
10
- S.call(t, n) && v(e, n, t[n]);
11
- return e;
12
- }, y = (e, t) => b(e, B(t));
13
- var p = (e, t, n) => (v(e, typeof t != "symbol" ? t + "" : t, n), n);
14
- import * as i from "react";
15
- import u from "clsx";
16
- import { s as l, T as L } from "../../../../chunks/Tooltip-1c5cb6fe.js";
17
- import "@floating-ui/react";
18
- import "../../../../chunks/Typography.module-93efb34d.js";
19
- import "../../../../chunks/Text-b31d1e9a.js";
20
- const o = "guide-tooltip", P = ({
21
- gap: e,
22
- isVisible: t,
23
- slide: n,
24
- disablePointerEvents: s
25
- }) => {
26
- if (!e)
27
- return null;
28
- const d = {
29
- top: `${e.top}px`,
30
- left: "0",
31
- width: `${e.left}px`,
32
- height: `${e.height}px`
33
- }, r = {
34
- top: `${e.top}px`,
35
- left: `${e.right}px`,
36
- width: `calc(100% - ${e.right}px)`,
37
- height: `${e.height}px`
38
- }, c = {
39
- top: "0",
40
- left: "0",
41
- width: "100%",
42
- height: `${e.top}px`
43
- }, a = {
44
- top: `${e.bottom}px`,
45
- left: "0",
46
- width: "100%",
47
- height: `calc(100% - ${e.bottom}px)`
48
- }, h = {
49
- top: `${e.top}px`,
50
- left: `${e.left}px`,
51
- width: `${e.width}px`,
52
- height: `${e.height}px`,
53
- backgroundColor: "transparent"
54
- };
55
- return /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(
56
- "div",
57
- {
58
- className: u({
59
- [l[`${o}__overlay`]]: !0,
60
- [l[`${o}__overlay--visible`]]: t,
61
- [l[`${o}__overlay--slide`]]: n
62
- }),
63
- style: d
64
- }
65
- ), /* @__PURE__ */ i.createElement(
66
- "div",
67
- {
68
- className: u({
69
- [l[`${o}__overlay`]]: !0,
70
- [l[`${o}__overlay--visible`]]: t,
71
- [l[`${o}__overlay--slide`]]: n
72
- }),
73
- style: c
74
- }
75
- ), /* @__PURE__ */ i.createElement(
76
- "div",
77
- {
78
- className: u({
79
- [l[`${o}__overlay`]]: !0,
80
- [l[`${o}__overlay--visible`]]: t,
81
- [l[`${o}__overlay--slide`]]: n
82
- }),
83
- style: r
84
- }
85
- ), /* @__PURE__ */ i.createElement(
86
- "div",
87
- {
88
- className: u({
89
- [l[`${o}__overlay`]]: !0,
90
- [l[`${o}__overlay--visible`]]: t,
91
- [l[`${o}__overlay--slide`]]: n
92
- }),
93
- style: a
94
- }
95
- ), s && /* @__PURE__ */ i.createElement(
96
- "div",
97
- {
98
- className: u({
99
- [l[`${o}__overlay`]]: !0,
100
- [l[`${o}__overlay--visible`]]: t,
101
- [l[`${o}__overlay--slide`]]: n
102
- }),
103
- style: h
104
- }
105
- ));
106
- };
107
- class M {
108
- constructor(t, n) {
109
- p(this, "element");
110
- p(this, "padding");
111
- this.element = t, this.padding = n;
112
- }
113
- addPadding(t) {
114
- const n = Math.round(t.left) - this.padding, s = Math.round(t.top) - this.padding, d = Math.round(t.width) + 2 * this.padding, r = Math.round(t.height) + 2 * this.padding, c = s, a = n, h = c + r, m = a + d;
115
- return {
116
- x: n,
117
- y: s,
118
- width: d,
119
- height: r,
120
- top: c,
121
- left: a,
122
- bottom: h,
123
- right: m
124
- };
125
- }
126
- getBoundingClientRect() {
127
- return this.addPadding(this.element.getBoundingClientRect());
128
- }
129
- get clientWidth() {
130
- return this.getBoundingClientRect().width;
131
- }
132
- get clientHeight() {
133
- return this.getBoundingClientRect().height;
134
- }
135
- }
136
- const E = 8, w = "guide-tooltip", x = (e, t) => new M(e, t), G = (e) => {
137
- const {
138
- className: t,
139
- parentElementName: n,
140
- isVisible: s = !1,
141
- shouldSlide: d = !0
142
- } = e, [r, c] = i.useState(
143
- null
144
- ), [a, h] = i.useState(null), [m, $] = i.useState(d), g = () => {
145
- r && (h(
146
- x(
147
- r,
148
- E
149
- ).getBoundingClientRect()
150
- ), $(!1));
151
- };
152
- return i.useEffect(() => {
153
- if (r !== null)
154
- return window.addEventListener("resize", g), window.addEventListener("scroll", g), () => {
155
- window.addEventListener("resize", g), window.addEventListener("resize", g);
156
- };
157
- }, [r, n]), i.useEffect(() => {
158
- if (n) {
159
- const R = document.querySelector(n);
160
- c(R);
161
- }
162
- }, [n]), i.useEffect(() => {
163
- r && h(
164
- x(
165
- r,
166
- E
167
- ).getBoundingClientRect()
168
- ), $(!0);
169
- }, [r]), r && s ? /* @__PURE__ */ i.createElement("div", null, /* @__PURE__ */ i.createElement(
170
- P,
171
- {
172
- gap: a,
173
- isVisible: s,
174
- slide: m,
175
- disablePointerEvents: !0
176
- }
177
- ), /* @__PURE__ */ i.createElement(
178
- L,
179
- y(_({}, e), {
180
- referenceElement: {
181
- getBoundingClientRect: () => a,
182
- contextElement: r
183
- },
184
- arrowOffsetY: 25,
185
- className: u({
186
- [l[w]]: !0,
187
- [l[`${w}--slide`]]: m,
188
- className: t
189
- })
190
- }),
191
- e.children
192
- )) : null;
193
- };
194
- export {
195
- G as UserGuide
196
- };