Changing example to React functional components

[helios2003]

Is your feature request related to a problem?

As of 2024, most developers have been using React's functional components instead of Class-based components. Hence understanding the documentation of the library would be easy if components were written using functions. Look at the example here: https://codesandbox.io/embed/o2A4gwXE3

Describe the solution you'd like

Rewriting the examples to functional components.

Describe alternatives you've considered

No response

Additional Context

No response

[jcapogna]

This is especially needed if you're using dynamic components as refs have changed.

An example of how to update dynamic components in a functional component:

const stepsRef = useRef<Steps>(null);

const onBeforeChange = async (nextStepIndex: number) => {
    if (nextStepIndex === 3) {
        await waitForElementToLoad()
        stepsRef.current?.updateStepElement(nextStepIndex)
    }
}

return (
    <Steps
        ...
        onBeforeChange={onBeforeChange}
        ref={stepsRef}
    />
)