Component FilePathInput

FilePathInput

A text input specialised for file paths. Has a leading folder icon and a trailing Browse button. The headless layer does not open a native picker — on_browse is the hook for the caller.

use yororen_ui::headless::file_path_input::file_path_input;

file_path_input("config-path")
    .placeholder("/path/to/config.toml")
    .value(self.config_path.clone())
    .on_change({
        let entity = cx.entity();
        move |new: &str, _, cx| entity.update(cx, |s, _| s.config_path = new.to_string());
    })
    .on_browse(|_picked, _window, cx| {
        // Open your native file dialog and write the result back.
        // gpui::Window::open_file_dialog is the usual path.
    })
    .render(cx, window)

Props

Method	Purpose
placeholder(text)	Hint shown when empty.
value(s)	Current value (String-like).
disabled(v)	Disable interaction (and the Browse button).
on_change(closure)	Fn(&str, &mut Window, &mut App) + 'static + Send + Sync.
on_browse(closure)	Fn(&str, &mut Window, &mut App) + 'static + Send + Sync. Browse button was clicked.
has_custom_bg(v) / custom_bg(hsla)	Override background.
has_custom_border(v) / custom_border(hsla)	Override border.
has_custom_focus_border(v) / custom_focus_border(hsla)	Override focus border.
custom_text_color(hsla)	Override text color.

Factory takes (id) only. .render(cx, window) returns AnyElement. The boot step from TextInput covers this component too.

See also: TextInput, SearchInput, PasswordInput.