gpui-kit GitHub

Scenes

date-range

Builds Button Calendar DateInput Overlay RangePicker TimeInput

date-range in the dark theme
studio-dark
date-range in the light theme
studio-light

The code that drew it

A still frame holds a repeating animation at its first frame and a one-shot at its last, because a still of a moving thing is not reproducible. Run the gallery to review motion.

    pub(super) fn date_range(window: &mut Window, cx: &mut App) -> AnyElement {
        ensure(window, cx);
        let theme = cx.theme().clone();
        let dates = cx.global::<SceneDates>();
        let (incomplete, preview, blocked) = (
            dates.incomplete.clone(),
            dates.preview.clone(),
            dates.blocked.clone(),
        );
        stack(&theme)
            .child(
                row(&theme)
                    .items_start()
                    .gap(px(theme.space(Space::Lg)))
                    .child(incomplete)
                    .child(preview)
                    .child(blocked),
            )
            .into_any_element()
    }