@apostel/bedrock 0.1.1 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +25 -20
- package/dist/accordion/controlled-root.d.ts +5 -2
- package/dist/accordion/controlled-root.d.ts.map +1 -1
- package/dist/accordion/controlled-root.js +5 -2
- package/dist/accordion/controlled-root.js.map +1 -1
- package/dist/capabilities.d.ts +15 -4
- package/dist/capabilities.d.ts.map +1 -1
- package/dist/capabilities.js +17 -4
- package/dist/capabilities.js.map +1 -1
- package/dist/collapsible/controlled-root.d.ts +10 -7
- package/dist/collapsible/controlled-root.d.ts.map +1 -1
- package/dist/collapsible/controlled-root.js +10 -7
- package/dist/collapsible/controlled-root.js.map +1 -1
- package/dist/collapsible/root.d.ts +2 -2
- package/dist/collapsible/root.js +2 -2
- package/dist/collapsible/shared.d.ts +3 -2
- package/dist/collapsible/shared.d.ts.map +1 -1
- package/dist/collapsible/shared.js +3 -2
- package/dist/collapsible/shared.js.map +1 -1
- package/dist/create-controlled-root.d.ts +12 -4
- package/dist/create-controlled-root.d.ts.map +1 -1
- package/dist/create-controlled-root.js +15 -5
- package/dist/create-controlled-root.js.map +1 -1
- package/dist/hover-card/controlled-root.d.ts.map +1 -1
- package/dist/hover-card/controlled-root.js +2 -0
- package/dist/hover-card/controlled-root.js.map +1 -1
- package/dist/hover-card/root.d.ts.map +1 -1
- package/dist/hover-card/root.js +2 -0
- package/dist/hover-card/root.js.map +1 -1
- package/dist/interest.d.ts +18 -9
- package/dist/interest.d.ts.map +1 -1
- package/dist/interest.js +242 -32
- package/dist/interest.js.map +1 -1
- package/dist/popover/controlled-root.d.ts +1 -1
- package/dist/popover/controlled-root.d.ts.map +1 -1
- package/dist/popover/controlled-root.js +3 -2
- package/dist/popover/controlled-root.js.map +1 -1
- package/dist/popover/root.d.ts +1 -1
- package/dist/popover/root.d.ts.map +1 -1
- package/dist/popover/root.js +3 -2
- package/dist/popover/root.js.map +1 -1
- package/dist/popover/shared.d.ts +12 -0
- package/dist/popover/shared.d.ts.map +1 -1
- package/dist/popover/shared.js +16 -0
- package/dist/popover/shared.js.map +1 -1
- package/dist/tooltip/controlled-root.d.ts.map +1 -1
- package/dist/tooltip/controlled-root.js +2 -0
- package/dist/tooltip/controlled-root.js.map +1 -1
- package/dist/tooltip/parts.d.ts +8 -1
- package/dist/tooltip/parts.d.ts.map +1 -1
- package/dist/tooltip/parts.js +35 -1
- package/dist/tooltip/parts.js.map +1 -1
- package/dist/tooltip/root.d.ts.map +1 -1
- package/dist/tooltip/root.js +2 -0
- package/dist/tooltip/root.js.map +1 -1
- package/dist/tooltip/shared.d.ts +2 -1
- package/dist/tooltip/shared.d.ts.map +1 -1
- package/dist/tooltip/shared.js.map +1 -1
- package/dist/tooltip/use-controlled-interest-root.d.ts +2 -0
- package/dist/tooltip/use-controlled-interest-root.d.ts.map +1 -1
- package/dist/tooltip/use-controlled-interest-root.js +4 -2
- package/dist/tooltip/use-controlled-interest-root.js.map +1 -1
- package/dist/tooltip/use-interest-root.d.ts +2 -0
- package/dist/tooltip/use-interest-root.d.ts.map +1 -1
- package/dist/tooltip/use-interest-root.js +5 -2
- package/dist/tooltip/use-interest-root.js.map +1 -1
- package/package.json +15 -12
- package/skills/migrate-to-bedrock/SKILL.md +11 -3
package/dist/interest.js
CHANGED
|
@@ -1,17 +1,83 @@
|
|
|
1
1
|
import { useCallback, useEffect, useRef } from 'react';
|
|
2
2
|
import { supportsInterestInvokers } from './capabilities.js';
|
|
3
3
|
/**
|
|
4
|
-
*
|
|
5
|
-
* something we can rely on.
|
|
4
|
+
* How long a finger rests before the panel opens, in milliseconds.
|
|
6
5
|
*
|
|
7
|
-
*
|
|
8
|
-
*
|
|
6
|
+
* Two numbers, because the wait is not for the gesture — it is for the tap the
|
|
7
|
+
* gesture might have been. An info icon does nothing when you tap it, so there
|
|
8
|
+
* is nothing to protect and the only thing left to wait for is long enough to
|
|
9
|
+
* tell a hold from the start of a scroll. A button or a link does something,
|
|
10
|
+
* and opening before a tap has had time to be a tap would eat it.
|
|
11
|
+
*
|
|
12
|
+
* Neither is `showDelay`. A press is a different gesture from a pointer coming
|
|
13
|
+
* to rest, and a consumer tuning one has said nothing about the other.
|
|
14
|
+
*/
|
|
15
|
+
const PRESS_WITHOUT_A_TAP = 150;
|
|
16
|
+
const PRESS_PAST_A_TAP = 250;
|
|
17
|
+
/** How far a finger may drift and still be pressing rather than scrolling. */
|
|
18
|
+
const PRESS_SLOP = 10;
|
|
19
|
+
/** Long enough to catch the click a lift produces, short enough to catch only that one. */
|
|
20
|
+
const CLICK_GRACE = 400;
|
|
21
|
+
/**
|
|
22
|
+
* Whether the focus is one a tooltip should answer.
|
|
23
|
+
*
|
|
24
|
+
* Tapping a control focuses it on Android, and a tooltip that appears on tap is
|
|
25
|
+
* a popover with extra steps. `:focus-visible` is the platform's own answer to
|
|
26
|
+
* "did this focus come from a pointer", so we ask it rather than tracking the
|
|
27
|
+
* last input type ourselves.
|
|
28
|
+
*/
|
|
29
|
+
function focusIsVisible(node) {
|
|
30
|
+
try {
|
|
31
|
+
return node.matches(':focus-visible');
|
|
32
|
+
}
|
|
33
|
+
catch {
|
|
34
|
+
// An engine that does not know the selector throws. Showing on every focus
|
|
35
|
+
// is the older behaviour and the safer one: an unwanted tooltip beats a
|
|
36
|
+
// keyboard user who can never see one.
|
|
37
|
+
return true;
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
/**
|
|
41
|
+
* Whether tapping this trigger would do anything.
|
|
42
|
+
*
|
|
43
|
+
* Only half the answer is in the DOM — a React handler is not an attribute — so
|
|
44
|
+
* the trigger part passes what it knows and this covers the rest: a link, and a
|
|
45
|
+
* button that submits the form it is in.
|
|
46
|
+
*/
|
|
47
|
+
function activatesOnTap(node) {
|
|
48
|
+
if (node.tagName === 'A')
|
|
49
|
+
return node.hasAttribute('href');
|
|
50
|
+
return (node.tagName === 'BUTTON' &&
|
|
51
|
+
node.type !== 'button' &&
|
|
52
|
+
node.closest('form') !== null);
|
|
53
|
+
}
|
|
54
|
+
/**
|
|
55
|
+
* A touch pointer reports enter on touchdown and leave on lift, so the hover
|
|
56
|
+
* path would make every tap a half-open tooltip. Touch has its own gesture; the
|
|
57
|
+
* hover handlers are for the pointers that actually hover.
|
|
58
|
+
*/
|
|
59
|
+
function hovering(event) {
|
|
60
|
+
return event.pointerType !== 'touch';
|
|
61
|
+
}
|
|
62
|
+
/**
|
|
63
|
+
* Hover, focus and press intent, in JavaScript, for as long as `interestfor` is
|
|
64
|
+
* not something we can rely on.
|
|
65
|
+
*
|
|
66
|
+
* This is the fallback the compat table calls "replaceable": where the attribute
|
|
67
|
+
* is supported, `useInterest` stops opening anything and the same props become
|
|
9
68
|
* declarative. Nothing above it changes — which is the entire reason
|
|
10
69
|
* `delayDuration` is not called `interest-show-delay`.
|
|
11
70
|
*
|
|
12
|
-
*
|
|
13
|
-
*
|
|
14
|
-
*
|
|
71
|
+
* One thing stays attached either way. A long press ends in a click, and a
|
|
72
|
+
* browser answering the press itself still lets that click through, so the
|
|
73
|
+
* gesture previews the link *and* follows it. Tracking the press costs four
|
|
74
|
+
* listeners and an early return; leaving it to the platform costs a navigation
|
|
75
|
+
* nobody asked for.
|
|
76
|
+
*
|
|
77
|
+
* Deliberately not a general hover library: it does the gestures the pattern
|
|
78
|
+
* needs — pointer in, pointer out, focus, blur, and the long press that stands
|
|
79
|
+
* in for all four on a touch screen — and leaves dismissal to the popover,
|
|
80
|
+
* which already handles Escape and light dismiss.
|
|
15
81
|
*
|
|
16
82
|
* Listeners are attached when a node registers, not from an effect that runs
|
|
17
83
|
* each render. That distinction is load-bearing: opening the card is itself a
|
|
@@ -19,22 +85,39 @@ import { supportsInterestInvokers } from './capabilities.js';
|
|
|
19
85
|
* the teardown and the rebuild — which is exactly when the pointer is moving
|
|
20
86
|
* from the trigger onto the content.
|
|
21
87
|
*/
|
|
22
|
-
export function useInterest({ showDelay, hideDelay, hoverableContent }) {
|
|
88
|
+
export function useInterest({ showDelay, hideDelay, hoverableContent, pressHolds, }) {
|
|
23
89
|
const triggerRef = useRef(null);
|
|
24
90
|
const contentRef = useRef(null);
|
|
25
91
|
const timer = useRef(0);
|
|
92
|
+
const pressTimer = useRef(0);
|
|
93
|
+
const clickTimer = useRef(0);
|
|
94
|
+
// Null between gestures. `held` flips once our own press has lasted long
|
|
95
|
+
// enough to have opened something, which is what separates a press from a
|
|
96
|
+
// tap; `openAtDown` is what tells a press that opened the panel from a tap on
|
|
97
|
+
// a trigger whose panel was already showing.
|
|
98
|
+
const press = useRef(null);
|
|
26
99
|
// Read at call time, so changing a delay never means rebinding anything.
|
|
27
|
-
const options = useRef({ showDelay, hideDelay, hoverableContent });
|
|
28
|
-
options.current = { showDelay, hideDelay, hoverableContent };
|
|
100
|
+
const options = useRef({ showDelay, hideDelay, hoverableContent, pressHolds });
|
|
101
|
+
options.current = { showDelay, hideDelay, hoverableContent, pressHolds };
|
|
102
|
+
// What the trigger part knows and the DOM does not: whether a tap has a
|
|
103
|
+
// handler to reach. Set on every registration, read when a press begins.
|
|
104
|
+
const triggerActivates = useRef(false);
|
|
29
105
|
const clear = useCallback(() => window.clearTimeout(timer.current), []);
|
|
106
|
+
const isOpen = useCallback(() => contentRef.current?.matches(':popover-open') === true, []);
|
|
107
|
+
const reveal = useCallback(() => {
|
|
108
|
+
const content = contentRef.current;
|
|
109
|
+
if (content && !isOpen())
|
|
110
|
+
content.showPopover();
|
|
111
|
+
}, [isOpen]);
|
|
112
|
+
/** Now, not after `hideDelay`: a gesture that ended has nothing to wait for. */
|
|
113
|
+
const conceal = useCallback(() => {
|
|
114
|
+
if (isOpen())
|
|
115
|
+
contentRef.current?.hidePopover();
|
|
116
|
+
}, [isOpen]);
|
|
30
117
|
const show = useCallback(() => {
|
|
31
118
|
clear();
|
|
32
|
-
timer.current = window.setTimeout(
|
|
33
|
-
|
|
34
|
-
if (content && !content.matches(':popover-open'))
|
|
35
|
-
content.showPopover();
|
|
36
|
-
}, options.current.showDelay);
|
|
37
|
-
}, [clear]);
|
|
119
|
+
timer.current = window.setTimeout(reveal, options.current.showDelay);
|
|
120
|
+
}, [clear, reveal]);
|
|
38
121
|
const hide = useCallback(() => {
|
|
39
122
|
clear();
|
|
40
123
|
timer.current = window.setTimeout(() => {
|
|
@@ -43,32 +126,155 @@ export function useInterest({ showDelay, hideDelay, hoverableContent }) {
|
|
|
43
126
|
content.hidePopover();
|
|
44
127
|
}, options.current.hideDelay);
|
|
45
128
|
}, [clear]);
|
|
46
|
-
const
|
|
47
|
-
if (
|
|
129
|
+
const enter = useCallback((event) => {
|
|
130
|
+
if (hovering(event))
|
|
131
|
+
show();
|
|
132
|
+
}, [show]);
|
|
133
|
+
const leave = useCallback((event) => {
|
|
134
|
+
if (hovering(event))
|
|
135
|
+
hide();
|
|
136
|
+
}, [hide]);
|
|
137
|
+
const focus = useCallback((event) => {
|
|
138
|
+
if (focusIsVisible(event.currentTarget))
|
|
139
|
+
show();
|
|
140
|
+
}, [show]);
|
|
141
|
+
const keepOpen = useCallback((event) => {
|
|
142
|
+
if (hovering(event) && options.current.hoverableContent)
|
|
48
143
|
clear();
|
|
49
144
|
}, [clear]);
|
|
50
|
-
const leaveContent = useCallback(() => {
|
|
51
|
-
if (options.current.hoverableContent)
|
|
145
|
+
const leaveContent = useCallback((event) => {
|
|
146
|
+
if (hovering(event) && options.current.hoverableContent)
|
|
52
147
|
hide();
|
|
53
148
|
}, [hide]);
|
|
149
|
+
const suppressClick = useCallback((event) => {
|
|
150
|
+
event.preventDefault();
|
|
151
|
+
event.stopPropagation();
|
|
152
|
+
}, []);
|
|
153
|
+
/**
|
|
154
|
+
* The lift of a press produces a click, and on an `<a>` that click is a
|
|
155
|
+
* navigation. A press asked to see more about the control, not to activate
|
|
156
|
+
* it, so exactly one click is swallowed — with a deadline, so a press that
|
|
157
|
+
* ends without one does not leave a trap for the next real click.
|
|
158
|
+
*/
|
|
159
|
+
const swallowClick = useCallback((node) => {
|
|
160
|
+
node.addEventListener('click', suppressClick, { capture: true, once: true });
|
|
161
|
+
window.clearTimeout(clickTimer.current);
|
|
162
|
+
clickTimer.current = window.setTimeout(() => node.removeEventListener('click', suppressClick, true), CLICK_GRACE);
|
|
163
|
+
}, [suppressClick]);
|
|
164
|
+
/**
|
|
165
|
+
* A long press is how a touch screen asks to see something without
|
|
166
|
+
* activating it — the gesture iOS uses for its own link previews, and the one
|
|
167
|
+
* `interestfor` answers where the platform runs intent itself. The press is
|
|
168
|
+
* tracked either way; only the opening is ours.
|
|
169
|
+
*
|
|
170
|
+
* While ours runs, selection is off. Otherwise the press is a text selection
|
|
171
|
+
* on Android and a selection magnifier on iOS before it is ever ours. It is
|
|
172
|
+
* turned off for the gesture rather than for the life of the trigger, because
|
|
173
|
+
* a hover card trigger is usually a link in a paragraph and permanently
|
|
174
|
+
* unselectable text drops out of the selection around it.
|
|
175
|
+
*/
|
|
176
|
+
const startPress = useCallback((event) => {
|
|
177
|
+
const pointer = event;
|
|
178
|
+
if (pointer.pointerType !== 'touch')
|
|
179
|
+
return;
|
|
180
|
+
const node = event.currentTarget;
|
|
181
|
+
window.clearTimeout(pressTimer.current);
|
|
182
|
+
press.current = { x: pointer.clientX, y: pointer.clientY, held: false, openAtDown: isOpen() };
|
|
183
|
+
if (supportsInterestInvokers())
|
|
184
|
+
return;
|
|
185
|
+
node.style.setProperty('user-select', 'none');
|
|
186
|
+
node.style.setProperty('-webkit-user-select', 'none');
|
|
187
|
+
const protecting = triggerActivates.current || activatesOnTap(node);
|
|
188
|
+
pressTimer.current = window.setTimeout(() => {
|
|
189
|
+
if (!press.current)
|
|
190
|
+
return;
|
|
191
|
+
press.current.held = true;
|
|
192
|
+
reveal();
|
|
193
|
+
}, protecting ? PRESS_PAST_A_TAP : PRESS_WITHOUT_A_TAP);
|
|
194
|
+
}, [isOpen, reveal]);
|
|
195
|
+
const endPress = useCallback((node) => {
|
|
196
|
+
window.clearTimeout(pressTimer.current);
|
|
197
|
+
press.current = null;
|
|
198
|
+
node.style.removeProperty('user-select');
|
|
199
|
+
node.style.removeProperty('-webkit-user-select');
|
|
200
|
+
}, []);
|
|
201
|
+
const movePress = useCallback((event) => {
|
|
202
|
+
const state = press.current;
|
|
203
|
+
if (!state || state.held)
|
|
204
|
+
return;
|
|
205
|
+
const pointer = event;
|
|
206
|
+
const drifted = Math.abs(pointer.clientX - state.x) > PRESS_SLOP ||
|
|
207
|
+
Math.abs(pointer.clientY - state.y) > PRESS_SLOP;
|
|
208
|
+
// A finger that has moved that far is scrolling, and a page that opens
|
|
209
|
+
// tooltips while you scroll past them is unusable.
|
|
210
|
+
if (drifted)
|
|
211
|
+
endPress(event.currentTarget);
|
|
212
|
+
}, [endPress]);
|
|
213
|
+
const liftPress = useCallback((event) => {
|
|
214
|
+
const state = press.current;
|
|
215
|
+
const node = event.currentTarget;
|
|
216
|
+
if (!state)
|
|
217
|
+
return;
|
|
218
|
+
endPress(node);
|
|
219
|
+
// A tooltip is a label held up while you press, so it goes when you let
|
|
220
|
+
// go — and closing it here rather than leaving it to light dismiss is
|
|
221
|
+
// what makes that true on an engine whose light dismiss never runs.
|
|
222
|
+
//
|
|
223
|
+
// A card is somewhere to go, so it stays. That takes work: the lift is a
|
|
224
|
+
// pointerup outside every open popover, and the popover the press opened
|
|
225
|
+
// did not exist when the finger went down, so as far as light dismiss is
|
|
226
|
+
// concerned it was never part of this gesture and it closes. Re-assert in
|
|
227
|
+
// the same task the dismissal ran in — nothing is painted between the
|
|
228
|
+
// two, so the card the press opened simply stays.
|
|
229
|
+
if (state.held) {
|
|
230
|
+
if (options.current.pressHolds)
|
|
231
|
+
reveal();
|
|
232
|
+
else
|
|
233
|
+
conceal();
|
|
234
|
+
}
|
|
235
|
+
// Whoever opened it, the lift still produces a click, and on an `<a>` that
|
|
236
|
+
// click is a navigation. A browser answering the hold itself lets it
|
|
237
|
+
// through, so a long press there previews *and* follows the link; only
|
|
238
|
+
// that second half is ours to stop. A panel that was already showing when
|
|
239
|
+
// the finger went down is not this gesture's, and the tap under it stands.
|
|
240
|
+
if (state.held || (!state.openAtDown && isOpen()))
|
|
241
|
+
swallowClick(node);
|
|
242
|
+
}, [conceal, endPress, isOpen, reveal, swallowClick]);
|
|
243
|
+
const cancelPress = useCallback((event) => endPress(event.currentTarget), [endPress]);
|
|
244
|
+
// Android offers its own long-press menu on the same gesture, and whichever
|
|
245
|
+
// of the two the user gets should not be a race. iOS is asked in CSS instead,
|
|
246
|
+
// by the `-webkit-touch-callout` the trigger carries.
|
|
247
|
+
const suppressCallout = useCallback((event) => {
|
|
248
|
+
if (press.current)
|
|
249
|
+
event.preventDefault();
|
|
250
|
+
}, []);
|
|
54
251
|
const bindTrigger = useCallback((node, add) => {
|
|
55
252
|
const method = add ? 'addEventListener' : 'removeEventListener';
|
|
56
|
-
|
|
57
|
-
|
|
253
|
+
// Touch captures its pointer implicitly, so every one of these lands on
|
|
254
|
+
// the trigger for the whole gesture, wherever the finger has gone. They
|
|
255
|
+
// are bound even where the platform runs intent itself, because the click
|
|
256
|
+
// a press ends in is left to us there — see `liftPress`.
|
|
257
|
+
node[method]('pointerdown', startPress);
|
|
258
|
+
node[method]('pointermove', movePress);
|
|
259
|
+
node[method]('pointerup', liftPress);
|
|
260
|
+
node[method]('pointercancel', cancelPress);
|
|
261
|
+
if (supportsInterestInvokers())
|
|
262
|
+
return;
|
|
263
|
+
node[method]('pointerenter', enter);
|
|
264
|
+
node[method]('pointerleave', leave);
|
|
58
265
|
// Focus, not focusin: the trigger itself is the control, and a tooltip
|
|
59
266
|
// should not appear because something inside it was focused.
|
|
60
|
-
node[method]('focus',
|
|
267
|
+
node[method]('focus', focus);
|
|
61
268
|
node[method]('blur', hide);
|
|
62
|
-
|
|
269
|
+
node[method]('contextmenu', suppressCallout);
|
|
270
|
+
}, [startPress, movePress, liftPress, cancelPress, enter, leave, focus, hide, suppressCallout]);
|
|
63
271
|
const bindContent = useCallback((node, add) => {
|
|
64
272
|
const method = add ? 'addEventListener' : 'removeEventListener';
|
|
65
273
|
node[method]('pointerenter', keepOpen);
|
|
66
274
|
node[method]('pointerleave', leaveContent);
|
|
67
275
|
}, [keepOpen, leaveContent]);
|
|
68
|
-
const registerTrigger = useCallback((node) => {
|
|
69
|
-
|
|
70
|
-
if (supportsInterestInvokers())
|
|
71
|
-
return;
|
|
276
|
+
const registerTrigger = useCallback((node, activates = false) => {
|
|
277
|
+
triggerActivates.current = activates;
|
|
72
278
|
const previous = triggerRef.current;
|
|
73
279
|
if (previous)
|
|
74
280
|
bindTrigger(previous, false);
|
|
@@ -77,18 +283,22 @@ export function useInterest({ showDelay, hideDelay, hoverableContent }) {
|
|
|
77
283
|
bindTrigger(node, true);
|
|
78
284
|
}, [bindTrigger]);
|
|
79
285
|
const registerInterestContent = useCallback((node) => {
|
|
80
|
-
if (supportsInterestInvokers())
|
|
81
|
-
return;
|
|
82
286
|
const previous = contentRef.current;
|
|
83
287
|
if (previous)
|
|
84
288
|
bindContent(previous, false);
|
|
289
|
+
// Held either way: where the platform runs intent, the lift still has to
|
|
290
|
+
// ask whether this press is the reason the panel is showing.
|
|
85
291
|
contentRef.current = node;
|
|
86
|
-
if (node)
|
|
292
|
+
if (node && !supportsInterestInvokers())
|
|
87
293
|
bindContent(node, true);
|
|
88
294
|
}, [bindContent]);
|
|
89
295
|
// Only unmount. A pending timer outliving the component would call
|
|
90
296
|
// showPopover() on a detached node.
|
|
91
|
-
useEffect(() =>
|
|
297
|
+
useEffect(() => () => {
|
|
298
|
+
window.clearTimeout(timer.current);
|
|
299
|
+
window.clearTimeout(pressTimer.current);
|
|
300
|
+
window.clearTimeout(clickTimer.current);
|
|
301
|
+
}, []);
|
|
92
302
|
return { registerTrigger, registerInterestContent };
|
|
93
303
|
}
|
|
94
304
|
//# sourceMappingURL=interest.js.map
|
package/dist/interest.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interest.js","sourceRoot":"","sources":["../src/interest.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,EAAE,wBAAwB,EAAE,MAAM,gBAAgB,CAAA;
|
|
1
|
+
{"version":3,"file":"interest.js","sourceRoot":"","sources":["../src/interest.ts"],"names":[],"mappings":"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"}
|
|
@@ -10,5 +10,5 @@ export interface ControlledPopoverRootProps extends ControlledRootProps {
|
|
|
10
10
|
* both directions, so refusing an open or a close moves nothing at all — no
|
|
11
11
|
* revert, no frame of visible movement, no `flushSync`.
|
|
12
12
|
*/
|
|
13
|
-
export declare function PopoverRoot({ children, kind, ...props }: ControlledPopoverRootProps): import("react").JSX.Element;
|
|
13
|
+
export declare function PopoverRoot({ children, kind: asked, ...props }: ControlledPopoverRootProps): import("react").JSX.Element;
|
|
14
14
|
//# sourceMappingURL=controlled-root.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"controlled-root.d.ts","sourceRoot":"","sources":["../../src/popover/controlled-root.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAE/C,OAAO,EAAqB,KAAK,mBAAmB,EAAE,MAAM,2BAA2B,CAAA;AACvF,OAAO,
|
|
1
|
+
{"version":3,"file":"controlled-root.d.ts","sourceRoot":"","sources":["../../src/popover/controlled-root.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAE/C,OAAO,EAAqB,KAAK,mBAAmB,EAAE,MAAM,2BAA2B,CAAA;AACvF,OAAO,EAAkD,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AAE3F,MAAM,WAAW,0BAA2B,SAAQ,mBAAmB;IACrE,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,IAAI,CAAC,EAAE,WAAW,CAAA;CACnB;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,IAAI,EAAE,KAAc,EACpB,GAAG,KAAK,EACT,EAAE,0BAA0B,+BAQ5B"}
|
|
@@ -2,15 +2,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { useMemo } from 'react';
|
|
3
3
|
import { anchorName } from '../anchor.js';
|
|
4
4
|
import { useControlledRoot } from '../create-controlled-root.js';
|
|
5
|
-
import { PopoverContext, popoverAdapter } from './shared.js';
|
|
5
|
+
import { usePopoverKind, PopoverContext, popoverAdapter } from './shared.js';
|
|
6
6
|
/**
|
|
7
7
|
* The best case for the veto model. A popover's `beforetoggle` is cancelable in
|
|
8
8
|
* both directions, so refusing an open or a close moves nothing at all — no
|
|
9
9
|
* revert, no frame of visible movement, no `flushSync`.
|
|
10
10
|
*/
|
|
11
|
-
export function PopoverRoot({ children, kind = 'auto', ...props }) {
|
|
11
|
+
export function PopoverRoot({ children, kind: asked = 'auto', ...props }) {
|
|
12
12
|
const context = useControlledRoot(props, popoverAdapter);
|
|
13
13
|
const anchor = useMemo(() => anchorName(context.id), [context.id]);
|
|
14
|
+
const kind = usePopoverKind(asked);
|
|
14
15
|
const value = useMemo(() => ({ ...context, anchor, kind }), [context, anchor, kind]);
|
|
15
16
|
return _jsx(PopoverContext.Provider, { value: value, children: children });
|
|
16
17
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"controlled-root.js","sourceRoot":"","sources":["../../src/popover/controlled-root.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAkB,MAAM,OAAO,CAAA;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AACtC,OAAO,EAAE,iBAAiB,EAA4B,MAAM,2BAA2B,CAAA;AACvF,OAAO,EAAE,cAAc,EAAE,cAAc,EAAoB,MAAM,UAAU,CAAA;
|
|
1
|
+
{"version":3,"file":"controlled-root.js","sourceRoot":"","sources":["../../src/popover/controlled-root.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAkB,MAAM,OAAO,CAAA;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AACtC,OAAO,EAAE,iBAAiB,EAA4B,MAAM,2BAA2B,CAAA;AACvF,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAoB,MAAM,UAAU,CAAA;AAO3F;;;;GAIG;AACH,MAAM,UAAU,WAAW,CAAC,EAC1B,QAAQ,EACR,IAAI,EAAE,KAAK,GAAG,MAAM,EACpB,GAAG,KAAK,EACmB;IAC3B,MAAM,OAAO,GAAG,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,CAAA;IACxD,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAA;IAClE,MAAM,IAAI,GAAG,cAAc,CAAC,KAAK,CAAC,CAAA;IAElC,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,CAAC,CAAA;IAEpF,OAAO,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAA2B,CAAA;AACpF,CAAC"}
|
package/dist/popover/root.d.ts
CHANGED
|
@@ -20,5 +20,5 @@ export interface PopoverRootProps {
|
|
|
20
20
|
* connected, and an imperative `showPopover()` on mount is the sort of thing
|
|
21
21
|
* this library exists to avoid. Use `open` from `/controlled` if you need it.
|
|
22
22
|
*/
|
|
23
|
-
export declare function PopoverRoot({ children, kind, onOpenChange }: PopoverRootProps): import("react").JSX.Element;
|
|
23
|
+
export declare function PopoverRoot({ children, kind: asked, onOpenChange }: PopoverRootProps): import("react").JSX.Element;
|
|
24
24
|
//# sourceMappingURL=root.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../src/popover/root.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAG3E,OAAO,
|
|
1
|
+
{"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../src/popover/root.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAG3E,OAAO,EAAkC,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AAE3E,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,WAAW,CAAA;IAClB,YAAY,CAAC,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAA;CACnC;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAc,EAAE,YAAY,EAAE,EAAE,gBAAgB,+BAiB7F"}
|
package/dist/popover/root.js
CHANGED
|
@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { useCallback, useId, useMemo, useRef } from 'react';
|
|
3
3
|
import { anchorName } from '../anchor.js';
|
|
4
4
|
import { useOpenState } from '../open-state.js';
|
|
5
|
-
import { PopoverContext } from './shared.js';
|
|
5
|
+
import { usePopoverKind, PopoverContext } from './shared.js';
|
|
6
6
|
/**
|
|
7
7
|
* Renders nothing. The trigger is bound to the content by `commandfor`, so
|
|
8
8
|
* opening is the parser's job and there is no state here in the common case.
|
|
@@ -11,9 +11,10 @@ import { PopoverContext } from './shared.js';
|
|
|
11
11
|
* connected, and an imperative `showPopover()` on mount is the sort of thing
|
|
12
12
|
* this library exists to avoid. Use `open` from `/controlled` if you need it.
|
|
13
13
|
*/
|
|
14
|
-
export function PopoverRoot({ children, kind = 'auto', onOpenChange }) {
|
|
14
|
+
export function PopoverRoot({ children, kind: asked = 'auto', onOpenChange }) {
|
|
15
15
|
const id = useId();
|
|
16
16
|
const anchor = useMemo(() => anchorName(id), [id]);
|
|
17
|
+
const kind = usePopoverKind(asked);
|
|
17
18
|
const changeRef = useRef(onOpenChange);
|
|
18
19
|
changeRef.current = onOpenChange;
|
|
19
20
|
const report = useCallback((next) => changeRef.current?.(next), []);
|
package/dist/popover/root.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"root.js","sourceRoot":"","sources":["../../src/popover/root.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAkB,MAAM,OAAO,CAAA;AAC3E,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAoB,MAAM,UAAU,CAAA;
|
|
1
|
+
{"version":3,"file":"root.js","sourceRoot":"","sources":["../../src/popover/root.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAkB,MAAM,OAAO,CAAA;AAC3E,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,cAAc,EAAoB,MAAM,UAAU,CAAA;AAe3E;;;;;;;GAOG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,GAAG,MAAM,EAAE,YAAY,EAAoB;IAC5F,MAAM,EAAE,GAAG,KAAK,EAAE,CAAA;IAClB,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;IAClD,MAAM,IAAI,GAAG,cAAc,CAAC,KAAK,CAAC,CAAA;IAElC,MAAM,SAAS,GAAG,MAAM,CAAC,YAAY,CAAC,CAAA;IACtC,SAAS,CAAC,OAAO,GAAG,YAAY,CAAA;IAEhC,MAAM,MAAM,GAAG,WAAW,CAAC,CAAC,IAAa,EAAE,EAAE,CAAC,SAAS,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,CAAA;IAC5E,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,YAAY,CAAC,MAAM,CAAC,CAAA;IAE9C,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC,EAC5D,CAAC,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,CAAC,CAClC,CAAA;IAED,OAAO,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,OAAO,YAAG,QAAQ,GAA2B,CAAA;AACtF,CAAC"}
|
package/dist/popover/shared.d.ts
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
import type { OpenStateAdapter, RootContextValue } from '../types.js';
|
|
2
2
|
export type PopoverKind = 'auto' | 'manual' | 'hint';
|
|
3
|
+
/**
|
|
4
|
+
* The kind the browser will actually honour.
|
|
5
|
+
*
|
|
6
|
+
* `popover` is an enumerated attribute whose invalid-value default is
|
|
7
|
+
* **manual**, so `hint` on an engine that has never heard of it does not
|
|
8
|
+
* degrade to `auto` — it produces a popover that neither light dismiss nor
|
|
9
|
+
* Escape reaches, which on a phone is a tooltip you cannot get rid of. Asking
|
|
10
|
+
* first is what makes the documented fallback the real one.
|
|
11
|
+
*
|
|
12
|
+
* Resolved in the roots, so no part ever branches on it.
|
|
13
|
+
*/
|
|
14
|
+
export declare function usePopoverKind<Kind extends PopoverKind>(kind: Kind): Kind | 'auto';
|
|
3
15
|
export interface PopoverContextValue extends RootContextValue {
|
|
4
16
|
/** The `anchor-name` this instance owns, shared by trigger and content. */
|
|
5
17
|
anchor: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../src/popover/shared.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../src/popover/shared.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAElE,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAA;AAEpD;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,IAAI,SAAS,WAAW,EAAE,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,MAAM,CAGlF;AAED,MAAM,WAAW,mBAAoB,SAAQ,gBAAgB;IAC3D,2EAA2E;IAC3E,MAAM,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,WAAW,CAAA;CAClB;AAED,eAAO,MAAM,cAAc,qDAAkD,CAAA;AAE7E,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,GAAG,mBAAmB,CAInE;AAED;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,EAAE,gBAI5B,CAAA;AAED,wBAAgB,iBAAiB;;;EAGhC"}
|
package/dist/popover/shared.js
CHANGED
|
@@ -1,4 +1,20 @@
|
|
|
1
1
|
import { createContext, useContext } from 'react';
|
|
2
|
+
import { useSupportsHintPopovers } from '../capabilities.js';
|
|
3
|
+
/**
|
|
4
|
+
* The kind the browser will actually honour.
|
|
5
|
+
*
|
|
6
|
+
* `popover` is an enumerated attribute whose invalid-value default is
|
|
7
|
+
* **manual**, so `hint` on an engine that has never heard of it does not
|
|
8
|
+
* degrade to `auto` — it produces a popover that neither light dismiss nor
|
|
9
|
+
* Escape reaches, which on a phone is a tooltip you cannot get rid of. Asking
|
|
10
|
+
* first is what makes the documented fallback the real one.
|
|
11
|
+
*
|
|
12
|
+
* Resolved in the roots, so no part ever branches on it.
|
|
13
|
+
*/
|
|
14
|
+
export function usePopoverKind(kind) {
|
|
15
|
+
const hint = useSupportsHintPopovers();
|
|
16
|
+
return kind === 'hint' && !hint ? 'auto' : kind;
|
|
17
|
+
}
|
|
2
18
|
export const PopoverContext = createContext(null);
|
|
3
19
|
export function usePopoverContext(part) {
|
|
4
20
|
const context = useContext(PopoverContext);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared.js","sourceRoot":"","sources":["../../src/popover/shared.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"shared.js","sourceRoot":"","sources":["../../src/popover/shared.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACjD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAA;AAKzD;;;;;;;;;;GAUG;AACH,MAAM,UAAU,cAAc,CAA2B,IAAU;IACjE,MAAM,IAAI,GAAG,uBAAuB,EAAE,CAAA;IACtC,OAAO,IAAI,KAAK,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA;AACjD,CAAC;AAQD,MAAM,CAAC,MAAM,cAAc,GAAG,aAAa,CAA6B,IAAI,CAAC,CAAA;AAE7E,MAAM,UAAU,iBAAiB,CAAC,IAAY;IAC5C,MAAM,OAAO,GAAG,UAAU,CAAC,cAAc,CAAC,CAAA;IAC1C,IAAI,CAAC,OAAO;QAAE,MAAM,IAAI,KAAK,CAAC,aAAa,IAAI,oCAAoC,CAAC,CAAA;IACpF,OAAO,OAAO,CAAA;AAChB,CAAC;AAED;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,cAAc,GAAqB;IAC9C,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC;IAC/C,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;IAClC,KAAK,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;CACpC,CAAA;AAED,MAAM,UAAU,iBAAiB;IAC/B,MAAM,EAAE,EAAE,EAAE,GAAG,iBAAiB,CAAC,mBAAmB,CAAC,CAAA;IACrD,OAAO,EAAE,UAAU,EAAE,EAAE,EAAE,OAAO,EAAE,gBAAgB,EAAW,CAAA;AAC/D,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"controlled-root.d.ts","sourceRoot":"","sources":["../../src/tooltip/controlled-root.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAA;AAIpE,MAAM,WAAW,0BAA2B,SAAQ,mBAAmB;IACrE,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,aAAmB,EACnB,UAAgB,EAChB,GAAG,KAAK,EACT,EAAE,0BAA0B,+
|
|
1
|
+
{"version":3,"file":"controlled-root.d.ts","sourceRoot":"","sources":["../../src/tooltip/controlled-root.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAA;AAIpE,MAAM,WAAW,0BAA2B,SAAQ,mBAAmB;IACrE,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB;AAED,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,aAAmB,EACnB,UAAgB,EAChB,GAAG,KAAK,EACT,EAAE,0BAA0B,+BAa5B"}
|
|
@@ -7,6 +7,8 @@ export function TooltipRoot({ children, delayDuration = 700, closeDelay = 150, .
|
|
|
7
7
|
showDelay: delayDuration,
|
|
8
8
|
hideDelay: closeDelay,
|
|
9
9
|
hoverableContent: false,
|
|
10
|
+
// A tooltip is a peek: it ends when the finger does.
|
|
11
|
+
pressHolds: false,
|
|
10
12
|
kind: 'hint',
|
|
11
13
|
role: 'tooltip',
|
|
12
14
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"controlled-root.js","sourceRoot":"","sources":["../../src/tooltip/controlled-root.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AACzC,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAQ1E,MAAM,UAAU,WAAW,CAAC,EAC1B,QAAQ,EACR,aAAa,GAAG,GAAG,EACnB,UAAU,GAAG,GAAG,EAChB,GAAG,KAAK,EACmB;IAC3B,MAAM,OAAO,GAAG,yBAAyB,CAAC;QACxC,GAAG,KAAK;QACR,SAAS,EAAE,aAAa;QACxB,SAAS,EAAE,UAAU;QACrB,gBAAgB,EAAE,KAAK;QACvB,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,SAAS;KAChB,CAAC,CAAA;IAEF,OAAO,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,OAAO,YAAG,QAAQ,GAA2B,CAAA;AACtF,CAAC"}
|
|
1
|
+
{"version":3,"file":"controlled-root.js","sourceRoot":"","sources":["../../src/tooltip/controlled-root.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AACzC,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAA;AAQ1E,MAAM,UAAU,WAAW,CAAC,EAC1B,QAAQ,EACR,aAAa,GAAG,GAAG,EACnB,UAAU,GAAG,GAAG,EAChB,GAAG,KAAK,EACmB;IAC3B,MAAM,OAAO,GAAG,yBAAyB,CAAC;QACxC,GAAG,KAAK;QACR,SAAS,EAAE,aAAa;QACxB,SAAS,EAAE,UAAU;QACrB,gBAAgB,EAAE,KAAK;QACvB,qDAAqD;QACrD,UAAU,EAAE,KAAK;QACjB,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,SAAS;KAChB,CAAC,CAAA;IAEF,OAAO,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,OAAO,YAAG,QAAQ,GAA2B,CAAA;AACtF,CAAC"}
|
package/dist/tooltip/parts.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type
|
|
1
|
+
import { type ComponentPropsWithRef } from 'react';
|
|
2
2
|
import { type Align, type Side } from '../anchor.js';
|
|
3
3
|
import type { AsChildProps } from '../types.js';
|
|
4
4
|
export interface TooltipTriggerProps extends ComponentPropsWithRef<'button'>, AsChildProps {
|
|
@@ -11,6 +11,13 @@ export interface TooltipTriggerProps extends ComponentPropsWithRef<'button'>, As
|
|
|
11
11
|
* The `interestfor` attribute is emitted only when the platform can act on it.
|
|
12
12
|
* Otherwise the same node is handed to the JavaScript fallback, and nothing
|
|
13
13
|
* about the markup a consumer writes changes either way.
|
|
14
|
+
*
|
|
15
|
+
* The callout suppression goes with the fallback rather than with the trigger:
|
|
16
|
+
* a long press is how a touch screen asks to see more, and on iOS the callout
|
|
17
|
+
* menu — the share sheet on a link, the copy bar on text — takes that gesture
|
|
18
|
+
* first. Where the platform runs intent itself it also owns that conflict, so
|
|
19
|
+
* we leave it alone. Selection is only turned off for the length of a press,
|
|
20
|
+
* in `interest.ts`, so a link in a paragraph still comes with the paragraph.
|
|
14
21
|
*/
|
|
15
22
|
export declare function TooltipTrigger({ asChild, ref, style, ...props }: TooltipTriggerProps): import("react").JSX.Element;
|
|
16
23
|
export interface TooltipContentProps extends ComponentPropsWithRef<'div'>, AsChildProps {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"parts.d.ts","sourceRoot":"","sources":["../../src/tooltip/parts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"parts.d.ts","sourceRoot":"","sources":["../../src/tooltip/parts.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,qBAAqB,EAAoB,MAAM,OAAO,CAAA;AACjG,OAAO,EAAmB,KAAK,KAAK,EAAE,KAAK,IAAI,EAAE,MAAM,WAAW,CAAA;AAIlE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAI5C,MAAM,WAAW,mBAAoB,SAAQ,qBAAqB,CAAC,QAAQ,CAAC,EAAE,YAAY;CAAG;AAsB7F;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,+BA6BpF;AAED,MAAM,WAAW,mBAAoB,SAAQ,qBAAqB,CAAC,KAAK,CAAC,EAAE,YAAY;IACrF,IAAI,CAAC,EAAE,IAAI,CAAA;IACX,KAAK,CAAC,EAAE,KAAK,CAAA;IACb,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B;AAED,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,QAAQ,EACR,IAAY,EACZ,KAAgB,EAChB,UAAc,EACd,eAAsB,EACtB,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,mBAAmB,+BAoBrB"}
|
package/dist/tooltip/parts.js
CHANGED
|
@@ -1,10 +1,31 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { isValidElement, useCallback } from 'react';
|
|
2
3
|
import { placementStyles } from '../anchor.js';
|
|
3
4
|
import { useClientRender } from '../client-render.js';
|
|
4
5
|
import { useComposedRefs } from '../compose-refs.js';
|
|
5
6
|
import { Slot } from '../slot.js';
|
|
6
7
|
import { validateTrigger } from '../validate-trigger.js';
|
|
7
8
|
import { useTooltipContext } from './shared.js';
|
|
9
|
+
/**
|
|
10
|
+
* Whether tapping this trigger would do anything a press has to be careful of.
|
|
11
|
+
*
|
|
12
|
+
* A handler is not an attribute, so the DOM cannot answer this and the ref
|
|
13
|
+
* callback in `interest.ts` cannot either — it only sees links and submit
|
|
14
|
+
* buttons. Here the props are still props: the trigger's own, and under
|
|
15
|
+
* `asChild` the child's, which `Slot` will chain into the same element.
|
|
16
|
+
*
|
|
17
|
+
* Wrong in one direction only, and deliberately: a component that binds its own
|
|
18
|
+
* handler out of sight reads as inert, and gets the shorter press. The cost is
|
|
19
|
+
* a preview where a tap was meant, on a hold already past a tap's length.
|
|
20
|
+
*/
|
|
21
|
+
function activatesOnTap(asChild, props) {
|
|
22
|
+
if (props.onClick)
|
|
23
|
+
return true;
|
|
24
|
+
if (!asChild)
|
|
25
|
+
return false;
|
|
26
|
+
const child = props.children;
|
|
27
|
+
return isValidElement(child) && Boolean(child.props.onClick);
|
|
28
|
+
}
|
|
8
29
|
/**
|
|
9
30
|
* Buttons *and* anchors, unlike every other trigger in this library: an
|
|
10
31
|
* `interestfor` invoker accepts both, and that is exactly what makes a link
|
|
@@ -13,11 +34,24 @@ import { useTooltipContext } from './shared.js';
|
|
|
13
34
|
* The `interestfor` attribute is emitted only when the platform can act on it.
|
|
14
35
|
* Otherwise the same node is handed to the JavaScript fallback, and nothing
|
|
15
36
|
* about the markup a consumer writes changes either way.
|
|
37
|
+
*
|
|
38
|
+
* The callout suppression goes with the fallback rather than with the trigger:
|
|
39
|
+
* a long press is how a touch screen asks to see more, and on iOS the callout
|
|
40
|
+
* menu — the share sheet on a link, the copy bar on text — takes that gesture
|
|
41
|
+
* first. Where the platform runs intent itself it also owns that conflict, so
|
|
42
|
+
* we leave it alone. Selection is only turned off for the length of a press,
|
|
43
|
+
* in `interest.ts`, so a link in a paragraph still comes with the paragraph.
|
|
16
44
|
*/
|
|
17
45
|
export function TooltipTrigger({ asChild, ref, style, ...props }) {
|
|
18
46
|
const { id, anchor, native, registerTrigger } = useTooltipContext('Tooltip.Trigger');
|
|
19
47
|
const Part = asChild ? Slot : 'button';
|
|
20
|
-
|
|
48
|
+
const activates = activatesOnTap(asChild, props);
|
|
49
|
+
const register = useCallback((node) => registerTrigger(node, activates), [registerTrigger, activates]);
|
|
50
|
+
return (_jsx(Part, { ...props, ...(native ? { interestfor: id } : {}), "aria-describedby": id, style: {
|
|
51
|
+
anchorName: anchor,
|
|
52
|
+
...(native ? null : { WebkitTouchCallout: 'none' }),
|
|
53
|
+
...style,
|
|
54
|
+
}, ref: useComposedRefs(ref, register, (node) => validateTrigger(node, 'interest', 'Tooltip.Trigger')), "data-bedrock-tooltip-trigger": "" }));
|
|
21
55
|
}
|
|
22
56
|
export function TooltipContent({ asChild, children, side = 'top', align = 'center', sideOffset = 6, avoidCollisions = true, style, ref, ...props }) {
|
|
23
57
|
const { id, open, anchor, kind, role, registerContent } = useTooltipContext('Tooltip.Content');
|