@surdeddd/bottom-sheet 0.23.3 → 0.24.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.
Files changed (80) hide show
  1. package/README.md +513 -525
  2. package/README.ru.md +685 -0
  3. package/dist/{BottomSheetCore-COvILxmR.d.ts → BottomSheetCore-B_r4KCQL.d.cts} +48 -12
  4. package/dist/{BottomSheetCore-CaJwHnxY.d.cts → BottomSheetCore-B_r4KCQL.d.ts} +48 -12
  5. package/dist/{BottomSheetEngine-C_1aPJsU.d.cts → BottomSheetEngine-0F7mjyvF.d.cts} +1 -1
  6. package/dist/{BottomSheetEngine-CsgCcCSO.d.ts → BottomSheetEngine-CJV_DDrM.d.ts} +1 -1
  7. package/dist/core.cjs +810 -436
  8. package/dist/core.d.cts +2 -3
  9. package/dist/core.d.ts +2 -3
  10. package/dist/core.js +810 -436
  11. package/dist/debug.d.cts +3 -3
  12. package/dist/debug.d.ts +3 -3
  13. package/dist/{default-features-BJx7J0NH.d.ts → default-features-4Xwv6aVt.d.ts} +4 -2
  14. package/dist/{default-features-CTJb8Wdk.d.cts → default-features-DX2NOxP6.d.cts} +4 -2
  15. package/dist/element.cjs +1428 -699
  16. package/dist/element.d.cts +15 -5
  17. package/dist/element.d.ts +15 -5
  18. package/dist/element.iife.global.js +2 -2
  19. package/dist/element.js +1428 -699
  20. package/dist/features.cjs +334 -190
  21. package/dist/features.d.cts +3 -4
  22. package/dist/features.d.ts +3 -4
  23. package/dist/features.js +334 -191
  24. package/dist/{index-CXN7t3rr.d.ts → index-2shlxhcG.d.cts} +3 -2
  25. package/dist/{index-BBrJJjy5.d.cts → index-CNCRQnpc.d.ts} +3 -2
  26. package/dist/index.cjs +1129 -631
  27. package/dist/index.d.cts +13 -7
  28. package/dist/index.d.ts +13 -7
  29. package/dist/index.js +1129 -632
  30. package/dist/integrations/formik.cjs +21 -10
  31. package/dist/integrations/formik.d.cts +3 -3
  32. package/dist/integrations/formik.d.ts +3 -3
  33. package/dist/integrations/formik.js +22 -11
  34. package/dist/integrations/react-hook-form.cjs +21 -12
  35. package/dist/integrations/react-hook-form.d.cts +3 -3
  36. package/dist/integrations/react-hook-form.d.ts +3 -3
  37. package/dist/integrations/react-hook-form.js +21 -12
  38. package/dist/option-keys-DItuAjUw.d.cts +6 -0
  39. package/dist/option-keys-a5DYNwwO.d.ts +6 -0
  40. package/dist/overlay.cjs +386 -189
  41. package/dist/overlay.d.cts +3 -4
  42. package/dist/overlay.d.ts +3 -4
  43. package/dist/overlay.js +386 -189
  44. package/dist/preact.d.cts +3 -4
  45. package/dist/preact.d.ts +3 -4
  46. package/dist/qwik-lib/index.qwik.cjs +1306 -671
  47. package/dist/qwik-lib/index.qwik.mjs +1306 -671
  48. package/dist/qwik.cjs +1326 -701
  49. package/dist/qwik.d.cts +14 -30
  50. package/dist/qwik.d.ts +14 -30
  51. package/dist/qwik.js +1326 -701
  52. package/dist/react.cjs +1373 -750
  53. package/dist/react.d.cts +31 -14
  54. package/dist/react.d.ts +31 -14
  55. package/dist/react.js +1375 -752
  56. package/dist/solid.cjs +1332 -727
  57. package/dist/solid.d.cts +13 -437
  58. package/dist/solid.d.ts +13 -437
  59. package/dist/solid.js +1334 -729
  60. package/dist/solid.source.jsx +1374 -751
  61. package/dist/styles.css +20 -6
  62. package/dist/svelte-core.cjs +1211 -676
  63. package/dist/svelte-core.js +1207 -677
  64. package/dist/svelte-src/BottomSheet.svelte +102 -59
  65. package/dist/svelte.cjs +1324 -707
  66. package/dist/svelte.d.cts +45 -25
  67. package/dist/svelte.d.ts +45 -25
  68. package/dist/svelte.js +1324 -707
  69. package/dist/vue.cjs +1354 -773
  70. package/dist/vue.d.cts +20 -3
  71. package/dist/vue.d.ts +20 -3
  72. package/dist/vue.js +1354 -773
  73. package/dist/webgl.cjs +38 -7
  74. package/dist/webgl.d.cts +3 -3
  75. package/dist/webgl.d.ts +3 -3
  76. package/dist/webgl.js +38 -7
  77. package/llms.txt +330 -0
  78. package/package.json +62 -42
  79. package/dist/transform-jVfAikE9.d.cts +0 -3
  80. package/dist/transform-jVfAikE9.d.ts +0 -3
package/dist/solid.d.cts CHANGED
@@ -1,451 +1,26 @@
1
1
  import { JSX } from 'solid-js';
2
-
3
- type DragFrom$1 = "handle" | "sheet" | "zones";
4
-
5
- type TransformAxis = "bottom" | "top" | "left" | "right";
6
-
7
- type LogicalAxis = "start" | "end";
8
-
9
- type SnapPoint = number | `${number}%` | "fit" | "content" | "full" | (string & {});
10
- type SnapPointDef<Id extends string = string> = {
11
- id: Id;
12
- size: SnapPoint;
13
- dragFromContent?: boolean;
14
- };
15
- type PhysicalSheetMode = TransformAxis;
16
- type LogicalSheetMode = LogicalAxis;
17
- type SheetMode = PhysicalSheetMode | LogicalSheetMode;
18
- type DragFrom = DragFrom$1;
19
- type DragSurfaceKind = "content";
20
- type ScrimPreset = "subtle" | "standard" | "monitoring" | "cinematic";
21
- type ScrimUpdate = {
22
- color?: string | null;
23
- blur?: string | null;
24
- interactive?: boolean;
25
- range?: [number, number];
26
- preset?: ScrimPreset;
27
- mode?: "full" | "above-sheet" | "off";
28
- tapToClose?: boolean;
29
- enabled?: boolean;
30
- };
31
- type ScrimOverlayPosition = "top-left" | "top-center" | "top-right" | "center-left" | "center" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right" | "sheet-top-left" | "sheet-top-center" | "sheet-top-right";
32
- type ScrimOverlayOptions = {
33
- children: HTMLElement | DocumentFragment;
34
- position?: ScrimOverlayPosition;
35
- interactive?: boolean;
36
- inset?: string;
37
- };
38
- type SheetEventMap = {
39
- "before-snap": {
40
- id: string;
41
- size: number;
42
- cancel: () => void;
43
- previousId: string;
44
- };
45
- "before-close": {
46
- reason: "programmatic" | "backdrop" | "escape" | "back";
47
- cancel: () => void;
48
- };
49
- snap: {
50
- id: string;
51
- size: number;
52
- progress: number;
53
- };
54
- progress: {
55
- value: number;
56
- size: number;
57
- };
58
- dragstart: {
59
- size: number;
60
- };
61
- drag: {
62
- size: number;
63
- delta: number;
64
- };
65
- dragend: {
66
- size: number;
67
- velocity: number;
68
- };
69
- close: void;
70
- open: {
71
- id: string;
72
- };
73
- opened: {
74
- id: string;
75
- };
76
- closed: undefined;
77
- };
78
- type CloseReason = "programmatic" | "backdrop" | "escape" | "back";
79
- type EngineOptions = {
80
- element: HTMLElement;
81
- handle?: HTMLElement;
82
- scrollContainer?: HTMLElement;
83
- backdrop?: HTMLElement;
84
- scrim?: HTMLElement;
85
- screenComponent?: HTMLElement;
86
- mode?: SheetMode;
87
- snapPoints: SnapPointDef[];
88
- allowed?: string[];
89
- initial?: string;
90
- duration?: number;
91
- easing?: (t: number) => number;
92
- respectReducedMotion?: boolean;
93
- flickVelocity?: number;
94
- dragThreshold?: number;
95
- dragFrom?: DragFrom;
96
- dragFromContent?: boolean;
97
- fitContentToSnap?: boolean;
98
- rubberBand?: boolean;
99
- backdropRange?: [number, number];
100
- screenRange?: [number, number];
101
- scrimMode?: "full" | "above-sheet" | "off";
102
- scrimColor?: string;
103
- scrimBlur?: string;
104
- scrimInteractive?: boolean;
105
- scrimTapToClose?: boolean;
106
- scrimPreset?: ScrimPreset;
107
- animation?: "spring" | "tween" | "ios-spring" | "material-bounce" | "linear" | "snappy";
108
- settleAnimation?: "waapi";
109
- spring?: {
110
- stiffness?: number;
111
- damping?: number;
112
- mass?: number;
113
- };
114
- focusTrap?: boolean;
115
- initialFocus?: string | HTMLElement | false;
116
- closeOnEscape?: boolean;
117
- lockBodyScroll?: boolean;
118
- closeOnBack?: boolean;
119
- routedTo?: string;
120
- inertSiblings?: boolean;
121
- persistent?: boolean;
122
- disableClose?: boolean;
123
- disableDrag?: boolean;
124
- closeOnRouteChange?: boolean;
125
- radius?: string | number;
126
- maxHeight?: string | number;
127
- returnFocusTo?: HTMLElement | string | (() => HTMLElement | null);
128
- persistKey?: string;
129
- autoCollapseAfter?: number;
130
- linkedSheets?: BottomSheetEngineLike[];
131
- viewTransitions?: boolean;
132
- stackEffect?: boolean;
133
- features?: EngineFeature[];
134
- };
135
-
136
- type BottomSheetEngineLike = BottomSheetCore;
137
- type EngineFeatureStage = "attach" | "post";
138
- type EngineFeatureOptions = {
139
- routedTo?: string;
140
- closeOnBack: boolean;
141
- closeOnRouteChange: boolean;
142
- persistKey?: string;
143
- autoCollapseAfter?: number;
144
- fitContentToSnap: boolean;
145
- settleAnimation?: "waapi";
146
- };
147
- type EngineFeatureContext = {
148
- element: HTMLElement;
149
- scrollContainer?: HTMLElement;
150
- sheetId: string;
151
- options: EngineFeatureOptions;
152
- isDestroyed: () => boolean;
153
- isDragging: () => boolean;
154
- isAnimating: () => boolean;
155
- isTopSheet: () => boolean;
156
- isVerticalAxis: () => boolean;
157
- getSize: () => number;
158
- getActiveId: () => string;
159
- getAllowedIds: () => string[];
160
- allowedIdsBySize: () => string[];
161
- getMaxAxisSize: () => number;
162
- resolveSnap: (id: string) => {
163
- id: string;
164
- size: number;
165
- } | null;
166
- resolveActiveSnap: () => {
167
- id: string;
168
- size: number;
169
- } | null;
170
- setSize: (size: number) => void;
171
- setMaxAxisSize: (size: number) => void;
172
- applySize: (size: number) => void;
173
- recomputeSnaps: () => void;
174
- newCycle: () => void;
175
- cancelInFlight: () => void;
176
- resyncAfterResize: () => void;
177
- snapTo: (id: string) => void;
178
- close: (reason?: CloseReason) => Promise<void>;
179
- attachDragSurface: (surface: HTMLElement, kind: DragSurfaceKind) => (() => void) | void;
180
- on: <K extends keyof SheetEventMap>(event: K, fn: (payload: SheetEventMap[K]) => void) => () => void;
181
- addTeardown: (fn: (() => void) | null | undefined) => void;
182
- };
183
- type EngineFeature = {
184
- name: string;
185
- stage?: EngineFeatureStage;
186
- install: (ctx: EngineFeatureContext) => (() => void) | void;
187
- };
188
- type TeardownScope = {
189
- add: (fn: (() => void) | null | undefined) => void;
190
- };
191
- type Plugin = {
192
- name: string;
193
- install: (engine: BottomSheetCore, scope: TeardownScope) => void | (() => void);
194
- };
195
- type EngineState = {
196
- size: number;
197
- activeId: string;
198
- isDragging: boolean;
199
- isAnimating: boolean;
200
- progress: number;
201
- };
202
-
203
- type AnchorAnimationPreset = "fade" | "scale" | "slide" | "pop" | "none";
204
- type AnchorAnimationSpec = AnchorAnimationPreset | {
205
- preset?: AnchorAnimationPreset;
206
- enter?: Keyframe[];
207
- exit?: Keyframe[];
208
- duration?: number;
209
- easing?: string;
210
- respectReducedMotion?: boolean;
211
- };
212
-
213
- type AnchorState = {
214
- activeId: string;
215
- size: number;
216
- progress: number;
217
- };
218
- type AnchorPosition = ScrimOverlayPosition | "dock-bottom" | "dock-top";
219
- type AnchorOptions = {
220
- element: HTMLElement;
221
- position?: AnchorPosition;
222
- inset?: string;
223
- showOn?: string[] | ((state: AnchorState) => boolean);
224
- fadeRange?: [number, number];
225
- interactive?: boolean;
226
- animation?: AnchorAnimationSpec;
227
- };
228
-
229
- type ScrimStageDef = {
230
- id?: string;
231
- for?: string | string[];
232
- forRange?: [number, number];
233
- element: HTMLElement;
234
- position?: ScrimOverlayPosition;
235
- inset?: string;
236
- interactive?: boolean;
237
- animation?: AnchorAnimationSpec;
238
- };
239
- type ScrimStagesOptions = {
240
- stages: ScrimStageDef[];
241
- position?: ScrimOverlayPosition;
242
- inset?: string;
243
- interactive?: boolean;
244
- animation?: AnchorAnimationSpec;
245
- };
246
-
247
- type Listener<K extends keyof SheetEventMap> = (payload: SheetEventMap[K]) => void;
248
- declare class BottomSheetCore {
249
- private id;
250
- private element;
251
- private handle;
252
- private scrollContainer?;
253
- private backdrop?;
254
- private screenComponent?;
255
- private scrimParent;
256
- private mode;
257
- private flickVelocity;
258
- private dragThreshold;
259
- private dragFromMode;
260
- private dragFromContentDefault;
261
- private rubberBandEnabled;
262
- private scrim;
263
- private aria;
264
- private animation;
265
- private lifecycle;
266
- private closeOnBack;
267
- private routedTo;
268
- private fitContentToSnap;
269
- private settleAnimation;
270
- private persistent;
271
- private disableCloseFlag;
272
- private disableDragFlag;
273
- private closeOnRouteChange;
274
- private maxHeight;
275
- private maxHeightDeps;
276
- private snapPointsRaw;
277
- private snaps;
278
- private activeId;
279
- private size;
280
- private gesture;
281
- private contentGesture;
282
- private detachSheetGesture;
283
- private detachSliderKeyboard;
284
- private rootEl;
285
- private destroyed;
286
- private restClosed;
287
- private currentViewTransition;
288
- private currentAbort;
289
- private sizeWriteSentinel;
290
- private progressWriteSentinel;
291
- private isTopSheet;
292
- private opening;
293
- private promotedForOpen;
294
- private allowOvershoot;
295
- private progressPayload;
296
- private dragContextBuf;
297
- private bus;
298
- private persistKey;
299
- private linkedSheets;
300
- private scrollCache;
301
- private teardowns;
302
- private anchors;
303
- private anchorHost;
304
- private stackZ;
305
- private detachScrimStages;
306
- private stackEffectEnabled;
307
- private stackEffectPrimed;
308
- private fitDeps;
309
- private transformTemplate;
310
- private featureList;
311
- private featureCtx;
312
- constructor(opts: EngineOptions);
313
- private buildFeatureContext;
314
- private runFeatureStage;
315
- private warnOrphanFeatureOptions;
316
- get state(): EngineState;
317
- on<K extends keyof SheetEventMap>(event: K, fn: Listener<K>): () => void;
318
- use(plugin: Plugin): this;
319
- setLinkedSheets(sheets: BottomSheetCore[]): void;
320
- getAllowedIds(): string[];
321
- getResolvedSnaps(): readonly {
322
- id: string;
323
- size: number;
324
- }[];
325
- snapTo(id: string, velocityOrOpts?: number | {
326
- velocity?: number;
327
- signal?: AbortSignal;
328
- }, _skipBeforeSnap?: boolean): Promise<void>;
329
- private completeSnap;
330
- private setRestClosed;
331
- private emitOpenSequence;
332
- private emitCloseSequence;
333
- dragTo(targetSize: number, velocityOrOpts?: number | {
334
- velocity?: number;
335
- signal?: AbortSignal;
336
- }): Promise<void>;
337
- open(id?: string): Promise<void>;
338
- close(reason?: CloseReason): Promise<void>;
339
- canDismiss(): boolean;
340
- setPersistent(value: boolean): void;
341
- setDisableClose(value: boolean): void;
342
- setDisableDrag(value: boolean): void;
343
- setDragFromContent(value: boolean): void;
344
- setDragFrom(mode: DragFrom$1): void;
345
- getDragFrom(): DragFrom$1;
346
- setMode(mode: SheetMode): void;
347
- getMode(): PhysicalSheetMode;
348
- isTop(): boolean;
349
- depth(): number;
350
- expand(): Promise<void>;
351
- collapse(): Promise<void>;
352
- setRadius(r: string | number): void;
353
- setMaxHeight(h: string | number): void;
354
- setAllowed(ids: string[], snap?: string): void;
355
- setBackdropRange(range: [number, number]): void;
356
- setScreenRange(range: [number, number]): void;
357
- setScrimColor(color: string | undefined | null): void;
358
- setScrimBlur(blur: string | undefined | null): void;
359
- setScrimInteractive(interactive: boolean): void;
360
- setScrim(opts: ScrimUpdate): void;
361
- setScrimMode(mode: "full" | "above-sheet" | "off"): void;
362
- setScrimTapToClose(enabled: boolean): void;
363
- setScrimEnabled(enabled: boolean): void;
364
- setScrimOverlay(opts: ScrimOverlayOptions): () => void;
365
- addAnchor(opts: AnchorOptions): () => void;
366
- setScrimStages(opts: ScrimStagesOptions | null): () => void;
367
- getScrimState(): {
368
- mode: "full" | "above-sheet" | "off";
369
- enabled: boolean;
370
- };
371
- setSnapPoints(points: EngineOptions["snapPoints"], allowed?: string[]): void;
372
- recompute(): void;
373
- private healActiveSnap;
374
- destroy(): void;
375
- private emit;
376
- private newCycle;
377
- private emitBeforeSnap;
378
- private emitBeforeClose;
379
- private applyAutoAriaLabelledBy;
380
- private recomputeSnaps;
381
- private auditDuplicateSnapIds;
382
- private getAllowedRange;
383
- private allowedIdsBySize;
384
- private updateAriaSlider;
385
- private registerInStack;
386
- private applyStackDepth;
387
- private buildGestureDeps;
388
- private isContentDragAllowed;
389
- private decideContentDrag;
390
- private attachDragSurface;
391
- private sheetDragSurface;
392
- private canStartSheetDrag;
393
- private mountSheetGesture;
394
- private attach;
395
- private attachFeatures;
396
- private mountSliderKeyboard;
397
- private settleAfterDrag;
398
- private isDraggingAny;
399
- private clearWillChangeIfIdle;
400
- private haptic;
401
- private applySize;
402
- private computeProgress;
403
- private handleOpen;
404
- private resyncAfterResize;
405
- private handleClose;
406
- }
407
-
408
- declare class BottomSheetEngine extends BottomSheetCore {
409
- constructor(opts: EngineOptions);
410
- }
411
-
412
- type TeleportTarget = HTMLElement | string | null | undefined;
2
+ import { BottomSheetEngine } from './index.cjs';
3
+ import { TeleportTarget } from './index.cjs';
4
+ import { EngineConfig } from './index.cjs';
5
+ import { e as SnapPointDef, d as EngineState } from './BottomSheetCore-B_r4KCQL.cjs';
6
+ import { SheetEventMap } from './core.cjs';
7
+ export { f as EngineOptions, g as SheetMode, h as SnapPoint } from './BottomSheetCore-B_r4KCQL.cjs';
413
8
 
414
9
  /** @jsxImportSource solid-js */
415
10
 
416
- type BottomSheetProps<TId extends string = string> = {
11
+ type BottomSheetProps<TId extends string = string> = Omit<Partial<EngineConfig>, "snapPoints" | "allowed" | "initial"> & {
417
12
  snapPoints: SnapPointDef<TId>[] | ReadonlyArray<SnapPointDef<TId>>;
418
13
  allowed?: TId[] | ReadonlyArray<TId>;
419
14
  initial?: TId;
420
- mode?: SheetMode;
421
- animation?: "spring" | "tween" | "ios-spring" | "material-bounce" | "linear" | "snappy";
422
- spring?: {
423
- stiffness?: number;
424
- damping?: number;
425
- mass?: number;
426
- };
427
- focusTrap?: boolean;
428
- closeOnEscape?: boolean;
429
- closeOnBack?: boolean;
430
- lockBodyScroll?: boolean;
431
- rubberBand?: boolean;
432
- backdropRange?: [number, number];
433
- radius?: string | number;
434
- maxHeight?: string | number;
435
- persistent?: boolean;
436
- disableClose?: boolean;
437
- disableDrag?: boolean;
438
- dragFrom?: EngineOptions["dragFrom"];
439
- dragFromContent?: boolean;
440
- fitContentToSnap?: boolean;
441
- closeOnRouteChange?: boolean;
442
- stackEffect?: boolean;
443
15
  teleport?: boolean;
444
16
  teleportTo?: TeleportTarget;
445
- returnFocusTo?: EngineOptions["returnFocusTo"];
446
17
  backdrop?: boolean;
447
18
  closeOnBackdrop?: boolean;
448
19
  ariaLabel?: string;
20
+ handleLabel?: string;
21
+ contentLabel?: string;
22
+ open?: boolean;
23
+ onOpenChange?: (open: boolean) => void;
449
24
  onSnap?: (id: TId) => void;
450
25
  onBeforeSnap?: (payload: SheetEventMap["before-snap"]) => void;
451
26
  onBeforeClose?: (payload: SheetEventMap["before-close"]) => void;
@@ -470,4 +45,5 @@ type BottomSheetProps<TId extends string = string> = {
470
45
  };
471
46
  declare const BottomSheet: <TId extends string = string>(props: BottomSheetProps<TId>) => JSX.Element;
472
47
 
473
- export { BottomSheet, type BottomSheetProps, type EngineOptions, type EngineState, type SheetMode, type SnapPoint, type SnapPointDef };
48
+ export { BottomSheet, EngineState, SnapPointDef };
49
+ export type { BottomSheetProps };