Help with some JSX logic in Typescript on an Advanced Resizing Component

import { ParentComponent, createSignal } from 'solid-js'
import { Resizer, ResizerContent } from '@components/ui/resize'

const Sidebar: ParentComponent = (props) => {
    const [sidebar, setSidebar] = createSignal<HTMLDivElement | null>(null)
    const [width, setWidth] = createSignal<number>(425)
    let resizer!: HTMLDivElement

    const changeWidth = (clientY: number) => {
        if (clientY < 0) return
        setWidth(clientY)
    }

    return (
        <div class="card h-auto pb-8 min-h-0">
            <Resizer
                ref={resizer}
                side="right"
                onResize={(clientY, clientX) => {
                    changeWidth(clientY)
                }}>
                {(edgeHandler) => (
                    <ResizerContent edgeHandler={edgeHandler}>
                        <aside
                            ref={setSidebar}
                            style={{
                                width: `${width()}px`,
                            }}>
                            {props.children}
                        </aside>
                    </ResizerContent>
                )}
            </Resizer>
        </div>
    )
}