@surdeddd/bottom-sheet 0.22.1 → 0.23.1

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.
@@ -1502,13 +1502,14 @@ class AnimationRunner {
1502
1502
  });
1503
1503
  let stopped = false;
1504
1504
  let auxRaf = 0;
1505
- const start = performance.now();
1506
1505
  const lastIdx = samples.values.length - 1;
1507
1506
  const auxTick = () => {
1508
1507
  if (stopped) return;
1509
- const elapsed = performance.now() - start;
1510
- const idx = Math.min(Math.floor(elapsed / samples.stepMs), lastIdx);
1511
- applyAux(samples.values[idx]);
1508
+ const at = Math.min((Number(anim.currentTime) || 0) / samples.stepMs, lastIdx);
1509
+ const idx = Math.floor(at);
1510
+ const from = samples.values[idx];
1511
+ const to = samples.values[Math.min(idx + 1, lastIdx)];
1512
+ applyAux(from + (to - from) * (at - idx));
1512
1513
  auxRaf = requestAnimationFrame(auxTick);
1513
1514
  };
1514
1515
  auxRaf = requestAnimationFrame(auxTick);
@@ -2747,7 +2748,11 @@ class BottomSheetCore {
2747
2748
  getSize: () => this.size,
2748
2749
  isDragging: () => this.isDraggingAny(),
2749
2750
  applyAux: (size) => this.applySize(size, true),
2750
- getTransformFor: (size) => this.transformTemplate(this.snaps.getMaxAxisSize() - size)
2751
+ getTransformFor: (size) => {
2752
+ const cap = this.snaps.getMaxAxisSize();
2753
+ const shown = cap > 0 && !this.allowOvershoot ? Math.min(size, cap) : size;
2754
+ return this.transformTemplate(cap - shown);
2755
+ }
2751
2756
  }, resolved.animation);
2752
2757
  this.lifecycle = new LifecycleController({
2753
2758
  element: this.element,
@@ -4226,6 +4231,9 @@ function visualViewportFeature() {
4226
4231
  };
4227
4232
  }
4228
4233
  const INSET_VAR = "--bs-content-inset";
4234
+ const SIZE_VAR = "--bs-size";
4235
+ const CAP_VAR = "--bs-max-size";
4236
+ const LIFT_VAR = "--bs-footer-lift-max";
4229
4237
  const FIT_ATTR = "data-bs-fit-content";
4230
4238
  function contentFitFeature() {
4231
4239
  return {
@@ -4239,6 +4247,8 @@ function contentFitFeature() {
4239
4247
  let inset = 0;
4240
4248
  let unpaddedMax = -1;
4241
4249
  let top = 0;
4250
+ let resting = false;
4251
+ const put = (name, px) => sheet.style.setProperty(name, `${px}px`);
4242
4252
  const hiddenAt = (size) => sheet.dataset.mode === "bottom" ? Math.max(0, ctx.getMaxAxisSize() - size) : 0;
4243
4253
  const follow = (size) => {
4244
4254
  if (unpaddedMax < 0) {
@@ -4254,19 +4264,34 @@ function contentFitFeature() {
4254
4264
  const settle = () => {
4255
4265
  if (ctx.isDestroyed()) return;
4256
4266
  const size = ctx.getSize();
4257
- unpaddedMax = -1;
4258
- follow(size);
4267
+ if (!resting) {
4268
+ unpaddedMax = -1;
4269
+ follow(size);
4270
+ }
4259
4271
  inset = hiddenAt(size);
4260
- sheet.style.setProperty(INSET_VAR, `${inset}px`);
4272
+ put(INSET_VAR, inset);
4273
+ put(SIZE_VAR, size);
4274
+ put(CAP_VAR, ctx.getMaxAxisSize());
4275
+ if (!resting) {
4276
+ resting = true;
4277
+ sheet.setAttribute(FIT_ATTR, "rest");
4278
+ }
4261
4279
  unpaddedMax = -1;
4262
4280
  };
4281
+ const move = (size) => {
4282
+ if (resting) {
4283
+ resting = false;
4284
+ sheet.setAttribute(FIT_ATTR, "moving");
4285
+ put(LIFT_VAR, scroller.offsetHeight);
4286
+ }
4287
+ follow(size);
4288
+ };
4263
4289
  const moving = () => ctx.isAnimating() || ctx.isDragging();
4264
4290
  const whenIdle = () => {
4265
4291
  if (!moving()) settle();
4266
4292
  };
4267
- sheet.setAttribute(FIT_ATTR, "");
4268
4293
  settle();
4269
- const offProgress = ctx.on("progress", (p) => moving() ? follow(p.size) : settle());
4294
+ const offProgress = ctx.on("progress", (p) => moving() ? move(p.size) : settle());
4270
4295
  const offSnap = ctx.on("snap", settle);
4271
4296
  const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(whenIdle);
4272
4297
  observer?.observe(document.documentElement);
@@ -4277,7 +4302,13 @@ function contentFitFeature() {
4277
4302
  observer?.disconnect();
4278
4303
  window.removeEventListener("orientationchange", whenIdle);
4279
4304
  sheet.removeAttribute(FIT_ATTR);
4280
- sheet.style.removeProperty(INSET_VAR);
4305
+ for (const name of [
4306
+ INSET_VAR,
4307
+ CAP_VAR,
4308
+ LIFT_VAR
4309
+ ]) {
4310
+ sheet.style.removeProperty(name);
4311
+ }
4281
4312
  };
4282
4313
  }
4283
4314
  };
package/dist/qwik.cjs CHANGED
@@ -1490,13 +1490,17 @@ var AnimationRunner = class {
1490
1490
  });
1491
1491
  let stopped = false;
1492
1492
  let auxRaf = 0;
1493
- const start = performance.now();
1494
1493
  const lastIdx = samples.values.length - 1;
1495
1494
  const auxTick = () => {
1496
1495
  if (stopped) return;
1497
- const elapsed = performance.now() - start;
1498
- const idx = Math.min(Math.floor(elapsed / samples.stepMs), lastIdx);
1499
- applyAux(samples.values[idx]);
1496
+ const at = Math.min(
1497
+ (Number(anim.currentTime) || 0) / samples.stepMs,
1498
+ lastIdx
1499
+ );
1500
+ const idx = Math.floor(at);
1501
+ const from = samples.values[idx];
1502
+ const to = samples.values[Math.min(idx + 1, lastIdx)];
1503
+ applyAux(from + (to - from) * (at - idx));
1500
1504
  auxRaf = requestAnimationFrame(auxTick);
1501
1505
  };
1502
1506
  auxRaf = requestAnimationFrame(auxTick);
@@ -2708,7 +2712,11 @@ var BottomSheetCore = class {
2708
2712
  getSize: () => this.size,
2709
2713
  isDragging: () => this.isDraggingAny(),
2710
2714
  applyAux: (size) => this.applySize(size, true),
2711
- getTransformFor: (size) => this.transformTemplate(this.snaps.getMaxAxisSize() - size)
2715
+ getTransformFor: (size) => {
2716
+ const cap = this.snaps.getMaxAxisSize();
2717
+ const shown = cap > 0 && !this.allowOvershoot ? Math.min(size, cap) : size;
2718
+ return this.transformTemplate(cap - shown);
2719
+ }
2712
2720
  },
2713
2721
  resolved.animation
2714
2722
  );
@@ -4240,6 +4248,9 @@ function visualViewportFeature() {
4240
4248
 
4241
4249
  // src/core/features/content-fit.ts
4242
4250
  var INSET_VAR = "--bs-content-inset";
4251
+ var SIZE_VAR = "--bs-size";
4252
+ var CAP_VAR = "--bs-max-size";
4253
+ var LIFT_VAR = "--bs-footer-lift-max";
4243
4254
  var FIT_ATTR = "data-bs-fit-content";
4244
4255
  function contentFitFeature() {
4245
4256
  return {
@@ -4253,6 +4264,8 @@ function contentFitFeature() {
4253
4264
  let inset = 0;
4254
4265
  let unpaddedMax = -1;
4255
4266
  let top = 0;
4267
+ let resting = false;
4268
+ const put = (name, px) => sheet.style.setProperty(name, `${px}px`);
4256
4269
  const hiddenAt = (size) => sheet.dataset.mode === "bottom" ? Math.max(0, ctx.getMaxAxisSize() - size) : 0;
4257
4270
  const follow = (size) => {
4258
4271
  if (unpaddedMax < 0) {
@@ -4268,21 +4281,36 @@ function contentFitFeature() {
4268
4281
  const settle = () => {
4269
4282
  if (ctx.isDestroyed()) return;
4270
4283
  const size = ctx.getSize();
4271
- unpaddedMax = -1;
4272
- follow(size);
4284
+ if (!resting) {
4285
+ unpaddedMax = -1;
4286
+ follow(size);
4287
+ }
4273
4288
  inset = hiddenAt(size);
4274
- sheet.style.setProperty(INSET_VAR, `${inset}px`);
4289
+ put(INSET_VAR, inset);
4290
+ put(SIZE_VAR, size);
4291
+ put(CAP_VAR, ctx.getMaxAxisSize());
4292
+ if (!resting) {
4293
+ resting = true;
4294
+ sheet.setAttribute(FIT_ATTR, "rest");
4295
+ }
4275
4296
  unpaddedMax = -1;
4276
4297
  };
4298
+ const move = (size) => {
4299
+ if (resting) {
4300
+ resting = false;
4301
+ sheet.setAttribute(FIT_ATTR, "moving");
4302
+ put(LIFT_VAR, scroller.offsetHeight);
4303
+ }
4304
+ follow(size);
4305
+ };
4277
4306
  const moving = () => ctx.isAnimating() || ctx.isDragging();
4278
4307
  const whenIdle = () => {
4279
4308
  if (!moving()) settle();
4280
4309
  };
4281
- sheet.setAttribute(FIT_ATTR, "");
4282
4310
  settle();
4283
4311
  const offProgress = ctx.on(
4284
4312
  "progress",
4285
- (p) => moving() ? follow(p.size) : settle()
4313
+ (p) => moving() ? move(p.size) : settle()
4286
4314
  );
4287
4315
  const offSnap = ctx.on("snap", settle);
4288
4316
  const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(whenIdle);
@@ -4294,7 +4322,9 @@ function contentFitFeature() {
4294
4322
  observer?.disconnect();
4295
4323
  window.removeEventListener("orientationchange", whenIdle);
4296
4324
  sheet.removeAttribute(FIT_ATTR);
4297
- sheet.style.removeProperty(INSET_VAR);
4325
+ for (const name of [INSET_VAR, CAP_VAR, LIFT_VAR]) {
4326
+ sheet.style.removeProperty(name);
4327
+ }
4298
4328
  };
4299
4329
  }
4300
4330
  };
package/dist/qwik.js CHANGED
@@ -1488,13 +1488,17 @@ var AnimationRunner = class {
1488
1488
  });
1489
1489
  let stopped = false;
1490
1490
  let auxRaf = 0;
1491
- const start = performance.now();
1492
1491
  const lastIdx = samples.values.length - 1;
1493
1492
  const auxTick = () => {
1494
1493
  if (stopped) return;
1495
- const elapsed = performance.now() - start;
1496
- const idx = Math.min(Math.floor(elapsed / samples.stepMs), lastIdx);
1497
- applyAux(samples.values[idx]);
1494
+ const at = Math.min(
1495
+ (Number(anim.currentTime) || 0) / samples.stepMs,
1496
+ lastIdx
1497
+ );
1498
+ const idx = Math.floor(at);
1499
+ const from = samples.values[idx];
1500
+ const to = samples.values[Math.min(idx + 1, lastIdx)];
1501
+ applyAux(from + (to - from) * (at - idx));
1498
1502
  auxRaf = requestAnimationFrame(auxTick);
1499
1503
  };
1500
1504
  auxRaf = requestAnimationFrame(auxTick);
@@ -2706,7 +2710,11 @@ var BottomSheetCore = class {
2706
2710
  getSize: () => this.size,
2707
2711
  isDragging: () => this.isDraggingAny(),
2708
2712
  applyAux: (size) => this.applySize(size, true),
2709
- getTransformFor: (size) => this.transformTemplate(this.snaps.getMaxAxisSize() - size)
2713
+ getTransformFor: (size) => {
2714
+ const cap = this.snaps.getMaxAxisSize();
2715
+ const shown = cap > 0 && !this.allowOvershoot ? Math.min(size, cap) : size;
2716
+ return this.transformTemplate(cap - shown);
2717
+ }
2710
2718
  },
2711
2719
  resolved.animation
2712
2720
  );
@@ -4238,6 +4246,9 @@ function visualViewportFeature() {
4238
4246
 
4239
4247
  // src/core/features/content-fit.ts
4240
4248
  var INSET_VAR = "--bs-content-inset";
4249
+ var SIZE_VAR = "--bs-size";
4250
+ var CAP_VAR = "--bs-max-size";
4251
+ var LIFT_VAR = "--bs-footer-lift-max";
4241
4252
  var FIT_ATTR = "data-bs-fit-content";
4242
4253
  function contentFitFeature() {
4243
4254
  return {
@@ -4251,6 +4262,8 @@ function contentFitFeature() {
4251
4262
  let inset = 0;
4252
4263
  let unpaddedMax = -1;
4253
4264
  let top = 0;
4265
+ let resting = false;
4266
+ const put = (name, px) => sheet.style.setProperty(name, `${px}px`);
4254
4267
  const hiddenAt = (size) => sheet.dataset.mode === "bottom" ? Math.max(0, ctx.getMaxAxisSize() - size) : 0;
4255
4268
  const follow = (size) => {
4256
4269
  if (unpaddedMax < 0) {
@@ -4266,21 +4279,36 @@ function contentFitFeature() {
4266
4279
  const settle = () => {
4267
4280
  if (ctx.isDestroyed()) return;
4268
4281
  const size = ctx.getSize();
4269
- unpaddedMax = -1;
4270
- follow(size);
4282
+ if (!resting) {
4283
+ unpaddedMax = -1;
4284
+ follow(size);
4285
+ }
4271
4286
  inset = hiddenAt(size);
4272
- sheet.style.setProperty(INSET_VAR, `${inset}px`);
4287
+ put(INSET_VAR, inset);
4288
+ put(SIZE_VAR, size);
4289
+ put(CAP_VAR, ctx.getMaxAxisSize());
4290
+ if (!resting) {
4291
+ resting = true;
4292
+ sheet.setAttribute(FIT_ATTR, "rest");
4293
+ }
4273
4294
  unpaddedMax = -1;
4274
4295
  };
4296
+ const move = (size) => {
4297
+ if (resting) {
4298
+ resting = false;
4299
+ sheet.setAttribute(FIT_ATTR, "moving");
4300
+ put(LIFT_VAR, scroller.offsetHeight);
4301
+ }
4302
+ follow(size);
4303
+ };
4275
4304
  const moving = () => ctx.isAnimating() || ctx.isDragging();
4276
4305
  const whenIdle = () => {
4277
4306
  if (!moving()) settle();
4278
4307
  };
4279
- sheet.setAttribute(FIT_ATTR, "");
4280
4308
  settle();
4281
4309
  const offProgress = ctx.on(
4282
4310
  "progress",
4283
- (p) => moving() ? follow(p.size) : settle()
4311
+ (p) => moving() ? move(p.size) : settle()
4284
4312
  );
4285
4313
  const offSnap = ctx.on("snap", settle);
4286
4314
  const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(whenIdle);
@@ -4292,7 +4320,9 @@ function contentFitFeature() {
4292
4320
  observer?.disconnect();
4293
4321
  window.removeEventListener("orientationchange", whenIdle);
4294
4322
  sheet.removeAttribute(FIT_ATTR);
4295
- sheet.style.removeProperty(INSET_VAR);
4323
+ for (const name of [INSET_VAR, CAP_VAR, LIFT_VAR]) {
4324
+ sheet.style.removeProperty(name);
4325
+ }
4296
4326
  };
4297
4327
  }
4298
4328
  };
package/dist/react.cjs CHANGED
@@ -1497,13 +1497,17 @@ var AnimationRunner = class {
1497
1497
  });
1498
1498
  let stopped = false;
1499
1499
  let auxRaf = 0;
1500
- const start = performance.now();
1501
1500
  const lastIdx = samples.values.length - 1;
1502
1501
  const auxTick = () => {
1503
1502
  if (stopped) return;
1504
- const elapsed = performance.now() - start;
1505
- const idx = Math.min(Math.floor(elapsed / samples.stepMs), lastIdx);
1506
- applyAux(samples.values[idx]);
1503
+ const at = Math.min(
1504
+ (Number(anim.currentTime) || 0) / samples.stepMs,
1505
+ lastIdx
1506
+ );
1507
+ const idx = Math.floor(at);
1508
+ const from = samples.values[idx];
1509
+ const to = samples.values[Math.min(idx + 1, lastIdx)];
1510
+ applyAux(from + (to - from) * (at - idx));
1507
1511
  auxRaf = requestAnimationFrame(auxTick);
1508
1512
  };
1509
1513
  auxRaf = requestAnimationFrame(auxTick);
@@ -2715,7 +2719,11 @@ var BottomSheetCore = class {
2715
2719
  getSize: () => this.size,
2716
2720
  isDragging: () => this.isDraggingAny(),
2717
2721
  applyAux: (size) => this.applySize(size, true),
2718
- getTransformFor: (size) => this.transformTemplate(this.snaps.getMaxAxisSize() - size)
2722
+ getTransformFor: (size) => {
2723
+ const cap = this.snaps.getMaxAxisSize();
2724
+ const shown = cap > 0 && !this.allowOvershoot ? Math.min(size, cap) : size;
2725
+ return this.transformTemplate(cap - shown);
2726
+ }
2719
2727
  },
2720
2728
  resolved.animation
2721
2729
  );
@@ -4247,6 +4255,9 @@ function visualViewportFeature() {
4247
4255
 
4248
4256
  // src/core/features/content-fit.ts
4249
4257
  var INSET_VAR = "--bs-content-inset";
4258
+ var SIZE_VAR = "--bs-size";
4259
+ var CAP_VAR = "--bs-max-size";
4260
+ var LIFT_VAR = "--bs-footer-lift-max";
4250
4261
  var FIT_ATTR = "data-bs-fit-content";
4251
4262
  function contentFitFeature() {
4252
4263
  return {
@@ -4260,6 +4271,8 @@ function contentFitFeature() {
4260
4271
  let inset = 0;
4261
4272
  let unpaddedMax = -1;
4262
4273
  let top = 0;
4274
+ let resting = false;
4275
+ const put = (name, px) => sheet.style.setProperty(name, `${px}px`);
4263
4276
  const hiddenAt = (size) => sheet.dataset.mode === "bottom" ? Math.max(0, ctx.getMaxAxisSize() - size) : 0;
4264
4277
  const follow = (size) => {
4265
4278
  if (unpaddedMax < 0) {
@@ -4275,21 +4288,36 @@ function contentFitFeature() {
4275
4288
  const settle = () => {
4276
4289
  if (ctx.isDestroyed()) return;
4277
4290
  const size = ctx.getSize();
4278
- unpaddedMax = -1;
4279
- follow(size);
4291
+ if (!resting) {
4292
+ unpaddedMax = -1;
4293
+ follow(size);
4294
+ }
4280
4295
  inset = hiddenAt(size);
4281
- sheet.style.setProperty(INSET_VAR, `${inset}px`);
4296
+ put(INSET_VAR, inset);
4297
+ put(SIZE_VAR, size);
4298
+ put(CAP_VAR, ctx.getMaxAxisSize());
4299
+ if (!resting) {
4300
+ resting = true;
4301
+ sheet.setAttribute(FIT_ATTR, "rest");
4302
+ }
4282
4303
  unpaddedMax = -1;
4283
4304
  };
4305
+ const move = (size) => {
4306
+ if (resting) {
4307
+ resting = false;
4308
+ sheet.setAttribute(FIT_ATTR, "moving");
4309
+ put(LIFT_VAR, scroller.offsetHeight);
4310
+ }
4311
+ follow(size);
4312
+ };
4284
4313
  const moving = () => ctx.isAnimating() || ctx.isDragging();
4285
4314
  const whenIdle = () => {
4286
4315
  if (!moving()) settle();
4287
4316
  };
4288
- sheet.setAttribute(FIT_ATTR, "");
4289
4317
  settle();
4290
4318
  const offProgress = ctx.on(
4291
4319
  "progress",
4292
- (p) => moving() ? follow(p.size) : settle()
4320
+ (p) => moving() ? move(p.size) : settle()
4293
4321
  );
4294
4322
  const offSnap = ctx.on("snap", settle);
4295
4323
  const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(whenIdle);
@@ -4301,7 +4329,9 @@ function contentFitFeature() {
4301
4329
  observer?.disconnect();
4302
4330
  window.removeEventListener("orientationchange", whenIdle);
4303
4331
  sheet.removeAttribute(FIT_ATTR);
4304
- sheet.style.removeProperty(INSET_VAR);
4332
+ for (const name of [INSET_VAR, CAP_VAR, LIFT_VAR]) {
4333
+ sheet.style.removeProperty(name);
4334
+ }
4305
4335
  };
4306
4336
  }
4307
4337
  };
package/dist/react.js CHANGED
@@ -1495,13 +1495,17 @@ var AnimationRunner = class {
1495
1495
  });
1496
1496
  let stopped = false;
1497
1497
  let auxRaf = 0;
1498
- const start = performance.now();
1499
1498
  const lastIdx = samples.values.length - 1;
1500
1499
  const auxTick = () => {
1501
1500
  if (stopped) return;
1502
- const elapsed = performance.now() - start;
1503
- const idx = Math.min(Math.floor(elapsed / samples.stepMs), lastIdx);
1504
- applyAux(samples.values[idx]);
1501
+ const at = Math.min(
1502
+ (Number(anim.currentTime) || 0) / samples.stepMs,
1503
+ lastIdx
1504
+ );
1505
+ const idx = Math.floor(at);
1506
+ const from = samples.values[idx];
1507
+ const to = samples.values[Math.min(idx + 1, lastIdx)];
1508
+ applyAux(from + (to - from) * (at - idx));
1505
1509
  auxRaf = requestAnimationFrame(auxTick);
1506
1510
  };
1507
1511
  auxRaf = requestAnimationFrame(auxTick);
@@ -2713,7 +2717,11 @@ var BottomSheetCore = class {
2713
2717
  getSize: () => this.size,
2714
2718
  isDragging: () => this.isDraggingAny(),
2715
2719
  applyAux: (size) => this.applySize(size, true),
2716
- getTransformFor: (size) => this.transformTemplate(this.snaps.getMaxAxisSize() - size)
2720
+ getTransformFor: (size) => {
2721
+ const cap = this.snaps.getMaxAxisSize();
2722
+ const shown = cap > 0 && !this.allowOvershoot ? Math.min(size, cap) : size;
2723
+ return this.transformTemplate(cap - shown);
2724
+ }
2717
2725
  },
2718
2726
  resolved.animation
2719
2727
  );
@@ -4245,6 +4253,9 @@ function visualViewportFeature() {
4245
4253
 
4246
4254
  // src/core/features/content-fit.ts
4247
4255
  var INSET_VAR = "--bs-content-inset";
4256
+ var SIZE_VAR = "--bs-size";
4257
+ var CAP_VAR = "--bs-max-size";
4258
+ var LIFT_VAR = "--bs-footer-lift-max";
4248
4259
  var FIT_ATTR = "data-bs-fit-content";
4249
4260
  function contentFitFeature() {
4250
4261
  return {
@@ -4258,6 +4269,8 @@ function contentFitFeature() {
4258
4269
  let inset = 0;
4259
4270
  let unpaddedMax = -1;
4260
4271
  let top = 0;
4272
+ let resting = false;
4273
+ const put = (name, px) => sheet.style.setProperty(name, `${px}px`);
4261
4274
  const hiddenAt = (size) => sheet.dataset.mode === "bottom" ? Math.max(0, ctx.getMaxAxisSize() - size) : 0;
4262
4275
  const follow = (size) => {
4263
4276
  if (unpaddedMax < 0) {
@@ -4273,21 +4286,36 @@ function contentFitFeature() {
4273
4286
  const settle = () => {
4274
4287
  if (ctx.isDestroyed()) return;
4275
4288
  const size = ctx.getSize();
4276
- unpaddedMax = -1;
4277
- follow(size);
4289
+ if (!resting) {
4290
+ unpaddedMax = -1;
4291
+ follow(size);
4292
+ }
4278
4293
  inset = hiddenAt(size);
4279
- sheet.style.setProperty(INSET_VAR, `${inset}px`);
4294
+ put(INSET_VAR, inset);
4295
+ put(SIZE_VAR, size);
4296
+ put(CAP_VAR, ctx.getMaxAxisSize());
4297
+ if (!resting) {
4298
+ resting = true;
4299
+ sheet.setAttribute(FIT_ATTR, "rest");
4300
+ }
4280
4301
  unpaddedMax = -1;
4281
4302
  };
4303
+ const move = (size) => {
4304
+ if (resting) {
4305
+ resting = false;
4306
+ sheet.setAttribute(FIT_ATTR, "moving");
4307
+ put(LIFT_VAR, scroller.offsetHeight);
4308
+ }
4309
+ follow(size);
4310
+ };
4282
4311
  const moving = () => ctx.isAnimating() || ctx.isDragging();
4283
4312
  const whenIdle = () => {
4284
4313
  if (!moving()) settle();
4285
4314
  };
4286
- sheet.setAttribute(FIT_ATTR, "");
4287
4315
  settle();
4288
4316
  const offProgress = ctx.on(
4289
4317
  "progress",
4290
- (p) => moving() ? follow(p.size) : settle()
4318
+ (p) => moving() ? move(p.size) : settle()
4291
4319
  );
4292
4320
  const offSnap = ctx.on("snap", settle);
4293
4321
  const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(whenIdle);
@@ -4299,7 +4327,9 @@ function contentFitFeature() {
4299
4327
  observer?.disconnect();
4300
4328
  window.removeEventListener("orientationchange", whenIdle);
4301
4329
  sheet.removeAttribute(FIT_ATTR);
4302
- sheet.style.removeProperty(INSET_VAR);
4330
+ for (const name of [INSET_VAR, CAP_VAR, LIFT_VAR]) {
4331
+ sheet.style.removeProperty(name);
4332
+ }
4303
4333
  };
4304
4334
  }
4305
4335
  };
package/dist/solid.cjs CHANGED
@@ -1490,13 +1490,17 @@ var AnimationRunner = class {
1490
1490
  });
1491
1491
  let stopped = false;
1492
1492
  let auxRaf = 0;
1493
- const start = performance.now();
1494
1493
  const lastIdx = samples.values.length - 1;
1495
1494
  const auxTick = () => {
1496
1495
  if (stopped) return;
1497
- const elapsed = performance.now() - start;
1498
- const idx = Math.min(Math.floor(elapsed / samples.stepMs), lastIdx);
1499
- applyAux(samples.values[idx]);
1496
+ const at = Math.min(
1497
+ (Number(anim.currentTime) || 0) / samples.stepMs,
1498
+ lastIdx
1499
+ );
1500
+ const idx = Math.floor(at);
1501
+ const from = samples.values[idx];
1502
+ const to = samples.values[Math.min(idx + 1, lastIdx)];
1503
+ applyAux(from + (to - from) * (at - idx));
1500
1504
  auxRaf = requestAnimationFrame(auxTick);
1501
1505
  };
1502
1506
  auxRaf = requestAnimationFrame(auxTick);
@@ -2708,7 +2712,11 @@ var BottomSheetCore = class {
2708
2712
  getSize: () => this.size,
2709
2713
  isDragging: () => this.isDraggingAny(),
2710
2714
  applyAux: (size) => this.applySize(size, true),
2711
- getTransformFor: (size) => this.transformTemplate(this.snaps.getMaxAxisSize() - size)
2715
+ getTransformFor: (size) => {
2716
+ const cap = this.snaps.getMaxAxisSize();
2717
+ const shown = cap > 0 && !this.allowOvershoot ? Math.min(size, cap) : size;
2718
+ return this.transformTemplate(cap - shown);
2719
+ }
2712
2720
  },
2713
2721
  resolved.animation
2714
2722
  );
@@ -4240,6 +4248,9 @@ function visualViewportFeature() {
4240
4248
 
4241
4249
  // src/core/features/content-fit.ts
4242
4250
  var INSET_VAR = "--bs-content-inset";
4251
+ var SIZE_VAR = "--bs-size";
4252
+ var CAP_VAR = "--bs-max-size";
4253
+ var LIFT_VAR = "--bs-footer-lift-max";
4243
4254
  var FIT_ATTR = "data-bs-fit-content";
4244
4255
  function contentFitFeature() {
4245
4256
  return {
@@ -4253,6 +4264,8 @@ function contentFitFeature() {
4253
4264
  let inset = 0;
4254
4265
  let unpaddedMax = -1;
4255
4266
  let top = 0;
4267
+ let resting = false;
4268
+ const put = (name, px) => sheet.style.setProperty(name, `${px}px`);
4256
4269
  const hiddenAt = (size) => sheet.dataset.mode === "bottom" ? Math.max(0, ctx.getMaxAxisSize() - size) : 0;
4257
4270
  const follow = (size) => {
4258
4271
  if (unpaddedMax < 0) {
@@ -4268,21 +4281,36 @@ function contentFitFeature() {
4268
4281
  const settle = () => {
4269
4282
  if (ctx.isDestroyed()) return;
4270
4283
  const size = ctx.getSize();
4271
- unpaddedMax = -1;
4272
- follow(size);
4284
+ if (!resting) {
4285
+ unpaddedMax = -1;
4286
+ follow(size);
4287
+ }
4273
4288
  inset = hiddenAt(size);
4274
- sheet.style.setProperty(INSET_VAR, `${inset}px`);
4289
+ put(INSET_VAR, inset);
4290
+ put(SIZE_VAR, size);
4291
+ put(CAP_VAR, ctx.getMaxAxisSize());
4292
+ if (!resting) {
4293
+ resting = true;
4294
+ sheet.setAttribute(FIT_ATTR, "rest");
4295
+ }
4275
4296
  unpaddedMax = -1;
4276
4297
  };
4298
+ const move = (size) => {
4299
+ if (resting) {
4300
+ resting = false;
4301
+ sheet.setAttribute(FIT_ATTR, "moving");
4302
+ put(LIFT_VAR, scroller.offsetHeight);
4303
+ }
4304
+ follow(size);
4305
+ };
4277
4306
  const moving = () => ctx.isAnimating() || ctx.isDragging();
4278
4307
  const whenIdle = () => {
4279
4308
  if (!moving()) settle();
4280
4309
  };
4281
- sheet.setAttribute(FIT_ATTR, "");
4282
4310
  settle();
4283
4311
  const offProgress = ctx.on(
4284
4312
  "progress",
4285
- (p) => moving() ? follow(p.size) : settle()
4313
+ (p) => moving() ? move(p.size) : settle()
4286
4314
  );
4287
4315
  const offSnap = ctx.on("snap", settle);
4288
4316
  const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(whenIdle);
@@ -4294,7 +4322,9 @@ function contentFitFeature() {
4294
4322
  observer?.disconnect();
4295
4323
  window.removeEventListener("orientationchange", whenIdle);
4296
4324
  sheet.removeAttribute(FIT_ATTR);
4297
- sheet.style.removeProperty(INSET_VAR);
4325
+ for (const name of [INSET_VAR, CAP_VAR, LIFT_VAR]) {
4326
+ sheet.style.removeProperty(name);
4327
+ }
4298
4328
  };
4299
4329
  }
4300
4330
  };