Get allowed size in component

[barsoosayque]

Let's consider a simple progress bar component: I need to render a background bar and a bar above the background, which is easy. But if I try to create a handler for clicking on the progress bar, I can get the column -- bug I can't get percents from it (e.g. column 4 in a 10 wide progress bar is 40%). For example this is my implementation of a progress bar:

#[derive(Default, Props)]
pub struct ProgressBarProps {
    pub progress: f32,
    pub handler: Handler<'static, f32>,
}

#[component]
pub fn ProgressBar(mut hooks: Hooks, props: &ProgressBarProps) -> impl Into<AnyElement<'static>> {
    let (width, _) = hooks.use_terminal_size();
    let amount = props.progress.clamp(0.0, 1.0);
        
    hooks.use_local_terminal_events(|event| match event {
        TerminalEvent::FullscreenMouse(FullscreenMouseEvent {
            column,
            kind: MouseEventKind::Down(_),
            ..
        }) => props.handler(/* ??? */),
        _ => {},
    });

    element! {
        View(width: Percent(100.0), height: 1, overflow: Overflow::Hidden) {
            View(position: Position::Absolute) {
                Text(content: "·".repeat(width as usize), weight: Weight::Light)
            }
            View(width: Percent(100.0 * amount), position: Position::Absolute) {
                Text(content: "—".repeat(width as usize), color: Color::Magenta)
            }
        }
    }
}

I can render it fine, but since I can't seem to get width of the parent component, I'm required to use the whole terminal width -- which can work with Overflow::Hidden for other components, but won't work for math and events ?

[ccbrown]

There is a way for a component to get the size of itself using a custom hook:

trait UseSize<'a> {
    fn use_size(&mut self) -> (u16, u16);
}

impl<'a> UseSize<'a> for Hooks<'a, '_> {
    fn use_size(&mut self) -> (u16, u16) {
        self.use_hook(UseSizeImpl::default).size
    }
}

#[derive(Default)]
struct UseSizeImpl {
    size: (u16, u16),
}

impl Hook for UseSizeImpl {
    fn pre_component_draw(&mut self, drawer: &mut ComponentDrawer) {
        let s = drawer.size();
        self.size = (s.width, s.height);
    }
}

I think using a hook like that you can probably make things work?

An easier way would be nice though.

[barsoosayque]

This does seem a little bit boilerplate-y. I can PR it, thought I think it will be more useful to expose a full Rect right away (size + canvas_position) ?