foldkit-primitives 0.10.2 → 0.12.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.
@@ -1,4 +1,4 @@
1
- import { A as ScrollLock, C as targetOf, D as MoveStarted, E as MoveEnded, M as tabbableWithin, O as Moved, S as Targets, T as Move, _ as boxOf, a as TextEdited, b as TargetHovered, c as DRAG_THRESHOLD, d as DragFact, f as DragPlace, g as PointerDrag, h as DraggedOver, i as TextCommitted, j as FocusScope, k as HideOutside, l as DragCancelled, m as DragZone, n as EditableText, o as TextFact, p as DragStarted, r as TextCancelled, s as textOf, t as EditAsked, u as DragDropped, v as zoneOf, w as Fact, x as TargetPressed, y as TargetFact } from "../editable-text-Dvm-Fuqs.mjs";
1
+ import { A as Moved, C as TargetPressed, D as Move, E as Fact, M as ScrollLock, N as FocusScope, O as MoveEnded, P as tabbableWithin, S as TargetHovered, T as targetOf, _ as HOLD_TO_DRAG_MS, a as TextEdited, b as zoneOf, c as DRAG_THRESHOLD, d as DragFact, f as DragPlace, g as HOLD_SLOP, h as DraggedOver, i as TextCommitted, j as HideOutside, k as MoveStarted, l as DragCancelled, m as DragZone, n as EditableText, o as TextFact, p as DragStarted, r as TextCancelled, s as textOf, t as EditAsked, u as DragDropped, v as PointerDrag, w as Targets, x as TargetFact, y as boxOf } from "../editable-text-1D31qthY.mjs";
2
2
  import { Schema, Stream } from "effect";
3
3
  import * as Mount from "foldkit/mount";
4
4
  import { Url } from "foldkit/url";
@@ -199,5 +199,472 @@ export declare const keepScroll: (options?: KeepScrollOptions) => Stream.Stream<
199
199
  */
200
200
  export declare const pointedLinks: () => Stream.Stream<Url>;
201
201
  //#endregion
202
- export { DRAG_THRESHOLD, DragCancelled, DragDropped, DragFact, DragPlace, DragStarted, DragZone, DraggedOver, EditAsked, EditableText, Fact, FocusScope, HideOutside, Move, MoveEnded, MoveStarted, Moved, PointerDrag, ScrollLock, TargetFact, TargetHovered, TargetPressed, Targets, TextCancelled, TextCommitted, TextEdited, TextFact, boxOf, tabbableWithin, targetOf, textOf, zoneOf };
202
+ //#region src/dom/fluid-hover.d.ts
203
+ /** The custom properties `FluidHover` writes on its container for a highlight named `name`. */
204
+ export declare const fluidHovered: (name: string) => {
205
+ readonly x: `--fk-${string}-x`;
206
+ readonly y: `--fk-${string}-y`;
207
+ readonly w: `--fk-${string}-w`;
208
+ readonly h: `--fk-${string}-h`;
209
+ /** `1` while an item is highlighted, `0` once the pointer and focus have left. */
210
+ readonly shown: `--fk-${string}-shown`;
211
+ /**
212
+ * `0` for the frame the highlight appears in, then `1`: a highlight's
213
+ * movement scales its duration by it, so it appears on its item rather
214
+ * than sliding in from where it last was.
215
+ */
216
+ readonly moving: `--fk-${string}-moving`;
217
+ };
218
+ /**
219
+ * The attribute `FluidHover` sets on its container, to the highlight's name,
220
+ * while it runs: a stylist draws the highlight, and drops each item's own
221
+ * hover, only under it.
222
+ */
223
+ export declare const FLUID_HOVER_ATTRIBUTE = "data-fluid-hover";
224
+ /** The attribute that names, inside an item, the control a press in a gap reaches. */
225
+ export declare const FLUID_PRESS_ATTRIBUTE = "data-fluid-press";
226
+ /** The attribute on the item the highlight is shown on, for what CSS draws beside it. */
227
+ export declare const FLUID_LIT_ATTRIBUTE = "data-fluid-lit";
228
+ declare const Axis: Schema.Literals<readonly ["x", "y", "xy"]>;
229
+ export type FluidAxis = typeof Axis.Type;
230
+ /**
231
+ * One highlight that follows the pointer across a container's items, as a
232
+ * Mount, with no Message and no Model: which item the pointer is nearest is
233
+ * presentation, known to the DOM and to no transition.
234
+ *
235
+ * The item nearest the pointer is the one highlighted, so the pointer in a gap
236
+ * between two items still points at one, and the highlight moves from item to
237
+ * item instead of blinking off between them. On the `y` axis nearness is read
238
+ * vertically (a list), on `x` horizontally (a strip), on `xy` both (a grid). A
239
+ * disabled item (`aria-disabled="true"`, `data-disabled`, `:disabled`) is never
240
+ * highlighted. An item reached by the keyboard (`:focus-visible`) is
241
+ * highlighted too; a touch highlights nothing, since there is no pointer to
242
+ * follow before the press.
243
+ *
244
+ * The container gets `--fk-<name>-x`, `-y`, `-w` and `-h` in pixels, relative
245
+ * to its scroll box like `Measure`'s, and `-shown` and `-moving` (see
246
+ * `fluidHovered`); a view draws the highlight as an absolutely placed child
247
+ * that reads them. With `gapClick`, a click in a gap presses the highlighted
248
+ * item: its descendant marked `data-fluid-press`, or the item itself; with
249
+ * `gapReach` too, only a click within that many pixels of it, as a grid of
250
+ * cards with wide gutters wants (Fluid Functionalism's uses 16). A popup
251
+ * measured before it has a layout box keeps its last complete place, and
252
+ * tries again for three frames, rather than drawing the highlight at zero.
253
+ * The item the highlight is shown on carries `data-fluid-lit`, so a style
254
+ * can change what sits beside it (a table hides the lines around the lit
255
+ * row).
256
+ *
257
+ * `follows` names the item the highlight sits on while the pointer is not
258
+ * moving it: a menu marks the row its keys reach (`[data-active]`), and the
259
+ * highlight goes there whenever that mark moves, so the keys and the pointer
260
+ * light the same one. `from` names the item a fresh highlight grows out of,
261
+ * as a tab's hover leaves the chosen tab. A highlight always fades where it
262
+ * is: once the pointer leaves, nothing should move. It stays only for an item
263
+ * the keyboard reached (`:focus-visible`), not one a click focused.
264
+ */
265
+ export declare const FluidHover: Mount.MountDefinitionWithArgs<"FluidHover", {
266
+ /** The highlight's name, which names the custom properties. */
267
+ name: Schema.String;
268
+ /** The selector of an item within the container. */
269
+ item: Schema.String;
270
+ axis: Schema.Literals<readonly ["x", "y", "xy"]>;
271
+ gapClick: Schema.Boolean;
272
+ /** How far from the highlighted item, in pixels, a click in a gap still presses it. */
273
+ gapReach: Schema.optional<Schema.Number>;
274
+ /** The selector of the item the highlight sits on while the pointer is not moving it. */
275
+ follows: Schema.optional<Schema.String>;
276
+ /** The selector of the item a fresh highlight grows out of. */
277
+ from: Schema.optional<Schema.String>;
278
+ }, never>;
279
+ //#endregion
280
+ //#region src/dom/keyboard-inset.d.ts
281
+ /**
282
+ * The custom property `KeyboardInset` writes on its element: how much of the layout
283
+ * viewport's bottom the on-screen keyboard (or anything else the visual viewport leaves
284
+ * out) covers, in pixels.
285
+ */
286
+ export declare const KEYBOARD_INSET = "--fk-keyboard-inset";
287
+ /**
288
+ * The part of the layout viewport's height below the visual viewport: what the on-screen
289
+ * keyboard covers. Rounded down, since a fraction of a pixel of zoom is no keyboard.
290
+ */
291
+ export declare const keyboardInset: (view: {
292
+ readonly innerHeight: number;
293
+ readonly visualViewport: {
294
+ readonly height: number;
295
+ readonly offsetTop: number;
296
+ } | null;
297
+ }) => number;
298
+ /**
299
+ * The on-screen keyboard's height as a Mount, with no Message and no Model: where it is
300
+ * is the browser's. iOS Safari, and Chrome on Android unless the page asks otherwise,
301
+ * leave the layout viewport as it is when the keyboard opens, so a panel fixed to the
302
+ * screen keeps its height and its bottom under the keys. This writes `KEYBOARD_INSET` on
303
+ * the element, from the visual viewport's size and scroll, for a style to pad or shrink by
304
+ * (`var(--fk-keyboard-inset, 0px)`), and removes it when the element goes. Where there is
305
+ * no visual viewport it writes nothing.
306
+ */
307
+ export declare const KeyboardInset: Mount.MountDefinitionWithArgs<"KeyboardInset", {}, never>;
308
+ //#endregion
309
+ //#region src/dom/scroll-bars.d.ts
310
+ /**
311
+ * The attribute that marks a bar beside a scroller `ScrollBars` runs on, set
312
+ * to the axis it shows: `block` (the up-and-down bar) or `inline`.
313
+ */
314
+ export declare const SCROLL_BAR_ATTRIBUTE = "data-scroll-bar";
315
+ /**
316
+ * The attribute `ScrollBars` sets on its scroller while it draws the bars, so a
317
+ * style hides the native bar only then: with no Mount running (a coarse
318
+ * pointer, a page not yet hydrated) the browser's bar stays.
319
+ */
320
+ export declare const SCROLL_OVERLAID_ATTRIBUTE = "data-scroll-overlaid";
321
+ /**
322
+ * The custom properties `ScrollBars` writes on each bar, in pixels, for its
323
+ * thumb to read: how far along the bar the thumb starts, and how long it is.
324
+ * Physical: an inline bar's offset is from its left edge in either direction.
325
+ */
326
+ export declare const scrollThumb: {
327
+ readonly offset: '--fk-scroll-thumb-offset';
328
+ readonly size: '--fk-scroll-thumb-size';
329
+ };
330
+ /**
331
+ * An overlay scrollbar as a Mount, with no Message and no Model: where a
332
+ * scroller is scrolled is the browser's, and the bar only shows it.
333
+ *
334
+ * It runs on the scroller (or on an element holding it, named by `scroller`,
335
+ * when the scroller carries another Mount) and drives the bars drawn beside
336
+ * it: the scroller's parent's children marked `data-scroll-bar` (`block` or
337
+ * `inline`), which a style lays over the scroller's edge. Each bar gets `data-scrollable` while its axis has
338
+ * more to scroll, `data-shown` while the scroller scrolls or the pointer moves
339
+ * over it, until `idle` milliseconds pass with neither (or longer, while the
340
+ * pointer rests on a bar), and `data-dragging` while its thumb is dragged; and
341
+ * `--fk-scroll-thumb-offset` and `-size` (see `scrollThumb`). Pressing a bar
342
+ * off its thumb moves the thumb there, then drags it.
343
+ *
344
+ * It does nothing where the primary pointer is coarse or cannot hover, decided
345
+ * when it mounts: touch keeps the browser's bar and its physics. Otherwise the
346
+ * scroller gets `data-scroll-overlaid`, for a style to hide the native bar.
347
+ * How the bar looks, rests, widens and fades is the style's.
348
+ */
349
+ export declare const ScrollBars: Mount.MountDefinitionWithArgs<"ScrollBars", {
350
+ /** How long, in milliseconds, the bars stay after the last scroll or move. Default 600. */
351
+ idle: Schema.optional<Schema.Number>;
352
+ /**
353
+ * The scroller, as a selector within the element, when it cannot hold this
354
+ * Mount itself (another component's, with a Mount of its own); looked for
355
+ * once, when it mounts. Default: the element is the scroller.
356
+ */
357
+ scroller: Schema.optional<Schema.String>;
358
+ }, never>;
359
+ //#endregion
360
+ //#region src/dom/swipe.d.ts
361
+ export declare const SwipeStarted: Schema.TaggedStruct<"SwipeStarted", {
362
+ readonly pointerId: Schema.Number;
363
+ readonly pointerType: Schema.String;
364
+ /** The border box of what `measure` names (the element itself by default), as the swipe starts. */
365
+ readonly width: Schema.Number;
366
+ readonly height: Schema.Number;
367
+ }>;
368
+ export type SwipeStarted = typeof SwipeStarted.Type;
369
+ export declare const Swiped: Schema.TaggedStruct<"Swiped", {
370
+ readonly pointerId: Schema.Number;
371
+ /** From where the pointer went down, in CSS pixels. */
372
+ readonly deltaX: Schema.Number;
373
+ readonly deltaY: Schema.Number;
374
+ }>;
375
+ export type Swiped = typeof Swiped.Type;
376
+ export declare const SwipeEnded: Schema.TaggedStruct<"SwipeEnded", {
377
+ readonly pointerId: Schema.Number;
378
+ /** From where the pointer went down to where it came up, in CSS pixels. */
379
+ readonly deltaX: Schema.Number;
380
+ readonly deltaY: Schema.Number;
381
+ /**
382
+ * How fast the pointer was moving as it came up, in pixels a millisecond,
383
+ * over the last `SWIPE_WINDOW` milliseconds: 0 when it rested there first.
384
+ */
385
+ readonly velocityX: Schema.Number;
386
+ readonly velocityY: Schema.Number;
387
+ /** `false` when the pointer was cancelled or capture was lost. */
388
+ readonly completed: Schema.Boolean;
389
+ }>;
390
+ export type SwipeEnded = typeof SwipeEnded.Type;
391
+ export type SwipeFact = SwipeStarted | Swiped | SwipeEnded;
392
+ /** How far back, in milliseconds, the release velocity looks. */
393
+ export declare const SWIPE_WINDOW = 100;
394
+ interface Sample {
395
+ readonly at: number;
396
+ readonly x: number;
397
+ readonly y: number;
398
+ }
399
+ /**
400
+ * The velocity of the samples within `SWIPE_WINDOW` of the last: the way
401
+ * from the oldest of them to the last over the time between. A pointer that
402
+ * came to rest before the last sample has no recent way to measure, so 0.
403
+ */
404
+ export declare const velocityOf: (samples: ReadonlyArray<Sample>) => {
405
+ x: number;
406
+ y: number;
407
+ };
408
+ /**
409
+ * `Move` with the speed of its release, for a gesture that a flick ends
410
+ * (a sheet dragged to dismiss, a card swiped away): a primary-button pointer
411
+ * down captures the pointer, each move reports the delta from where it
412
+ * started, and up reports the last delta with the velocity over the last
413
+ * `SWIPE_WINDOW` milliseconds, by the events' own time stamps. Cancel or
414
+ * lost capture ends it incomplete. The start reports the size of what is
415
+ * moved, so a distance can be read as a share of it. What a delta or a speed
416
+ * means is the parent's `update`. Capture is released with the Mount.
417
+ */
418
+ export declare const Swipe: Mount.MountDefinitionWithArgs<"Swipe", {
419
+ /**
420
+ * The nearest ancestor matching this selector is measured as the swipe
421
+ * starts, for what the swipe moves (a sheet's panel, dragged by its
422
+ * handle). Default: the element itself.
423
+ */
424
+ measure: Schema.optional<Schema.String>;
425
+ }, {
426
+ readonly _tag: "SwipeStarted";
427
+ readonly pointerId: number;
428
+ readonly pointerType: string;
429
+ readonly width: number;
430
+ readonly height: number;
431
+ } | {
432
+ readonly _tag: "Swiped";
433
+ readonly pointerId: number;
434
+ readonly deltaX: number;
435
+ readonly deltaY: number;
436
+ } | {
437
+ readonly _tag: "SwipeEnded";
438
+ readonly pointerId: number;
439
+ readonly deltaX: number;
440
+ readonly deltaY: number;
441
+ readonly velocityX: number;
442
+ readonly velocityY: number;
443
+ readonly completed: boolean;
444
+ }>;
445
+ //#endregion
446
+ //#region src/dom/scroll-settle.d.ts
447
+ export declare const ScrollSettled: Schema.TaggedStruct<"ScrollSettled", {
448
+ /** The item whose start lies nearest the scroller's start, from 0. */
449
+ readonly index: Schema.Number;
450
+ }>;
451
+ export type ScrollSettled = typeof ScrollSettled.Type;
452
+ /** How long a scroll must be still to count as settled, where `scrollend` is missing. */
453
+ export declare const SETTLE_QUIET = 120;
454
+ /**
455
+ * Hears a scroller come to rest, as a Mount: after a swipe, a fling, a
456
+ * trackpad or a scroll a Command made, it reports which of its items starts
457
+ * nearest its own start (inside its `scroll-padding`), the start being the
458
+ * right edge right to left. A snapping carousel reads it as the slide shown.
459
+ *
460
+ * At insert it first scrolls, at once, to item `start` (the Mount's args are
461
+ * read only then, so this is where a redrawn or restored scroller begins),
462
+ * and reports where it lies, since a scroller drawn already at rest sends no
463
+ * `scrollend`. It listens for `scrollend` where the browser has it, and
464
+ * otherwise for a scroll that is quiet for `SETTLE_QUIET` milliseconds.
465
+ */
466
+ export declare const ScrollSettle: Mount.MountDefinitionWithArgs<"ScrollSettle", {
467
+ /** Which children are the items; default every child. */
468
+ item: Schema.optional<Schema.String>;
469
+ /** Default `inline`, the row a carousel scrolls along. */
470
+ axis: Schema.optional<Schema.Literals<readonly ["inline", "block"]>>;
471
+ /** The item to scroll to at insert; default the first, which needs no scroll. */
472
+ start: Schema.optional<Schema.Number>;
473
+ }, {
474
+ readonly _tag: "ScrollSettled";
475
+ readonly index: number;
476
+ }>;
477
+ //#endregion
478
+ //#region src/dom/pointer-position.d.ts
479
+ /**
480
+ * A place in an element's padding box, in CSS pixels from its top left
481
+ * corner, and the pointer's pressure there (0 to 1; a mouse reads 0.5 while
482
+ * a button is down). A captured pointer can be outside the box, so `x` and
483
+ * `y` can be negative or past its size.
484
+ */
485
+ export declare const PointerPoint: Schema.Struct<{
486
+ readonly x: Schema.Number;
487
+ readonly y: Schema.Number;
488
+ readonly pressure: Schema.Number;
489
+ }>;
490
+ export type PointerPoint = typeof PointerPoint.Type;
491
+ export declare const PointerPressed: Schema.TaggedStruct<"PointerPressed", {
492
+ readonly width: Schema.Number;
493
+ readonly height: Schema.Number;
494
+ readonly point: Schema.Struct<{
495
+ readonly x: Schema.Number;
496
+ readonly y: Schema.Number;
497
+ readonly pressure: Schema.Number;
498
+ }>;
499
+ /** `mouse`, `pen` or `touch`, as the browser names it. */
500
+ readonly pointerType: Schema.String;
501
+ }>;
502
+ export type PointerPressed = typeof PointerPressed.Type;
503
+ export declare const PointerMoved: Schema.TaggedStruct<"PointerMoved", {
504
+ readonly width: Schema.Number;
505
+ readonly height: Schema.Number;
506
+ /** Where the pointer is now. */
507
+ readonly point: Schema.Struct<{
508
+ readonly x: Schema.Number;
509
+ readonly y: Schema.Number;
510
+ readonly pressure: Schema.Number;
511
+ }>;
512
+ /**
513
+ * Every place it passed since the last move, ending with `point`: the
514
+ * browser's coalesced events, so a fast stroke keeps its curve. Just
515
+ * `point` where the browser coalesces none.
516
+ */
517
+ readonly points: Schema.$Array<Schema.Struct<{
518
+ readonly x: Schema.Number;
519
+ readonly y: Schema.Number;
520
+ readonly pressure: Schema.Number;
521
+ }>>;
522
+ }>;
523
+ export type PointerMoved = typeof PointerMoved.Type;
524
+ export declare const PointerReleased: Schema.TaggedStruct<"PointerReleased", {
525
+ /** `false` when the pointer was cancelled, lost its capture, or pressed again unreleased. */
526
+ readonly completed: Schema.Boolean;
527
+ }>;
528
+ export type PointerReleased = typeof PointerReleased.Type;
529
+ export type PointerFact = PointerPressed | PointerMoved | PointerReleased;
530
+ interface Sides {
531
+ readonly top: number;
532
+ readonly right: number;
533
+ readonly bottom: number;
534
+ readonly left: number;
535
+ }
536
+ export interface Rect {
537
+ readonly left: number;
538
+ readonly top: number;
539
+ readonly width: number;
540
+ readonly height: number;
541
+ }
542
+ /**
543
+ * The padding box of an element whose border box is `rect`: inside its
544
+ * border, padding included. An absolutely positioned child (a thumb, a
545
+ * stroke) is laid out against it, so a place read here is where that child
546
+ * sits, whatever padding a stylist adds.
547
+ */
548
+ export declare const paddingBoxOf: (layout: {
549
+ readonly rect: Rect;
550
+ readonly border: Sides;
551
+ }) => Rect;
552
+ /**
553
+ * An element's padding box now, in the viewport, as `PointerPosition`
554
+ * measures it: for a size kept beside its places, which a `ResizeObserver`'s
555
+ * content box does not match once the element has padding. Read from the
556
+ * bounding rectangle and the computed border, since `clientWidth` and
557
+ * `clientLeft` round to whole pixels.
558
+ */
559
+ export declare const measurePaddingBox: (element: Element) => Rect;
560
+ /**
561
+ * Where one pointer is inside an element, as a Mount, for a surface the
562
+ * pointer draws on or points into (a color area, a dial, a signature pad): a
563
+ * primary press, each move until the release, and the release, each with
564
+ * the place in the element's padding box and the box's size. The box is
565
+ * measured at each event, so an element that moved or resized is followed.
566
+ * Coordinates are raw, left to right and top down whatever the direction:
567
+ * what a place means (a share, an angle, a reading direction) is the parent's.
568
+ *
569
+ * The pointer is captured from press to release, so a drag that leaves the
570
+ * element is still heard, and the moves and the release are listened to only
571
+ * meanwhile. A press keeps the browser's own focus and text selection away,
572
+ * and a second pointer while one is down is ignored.
573
+ */
574
+ export declare const PointerPosition: Mount.MountDefinitionWithArgs<"PointerPosition", {
575
+ /**
576
+ * A descendant to focus on a press, found by this selector (a thumb), so
577
+ * the keys go on from where the pointer left it.
578
+ */
579
+ focus: Schema.optionalKey<Schema.String>;
580
+ }, {
581
+ readonly _tag: "PointerPressed";
582
+ readonly width: number;
583
+ readonly height: number;
584
+ readonly point: {
585
+ readonly x: number;
586
+ readonly y: number;
587
+ readonly pressure: number;
588
+ };
589
+ readonly pointerType: string;
590
+ } | {
591
+ readonly _tag: "PointerMoved";
592
+ readonly width: number;
593
+ readonly height: number;
594
+ readonly point: {
595
+ readonly x: number;
596
+ readonly y: number;
597
+ readonly pressure: number;
598
+ };
599
+ readonly points: readonly {
600
+ readonly x: number;
601
+ readonly y: number;
602
+ readonly pressure: number;
603
+ }[];
604
+ } | {
605
+ readonly _tag: "PointerReleased";
606
+ readonly completed: boolean;
607
+ }>;
608
+ //#endregion
609
+ //#region src/dom/track-box.d.ts
610
+ /** The attribute on the mounted element naming the element `TrackBox` follows, by id. */
611
+ export declare const TRACK_TARGET_ATTRIBUTE = "data-target";
612
+ /** The custom properties `TrackBox` writes for `name`, as `measured` names `Measure`'s. */
613
+ export declare const trackedBox: (name: string) => {
614
+ readonly x: `--fk-${string}-x`;
615
+ readonly y: `--fk-${string}-y`;
616
+ readonly w: `--fk-${string}-w`;
617
+ readonly h: `--fk-${string}-h`;
618
+ readonly radius: `--fk-${string}-radius`;
619
+ };
620
+ /** Sent as the followed element changes: its id, and whether it is on the page. */
621
+ export declare const TrackedTarget: Schema.TaggedStruct<"TrackedTarget", {
622
+ readonly target: Schema.String;
623
+ readonly found: Schema.Boolean;
624
+ }>;
625
+ export type TrackedTarget = typeof TrackedTarget.Type;
626
+ /**
627
+ * The radius a box of `width` by `height` draws for a computed
628
+ * `border-top-left-radius` of `value` (`8px`, `50%`, `8px 4px`): its
629
+ * horizontal length in pixels, a share of the width for a percentage, and
630
+ * never more than half the shorter side, where the browser stops it.
631
+ */
632
+ export declare const cornerRadius: (value: string, width: number, height: number) => number;
633
+ /**
634
+ * Follows another element's box, as a Mount: the element whose id is the
635
+ * mounted element's `data-target` (`TRACK_TARGET_ATTRIBUTE`). Its box in
636
+ * viewport pixels is written on the mounted element as `--fk-<name>-x`,
637
+ * `-y`, `-w` and `-h`, and with `radius`, its top left corner's radius as
638
+ * `--fk-<name>-radius` (`cornerRadius`), so a fixed overlay drawn from them
639
+ * (a tour's cutout, a coach mark's ring) sits over it. While nothing is
640
+ * followed they are removed, so a stylist's fallbacks apply.
641
+ *
642
+ * The box is read again on a scroll anywhere (heard on the way down, since
643
+ * `scroll` does not bubble), a window resize, the followed element's own
644
+ * resize, and any change to the document's elements, which is also how a
645
+ * target drawn anew under the same id is found. `data-target` is read again
646
+ * whenever it changes, so one element can glide from target to target
647
+ * without being drawn again, which a Mount's args, read once, could not do.
648
+ * What moves the target by any other way (a stylesheet added) is seen at the
649
+ * next of these.
650
+ *
651
+ * Whether a target is on the page is the parent's to act on (a tour shows
652
+ * the step in the middle instead), so each change of the target or of
653
+ * whether it is found sends `TrackedTarget`, starting with the first one.
654
+ * Since it sends a Message, a component may draw it by default: a Scene test
655
+ * resolves it with what the parent maps it to. An empty `data-target` follows
656
+ * nothing and sends nothing.
657
+ */
658
+ export declare const TrackBox: Mount.MountDefinitionWithArgs<"TrackBox", {
659
+ /** The custom properties' prefix: `tour` writes `--fk-tour-x`. */
660
+ name: Schema.String;
661
+ /** Whether to write the target's corner radius too; it reads the target's computed style. */
662
+ radius: Schema.optional<Schema.Boolean>;
663
+ }, {
664
+ readonly _tag: "TrackedTarget";
665
+ readonly target: string;
666
+ readonly found: boolean;
667
+ }>;
668
+ //#endregion
669
+ export { DRAG_THRESHOLD, DragCancelled, DragDropped, DragFact, DragPlace, DragStarted, DragZone, DraggedOver, EditAsked, EditableText, Fact, FocusScope, HOLD_SLOP, HOLD_TO_DRAG_MS, HideOutside, Move, MoveEnded, MoveStarted, Moved, PointerDrag, ScrollLock, TargetFact, TargetHovered, TargetPressed, Targets, TextCancelled, TextCommitted, TextEdited, TextFact, boxOf, tabbableWithin, targetOf, textOf, zoneOf };
203
670
  //# sourceMappingURL=index.d.mts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.mts","names":[],"sources":["../../src/dom/autofocus.ts","../../src/dom/clipboard.ts","../../src/dom/input-mask.ts","../../src/dom/keep-in-view.ts","../../src/dom/script-loader.ts","../../src/dom/share.ts","../../src/dom/measure.ts","../../src/dom/follow-tab-stop.ts","../../src/dom/scroll.ts","../../src/dom/pointed-links.ts"],"mappings":";;;;;;qBAGa,SAAO,OAAA;YACR,iBAAiB,QAAQ;;;;;;;;qBASxB,WAAS,MAAA;;;;;qBCJT,4CAAgB;;;IAEb,SAAO,OAAA;;;YAEX,0BAA0B,iBAAiB;qBAE1C,gDAAoB;;IACvB,MAAI,OAAA;;;IACE,SAAO,OAAA;;;YAEX,8BAA8B,qBAAqB;;;;;;qBAUlD,WAAQ,iBAAmB,QAAQ;;;;;qBAsBnC,gBAAe,QAAQ;;;;qBC/CvB,OAAK,OAAA;;;;YAIN,eAAe,MAAM;;;;;;;qBAiCpB,YAAS,eACP;WAED;WAAyB;;;;;;;;;;;qBA6C1B,WAAS,MAAA;WAAT,OAAA;;;;;;;;;;;;;;;;;qBC7EA,YAAU,MAAA;;YAAV,OAAA;;;;qBCDA,yCAAa;;;IAEV,SAAO,OAAA;;;YAEX,uBAAuB,cAAc;;qBASpC,aAAU,gBAAkB,QAAQ;;;qBCbpC,WAAS,OAAA;;;;;YAKV,mBAAmB,UAAU;qBAE5B,wCAAY;;;;IAGR,SAAO,OAAA;;;YAEZ,sBAAsB,aAAa;;qBAUlC,QAAK,MAAU,cAAY,QAAQ;;;;qBC7BnC,WAAQ;WAEjB;WACA;WACA;WACA;WACA;;;;;;;;;;;;;;;;;;;;;qBAsBS,SAAO,MAAA;;;;;;;;;;;;;;qBCrBP,eAAa,MAAA;;;;iBCuBT;;WAEN;;WAEA;;;;;WAKA;;;;;;;;qBAuHE,aAAU,UAAa,sBAAyB,OAAO;;;;;;;;;;qBCvJvD,oBAAmB,OAAO,OAAO"}
1
+ {"version":3,"file":"index.d.mts","names":[],"sources":["../../src/dom/autofocus.ts","../../src/dom/clipboard.ts","../../src/dom/input-mask.ts","../../src/dom/keep-in-view.ts","../../src/dom/script-loader.ts","../../src/dom/share.ts","../../src/dom/measure.ts","../../src/dom/follow-tab-stop.ts","../../src/dom/scroll.ts","../../src/dom/pointed-links.ts","../../src/dom/fluid-hover.ts","../../src/dom/keyboard-inset.ts","../../src/dom/scroll-bars.ts","../../src/dom/swipe.ts","../../src/dom/scroll-settle.ts","../../src/dom/pointer-position.ts","../../src/dom/track-box.ts"],"mappings":"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"}