@pittorica/toast-react 0.22.0 → 0.22.4

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 (2) hide show
  1. package/dist/index.js +104 -111
  2. package/package.json +8 -8
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
- import { jsx as y, jsxs as E } from "react/jsx-runtime";
2
- import { forwardRef as P, createElement as L, useState as X, useRef as V, useCallback as D, useEffect as G } from "react";
1
+ import { jsx as y, jsxs as F } from "react/jsx-runtime";
2
+ import { forwardRef as X, createElement as C, useState as O, useRef as V, useCallback as D, useEffect as G } from "react";
3
3
  import { createPortal as H } from "react-dom";
4
4
  /**
5
5
  * @license @tabler/icons-react v3.36.1 - MIT
@@ -35,21 +35,21 @@ var J = {
35
35
  * See the LICENSE file in the root directory of this source tree.
36
36
  */
37
37
  const K = (e, i, r, t) => {
38
- const o = P(
39
- ({ color: s = "currentColor", size: n = 24, stroke: c = 2, title: l, className: p, children: d, ...f }, m) => L(
38
+ const o = X(
39
+ ({ color: n = "currentColor", size: c = 24, stroke: l = 2, title: s, className: p, children: d, ...f }, m) => C(
40
40
  "svg",
41
41
  {
42
42
  ref: m,
43
43
  ...J[e],
44
- width: n,
45
- height: n,
44
+ width: c,
45
+ height: c,
46
46
  className: ["tabler-icon", `tabler-icon-${i}`, p].join(" "),
47
- fill: s,
47
+ fill: n,
48
48
  ...f
49
49
  },
50
50
  [
51
- l && L("title", { key: "svg-title" }, l),
52
- ...t.map(([g, u]) => L(g, u)),
51
+ s && C("title", { key: "svg-title" }, s),
52
+ ...t.map(([g, h]) => C(g, h)),
53
53
  ...Array.isArray(d) ? d : [d]
54
54
  ]
55
55
  )
@@ -63,36 +63,36 @@ const K = (e, i, r, t) => {
63
63
  * See the LICENSE file in the root directory of this source tree.
64
64
  */
65
65
  const Q = [["path", { d: "M12 2l.324 .001l.318 .004l.616 .017l.299 .013l.579 .034l.553 .046c4.785 .464 6.732 2.411 7.196 7.196l.046 .553l.034 .579c.005 .098 .01 .198 .013 .299l.017 .616l.005 .642l-.005 .642l-.017 .616l-.013 .299l-.034 .579l-.046 .553c-.464 4.785 -2.411 6.732 -7.196 7.196l-.553 .046l-.579 .034c-.098 .005 -.198 .01 -.299 .013l-.616 .017l-.642 .005l-.642 -.005l-.616 -.017l-.299 -.013l-.579 -.034l-.553 -.046c-4.785 -.464 -6.732 -2.411 -7.196 -7.196l-.046 -.553l-.034 -.579a28.058 28.058 0 0 1 -.013 -.299l-.017 -.616c-.003 -.21 -.005 -.424 -.005 -.642l.001 -.324l.004 -.318l.017 -.616l.013 -.299l.034 -.579l.046 -.553c.464 -4.785 2.411 -6.732 7.196 -7.196l.553 -.046l.579 -.034c.098 -.005 .198 -.01 .299 -.013l.616 -.017c.21 -.003 .424 -.005 .642 -.005zm-1.489 7.14a1 1 0 0 0 -1.218 1.567l1.292 1.293l-1.292 1.293l-.083 .094a1 1 0 0 0 1.497 1.32l1.293 -1.292l1.293 1.292l.094 .083a1 1 0 0 0 1.32 -1.497l-1.292 -1.293l1.292 -1.293l.083 -.094a1 1 0 0 0 -1.497 -1.32l-1.293 1.292l-1.293 -1.292l-.094 -.083z", fill: "currentColor", key: "svg-0", strokeWidth: "0" }]], U = K("filled", "square-rounded-x-filled", "SquareRoundedXFilled", Q);
66
- function z(e) {
66
+ function S(e) {
67
67
  var i, r, t = "";
68
68
  if (typeof e == "string" || typeof e == "number") t += e;
69
69
  else if (typeof e == "object") if (Array.isArray(e)) {
70
70
  var o = e.length;
71
- for (i = 0; i < o; i++) e[i] && (r = z(e[i])) && (t && (t += " "), t += r);
71
+ for (i = 0; i < o; i++) e[i] && (r = S(e[i])) && (t && (t += " "), t += r);
72
72
  } else for (r in e) e[r] && (t && (t += " "), t += r);
73
73
  return t;
74
74
  }
75
75
  function Y() {
76
- for (var e, i, r = 0, t = "", o = arguments.length; r < o; r++) (e = arguments[r]) && (i = z(e)) && (t && (t += " "), t += i);
76
+ for (var e, i, r = 0, t = "", o = arguments.length; r < o; r++) (e = arguments[r]) && (i = S(e)) && (t && (t += " "), t += i);
77
77
  return t;
78
78
  }
79
- const C = ({
79
+ const L = ({
80
80
  ref: e,
81
81
  as: i = "div",
82
82
  children: r,
83
83
  display: t,
84
84
  m: o,
85
- mt: s,
86
- mr: n,
87
- mb: c,
88
- ml: l,
85
+ mt: n,
86
+ mr: c,
87
+ mb: l,
88
+ ml: s,
89
89
  p,
90
90
  pt: d,
91
91
  pr: f,
92
92
  pb: m,
93
93
  pl: g,
94
- width: u,
95
- height: h,
94
+ width: h,
95
+ height: u,
96
96
  position: v,
97
97
  style: b,
98
98
  className: $,
@@ -105,7 +105,7 @@ const C = ({
105
105
  ...R
106
106
  }) => {
107
107
  const a = {};
108
- t && (a.display = t), u && (a.width = u), h && (a.height = h), v && (a.position = v), o && (a.margin = `var(--pittorica-space-${o})`), s && (a.marginTop = `var(--pittorica-space-${s})`), n && (a.marginRight = `var(--pittorica-space-${n})`), c && (a.marginBottom = `var(--pittorica-space-${c})`), l && (a.marginLeft = `var(--pittorica-space-${l})`), p && (a.padding = `var(--pittorica-space-${p})`), d && (a.paddingTop = `var(--pittorica-space-${d})`), f && (a.paddingRight = `var(--pittorica-space-${f})`), m && (a.paddingBottom = `var(--pittorica-space-${m})`), g && (a.paddingLeft = `var(--pittorica-space-${g})`);
108
+ t && (a.display = t), h && (a.width = h), u && (a.height = u), v && (a.position = v), o && (a.margin = `var(--pittorica-space-${o})`), n && (a.marginTop = `var(--pittorica-space-${n})`), c && (a.marginRight = `var(--pittorica-space-${c})`), l && (a.marginBottom = `var(--pittorica-space-${l})`), s && (a.marginLeft = `var(--pittorica-space-${s})`), p && (a.padding = `var(--pittorica-space-${p})`), d && (a.paddingTop = `var(--pittorica-space-${d})`), f && (a.paddingRight = `var(--pittorica-space-${f})`), m && (a.paddingBottom = `var(--pittorica-space-${m})`), g && (a.paddingLeft = `var(--pittorica-space-${g})`);
109
109
  const B = {
110
110
  ...b,
111
111
  ...a
@@ -127,50 +127,50 @@ const C = ({
127
127
  }
128
128
  );
129
129
  };
130
- C.displayName = "Box";
131
- function S(e) {
130
+ L.displayName = "Box";
131
+ function W(e) {
132
132
  var i, r, t = "";
133
133
  if (typeof e == "string" || typeof e == "number") t += e;
134
134
  else if (typeof e == "object") if (Array.isArray(e)) {
135
135
  var o = e.length;
136
- for (i = 0; i < o; i++) e[i] && (r = S(e[i])) && (t && (t += " "), t += r);
136
+ for (i = 0; i < o; i++) e[i] && (r = W(e[i])) && (t && (t += " "), t += r);
137
137
  } else for (r in e) e[r] && (t && (t += " "), t += r);
138
138
  return t;
139
139
  }
140
140
  function Z() {
141
- for (var e, i, r = 0, t = "", o = arguments.length; r < o; r++) (e = arguments[r]) && (i = S(e)) && (t && (t += " "), t += i);
141
+ for (var e, i, r = 0, t = "", o = arguments.length; r < o; r++) (e = arguments[r]) && (i = W(e)) && (t && (t += " "), t += i);
142
142
  return t;
143
143
  }
144
- function W(e) {
144
+ function q(e) {
145
145
  var i, r, t = "";
146
146
  if (typeof e == "string" || typeof e == "number") t += e;
147
147
  else if (typeof e == "object") if (Array.isArray(e)) {
148
148
  var o = e.length;
149
- for (i = 0; i < o; i++) e[i] && (r = W(e[i])) && (t && (t += " "), t += r);
149
+ for (i = 0; i < o; i++) e[i] && (r = q(e[i])) && (t && (t += " "), t += r);
150
150
  } else for (r in e) e[r] && (t && (t += " "), t += r);
151
151
  return t;
152
152
  }
153
153
  function tt() {
154
- for (var e, i, r = 0, t = "", o = arguments.length; r < o; r++) (e = arguments[r]) && (i = W(e)) && (t && (t += " "), t += i);
154
+ for (var e, i, r = 0, t = "", o = arguments.length; r < o; r++) (e = arguments[r]) && (i = q(e)) && (t && (t += " "), t += i);
155
155
  return t;
156
156
  }
157
- const q = ({
157
+ const z = ({
158
158
  ref: e,
159
159
  as: i = "div",
160
160
  children: r,
161
161
  display: t,
162
162
  m: o,
163
- mt: s,
164
- mr: n,
165
- mb: c,
166
- ml: l,
163
+ mt: n,
164
+ mr: c,
165
+ mb: l,
166
+ ml: s,
167
167
  p,
168
168
  pt: d,
169
169
  pr: f,
170
170
  pb: m,
171
171
  pl: g,
172
- width: u,
173
- height: h,
172
+ width: h,
173
+ height: u,
174
174
  position: v,
175
175
  style: b,
176
176
  className: $,
@@ -183,7 +183,7 @@ const q = ({
183
183
  ...R
184
184
  }) => {
185
185
  const a = {};
186
- t && (a.display = t), u && (a.width = u), h && (a.height = h), v && (a.position = v), o && (a.margin = `var(--pittorica-space-${o})`), s && (a.marginTop = `var(--pittorica-space-${s})`), n && (a.marginRight = `var(--pittorica-space-${n})`), c && (a.marginBottom = `var(--pittorica-space-${c})`), l && (a.marginLeft = `var(--pittorica-space-${l})`), p && (a.padding = `var(--pittorica-space-${p})`), d && (a.paddingTop = `var(--pittorica-space-${d})`), f && (a.paddingRight = `var(--pittorica-space-${f})`), m && (a.paddingBottom = `var(--pittorica-space-${m})`), g && (a.paddingLeft = `var(--pittorica-space-${g})`);
186
+ t && (a.display = t), h && (a.width = h), u && (a.height = u), v && (a.position = v), o && (a.margin = `var(--pittorica-space-${o})`), n && (a.marginTop = `var(--pittorica-space-${n})`), c && (a.marginRight = `var(--pittorica-space-${c})`), l && (a.marginBottom = `var(--pittorica-space-${l})`), s && (a.marginLeft = `var(--pittorica-space-${s})`), p && (a.padding = `var(--pittorica-space-${p})`), d && (a.paddingTop = `var(--pittorica-space-${d})`), f && (a.paddingRight = `var(--pittorica-space-${f})`), m && (a.paddingBottom = `var(--pittorica-space-${m})`), g && (a.paddingLeft = `var(--pittorica-space-${g})`);
187
187
  const B = {
188
188
  ...b,
189
189
  ...a
@@ -205,28 +205,28 @@ const q = ({
205
205
  }
206
206
  );
207
207
  };
208
- q.displayName = "Box";
208
+ z.displayName = "Box";
209
209
  const _ = ({
210
210
  children: e,
211
211
  variant: i = "filled",
212
212
  color: r = "indigo",
213
213
  size: t = "3",
214
214
  className: o,
215
- style: s,
216
- ref: n,
217
- ...c
215
+ style: n,
216
+ ref: c,
217
+ ...l
218
218
  }) => {
219
- const l = r !== "inherit" && !(r != null && r.startsWith("#")) && !(r != null && r.startsWith("rgb")), p = {
220
- ...s,
221
- "--pittorica-source-color": l ? `var(--pittorica-${r}-9)` : r,
219
+ const s = r !== "inherit" && !(r != null && r.startsWith("#")) && !(r != null && r.startsWith("rgb")), p = {
220
+ ...n,
221
+ "--pittorica-source-color": s ? `var(--pittorica-${r}-9)` : r,
222
222
  "--pittorica-on-source-color": "#ffffff"
223
223
  };
224
224
  return /* @__PURE__ */ y(
225
- q,
225
+ z,
226
226
  {
227
- ...c,
228
- as: c.href ? "a" : "button",
229
- ref: n,
227
+ ...l,
228
+ as: l.href ? "a" : "button",
229
+ ref: c,
230
230
  className: Z(
231
231
  "pittorica-icon-button",
232
232
  `pittorica-icon-button--${i}`,
@@ -265,23 +265,23 @@ function rt() {
265
265
  for (var e, i, r = 0, t = "", o = arguments.length; r < o; r++) (e = arguments[r]) && (i = M(e)) && (t && (t += " "), t += i);
266
266
  return t;
267
267
  }
268
- const O = ({
268
+ const P = ({
269
269
  ref: e,
270
270
  as: i = "div",
271
271
  children: r,
272
272
  display: t,
273
273
  m: o,
274
- mt: s,
275
- mr: n,
276
- mb: c,
277
- ml: l,
274
+ mt: n,
275
+ mr: c,
276
+ mb: l,
277
+ ml: s,
278
278
  p,
279
279
  pt: d,
280
280
  pr: f,
281
281
  pb: m,
282
282
  pl: g,
283
- width: u,
284
- height: h,
283
+ width: h,
284
+ height: u,
285
285
  position: v,
286
286
  style: b,
287
287
  className: $,
@@ -294,7 +294,7 @@ const O = ({
294
294
  ...R
295
295
  }) => {
296
296
  const a = {};
297
- t && (a.display = t), u && (a.width = u), h && (a.height = h), v && (a.position = v), o && (a.margin = `var(--pittorica-space-${o})`), s && (a.marginTop = `var(--pittorica-space-${s})`), n && (a.marginRight = `var(--pittorica-space-${n})`), c && (a.marginBottom = `var(--pittorica-space-${c})`), l && (a.marginLeft = `var(--pittorica-space-${l})`), p && (a.padding = `var(--pittorica-space-${p})`), d && (a.paddingTop = `var(--pittorica-space-${d})`), f && (a.paddingRight = `var(--pittorica-space-${f})`), m && (a.paddingBottom = `var(--pittorica-space-${m})`), g && (a.paddingLeft = `var(--pittorica-space-${g})`);
297
+ t && (a.display = t), h && (a.width = h), u && (a.height = u), v && (a.position = v), o && (a.margin = `var(--pittorica-space-${o})`), n && (a.marginTop = `var(--pittorica-space-${n})`), c && (a.marginRight = `var(--pittorica-space-${c})`), l && (a.marginBottom = `var(--pittorica-space-${l})`), s && (a.marginLeft = `var(--pittorica-space-${s})`), p && (a.padding = `var(--pittorica-space-${p})`), d && (a.paddingTop = `var(--pittorica-space-${d})`), f && (a.paddingRight = `var(--pittorica-space-${f})`), m && (a.paddingBottom = `var(--pittorica-space-${m})`), g && (a.paddingLeft = `var(--pittorica-space-${g})`);
298
298
  const B = {
299
299
  ...b,
300
300
  ...a
@@ -316,26 +316,23 @@ const O = ({
316
316
  }
317
317
  );
318
318
  };
319
- O.displayName = "Box";
320
- const it = (e, i) => i ? typeof i == "string" ? [`pittorica-text--${e}-${i}`] : Object.entries(i).filter(([r, t]) => t !== void 0).map(
321
- ([r, t]) => r === "initial" ? `pittorica-text--${e}-${t}` : `pittorica-text--${r}-${e}-${t}`
322
- ) : [], F = ({
319
+ P.displayName = "Box";
320
+ const j = ({
323
321
  children: e,
324
322
  as: i = "span",
325
- size: r = "3",
326
- weight: t = "regular",
327
- align: o,
328
- truncate: s = !1,
323
+ weight: r = "regular",
324
+ align: t,
325
+ truncate: o = !1,
329
326
  color: n,
330
327
  className: c,
331
328
  style: l,
332
- href: p,
333
- target: d,
334
- rel: f,
335
- htmlFor: m,
336
- ...g
329
+ href: s,
330
+ target: p,
331
+ rel: d,
332
+ htmlFor: f,
333
+ ...m
337
334
  }) => {
338
- const u = (n == null ? void 0 : n.startsWith("#")) || (n == null ? void 0 : n.startsWith("rgb")), h = [
335
+ const g = (n == null ? void 0 : n.startsWith("#")) || (n == null ? void 0 : n.startsWith("rgb")) || (n == null ? void 0 : n.startsWith("hsl")), h = /* @__PURE__ */ new Set([
339
336
  "danger",
340
337
  "success",
341
338
  "error",
@@ -347,76 +344,72 @@ const it = (e, i) => i ? typeof i == "string" ? [`pittorica-text--${e}-${i}`] :
347
344
  "slate",
348
345
  "blue",
349
346
  "red"
350
- ].includes(n), v = (() => {
351
- if (n) {
352
- if (n === "inherit") return "inherit";
353
- if (u) return n;
354
- if (h) return `var(--pittorica-${n}-9)`;
355
- }
356
- })(), b = {
347
+ ]), u = (() => {
348
+ if (n)
349
+ return n === "inherit" ? "inherit" : g ? n : h.has(n) ? `var(--pittorica-${n}-9)` : n;
350
+ })(), v = {
357
351
  ...l,
358
- textAlign: o,
359
- color: v
360
- }, $ = it("size", r);
352
+ textAlign: t,
353
+ color: u
354
+ };
361
355
  return /* @__PURE__ */ y(
362
- O,
356
+ P,
363
357
  {
364
358
  as: i,
365
359
  className: et(
366
360
  "pittorica-text",
367
- { "pittorica-text--truncate": s },
368
- $,
361
+ { "pittorica-text--truncate": o },
369
362
  c
370
363
  ),
371
- "data-weight": t,
372
- style: b,
373
- href: p,
374
- target: d,
375
- rel: f,
376
- htmlFor: m,
377
- ...g,
364
+ "data-weight": r,
365
+ style: v,
366
+ href: s,
367
+ target: p,
368
+ rel: d,
369
+ htmlFor: f,
370
+ ...m,
378
371
  children: e
379
372
  }
380
373
  );
381
- }, j = "pittorica-toast", st = (e) => {
382
- const i = Math.random().toString(36).slice(2, 9), r = new CustomEvent(j, { detail: { ...e, id: i } });
374
+ }, E = "pittorica-toast", nt = (e) => {
375
+ const i = Math.random().toString(36).slice(2, 9), r = new CustomEvent(E, { detail: { ...e, id: i } });
383
376
  globalThis.dispatchEvent(r);
384
- }, lt = () => {
385
- const [e, i] = X([]), r = V(/* @__PURE__ */ new Set()), t = D((o) => {
386
- i((s) => s.filter((n) => n.id !== o));
377
+ }, st = () => {
378
+ const [e, i] = O([]), r = V(/* @__PURE__ */ new Set()), t = D((o) => {
379
+ i((n) => n.filter((c) => c.id !== o));
387
380
  }, []);
388
381
  return G(() => {
389
- const o = (s) => {
390
- const c = s.detail;
391
- if (i((l) => [...l, c]), c.duration !== 0) {
392
- const l = setTimeout(() => {
393
- t(c.id), r.current.delete(l);
394
- }, c.duration || 3e3);
395
- r.current.add(l);
382
+ const o = (n) => {
383
+ const l = n.detail;
384
+ if (i((s) => [...s, l]), l.duration !== 0) {
385
+ const s = setTimeout(() => {
386
+ t(l.id), r.current.delete(s);
387
+ }, l.duration || 3e3);
388
+ r.current.add(s);
396
389
  }
397
390
  };
398
- return globalThis.addEventListener(j, o), () => {
399
- globalThis.removeEventListener(j, o);
400
- for (const s of r.current) clearTimeout(s);
391
+ return globalThis.addEventListener(E, o), () => {
392
+ globalThis.removeEventListener(E, o);
393
+ for (const n of r.current) clearTimeout(n);
401
394
  r.current.clear();
402
395
  };
403
396
  }, [t]), typeof document > "u" ? null : H(
404
397
  /* @__PURE__ */ y(
405
- C,
398
+ L,
406
399
  {
407
400
  className: "pittorica-toast-viewport",
408
401
  role: "region",
409
402
  "aria-label": "Notifications",
410
- children: e.map((o) => /* @__PURE__ */ E(
411
- C,
403
+ children: e.map((o) => /* @__PURE__ */ F(
404
+ L,
412
405
  {
413
406
  className: "pittorica-toast-root",
414
407
  role: "status",
415
408
  "aria-live": "polite",
416
409
  children: [
417
- /* @__PURE__ */ E(C, { className: "pittorica-toast-content", children: [
418
- /* @__PURE__ */ y(F, { size: "2", weight: "bold", style: { display: "block" }, children: o.title }),
419
- o.description && /* @__PURE__ */ y(F, { size: "2", color: "slate", style: { display: "block" }, children: o.description })
410
+ /* @__PURE__ */ F(L, { className: "pittorica-toast-content", children: [
411
+ /* @__PURE__ */ y(j, { weight: "bold", style: { display: "block" }, children: o.title }),
412
+ o.description && /* @__PURE__ */ y(j, { color: "slate", style: { display: "block" }, children: o.description })
420
413
  ] }),
421
414
  /* @__PURE__ */ y(
422
415
  _,
@@ -439,6 +432,6 @@ const it = (e, i) => i ? typeof i == "string" ? [`pittorica-text--${e}-${i}`] :
439
432
  );
440
433
  };
441
434
  export {
442
- lt as ToastProvider,
443
- st as toast
435
+ st as ToastProvider,
436
+ nt as toast
444
437
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pittorica/toast-react",
3
- "version": "0.22.0",
3
+ "version": "0.22.4",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",
@@ -11,9 +11,9 @@
11
11
  "dependencies": {
12
12
  "@tabler/icons-react": "^3.36.1",
13
13
  "clsx": "^2.1.1",
14
- "@pittorica/box-react": "0.22.0",
15
- "@pittorica/icon-button-react": "0.22.0",
16
- "@pittorica/text-react": "0.22.0"
14
+ "@pittorica/box-react": "0.22.4",
15
+ "@pittorica/icon-button-react": "0.22.4",
16
+ "@pittorica/text-react": "0.22.4"
17
17
  },
18
18
  "devDependencies": {
19
19
  "@testing-library/jest-dom": "^6.9.1",
@@ -25,10 +25,10 @@
25
25
  "typescript": "^5.0.0",
26
26
  "vite": "^5.0.0",
27
27
  "vitest": "^2.1.9",
28
- "@pittorica/button-react": "0.22.0",
29
- "@pittorica/flex-react": "0.22.0",
30
- "pittorica": "0.22.0",
31
- "@pittorica/theme-react": "0.22.0"
28
+ "@pittorica/button-react": "0.22.4",
29
+ "@pittorica/flex-react": "0.22.4",
30
+ "@pittorica/theme-react": "0.22.4",
31
+ "pittorica": "0.22.4"
32
32
  },
33
33
  "peerDependencies": {
34
34
  "react": ">=19",