@purpurds/tabs 5.6.0 → 5.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/tabs.es.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { jsx as w, jsxs as ee } from "react/jsx-runtime";
2
2
  import * as ve from "react";
3
- import A, { createContext as ne, useMemo as W, createElement as x, useContext as me, useCallback as V, forwardRef as S, Children as E, isValidElement as k, cloneElement as se, Fragment as Fe, useLayoutEffect as De, useEffect as R, useRef as P, useState as D, useReducer as qe } from "react";
3
+ import A, { createContext as ne, useMemo as W, createElement as x, useContext as me, useCallback as V, forwardRef as S, Children as E, isValidElement as k, cloneElement as se, Fragment as Fe, useLayoutEffect as De, useEffect as P, useRef as R, useState as D, useReducer as qe } from "react";
4
4
  import { flushSync as Le } from "react-dom";
5
5
  function Ue(e) {
6
6
  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
@@ -91,15 +91,15 @@ const Be = /* @__PURE__ */ Ue(Ve), je = {
91
91
  }
92
92
  );
93
93
  };
94
- function C() {
95
- return C = Object.assign ? Object.assign.bind() : function(e) {
94
+ function I() {
95
+ return I = Object.assign ? Object.assign.bind() : function(e) {
96
96
  for (var t = 1; t < arguments.length; t++) {
97
97
  var n = arguments[t];
98
98
  for (var o in n)
99
99
  Object.prototype.hasOwnProperty.call(n, o) && (e[o] = n[o]);
100
100
  }
101
101
  return e;
102
- }, C.apply(this, arguments);
102
+ }, I.apply(this, arguments);
103
103
  }
104
104
  function O(e, t, { checkForDefaultPrevented: n = !0 } = {}) {
105
105
  return function(s) {
@@ -206,11 +206,11 @@ const Z = /* @__PURE__ */ S((e, t) => {
206
206
  const { children: n, ...o } = e, s = E.toArray(n), r = s.find(et);
207
207
  if (r) {
208
208
  const c = r.props.children, a = s.map((u) => u === r ? E.count(c) > 1 ? E.only(null) : /* @__PURE__ */ k(c) ? c.props.children : null : u);
209
- return /* @__PURE__ */ x(re, C({}, o, {
209
+ return /* @__PURE__ */ x(re, I({}, o, {
210
210
  ref: t
211
211
  }), /* @__PURE__ */ k(c) ? /* @__PURE__ */ se(c, void 0, a) : null);
212
212
  }
213
- return /* @__PURE__ */ x(re, C({}, o, {
213
+ return /* @__PURE__ */ x(re, I({}, o, {
214
214
  ref: t
215
215
  }), n);
216
216
  });
@@ -335,9 +335,9 @@ const ct = [
335
335
  ], G = ct.reduce((e, t) => {
336
336
  const n = /* @__PURE__ */ S((o, s) => {
337
337
  const { asChild: r, ...c } = o, a = r ? Z : t;
338
- return R(() => {
338
+ return P(() => {
339
339
  window[Symbol.for("radix-ui")] = !0;
340
- }, []), /* @__PURE__ */ x(a, C({}, c, {
340
+ }, []), /* @__PURE__ */ x(a, I({}, c, {
341
341
  ref: s
342
342
  }));
343
343
  });
@@ -347,8 +347,8 @@ const ct = [
347
347
  };
348
348
  }, {});
349
349
  function ie(e) {
350
- const t = P(e);
351
- return R(() => {
350
+ const t = R(e);
351
+ return P(() => {
352
352
  t.current = e;
353
353
  }), W(
354
354
  () => (...n) => {
@@ -381,8 +381,8 @@ function xe({ prop: e, defaultProp: t, onChange: n = () => {
381
381
  ];
382
382
  }
383
383
  function st({ defaultProp: e, onChange: t }) {
384
- const n = D(e), [o] = n, s = P(o), r = ie(t);
385
- return R(() => {
384
+ const n = D(e), [o] = n, s = R(o), r = ie(t);
385
+ return P(() => {
386
386
  s.current !== o && (r(o), s.current = o);
387
387
  }, [
388
388
  o,
@@ -391,31 +391,31 @@ function st({ defaultProp: e, onChange: t }) {
391
391
  ]), n;
392
392
  }
393
393
  const at = /* @__PURE__ */ ne(void 0);
394
- function Ie(e) {
394
+ function Ce(e) {
395
395
  const t = me(at);
396
396
  return e || t || "ltr";
397
397
  }
398
398
  const te = "rovingFocusGroup.onEntryFocus", it = {
399
399
  bubbles: !1,
400
400
  cancelable: !0
401
- }, ue = "RovingFocusGroup", [ce, Ce, ut] = nt(ue), [lt, ye] = ae(ue, [
401
+ }, ue = "RovingFocusGroup", [ce, Ie, ut] = nt(ue), [lt, ye] = ae(ue, [
402
402
  ut
403
403
  ]), [dt, ft] = lt(ue), pt = /* @__PURE__ */ S((e, t) => /* @__PURE__ */ x(ce.Provider, {
404
404
  scope: e.__scopeRovingFocusGroup
405
405
  }, /* @__PURE__ */ x(ce.Slot, {
406
406
  scope: e.__scopeRovingFocusGroup
407
- }, /* @__PURE__ */ x(bt, C({}, e, {
407
+ }, /* @__PURE__ */ x(bt, I({}, e, {
408
408
  ref: t
409
409
  }))))), bt = /* @__PURE__ */ S((e, t) => {
410
- const { __scopeRovingFocusGroup: n, orientation: o, loop: s = !1, dir: r, currentTabStopId: c, defaultCurrentTabStopId: a, onCurrentTabStopIdChange: u, onEntryFocus: i, ...p } = e, l = P(null), $ = Y(t, l), v = Ie(r), [d = null, b] = xe({
410
+ const { __scopeRovingFocusGroup: n, orientation: o, loop: s = !1, dir: r, currentTabStopId: c, defaultCurrentTabStopId: a, onCurrentTabStopIdChange: u, onEntryFocus: i, ...p } = e, l = R(null), $ = Y(t, l), v = Ce(r), [d = null, b] = xe({
411
411
  prop: c,
412
412
  defaultProp: a,
413
413
  onChange: u
414
- }), [m, _] = D(!1), h = ie(i), F = Ce(n), T = P(!1), [q, z] = D(0);
415
- return R(() => {
416
- const I = l.current;
417
- if (I)
418
- return I.addEventListener(te, h), () => I.removeEventListener(te, h);
414
+ }), [m, _] = D(!1), h = ie(i), F = Ie(n), T = R(!1), [q, z] = D(0);
415
+ return P(() => {
416
+ const C = l.current;
417
+ if (C)
418
+ return C.addEventListener(te, h), () => C.removeEventListener(te, h);
419
419
  }, [
420
420
  h
421
421
  ]), /* @__PURE__ */ x(dt, {
@@ -425,7 +425,7 @@ const te = "rovingFocusGroup.onEntryFocus", it = {
425
425
  loop: s,
426
426
  currentTabStopId: d,
427
427
  onItemFocus: V(
428
- (I) => b(I),
428
+ (C) => b(C),
429
429
  [
430
430
  b
431
431
  ]
@@ -436,17 +436,17 @@ const te = "rovingFocusGroup.onEntryFocus", it = {
436
436
  ),
437
437
  onFocusableItemAdd: V(
438
438
  () => z(
439
- (I) => I + 1
439
+ (C) => C + 1
440
440
  ),
441
441
  []
442
442
  ),
443
443
  onFocusableItemRemove: V(
444
444
  () => z(
445
- (I) => I - 1
445
+ (C) => C - 1
446
446
  ),
447
447
  []
448
448
  )
449
- }, /* @__PURE__ */ x(G.div, C({
449
+ }, /* @__PURE__ */ x(G.div, I({
450
450
  tabIndex: m || q === 0 ? -1 : 0,
451
451
  "data-orientation": o
452
452
  }, p, {
@@ -458,11 +458,11 @@ const te = "rovingFocusGroup.onEntryFocus", it = {
458
458
  onMouseDown: O(e.onMouseDown, () => {
459
459
  T.current = !0;
460
460
  }),
461
- onFocus: O(e.onFocus, (I) => {
461
+ onFocus: O(e.onFocus, (C) => {
462
462
  const H = !T.current;
463
- if (I.target === I.currentTarget && H && !m) {
463
+ if (C.target === C.currentTarget && H && !m) {
464
464
  const B = new CustomEvent(te, it);
465
- if (I.currentTarget.dispatchEvent(B), !B.defaultPrevented) {
465
+ if (C.currentTarget.dispatchEvent(B), !B.defaultPrevented) {
466
466
  const L = F().filter(
467
467
  (g) => g.focusable
468
468
  ), X = L.find(
@@ -487,8 +487,8 @@ const te = "rovingFocusGroup.onEntryFocus", it = {
487
487
  )
488
488
  })));
489
489
  }), $t = "RovingFocusGroupItem", vt = /* @__PURE__ */ S((e, t) => {
490
- const { __scopeRovingFocusGroup: n, focusable: o = !0, active: s = !1, tabStopId: r, ...c } = e, a = he(), u = r || a, i = ft($t, n), p = i.currentTabStopId === u, l = Ce(n), { onFocusableItemAdd: $, onFocusableItemRemove: v } = i;
491
- return R(() => {
490
+ const { __scopeRovingFocusGroup: n, focusable: o = !0, active: s = !1, tabStopId: r, ...c } = e, a = he(), u = r || a, i = ft($t, n), p = i.currentTabStopId === u, l = Ie(n), { onFocusableItemAdd: $, onFocusableItemRemove: v } = i;
491
+ return P(() => {
492
492
  if (o)
493
493
  return $(), () => v();
494
494
  }, [
@@ -500,7 +500,7 @@ const te = "rovingFocusGroup.onEntryFocus", it = {
500
500
  id: u,
501
501
  focusable: o,
502
502
  active: s
503
- }, /* @__PURE__ */ x(G.span, C({
503
+ }, /* @__PURE__ */ x(G.span, I({
504
504
  tabIndex: p ? 0 : -1,
505
505
  "data-orientation": i.orientation
506
506
  }, c, {
@@ -575,8 +575,8 @@ function ht(e, t) {
575
575
  (n, o) => e[(t + o) % e.length]
576
576
  );
577
577
  }
578
- const xt = pt, It = vt;
579
- function Ct(e, t) {
578
+ const xt = pt, Ct = vt;
579
+ function It(e, t) {
580
580
  return qe((n, o) => {
581
581
  const s = t[n][o];
582
582
  return s ?? n;
@@ -592,7 +592,7 @@ const we = (e) => {
592
592
  };
593
593
  we.displayName = "Presence";
594
594
  function yt(e) {
595
- const [t, n] = D(), o = P({}), s = P(e), r = P("none"), c = e ? "mounted" : "unmounted", [a, u] = Ct(c, {
595
+ const [t, n] = D(), o = R({}), s = R(e), r = R("none"), c = e ? "mounted" : "unmounted", [a, u] = It(c, {
596
596
  mounted: {
597
597
  UNMOUNT: "unmounted",
598
598
  ANIMATION_OUT: "unmountSuspended"
@@ -605,7 +605,7 @@ function yt(e) {
605
605
  MOUNT: "mounted"
606
606
  }
607
607
  });
608
- return R(() => {
608
+ return P(() => {
609
609
  const i = K(o.current);
610
610
  r.current = a === "mounted" ? i : "none";
611
611
  }, [
@@ -653,7 +653,7 @@ function K(e) {
653
653
  const Te = "Tabs", [St, tn] = ae(Te, [
654
654
  ye
655
655
  ]), Ne = ye(), [wt, le] = St(Te), Tt = /* @__PURE__ */ S((e, t) => {
656
- const { __scopeTabs: n, value: o, onValueChange: s, defaultValue: r, orientation: c = "horizontal", dir: a, activationMode: u = "automatic", ...i } = e, p = Ie(a), [l, $] = xe({
656
+ const { __scopeTabs: n, value: o, onValueChange: s, defaultValue: r, orientation: c = "horizontal", dir: a, activationMode: u = "automatic", ...i } = e, p = Ce(a), [l, $] = xe({
657
657
  prop: o,
658
658
  onChange: s,
659
659
  defaultProp: r
@@ -666,7 +666,7 @@ const Te = "Tabs", [St, tn] = ae(Te, [
666
666
  orientation: c,
667
667
  dir: p,
668
668
  activationMode: u
669
- }, /* @__PURE__ */ x(G.div, C({
669
+ }, /* @__PURE__ */ x(G.div, I({
670
670
  dir: p,
671
671
  "data-orientation": c
672
672
  }, i, {
@@ -674,26 +674,26 @@ const Te = "Tabs", [St, tn] = ae(Te, [
674
674
  })));
675
675
  }), Nt = "TabsList", At = /* @__PURE__ */ S((e, t) => {
676
676
  const { __scopeTabs: n, loop: o = !0, ...s } = e, r = le(Nt, n), c = Ne(n);
677
- return /* @__PURE__ */ x(xt, C({
677
+ return /* @__PURE__ */ x(xt, I({
678
678
  asChild: !0
679
679
  }, c, {
680
680
  orientation: r.orientation,
681
681
  dir: r.dir,
682
682
  loop: o
683
- }), /* @__PURE__ */ x(G.div, C({
683
+ }), /* @__PURE__ */ x(G.div, I({
684
684
  role: "tablist",
685
685
  "aria-orientation": r.orientation
686
686
  }, s, {
687
687
  ref: t
688
688
  })));
689
- }), Et = "TabsTrigger", Rt = /* @__PURE__ */ S((e, t) => {
689
+ }), Et = "TabsTrigger", Pt = /* @__PURE__ */ S((e, t) => {
690
690
  const { __scopeTabs: n, value: o, disabled: s = !1, ...r } = e, c = le(Et, n), a = Ne(n), u = Ae(c.baseId, o), i = Ee(c.baseId, o), p = o === c.value;
691
- return /* @__PURE__ */ x(It, C({
691
+ return /* @__PURE__ */ x(Ct, I({
692
692
  asChild: !0
693
693
  }, a, {
694
694
  focusable: !s,
695
695
  active: p
696
- }), /* @__PURE__ */ x(G.button, C({
696
+ }), /* @__PURE__ */ x(G.button, I({
697
697
  type: "button",
698
698
  role: "tab",
699
699
  "aria-selected": p,
@@ -718,9 +718,9 @@ const Te = "Tabs", [St, tn] = ae(Te, [
718
718
  !p && !s && l && c.onValueChange(o);
719
719
  })
720
720
  })));
721
- }), Pt = "TabsContent", Mt = /* @__PURE__ */ S((e, t) => {
722
- const { __scopeTabs: n, value: o, forceMount: s, children: r, ...c } = e, a = le(Pt, n), u = Ae(a.baseId, o), i = Ee(a.baseId, o), p = o === a.value, l = P(p);
723
- return R(() => {
721
+ }), Rt = "TabsContent", Mt = /* @__PURE__ */ S((e, t) => {
722
+ const { __scopeTabs: n, value: o, forceMount: s, children: r, ...c } = e, a = le(Rt, n), u = Ae(a.baseId, o), i = Ee(a.baseId, o), p = o === a.value, l = R(p);
723
+ return P(() => {
724
724
  const $ = requestAnimationFrame(
725
725
  () => l.current = !1
726
726
  );
@@ -730,7 +730,7 @@ const Te = "Tabs", [St, tn] = ae(Te, [
730
730
  {
731
731
  present: s || p
732
732
  },
733
- ({ present: $ }) => /* @__PURE__ */ x(G.div, C({
733
+ ({ present: $ }) => /* @__PURE__ */ x(G.div, I({
734
734
  "data-state": p ? "active" : "inactive",
735
735
  "data-orientation": a.orientation,
736
736
  role: "tabpanel",
@@ -753,11 +753,11 @@ function Ae(e, t) {
753
753
  function Ee(e, t) {
754
754
  return `${e}-content-${t}`;
755
755
  }
756
- const Ot = Tt, Ft = At, Dt = Rt, qt = Mt;
756
+ const Ot = Tt, Ft = At, Dt = Pt, qt = Mt;
757
757
  function Lt(e) {
758
758
  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
759
759
  }
760
- var Re = { exports: {} };
760
+ var Pe = { exports: {} };
761
761
  /*!
762
762
  Copyright (c) 2018 Jed Watson.
763
763
  Licensed under the MIT License (MIT), see
@@ -792,8 +792,8 @@ var Re = { exports: {} };
792
792
  }
793
793
  e.exports ? (n.default = n, e.exports = n) : window.classNames = n;
794
794
  })();
795
- })(Re);
796
- var Ut = Re.exports;
795
+ })(Pe);
796
+ var Ut = Pe.exports;
797
797
  const de = /* @__PURE__ */ Lt(Ut), Vt = {
798
798
  "purpur-tab-content": "_purpur-tab-content_1x2zs_1"
799
799
  }, Bt = de.bind(Vt), jt = "purpur-tab-content", Gt = S(
@@ -869,7 +869,7 @@ const de = /* @__PURE__ */ Lt(Ut), Vt = {
869
869
  "data-testid": a,
870
870
  ...u
871
871
  }) => {
872
- const [i, p] = D({}), [l, $] = D(0), [v, d] = D(0), b = E.toArray(e).filter(kt), m = P(), _ = P(new Array(b.length)), h = 200, F = t === "line", T = U([
872
+ const [i, p] = D({}), [l, $] = D(0), [v, d] = D(0), b = E.toArray(e).filter(kt), m = R(), _ = R(new Array(b.length)), h = 200, F = t === "line", T = U([
873
873
  y,
874
874
  `${y}--${t}${n ? "-negative" : ""}`,
875
875
  { [`${y}--fullWidth`]: o },
@@ -877,13 +877,13 @@ const de = /* @__PURE__ */ Lt(Ut), Vt = {
877
877
  ]), q = E.map(b, ({ props: { tabId: f } }) => f), z = () => {
878
878
  const f = q.findIndex((g) => g === c);
879
879
  return f >= 0 ? f : 0;
880
- }, [I, H] = D(z);
880
+ }, [C, H] = D(z);
881
881
  if (new Set(q).size !== q.length)
882
882
  throw new Error("tabId must be unique");
883
883
  const B = (f, g) => g || a ? `${g || a}-${f}` : void 0, L = () => {
884
884
  if (!F)
885
885
  return;
886
- const f = _.current[I];
886
+ const f = _.current[C];
887
887
  $((f == null ? void 0 : f.offsetLeft) || 0), d((f == null ? void 0 : f.getBoundingClientRect().width) || 0);
888
888
  }, X = (f) => {
889
889
  F && H(b.findIndex((g) => g.props.tabId === f)), s == null || s(Zt(f));
@@ -904,21 +904,21 @@ const de = /* @__PURE__ */ Lt(Ut), Vt = {
904
904
  children: /* @__PURE__ */ w(He, { svg: f === "left" ? Ge : ke, size: "md" })
905
905
  }
906
906
  );
907
- return R(() => (window.addEventListener("resize", L), () => {
907
+ return P(() => (window.addEventListener("resize", L), () => {
908
908
  window.removeEventListener("resize", L);
909
- }), []), R(() => {
909
+ }), []), P(() => {
910
910
  L();
911
- }, [I, o, b.length, t]), R(() => {
911
+ }, [C, o, b.length, t]), P(() => {
912
912
  const f = (M) => {
913
913
  if (M.every((N) => N.isIntersecting) && M.length === b.length) {
914
914
  p({});
915
915
  return;
916
916
  }
917
917
  M.forEach((N) => {
918
- const pe = Number(N.target.getAttribute("data-index")), Pe = pe === 0, Me = pe === b.length - 1;
918
+ const pe = Number(N.target.getAttribute("data-index")), Re = pe === 0, Me = pe === b.length - 1;
919
919
  p((Oe) => ({
920
920
  ...Oe,
921
- ...Pe && {
921
+ ...Re && {
922
922
  [`${y}__wrapper--scroll-end`]: !N.isIntersecting
923
923
  },
924
924
  ...Me && {