use std::{
cell::{Cell, RefCell},
rc::Rc,
};
use cranpose_core::{MutableState, SideEffect, mutableStateOf, remember, rememberMutableStateOf};
use cranpose_foundation::PointerId;
use cranpose_macros::composable;
use cranpose_ui::{
Modifier, PointerEventKind, PointerInputScope, PressInteractionPress, SemanticsSpec,
SemanticsWidgetRole, Size, rememberMutableInteractionSource,
text::{FontWeight, SpanStyle, TextStyle, TextUnit},
widgets::{Box, BoxSpec, Column, ColumnSpec, PopupDismissableWhen, Row, RowSpec, Text},
};
use cranpose_ui_graphics::{Brush, Color, CornerRadii, GraphicsLayer, Point, Rect, RenderEffect};
use cranpose_ui_layout::VerticalAlignment;
use crate::{
material::{GlassDynamics, GlassMorph, GlassShadow, LiquidModifierExt, LiquidShape},
theme::{liquid_colors, liquid_typography},
widgets::content_scope::ScopeContent,
};
#[derive(Clone, Debug, PartialEq)]
pub struct LiquidMenuItem {
pub label: String,
pub icon: Option<&'static str>,
pub checked: bool,
pub destructive: bool,
pub section_start: bool,
pub header: bool,
pub keeps_open: bool,
pub subtitle: Option<String>,
}
impl LiquidMenuItem {
pub fn new(label: impl Into<String>) -> Self {
Self {
label: label.into(),
icon: None,
checked: false,
destructive: false,
section_start: false,
header: false,
keeps_open: false,
subtitle: None,
}
}
pub fn header(label: impl Into<String>) -> Self {
Self {
header: true,
..Self::new(label)
}
}
pub fn icon(mut self, icon: &'static str) -> Self {
self.icon = Some(icon);
self
}
pub fn checked(mut self, checked: bool) -> Self {
self.checked = checked;
self
}
pub fn destructive(mut self) -> Self {
self.destructive = true;
self
}
pub fn section_start(mut self) -> Self {
self.section_start = true;
self
}
pub fn keeps_open(mut self) -> Self {
self.keeps_open = true;
self
}
pub fn subtitle(mut self, subtitle: impl Into<String>) -> Self {
self.subtitle = Some(subtitle.into());
self
}
}
#[derive(Clone, Debug, PartialEq)]
pub struct LiquidMenuAbsorbedSource {
pub rect: Rect,
pub spec: crate::widgets::GlassButtonSpec,
pub diameter: f32,
pub icon_path: &'static str,
}
#[derive(Clone, Debug, Default, PartialEq)]
pub struct LiquidDropdownMenuSpec {
pub menu: LiquidMenuSpec,
pub absorbed: Vec<LiquidMenuAbsorbedSource>,
}
impl LiquidDropdownMenuSpec {
pub fn menu(mut self, menu: LiquidMenuSpec) -> Self {
self.menu = menu;
self
}
pub fn absorbed(mut self, absorbed: Vec<LiquidMenuAbsorbedSource>) -> Self {
self.absorbed = absorbed;
self
}
}
#[derive(Clone)]
struct LiquidMenuEntry {
item: LiquidMenuItem,
action: Option<Rc<dyn Fn()>>,
}
pub struct LiquidMenuScope {
entries: ScopeContent<LiquidMenuEntry>,
section_next: Cell<bool>,
}
impl LiquidMenuScope {
pub fn item(&self, item: LiquidMenuItem, on_click: impl Fn() + 'static) {
self.push(LiquidMenuEntry {
item,
action: Some(Rc::new(on_click)),
});
}
pub fn header(&self, label: impl Into<String>) {
self.push(LiquidMenuEntry {
item: LiquidMenuItem::header(label),
action: None,
});
}
pub fn separator(&self) {
self.section_next.set(true);
}
fn push(&self, mut entry: LiquidMenuEntry) {
if self.section_next.replace(false) {
entry.item.section_start = true;
}
self.entries.push(entry);
}
}
fn collect_entries(content: impl FnOnce(&LiquidMenuScope)) -> Vec<LiquidMenuEntry> {
ScopeContent::collect(
|entries| LiquidMenuScope {
entries,
section_next: Cell::new(false),
},
content,
)
}
fn menu_bounds(anchor: Rect, viewport: Size, width: f32, height: f32) -> (Rect, bool) {
let width = if viewport.width > 0.0 {
width.min((viewport.width - 32.0).max(1.0))
} else {
width
};
let left = anchor.x + (anchor.width - width) * 0.5;
let left = if viewport.width > 0.0 {
left.clamp(16.0, (viewport.width - width - 16.0).max(16.0))
} else {
left
};
let opens_up = viewport.height > 0.0 && anchor.y + anchor.height * 0.5 > viewport.height * 0.5;
let top = if opens_up {
anchor.y + anchor.height - height
} else {
anchor.y
};
(
Rect {
x: left,
y: top,
width,
height,
},
opens_up,
)
}
fn menu_items_changed(
last: &RefCell<Option<Rc<Vec<LiquidMenuEntry>>>>,
items: &Rc<Vec<LiquidMenuEntry>>,
) -> bool {
let mut previous = last.borrow_mut();
let changed = previous.as_ref().is_some_and(|previous| {
!previous
.iter()
.map(|entry| &entry.item)
.eq(items.iter().map(|entry| &entry.item))
});
*previous = Some(Rc::clone(items));
changed
}
fn menu_display_rows(
items: &[LiquidMenuEntry],
opens_up: bool,
) -> impl Iterator<Item = (usize, bool)> + '_ {
let mut cursor = if opens_up { items.len() } else { 0 };
std::iter::from_fn(move || {
let (start, end) = if opens_up {
if cursor == 0 {
return None;
}
let end = cursor;
let start = items[..end]
.iter()
.rposition(|entry| entry.item.header || entry.item.section_start)
.unwrap_or(0);
cursor = start;
(start, end)
} else {
if cursor == items.len() {
return None;
}
let start = cursor;
let end = items[start + 1..]
.iter()
.position(|entry| entry.item.header || entry.item.section_start)
.map_or(items.len(), |offset| start + 1 + offset);
cursor = end;
(start, end)
};
Some((start, end))
})
.enumerate()
.flat_map(move |(group, (start, end))| {
let header = items[start].item.header.then_some(start);
let body_start = start + usize::from(header.is_some());
let first = header.unwrap_or(if opens_up { end - 1 } else { start });
header
.into_iter()
.chain((body_start..end).map(move |index| {
if opens_up {
end - 1 - (index - body_start)
} else {
index
}
}))
.map(move |index| (index, group > 0 && index == first))
})
}
impl LiquidMenuAbsorbedSource {
pub fn new(
rect: Rect,
spec: crate::widgets::GlassButtonSpec,
diameter: f32,
icon_path: &'static str,
) -> Self {
Self {
rect,
spec,
diameter,
icon_path,
}
}
}
#[derive(Clone, Copy, Debug, PartialEq)]
pub struct LiquidMenuSpec {
pub width: f32,
}
impl Default for LiquidMenuSpec {
fn default() -> Self {
Self { width: MENU_WIDTH }
}
}
impl LiquidMenuSpec {
pub fn new(width: f32) -> Self {
Self {
width: if width.is_finite() {
width.max(120.0)
} else {
MENU_WIDTH
},
}
}
}
const MENU_WIDTH: f32 = 250.0;
const MENU_SHADOW_PAD: f32 = 48.0;
const MENU_RADIUS: f32 = 32.0;
const MENU_GROW_DELAY: f32 = 0.050;
const MENU_SOURCE_SEPARATE_END: f32 = 0.06;
const MENU_CARD_WIDTH_GROW_START: f32 = 0.16;
const MENU_CARD_HEIGHT_GROW_START: f32 = 0.12;
const MENU_OVERSHOOT_SCALE: f32 = 0.30;
const MENU_GROW_STIFFNESS: f32 = 62.0;
const MENU_REVEAL_STIFFNESS: f32 = 26.0;
const MENU_WIDTH_EASE_POWER: f32 = 4.5;
const MENU_HEIGHT_EASE_POWER: f32 = 18.0;
const MENU_HEIGHT_OVERSHOOT: f32 = 0.15;
const MENU_HEIGHT_OVERSHOOT_END: f32 = 0.52;
const MENU_VERTICAL_REBOUND: f32 = 18.0;
const MENU_VERTICAL_REBOUND_END: f32 = 0.70;
const MENU_SOURCE_HEIGHT_RATIO: f32 = 0.86;
const MENU_SOURCE_TARGET_Y_PROGRESS: f32 = 0.0;
const ANCHOR_OVERLAP: f32 = 0.0;
const ROW_PADDING_X: f32 = 28.0;
const ROW_PADDING_Y: f32 = 9.0;
const CHIP_INSET_X: f32 = 10.0;
const MENU_CONTENT_INSET_Y: f32 = 10.0;
const CHECK_COLUMN: f32 = 24.0;
const ICON_SIZE: f32 = 24.0;
const ICON_GAP: f32 = 12.0;
const MENU_LONG_PRESS_MS: u64 = 500;
const MENU_LONG_PRESS_SLOP: f32 = 12.0;
const MENU_CONTENT_BLUR: f32 = 14.0;
const MENU_CONTENT_BLUR_POWER: f32 = 0.65;
const MENU_CONTENT_ALPHA_POWER: f32 = 0.45;
const MENU_TRIGGER_GLASS_CUTOFF: f32 = 0.05;
const MENU_TRIGGER_ABSORPTION_MS: u64 = 36;
const MENU_TRIGGER_RESTORE_DELAY_MS: u64 = 205;
const MENU_SOURCE_FOREGROUND_HIDE_MS: u64 = 200;
const MENU_SOURCE_FOREGROUND_RESTORE_DELAY_MS: u64 = 205;
#[derive(Clone, Copy, Debug, PartialEq)]
struct MenuGestureSnapshot {
active: bool,
claimed: bool,
start: Point,
position: Point,
release: Option<(u64, Point)>,
}
impl Default for MenuGestureSnapshot {
fn default() -> Self {
Self {
active: false,
claimed: false,
start: Point::new(0.0, 0.0),
position: Point::new(0.0, 0.0),
release: None,
}
}
}
struct LiquidMenuGestureInner {
snapshot: MutableState<MenuGestureSnapshot>,
next_release: Cell<u64>,
item_rects: RefCell<Vec<Rc<Cell<Rect>>>>,
}
#[derive(Clone)]
pub struct LiquidMenuGesture {
inner: Rc<LiquidMenuGestureInner>,
}
impl PartialEq for LiquidMenuGesture {
fn eq(&self, other: &Self) -> bool {
Rc::ptr_eq(&self.inner, &other.inner)
}
}
impl LiquidMenuGesture {
pub fn is_pressed(&self) -> bool {
self.inner.snapshot.get().active
}
pub fn press_point(&self) -> Option<Point> {
let snapshot = self.inner.snapshot.get();
snapshot.active.then_some(snapshot.position)
}
fn new() -> Self {
Self {
inner: Rc::new(LiquidMenuGestureInner {
snapshot: mutableStateOf(MenuGestureSnapshot::default()),
next_release: Cell::new(0),
item_rects: RefCell::new(Vec::new()),
}),
}
}
fn id(&self) -> usize {
Rc::as_ptr(&self.inner) as usize
}
fn begin(&self, point: Point) {
self.inner.snapshot.set(MenuGestureSnapshot {
active: true,
start: point,
position: point,
..MenuGestureSnapshot::default()
});
}
fn move_to(&self, point: Point) {
let mut snapshot = self.inner.snapshot.get();
if snapshot.active {
snapshot.position = point;
self.inner.snapshot.set(snapshot);
}
}
fn claim(&self) {
let mut snapshot = self.inner.snapshot.get();
if snapshot.active && !snapshot.claimed {
snapshot.claimed = true;
self.inner.snapshot.set(snapshot);
}
}
fn release(&self, point: Point) {
let mut snapshot = self.inner.snapshot.get();
if !snapshot.active {
return;
}
snapshot.position = point;
snapshot.active = false;
if snapshot.claimed {
let sequence = self.inner.next_release.get().wrapping_add(1);
self.inner.next_release.set(sequence);
snapshot.release = Some((sequence, point));
}
self.inner.snapshot.set(snapshot);
}
fn cancel(&self) {
let mut snapshot = self.inner.snapshot.get();
snapshot.active = false;
snapshot.claimed = false;
snapshot.release = None;
self.inner.snapshot.set(snapshot);
}
fn snapshot(&self) -> MenuGestureSnapshot {
self.inner.snapshot.get()
}
fn item_rect(&self, index: usize) -> Rc<Cell<Rect>> {
let mut rects = self.inner.item_rects.borrow_mut();
while rects.len() <= index {
rects.push(Rc::new(Cell::new(Rect {
x: 0.0,
y: 0.0,
width: 0.0,
height: 0.0,
})));
}
Rc::clone(&rects[index])
}
fn item_at(&self, point: Point, items: &[LiquidMenuEntry]) -> Option<usize> {
self.inner
.item_rects
.borrow()
.iter()
.enumerate()
.take(items.len())
.find_map(|(index, rect)| {
(!items[index].item.header && rect.get().contains(point.x, point.y))
.then_some(index)
})
}
}
#[composable]
#[track_caller]
pub fn rememberLiquidMenuGesture() -> LiquidMenuGesture {
remember(LiquidMenuGesture::new).with(Clone::clone)
}
#[composable]
pub fn LiquidMenuAbsorbedIconButton(
modifier: Modifier,
spec: crate::widgets::GlassButtonSpec,
diameter: f32,
transferred: bool,
on_click: impl Fn() + 'static,
icon_path: &'static str,
) {
let foreground = cranpose_animation::animate_float_as_state_with_initial(
1.0,
if transferred { 0.0 } else { 1.0 },
cranpose_animation::AnimationType::Tween(if transferred {
cranpose_animation::AnimationSpec::tween(
MENU_SOURCE_FOREGROUND_HIDE_MS,
cranpose_animation::Easing::LinearEasing,
)
} else {
cranpose_animation::AnimationSpec::tween(5, cranpose_animation::Easing::EaseOut)
.with_delay(MENU_SOURCE_FOREGROUND_RESTORE_DELAY_MS)
}),
"menu-source-foreground-ownership",
);
crate::widgets::button::GlassIconButtonWithForegroundAlpha(
modifier,
spec,
diameter,
foreground.get(),
on_click,
icon_path,
);
}
#[derive(Clone, Copy, Debug, PartialEq)]
struct MenuGeometryPhase {
path: f32,
width: f32,
height: f32,
}
fn menu_geometry_phase(expanded: bool, appear: f32) -> MenuGeometryPhase {
if expanded && appear > 1.0 {
let settle = 1.0 + (appear - 1.0) * MENU_OVERSHOOT_SCALE;
return MenuGeometryPhase {
path: settle,
width: settle,
height: settle,
};
}
let appear = appear.clamp(0.0, 1.0);
if !expanded {
let normalized = ((appear - 0.015) / 0.985).clamp(0.0, 1.0);
return MenuGeometryPhase {
path: normalized,
width: 1.0 - (1.0 - normalized).powf(2.5),
height: 1.0 - (1.0 - normalized).powf(14.0),
};
}
if appear < MENU_GROW_DELAY {
let source_merge = smoothstep(0.10, 0.58, appear / MENU_GROW_DELAY);
return MenuGeometryPhase {
path: 0.0,
width: source_merge,
height: source_merge,
};
}
let path = ((appear - MENU_GROW_DELAY) / (1.0 - MENU_GROW_DELAY)).clamp(0.0, 1.0);
let width_growth =
((path - MENU_CARD_WIDTH_GROW_START) / (1.0 - MENU_CARD_WIDTH_GROW_START)).clamp(0.0, 1.0);
let height_growth = ((path - MENU_CARD_HEIGHT_GROW_START)
/ (1.0 - MENU_CARD_HEIGHT_GROW_START))
.clamp(0.0, 1.0);
let overshoot_phase = ((path - 0.50) / 0.50).clamp(0.0, 1.0);
let overshoot = 0.040 * (std::f32::consts::PI * overshoot_phase).sin().max(0.0);
let height_overshoot_phase = (height_growth / MENU_HEIGHT_OVERSHOOT_END).clamp(0.0, 1.0);
let height_overshoot = MENU_HEIGHT_OVERSHOOT
* (std::f32::consts::PI * height_overshoot_phase)
.sin()
.max(0.0);
MenuGeometryPhase {
path,
width: 1.0 - (1.0 - width_growth).powf(MENU_WIDTH_EASE_POWER) + overshoot,
height: 1.0 - (1.0 - height_growth).powf(MENU_HEIGHT_EASE_POWER) + height_overshoot,
}
}
#[derive(Clone, Copy, Debug, PartialEq)]
struct MenuShape {
center_x: f32,
center_y: f32,
width: f32,
height: f32,
radius: f32,
}
impl MenuShape {
fn capsule(center_x: f32, center_y: f32, width: f32, height: f32) -> Self {
Self {
center_x,
center_y,
width,
height,
radius: -1.0,
}
}
fn from_window_rect(rect: Rect, node_origin: Point) -> Option<Self> {
(rect.width > 0.0 && rect.height > 0.0).then(|| {
Self::capsule(
rect.x + rect.width * 0.5 - node_origin.x,
rect.y + rect.height * 0.5 - node_origin.y,
rect.width,
rect.height,
)
})
}
fn as_glass_shape(self) -> (f32, f32, f32, f32, f32) {
(
self.center_x,
self.center_y,
self.width,
self.height,
self.radius,
)
}
}
#[derive(Clone, Copy, Debug, PartialEq)]
struct MenuMorphGeometry {
primary: MenuShape,
source: MenuShape,
target: MenuShape,
path: f32,
}
fn menu_source_shape(anchor: MenuShape, absorbed: &[MenuShape], target: MenuShape) -> MenuShape {
let mut left = anchor.center_x - anchor.width * 0.5;
let mut right = anchor.center_x + anchor.width * 0.5;
let mut top = anchor.center_y - anchor.height * 0.5;
let mut bottom = anchor.center_y + anchor.height * 0.5;
for shape in absorbed {
left = left.min(shape.center_x - shape.width * 0.5);
right = right.max(shape.center_x + shape.width * 0.5);
top = top.min(shape.center_y - shape.height * 0.5);
bottom = bottom.max(shape.center_y + shape.height * 0.5);
}
let width = right - left;
let cluster_height = bottom - top;
let height = cluster_height
.max(width * MENU_SOURCE_HEIGHT_RATIO)
.min(target.height);
let cluster_center_y = (top + bottom) * 0.5;
MenuShape::capsule(
(left + right) * 0.5,
cluster_center_y + (target.center_y - cluster_center_y) * MENU_SOURCE_TARGET_Y_PROGRESS,
width,
height,
)
}
fn interpolate_menu_shape(
start: MenuShape,
target: MenuShape,
width_progress: f32,
height_progress: f32,
) -> MenuShape {
let lerp = |a: f32, b: f32, progress: f32| a + (b - a) * progress;
MenuShape::capsule(
lerp(start.center_x, target.center_x, width_progress),
lerp(start.center_y, target.center_y, height_progress),
lerp(start.width, target.width, width_progress),
lerp(start.height, target.height, height_progress),
)
}
fn menu_vertical_rebound(path: f32) -> f32 {
if !(0.0..MENU_VERTICAL_REBOUND_END).contains(&path) {
return 0.0;
}
let normalized = path / MENU_VERTICAL_REBOUND_END;
let onset = smoothstep(0.0, 0.012, path);
MENU_VERTICAL_REBOUND
* onset
* (std::f32::consts::PI * normalized.powf(0.45))
.sin()
.max(0.0)
}
fn menu_morph_geometry(
expanded: bool,
appear: f32,
anchor: MenuShape,
absorbed: &[MenuShape],
target: MenuShape,
) -> MenuMorphGeometry {
let phase = menu_geometry_phase(expanded, appear);
let source = menu_source_shape(anchor, absorbed, target);
let mut primary = if expanded && phase.path < MENU_SOURCE_SEPARATE_END {
anchor
} else {
let start = if expanded { source } else { anchor };
interpolate_menu_shape(start, target, phase.width, phase.height)
};
if expanded && phase.path >= MENU_SOURCE_SEPARATE_END {
let descent = smoothstep(0.10, 0.90, phase.path);
primary.center_y = source.center_y + (target.center_y - source.center_y) * descent;
primary.center_y +=
(target.center_y - source.center_y).signum() * menu_vertical_rebound(phase.path);
}
let blob_radius = primary.height * 0.5;
let squareness = smoothstep(0.55, 0.88, phase.path);
primary.radius = if !expanded {
blob_radius
} else if phase.path >= 1.0 {
target.radius
} else {
blob_radius + (target.radius - blob_radius) * squareness
};
MenuMorphGeometry {
primary,
source,
target,
path: phase.path,
}
}
fn menu_ellipse_blend(path: f32) -> f32 {
0.5 * smoothstep(0.06, 0.22, path) * (1.0 - smoothstep(0.62, 0.88, path))
}
fn menu_content_progress(expanded: bool, appear: f32, reveal: f32) -> f32 {
if expanded {
smoothstep(0.17, 0.82, reveal)
} else {
smoothstep(0.20, 0.75, appear)
}
}
fn menu_content_blur(progress: f32) -> f32 {
MENU_CONTENT_BLUR * (1.0 - progress.clamp(0.0, 1.0)).powf(MENU_CONTENT_BLUR_POWER)
}
fn menu_content_alpha(progress: f32) -> f32 {
progress.clamp(0.0, 1.0).powf(MENU_CONTENT_ALPHA_POWER)
}
fn menu_content_scale(progress: f32) -> f32 {
0.80 + 0.20 * progress.clamp(0.0, 1.0)
}
#[derive(Clone, Copy, Debug, PartialEq)]
struct MenuAbsorbedVisualPhase {
foreground_alpha: f32,
backdrop_alpha: f32,
foreground_blur: f32,
scale_x: f32,
scale_y: f32,
}
fn menu_absorbed_visual_phase(appear: f32, path: f32) -> MenuAbsorbedVisualPhase {
let appear = appear.clamp(0.0, 1.0);
let path = path.clamp(0.0, 1.0);
let shrink = smoothstep(0.0, 0.24, path);
let base_scale = 1.0 - 0.25 * shrink;
let stretch = smoothstep(0.30, 0.56, path);
let handoff = smoothstep(0.30, 0.55, appear);
let readable_alpha = 1.0 + (0.40 - 1.0) * handoff;
MenuAbsorbedVisualPhase {
foreground_alpha: readable_alpha * (1.0 - smoothstep(0.45, 0.85, path)),
backdrop_alpha: 0.62 * smoothstep(0.45, 0.85, path),
foreground_blur: 7.0 * smoothstep(0.45, 0.85, path),
scale_x: base_scale * (1.0 + 0.20 * stretch),
scale_y: base_scale * (1.0 + 0.28 * stretch),
}
}
#[derive(Clone, Copy, Debug, PartialEq)]
struct MenuSurfacePhase {
anchor_presence: f32,
glue: f32,
wobble: f32,
bulge: f32,
}
fn menu_surface_phase(expanded: bool, appear: f32, path: f32) -> MenuSurfacePhase {
let appear = appear.clamp(0.0, 1.0);
let path = path.clamp(0.0, 1.0);
let activity = (std::f32::consts::PI * path).sin().max(0.0);
if expanded && path <= f32::EPSILON {
let recoil = (appear / MENU_GROW_DELAY).clamp(0.0, 1.0);
return MenuSurfacePhase {
anchor_presence: 0.0,
glue: 0.0,
wobble: 0.18 * (std::f32::consts::PI * recoil).sin().max(0.0),
bulge: 0.0,
};
}
if expanded {
return MenuSurfacePhase {
anchor_presence: 0.0,
glue: 0.0,
wobble: 0.08 * activity,
bulge: 0.35 * activity,
};
}
MenuSurfacePhase {
anchor_presence: 0.0,
glue: 0.0,
wobble: 0.04 * activity,
bulge: 0.25 * activity,
}
}
fn menu_absorbed_shape_presence(path: f32) -> f32 {
1.0 - smoothstep(MENU_SOURCE_SEPARATE_END, 0.30, path)
}
fn smoothstep(edge0: f32, edge1: f32, value: f32) -> f32 {
let t = ((value - edge0) / (edge1 - edge0)).clamp(0.0, 1.0);
t * t * (3.0 - 2.0 * t)
}
pub fn liquid_menu_trigger_input(
modifier: Modifier,
gesture: LiquidMenuGesture,
on_open: impl Fn() + 'static,
) -> Modifier {
let gate = remember(|| {
let runtime = cranpose_core::with_current_composer(cranpose_core::Composer::runtime_handle);
Rc::new(RefCell::new(cranpose_animation::Animatable::new(
0.0, runtime,
)))
})
.with(Rc::clone);
let on_open: Rc<dyn Fn()> = Rc::new(on_open);
let snapshot = gesture.snapshot();
let gate_progress = gate.borrow().state().value();
if gate_progress >= 1.0 && snapshot.active && !snapshot.claimed {
gesture.claim();
let on_open = Rc::clone(&on_open);
SideEffect(move || on_open());
}
modifier.pointer_input(gesture.id(), {
let gate = Rc::clone(&gate);
let on_open = Rc::clone(&on_open);
move |scope: PointerInputScope| {
let gesture = gesture.clone();
let gate = Rc::clone(&gate);
let on_open = Rc::clone(&on_open);
async move {
scope
.await_pointer_event_scope(|await_scope| async move {
let mut active_pointer = Option::<PointerId>::None;
let mut moved = false;
loop {
let event = await_scope.await_pointer_event().await;
match event.kind {
PointerEventKind::Down if active_pointer.is_none() => {
active_pointer = Some(event.id);
moved = false;
gesture.begin(event.global_position);
let mut timer = gate.borrow_mut();
timer.snapTo(0.0);
timer.animateTo(
1.0,
cranpose_animation::AnimationType::Tween(
cranpose_animation::AnimationSpec::linear(
MENU_LONG_PRESS_MS,
),
),
);
event.consume();
}
PointerEventKind::Move if active_pointer == Some(event.id) => {
gesture.move_to(event.global_position);
let state = gesture.snapshot();
let dx = event.global_position.x - state.start.x;
let dy = event.global_position.y - state.start.y;
if !state.claimed
&& dx * dx + dy * dy
> MENU_LONG_PRESS_SLOP * MENU_LONG_PRESS_SLOP
{
moved = true;
gate.borrow_mut().snapTo(0.0);
}
event.consume();
}
PointerEventKind::Up if active_pointer == Some(event.id) => {
active_pointer = None;
let claimed = gesture.snapshot().claimed;
gate.borrow_mut().snapTo(0.0);
if claimed {
gesture.release(event.global_position);
} else {
gesture.cancel();
if !moved {
on_open();
}
}
event.consume();
}
PointerEventKind::Cancel if active_pointer == Some(event.id) => {
active_pointer = None;
gate.borrow_mut().snapTo(0.0);
gesture.cancel();
event.consume();
}
_ => {}
}
}
})
.await;
}
}
})
}
#[composable]
pub fn LiquidMenuIconButton(
modifier: Modifier,
spec: crate::widgets::GlassButtonSpec,
diameter: f32,
covered: bool,
gesture: LiquidMenuGesture,
on_open: impl Fn() + 'static,
icon_path: &'static str,
) {
let interaction = rememberMutableInteractionSource();
let (pressed_modifier, _, content_alpha) =
crate::motion::liquid_press_scale(Modifier::empty(), interaction, 1.12);
let trigger_visual = menu_trigger_visibility(covered);
let gate = remember(|| {
let runtime = cranpose_core::with_current_composer(|composer| composer.runtime_handle());
Rc::new(RefCell::new(cranpose_animation::Animatable::new(
0.0, runtime,
)))
})
.with(Rc::clone);
let on_open: Rc<dyn Fn()> = Rc::new(on_open);
let snapshot = gesture.snapshot();
let gate_progress = gate.borrow().state().value();
if gate_progress >= 1.0 && snapshot.active && !snapshot.claimed {
gesture.claim();
let on_open = Rc::clone(&on_open);
SideEffect(move || on_open());
}
let input = Modifier::empty()
.size(Size::new(diameter, diameter))
.pointer_input(gesture.id(), {
let gate = Rc::clone(&gate);
let on_open = Rc::clone(&on_open);
move |scope: PointerInputScope| {
let gesture = gesture.clone();
let gate = Rc::clone(&gate);
let on_open = Rc::clone(&on_open);
async move {
scope
.await_pointer_event_scope(|await_scope| async move {
let mut active_pointer = Option::<PointerId>::None;
let mut moved = false;
let mut press: Option<PressInteractionPress> = None;
loop {
let event = await_scope.await_pointer_event().await;
match event.kind {
PointerEventKind::Down if active_pointer.is_none() => {
active_pointer = Some(event.id);
moved = false;
gesture.begin(event.global_position);
press = Some(interaction.press(event.position));
let mut timer = gate.borrow_mut();
timer.snapTo(0.0);
timer.animateTo(
1.0,
cranpose_animation::AnimationType::Tween(
cranpose_animation::AnimationSpec::linear(
MENU_LONG_PRESS_MS,
),
),
);
event.consume();
}
PointerEventKind::Move if active_pointer == Some(event.id) => {
gesture.move_to(event.global_position);
let state = gesture.snapshot();
let dx = event.global_position.x - state.start.x;
let dy = event.global_position.y - state.start.y;
if !state.claimed
&& dx * dx + dy * dy
> MENU_LONG_PRESS_SLOP * MENU_LONG_PRESS_SLOP
{
moved = true;
gate.borrow_mut().snapTo(0.0);
}
event.consume();
}
PointerEventKind::Up if active_pointer == Some(event.id) => {
active_pointer = None;
let claimed = gesture.snapshot().claimed;
gate.borrow_mut().snapTo(0.0);
if claimed {
gesture.release(event.global_position);
} else {
gesture.cancel();
if !moved {
on_open();
}
}
if let Some(active_press) = press.take() {
interaction.release(active_press);
}
event.consume();
}
PointerEventKind::Cancel
if active_pointer == Some(event.id) =>
{
active_pointer = None;
gate.borrow_mut().snapTo(0.0);
gesture.cancel();
if let Some(active_press) = press.take() {
interaction.cancel(active_press);
}
event.consume();
}
_ => {}
}
}
})
.await;
}
}
});
Box(
pressed_modifier.size(Size::new(diameter, diameter)),
BoxSpec::default().content_alignment(cranpose_ui_layout::Alignment::CENTER),
move || {
let modifier = modifier.clone();
let visual_alpha = trigger_visual.get().clamp(0.0, 1.0);
let melt = 1.0 - visual_alpha;
let visual_spec = spec.clone();
let visual = Modifier::empty()
.size(Size::new(diameter, diameter))
.graphics_layer(move || GraphicsLayer {
alpha: visual_alpha * content_alpha.get().clamp(0.0, 1.0),
scale_x: 1.0 - 0.12 * melt,
scale_y: 1.0 - 0.12 * melt,
..Default::default()
});
Box(
visual,
BoxSpec::default().content_alignment(cranpose_ui_layout::Alignment::CENTER),
move || {
if visual_alpha > MENU_TRIGGER_GLASS_CUTOFF {
crate::widgets::GlassIconButton(
modifier.clone(),
visual_spec.clone(),
diameter,
|| {},
icon_path,
);
}
},
);
Box(input.clone(), BoxSpec::default(), || {});
},
);
}
#[composable]
fn AbsorbedSourceVisual(
source: LiquidMenuAbsorbedSource,
node_origin: Point,
alpha: f32,
blur: f32,
scale_x: f32,
scale_y: f32,
) {
if alpha <= 0.001 {
return;
}
let diameter = source.diameter;
let foreground_spec = source.spec.clone();
let layer = Modifier::empty()
.absolute_offset(source.rect.x - node_origin.x, source.rect.y - node_origin.y)
.size(Size::new(diameter, diameter))
.graphics_layer(move || GraphicsLayer {
alpha,
scale_x,
scale_y,
render_effect: (blur > 0.35).then(|| RenderEffect::blur(blur)),
..Default::default()
});
Box(
layer,
BoxSpec::default().content_alignment(cranpose_ui_layout::Alignment::CENTER),
move || {
crate::widgets::button::GlassIconForeground(
foreground_spec.clone(),
diameter,
source.icon_path,
);
},
);
}
#[composable]
pub fn LiquidMenu(
expanded: bool,
anchor: Rect,
spec: LiquidMenuSpec,
absorbed: Vec<LiquidMenuAbsorbedSource>,
gesture: LiquidMenuGesture,
on_dismiss: impl Fn() + 'static,
content: impl FnOnce(&LiquidMenuScope),
) {
let items = Rc::new(collect_entries(content));
let viewport = cranpose_ui::widgets::popup::local_popup_viewport()
.current()
.get();
let visible = remember(|| mutableStateOf(false)).with(|s| *s);
if expanded && !visible.get() {
visible.set(true);
}
if !expanded && !visible.get() {
return;
}
let colors = liquid_colors();
let typography = liquid_typography();
let entries = Rc::clone(&items);
let on_item: Rc<dyn Fn(usize)> = Rc::new(move |index| {
if let Some(action) = entries.get(index).and_then(|entry| entry.action.as_ref()) {
action();
}
});
let on_dismiss: Rc<dyn Fn()> = Rc::new(on_dismiss);
let gesture_snapshot = gesture.snapshot();
let gesture_hover = (gesture_snapshot.active && gesture_snapshot.claimed)
.then(|| gesture.item_at(gesture_snapshot.position, &items))
.flatten();
let dwell_gate = remember(|| {
let runtime = cranpose_core::with_current_composer(|composer| composer.runtime_handle());
Rc::new(RefCell::new(cranpose_animation::Animatable::new(
0.0f32, runtime,
)))
})
.with(Rc::clone);
let dwell_row = remember(|| Rc::new(Cell::new(Option::<usize>::None))).with(Rc::clone);
let dwell_fired = remember(|| Rc::new(Cell::new(Option::<usize>::None))).with(Rc::clone);
{
let hover_accordion = gesture_hover
.filter(|index| items.get(*index).is_some_and(|entry| entry.item.keeps_open));
if hover_accordion != dwell_row.get() {
dwell_row.set(hover_accordion);
dwell_fired.set(None);
let mut gate = dwell_gate.borrow_mut();
gate.snapTo(0.0);
if hover_accordion.is_some() {
gate.animateTo(
1.0,
cranpose_animation::AnimationType::Tween(
cranpose_animation::AnimationSpec::linear(450),
),
);
}
}
let gate_value = dwell_gate.borrow().state().get();
if gate_value >= 1.0 {
if let Some(index) = dwell_row.get() {
if dwell_fired.get() != Some(index) {
dwell_fired.set(Some(index));
let on_item_dwell = Rc::clone(&on_item);
SideEffect(move || on_item_dwell(index));
}
}
}
}
let handled_release = remember(|| Rc::new(Cell::new(0u64))).with(Rc::clone);
if let Some((sequence, point)) = gesture_snapshot.release {
if handled_release.get() != sequence {
handled_release.set(sequence);
if let Some(index) = gesture.item_at(point, &items) {
let keeps_open = items.get(index).is_some_and(|entry| entry.item.keeps_open);
let on_item = Rc::clone(&on_item);
let on_dismiss = Rc::clone(&on_dismiss);
SideEffect(move || commit_menu_row(index, keeps_open, &on_item, &on_dismiss));
}
}
}
let grow = cranpose_animation::animate_float_as_state_with_initial(
0.0,
if expanded { 1.0 } else { 0.0 },
if expanded {
cranpose_animation::spring(0.78, MENU_GROW_STIFFNESS)
} else {
cranpose_animation::AnimationType::Tween(cranpose_animation::AnimationSpec::linear(205))
},
"menu-grow",
);
let reveal_anim = cranpose_animation::animate_float_as_state_with_initial(
0.0,
if expanded { 1.0 } else { 0.0 },
if expanded {
cranpose_animation::spring(1.0, MENU_REVEAL_STIFFNESS)
} else {
cranpose_animation::spring(1.0, 900.0)
},
"menu-reveal",
);
let appear = grow.get().max(0.0);
let reveal = reveal_anim.get().clamp(0.0, 1.0);
if !expanded && appear < 0.02 {
visible.set(false);
return;
}
let anchor_zone = anchor.height * ANCHOR_OVERLAP;
let node_size = rememberMutableStateOf(|| cranpose_ui_graphics::Size::ZERO);
let resize_anim = remember(|| {
let runtime = cranpose_core::with_current_composer(|composer| composer.runtime_handle());
Rc::new(RefCell::new(cranpose_animation::Animatable::new(
1.0f32, runtime,
)))
})
.with(Rc::clone);
let resize_from_h = remember(|| Rc::new(Cell::new(0.0f32))).with(Rc::clone);
let changed = remember(|| RefCell::new(None::<Rc<Vec<LiquidMenuEntry>>>))
.with(|last| menu_items_changed(last, &items));
if changed && expanded && grow.get() > 0.5 && node_size.get().height > 1.0 {
resize_from_h.set(node_size.get().height);
let mut anim = resize_anim.borrow_mut();
anim.snapTo(0.0);
anim.animateTo(1.0, cranpose_animation::spring(0.78, 170.0));
}
let resize_state = resize_anim.borrow().state();
let menu_height = (node_size.get().height - MENU_SHADOW_PAD * 2.0).max(0.0);
let (bounds, opens_up) = menu_bounds(anchor, viewport, spec.width, menu_height);
let menu_width = bounds.width;
let menu_left = bounds.x;
let pivot_y = u8::from(opens_up) as f32;
let content_top_inset = if menu_display_rows(&items, opens_up)
.next()
.is_some_and(|(index, _)| items[index].item.header)
{
0.0
} else {
MENU_CONTENT_INSET_Y
};
let node_origin = Point::new(menu_left - MENU_SHADOW_PAD, bounds.y - MENU_SHADOW_PAD);
let scrim_dismiss = Rc::clone(&on_dismiss);
PopupDismissableWhen(
expanded,
anchor,
Point::new(node_origin.x - anchor.x, node_origin.y - anchor.y),
move || scrim_dismiss(),
{
let on_item = Rc::clone(&on_item);
let on_dismiss = Rc::clone(&on_dismiss);
move || {
let anchor_center = (
anchor.x + anchor.width * 0.5 - node_origin.x,
anchor.y + anchor.height * 0.5 - node_origin.y,
);
let anchor_shape = MenuShape::capsule(
anchor_center.0,
anchor_center.1,
anchor.width,
anchor.height,
);
let absorbed_shapes: Vec<MenuShape> = absorbed
.iter()
.filter_map(|source| MenuShape::from_window_rect(source.rect, node_origin))
.collect();
let morph_size = node_size;
let glass = super::glass_surface::control_surface_material(colors.label)
.shape(LiquidShape::RoundedRect(MENU_RADIUS))
.blur_radius(30.0);
let glass = glass
.shadow_style(GlassShadow::new(
Color::BLACK.with_alpha(if colors.is_dark { 0.60 } else { 0.11 }),
if colors.is_dark { 32.0 } else { 26.0 },
if colors.is_dark { 10.0 } else { 8.0 },
0.0,
))
.no_clip();
let resize_from = Rc::clone(&resize_from_h);
let glow_point: Rc<Cell<Option<(f32, f32)>>> =
remember(|| Rc::new(Cell::new(None))).with(Rc::clone);
let glow_for_glass = Rc::clone(&glow_point);
let glass_node_origin = node_origin;
let birth_milk = Some(if colors.is_dark {
Color::from_rgba_u8(208, 204, 214, 240)
} else {
Color::from_rgba_u8(246, 247, 250, 210)
});
let card = Modifier::empty()
.role(SemanticsWidgetRole::Menu)
.pane_title("Menu")
.report_size_state(node_size)
.glass_effect_with(glass, move || {
let glow_touch = glow_for_glass.get().map(|(x, y)| {
(x - glass_node_origin.x, y - glass_node_origin.y, 1.0f32)
});
let size = morph_size.get();
let measured_h =
(size.height - anchor_zone - MENU_SHADOW_PAD * 2.0).max(24.0);
let resize_t = resize_state.get();
let from_h =
(resize_from.get() - anchor_zone - MENU_SHADOW_PAD * 2.0).max(24.0);
let menu_h = if resize_from.get() > 1.0 {
from_h + (measured_h - from_h) * resize_t.max(0.0)
} else {
measured_h
};
let settle_radius = (menu_h * 0.32).clamp(26.0, MENU_RADIUS);
let target = MenuShape {
center_x: menu_width * 0.5 + MENU_SHADOW_PAD,
center_y: anchor_zone + MENU_SHADOW_PAD + menu_h * 0.5,
width: menu_width,
height: menu_h,
radius: settle_radius,
};
let geometry = menu_morph_geometry(
expanded,
appear,
anchor_shape,
&absorbed_shapes,
target,
);
let t = geometry.path;
let primary = geometry.primary.as_glass_shape();
let start = if expanded {
geometry.source
} else {
anchor_shape
};
let target = geometry.target;
let surface = menu_surface_phase(expanded, appear, t);
let dir_x = target.center_x - start.center_x;
let dir_y = target.center_y - start.center_y;
let mut bulge_dir = dir_y.atan2(dir_x);
if !expanded {
bulge_dir += std::f32::consts::PI;
}
let mut shapes = Vec::new();
if surface.anchor_presence > 0.01 {
shapes.push((
anchor_shape.center_x,
anchor_shape.center_y,
anchor_shape.width * surface.anchor_presence,
anchor_shape.height * surface.anchor_presence,
-1.0,
));
}
let absorbed_presence = menu_absorbed_shape_presence(t);
if expanded && absorbed_presence > 0.01 {
shapes.extend(absorbed_shapes.iter().map(|shape| {
(
shape.center_x,
shape.center_y,
shape.width * absorbed_presence,
shape.height * absorbed_presence,
-1.0,
)
}));
}
let glue = surface.glue;
let activity = if expanded {
smoothstep(0.0, 0.42, t)
} else {
smoothstep(0.0, 0.12, t)
};
GlassDynamics {
activity: Some(activity),
resting_tint: birth_milk,
touch: glow_touch,
morph: Some(GlassMorph {
node_size: (size.width.max(1.0), size.height.max(1.0)),
primary,
shapes,
glue,
wobble_amplitude: surface.wobble,
wobble_phase: t * 8.0,
bulge_amplitude: surface.bulge,
bulge_direction: bulge_dir,
ellipse_blend: menu_ellipse_blend(t),
capsule_smoothing_dp: 0.0,
deformation: None,
zoom_anchor: (0.0, 0.0),
}),
..Default::default()
}
})
.width(menu_width + MENU_SHADOW_PAD * 2.0);
let has_checks = items.iter().any(|entry| entry.item.checked);
let hovered = remember(|| mutableStateOf(Option::<usize>::None)).with(|s| *s);
let hovered_row = hovered.get();
let glow_row = gesture_hover.or(hovered_row);
glow_point.set(glow_row.map(|index| {
let rect = gesture.item_rect(index).get();
(rect.x + rect.width * 0.5, rect.y + rect.height * 0.5)
}));
let gesture = gesture.clone();
let source_phase =
menu_absorbed_visual_phase(appear, menu_geometry_phase(expanded, appear).path);
for source in absorbed.iter().cloned() {
AbsorbedSourceVisual(
source,
node_origin,
source_phase.backdrop_alpha,
0.0,
source_phase.scale_x,
source_phase.scale_y,
);
}
Box(card, BoxSpec::default(), {
let items = items.clone();
let typography = typography.clone();
let on_item = Rc::clone(&on_item);
let on_dismiss = Rc::clone(&on_dismiss);
move || {
Column(
Modifier::empty().fill_max_width().padding(MENU_SHADOW_PAD),
ColumnSpec::default(),
{
let items = items.clone();
let typography = typography.clone();
let on_item = Rc::clone(&on_item);
let on_dismiss = Rc::clone(&on_dismiss);
let gesture = gesture.clone();
move || {
Box(
Modifier::empty().height(anchor_zone),
BoxSpec::default(),
|| {},
);
let content = menu_content_progress(expanded, appear, reveal);
let resize_t = resize_state.get().clamp(0.0, 1.0);
let content =
content * (0.45 + 0.55 * smoothstep(0.35, 1.0, resize_t));
let content_scale = menu_content_scale(content);
let content_blur = menu_content_blur(content);
let content_translation_y = if expanded {
menu_vertical_rebound(
menu_geometry_phase(expanded, appear).path,
) * (1.0 - 2.0 * pivot_y)
} else {
0.0
};
let rows_wrap = Modifier::empty()
.fill_max_width()
.graphics_layer(move || GraphicsLayer {
alpha: menu_content_alpha(content),
scale_x: content_scale,
scale_y: content_scale,
transform_origin:
cranpose_ui_graphics::TransformOrigin {
pivot_fraction_x: ((anchor.x
+ anchor.width * 0.5
- menu_left)
/ menu_width)
.clamp(0.0, 1.0),
pivot_fraction_y: pivot_y,
},
translation_y: content_translation_y,
render_effect: (content_blur > 0.35)
.then(|| RenderEffect::blur(content_blur)),
..Default::default()
});
Box(rows_wrap, BoxSpec::default(), {
let items = items.clone();
let typography = typography.clone();
let on_item = Rc::clone(&on_item);
let on_dismiss = Rc::clone(&on_dismiss);
let gesture = gesture.clone();
move || {
Column(
Modifier::empty().fill_max_width().padding_each(
0.0,
content_top_inset,
0.0,
MENU_CONTENT_INSET_Y,
),
ColumnSpec::default(),
{
let items = items.clone();
let typography = typography.clone();
let on_item = Rc::clone(&on_item);
let on_dismiss = Rc::clone(&on_dismiss);
let gesture = gesture.clone();
move || {
for (index, starts_section) in
menu_display_rows(&items, opens_up)
{
let item = &items[index].item;
if starts_section {
let separator =
colors.separator.with_alpha(
colors.separator.a() * 0.22,
);
Box(
Modifier::empty()
.fill_max_width()
.padding_symmetric(ROW_PADDING_X, 0.0)
.height(11.0)
.draw_behind(move |scope| {
scope.draw_rect_at(Rect { x: 0.0, y: 5.0, width: scope.size().width, height: 1.0 / 3.0 }, Brush::solid(separator));
}),
BoxSpec::default(),
|| {},
);
}
if item.header {
menu_header_row(
item,
&typography,
has_checks,
colors,
);
continue;
}
let expanded_header = item.keeps_open
&& items
.get(index + 1)
.is_some_and(|next| {
!next.item.keeps_open
&& !next.item.header
});
menu_item_row(
index,
item,
&typography,
has_checks,
colors,
hovered,
gesture_hover,
expanded_header,
gesture.item_rect(index),
Rc::clone(&on_item),
Rc::clone(&on_dismiss),
);
}
}
},
);
}
});
}
},
);
}
});
for source in absorbed.iter().cloned() {
AbsorbedSourceVisual(
source,
node_origin,
source_phase.foreground_alpha,
source_phase.foreground_blur,
source_phase.scale_x,
source_phase.scale_y,
);
}
}
},
);
}
#[composable]
pub fn LiquidDropdownMenu<A>(
modifier: Modifier,
expanded: bool,
spec: LiquidDropdownMenuSpec,
on_dismiss: impl Fn() + 'static,
anchor_content: A,
content: impl Fn(&LiquidMenuScope) + 'static,
) where
A: FnMut() + 'static,
{
let anchor = rememberMutableStateOf(|| Rect {
x: 0.0,
y: 0.0,
width: 0.0,
height: 0.0,
});
let gesture = rememberLiquidMenuGesture();
let trigger_visual = menu_trigger_visibility(expanded);
Box(
modifier
.report_window_rect_state(anchor)
.graphics_layer(move || GraphicsLayer {
alpha: trigger_visual.get(),
..Default::default()
}),
BoxSpec::default(),
anchor_content,
);
LiquidMenu(
expanded,
anchor.get(),
spec.menu,
spec.absorbed,
gesture,
on_dismiss,
content,
);
}
#[track_caller]
fn menu_trigger_visibility(covered: bool) -> cranpose_core::State<f32> {
cranpose_animation::animate_float_as_state_with_initial(
1.0,
if covered { 0.0 } else { 1.0 },
cranpose_animation::AnimationType::Tween(if covered {
cranpose_animation::AnimationSpec::tween(
MENU_TRIGGER_ABSORPTION_MS,
cranpose_animation::Easing::EaseOut,
)
} else {
cranpose_animation::AnimationSpec::tween(5, cranpose_animation::Easing::EaseOut)
.with_delay(MENU_TRIGGER_RESTORE_DELAY_MS)
}),
"menu-trigger-absorption",
)
}
fn commit_menu_row(
index: usize,
keeps_open: bool,
on_item: &Rc<dyn Fn(usize)>,
on_dismiss: &Rc<dyn Fn()>,
) {
on_item(index);
if !keeps_open {
on_dismiss();
}
}
fn menu_header_row(
item: &LiquidMenuItem,
typography: &crate::theme::LiquidTypography,
has_checks: bool,
colors: crate::theme::LiquidColors,
) {
let label = item.label.clone();
let style = TextStyle {
span_style: SpanStyle {
color: Some(colors.secondary_label),
font_size: TextUnit::Sp(13.0),
..typography.footnote.span_style.clone()
},
..typography.footnote.clone()
};
let indent = ROW_PADDING_X + if has_checks { CHECK_COLUMN } else { 0.0 };
let row = Modifier::empty()
.fill_max_width()
.padding_each(indent, 12.0, ROW_PADDING_X, 11.0);
Row(row, RowSpec::default(), move || {
Text(label.clone(), Modifier::empty(), style.clone());
});
}
fn menu_row_semantics(label: String, has_checks: bool, checked: bool) -> SemanticsSpec {
let spec = SemanticsSpec::new()
.content_description(label)
.role(SemanticsWidgetRole::MenuItem)
.clickable();
match has_checks {
true => spec.toggled(checked),
false => spec,
}
}
#[expect(clippy::too_many_arguments)]
fn menu_item_row(
index: usize,
item: &LiquidMenuItem,
typography: &crate::theme::LiquidTypography,
has_checks: bool,
colors: crate::theme::LiquidColors,
hovered: cranpose_core::MutableState<Option<usize>>,
gesture_hover: Option<usize>,
expanded_header: bool,
rect_sink: Rc<Cell<Rect>>,
on_item: Rc<dyn Fn(usize)>,
on_dismiss: Rc<dyn Fn()>,
) {
let color = if item.destructive {
colors.destructive
} else {
colors.label
};
let is_hovered = hovered.get() == Some(index) || gesture_hover == Some(index);
let highlight = if colors.is_dark {
cranpose_ui_graphics::Color::from_rgba_u8(120, 120, 128, 44)
} else {
cranpose_ui_graphics::Color::from_rgba_u8(120, 120, 128, 30)
};
let row_label = item.label.clone();
let checked = item.checked;
let keeps_open = item.keeps_open;
let row = Modifier::empty()
.fill_max_width()
.height_in(42.0, f32::INFINITY)
.report_window_rect(rect_sink)
.semantics_spec(menu_row_semantics(row_label, has_checks, checked))
.focusable()
.pointer_input(index, {
let on_item = Rc::clone(&on_item);
let on_dismiss = Rc::clone(&on_dismiss);
move |scope: PointerInputScope| {
let on_item = Rc::clone(&on_item);
let on_dismiss = Rc::clone(&on_dismiss);
async move {
scope
.await_pointer_event_scope(|await_scope| async move {
loop {
let event = await_scope.await_pointer_event().await;
match event.kind {
PointerEventKind::Enter | PointerEventKind::Move => {
hovered.set(Some(index));
}
PointerEventKind::Exit if hovered.get() == Some(index) => {
hovered.set(None);
}
PointerEventKind::Down => {
hovered.set(Some(index));
event.consume();
}
PointerEventKind::Up => {
hovered.set(None);
commit_menu_row(index, keeps_open, &on_item, &on_dismiss);
event.consume();
}
_ => {}
}
}
})
.await;
}
}
})
.draw_behind(move |scope| {
if expanded_header {
let chip = if colors.is_dark {
Color::from_rgb_u8(255, 224, 248).with_alpha(0.52)
} else {
Color::BLACK.with_alpha(0.08)
};
let size = scope.size();
scope.draw_round_rect_at(
Rect {
x: CHIP_INSET_X,
y: 0.0,
width: (size.width - CHIP_INSET_X * 2.0).max(0.0),
height: size.height,
},
Brush::solid(chip),
CornerRadii::uniform(16.0),
);
}
if is_hovered {
scope.draw_round_rect(Brush::solid(highlight), CornerRadii::uniform(14.0));
}
})
.padding_symmetric(ROW_PADDING_X, ROW_PADDING_Y);
let label = item.label.clone();
let subtitle = item.subtitle.clone();
let icon = item.icon;
let accordion_chevron = item.keeps_open && subtitle.is_some();
let secondary = colors.secondary_label;
let typography = typography.clone();
Row(
row,
RowSpec::default().vertical_alignment(VerticalAlignment::CenterVertically),
move || {
let label = label.clone();
let subtitle = subtitle.clone();
if has_checks {
Box(
Modifier::empty().width(CHECK_COLUMN),
BoxSpec::default(),
move || {
if checked {
crate::icons::Icon(crate::icons::CHECK, None, 16.0, color);
}
},
);
}
if let Some(icon) = icon {
crate::icons::Icon(icon, None, ICON_SIZE, color);
Box(Modifier::empty().width(ICON_GAP), BoxSpec::default(), || {});
}
let style = TextStyle {
span_style: SpanStyle {
color: Some(color),
font_weight: Some(FontWeight::NORMAL),
..typography.body.span_style.clone()
},
..typography.body.clone()
};
if let Some(subtitle) = subtitle {
let subtitle_style = TextStyle {
span_style: SpanStyle {
color: Some(secondary),
font_size: TextUnit::Sp(13.0),
..typography.footnote.span_style.clone()
},
..typography.footnote.clone()
};
Column(
Modifier::empty().weight(1.0),
ColumnSpec::default(),
move || {
Text(label.clone(), Modifier::empty(), style.clone());
Text(subtitle.clone(), Modifier::empty(), subtitle_style.clone());
},
);
} else {
Text(label, Modifier::empty().weight(1.0), style);
}
if accordion_chevron {
crate::icons::Icon(crate::icons::CHEVRON_DOWN, None, 18.0, secondary);
}
},
);
}
#[cfg(test)]
#[path = "tests/menu_tests.rs"]
mod tests;