@kyralabs/m3e-motion 1.2.0 → 1.4.0

package/dist/index.js

@@ -336,6 +336,327 @@ function springToLinear(spec, options = {}) {
   return { easing: `linear(${body.join(", ")})`, durationMillis, stops, maxError };
 }
 
+// src/animatable.ts
+var SpringAnimatable = class {
+  /**
+   * @param value initial value, at rest.
+   * @param visibilityThreshold Compose's visibility threshold: 0.01 for Float animations
+   *   (`Spring.DefaultDisplacementThreshold`), 1 for an Int one.
+   */
+  constructor(value, visibilityThreshold = DEFAULT_DISPLACEMENT_THRESHOLD) {
+    this.visibilityThreshold = visibilityThreshold;
+    this.#value = value;
+    this.#target = value;
+  }
+  visibilityThreshold;
+  #value;
+  #velocity = 0;
+  #target;
+  #from = 0;
+  #velocity0 = 0;
+  #start = 0;
+  #duration = 0;
+  #spec = null;
+  get value() {
+    return this.#value;
+  }
+  /** Units per second. */
+  get velocity() {
+    return this.#velocity;
+  }
+  get target() {
+    return this.#target;
+  }
+  get isRunning() {
+    return this.#spec !== null;
+  }
+  /** Jumps to `value` and stops. */
+  snapTo(value) {
+    this.#spec = null;
+    this.#value = value;
+    this.#target = value;
+    this.#velocity = 0;
+  }
+  /**
+   * Animates to `target` from the value and velocity at `now` (ms); a null spec (e.g. a spatial
+   * spring under reduced motion) jumps there.
+   */
+  animateTo(target, spec, now) {
+    this.sample(now);
+    if (spec === null) {
+      this.snapTo(target);
+      return;
+    }
+    this.#from = this.#value;
+    this.#velocity0 = this.#velocity;
+    this.#target = target;
+    this.#start = now;
+    this.#spec = spec;
+    this.#duration = springDurationMillis(
+      spec,
+      this.#from,
+      target,
+      this.#velocity0,
+      this.visibilityThreshold
+    );
+    if (this.#duration <= 0) this.snapTo(target);
+  }
+  /** Advances to `now` (ms) and returns the value; the animation ends once its duration is up. */
+  sample(now) {
+    const spec = this.#spec;
+    if (spec === null) return this.#value;
+    const elapsed = Math.max(0, now - this.#start);
+    if (elapsed >= this.#duration) {
+      this.snapTo(this.#target);
+      return this.#value;
+    }
+    this.#value = springValue(spec, elapsed, this.#from, this.#target, this.#velocity0);
+    this.#velocity = springVelocity(spec, elapsed, this.#from, this.#target, this.#velocity0);
+    return this.#value;
+  }
+};
+
+// src/fab-menu.ts
+var animatedInt = (value) => Math.trunc(value);
+var fabMenuItemVisible = (index, itemCount, stagger) => index >= itemCount - animatedInt(stagger);
+
+// src/menu-navigation.ts
+function menuNavigationTarget(key, count, current) {
+  if (count === 0) return null;
+  switch (key) {
+    case "ArrowDown":
+      return current < 0 ? 0 : (current + 1) % count;
+    case "ArrowUp":
+      return current < 0 ? count - 1 : (current - 1 + count) % count;
+    case "Home":
+      return 0;
+    case "End":
+      return count - 1;
+    default:
+      return null;
+  }
+}
+
+// src/toolbar-navigation.ts
+function toolbarNavigationTarget(key, count, current, orientation = "horizontal", rtl = false) {
+  if (count === 0) return null;
+  let step;
+  switch (key) {
+    case "Home":
+      return 0;
+    case "End":
+      return count - 1;
+    case "ArrowRight":
+    case "ArrowLeft":
+      if (orientation !== "horizontal") return null;
+      step = key === "ArrowRight" !== rtl ? 1 : -1;
+      break;
+    case "ArrowDown":
+    case "ArrowUp":
+      if (orientation !== "vertical") return null;
+      step = key === "ArrowDown" ? 1 : -1;
+      break;
+    default:
+      return null;
+  }
+  if (current < 0) return step > 0 ? 0 : count - 1;
+  return Math.min(Math.max(current + step, 0), count - 1);
+}
+
+// src/cubic-bezier.ts
+var bezier = (p1, p2, t) => 3 * (1 - t) * (1 - t) * t * p1 + 3 * (1 - t) * t * t * p2 + t * t * t;
+var cubicBezier = (a, b, c, d) => (fraction) => {
+  if (!(fraction > 0 && fraction < 1)) return fraction;
+  let lo = 0;
+  let hi = 1;
+  for (let i = 0; i < 30; i++) {
+    const mid = (lo + hi) / 2;
+    if (bezier(a, c, mid) < fraction) lo = mid;
+    else hi = mid;
+  }
+  return bezier(b, d, (lo + hi) / 2);
+};
+function parseCubicBezier(css) {
+  const values = /cubic-bezier\(([^)]*)\)/.exec(css)?.[1]?.split(",").map(Number);
+  return values?.length === 4 && values.every(Number.isFinite) ? cubicBezier(...values) : null;
+}
+
+// src/app-bar-scroll.ts
+function appBarScrollState(height) {
+  return { heightOffsetLimit: -height, heightOffset: 0, contentOffset: 0, atStart: true };
+}
+function withHeightOffset(state, offset) {
+  return { ...state, heightOffset: Math.min(Math.max(offset, state.heightOffsetLimit), 0) };
+}
+function withHeight(state, height) {
+  return withHeightOffset({ ...state, heightOffsetLimit: -height }, state.heightOffset);
+}
+function collapsedFraction(state) {
+  return state.heightOffsetLimit !== 0 ? state.heightOffset / state.heightOffsetLimit + 0 : 0;
+}
+function overlappedFraction(state) {
+  if (!state.atStart && state.contentOffset === 0) return 1;
+  if (state.heightOffsetLimit === 0) return 0;
+  const limit = state.heightOffsetLimit;
+  const clamped = Math.min(Math.max(limit + Math.abs(state.contentOffset), limit), 0);
+  return 1 - clamped / limit;
+}
+function isScrolledUnder(state) {
+  return overlappedFraction(state) > 0.01;
+}
+function scrollAppBar(state, behavior, scrollTop, delta) {
+  const next = { ...state, contentOffset: -scrollTop, atStart: scrollTop <= 0 };
+  if (behavior === "pinned") return next;
+  if (behavior === "enter-always" || delta < 0) {
+    return withHeightOffset(next, state.heightOffset + delta);
+  }
+  const below = (top) => Math.max(0, -state.heightOffset - top);
+  return withHeightOffset(next, state.heightOffset + below(scrollTop) - below(scrollTop + delta));
+}
+function settleTarget(state) {
+  const fraction = collapsedFraction(state);
+  if (fraction < 0.01 || fraction === 1) return null;
+  if (!(state.heightOffset < 0 && state.heightOffset > state.heightOffsetLimit)) return null;
+  return fraction < 0.5 ? 0 : state.heightOffsetLimit;
+}
+var TOP_TITLE_ALPHA_EASING = [0.8, 0, 0.8, 0.15];
+var FAST_OUT_LINEAR_IN_EASING = [0.4, 0, 1, 1];
+var topTitleAlpha = /* @__PURE__ */ cubicBezier(...TOP_TITLE_ALPHA_EASING);
+var fastOutLinearIn = /* @__PURE__ */ cubicBezier(...FAST_OUT_LINEAR_IN_EASING);
+function twoRowsFrame(fraction) {
+  return {
+    collapsedTitleAlpha: topTitleAlpha(fraction),
+    expandedTitleAlpha: 1 - fraction,
+    containerColorFraction: fastOutLinearIn(fraction),
+    collapsedTitleHidden: fraction < 0.5
+  };
+}
+
+// src/floating-toolbar-scroll.ts
+function floatingToolbarScrollState(offsetLimit = -Number.MAX_VALUE, offset = 0, contentOffset = 0) {
+  return withToolbarOffset({ offsetLimit, offset: 0, contentOffset }, offset);
+}
+function withToolbarOffset(state, offset) {
+  return { ...state, offset: Math.min(Math.max(offset, state.offsetLimit), 0) };
+}
+function withToolbarOffsetLimit(state, distance) {
+  return withToolbarOffset({ ...state, offsetLimit: -Math.max(distance, 0) }, state.offset);
+}
+function scrollFloatingToolbar(state, delta) {
+  return withToolbarOffset(
+    { ...state, contentOffset: state.contentOffset + delta },
+    state.offset + delta
+  );
+}
+function toolbarCollapsedFraction(state) {
+  return state.offsetLimit !== 0 ? state.offset / state.offsetLimit + 0 : 0;
+}
+function toolbarSettleTarget(state) {
+  return settleTarget({
+    heightOffsetLimit: state.offsetLimit,
+    heightOffset: state.offset,
+    contentOffset: state.contentOffset});
+}
+function toolbarExpansionScroll(expanded, collapseThreshold, expandThreshold, contentOffset = 0) {
+  return {
+    contentOffset,
+    threshold: expanded ? contentOffset - collapseThreshold : contentOffset + expandThreshold
+  };
+}
+function scrollToolbarExpansion(state, delta, collapseThreshold, expandThreshold) {
+  const contentOffset = state.contentOffset + delta;
+  if (delta < 0 && contentOffset <= state.threshold) {
+    return {
+      state: { contentOffset, threshold: contentOffset + expandThreshold },
+      change: "collapse"
+    };
+  }
+  if (delta > 0 && contentOffset >= state.threshold) {
+    return {
+      state: { contentOffset, threshold: contentOffset - collapseThreshold },
+      change: "expand"
+    };
+  }
+  return { state: { contentOffset, threshold: state.threshold }, change: null };
+}
+
+// src/progress-indicator.ts
+var line = (t, [delay, duration], easing) => t <= delay ? 0 : t >= delay + duration ? 1 : easing((t - delay) / duration);
+function linearIndeterminateFractions(elapsedMillis, timing) {
+  const t = Math.max(0, elapsedMillis) % timing.durationMillis;
+  return [
+    line(t, timing.firstTail, timing.easing),
+    line(t, timing.firstHead, timing.easing),
+    line(t, timing.secondTail, timing.easing),
+    line(t, timing.secondHead, timing.easing)
+  ];
+}
+function circularIndeterminateFrame(elapsedMillis, timing) {
+  const d = timing.durationMillis;
+  const t = Math.max(0, elapsedMillis) % d;
+  const steps = Math.round(d / timing.additionalDelayMillis);
+  const step = timing.additionalRotation / steps;
+  const index = Math.floor(t / timing.additionalDelayMillis);
+  const within = t - index * timing.additionalDelayMillis;
+  const additional = step * index + step * Math.min(1, within / timing.additionalDurationMillis);
+  const half = d / 2;
+  const range = timing.maxProgress - timing.minProgress;
+  const sweep = t <= half ? timing.minProgress + range * (t / half) : timing.maxProgress - range * timing.easing((t - half) / half);
+  return { rotation: timing.rotation * t / d + additional, sweep };
+}
+function waveTravelMillis(wavelength, waveSpeed, minMillis, vertexCount = 1) {
+  if (!(waveSpeed > 0 && wavelength > 0)) return Number.POSITIVE_INFINITY;
+  return Math.max(minMillis, Math.round(wavelength / waveSpeed * 1e3 * vertexCount));
+}
+var waveOffset = (elapsedMillis, travelMillis) => Number.isFinite(travelMillis) ? Math.max(0, elapsedMillis) % travelMillis / travelMillis : 0;
+var indicatorAmplitude = (progress, minProgress, maxProgress) => progress <= minProgress || progress >= maxProgress ? 0 : 1;
+var AmplitudeAnimation = class {
+  #from;
+  #to;
+  #start = 0;
+  #tween = null;
+  #value;
+  constructor(initial) {
+    this.#from = initial;
+    this.#to = initial;
+    this.#value = initial;
+  }
+  get value() {
+    return this.#value;
+  }
+  get target() {
+    return this.#to;
+  }
+  get isRunning() {
+    return this.#tween !== null;
+  }
+  /** Advances to `now` (ms). */
+  sample(now) {
+    const tween = this.#tween;
+    if (tween === null) return this.#value;
+    const fraction = tween.durationMillis > 0 ? (now - this.#start) / tween.durationMillis : 1;
+    if (fraction >= 1) {
+      this.#tween = null;
+      this.#value = this.#to;
+    } else {
+      this.#value = this.#from + (this.#to - this.#from) * tween.easing(Math.max(0, fraction));
+    }
+    return this.#value;
+  }
+  /** Requests `target` at `now`; returns true when a tween started. */
+  update(target, now, increase, decrease) {
+    this.sample(now);
+    if (this.#tween !== null || target === this.#to) return false;
+    const tween = this.#value < target ? increase : decrease;
+    this.#from = this.#value;
+    this.#to = target;
+    this.#start = now;
+    this.#tween = tween;
+    if (tween.durationMillis <= 0) this.sample(now);
+    return true;
+  }
+};
+
 // src/loading-indicator.ts
 var FULL_ROTATION = 360;
 var QUARTER_ROTATION = FULL_ROTATION / 4;
@@ -364,40 +685,352 @@ function indeterminateFrame(elapsedMillis, morphCount, timing) {
   };
 }
 
-// src/app-bar-scroll.ts
-function appBarScrollState(height) {
-  return { heightOffsetLimit: -height, heightOffset: 0, contentOffset: 0, atStart: true };
+// src/menu-position.ts
+var round2 = Math.round;
+var alignH = (bias, size, space, rtl) => round2((space - size) / 2 * (1 + (rtl ? -bias : bias)));
+var alignV = (bias, size, space) => round2((space - size) / 2 * (1 + bias));
+var START = -1;
+var END = 1;
+var TOP = -1;
+var CENTER = 0;
+var BOTTOM = 1;
+var anchorH = (menuBias, anchorBias) => (anchor, _width, menuWidth, rtl) => anchor.left + alignH(anchorBias, 0, anchor.right - anchor.left, rtl) - alignH(menuBias, 0, menuWidth, rtl);
+var anchorV = (menuBias, anchorBias) => (anchor, _height, menuHeight) => anchor.top + alignV(anchorBias, 0, anchor.bottom - anchor.top) - alignV(menuBias, 0, menuHeight);
+var startToAnchorStart = anchorH(START, START);
+var startToAnchorEnd = anchorH(START, END);
+var endToAnchorEnd = anchorH(END, END);
+var endToAnchorStart = anchorH(END, START);
+var leftToWindowLeft = (_a, width, menuWidth) => alignH(START, menuWidth, width, false);
+var rightToWindowRight = (_a, width, menuWidth) => alignH(END, menuWidth, width, false);
+var topToAnchorBottom = anchorV(TOP, BOTTOM);
+var topToAnchorTop = anchorV(TOP, TOP);
+var bottomToAnchorTop = anchorV(BOTTOM, TOP);
+var bottomToAnchorBottom = anchorV(BOTTOM, BOTTOM);
+var centerToAnchorTop = anchorV(CENTER, TOP);
+var topToWindowTop = (_a, height, menuHeight) => alignV(TOP, menuHeight, height);
+var bottomToWindowBottom = (_a, height, menuHeight) => alignV(BOTTOM, menuHeight, height);
+var centerX = (r) => (r.left + r.right) / 2;
+var centerY = (r) => (r.top + r.bottom) / 2;
+var windowX = (anchor, width) => centerX(anchor) < width / 2 ? leftToWindowLeft : rightToWindowRight;
+var windowY = (anchor, height) => centerY(anchor) < height / 2 ? topToWindowTop : bottomToWindowBottom;
+function candidates(position, anchor, width, height) {
+  const wx = windowX(anchor, width);
+  const wy = windowY(anchor, height);
+  switch (position) {
+    case "above":
+      return [
+        [startToAnchorStart, endToAnchorEnd, wx],
+        [bottomToAnchorTop, topToAnchorBottom, centerToAnchorTop, wy]
+      ];
+    // Left and Start (Right and End) list the same candidates; Start/End resolve against the
+    // layout direction inside the candidates, Left/Right too (Menu.kt keeps them identical).
+    case "left":
+    case "start":
+      return [
+        [endToAnchorStart, startToAnchorEnd, wx],
+        [topToAnchorTop, bottomToAnchorBottom, wy]
+      ];
+    case "right":
+    case "end":
+      return [
+        [startToAnchorEnd, endToAnchorStart, wx],
+        [topToAnchorTop, bottomToAnchorBottom, wy]
+      ];
+    // 'below' (unrecognized values too).
+    default:
+      return [
+        [startToAnchorStart, endToAnchorEnd, wx],
+        [topToAnchorBottom, bottomToAnchorTop, centerToAnchorTop, wy]
+      ];
+  }
 }
-function withHeightOffset(state, offset) {
-  return { ...state, heightOffset: Math.min(Math.max(offset, state.heightOffsetLimit), 0) };
+var coerceIn = (v, min, max) => Math.min(Math.max(v, min), max);
+function pick(values, size, space, margin, center) {
+  for (const [i, candidate] of values.entries()) {
+    if (candidate >= margin && candidate + size <= space - margin) return candidate;
+    if (i === values.length - 1) {
+      return size >= space - 2 * margin ? center() : coerceIn(candidate, margin, space - margin - size);
+    }
+  }
+  return 0;
 }
-function withHeight(state, height) {
-  return withHeightOffset({ ...state, heightOffsetLimit: -height }, state.heightOffset);
+function menuTransformOrigin(anchor, menu) {
+  const menuWidth = menu.right - menu.left;
+  const menuHeight = menu.bottom - menu.top;
+  const originX = menu.left >= anchor.right ? 0 : menu.right <= anchor.left ? 1 : menuWidth === 0 ? 0 : ((Math.max(anchor.left, menu.left) + Math.min(anchor.right, menu.right)) / 2 - menu.left) / menuWidth;
+  const originY = menu.top >= anchor.bottom ? 0 : menu.bottom <= anchor.top ? 1 : menuHeight === 0 ? 0 : ((Math.max(anchor.top, menu.top) + Math.min(anchor.bottom, menu.bottom)) / 2 - menu.top) / menuHeight;
+  return { originX, originY };
 }
-function collapsedFraction(state) {
-  return state.heightOffsetLimit !== 0 ? state.heightOffset / state.heightOffsetLimit + 0 : 0;
+function menuPosition(input) {
+  const { anchor, window: win, menu, rtl, verticalMargin, horizontalMargin } = input;
+  const offset = input.offset ?? { x: 0, y: 0 };
+  const [xs, ys] = candidates(input.position ?? "below", anchor, win.width, win.height);
+  const offsetX = offset.x * (rtl ? -1 : 1);
+  const x = pick(
+    xs.map((c) => c(anchor, win.width, menu.width, rtl) + offsetX),
+    menu.width,
+    win.width,
+    horizontalMargin,
+    () => alignH(CENTER, menu.width, win.width, rtl)
+  );
+  const y = pick(
+    ys.map((c) => c(anchor, win.height, menu.height) + offset.y),
+    menu.height,
+    win.height,
+    verticalMargin,
+    () => alignV(CENTER, menu.height, win.height)
+  );
+  return {
+    x,
+    y,
+    ...menuTransformOrigin(anchor, {
+      left: x,
+      top: y,
+      right: x + menu.width,
+      bottom: y + menu.height
+    })
+  };
 }
-function overlappedFraction(state) {
-  if (!state.atStart && state.contentOffset === 0) return 1;
-  if (state.heightOffsetLimit === 0) return 0;
-  const limit = state.heightOffsetLimit;
-  const clamped = Math.min(Math.max(limit + Math.abs(state.contentOffset), limit), 0);
-  return 1 - clamped / limit;
+
+// src/search-bar.ts
+var SEARCH_BAR_EXPANDED_THRESHOLD = 0.02;
+var SEARCH_DROPDOWN_VISIBLE_PROGRESS = 0.1;
+var TweenAnimatable = class {
+  #value;
+  #from;
+  #target;
+  #start = 0;
+  #spec = null;
+  constructor(value) {
+    this.#value = value;
+    this.#from = value;
+    this.#target = value;
+  }
+  get value() {
+    return this.#value;
+  }
+  get target() {
+    return this.#target;
+  }
+  get isRunning() {
+    return this.#spec !== null;
+  }
+  snapTo(value) {
+    this.#spec = null;
+    this.#value = value;
+    this.#from = value;
+    this.#target = value;
+  }
+  animateTo(target, spec, now) {
+    this.sample(now);
+    if (spec === null || spec.delay + spec.duration <= 0) {
+      this.snapTo(target);
+      return;
+    }
+    this.#from = this.#value;
+    this.#target = target;
+    this.#start = now;
+    this.#spec = spec;
+  }
+  sample(now) {
+    const spec = this.#spec;
+    if (spec === null) return this.#value;
+    const elapsed = now - this.#start - spec.delay;
+    if (elapsed >= spec.duration) {
+      this.snapTo(this.#target);
+      return this.#value;
+    }
+    const fraction = elapsed <= 0 ? 0 : spec.easing(elapsed / spec.duration);
+    this.#value = this.#from + (this.#target - this.#from) * fraction;
+    return this.#value;
+  }
+};
+var SearchBarAnimation = class {
+  #progress;
+  #content;
+  #slide = new SpringAnimatable(0);
+  #specs = null;
+  #dropdownShown = false;
+  #dropdownVisible = false;
+  constructor(expanded = false) {
+    this.#progress = new SpringAnimatable(expanded ? 1 : 0);
+    this.#content = new TweenAnimatable(expanded ? 1 : 0);
+    this.#dropdownShown = expanded;
+    this.#dropdownVisible = expanded;
+  }
+  /** SearchBarState.targetValue. */
+  get isTargetExpanded() {
+    return this.#progress.target === 1;
+  }
+  /** SearchBarState.currentValue: expanded until the value drops to the 0.02 tolerance. */
+  get isExpanded() {
+    return this.#progress.value > SEARCH_BAR_EXPANDED_THRESHOLD;
+  }
+  get isRunning() {
+    return this.#progress.isRunning || this.#content.isRunning || this.#slide.isRunning;
+  }
+  /** animateToExpanded() at `now` (ms). */
+  expand(specs, now) {
+    this.#specs = specs;
+    this.#progress.animateTo(1, specs.expand, now);
+    this.#content.animateTo(1, specs.contentFadeIn, now);
+  }
+  /** animateToCollapsed() at `now` (ms). */
+  collapse(specs, now) {
+    this.#specs = specs;
+    this.#content.animateTo(0, specs.contentFadeOut, now);
+    this.#progress.animateTo(0, specs.collapse, now);
+  }
+  /** Jumps to collapsed (0) or expanded (1), stopping every animation. */
+  snapTo(expanded) {
+    this.#progress.snapTo(expanded ? 1 : 0);
+    this.#content.snapTo(expanded ? 1 : 0);
+    this.#slide.snapTo(0);
+    this.#dropdownShown = expanded;
+    this.#dropdownVisible = expanded;
+  }
+  /**
+   * Advances to `now`. `dropdownHeight` (px, the drop-down's full height) enables the with-gap
+   * slide: AnimatedVisibility(visible = progress > 0.1 && target == Expanded) slides in from minus
+   * half the height on the expand spring and out to it on the collapse spring.
+   */
+  sample(now, dropdownHeight) {
+    const value = this.#progress.sample(now);
+    const progress = Math.min(Math.max(value, 0), 1);
+    const contentProgress = Math.min(Math.max(this.#content.sample(now), 0), 1);
+    if (dropdownHeight !== void 0) {
+      const hidden = Math.round(-dropdownHeight / 2);
+      const visible = progress > SEARCH_DROPDOWN_VISIBLE_PROGRESS && this.isTargetExpanded;
+      if (visible !== this.#dropdownVisible) {
+        this.#dropdownVisible = visible;
+        if (visible) {
+          if (!this.#dropdownShown) this.#slide.snapTo(hidden);
+          this.#dropdownShown = true;
+          this.#slide.animateTo(0, this.#specs?.expand ?? null, now);
+        } else if (this.#dropdownShown) {
+          this.#slide.animateTo(hidden, this.#specs?.collapse ?? null, now);
+        }
+      }
+      this.#slide.sample(now);
+      if (!visible && this.#dropdownShown && !this.#slide.isRunning) this.#dropdownShown = false;
+    }
+    return {
+      value,
+      progress,
+      contentProgress,
+      slide: this.#slide.value,
+      dropdownShown: this.#dropdownShown
+    };
+  }
+};
+var lerp = (a, b, t) => a + (b - a) * t;
+function searchViewFrame(input) {
+  const { variant, collapsed: c, window: w, insetTop, metrics: m } = input;
+  const { value, progress: p } = input.sample;
+  const none = { radius: 0, alpha: 1, minHeight: 0, maxHeight: 0 };
+  if (variant === "docked" || variant === "docked-with-gap") {
+    const ratio = variant === "docked" ? m.dockedMaxHeightRatio : m.withGapMaxHeightRatio;
+    const tableMax = w.height * ratio;
+    const maxHeight = lerp(c.height, tableMax, Math.max(value, 0));
+    const minHeight = Math.min(Math.min(m.dockedMinHeight, tableMax), maxHeight);
+    if (variant === "docked") {
+      return {
+        surface: { ...c, radius: 0, alpha: 1, minHeight, maxHeight },
+        field: { x: c.x, y: c.y, width: c.width },
+        results: { x: c.x, y: c.y + c.height, width: c.width, maxHeight: maxHeight - c.height }
+      };
+    }
+    return {
+      surface: { x: 0, y: 0, width: w.width, height: w.height, ...none, alpha: p },
+      field: { x: c.x, y: c.y, width: c.width },
+      results: {
+        x: c.x,
+        y: c.y + c.height + m.dropdownGap,
+        width: c.width,
+        maxHeight: Math.max(0, maxHeight - c.height - m.dropdownGap)
+      }
+    };
+  }
+  const contained = variant === "full-screen-contained";
+  const width = contained ? w.width : lerp(c.width, w.width, p);
+  const height = contained ? w.height : lerp(c.height, w.height, p);
+  const offsetX = contained ? 0 : lerp(c.x, 0, p);
+  const padding = contained ? m.containedHorizontalPadding : 0;
+  const fieldWidth = lerp(c.width, width - 2 * padding, value);
+  const centerX2 = lerp(c.x + c.width / 2, offsetX + width / 2, value);
+  const topPadding = insetTop + (contained ? m.containedTopPadding : m.verticalPadding);
+  const animatedTopPadding = topPadding * Math.min(p, 1);
+  const bottomPadding = contained ? m.verticalPadding : m.verticalPadding * p;
+  const offsetY = lerp(c.y, 0, p);
+  const fieldY = offsetY + animatedTopPadding;
+  return {
+    surface: contained ? { x: 0, y: 0, width, height, ...none, alpha: p } : { x: offsetX, y: offsetY, width, height, ...none, radius: m.cornerRadius * (1 - p) },
+    field: { x: Math.round(centerX2 - fieldWidth / 2), y: fieldY, width: fieldWidth },
+    results: {
+      x: offsetX,
+      y: fieldY + c.height + bottomPadding,
+      width,
+      maxHeight: Math.max(0, height - (c.height + animatedTopPadding + bottomPadding))
+    }
+  };
 }
-function isScrolledUnder(state) {
-  return overlappedFraction(state) > 0.01;
+function searchNavigationTarget(key, enabled, active) {
+  const indices = enabled.flatMap((on, i) => on ? [i] : []);
+  const first = indices[0];
+  const last = indices.at(-1);
+  if (first === void 0 || last === void 0) return null;
+  const at2 = indices.indexOf(active);
+  if (key === "ArrowDown") return at2 === -1 ? first : indices[at2 + 1] ?? last;
+  if (key === "ArrowUp") return at2 === -1 ? last : at2 === 0 ? -1 : indices[at2 - 1] ?? first;
+  return null;
 }
-function scrollAppBar(state, behavior, scrollTop, delta) {
-  const next = { ...state, contentOffset: -scrollTop, atStart: scrollTop <= 0 };
-  return behavior === "enter-always" ? withHeightOffset(next, state.heightOffset + delta) : next;
+
+// src/button-group.ts
+function buttonGroupVisibleCount(widths, spacing, maxWidth, overflowWidth) {
+  const desired = widths.reduce((sum, w) => sum + w, 0) + spacing * (widths.length - 1);
+  if (desired <= maxWidth) return widths.length;
+  let remaining = maxWidth - overflowWidth;
+  let last = 0;
+  for (const width of widths) {
+    if (width > remaining) break;
+    remaining -= width + spacing;
+    last++;
+  }
+  return last;
 }
-function settleTarget(state) {
-  const fraction = collapsedFraction(state);
-  if (fraction < 0.01 || fraction === 1) return null;
-  if (!(state.heightOffset < 0 && state.heightOffset > state.heightOffsetLimit)) return null;
-  return fraction < 0.5 ? 0 : state.heightOffsetLimit;
+function buttonGroupWidths(items, pressed, expandedRatio, visibleCount = items.length) {
+  const widths = items.map((item) => item.width);
+  const w = (i) => widths[i] ?? 0;
+  const limit = (i) => items[i]?.compressionLimit ?? 0;
+  const last = Math.min(visibleCount, items.length);
+  if (items.length <= 1) return widths.slice(0, last);
+  for (let index = 0; index < last; index++) {
+    const value = pressed[index] ?? 0;
+    if (value === 0) continue;
+    let growth;
+    if (index >= 1 && index < last - 1) {
+      const target = value * Math.min(expandedRatio * w(index) / 2, limit(index - 1), limit(index + 1));
+      const left = Math.min(target, w(index - 1));
+      const right = Math.min(target, w(index + 1));
+      widths[index - 1] = w(index - 1) - left;
+      widths[index + 1] = w(index + 1) - right;
+      growth = left + right;
+    } else if (index === 0) {
+      const target = value * Math.min(expandedRatio * w(index), limit(index + 1));
+      const right = Math.min(target, w(index + 1));
+      widths[index + 1] = w(index + 1) - right;
+      growth = right;
+    } else {
+      const target = value * Math.min(expandedRatio * w(index), limit(index - 1));
+      const left = Math.min(target, w(index - 1));
+      widths[index - 1] = w(index - 1) - left;
+      growth = left;
+    }
+    widths[index] = w(index) + growth;
+  }
+  return widths.slice(0, last);
 }
 
-export { DEFAULT_DISPLACEMENT_THRESHOLD, SpringSimulation, appBarScrollState, collapsedFraction, dampingCoefficient, dampingRatioFromCoefficient, estimateAnimationDurationMillis, estimateAnimationDurationMillisDouble, indeterminateFrame, initialIndeterminateFrame, isScrolledUnder, morphSpringDurationMillis, overlappedFraction, scrollAppBar, settleTarget, springDurationMillis, springToLinear, springValue, springVelocity, withHeight, withHeightOffset };
+export { AmplitudeAnimation, DEFAULT_DISPLACEMENT_THRESHOLD, FAST_OUT_LINEAR_IN_EASING, SEARCH_BAR_EXPANDED_THRESHOLD, SEARCH_DROPDOWN_VISIBLE_PROGRESS, SearchBarAnimation, SpringAnimatable, SpringSimulation, TOP_TITLE_ALPHA_EASING, TweenAnimatable, animatedInt, appBarScrollState, buttonGroupVisibleCount, buttonGroupWidths, circularIndeterminateFrame, collapsedFraction, cubicBezier, dampingCoefficient, dampingRatioFromCoefficient, estimateAnimationDurationMillis, estimateAnimationDurationMillisDouble, fabMenuItemVisible, floatingToolbarScrollState, indeterminateFrame, indicatorAmplitude, initialIndeterminateFrame, isScrolledUnder, linearIndeterminateFractions, menuNavigationTarget, menuPosition, menuTransformOrigin, morphSpringDurationMillis, overlappedFraction, parseCubicBezier, scrollAppBar, scrollFloatingToolbar, scrollToolbarExpansion, searchNavigationTarget, searchViewFrame, settleTarget, springDurationMillis, springToLinear, springValue, springVelocity, toolbarCollapsedFraction, toolbarExpansionScroll, toolbarNavigationTarget, toolbarSettleTarget, twoRowsFrame, waveOffset, waveTravelMillis, withHeight, withHeightOffset, withToolbarOffset, withToolbarOffsetLimit };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map