@blakesteve/roster 5.8.0 → 5.10.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/README.md +126 -23
- package/dist/components/atoms/Button/button-variants.js +1 -1
- package/dist/components/atoms/Eyebrow/eyebrow-variants.d.ts +2 -2
- package/dist/components/atoms/Input/input-variants.js +1 -1
- package/dist/components/atoms/Skeleton/Skeleton.cjs +1 -1
- package/dist/components/atoms/Skeleton/Skeleton.d.ts +19 -3
- package/dist/components/atoms/Skeleton/Skeleton.js +38 -33
- package/dist/components/atoms/ThemeToggle/ThemeToggle.d.ts +1 -1
- package/dist/components/molecules/CheckboxGroup/CheckboxGroup.d.ts +1 -1
- package/dist/components/molecules/CheckboxGroup/checkbox-group-variants.d.ts +1 -1
- package/dist/components/molecules/Menu/Menu.cjs +1 -0
- package/dist/components/molecules/Menu/Menu.d.ts +169 -0
- package/dist/components/molecules/Menu/Menu.js +577 -0
- package/dist/components/molecules/Menu/menu-typeahead.cjs +1 -0
- package/dist/components/molecules/Menu/menu-typeahead.d.ts +7 -0
- package/dist/components/molecules/Menu/menu-typeahead.js +13 -0
- package/dist/components/molecules/SkeletonPresets/SkeletonPresets.cjs +1 -1
- package/dist/components/molecules/SkeletonPresets/SkeletonPresets.d.ts +13 -4
- package/dist/components/molecules/SkeletonPresets/SkeletonPresets.js +35 -35
- package/dist/components/molecules/Toast/Toaster.d.ts +1 -1
- package/dist/components/organisms/Navbar/Navbar.cjs +1 -1
- package/dist/components/organisms/Navbar/Navbar.d.ts +1 -1
- package/dist/components/organisms/Navbar/Navbar.js +275 -302
- package/dist/index.d.ts +1 -0
- package/dist/lib/utils.cjs +1 -1
- package/dist/lib/utils.js +4 -1
- package/dist/meta.json +3 -3
- package/dist/node_modules/@floating-ui/core/dist/floating-ui.core.js +7 -7
- package/dist/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +2 -2
- package/dist/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js +5 -5
- package/dist/node_modules/@headlessui/react/dist/components/portal/portal.js +6 -6
- package/dist/node_modules/@headlessui/react/dist/utils/focus-management.cjs +1 -1
- package/dist/node_modules/@headlessui/react/dist/utils/focus-management.js +52 -61
- package/dist/node_modules/@radix-ui/react-popper/dist/index.js +6 -6
- package/dist/roster.cjs +1 -1
- package/dist/roster.css +1 -1
- package/dist/roster.js +127 -116
- package/package.json +2 -1
- package/dist/node_modules/@headlessui/react/dist/components/menu/menu-machine-glue.cjs +0 -1
- package/dist/node_modules/@headlessui/react/dist/components/menu/menu-machine-glue.js +0 -21
- package/dist/node_modules/@headlessui/react/dist/components/menu/menu-machine.cjs +0 -1
- package/dist/node_modules/@headlessui/react/dist/components/menu/menu-machine.js +0 -120
- package/dist/node_modules/@headlessui/react/dist/components/menu/menu.cjs +0 -1
- package/dist/node_modules/@headlessui/react/dist/components/menu/menu.js +0 -197
|
@@ -1,197 +0,0 @@
|
|
|
1
|
-
import { useFocusRing as me } from "../../../../../@react-aria/focus/dist/useFocusRing.js";
|
|
2
|
-
import { useHover as de } from "../../../../../@react-aria/interactions/dist/useHover.js";
|
|
3
|
-
import O, { useId as K, useCallback as G, Fragment as oe, useRef as W, useState as fe, useEffect as ve } from "react";
|
|
4
|
-
import { flushSync as Y } from "react-dom";
|
|
5
|
-
import { useActivePress as ge } from "../../hooks/use-active-press.js";
|
|
6
|
-
import { useDisposables as be } from "../../hooks/use-disposables.js";
|
|
7
|
-
import { useElementSize as ye } from "../../hooks/use-element-size.js";
|
|
8
|
-
import { useEvent as M } from "../../hooks/use-event.js";
|
|
9
|
-
import { useHandleToggle as Me } from "../../hooks/use-handle-toggle.js";
|
|
10
|
-
import { useInertOthers as Pe } from "../../hooks/use-inert-others.js";
|
|
11
|
-
import { useIsoMorphicEffect as B } from "../../hooks/use-iso-morphic-effect.js";
|
|
12
|
-
import { useOnDisappear as $e } from "../../hooks/use-on-disappear.js";
|
|
13
|
-
import { useOutsideClick as he } from "../../hooks/use-outside-click.js";
|
|
14
|
-
import { useOwnerDocument as X } from "../../hooks/use-owner.js";
|
|
15
|
-
import { useQuickRelease as Ie, Action as U } from "../../hooks/use-quick-release.js";
|
|
16
|
-
import { useResolveButtonType as Se } from "../../hooks/use-resolve-button-type.js";
|
|
17
|
-
import { useScrollLock as Ee } from "../../hooks/use-scroll-lock.js";
|
|
18
|
-
import { useSlot as z } from "../../hooks/use-slot.js";
|
|
19
|
-
import { useSyncRefs as Q } from "../../hooks/use-sync-refs.js";
|
|
20
|
-
import { useTextValue as Te } from "../../hooks/use-text-value.js";
|
|
21
|
-
import { useTrackedPointer as Fe } from "../../hooks/use-tracked-pointer.js";
|
|
22
|
-
import { useTransition as De, transitionDataAttributes as Oe } from "../../hooks/use-transition.js";
|
|
23
|
-
import { useTreeWalker as ke } from "../../hooks/use-tree-walker.js";
|
|
24
|
-
import { FloatingProvider as we, useFloatingReferenceProps as Ce, useFloatingReference as Re, useResolvedAnchor as Ae, useFloatingPanel as xe, useFloatingPanelProps as Le } from "../../internal/floating.js";
|
|
25
|
-
import { OpenClosedProvider as _e, State as V, useOpenClosed as He } from "../../internal/open-closed.js";
|
|
26
|
-
import { stackMachines as Ne } from "../../machines/stack-machine.js";
|
|
27
|
-
import { useSlice as T } from "../../react-glue.js";
|
|
28
|
-
import { Focus as h } from "../../utils/calculate-active-index.js";
|
|
29
|
-
import { disposables as Ge } from "../../utils/disposables.js";
|
|
30
|
-
import { isHTMLElement as Ke } from "../../utils/dom.js";
|
|
31
|
-
import { isFocusableElement as Ue, FocusableMode as Be, focusFrom as Ve, Focus as ee, restoreFocusIfNecessary as se } from "../../utils/focus-management.js";
|
|
32
|
-
import { match as ze } from "../../utils/match.js";
|
|
33
|
-
import { isActiveElement as Qe } from "../../utils/owner.js";
|
|
34
|
-
import { forwardRefWithAs as k, useRender as w, RenderFeatures as te, mergeProps as re } from "../../utils/render.js";
|
|
35
|
-
import { useDescriptions as We } from "../description/description.js";
|
|
36
|
-
import { Keys as c } from "../keyboard.js";
|
|
37
|
-
import { useLabelContext as Ye, useLabels as ne } from "../label/label.js";
|
|
38
|
-
import { Portal as Ze } from "../portal/portal.js";
|
|
39
|
-
import { MenuState as v, ActionTypes as r, ActivationTrigger as Z } from "./menu-machine.js";
|
|
40
|
-
import { useMenuMachine as je, MenuContext as qe, useMenuMachineContext as j } from "./menu-machine-glue.js";
|
|
41
|
-
let Je = oe;
|
|
42
|
-
function Xe(m, b) {
|
|
43
|
-
let l = K(), { __demoMode: a = !1, ...i } = m, u = je({ id: l, __demoMode: a }), [o, I, g] = T(u, (d) => [d.menuState, d.itemsElement, d.buttonElement]), S = Q(b), t = Ne.get(null), D = T(t, G((d) => t.selectors.isTop(d, l), [t, l]));
|
|
44
|
-
he(D, [g, I], (d, f) => {
|
|
45
|
-
var y;
|
|
46
|
-
u.send({ type: r.CloseMenu }), Ue(f, Be.Loose) || (d.preventDefault(), (y = u.state.buttonElement) == null || y.focus());
|
|
47
|
-
});
|
|
48
|
-
let E = M(() => {
|
|
49
|
-
u.send({ type: r.CloseMenu });
|
|
50
|
-
}), P = z({ open: o === v.Open, close: E }), p = { ref: S }, $ = w();
|
|
51
|
-
return O.createElement(we, null, O.createElement(qe.Provider, { value: u }, O.createElement(_e, { value: ze(o, { [v.Open]: V.Open, [v.Closed]: V.Closed }) }, $({ ourProps: p, theirProps: i, slot: P, defaultTag: Je, name: "Menu" }))));
|
|
52
|
-
}
|
|
53
|
-
let et = "button";
|
|
54
|
-
function tt(m, b) {
|
|
55
|
-
let l = j("Menu.Button"), a = K(), { id: i = `headlessui-menu-button-${a}`, disabled: u = !1, autoFocus: o = !1, ...I } = m, g = W(null), S = Ce(), t = Q(b, g, Re(), M((s) => l.send({ type: r.SetButtonElement, element: s }))), D = M((s) => {
|
|
56
|
-
switch (s.key) {
|
|
57
|
-
case c.Space:
|
|
58
|
-
case c.Enter:
|
|
59
|
-
case c.ArrowDown:
|
|
60
|
-
s.preventDefault(), s.stopPropagation(), l.send({ type: r.OpenMenu, focus: { focus: h.First } });
|
|
61
|
-
break;
|
|
62
|
-
case c.ArrowUp:
|
|
63
|
-
s.preventDefault(), s.stopPropagation(), l.send({ type: r.OpenMenu, focus: { focus: h.Last } });
|
|
64
|
-
break;
|
|
65
|
-
}
|
|
66
|
-
}), E = M((s) => {
|
|
67
|
-
s.key === c.Space && s.preventDefault();
|
|
68
|
-
}), [P, p, $] = T(l, (s) => [s.menuState, s.buttonElement, s.itemsElement]), d = P === v.Open;
|
|
69
|
-
Ie(d, { trigger: p, action: G((s) => {
|
|
70
|
-
if (p != null && p.contains(s.target)) return U.Ignore;
|
|
71
|
-
let n = s.target.closest('[role="menuitem"]:not([data-disabled])');
|
|
72
|
-
return Ke(n) ? U.Select(n) : $ != null && $.contains(s.target) ? U.Ignore : U.Close;
|
|
73
|
-
}, [p, $]), close: G(() => l.send({ type: r.CloseMenu }), []), select: G((s) => s.click(), []) });
|
|
74
|
-
let f = Me((s) => {
|
|
75
|
-
var n;
|
|
76
|
-
u || (P === v.Open ? (Y(() => l.send({ type: r.CloseMenu })), (n = g.current) == null || n.focus({ preventScroll: !0 })) : (s.preventDefault(), l.send({ type: r.OpenMenu, focus: { focus: h.Nothing }, trigger: Z.Pointer })));
|
|
77
|
-
}), { isFocusVisible: y, focusProps: C } = me({ autoFocus: o }), { isHovered: x, hoverProps: R } = de({ isDisabled: u }), { pressed: F, pressProps: L } = ge({ disabled: u }), A = z({ open: P === v.Open, active: F || P === v.Open, disabled: u, hover: x, focus: y, autofocus: o }), _ = re(S(), { ref: t, id: i, type: Se(m, g.current), "aria-haspopup": "menu", "aria-controls": $?.id, "aria-expanded": P === v.Open, disabled: u || void 0, autoFocus: o, onKeyDown: D, onKeyUp: E }, f, C, R, L);
|
|
78
|
-
return w()({ ourProps: _, theirProps: I, slot: A, defaultTag: et, name: "Menu.Button" });
|
|
79
|
-
}
|
|
80
|
-
let ot = "div", st = te.RenderStrategy | te.Static;
|
|
81
|
-
function rt(m, b) {
|
|
82
|
-
let l = K(), { id: a = `headlessui-menu-items-${l}`, anchor: i, portal: u = !1, modal: o = !0, transition: I = !1, ...g } = m, S = Ae(i), t = j("Menu.Items"), [D, E] = xe(S), P = Le(), [p, $] = fe(null), d = Q(b, S ? D : null, M((e) => t.send({ type: r.SetItemsElement, element: e })), $), [f, y] = T(t, (e) => [e.menuState, e.buttonElement]), C = X(y), x = X(p);
|
|
83
|
-
S && (u = !0);
|
|
84
|
-
let R = He(), [F, L] = De(I, p, R !== null ? (R & V.Open) === V.Open : f === v.Open);
|
|
85
|
-
$e(F, y, () => {
|
|
86
|
-
t.send({ type: r.CloseMenu });
|
|
87
|
-
});
|
|
88
|
-
let A = T(t, (e) => e.__demoMode), _ = A ? !1 : o && f === v.Open;
|
|
89
|
-
Ee(_, x);
|
|
90
|
-
let s = A ? !1 : o && f === v.Open;
|
|
91
|
-
Pe(s, { allowed: G(() => [y, p], [y, p]) });
|
|
92
|
-
let n = T(t, t.selectors.didButtonMove) ? !1 : F;
|
|
93
|
-
ve(() => {
|
|
94
|
-
let e = p;
|
|
95
|
-
e && f === v.Open && (Qe(e) || e.focus({ preventScroll: !0 }));
|
|
96
|
-
}, [f, p]), ke(f === v.Open, { container: p, accept(e) {
|
|
97
|
-
return e.getAttribute("role") === "menuitem" ? NodeFilter.FILTER_REJECT : e.hasAttribute("role") ? NodeFilter.FILTER_SKIP : NodeFilter.FILTER_ACCEPT;
|
|
98
|
-
}, walk(e) {
|
|
99
|
-
e.setAttribute("role", "none");
|
|
100
|
-
} });
|
|
101
|
-
let H = be(), ae = M((e) => {
|
|
102
|
-
var N, q, J;
|
|
103
|
-
switch (H.dispose(), e.key) {
|
|
104
|
-
case c.Space:
|
|
105
|
-
if (t.state.searchQuery !== "") return e.preventDefault(), e.stopPropagation(), t.send({ type: r.Search, value: e.key });
|
|
106
|
-
case c.Enter:
|
|
107
|
-
if (e.preventDefault(), e.stopPropagation(), t.state.activeItemIndex !== null) {
|
|
108
|
-
let { dataRef: ce } = t.state.items[t.state.activeItemIndex];
|
|
109
|
-
(q = (N = ce.current) == null ? void 0 : N.domRef.current) == null || q.click();
|
|
110
|
-
}
|
|
111
|
-
t.send({ type: r.CloseMenu }), se(t.state.buttonElement);
|
|
112
|
-
break;
|
|
113
|
-
case c.ArrowDown:
|
|
114
|
-
return e.preventDefault(), e.stopPropagation(), t.send({ type: r.GoToItem, focus: h.Next });
|
|
115
|
-
case c.ArrowUp:
|
|
116
|
-
return e.preventDefault(), e.stopPropagation(), t.send({ type: r.GoToItem, focus: h.Previous });
|
|
117
|
-
case c.Home:
|
|
118
|
-
case c.PageUp:
|
|
119
|
-
return e.preventDefault(), e.stopPropagation(), t.send({ type: r.GoToItem, focus: h.First });
|
|
120
|
-
case c.End:
|
|
121
|
-
case c.PageDown:
|
|
122
|
-
return e.preventDefault(), e.stopPropagation(), t.send({ type: r.GoToItem, focus: h.Last });
|
|
123
|
-
case c.Escape:
|
|
124
|
-
e.preventDefault(), e.stopPropagation(), Y(() => t.send({ type: r.CloseMenu })), (J = t.state.buttonElement) == null || J.focus({ preventScroll: !0 });
|
|
125
|
-
break;
|
|
126
|
-
case c.Tab:
|
|
127
|
-
e.preventDefault(), e.stopPropagation(), Y(() => t.send({ type: r.CloseMenu })), Ve(t.state.buttonElement, e.shiftKey ? ee.Previous : ee.Next);
|
|
128
|
-
break;
|
|
129
|
-
default:
|
|
130
|
-
e.key.length === 1 && (t.send({ type: r.Search, value: e.key }), H.setTimeout(() => t.send({ type: r.ClearSearch }), 350));
|
|
131
|
-
break;
|
|
132
|
-
}
|
|
133
|
-
}), ue = M((e) => {
|
|
134
|
-
e.key === c.Space && e.preventDefault();
|
|
135
|
-
}), le = z({ open: f === v.Open }), ie = re(S ? P() : {}, { "aria-activedescendant": T(t, t.selectors.activeDescendantId), "aria-labelledby": T(t, (e) => {
|
|
136
|
-
var N;
|
|
137
|
-
return (N = e.buttonElement) == null ? void 0 : N.id;
|
|
138
|
-
}), id: a, onKeyDown: ae, onKeyUp: ue, role: "menu", tabIndex: f === v.Open ? 0 : void 0, ref: d, style: { ...g.style, ...E, "--button-width": ye(F, y, !0).width }, ...Oe(L) }), pe = w();
|
|
139
|
-
return O.createElement(Ze, { enabled: u ? m.static || F : !1, ownerDocument: C }, pe({ ourProps: ie, theirProps: g, slot: le, defaultTag: ot, features: st, visible: n, name: "Menu.Items" }));
|
|
140
|
-
}
|
|
141
|
-
let nt = oe;
|
|
142
|
-
function at(m, b) {
|
|
143
|
-
let l = K(), { id: a = `headlessui-menu-item-${l}`, disabled: i = !1, ...u } = m, o = j("Menu.Item"), I = T(o, (n) => o.selectors.isActive(n, a)), g = W(null), S = Q(b, g), t = T(o, (n) => o.selectors.shouldScrollIntoView(n, a));
|
|
144
|
-
B(() => {
|
|
145
|
-
if (t) return Ge().requestAnimationFrame(() => {
|
|
146
|
-
var n, H;
|
|
147
|
-
(H = (n = g.current) == null ? void 0 : n.scrollIntoView) == null || H.call(n, { block: "nearest" });
|
|
148
|
-
});
|
|
149
|
-
}, [t, g]);
|
|
150
|
-
let D = Te(g), E = W({ disabled: i, domRef: g, get textValue() {
|
|
151
|
-
return D();
|
|
152
|
-
} });
|
|
153
|
-
B(() => {
|
|
154
|
-
E.current.disabled = i;
|
|
155
|
-
}, [E, i]), B(() => (o.actions.registerItem(a, E), () => o.actions.unregisterItem(a)), [E, a]);
|
|
156
|
-
let P = M(() => {
|
|
157
|
-
o.send({ type: r.CloseMenu });
|
|
158
|
-
}), p = M((n) => {
|
|
159
|
-
if (i) return n.preventDefault();
|
|
160
|
-
o.send({ type: r.CloseMenu }), se(o.state.buttonElement);
|
|
161
|
-
}), $ = M(() => {
|
|
162
|
-
if (i) return o.send({ type: r.GoToItem, focus: h.Nothing });
|
|
163
|
-
o.send({ type: r.GoToItem, focus: h.Specific, id: a });
|
|
164
|
-
}), d = Fe(), f = M((n) => d.update(n)), y = M((n) => {
|
|
165
|
-
d.wasMoved(n) && (i || I || o.send({ type: r.GoToItem, focus: h.Specific, id: a, trigger: Z.Pointer }));
|
|
166
|
-
}), C = M((n) => {
|
|
167
|
-
d.wasMoved(n) && (i || I && o.state.activationTrigger === Z.Pointer && o.send({ type: r.GoToItem, focus: h.Nothing }));
|
|
168
|
-
}), [x, R] = ne(), [F, L] = We(), A = z({ active: I, focus: I, disabled: i, close: P }), _ = { id: a, ref: S, role: "menuitem", tabIndex: i === !0 ? void 0 : -1, "aria-disabled": i === !0 ? !0 : void 0, "aria-labelledby": x, "aria-describedby": F, disabled: void 0, onClick: p, onFocus: $, onPointerEnter: f, onMouseEnter: f, onPointerMove: y, onMouseMove: y, onPointerLeave: C, onMouseLeave: C }, s = w();
|
|
169
|
-
return O.createElement(R, null, O.createElement(L, null, s({ ourProps: _, theirProps: u, slot: A, defaultTag: nt, name: "Menu.Item" })));
|
|
170
|
-
}
|
|
171
|
-
let ut = "div";
|
|
172
|
-
function lt(m, b) {
|
|
173
|
-
let [l, a] = ne(), i = m, u = { ref: b, "aria-labelledby": l, role: "group" }, o = w();
|
|
174
|
-
return O.createElement(a, null, o({ ourProps: u, theirProps: i, slot: {}, defaultTag: ut, name: "Menu.Section" }));
|
|
175
|
-
}
|
|
176
|
-
let it = "header";
|
|
177
|
-
function pt(m, b) {
|
|
178
|
-
let l = K(), { id: a = `headlessui-menu-heading-${l}`, ...i } = m, u = Ye();
|
|
179
|
-
B(() => u.register(a), [a, u.register]);
|
|
180
|
-
let o = { id: a, ref: b, role: "presentation", ...u.props };
|
|
181
|
-
return w()({ ourProps: o, theirProps: i, slot: {}, defaultTag: it, name: "Menu.Heading" });
|
|
182
|
-
}
|
|
183
|
-
let ct = "div";
|
|
184
|
-
function mt(m, b) {
|
|
185
|
-
let l = m, a = { ref: b, role: "separator" };
|
|
186
|
-
return w()({ ourProps: a, theirProps: l, slot: {}, defaultTag: ct, name: "Menu.Separator" });
|
|
187
|
-
}
|
|
188
|
-
let dt = k(Xe), ft = k(tt), vt = k(rt), gt = k(at), bt = k(lt), yt = k(pt), Mt = k(mt), ao = Object.assign(dt, { Button: ft, Items: vt, Item: gt, Section: bt, Heading: yt, Separator: Mt });
|
|
189
|
-
export {
|
|
190
|
-
ao as Menu,
|
|
191
|
-
ft as MenuButton,
|
|
192
|
-
yt as MenuHeading,
|
|
193
|
-
gt as MenuItem,
|
|
194
|
-
vt as MenuItems,
|
|
195
|
-
bt as MenuSection,
|
|
196
|
-
Mt as MenuSeparator
|
|
197
|
-
};
|