kitzo 2.3.6 → 2.3.7

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 (37) hide show
  1. package/README.md +39 -258
  2. package/dist/fns.d.ts +3 -0
  3. package/dist/fns.js +4 -0
  4. package/dist/functions/copy/copy.js +23 -0
  5. package/dist/index.d.ts +119 -0
  6. package/dist/index.js +14 -0
  7. package/dist/react/components/toast/Toaster.js +71 -0
  8. package/dist/react/components/toast/helpers/addToastStyles.js +259 -0
  9. package/dist/react/components/toast/helpers/createToast.js +45 -0
  10. package/dist/react/components/toast/helpers/listenar.js +14 -0
  11. package/dist/react/components/toast/helpers/manageToasts/addToasts.js +12 -0
  12. package/dist/react/components/toast/helpers/manageToasts/dismissToasts.js +17 -0
  13. package/dist/react/components/toast/helpers/manageToasts/manageToasts.js +9 -0
  14. package/dist/react/components/toast/helpers/manageToasts/timers.js +39 -0
  15. package/dist/react/components/toast/helpers/manageToasts/updateToasts.js +10 -0
  16. package/dist/react/components/toast/helpers/triggerToasts.js +99 -0
  17. package/dist/react/components/toast/partials/Svgs.js +98 -0
  18. package/dist/react/components/toast/partials/Toast.js +54 -0
  19. package/dist/react/components/toast/partials/ToastContainer.js +59 -0
  20. package/dist/react/components/tooltip/Tooltip.js +67 -0
  21. package/dist/react/components/tooltip/helpers/addTooltipStyles.js +230 -0
  22. package/dist/react/components/tooltip/helpers/getAnimationProperties.js +12 -0
  23. package/dist/react/components/tooltip/helpers/getPositionClass.js +27 -0
  24. package/dist/react/components/tooltip/partials/TooltipWrapper.js +29 -0
  25. package/dist/react/hooks/useCopy.js +38 -0
  26. package/dist/react/hooks/useDebounce.js +16 -0
  27. package/dist/react/hooks/useWindowSize.js +26 -0
  28. package/package.json +73 -77
  29. package/dist/functions/index.js +0 -36
  30. package/dist/functions/index.js.map +0 -1
  31. package/dist/functions/types.d.ts +0 -2
  32. package/dist/react/index.js +0 -1086
  33. package/dist/react/index.js.map +0 -1
  34. package/dist/react/types/hooks.d.ts +0 -34
  35. package/dist/react/types/toast.d.ts +0 -60
  36. package/dist/react/types/tooltip.d.ts +0 -55
  37. package/dist/react/types.d.ts +0 -3
@@ -1,1086 +0,0 @@
1
- import React, { useRef, useLayoutEffect, useState, useEffect, useCallback } from 'react';
2
-
3
- function _arrayLikeToArray(r, a) {
4
- (null == a || a > r.length) && (a = r.length);
5
- for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
6
- return n;
7
- }
8
- function _arrayWithHoles(r) {
9
- if (Array.isArray(r)) return r;
10
- }
11
- function _arrayWithoutHoles(r) {
12
- if (Array.isArray(r)) return _arrayLikeToArray(r);
13
- }
14
- function asyncGeneratorStep(n, t, e, r, o, a, c) {
15
- try {
16
- var i = n[a](c),
17
- u = i.value;
18
- } catch (n) {
19
- return void e(n);
20
- }
21
- i.done ? t(u) : Promise.resolve(u).then(r, o);
22
- }
23
- function _asyncToGenerator(n) {
24
- return function () {
25
- var t = this,
26
- e = arguments;
27
- return new Promise(function (r, o) {
28
- var a = n.apply(t, e);
29
- function _next(n) {
30
- asyncGeneratorStep(a, r, o, _next, _throw, "next", n);
31
- }
32
- function _throw(n) {
33
- asyncGeneratorStep(a, r, o, _next, _throw, "throw", n);
34
- }
35
- _next(void 0);
36
- });
37
- };
38
- }
39
- function _defineProperty(e, r, t) {
40
- return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
41
- value: t,
42
- enumerable: true,
43
- configurable: true,
44
- writable: true
45
- }) : e[r] = t, e;
46
- }
47
- function _iterableToArray(r) {
48
- if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
49
- }
50
- function _iterableToArrayLimit(r, l) {
51
- var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
52
- if (null != t) {
53
- var e,
54
- n,
55
- i,
56
- u,
57
- a = [],
58
- f = true,
59
- o = false;
60
- try {
61
- if (i = (t = t.call(r)).next, 0 === l) ; else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
62
- } catch (r) {
63
- o = true, n = r;
64
- } finally {
65
- try {
66
- if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
67
- } finally {
68
- if (o) throw n;
69
- }
70
- }
71
- return a;
72
- }
73
- }
74
- function _nonIterableRest() {
75
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
76
- }
77
- function _nonIterableSpread() {
78
- throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
79
- }
80
- function ownKeys(e, r) {
81
- var t = Object.keys(e);
82
- if (Object.getOwnPropertySymbols) {
83
- var o = Object.getOwnPropertySymbols(e);
84
- r && (o = o.filter(function (r) {
85
- return Object.getOwnPropertyDescriptor(e, r).enumerable;
86
- })), t.push.apply(t, o);
87
- }
88
- return t;
89
- }
90
- function _objectSpread2(e) {
91
- for (var r = 1; r < arguments.length; r++) {
92
- var t = null != arguments[r] ? arguments[r] : {};
93
- r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
94
- _defineProperty(e, r, t[r]);
95
- }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
96
- Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
97
- });
98
- }
99
- return e;
100
- }
101
- function _regenerator() {
102
- /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
103
- var e,
104
- t,
105
- r = "function" == typeof Symbol ? Symbol : {},
106
- n = r.iterator || "@@iterator",
107
- o = r.toStringTag || "@@toStringTag";
108
- function i(r, n, o, i) {
109
- var c = n && n.prototype instanceof Generator ? n : Generator,
110
- u = Object.create(c.prototype);
111
- return _regeneratorDefine(u, "_invoke", function (r, n, o) {
112
- var i,
113
- c,
114
- u,
115
- f = 0,
116
- p = o || [],
117
- y = false,
118
- G = {
119
- p: 0,
120
- n: 0,
121
- v: e,
122
- a: d,
123
- f: d.bind(e, 4),
124
- d: function (t, r) {
125
- return i = t, c = 0, u = e, G.n = r, a;
126
- }
127
- };
128
- function d(r, n) {
129
- for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) {
130
- var o,
131
- i = p[t],
132
- d = G.p,
133
- l = i[2];
134
- 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));
135
- }
136
- if (o || r > 1) return a;
137
- throw y = true, n;
138
- }
139
- return function (o, p, l) {
140
- if (f > 1) throw TypeError("Generator is already running");
141
- for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) {
142
- i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u);
143
- try {
144
- if (f = 2, i) {
145
- if (c || (o = "next"), t = i[o]) {
146
- if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object");
147
- if (!t.done) return t;
148
- u = t.value, c < 2 && (c = 0);
149
- } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1);
150
- i = e;
151
- } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break;
152
- } catch (t) {
153
- i = e, c = 1, u = t;
154
- } finally {
155
- f = 1;
156
- }
157
- }
158
- return {
159
- value: t,
160
- done: y
161
- };
162
- };
163
- }(r, o, i), true), u;
164
- }
165
- var a = {};
166
- function Generator() {}
167
- function GeneratorFunction() {}
168
- function GeneratorFunctionPrototype() {}
169
- t = Object.getPrototypeOf;
170
- var c = [][n] ? t(t([][n]())) : (_regeneratorDefine(t = {}, n, function () {
171
- return this;
172
- }), t),
173
- u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c);
174
- function f(e) {
175
- return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e;
176
- }
177
- return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine(u), _regeneratorDefine(u, o, "Generator"), _regeneratorDefine(u, n, function () {
178
- return this;
179
- }), _regeneratorDefine(u, "toString", function () {
180
- return "[object Generator]";
181
- }), (_regenerator = function () {
182
- return {
183
- w: i,
184
- m: f
185
- };
186
- })();
187
- }
188
- function _regeneratorDefine(e, r, n, t) {
189
- var i = Object.defineProperty;
190
- try {
191
- i({}, "", {});
192
- } catch (e) {
193
- i = 0;
194
- }
195
- _regeneratorDefine = function (e, r, n, t) {
196
- function o(r, n) {
197
- _regeneratorDefine(e, r, function (e) {
198
- return this._invoke(r, n, e);
199
- });
200
- }
201
- r ? i ? i(e, r, {
202
- value: n,
203
- enumerable: !t,
204
- configurable: !t,
205
- writable: !t
206
- }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2));
207
- }, _regeneratorDefine(e, r, n, t);
208
- }
209
- function _slicedToArray(r, e) {
210
- return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
211
- }
212
- function _toConsumableArray(r) {
213
- return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
214
- }
215
- function _toPrimitive(t, r) {
216
- if ("object" != typeof t || !t) return t;
217
- var e = t[Symbol.toPrimitive];
218
- if (void 0 !== e) {
219
- var i = e.call(t, r);
220
- if ("object" != typeof i) return i;
221
- throw new TypeError("@@toPrimitive must return a primitive value.");
222
- }
223
- return ("string" === r ? String : Number)(t);
224
- }
225
- function _toPropertyKey(t) {
226
- var i = _toPrimitive(t, "string");
227
- return "symbol" == typeof i ? i : i + "";
228
- }
229
- function _typeof(o) {
230
- "@babel/helpers - typeof";
231
-
232
- return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
233
- return typeof o;
234
- } : function (o) {
235
- return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
236
- }, _typeof(o);
237
- }
238
- function _unsupportedIterableToArray(r, a) {
239
- if (r) {
240
- if ("string" == typeof r) return _arrayLikeToArray(r, a);
241
- var t = {}.toString.call(r).slice(8, -1);
242
- 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;
243
- }
244
- }
245
-
246
- var toastStyles = ".kitzo-toast-container {\n --normal-bg: hsl(0, 0%, 100%);\n --normal-text: hsl(0, 0%, 10%);\n --normal-border: hsl(0, 0%, 94%);\n\n --success-bg: var(--normal-bg);\n --success-text: var(--normal-text);\n --success-border: var(--normal-border);\n --success-svg-clr: var(--normal-bg);\n --success-svg-bg: var(--normal-text);\n\n --error-bg: var(--normal-bg);\n --error-text: var(--normal-text);\n --error-border: var(--normal-border);\n --error-svg-clr: var(--normal-bg);\n --error-svg-bg: var(--normal-text);\n\n --info-bg: var(--normal-bg);\n --info-text: var(--normal-text);\n --info-border: var(--normal-border);\n --info-svg-clr: var(--normal-bg);\n --info-svg-bg: var(--normal-text);\n\n --loader-stroke: hsl(0, 0%, 50%);\n --loader-bg: hsl(0, 0%, 80%);\n}\n\n.kitzo-toast-container.kitzo-toast-dark {\n --normal-bg: hsl(0, 0%, 15%);\n --normal-text: hsl(0, 0%, 95%);\n --normal-border: hsl(0, 0%, 17%);\n\n --success-bg: var(--normal-bg);\n --success-text: var(--normal-text);\n --success-border: var(--normal-border);\n --success-svg-clr: var(--normal-bg);\n --success-svg-bg: var(--normal-text);\n\n --error-bg: var(--normal-bg);\n --error-text: var(--normal-text);\n --error-border: var(--normal-border);\n --error-svg-clr: var(--normal-bg);\n --error-svg-bg: var(--normal-text);\n\n --info-bg: var(--normal-bg);\n --info-text: var(--normal-text);\n --info-border: var(--normal-border);\n --info-svg-clr: var(--normal-bg);\n --info-svg-bg: var(--normal-text);\n\n --loader-stroke: hsl(0, 0%, 80%);\n --loader-bg: hsl(0, 0%, 50%);\n}\n\n.kitzo-toast-container.kitzo-toast-rich-colors {\n --success-bg: hsl(152, 65%, 95%);\n --success-text: hsl(142, 98%, 30%);\n --success-border: hsl(142, 100%, 93%);\n --success-svg-clr: white;\n --success-svg-bg: hsl(142, 98%, 40%);\n\n --error-bg: hsl(0, 65%, 95%);\n --error-text: hsl(6, 98%, 40%);\n --error-border: hsl(0, 100%, 94%);\n --error-svg-clr: white;\n --error-svg-bg: hsl(6, 98%, 50%);\n\n --info-bg: hsl(210, 65%, 95%);\n --info-text: hsl(210, 100%, 20%);\n --info-border: hsl(210, 100%, 94%);\n --info-svg-clr: white;\n --info-svg-bg: hsl(210, 100%, 40%);\n}\n\n.kitzo-toast-container.kitzo-toast-rich-colors.kitzo-toast-dark {\n --success-bg: hsl(152, 65%, 15%);\n --success-text: hsl(142, 98%, 70%);\n --success-border: hsl(142, 100%, 15%);\n --success-svg-clr: white;\n --success-svg-bg: hsl(142, 98%, 40%);\n\n --error-bg: hsl(0, 65%, 15%);\n --error-text: hsl(6, 98%, 70%);\n --error-border: hsl(0, 100%, 15%);\n --error-svg-clr: white;\n --error-svg-bg: hsl(6, 98%, 50%);\n\n --info-bg: hsl(210, 65%, 15%);\n --info-text: hsl(210, 100%, 70%);\n --info-border: hsl(210, 100%, 16%);\n --info-svg-clr: white;\n --info-svg-bg: hsl(210, 100%, 40%);\n}\n\n.kitzo-toast {\n font-family: inherit;\n font-size: 0.875rem;\n transition:\n transform 280ms,\n opacity 280ms;\n will-change: transform, opacity;\n}\n\n/*! toast transfor origin */\n.kitzo-toast.transform-origin-top-left {\n transform-origin: top left;\n}\n.kitzo-toast.transform-origin-top-center {\n transform-origin: top center;\n}\n.kitzo-toast.transform-origin-top-right {\n transform-origin: top right;\n}\n.kitzo-toast.transform-origin-bottom-left {\n transform-origin: bottom left;\n}\n.kitzo-toast.transform-origin-bottom-center {\n transform-origin: bottom center;\n}\n.kitzo-toast.transform-origin-bottom-right {\n transform-origin: bottom right;\n}\n\n/*! Toast theme styles */\n.kitzo-toast.type-normal {\n background-color: var(--normal-bg);\n color: var(--normal-text);\n border: 1px solid var(--normal-border);\n}\n.kitzo-toast.type-loading {\n background-color: var(--normal-bg);\n color: var(--normal-text);\n border: 1px solid var(--normal-border);\n}\n\n.kitzo-toast.type-success {\n background-color: var(--success-bg);\n color: var(--success-text);\n border: 1px solid var(--success-border);\n}\n\n.kitzo-toast.type-error {\n background-color: var(--error-bg);\n color: var(--error-text);\n border: 1px solid var(--error-border);\n}\n\n.kitzo-toast.type-info {\n background-color: var(--info-bg);\n color: var(--info-text);\n border: 1px solid var(--info-border);\n}\n\n.kitzo-toast.type-normal,\n.kitzo-toast.type-loading,\n.kitzo-toast.type-success,\n.kitzo-toast.type-error,\n.kitzo-toast.type-info {\n border-radius: 0.425rem;\n padding: 0.325rem 0.5rem;\n box-shadow: 0 3px 8px -3px hsl(0, 0%, 0%, 0.15);\n}\n\n/*! toast transition styles */\n.kitzo-toast.status-entering.pos-y-top {\n opacity: 0;\n transform: translateY(-120%) scale(0.6);\n}\n\n.kitzo-toast.status-visible.pos-y-top {\n opacity: 1;\n transform: translateY(0) scale(1);\n}\n\n.kitzo-toast.status-leaving.pos-y-top {\n transform-origin: top;\n opacity: 0;\n transform: translateY(-120%) scale(0.6);\n}\n\n.kitzo-toast.status-entering.pos-y-bottom {\n opacity: 0;\n transform: translateY(120%) scale(0.6);\n}\n\n.kitzo-toast.status-visible.pos-y-bottom {\n opacity: 1;\n transform: translateY(0) scale(1);\n}\n\n.kitzo-toast.status-leaving.pos-y-bottom {\n transform-origin: bottom;\n opacity: 0;\n transform: translateY(120%) scale(0.6);\n}\n\n.action-update {\n animation: update 150ms;\n}\n\n@keyframes update {\n 0% {\n opacity: 0.5;\n }\n 100% {\n opacity: 1;\n }\n}\n\n/*! svg stylings */\n.svg-container {\n display: grid;\n place-items: center;\n border-radius: 10rem;\n height: 18px;\n width: 18px;\n position: relative;\n overflow: hidden;\n\n scale: 1.1;\n animation: svg-container-animation 400ms ease-in-out forwards;\n\n svg {\n width: 12px;\n height: 12px;\n stroke-width: 4px;\n display: inline-block;\n }\n}\n\n.svg-container.success {\n color: var(--success-svg-clr);\n background-color: var(--success-svg-bg);\n}\n.svg-container.error {\n color: var(--error-svg-clr);\n background-color: var(--error-svg-bg);\n\n svg {\n scale: 0;\n animation: error-svg-zoom-in 170ms 130ms forwards;\n }\n}\n\n.svg-container.info {\n color: var(--info-svg-clr);\n background-color: var(--info-svg-bg);\n animation: info-svg-bell 400ms 200ms;\n\n svg {\n width: 14px;\n height: 14px;\n }\n}\n\n.svg-container.success::before {\n content: '';\n position: absolute;\n inset: 0;\n z-index: 5;\n border-radius: 10rem;\n background-color: var(--success-svg-bg);\n animation: success-container-before-animation 250ms 150ms forwards;\n}\n\n@keyframes svg-container-animation {\n 0% {\n scale: 1;\n }\n 50% {\n scale: 1.15;\n }\n 100% {\n scale: 1;\n }\n}\n\n@keyframes success-container-before-animation {\n from {\n translate: 0 0;\n }\n to {\n translate: 100% -50%;\n }\n}\n\n@keyframes error-svg-zoom-in {\n from {\n scale: 0;\n }\n to {\n scale: 1;\n }\n}\n\n@keyframes info-svg-bell {\n 0% {\n transform: rotate(0);\n }\n 25% {\n transform: rotate(15deg);\n }\n 75% {\n transform: rotate(-15deg);\n }\n 100% {\n transform: rotate(0);\n }\n}\n\n.promise-svg-container {\n width: 20px;\n height: 20px;\n display: grid;\n place-items: center;\n\n .loader {\n width: 14px;\n height: 14px;\n background-image: conic-gradient(\n var(--loader-stroke) 0 25%,\n var(--loader-bg) 0 100%\n );\n border-radius: 10rem;\n position: relative;\n animation: rotate-infinity 1000ms linear infinite;\n }\n .loader::before {\n content: '';\n position: absolute;\n inset: 2px;\n border-radius: inherit;\n background-color: var(--normal-bg);\n }\n}\n\n@keyframes rotate-infinity {\n to {\n rotate: 360deg;\n }\n}";
247
- var listeners = new Set();
248
- function subscribe(fn) {
249
- if (!document.getElementById('kitzo-toast-styles')) {
250
- var styleTag = document.createElement('style');
251
- styleTag.id = 'kitzo-toast-styles';
252
- styleTag.textContent = toastStyles;
253
- document.head.appendChild(styleTag);
254
- }
255
- listeners.add(fn);
256
- return function () {
257
- return listeners["delete"](fn);
258
- };
259
- }
260
- function notify(toast) {
261
- listeners.forEach(function (fn) {
262
- return fn(toast);
263
- });
264
- }
265
- var DEFAULTS = {
266
- duration: 2800,
267
- showIcon: true
268
- };
269
- var uid = 0;
270
- var genId = function genId() {
271
- var _crypto$randomUUID, _crypto$randomUUID2, _crypto;
272
- return (_crypto$randomUUID = (_crypto$randomUUID2 = (_crypto = crypto).randomUUID) === null || _crypto$randomUUID2 === void 0 ? void 0 : _crypto$randomUUID2.call(_crypto)) !== null && _crypto$randomUUID !== void 0 ? _crypto$randomUUID : "kitzo_toast_id_".concat(++uid);
273
- };
274
- var zIndex = 1;
275
- function createToast(type, action, content) {
276
- var _opts$id, _opts$duration, _opts$showIcon;
277
- var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
278
- var opts = _typeof(options) === 'object' && options !== null ? options : {};
279
- return _objectSpread2({
280
- id: (_opts$id = opts.id) !== null && _opts$id !== void 0 ? _opts$id : genId(),
281
- type: type,
282
- zIndex: ++zIndex,
283
- render: content,
284
- duration: (_opts$duration = opts.duration) !== null && _opts$duration !== void 0 ? _opts$duration : DEFAULTS.duration,
285
- showIcon: (_opts$showIcon = opts.showIcon) !== null && _opts$showIcon !== void 0 ? _opts$showIcon : DEFAULTS.showIcon,
286
- action: action
287
- }, opts);
288
- }
289
- function toast(content, options) {
290
- if (content == null) return;
291
- notify(createToast('normal', 'add', content, options));
292
- }
293
- toast.success = function (content, options) {
294
- if (content == null) return;
295
- notify(createToast('success', 'add', content, options));
296
- };
297
- toast.error = function (content, options) {
298
- if (content == null) return;
299
- notify(createToast('error', 'add', content, options));
300
- };
301
- toast.info = function (content, options) {
302
- if (content == null) return;
303
- notify(createToast('info', 'add', content, options));
304
- };
305
- toast.custom = function (content, options) {
306
- if (content == null) return;
307
- notify(createToast('custom', 'add', content, options));
308
- };
309
- toast.dismiss = function (id) {
310
- notify({
311
- action: 'dismiss',
312
- id: id
313
- });
314
- };
315
- toast.update = function (id, content) {
316
- var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
317
- if (!id) return;
318
- notify(createToast('custom', 'update', content, _objectSpread2(_objectSpread2({}, options), {}, {
319
- id: id
320
- })));
321
- };
322
- var loading = function loading(content) {
323
- var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
324
- notify(createToast('loading', 'add', content, _objectSpread2(_objectSpread2({}, options), {}, {
325
- duration: Infinity
326
- })));
327
- };
328
- toast.promise = function (promise, handlers) {
329
- var _options$id;
330
- var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
331
- if (!promise) return;
332
- if (!handlers) return;
333
- if (!handlers.loading) return;
334
- if (!handlers.success) return;
335
- if (!handlers.error) return;
336
- var id = (_options$id = options.id) !== null && _options$id !== void 0 ? _options$id : genId();
337
- loading(handlers.loading, _objectSpread2(_objectSpread2({}, options), {}, {
338
- id: id,
339
- duration: Infinity
340
- }));
341
- promise.then(/*#__PURE__*/function () {
342
- var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(result) {
343
- var _options$duration;
344
- var successContent, _t, _t2, _t3;
345
- return _regenerator().w(function (_context) {
346
- while (1) switch (_context.n) {
347
- case 0:
348
- if (!(typeof handlers.success === 'function')) {
349
- _context.n = 2;
350
- break;
351
- }
352
- _context.n = 1;
353
- return handlers.success(result);
354
- case 1:
355
- _t = _context.v;
356
- _context.n = 3;
357
- break;
358
- case 2:
359
- _t = handlers.success;
360
- case 3:
361
- successContent = _t;
362
- _t2 = toast;
363
- _t3 = id;
364
- _context.n = 4;
365
- return successContent;
366
- case 4:
367
- _t2.update.call(_t2, _t3, _context.v, {
368
- type: 'success',
369
- duration: (_options$duration = options.duration) !== null && _options$duration !== void 0 ? _options$duration : 2800
370
- });
371
- return _context.a(2, result);
372
- }
373
- }, _callee);
374
- }));
375
- return function (_x) {
376
- return _ref.apply(this, arguments);
377
- };
378
- }())["catch"](/*#__PURE__*/function () {
379
- var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(error) {
380
- var _options$duration2;
381
- var errorContent, _t4;
382
- return _regenerator().w(function (_context2) {
383
- while (1) switch (_context2.n) {
384
- case 0:
385
- if (!(typeof handlers.error === 'function')) {
386
- _context2.n = 2;
387
- break;
388
- }
389
- _context2.n = 1;
390
- return handlers.error(error);
391
- case 1:
392
- _t4 = _context2.v;
393
- _context2.n = 3;
394
- break;
395
- case 2:
396
- _t4 = handlers.error;
397
- case 3:
398
- errorContent = _t4;
399
- toast.update(id, errorContent, {
400
- type: 'error',
401
- duration: (_options$duration2 = options.duration) !== null && _options$duration2 !== void 0 ? _options$duration2 : 3800
402
- });
403
- throw error;
404
- case 4:
405
- return _context2.a(2);
406
- }
407
- }, _callee2);
408
- }));
409
- return function (_x2) {
410
- return _ref2.apply(this, arguments);
411
- };
412
- }());
413
- return promise;
414
- };
415
-
416
- var timeouts = new Map();
417
- var LEAVE_DELAY = 600;
418
- var MIN_VISIBLE = 700;
419
- function clearToastTimers(id) {
420
- var t = timeouts.get(id);
421
- if (!t) return;
422
- clearTimeout(t.leaving);
423
- clearTimeout(t.left);
424
- timeouts["delete"](id);
425
- }
426
- function getDurations(duration) {
427
- var d = Number(duration);
428
- if (!isFinite(d)) return null;
429
- var visible = Math.max(MIN_VISIBLE, d);
430
- return {
431
- leaving: visible,
432
- left: visible + LEAVE_DELAY
433
- };
434
- }
435
- function armToastTimers(toast, setToasts) {
436
- var durations = getDurations(toast.duration);
437
- if (!durations) return;
438
- clearToastTimers(toast.id);
439
- var leaving = setTimeout(function () {
440
- setToasts(function (prev) {
441
- return prev.map(function (t) {
442
- return t.id === toast.id ? _objectSpread2(_objectSpread2({}, t), {}, {
443
- status: 'leaving'
444
- }) : t;
445
- });
446
- });
447
- }, durations.leaving);
448
- var left = setTimeout(function () {
449
- setToasts(function (prev) {
450
- return prev.filter(function (t) {
451
- return t.id !== toast.id;
452
- });
453
- });
454
- timeouts["delete"](toast.id);
455
- }, durations.left);
456
- timeouts.set(toast.id, {
457
- leaving: leaving,
458
- left: left
459
- });
460
- }
461
- function manageToasts(toast, setToasts) {
462
- // dismiss
463
- if (toast.action === 'dismiss') {
464
- if (!toast.id) {
465
- setToasts(function (prev) {
466
- return prev.map(function (t) {
467
- return _objectSpread2(_objectSpread2({}, t), {}, {
468
- status: 'leaving'
469
- });
470
- });
471
- });
472
- setTimeout(function () {
473
- setToasts([]);
474
- }, LEAVE_DELAY);
475
- timeouts.forEach(function (_ref) {
476
- var leaving = _ref.leaving,
477
- left = _ref.left;
478
- clearTimeout(leaving);
479
- clearTimeout(left);
480
- });
481
- timeouts.clear();
482
- return;
483
- }
484
- clearToastTimers(toast.id);
485
- setToasts(function (prev) {
486
- return prev.map(function (t) {
487
- return t.id === toast.id ? _objectSpread2(_objectSpread2({}, t), {}, {
488
- status: 'leaving'
489
- }) : t;
490
- });
491
- });
492
- setTimeout(function () {
493
- setToasts(function (prev) {
494
- return prev.filter(function (t) {
495
- return t.id !== toast.id;
496
- });
497
- });
498
- }, LEAVE_DELAY);
499
- return;
500
- }
501
-
502
- // update
503
- if (toast.action === 'update') {
504
- setToasts(function (prev) {
505
- var prevToast = prev.find(function (t) {
506
- return t.id === toast.id;
507
- });
508
- if (!prevToast) return prev;
509
- if (prevToast.type !== 'custom' && prevToast.type !== 'loading') return prev;
510
- return prev.map(function (t) {
511
- return t.id === toast.id ? _objectSpread2(_objectSpread2(_objectSpread2({}, t), toast), {}, {
512
- status: 'visible'
513
- }) : t;
514
- });
515
- });
516
- armToastTimers(toast, setToasts);
517
- return;
518
- }
519
-
520
- // add
521
- var enteringToast = _objectSpread2(_objectSpread2({}, toast), {}, {
522
- status: 'entering'
523
- });
524
- setToasts(function (prev) {
525
- var prevToast = prev.find(function (t) {
526
- return t.id === enteringToast.id;
527
- });
528
- if (prevToast) return prev;
529
- return [enteringToast].concat(_toConsumableArray(prev));
530
- });
531
- requestAnimationFrame(function () {
532
- setToasts(function (prev) {
533
- return prev.map(function (t) {
534
- return t.id === toast.id ? _objectSpread2(_objectSpread2({}, t), {}, {
535
- status: 'visible'
536
- }) : t;
537
- });
538
- });
539
- });
540
- armToastTimers(enteringToast, setToasts);
541
- }
542
-
543
- function SuccessSvg() {
544
- return /*#__PURE__*/React.createElement("div", {
545
- className: "svg-container success"
546
- }, /*#__PURE__*/React.createElement("svg", {
547
- xmlns: "http://www.w3.org/2000/svg",
548
- width: "24",
549
- height: "24",
550
- viewBox: "0 0 24 24",
551
- fill: "none",
552
- stroke: "currentColor",
553
- strokeWidth: "2",
554
- strokeLinecap: "round",
555
- strokeLinejoin: "round"
556
- }, /*#__PURE__*/React.createElement("path", {
557
- d: "M20 6 9 17l-5-5"
558
- })));
559
- }
560
- function ErrorSvg() {
561
- return /*#__PURE__*/React.createElement("div", {
562
- className: "svg-container error"
563
- }, /*#__PURE__*/React.createElement("svg", {
564
- xmlns: "http://www.w3.org/2000/svg",
565
- width: "24",
566
- height: "24",
567
- viewBox: "0 0 24 24",
568
- fill: "none",
569
- stroke: "currentColor",
570
- strokeWidth: "2",
571
- strokeLinecap: "round",
572
- strokeLinejoin: "round"
573
- }, /*#__PURE__*/React.createElement("path", {
574
- d: "M18 6 6 18"
575
- }), /*#__PURE__*/React.createElement("path", {
576
- d: "m6 6 12 12"
577
- })));
578
- }
579
- function LoadingSvg() {
580
- return /*#__PURE__*/React.createElement("div", {
581
- className: "promise-svg-container"
582
- }, /*#__PURE__*/React.createElement("div", {
583
- className: "loader"
584
- }));
585
- }
586
- function InfoSvg() {
587
- return /*#__PURE__*/React.createElement("div", {
588
- className: "svg-container info"
589
- }, /*#__PURE__*/React.createElement("svg", {
590
- xmlns: "http://www.w3.org/2000/svg",
591
- viewBox: "0 0 24 24",
592
- width: "16",
593
- height: "16",
594
- fill: "currentColor"
595
- }, /*#__PURE__*/React.createElement("path", {
596
- d: "M12 6C12.8284 6 13.5 5.32843 13.5 4.5C13.5 3.67157 12.8284 3 12 3C11.1716 3 10.5 3.67157 10.5 4.5C10.5 5.32843 11.1716 6 12 6ZM9 10H11V18H9V20H15V18H13V8H9V10Z"
597
- })));
598
- }
599
-
600
- function Toast(_ref) {
601
- var t = _ref.t,
602
- gap = _ref.gap,
603
- setToasts = _ref.setToasts,
604
- animateTransformOrigin = _ref.animateTransformOrigin,
605
- containerPosition = _ref.containerPosition;
606
- var id = t.id,
607
- type = t.type,
608
- render = t.render,
609
- action = t.action,
610
- status = t.status;
611
- var ref = useRef(null);
612
- useLayoutEffect(function () {
613
- if (!ref.current) return;
614
- var g = typeof gap === 'number' ? gap : Number.isFinite(Number(gap)) ? Number(gap) : 8;
615
- var el = ref.current;
616
- var observer = new ResizeObserver(function () {
617
- var height = el.offsetHeight + g;
618
- setToasts(function (prev) {
619
- return prev.map(function (t) {
620
- return t.id === id ? _objectSpread2(_objectSpread2({}, t), {}, {
621
- height: height
622
- }) : t;
623
- });
624
- });
625
- });
626
- observer.observe(el);
627
- return function () {
628
- return observer.disconnect();
629
- };
630
- }, []);
631
- var allowedPositions = ['top-left', 'top-center', 'top-right', 'bottom-left', 'bottom-center', 'bottom-right'];
632
- var userPosition = t.position || containerPosition;
633
- var position = allowedPositions.includes(userPosition) ? userPosition : 'top-center';
634
- var shouldAnimateTransformOrigin = typeof t.animateTransformOrigin === 'boolean' ? t.animateTransformOrigin : animateTransformOrigin;
635
- return /*#__PURE__*/React.createElement("div", {
636
- ref: ref,
637
- style: getToastContainerStyles({
638
- t: t,
639
- position: position
640
- })
641
- }, /*#__PURE__*/React.createElement("div", {
642
- style: getToastStyles(),
643
- className: "kitzo-toast type-".concat(type, " action-").concat(action, " status-").concat(status, " pos-y-").concat(position.split('-')[0], " pos-x-").concat(position.split('-')[1], " ").concat(shouldAnimateTransformOrigin ? "transform-origin-".concat(position) : '')
644
- }, t.showIcon && type !== 'normal' && type !== 'custom' && /*#__PURE__*/React.createElement("div", {
645
- style: {
646
- flexShrink: 0
647
- }
648
- }, type === 'loading' && /*#__PURE__*/React.createElement(LoadingSvg, null), type === 'success' && /*#__PURE__*/React.createElement(SuccessSvg, null), type === 'error' && /*#__PURE__*/React.createElement(ErrorSvg, null), type === 'info' && /*#__PURE__*/React.createElement(InfoSvg, null)), /*#__PURE__*/React.createElement("div", {
649
- style: {
650
- flex: 1
651
- }
652
- }, typeof render === 'function' ? render(function () {
653
- return toast.dismiss(id);
654
- }) : render)));
655
- }
656
- function getToastStyles() {
657
- var styles = {
658
- pointerEvents: 'all',
659
- display: 'flex',
660
- alignItems: 'center',
661
- gap: 8
662
- };
663
- return styles;
664
- }
665
- function getToastContainerStyles(_ref2) {
666
- var t = _ref2.t,
667
- position = _ref2.position;
668
- var styles = {
669
- position: 'absolute',
670
- zIndex: t.zIndex,
671
- left: 0,
672
- width: '100%',
673
- transition: 'transform 180ms',
674
- display: 'flex'
675
- };
676
- var transform = position.includes('top') ? "translateY(".concat(t.distance || 0, "px)") : "translateY(-".concat(t.distance || 0, "px)");
677
- var justifyContent = position.includes('left') ? 'flex-start' : position.includes('center') ? 'center' : 'flex-end';
678
- styles.transform = transform;
679
- styles.justifyContent = justifyContent;
680
- if (position.includes('top')) styles.top = 0;
681
- if (position.includes('bottom')) styles.bottom = 0;
682
- return styles;
683
- }
684
-
685
- function Toaster(_ref) {
686
- var _ref$position = _ref.position,
687
- position = _ref$position === void 0 ? 'top-center' : _ref$position,
688
- _ref$richColors = _ref.richColors,
689
- richColors = _ref$richColors === void 0 ? false : _ref$richColors,
690
- _ref$gap = _ref.gap,
691
- gap = _ref$gap === void 0 ? 8 : _ref$gap,
692
- _ref$edgeOffset = _ref.edgeOffset,
693
- edgeOffset = _ref$edgeOffset === void 0 ? 16 : _ref$edgeOffset,
694
- _ref$isDark = _ref.isDark,
695
- isDark = _ref$isDark === void 0 ? window.matchMedia('(prefers-color-scheme: dark)').matches : _ref$isDark,
696
- _ref$animateTransform = _ref.animateTransformOrigin,
697
- animateTransformOrigin = _ref$animateTransform === void 0 ? true : _ref$animateTransform;
698
- var _useState = useState([]),
699
- _useState2 = _slicedToArray(_useState, 2),
700
- toasts = _useState2[0],
701
- setToasts = _useState2[1];
702
- useEffect(function () {
703
- var unsub = subscribe(function (toast) {
704
- return manageToasts(toast, setToasts);
705
- });
706
- return unsub;
707
- }, []);
708
- useLayoutEffect(function () {
709
- var grouped = toasts.reduce(function (prev, t) {
710
- var pos = t.position || position || 'top-center';
711
- (prev[pos] || (prev[pos] = [])).push(t);
712
- return prev;
713
- }, {});
714
- var hasChanged = false;
715
- var updated = toasts.map(function (toast) {
716
- var pos = toast.position || position || 'top-center';
717
- var group = grouped[pos];
718
- var index = group.findIndex(function (t) {
719
- return t.id === toast.id;
720
- });
721
- var distance = group.slice(0, index).reduce(function (acc, t) {
722
- return acc + (t.height || 0);
723
- }, 0);
724
- if (distance !== toast.distance) {
725
- hasChanged = true;
726
- }
727
- return _objectSpread2(_objectSpread2({}, toast), {}, {
728
- distance: distance
729
- });
730
- });
731
- if (hasChanged) {
732
- setToasts(updated);
733
- }
734
- }, [toasts, position]);
735
- return /*#__PURE__*/React.createElement("div", {
736
- style: {
737
- position: 'fixed',
738
- inset: 0,
739
- zIndex: 2147483647,
740
- pointerEvents: 'none',
741
- display: 'grid',
742
- padding: edgeOffset != null ? edgeOffset : 16
743
- },
744
- className: "kitzo-toast-container ".concat(richColors ? 'kitzo-toast-rich-colors' : '', " ").concat(isDark ? 'kitzo-toast-dark' : '')
745
- }, /*#__PURE__*/React.createElement("div", {
746
- style: {
747
- position: 'relative'
748
- }
749
- }, toasts.map(function (t) {
750
- return /*#__PURE__*/React.createElement(Toast, {
751
- key: t.id,
752
- t: t,
753
- gap: gap,
754
- setToasts: setToasts,
755
- animateTransformOrigin: animateTransformOrigin,
756
- containerPosition: position
757
- });
758
- })));
759
- }
760
-
761
- // import './style.css';
762
- var tooltipStyles = "/* Default styling */\n.kitzo-tooltip-root {\n --bg-clr: hsl(0, 0%, 15%);\n --text-clr: hsl(0, 0%, 95%);\n\n --transition-startDuration: calc(var(--startDuration) * 1ms);\n --transition-endDuration: calc(var(--endDuration) * 1ms);\n --transition-startDelay: calc(var(--startDelay) * 1ms);\n --transition-endDelay: calc(var(--endDelay) * 1ms);\n}\n\n.kitzo-tooltip-root.tooltip-theme-dark {\n --bg-clr: hsl(0, 0%, 95%);\n --text-clr: hsl(0, 0%, 15%);\n}\n\n.kitzo-tooltip-content-default-style {\n font-family:\n inherit,\n system-ui,\n -apple-system,\n BlinkMacSystemFont,\n 'Segoe UI',\n Roboto,\n Oxygen,\n Ubuntu,\n Cantarell,\n 'Open Sans',\n 'Helvetica Neue',\n sans-serif;\n font-size: 0.875rem;\n background-color: var(--bg-clr);\n color: var(--text-clr);\n padding-block: 0.25rem;\n padding-inline: 0.5rem;\n border-radius: 0.325rem;\n}\n\n/* Tooltip positioning */\n.kitzo-tooltip-wrapper {\n --tooltip-offset: calc(var(--offset) * 1px + 1px);\n opacity: 0;\n transition-property: opacity;\n transition-delay: calc(\n var(--transition-endDuration) + var(--transition-endDelay)\n );\n}\n\n.kitzo-tooltip-root:hover .kitzo-tooltip-wrapper {\n opacity: 1;\n transition-delay: 0ms;\n}\n\n/* Top */\n.kitzo-tooltip-wrapper.top {\n bottom: 100%;\n padding-block-end: var(--tooltip-offset);\n}\n.kitzo-tooltip-wrapper.top {\n left: 50%;\n translate: -50% 0;\n}\n.kitzo-tooltip-wrapper.top.start {\n left: 0;\n translate: 0 0;\n}\n.kitzo-tooltip-wrapper.top.end {\n right: 0;\n translate: 0 0;\n}\n\n/* Right */\n.kitzo-tooltip-wrapper.right {\n left: 100%;\n padding-inline-start: var(--tooltip-offset);\n}\n.kitzo-tooltip-wrapper.right {\n top: 50%;\n translate: 0 -50%;\n}\n.kitzo-tooltip-wrapper.right.start {\n top: 0;\n translate: 0 0;\n}\n.kitzo-tooltip-wrapper.right.end {\n top: 100%;\n translate: 0 -100%;\n}\n\n/* Bottom */\n.kitzo-tooltip-wrapper.bottom {\n top: 100%;\n padding-block-start: var(--tooltip-offset);\n}\n.kitzo-tooltip-wrapper.bottom {\n left: 50%;\n translate: -50% 0;\n}\n.kitzo-tooltip-wrapper.bottom.start {\n left: 0;\n translate: 0 0;\n}\n.kitzo-tooltip-wrapper.bottom.end {\n left: 100%;\n translate: -100% 0;\n}\n\n/* Left */\n.kitzo-tooltip-wrapper.left {\n right: 100%;\n padding-inline-end: var(--tooltip-offset);\n}\n.kitzo-tooltip-wrapper.left {\n top: 50%;\n translate: 0 -50%;\n}\n.kitzo-tooltip-wrapper.left.start {\n top: 0;\n translate: 0 0;\n}\n.kitzo-tooltip-wrapper.left.end {\n top: 100%;\n translate: 0 -100%;\n}\n\n/* Tooltip transitions */\n.kitzo-tooltip-root.animate-tooltip {\n .kitzo-tooltip-content {\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n backface-visibility: hidden;\n contain: layout paint;\n\n transition:\n transform var(--transition-endDuration) var(--transition-endDelay),\n opacity var(--transition-endDuration) var(--transition-endDelay);\n }\n}\n\n.kitzo-tooltip-content {\n transform: scale(0.8);\n opacity: 0;\n}\n\n.kitzo-tooltip-content.top {\n transform-origin: bottom;\n}\n.kitzo-tooltip-content.right {\n transform-origin: left;\n}\n.kitzo-tooltip-content.bottom {\n transform-origin: top;\n}\n.kitzo-tooltip-content.left {\n transform-origin: right;\n}\n\n.kitzo-tooltip-root.animate-tooltip:hover {\n .kitzo-tooltip-content {\n transition:\n transform var(--transition-startDuration) var(--transition-startDelay),\n opacity var(--transition-startDuration) var(--transition-startDelay);\n }\n}\n.kitzo-tooltip-root:hover {\n .kitzo-tooltip-content {\n transform: scale(1);\n opacity: 1;\n }\n}\n\n/* smart hover persistence feature */\n.kitzo-tooltip-root {\n .kitzo-tooltip-wrapper {\n pointer-events: none;\n }\n}\n.kitzo-tooltip-root.smart-hover:hover {\n .kitzo-tooltip-wrapper {\n pointer-events: all;\n }\n}\n\n/* Arrow */\n.kitzo-tooltip-content.tooltip-arrow {\n --effective-size: calc(var(--arrow-size, 6) * 1px);\n --effective-color: var(--arrow-color, var(--bg-clr));\n\n position: relative;\n}\n.kitzo-tooltip-content.tooltip-arrow::before {\n content: '';\n position: absolute;\n z-index: -1;\n border: var(--effective-size) solid transparent;\n}\n.kitzo-tooltip-content.tooltip-arrow.top::before {\n left: 50%;\n translate: -50% 0;\n top: calc(100% - 1px);\n border-top: var(--effective-size) solid var(--effective-color);\n}\n.kitzo-tooltip-content.tooltip-arrow.right::before {\n top: 50%;\n translate: 0 -50%;\n right: calc(100% - 1px);\n border-right: var(--effective-size) solid var(--effective-color);\n}\n.kitzo-tooltip-content.tooltip-arrow.bottom::before {\n left: 50%;\n translate: -50% 0;\n bottom: calc(100% - 1px);\n border-bottom: var(--effective-size) solid var(--effective-color);\n}\n.kitzo-tooltip-content.tooltip-arrow.left::before {\n top: 50%;\n translate: 0 -50%;\n left: calc(100% - 1px);\n border-left: var(--effective-size) solid var(--effective-color);\n}";
763
- function addTooltipStyles() {
764
- if (!document.getElementById('kitzo-tooltip-styles')) {
765
- var styleTag = document.createElement('style');
766
- styleTag.id = 'kitzo-tooltip-styles';
767
- styleTag.textContent = tooltipStyles;
768
- document.head.appendChild(styleTag);
769
- }
770
- }
771
- var allowedPositions = ['top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-start', 'bottom', 'bottom-end', 'left-start', 'left', 'left-end'];
772
- function getPositionClass() {
773
- var position = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
774
- position = typeof position === 'string' ? position.trim().toLowerCase() : 'top';
775
- var allowedPos = allowedPositions.find(function (p) {
776
- return p === position;
777
- });
778
- if (!allowedPos) return 'top';
779
- if (allowedPos.includes('-')) {
780
- var _allowedPos$split = allowedPos.split('-'),
781
- _allowedPos$split2 = _slicedToArray(_allowedPos$split, 2),
782
- dir = _allowedPos$split2[0],
783
- state = _allowedPos$split2[1];
784
- return "".concat(dir, " ").concat(state);
785
- } else {
786
- return allowedPos;
787
- }
788
- }
789
- function getAnimationProperties(animation) {
790
- var _animation$delay, _animation$duration;
791
- var effectiveStartDelay = animation === null || animation === void 0 ? void 0 : animation.startDelay;
792
- var effectiveEndDelay = animation === null || animation === void 0 ? void 0 : animation.endDelay;
793
- var effectiveDelay = (_animation$delay = animation === null || animation === void 0 ? void 0 : animation.delay) !== null && _animation$delay !== void 0 ? _animation$delay : 0;
794
- var effectiveStartDuration = animation === null || animation === void 0 ? void 0 : animation.startDuration;
795
- var effectiveEndDuration = animation === null || animation === void 0 ? void 0 : animation.endDuration;
796
- var effectiveDuration = (_animation$duration = animation === null || animation === void 0 ? void 0 : animation.duration) !== null && _animation$duration !== void 0 ? _animation$duration : 110;
797
- return {
798
- startDelay: effectiveStartDelay !== null && effectiveStartDelay !== void 0 ? effectiveStartDelay : effectiveDelay,
799
- endDelay: effectiveEndDelay !== null && effectiveEndDelay !== void 0 ? effectiveEndDelay : effectiveDelay,
800
- startDuration: effectiveStartDuration !== null && effectiveStartDuration !== void 0 ? effectiveStartDuration : effectiveDuration,
801
- endDuration: effectiveEndDuration !== null && effectiveEndDuration !== void 0 ? effectiveEndDuration : effectiveDuration
802
- };
803
- }
804
- var isWindowThemeDark = function isWindowThemeDark() {
805
- return window.matchMedia('(prefers-color-scheme: dark)').matches;
806
- };
807
- function Tooltip(_ref) {
808
- var content = _ref.content,
809
- _ref$position = _ref.position,
810
- position = _ref$position === void 0 ? 'top' : _ref$position,
811
- _ref$tooltipOptions = _ref.tooltipOptions,
812
- tooltipOptions = _ref$tooltipOptions === void 0 ? {} : _ref$tooltipOptions,
813
- _ref$tooltipStyle = _ref.tooltipStyle,
814
- tooltipStyle = _ref$tooltipStyle === void 0 ? {} : _ref$tooltipStyle,
815
- _ref$tooltipClassName = _ref.tooltipClassName,
816
- tooltipClassName = _ref$tooltipClassName === void 0 ? '' : _ref$tooltipClassName,
817
- _ref$animation = _ref.animation,
818
- animation = _ref$animation === void 0 ? true : _ref$animation,
819
- _ref$isHidden = _ref.isHidden,
820
- isHidden = _ref$isHidden === void 0 ? false : _ref$isHidden,
821
- isDark = _ref.isDark,
822
- children = _ref.children;
823
- if (typeof isHidden === 'boolean' && isHidden) return children;
824
- if (content == null) {
825
- console.warn("kitzo: tooltip 'content' property is required");
826
- return children;
827
- }
828
- // Add styles once
829
- addTooltipStyles();
830
-
831
- // Define options
832
- var _ref2 = tooltipOptions !== null && tooltipOptions !== void 0 ? tooltipOptions : {},
833
- _ref2$offset = _ref2.offset,
834
- offset = _ref2$offset === void 0 ? 8 : _ref2$offset,
835
- _ref2$hideOnTouch = _ref2.hideOnTouch,
836
- hideOnTouch = _ref2$hideOnTouch === void 0 ? true : _ref2$hideOnTouch,
837
- _ref2$arrow = _ref2.arrow,
838
- arrow = _ref2$arrow === void 0 ? false : _ref2$arrow,
839
- _ref2$smartHover = _ref2.smartHover,
840
- smartHover = _ref2$smartHover === void 0 ? true : _ref2$smartHover;
841
- var finalOptions = {
842
- offset: !isNaN(Number(offset)) ? Number(offset) : 8,
843
- arrow: typeof arrow === 'boolean' ? arrow : false,
844
- smartHover: typeof smartHover === 'boolean' ? smartHover : true,
845
- hideOnTouch: typeof hideOnTouch === 'boolean' ? hideOnTouch : true
846
- };
847
-
848
- // Hide on touch device
849
- var isTouch = window.matchMedia('(pointer: coarse)').matches;
850
- if (isTouch && finalOptions.hideOnTouch) return children;
851
- var positionClass = getPositionClass(position);
852
-
853
- // Define animations
854
- var animationEnabled = animation ? true : false;
855
- var animationObj = animation === true ? {} : animation;
856
- var finalAnimationProperties = getAnimationProperties(animationObj);
857
-
858
- // theme
859
- isDark = typeof isDark === 'boolean' ? isDark : isWindowThemeDark();
860
- return /*#__PURE__*/React.createElement("div", {
861
- style: {
862
- position: 'relative',
863
- width: 'fit-content',
864
- '--offset': Math.max(0, finalOptions.offset),
865
- '--startDuration': Math.max(0, finalAnimationProperties.startDuration),
866
- '--endDuration': Math.max(0, finalAnimationProperties.endDuration),
867
- '--startDelay': Math.max(0, finalAnimationProperties.startDelay),
868
- '--endDelay': Math.max(0, finalAnimationProperties.endDelay),
869
- '--arrow-color': tooltipStyle === null || tooltipStyle === void 0 ? void 0 : tooltipStyle['--arrow-color'],
870
- '--arrow-size': tooltipStyle === null || tooltipStyle === void 0 ? void 0 : tooltipStyle['--arrow-size']
871
- },
872
- className: "kitzo-tooltip-root ".concat(isDark ? 'tooltip-theme-dark' : '', " ").concat(finalOptions.smartHover ? 'smart-hover' : '', " ").concat(animationEnabled ? 'animate-tooltip' : '')
873
- }, children, /*#__PURE__*/React.createElement("div", {
874
- style: {
875
- position: 'absolute',
876
- whiteSpace: typeof content === 'string' ? 'nowrap' : 'normal'
877
- },
878
- tabIndex: -1,
879
- className: "kitzo-tooltip-wrapper ".concat(positionClass)
880
- }, /*#__PURE__*/React.createElement("div", {
881
- className: "kitzo-tooltip-content ".concat(positionClass, " ").concat(finalOptions.arrow ? 'tooltip-arrow' : '')
882
- }, typeof content === 'string' || typeof content === 'number' ? /*#__PURE__*/React.createElement("div", {
883
- className: "kitzo-tooltip-content-default-style"
884
- }, content) : /*#__PURE__*/React.createElement("div", {
885
- className: tooltipClassName,
886
- style: tooltipStyle
887
- }, content))));
888
- }
889
-
890
- function useDebounce(value, delay) {
891
- var _useState = useState(value),
892
- _useState2 = _slicedToArray(_useState, 2),
893
- debouncedValue = _useState2[0],
894
- setDebouncedValue = _useState2[1];
895
- useEffect(function () {
896
- var handler = setTimeout(function () {
897
- setDebouncedValue(value);
898
- }, delay);
899
- return function () {
900
- clearTimeout(handler);
901
- };
902
- }, [value, delay]);
903
- return debouncedValue;
904
- }
905
-
906
- function useWindowSize() {
907
- var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
908
- _ref$delay = _ref.delay,
909
- delay = _ref$delay === void 0 ? 30 : _ref$delay;
910
- if (typeof delay !== 'number') throw new Error("Only number is accepted 'useWindowSize' hook configuration: delay");
911
- var _useState = useState({
912
- screenWidth: window.innerWidth,
913
- screenHeight: window.innerHeight
914
- }),
915
- _useState2 = _slicedToArray(_useState, 2),
916
- screenSize = _useState2[0],
917
- setScreenSize = _useState2[1];
918
- var timeoutRef = useRef(null);
919
- useEffect(function () {
920
- function updateScreenSize() {
921
- if (timeoutRef.current) {
922
- clearTimeout(timeoutRef.current);
923
- }
924
- timeoutRef.current = setTimeout(function () {
925
- setScreenSize({
926
- screenWidth: window.innerWidth,
927
- screenHeight: window.innerHeight
928
- });
929
- }, Math.max(0, Number(delay)));
930
- }
931
- if (typeof window !== 'undefined') {
932
- window.addEventListener('resize', updateScreenSize);
933
- }
934
- return function () {
935
- if (timeoutRef.current) clearTimeout(timeoutRef.current);
936
- window.removeEventListener('resize', updateScreenSize);
937
- };
938
- }, [delay]);
939
- return screenSize;
940
- }
941
-
942
- //! Copy function
943
- function legacyCopy(text) {
944
- var textarea = document.createElement('textarea');
945
- textarea.value = text;
946
- document.body.appendChild(textarea);
947
- textarea.select();
948
- document.execCommand('copy');
949
- document.body.removeChild(textarea);
950
- }
951
- function writeToClipboard(_x) {
952
- return _writeToClipboard.apply(this, arguments);
953
- }
954
- function _writeToClipboard() {
955
- _writeToClipboard = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(text) {
956
- var _navigator$clipboard;
957
- var _t;
958
- return _regenerator().w(function (_context) {
959
- while (1) switch (_context.p = _context.n) {
960
- case 0:
961
- if ((_navigator$clipboard = navigator.clipboard) !== null && _navigator$clipboard !== void 0 && _navigator$clipboard.writeText) {
962
- _context.n = 1;
963
- break;
964
- }
965
- legacyCopy(text);
966
- return _context.a(2);
967
- case 1:
968
- _context.p = 1;
969
- _context.n = 2;
970
- return navigator.clipboard.writeText(text);
971
- case 2:
972
- _context.n = 4;
973
- break;
974
- case 3:
975
- _context.p = 3;
976
- _t = _context.v;
977
- legacyCopy(text);
978
- console.error(_t);
979
- case 4:
980
- return _context.a(2);
981
- }
982
- }, _callee, null, [[1, 3]]);
983
- }));
984
- return _writeToClipboard.apply(this, arguments);
985
- }
986
- function copy(_x2) {
987
- return _copy.apply(this, arguments);
988
- }
989
- function _copy() {
990
- _copy = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(doc) {
991
- var text;
992
- return _regenerator().w(function (_context2) {
993
- while (1) switch (_context2.n) {
994
- case 0:
995
- if (!(doc == null)) {
996
- _context2.n = 1;
997
- break;
998
- }
999
- throw new Error('[kitzo/copy] expected a value to copy, got null or undefined.');
1000
- case 1:
1001
- text = typeof doc === 'string' || typeof doc === 'number' ? String(doc) : JSON.stringify(doc);
1002
- _context2.n = 2;
1003
- return writeToClipboard(text);
1004
- case 2:
1005
- return _context2.a(2);
1006
- }
1007
- }, _callee2);
1008
- }));
1009
- return _copy.apply(this, arguments);
1010
- }
1011
-
1012
- function useCopy() {
1013
- var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
1014
- _ref$resetDelay = _ref.resetDelay,
1015
- resetDelay = _ref$resetDelay === void 0 ? 1500 : _ref$resetDelay;
1016
- var _useState = useState('standby'),
1017
- _useState2 = _slicedToArray(_useState, 2),
1018
- status = _useState2[0],
1019
- setStatus = _useState2[1];
1020
- var _useState3 = useState(null),
1021
- _useState4 = _slicedToArray(_useState3, 2),
1022
- error = _useState4[0],
1023
- setError = _useState4[1];
1024
- var timeoutRef = useRef(null);
1025
- var isBusyRef = useRef(false);
1026
- var copy$1 = useCallback(/*#__PURE__*/function () {
1027
- var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(doc) {
1028
- var _t;
1029
- return _regenerator().w(function (_context) {
1030
- while (1) switch (_context.p = _context.n) {
1031
- case 0:
1032
- if (!isBusyRef.current) {
1033
- _context.n = 1;
1034
- break;
1035
- }
1036
- return _context.a(2);
1037
- case 1:
1038
- if (timeoutRef.current) clearTimeout(timeoutRef.current);
1039
- _context.p = 2;
1040
- isBusyRef.current = true;
1041
- setError(null);
1042
- setStatus('copying');
1043
- _context.n = 3;
1044
- return copy(doc);
1045
- case 3:
1046
- setStatus('copied');
1047
- _context.n = 5;
1048
- break;
1049
- case 4:
1050
- _context.p = 4;
1051
- _t = _context.v;
1052
- setError(_t);
1053
- setStatus('error');
1054
- case 5:
1055
- _context.p = 5;
1056
- timeoutRef.current = setTimeout(function () {
1057
- isBusyRef.current = false;
1058
- setStatus('standby');
1059
- }, Math.max(resetDelay, 500));
1060
- return _context.f(5);
1061
- case 6:
1062
- return _context.a(2);
1063
- }
1064
- }, _callee, null, [[2, 4, 5, 6]]);
1065
- }));
1066
- return function (_x) {
1067
- return _ref2.apply(this, arguments);
1068
- };
1069
- }(), [resetDelay]);
1070
- useEffect(function () {
1071
- return function () {
1072
- if (timeoutRef.current) clearTimeout(timeoutRef.current);
1073
- };
1074
- }, []);
1075
- return {
1076
- copy: copy$1,
1077
- status: status,
1078
- error: error,
1079
- isCopying: status === 'copying',
1080
- isCopied: status === 'copied',
1081
- isError: status === 'error'
1082
- };
1083
- }
1084
-
1085
- export { Toaster, Tooltip, toast, useCopy, useDebounce, useWindowSize };
1086
- //# sourceMappingURL=index.js.map