@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.
- package/README.md +58 -14
- package/dist/core.cjs +13 -5
- package/dist/core.js +13 -5
- package/dist/element.cjs +43 -13
- package/dist/element.iife.global.js +2 -2
- package/dist/element.js +43 -13
- package/dist/features.cjs +28 -6
- package/dist/features.js +28 -6
- package/dist/index.cjs +41 -11
- package/dist/index.js +41 -11
- package/dist/qwik-lib/index.qwik.cjs +42 -11
- package/dist/qwik-lib/index.qwik.mjs +42 -11
- package/dist/qwik.cjs +41 -11
- package/dist/qwik.js +41 -11
- package/dist/react.cjs +41 -11
- package/dist/react.js +41 -11
- package/dist/solid.cjs +41 -11
- package/dist/solid.js +41 -11
- package/dist/solid.source.jsx +41 -11
- package/dist/styles.css +19 -2
- package/dist/svelte-core.cjs +41 -11
- package/dist/svelte-core.js +41 -11
- package/dist/svelte.cjs +41 -11
- package/dist/svelte.js +41 -11
- package/dist/vue.cjs +41 -11
- package/dist/vue.js +41 -11
- package/package.json +11 -11
|
@@ -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
|
|
1510
|
-
const idx = Math.
|
|
1511
|
-
|
|
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) =>
|
|
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
|
-
|
|
4258
|
-
|
|
4267
|
+
if (!resting) {
|
|
4268
|
+
unpaddedMax = -1;
|
|
4269
|
+
follow(size);
|
|
4270
|
+
}
|
|
4259
4271
|
inset = hiddenAt(size);
|
|
4260
|
-
|
|
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() ?
|
|
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
|
-
|
|
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
|
|
1498
|
-
|
|
1499
|
-
|
|
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) =>
|
|
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
|
-
|
|
4272
|
-
|
|
4284
|
+
if (!resting) {
|
|
4285
|
+
unpaddedMax = -1;
|
|
4286
|
+
follow(size);
|
|
4287
|
+
}
|
|
4273
4288
|
inset = hiddenAt(size);
|
|
4274
|
-
|
|
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() ?
|
|
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
|
-
|
|
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
|
|
1496
|
-
|
|
1497
|
-
|
|
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) =>
|
|
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
|
-
|
|
4270
|
-
|
|
4282
|
+
if (!resting) {
|
|
4283
|
+
unpaddedMax = -1;
|
|
4284
|
+
follow(size);
|
|
4285
|
+
}
|
|
4271
4286
|
inset = hiddenAt(size);
|
|
4272
|
-
|
|
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() ?
|
|
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
|
-
|
|
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
|
|
1505
|
-
|
|
1506
|
-
|
|
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) =>
|
|
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
|
-
|
|
4279
|
-
|
|
4291
|
+
if (!resting) {
|
|
4292
|
+
unpaddedMax = -1;
|
|
4293
|
+
follow(size);
|
|
4294
|
+
}
|
|
4280
4295
|
inset = hiddenAt(size);
|
|
4281
|
-
|
|
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() ?
|
|
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
|
-
|
|
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
|
|
1503
|
-
|
|
1504
|
-
|
|
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) =>
|
|
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
|
-
|
|
4277
|
-
|
|
4289
|
+
if (!resting) {
|
|
4290
|
+
unpaddedMax = -1;
|
|
4291
|
+
follow(size);
|
|
4292
|
+
}
|
|
4278
4293
|
inset = hiddenAt(size);
|
|
4279
|
-
|
|
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() ?
|
|
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
|
-
|
|
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
|
|
1498
|
-
|
|
1499
|
-
|
|
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) =>
|
|
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
|
-
|
|
4272
|
-
|
|
4284
|
+
if (!resting) {
|
|
4285
|
+
unpaddedMax = -1;
|
|
4286
|
+
follow(size);
|
|
4287
|
+
}
|
|
4273
4288
|
inset = hiddenAt(size);
|
|
4274
|
-
|
|
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() ?
|
|
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
|
-
|
|
4325
|
+
for (const name of [INSET_VAR, CAP_VAR, LIFT_VAR]) {
|
|
4326
|
+
sheet.style.removeProperty(name);
|
|
4327
|
+
}
|
|
4298
4328
|
};
|
|
4299
4329
|
}
|
|
4300
4330
|
};
|