@surdeddd/bottom-sheet 0.8.2 → 0.9.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 (46) hide show
  1. package/dist/{BottomSheetEngine-7BDK2OWX.d.cts → BottomSheetEngine-BcyruNP1.d.cts} +12 -6
  2. package/dist/{BottomSheetEngine-BFTb0-4Z.d.ts → BottomSheetEngine-CBRcBwV-.d.ts} +12 -6
  3. package/dist/element.cjs +530 -349
  4. package/dist/element.d.cts +2 -1
  5. package/dist/element.d.ts +2 -1
  6. package/dist/element.iife.global.js +2 -2
  7. package/dist/element.js +530 -349
  8. package/dist/index.cjs +438 -294
  9. package/dist/index.d.cts +3 -3
  10. package/dist/index.d.ts +3 -3
  11. package/dist/index.js +438 -294
  12. package/dist/integrations/formik.d.cts +1 -1
  13. package/dist/integrations/formik.d.ts +1 -1
  14. package/dist/integrations/react-hook-form.d.cts +1 -1
  15. package/dist/integrations/react-hook-form.d.ts +1 -1
  16. package/dist/overlay.cjs +160 -96
  17. package/dist/overlay.d.cts +2 -0
  18. package/dist/overlay.d.ts +2 -0
  19. package/dist/overlay.js +160 -96
  20. package/dist/preact.d.cts +1 -1
  21. package/dist/preact.d.ts +1 -1
  22. package/dist/qwik.cjs +387 -211
  23. package/dist/qwik.d.cts +4 -3
  24. package/dist/qwik.d.ts +4 -3
  25. package/dist/qwik.js +387 -211
  26. package/dist/react.cjs +472 -296
  27. package/dist/react.d.cts +3 -2
  28. package/dist/react.d.ts +3 -2
  29. package/dist/react.js +472 -296
  30. package/dist/solid.cjs +417 -215
  31. package/dist/solid.d.cts +21 -7
  32. package/dist/solid.d.ts +21 -7
  33. package/dist/solid.js +417 -215
  34. package/dist/solid.source.jsx +412 -209
  35. package/dist/svelte-core.cjs +328 -209
  36. package/dist/svelte-core.js +328 -209
  37. package/dist/svelte-src/BottomSheet.svelte +56 -0
  38. package/dist/svelte.cjs +365 -210
  39. package/dist/svelte.d.cts +4 -0
  40. package/dist/svelte.d.ts +4 -0
  41. package/dist/svelte.js +365 -210
  42. package/dist/vue.cjs +358 -211
  43. package/dist/vue.d.cts +6 -0
  44. package/dist/vue.d.ts +6 -0
  45. package/dist/vue.js +358 -211
  46. package/package.json +6 -6
package/dist/solid.d.cts CHANGED
@@ -99,7 +99,7 @@ type EngineOptions = {
99
99
  mass?: number;
100
100
  };
101
101
  focusTrap?: boolean;
102
- initialFocus?: string | HTMLElement;
102
+ initialFocus?: string | HTMLElement | false;
103
103
  closeOnEscape?: boolean;
104
104
  lockBodyScroll?: boolean;
105
105
  closeOnBack?: boolean;
@@ -203,6 +203,7 @@ declare class BottomSheetEngine {
203
203
  private disableDragFlag;
204
204
  private closeOnRouteChange;
205
205
  private maxHeightCap;
206
+ private maxHeightRaw;
206
207
  private snapPointsRaw;
207
208
  private snaps;
208
209
  private activeId;
@@ -230,6 +231,7 @@ declare class BottomSheetEngine {
230
231
  private detachScrimStages;
231
232
  private stackEffectEnabled;
232
233
  private stackEffectPrimed;
234
+ private fitDeps;
233
235
  private transformTemplate;
234
236
  constructor(opts: EngineOptions);
235
237
  get state(): EngineState;
@@ -241,6 +243,9 @@ declare class BottomSheetEngine {
241
243
  velocity?: number;
242
244
  signal?: AbortSignal;
243
245
  }, _skipBeforeSnap?: boolean): Promise<void>;
246
+ private completeSnap;
247
+ private emitOpenSequence;
248
+ private emitCloseSequence;
244
249
  dragTo(targetSize: number, velocityOrOpts?: number | {
245
250
  velocity?: number;
246
251
  signal?: AbortSignal;
@@ -248,12 +253,16 @@ declare class BottomSheetEngine {
248
253
  open(id?: string): Promise<void>;
249
254
  close(reason?: CloseReason): Promise<void>;
250
255
  canDismiss(): boolean;
256
+ setPersistent(value: boolean): void;
257
+ setDisableClose(value: boolean): void;
258
+ setDisableDrag(value: boolean): void;
251
259
  isTop(): boolean;
252
260
  depth(): number;
253
261
  expand(): Promise<void>;
254
262
  collapse(): Promise<void>;
255
263
  setRadius(r: string | number): void;
256
264
  setMaxHeight(h: string | number): void;
265
+ private resolveMaxHeightCap;
257
266
  private clampToMaxHeight;
258
267
  setAllowed(ids: string[], snap?: string): void;
259
268
  setBackdropRange(range: [number, number]): void;
@@ -274,11 +283,6 @@ declare class BottomSheetEngine {
274
283
  };
275
284
  setSnapPoints(points: EngineOptions["snapPoints"], allowed?: string[]): void;
276
285
  recompute(): void;
277
- private contentTargets;
278
- private measureSheetNatural;
279
- private measureFitSize;
280
- private containingExtent;
281
- private installFitObserver;
282
286
  destroy(): void;
283
287
  private emit;
284
288
  private newCycle;
@@ -286,6 +290,7 @@ declare class BottomSheetEngine {
286
290
  private emitBeforeClose;
287
291
  private applyAutoAriaLabelledBy;
288
292
  private recomputeSnaps;
293
+ private auditDuplicateSnapIds;
289
294
  private getAllowedRange;
290
295
  private allowedIdsBySize;
291
296
  private updateAriaSlider;
@@ -294,6 +299,7 @@ declare class BottomSheetEngine {
294
299
  private attach;
295
300
  private attachFeatures;
296
301
  private settleAfterDrag;
302
+ private clearWillChangeIfIdle;
297
303
  private haptic;
298
304
  private applySize;
299
305
  private computeProgress;
@@ -302,6 +308,8 @@ declare class BottomSheetEngine {
302
308
  private handleClose;
303
309
  }
304
310
 
311
+ type TeleportTarget = HTMLElement | string | null | undefined;
312
+
305
313
  /** @jsxImportSource solid-js */
306
314
 
307
315
  type BottomSheetProps<TId extends string = string> = {
@@ -327,17 +335,23 @@ type BottomSheetProps<TId extends string = string> = {
327
335
  disableClose?: boolean;
328
336
  disableDrag?: boolean;
329
337
  closeOnRouteChange?: boolean;
330
- returnFocusTo?: string;
338
+ stackEffect?: boolean;
339
+ teleport?: boolean;
340
+ teleportTo?: TeleportTarget;
341
+ returnFocusTo?: EngineOptions["returnFocusTo"];
331
342
  backdrop?: boolean;
332
343
  closeOnBackdrop?: boolean;
333
344
  ariaLabel?: string;
334
345
  onSnap?: (id: TId) => void;
346
+ onBeforeSnap?: (payload: SheetEventMap["before-snap"]) => void;
335
347
  onChange?: (state: EngineState & {
336
348
  activeId: TId;
337
349
  }) => void;
338
350
  engineRef?: (engine: BottomSheetEngine | null) => void;
339
351
  header?: JSX.Element;
340
352
  footer?: JSX.Element;
353
+ leftButton?: JSX.Element;
354
+ rightButton?: JSX.Element;
341
355
  screen?: JSX.Element;
342
356
  children?: JSX.Element;
343
357
  };
package/dist/solid.d.ts CHANGED
@@ -99,7 +99,7 @@ type EngineOptions = {
99
99
  mass?: number;
100
100
  };
101
101
  focusTrap?: boolean;
102
- initialFocus?: string | HTMLElement;
102
+ initialFocus?: string | HTMLElement | false;
103
103
  closeOnEscape?: boolean;
104
104
  lockBodyScroll?: boolean;
105
105
  closeOnBack?: boolean;
@@ -203,6 +203,7 @@ declare class BottomSheetEngine {
203
203
  private disableDragFlag;
204
204
  private closeOnRouteChange;
205
205
  private maxHeightCap;
206
+ private maxHeightRaw;
206
207
  private snapPointsRaw;
207
208
  private snaps;
208
209
  private activeId;
@@ -230,6 +231,7 @@ declare class BottomSheetEngine {
230
231
  private detachScrimStages;
231
232
  private stackEffectEnabled;
232
233
  private stackEffectPrimed;
234
+ private fitDeps;
233
235
  private transformTemplate;
234
236
  constructor(opts: EngineOptions);
235
237
  get state(): EngineState;
@@ -241,6 +243,9 @@ declare class BottomSheetEngine {
241
243
  velocity?: number;
242
244
  signal?: AbortSignal;
243
245
  }, _skipBeforeSnap?: boolean): Promise<void>;
246
+ private completeSnap;
247
+ private emitOpenSequence;
248
+ private emitCloseSequence;
244
249
  dragTo(targetSize: number, velocityOrOpts?: number | {
245
250
  velocity?: number;
246
251
  signal?: AbortSignal;
@@ -248,12 +253,16 @@ declare class BottomSheetEngine {
248
253
  open(id?: string): Promise<void>;
249
254
  close(reason?: CloseReason): Promise<void>;
250
255
  canDismiss(): boolean;
256
+ setPersistent(value: boolean): void;
257
+ setDisableClose(value: boolean): void;
258
+ setDisableDrag(value: boolean): void;
251
259
  isTop(): boolean;
252
260
  depth(): number;
253
261
  expand(): Promise<void>;
254
262
  collapse(): Promise<void>;
255
263
  setRadius(r: string | number): void;
256
264
  setMaxHeight(h: string | number): void;
265
+ private resolveMaxHeightCap;
257
266
  private clampToMaxHeight;
258
267
  setAllowed(ids: string[], snap?: string): void;
259
268
  setBackdropRange(range: [number, number]): void;
@@ -274,11 +283,6 @@ declare class BottomSheetEngine {
274
283
  };
275
284
  setSnapPoints(points: EngineOptions["snapPoints"], allowed?: string[]): void;
276
285
  recompute(): void;
277
- private contentTargets;
278
- private measureSheetNatural;
279
- private measureFitSize;
280
- private containingExtent;
281
- private installFitObserver;
282
286
  destroy(): void;
283
287
  private emit;
284
288
  private newCycle;
@@ -286,6 +290,7 @@ declare class BottomSheetEngine {
286
290
  private emitBeforeClose;
287
291
  private applyAutoAriaLabelledBy;
288
292
  private recomputeSnaps;
293
+ private auditDuplicateSnapIds;
289
294
  private getAllowedRange;
290
295
  private allowedIdsBySize;
291
296
  private updateAriaSlider;
@@ -294,6 +299,7 @@ declare class BottomSheetEngine {
294
299
  private attach;
295
300
  private attachFeatures;
296
301
  private settleAfterDrag;
302
+ private clearWillChangeIfIdle;
297
303
  private haptic;
298
304
  private applySize;
299
305
  private computeProgress;
@@ -302,6 +308,8 @@ declare class BottomSheetEngine {
302
308
  private handleClose;
303
309
  }
304
310
 
311
+ type TeleportTarget = HTMLElement | string | null | undefined;
312
+
305
313
  /** @jsxImportSource solid-js */
306
314
 
307
315
  type BottomSheetProps<TId extends string = string> = {
@@ -327,17 +335,23 @@ type BottomSheetProps<TId extends string = string> = {
327
335
  disableClose?: boolean;
328
336
  disableDrag?: boolean;
329
337
  closeOnRouteChange?: boolean;
330
- returnFocusTo?: string;
338
+ stackEffect?: boolean;
339
+ teleport?: boolean;
340
+ teleportTo?: TeleportTarget;
341
+ returnFocusTo?: EngineOptions["returnFocusTo"];
331
342
  backdrop?: boolean;
332
343
  closeOnBackdrop?: boolean;
333
344
  ariaLabel?: string;
334
345
  onSnap?: (id: TId) => void;
346
+ onBeforeSnap?: (payload: SheetEventMap["before-snap"]) => void;
335
347
  onChange?: (state: EngineState & {
336
348
  activeId: TId;
337
349
  }) => void;
338
350
  engineRef?: (engine: BottomSheetEngine | null) => void;
339
351
  header?: JSX.Element;
340
352
  footer?: JSX.Element;
353
+ leftButton?: JSX.Element;
354
+ rightButton?: JSX.Element;
341
355
  screen?: JSX.Element;
342
356
  children?: JSX.Element;
343
357
  };