@rcarls/rc-bottom-sheet 0.6.0 → 0.7.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/CHANGELOG.md +148 -0
- package/README.md +23 -3
- package/dist/custom-elements.json +124 -24
- package/dist/rc-bottom-sheet-5mYgsRK-.js +257 -0
- package/dist/rc-bottom-sheet-5mYgsRK-.js.map +1 -0
- package/dist/rc-bottom-sheet-define.js +1 -1
- package/dist/rc-bottom-sheet.js +1 -1
- package/dist/types/packages/rc-bottom-sheet/src/rc-bottom-sheet.d.ts +43 -10
- package/package.json +3 -3
- package/dist/rc-bottom-sheet-BZg5AVUG.js +0 -248
- package/dist/rc-bottom-sheet-BZg5AVUG.js.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,153 @@
|
|
|
1
1
|
# @rcarls/rc-bottom-sheet
|
|
2
2
|
|
|
3
|
+
## 0.7.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- f31cca3: Add `--rc-bottom-sheet-handle-offset` to position the handle indicator within its target. It
|
|
8
|
+
defaults to `50%`, which keeps the indicator centered. Set a length to keep the indicator in its
|
|
9
|
+
own row at the top of a handle that also holds the sheet's title.
|
|
10
|
+
- ec6ebc6: Load dialog move and resize behavior on demand. `rc-dialog` now imports its
|
|
11
|
+
drag and resize controllers only the first time `movable`, `move-handle`, or
|
|
12
|
+
`resize` enables them, so dialogs that never move or resize, including the
|
|
13
|
+
popups inside `rc-select`, `rc-combobox`, and `rc-markdown-editor`, no longer
|
|
14
|
+
ship that code. The new `@rcarls/rc-dialog/geometry` entry exports
|
|
15
|
+
`DialogGeometry` for subclasses that always resize; `rc-bottom-sheet` uses it,
|
|
16
|
+
so its resize stays available immediately.
|
|
17
|
+
|
|
18
|
+
Breaking changes and migration:
|
|
19
|
+
|
|
20
|
+
- `rc-dialog` and `rc-bottom-sheet` remove `light-dismiss` / `lightDismiss`.
|
|
21
|
+
Use `closed-by="any"`, which closes on Escape or a backdrop click and now
|
|
22
|
+
falls back to a backdrop click listener where the browser has no native
|
|
23
|
+
`closedby`.
|
|
24
|
+
- `rc-bottom-sheet` now defaults `closed-by` to `any` instead of defaulting
|
|
25
|
+
`light-dismiss` to true. Set `closed-by="closerequest"` to keep backdrop
|
|
26
|
+
clicks from closing a sheet, or `closed-by="none"` to allow only explicit
|
|
27
|
+
actions.
|
|
28
|
+
|
|
29
|
+
- 57338f5: `rc-dialog`, `rc-bottom-sheet`, and `rc-snackbar` now fade in and out through
|
|
30
|
+
CSS alone, using `@starting-style` and a discrete `display`/`overlay`
|
|
31
|
+
transition, driven by the shared `--rc-motion-effects-*` tokens (and
|
|
32
|
+
`--rc-motion-spatial-*` for `rc-snackbar`'s slide). `showModal()`/`show()`/
|
|
33
|
+
`close()` all stay synchronous, and nothing in any of the three components
|
|
34
|
+
waits on the transition finishing, so a zero-duration theme or a browser
|
|
35
|
+
without support for the CSS involved both degrade to an instant, fully
|
|
36
|
+
correct open and close.
|
|
37
|
+
|
|
38
|
+
`rc-dialog` and `rc-bottom-sheet` animate opacity only, not a scale or slide
|
|
39
|
+
transform: both support pointer resize and read `getBoundingClientRect()` to
|
|
40
|
+
compute drag deltas, and a transform is a visual effect that
|
|
41
|
+
`getBoundingClientRect()` reports for as long as it's still animating,
|
|
42
|
+
corrupting that measurement if a resize or drag starts during the entrance.
|
|
43
|
+
`rc-snackbar` has no such feature, so it fades and slides up from the
|
|
44
|
+
block-end edge it's anchored to.
|
|
45
|
+
|
|
46
|
+
### Patch Changes
|
|
47
|
+
|
|
48
|
+
- 06f195f: Resolve `snap-points` inside the sheet when each snap applies. Entries may use `calc()` and
|
|
49
|
+
`var()`, including values with inner spaces, and custom properties inherited by the sheet are
|
|
50
|
+
read at their current value, so a page can drive a snap point from an animated property such
|
|
51
|
+
as a scroll-linked peek height.
|
|
52
|
+
- 12f443f: Keep `rc-bottom-sheet` docked at its block-end edge. Snapping now sets only
|
|
53
|
+
the sheet's height and leaves its position to CSS, releasing the edge pins a
|
|
54
|
+
drag gesture leaves inline. A viewport resize, such as a software keyboard
|
|
55
|
+
opening under `interactive-widget=resizes-content`, or a containing block that
|
|
56
|
+
moves after a snap no longer strands the sheet off-screen. A field that takes
|
|
57
|
+
focus inside the sheet is scrolled into view within the sheet, and the sheet
|
|
58
|
+
grows past its snap height and maximum block size only when scrolling cannot
|
|
59
|
+
reveal the field, returning to its snap point when focus leaves. A drag now
|
|
60
|
+
interrupts a running snap animation instead of being overridden by it.
|
|
61
|
+
- e232e9d: A `snapTo()` call made before the sheet's inner `<dialog>` is attached, as
|
|
62
|
+
from a framework ref callback, now applies when the sheet opens instead of
|
|
63
|
+
being dropped, so a sheet rendered open starts at the requested snap point.
|
|
64
|
+
- d3a91dc: Convert focus reveal distances into nested scroll container CSS pixels under
|
|
65
|
+
CSS zoom so focused fields remain visible without growing the sheet.
|
|
66
|
+
- 5c006de: Ship component CSS minified. Package builds now run the CSS in Lit `css` styles
|
|
67
|
+
and light-DOM structural styles through Lightning CSS, removing comments and
|
|
68
|
+
whitespace while keeping source maps that resolve to each template. Rendered
|
|
69
|
+
styles are unchanged.
|
|
70
|
+
|
|
71
|
+
`@rcarls/rc-common` adds `cssText`, an identity tag that marks a plain CSS
|
|
72
|
+
string for minification. `rc-chip`, `rc-disclosure`, and `rc-accordion` now
|
|
73
|
+
depend on `@rcarls/rc-common` for it.
|
|
74
|
+
|
|
75
|
+
- 8cbc627: A non-modal dialog or sheet that is already open when it connects, through `open` or
|
|
76
|
+
`default-open`, no longer takes focus from the page: native `show()` focuses the first control,
|
|
77
|
+
so a standard bottom sheet rendered open with a page stole focus as soon as its content existed.
|
|
78
|
+
Opening one later with `show()` still moves focus into it.
|
|
79
|
+
- 899bb5e: Make `rc-dialog` move and resize options reactive. Toggling `movable`,
|
|
80
|
+
changing `resize`, or changing any other `move-*` or `resize-*` option after
|
|
81
|
+
setup now rebuilds that behavior, so `resize="none"` turns resizing off on a
|
|
82
|
+
mounted `rc-dialog` or `rc-bottom-sheet` and a later value turns it back on.
|
|
83
|
+
Re-wiring the inner `<dialog>` no longer leaves stale move or resize
|
|
84
|
+
controllers attached. `DragController`, `ResizeController`, and
|
|
85
|
+
`DragGestureController` gain `dispose()`. Detaching a handle restores its
|
|
86
|
+
focusability and inline resize styles when they still have controller-written
|
|
87
|
+
values, while preserving later author edits. Active gestures cancel
|
|
88
|
+
and release pointer capture when their controller is removed. `rc-fab` uses
|
|
89
|
+
the new `ScrollObserverController.dispose()` for its optional scroll fallback.
|
|
90
|
+
- 25fcfe0: Dialogs, sheets, and their drag and resize gestures now keep their geometry under an
|
|
91
|
+
ancestor's CSS `zoom`, such as an app-wide interface size set on the root. Measured boxes and
|
|
92
|
+
pointer positions are viewport pixels, while a length written to an element's style is zoomed
|
|
93
|
+
again, so a full-screen dialog fell short of or overflowed the viewport, a dragged bottom sheet
|
|
94
|
+
lifted off its docked edge, and each snap shrank or grew the sheet. Positions and sizes are now
|
|
95
|
+
converted to the element's own pixels through a new `cssZoom()` helper in `@rcarls/rc-common`.
|
|
96
|
+
`rc-bottom-sheet-snap` reports `height` in the sheet's own pixels, the unit of its snap points.
|
|
97
|
+
- 75f1dbd: Read an ancestor CSS zoom from the inner `<dialog>` rather than the host, so a
|
|
98
|
+
host styled `display: contents`, which reports no zoom, still covers the
|
|
99
|
+
viewport as a fullscreen dialog and resolves percentage snap points
|
|
100
|
+
correctly under an app-wide interface size.
|
|
101
|
+
- ac65b5b: A pointer resize now starts only after the pointer moves 8 pixels, like Android's touch slop.
|
|
102
|
+
A tap on a resize handle that is also a button, such as a bottom sheet's drag handle, stays a
|
|
103
|
+
click: it no longer starts a resize, settles the sheet to its nearest snap point, and fires
|
|
104
|
+
resize events before the click runs.
|
|
105
|
+
- afcfef8: Read snap duration custom properties as CSS times. `--rc-bottom-sheet-snap-duration` and
|
|
106
|
+
`--rc-splitter-snap-duration` now accept seconds as well as milliseconds, so a theme motion
|
|
107
|
+
token such as `.3s` animates for 300 ms instead of finishing in a fraction of a millisecond.
|
|
108
|
+
`rc-common` exports the shared `parseCssTime` helper.
|
|
109
|
+
- Updated dependencies [e3dfa59]
|
|
110
|
+
- Updated dependencies [50d5610]
|
|
111
|
+
- Updated dependencies [9ee769c]
|
|
112
|
+
- Updated dependencies [1179f24]
|
|
113
|
+
- Updated dependencies [595fe37]
|
|
114
|
+
- Updated dependencies [38cd00c]
|
|
115
|
+
- Updated dependencies [5c006de]
|
|
116
|
+
- Updated dependencies [a6553ff]
|
|
117
|
+
- Updated dependencies [8300209]
|
|
118
|
+
- Updated dependencies [2205478]
|
|
119
|
+
- Updated dependencies [8cbc627]
|
|
120
|
+
- Updated dependencies [ec6ebc6]
|
|
121
|
+
- Updated dependencies [4341311]
|
|
122
|
+
- Updated dependencies [899bb5e]
|
|
123
|
+
- Updated dependencies [5a7a1dd]
|
|
124
|
+
- Updated dependencies [2c7c80a]
|
|
125
|
+
- Updated dependencies [25fcfe0]
|
|
126
|
+
- Updated dependencies [75f1dbd]
|
|
127
|
+
- Updated dependencies [0de2332]
|
|
128
|
+
- Updated dependencies [51f6403]
|
|
129
|
+
- Updated dependencies [9caca6b]
|
|
130
|
+
- Updated dependencies [b764a3c]
|
|
131
|
+
- Updated dependencies [54d9ead]
|
|
132
|
+
- Updated dependencies [57338f5]
|
|
133
|
+
- Updated dependencies [b9175e9]
|
|
134
|
+
- Updated dependencies [c8b762b]
|
|
135
|
+
- Updated dependencies [55e1e7f]
|
|
136
|
+
- Updated dependencies [f1ca82d]
|
|
137
|
+
- Updated dependencies [b87f27b]
|
|
138
|
+
- Updated dependencies [32ebead]
|
|
139
|
+
- Updated dependencies [bfefedd]
|
|
140
|
+
- Updated dependencies [c130173]
|
|
141
|
+
- Updated dependencies [11680b6]
|
|
142
|
+
- Updated dependencies [223d36c]
|
|
143
|
+
- Updated dependencies [7b91a44]
|
|
144
|
+
- Updated dependencies [aa04ead]
|
|
145
|
+
- Updated dependencies [ac65b5b]
|
|
146
|
+
- Updated dependencies [afcfef8]
|
|
147
|
+
- Updated dependencies [11ef1ad]
|
|
148
|
+
- @rcarls/rc-common@0.7.0
|
|
149
|
+
- @rcarls/rc-dialog@0.7.0
|
|
150
|
+
|
|
3
151
|
## 0.6.0
|
|
4
152
|
|
|
5
153
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -44,7 +44,7 @@ must have `aria-labelledby` or `aria-label`.
|
|
|
44
44
|
|
|
45
45
|
`rc-bottom-sheet` inherits `rc-dialog` methods and events, including
|
|
46
46
|
`showModal()`, `show()`, `close()`, `requestClose()`, `rc-dialog-toggle`, and
|
|
47
|
-
`rc-dialog-request-close`. It defaults to light dismiss, vertical top-origin
|
|
47
|
+
`rc-dialog-request-close`. It defaults to `closed-by="any"` light dismiss, vertical top-origin
|
|
48
48
|
resize, downward swipe-dismiss, and fixed positioning at the viewport's bottom
|
|
49
49
|
edge. Add an optional
|
|
50
50
|
`[data-rc-bottom-sheet-handle]` element inside the dialog for an authored
|
|
@@ -54,12 +54,32 @@ target. Keep a direct-child handle at the top of the dialog so that target
|
|
|
54
54
|
starts at the sheet's draggable edge; when authoring custom dialog padding,
|
|
55
55
|
leave its block-start padding at zero.
|
|
56
56
|
|
|
57
|
+
A handle can also hold the sheet's title, which widens the drag target to the
|
|
58
|
+
whole header. Set `--rc-bottom-sheet-handle-offset` to a length, such as
|
|
59
|
+
`0.75rem`, to keep the indicator in its own row at the top of the handle, and
|
|
60
|
+
pad the title below it.
|
|
61
|
+
|
|
57
62
|
For an embedded non-modal sheet, place the component in a positioned container,
|
|
58
63
|
set `--rc-bottom-sheet-position: absolute`, and open it with `show()`. The sheet
|
|
59
64
|
then docks to that container's block-end edge instead of the viewport.
|
|
60
65
|
|
|
61
|
-
|
|
62
|
-
|
|
66
|
+
Set `resize="none"` to hold the sheet at its current snap point, for example
|
|
67
|
+
while it has nothing more to reveal. The option is reactive, so restoring
|
|
68
|
+
`resize="vertical"` re-enables dragging between snap points.
|
|
69
|
+
|
|
70
|
+
The sheet stays docked at its block-end edge: snapping sets only its height,
|
|
71
|
+
and its position is left to CSS. A software keyboard that resizes the viewport
|
|
72
|
+
(`interactive-widget=resizes-content`) re-applies the current snap point above
|
|
73
|
+
the keyboard. When a field inside the sheet takes focus, the sheet scrolls it
|
|
74
|
+
into view within its own scroll containers, and grows past its snap height and
|
|
75
|
+
maximum block size only when scrolling cannot reveal it, returning to its snap
|
|
76
|
+
point once focus leaves the sheet.
|
|
77
|
+
|
|
78
|
+
List `snap-points` as CSS heights in ascending order. Any length works,
|
|
79
|
+
including `calc()` and `var()`; each is resolved inside the sheet when a snap
|
|
80
|
+
applies, so a custom property the page animates is read at its current value.
|
|
81
|
+
Percentages are of the viewport height. Slow drag releases settle at the
|
|
82
|
+
nearest point; a swipe at `swipe-velocity` or faster settles at
|
|
63
83
|
the first or last point. Settling animates unless the user prefers reduced
|
|
64
84
|
motion. `rc-bottom-sheet-resize-start` fires as an interactive resize begins,
|
|
65
85
|
before the sheet geometry changes, so consumers can prepare content that the
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"declarations": [
|
|
47
47
|
{
|
|
48
48
|
"kind": "class",
|
|
49
|
-
"description": "Modal bottom-sheet wrapper for a native `<dialog>`, built on `rc-dialog`.\n\nThe direct child `<dialog>` remains the semantic dialog surface and owns\ncontent, labels, and form behavior. `rc-bottom-sheet` supplies the same\nopen/close lifecycle, focus restoration, cancel/request-close events, and\
|
|
49
|
+
"description": "Modal bottom-sheet wrapper for a native `<dialog>`, built on `rc-dialog`.\n\nThe direct child `<dialog>` remains the semantic dialog surface and owns\ncontent, labels, and form behavior. `rc-bottom-sheet` supplies the same\nopen/close lifecycle, focus restoration, cancel/request-close events, and\n`closed-by` dismissal as `rc-dialog`. The component docks the sheet to\nthe viewport block-end by default, while themes provide its visual surface.\n\nDragging the resize handle past a decisive velocity in either direction\n(a \"swipe\" or \"fling,\" distinct from a slow deliberate drag) snaps\nstraight to the extreme `snap-points` entry in that direction — swipe up\nto fully expand, swipe down to fully collapse — regardless of how close\nthe release position was to some other point. Below that velocity, the\nsheet settles to whichever declared snap point is nearest the release\nheight. All settling, whether from a drag or from `snapTo()`, animates\nover `--rc-bottom-sheet-snap-duration`, follows\n`--rc-bottom-sheet-snap-easing`, and is skipped for\n`prefers-reduced-motion: reduce`.\n\nOpening and closing themselves fade the surface and its backdrop through\nCSS alone (`@starting-style` plus a discrete `display`/`overlay`\ntransition), using the shared `--rc-motion-effects-*` tokens.\n`showModal()`/`show()`/`close()` stay synchronous; nothing waits on the\ntransition finishing. The entrance animates opacity only, not a slide\ntransform, because several call sites (and this component's own drag/snap\nmath) read `getBoundingClientRect()` right after opening, which reports\nthe transformed box for as long as a transform-based entrance is still\nrunning.",
|
|
50
50
|
"name": "RCBottomSheet",
|
|
51
51
|
"cssProperties": [
|
|
52
52
|
{
|
|
@@ -124,6 +124,11 @@
|
|
|
124
124
|
"name": "--rc-bottom-sheet-handle-radius",
|
|
125
125
|
"default": "999px"
|
|
126
126
|
},
|
|
127
|
+
{
|
|
128
|
+
"description": "Block-start position of the handle indicator's center within its target. Set a length to pin it above a title inside the handle.",
|
|
129
|
+
"name": "--rc-bottom-sheet-handle-offset",
|
|
130
|
+
"default": "50%"
|
|
131
|
+
},
|
|
127
132
|
{
|
|
128
133
|
"description": "Pointer target width for a direct-child handle.",
|
|
129
134
|
"name": "--rc-bottom-sheet-handle-target-inline-size",
|
|
@@ -197,13 +202,21 @@
|
|
|
197
202
|
},
|
|
198
203
|
{
|
|
199
204
|
"kind": "field",
|
|
200
|
-
"name": "
|
|
205
|
+
"name": "_geometryClass",
|
|
206
|
+
"privacy": "protected",
|
|
207
|
+
"static": true,
|
|
208
|
+
"default": "DialogGeometry"
|
|
209
|
+
},
|
|
210
|
+
{
|
|
211
|
+
"kind": "field",
|
|
212
|
+
"name": "closedBy",
|
|
201
213
|
"type": {
|
|
202
|
-
"text": "
|
|
214
|
+
"text": "'any' | 'closerequest' | 'none' | ''"
|
|
203
215
|
},
|
|
204
|
-
"default": "
|
|
205
|
-
"description": "Bottom sheets
|
|
206
|
-
"attribute": "
|
|
216
|
+
"default": "'any'",
|
|
217
|
+
"description": "Bottom sheets close on Escape or a backdrop click by default.\n\nSet `closed-by=\"closerequest\"` when a backdrop click must not close the\nsheet, or `closed-by=\"none\"` when only explicit actions may close it.",
|
|
218
|
+
"attribute": "closed-by",
|
|
219
|
+
"reflects": true
|
|
207
220
|
},
|
|
208
221
|
{
|
|
209
222
|
"kind": "field",
|
|
@@ -243,7 +256,7 @@
|
|
|
243
256
|
"text": "string"
|
|
244
257
|
},
|
|
245
258
|
"default": "''",
|
|
246
|
-
"description": "Whitespace-separated CSS heights in ascending order.\n\nEach height becomes an addressable snap target. Slow releases choose the\nnearest target, while decisive swipes choose the first or last target.",
|
|
259
|
+
"description": "Whitespace-separated CSS heights in ascending order.\n\nEach height becomes an addressable snap target. Slow releases choose the\nnearest target, while decisive swipes choose the first or last target.\nAny CSS length works, including `calc()` and `var()`, and is resolved in\nthe sheet's own context when a snap is applied, so a custom property the\npage animates (for example from a scroll timeline) is read at its current\nvalue. Percentages are of the viewport height.",
|
|
247
260
|
"attribute": "snap-points"
|
|
248
261
|
},
|
|
249
262
|
{
|
|
@@ -290,12 +303,42 @@
|
|
|
290
303
|
"privacy": "private",
|
|
291
304
|
"default": "null"
|
|
292
305
|
},
|
|
306
|
+
{
|
|
307
|
+
"kind": "field",
|
|
308
|
+
"name": "_pendingSnap",
|
|
309
|
+
"type": {
|
|
310
|
+
"text": "{ index: number; behavior: 'animated' | 'instant' } | null"
|
|
311
|
+
},
|
|
312
|
+
"privacy": "private",
|
|
313
|
+
"default": "null"
|
|
314
|
+
},
|
|
315
|
+
{
|
|
316
|
+
"kind": "field",
|
|
317
|
+
"name": "_extendedForFocus",
|
|
318
|
+
"type": {
|
|
319
|
+
"text": "boolean"
|
|
320
|
+
},
|
|
321
|
+
"privacy": "private",
|
|
322
|
+
"default": "false"
|
|
323
|
+
},
|
|
293
324
|
{
|
|
294
325
|
"kind": "field",
|
|
295
326
|
"name": "_onWindowResize",
|
|
296
327
|
"privacy": "private",
|
|
297
328
|
"readonly": true
|
|
298
329
|
},
|
|
330
|
+
{
|
|
331
|
+
"kind": "field",
|
|
332
|
+
"name": "_onFocusIn",
|
|
333
|
+
"privacy": "private",
|
|
334
|
+
"readonly": true
|
|
335
|
+
},
|
|
336
|
+
{
|
|
337
|
+
"kind": "field",
|
|
338
|
+
"name": "_onFocusOut",
|
|
339
|
+
"privacy": "private",
|
|
340
|
+
"readonly": true
|
|
341
|
+
},
|
|
299
342
|
{
|
|
300
343
|
"kind": "method",
|
|
301
344
|
"name": "snapTo",
|
|
@@ -323,6 +366,38 @@
|
|
|
323
366
|
],
|
|
324
367
|
"description": "Snaps to a declared target by zero-based index.\n\nFinite fractional indices are truncated and out-of-range indices clamp to\nthe nearest endpoint. Non-finite indices and calls without valid snap\npoints have no effect."
|
|
325
368
|
},
|
|
369
|
+
{
|
|
370
|
+
"kind": "method",
|
|
371
|
+
"name": "_applyOpen",
|
|
372
|
+
"privacy": "protected",
|
|
373
|
+
"return": {
|
|
374
|
+
"type": {
|
|
375
|
+
"text": "boolean"
|
|
376
|
+
}
|
|
377
|
+
},
|
|
378
|
+
"parameters": [
|
|
379
|
+
{
|
|
380
|
+
"name": "open",
|
|
381
|
+
"type": {
|
|
382
|
+
"text": "boolean"
|
|
383
|
+
}
|
|
384
|
+
},
|
|
385
|
+
{
|
|
386
|
+
"name": "silent",
|
|
387
|
+
"type": {
|
|
388
|
+
"text": "boolean"
|
|
389
|
+
}
|
|
390
|
+
},
|
|
391
|
+
{
|
|
392
|
+
"name": "modal",
|
|
393
|
+
"default": "true"
|
|
394
|
+
},
|
|
395
|
+
{
|
|
396
|
+
"name": "moveFocus",
|
|
397
|
+
"default": "true"
|
|
398
|
+
}
|
|
399
|
+
]
|
|
400
|
+
},
|
|
326
401
|
{
|
|
327
402
|
"kind": "method",
|
|
328
403
|
"name": "_onResizeStart",
|
|
@@ -393,6 +468,10 @@
|
|
|
393
468
|
"type": {
|
|
394
469
|
"text": "'drag' | 'api'"
|
|
395
470
|
}
|
|
471
|
+
},
|
|
472
|
+
{
|
|
473
|
+
"name": "points",
|
|
474
|
+
"default": "this._resolvedSnapPoints()"
|
|
396
475
|
}
|
|
397
476
|
]
|
|
398
477
|
},
|
|
@@ -423,6 +502,10 @@
|
|
|
423
502
|
"type": {
|
|
424
503
|
"text": "'drag' | 'api'"
|
|
425
504
|
}
|
|
505
|
+
},
|
|
506
|
+
{
|
|
507
|
+
"name": "points",
|
|
508
|
+
"default": "this._resolvedSnapPoints()"
|
|
426
509
|
}
|
|
427
510
|
]
|
|
428
511
|
},
|
|
@@ -442,12 +525,6 @@
|
|
|
442
525
|
"text": "HTMLDialogElement"
|
|
443
526
|
}
|
|
444
527
|
},
|
|
445
|
-
{
|
|
446
|
-
"name": "top",
|
|
447
|
-
"type": {
|
|
448
|
-
"text": "number"
|
|
449
|
-
}
|
|
450
|
-
},
|
|
451
528
|
{
|
|
452
529
|
"name": "height",
|
|
453
530
|
"type": {
|
|
@@ -468,6 +545,17 @@
|
|
|
468
545
|
}
|
|
469
546
|
]
|
|
470
547
|
},
|
|
548
|
+
{
|
|
549
|
+
"kind": "method",
|
|
550
|
+
"name": "_revealFocusedField",
|
|
551
|
+
"privacy": "private",
|
|
552
|
+
"return": {
|
|
553
|
+
"type": {
|
|
554
|
+
"text": "void"
|
|
555
|
+
}
|
|
556
|
+
},
|
|
557
|
+
"description": "Keeps a focused field inside the sheet visible, as Android and Material\nsheets do above a software keyboard: scroll it into view within the\nsheet's own scroll containers, then grow the sheet past its snap height\nand CSS maximum (up to the space above its docked edge) only when\nscrolling cannot reveal it."
|
|
558
|
+
},
|
|
471
559
|
{
|
|
472
560
|
"kind": "method",
|
|
473
561
|
"name": "_snapDuration",
|
|
@@ -516,18 +604,30 @@
|
|
|
516
604
|
},
|
|
517
605
|
{
|
|
518
606
|
"kind": "method",
|
|
519
|
-
"name": "
|
|
607
|
+
"name": "_measureSnapPoints",
|
|
520
608
|
"privacy": "private",
|
|
521
609
|
"return": {
|
|
522
610
|
"type": {
|
|
523
|
-
"text": "
|
|
611
|
+
"text": "void"
|
|
524
612
|
}
|
|
525
613
|
},
|
|
526
614
|
"parameters": [
|
|
527
615
|
{
|
|
528
|
-
"name": "
|
|
616
|
+
"name": "entries",
|
|
529
617
|
"type": {
|
|
530
|
-
"text": "string"
|
|
618
|
+
"text": "Array<{ index: number; point: string; probe: HTMLElement }>"
|
|
619
|
+
}
|
|
620
|
+
},
|
|
621
|
+
{
|
|
622
|
+
"name": "resolved",
|
|
623
|
+
"type": {
|
|
624
|
+
"text": "number[]"
|
|
625
|
+
}
|
|
626
|
+
},
|
|
627
|
+
{
|
|
628
|
+
"name": "viewportHeight",
|
|
629
|
+
"type": {
|
|
630
|
+
"text": "number"
|
|
531
631
|
}
|
|
532
632
|
}
|
|
533
633
|
]
|
|
@@ -546,7 +646,7 @@
|
|
|
546
646
|
"type": {
|
|
547
647
|
"text": "CustomEvent"
|
|
548
648
|
},
|
|
549
|
-
"description": "Fires after a drag release or `snapTo()` call settles at its snap target. `detail: { index, height, trigger }`"
|
|
649
|
+
"description": "Fires after a drag release or `snapTo()` call settles at its snap target. `detail: { index, height, trigger }`, with `height` in the sheet's own CSS pixels, the unit of its snap points."
|
|
550
650
|
},
|
|
551
651
|
{
|
|
552
652
|
"description": "Inherited from `rc-dialog`; fired when the sheet opens.",
|
|
@@ -571,13 +671,13 @@
|
|
|
571
671
|
],
|
|
572
672
|
"attributes": [
|
|
573
673
|
{
|
|
574
|
-
"description": "Bottom sheets
|
|
575
|
-
"name": "
|
|
674
|
+
"description": "Bottom sheets close on Escape or a backdrop click by default.\n\nSet `closed-by=\"closerequest\"` when a backdrop click must not close the\nsheet, or `closed-by=\"none\"` when only explicit actions may close it.",
|
|
675
|
+
"name": "closed-by",
|
|
576
676
|
"type": {
|
|
577
|
-
"text": "
|
|
677
|
+
"text": "'any' | 'closerequest' | 'none' | ''"
|
|
578
678
|
},
|
|
579
|
-
"default": "
|
|
580
|
-
"fieldName": "
|
|
679
|
+
"default": "'any'",
|
|
680
|
+
"fieldName": "closedBy"
|
|
581
681
|
},
|
|
582
682
|
{
|
|
583
683
|
"description": "Bottom sheets resize vertically from the top edge by default.",
|
|
@@ -607,7 +707,7 @@
|
|
|
607
707
|
"fieldName": "resizeHandle"
|
|
608
708
|
},
|
|
609
709
|
{
|
|
610
|
-
"description": "Whitespace-separated CSS heights in ascending order.\n\nEach height becomes an addressable snap target. Slow releases choose the\nnearest target, while decisive swipes choose the first or last target.",
|
|
710
|
+
"description": "Whitespace-separated CSS heights in ascending order.\n\nEach height becomes an addressable snap target. Slow releases choose the\nnearest target, while decisive swipes choose the first or last target.\nAny CSS length works, including `calc()` and `var()`, and is resolved in\nthe sheet's own context when a snap is applied, so a custom property the\npage animates (for example from a scroll timeline) is read at its current\nvalue. Percentages are of the viewport height.",
|
|
611
711
|
"name": "snap-points",
|
|
612
712
|
"type": {
|
|
613
713
|
"text": "string"
|