@rcarls/rc-bottom-sheet 0.5.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 +165 -0
- package/README.md +30 -7
- package/dist/custom-elements.json +154 -23
- 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 +55 -11
- package/package.json +3 -3
- package/dist/rc-bottom-sheet-C_FNJ-1w.js +0 -227
- package/dist/rc-bottom-sheet-C_FNJ-1w.js.map +0 -1
- package/dist/types/packages/rc-bottom-sheet/src/rc-bottom-sheet.test.d.ts +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,170 @@
|
|
|
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
|
+
|
|
151
|
+
## 0.6.0
|
|
152
|
+
|
|
153
|
+
### Patch Changes
|
|
154
|
+
|
|
155
|
+
- ee7ba6c: Keep resize pinning, drag origins, and snapped bottom sheets correctly
|
|
156
|
+
positioned when a layout-containing ancestor establishes a non-viewport
|
|
157
|
+
containing block. Report animated snap changes only after the sheet settles so
|
|
158
|
+
consumers can defer discrete content and accessibility state changes until the
|
|
159
|
+
surface motion completes. Expose resize-start timing so content can be prepared
|
|
160
|
+
before an interactive expansion reveals it.
|
|
161
|
+
- Updated dependencies [6683eb9]
|
|
162
|
+
- Updated dependencies [ee7ba6c]
|
|
163
|
+
- Updated dependencies [30eb232]
|
|
164
|
+
- Updated dependencies [57370e4]
|
|
165
|
+
- @rcarls/rc-common@0.6.0
|
|
166
|
+
- @rcarls/rc-dialog@0.6.0
|
|
167
|
+
|
|
3
168
|
## 0.5.0
|
|
4
169
|
|
|
5
170
|
### 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,19 +54,42 @@ 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
|
-
motion.
|
|
84
|
+
motion. `rc-bottom-sheet-resize-start` fires as an interactive resize begins,
|
|
85
|
+
before the sheet geometry changes, so consumers can prepare content that the
|
|
86
|
+
drag will reveal.
|
|
65
87
|
|
|
66
88
|
Call `snapTo(index)` to move programmatically. The
|
|
67
|
-
`rc-bottom-sheet-snap` event
|
|
68
|
-
`height` after CSS size constraints, and
|
|
69
|
-
|
|
89
|
+
`rc-bottom-sheet-snap` event fires after the sheet has settled and reports the
|
|
90
|
+
selected `index`, effective target `height` after CSS size constraints, and
|
|
91
|
+
whether the trigger was a drag or API call. Interrupted animations do not emit
|
|
92
|
+
a stale event. Constrained targets remain docked to the same block-end edge.
|
|
70
93
|
|
|
71
94
|
Set `--rc-bottom-sheet-snap-duration` and
|
|
72
95
|
`--rc-bottom-sheet-snap-easing` on the dialog to customize its settle motion.
|
|
@@ -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,56 @@
|
|
|
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
|
+
},
|
|
401
|
+
{
|
|
402
|
+
"kind": "method",
|
|
403
|
+
"name": "_onResizeStart",
|
|
404
|
+
"privacy": "protected",
|
|
405
|
+
"return": {
|
|
406
|
+
"type": {
|
|
407
|
+
"text": "void"
|
|
408
|
+
}
|
|
409
|
+
},
|
|
410
|
+
"parameters": [
|
|
411
|
+
{
|
|
412
|
+
"name": "detail",
|
|
413
|
+
"type": {
|
|
414
|
+
"text": "ResizeLifecycleDetail"
|
|
415
|
+
}
|
|
416
|
+
}
|
|
417
|
+
]
|
|
418
|
+
},
|
|
326
419
|
{
|
|
327
420
|
"kind": "method",
|
|
328
421
|
"name": "_onResizeEnd",
|
|
@@ -375,6 +468,10 @@
|
|
|
375
468
|
"type": {
|
|
376
469
|
"text": "'drag' | 'api'"
|
|
377
470
|
}
|
|
471
|
+
},
|
|
472
|
+
{
|
|
473
|
+
"name": "points",
|
|
474
|
+
"default": "this._resolvedSnapPoints()"
|
|
378
475
|
}
|
|
379
476
|
]
|
|
380
477
|
},
|
|
@@ -405,6 +502,10 @@
|
|
|
405
502
|
"type": {
|
|
406
503
|
"text": "'drag' | 'api'"
|
|
407
504
|
}
|
|
505
|
+
},
|
|
506
|
+
{
|
|
507
|
+
"name": "points",
|
|
508
|
+
"default": "this._resolvedSnapPoints()"
|
|
408
509
|
}
|
|
409
510
|
]
|
|
410
511
|
},
|
|
@@ -425,25 +526,36 @@
|
|
|
425
526
|
}
|
|
426
527
|
},
|
|
427
528
|
{
|
|
428
|
-
"name": "
|
|
529
|
+
"name": "height",
|
|
429
530
|
"type": {
|
|
430
531
|
"text": "number"
|
|
431
532
|
}
|
|
432
533
|
},
|
|
433
534
|
{
|
|
434
|
-
"name": "
|
|
535
|
+
"name": "behavior",
|
|
435
536
|
"type": {
|
|
436
|
-
"text": "
|
|
537
|
+
"text": "'animated' | 'instant'"
|
|
437
538
|
}
|
|
438
539
|
},
|
|
439
540
|
{
|
|
440
|
-
"name": "
|
|
541
|
+
"name": "onSettled",
|
|
441
542
|
"type": {
|
|
442
|
-
"text": "
|
|
543
|
+
"text": "() => void"
|
|
443
544
|
}
|
|
444
545
|
}
|
|
445
546
|
]
|
|
446
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
|
+
},
|
|
447
559
|
{
|
|
448
560
|
"kind": "method",
|
|
449
561
|
"name": "_snapDuration",
|
|
@@ -492,30 +604,49 @@
|
|
|
492
604
|
},
|
|
493
605
|
{
|
|
494
606
|
"kind": "method",
|
|
495
|
-
"name": "
|
|
607
|
+
"name": "_measureSnapPoints",
|
|
496
608
|
"privacy": "private",
|
|
497
609
|
"return": {
|
|
498
610
|
"type": {
|
|
499
|
-
"text": "
|
|
611
|
+
"text": "void"
|
|
500
612
|
}
|
|
501
613
|
},
|
|
502
614
|
"parameters": [
|
|
503
615
|
{
|
|
504
|
-
"name": "
|
|
616
|
+
"name": "entries",
|
|
617
|
+
"type": {
|
|
618
|
+
"text": "Array<{ index: number; point: string; probe: HTMLElement }>"
|
|
619
|
+
}
|
|
620
|
+
},
|
|
621
|
+
{
|
|
622
|
+
"name": "resolved",
|
|
505
623
|
"type": {
|
|
506
|
-
"text": "
|
|
624
|
+
"text": "number[]"
|
|
625
|
+
}
|
|
626
|
+
},
|
|
627
|
+
{
|
|
628
|
+
"name": "viewportHeight",
|
|
629
|
+
"type": {
|
|
630
|
+
"text": "number"
|
|
507
631
|
}
|
|
508
632
|
}
|
|
509
633
|
]
|
|
510
634
|
}
|
|
511
635
|
],
|
|
512
636
|
"events": [
|
|
637
|
+
{
|
|
638
|
+
"name": "rc-bottom-sheet-resize-start",
|
|
639
|
+
"type": {
|
|
640
|
+
"text": "CustomEvent"
|
|
641
|
+
},
|
|
642
|
+
"description": "Fires when an interactive resize begins. `detail: { height, inputType }`"
|
|
643
|
+
},
|
|
513
644
|
{
|
|
514
645
|
"name": "rc-bottom-sheet-snap",
|
|
515
646
|
"type": {
|
|
516
647
|
"text": "CustomEvent"
|
|
517
648
|
},
|
|
518
|
-
"description": "Fires
|
|
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."
|
|
519
650
|
},
|
|
520
651
|
{
|
|
521
652
|
"description": "Inherited from `rc-dialog`; fired when the sheet opens.",
|
|
@@ -540,13 +671,13 @@
|
|
|
540
671
|
],
|
|
541
672
|
"attributes": [
|
|
542
673
|
{
|
|
543
|
-
"description": "Bottom sheets
|
|
544
|
-
"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",
|
|
545
676
|
"type": {
|
|
546
|
-
"text": "
|
|
677
|
+
"text": "'any' | 'closerequest' | 'none' | ''"
|
|
547
678
|
},
|
|
548
|
-
"default": "
|
|
549
|
-
"fieldName": "
|
|
679
|
+
"default": "'any'",
|
|
680
|
+
"fieldName": "closedBy"
|
|
550
681
|
},
|
|
551
682
|
{
|
|
552
683
|
"description": "Bottom sheets resize vertically from the top edge by default.",
|
|
@@ -576,7 +707,7 @@
|
|
|
576
707
|
"fieldName": "resizeHandle"
|
|
577
708
|
},
|
|
578
709
|
{
|
|
579
|
-
"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.",
|
|
580
711
|
"name": "snap-points",
|
|
581
712
|
"type": {
|
|
582
713
|
"text": "string"
|