Fix mobile input refs

[TomTirapani]

Mobile input refs were broken for NumberInput, SearchInput, Checkbox and SwitchInput.

You can easily see the following warning when navigating mobile toolbox when reactProdMode: false (prod mode squelches the warning, but the broken ref remains):

Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

Note that this change necessitating changing the internal structure of these inputs. Styling has been updated to maintain our practice of applying className and styles to the outermost component.

Hoist P/R Checklist

Pull request authors: Review and check off the below. Items that do not apply can also be
checked off to indicate they have been considered. If unclear if a step is relevant, please leave
unchecked and note in comments.

• Caught up with develop branch as of last change.
• Added CHANGELOG entry, or determined not required.
• Reviewed for breaking changes, added breaking-change label + CHANGELOG if so.
• Updated doc comments / prop-types, or determined not required.
• Reviewed and tested on Mobile, or determined not required.
• Created Toolbox branch / PR, or determined not required.

If your change is still a WIP, please use the "Create draft pull request" option in the split
button below to indicate it is not ready yet for a final review.

Pull request reviewers: when merging this P/R, please consider using a squash commit to
collapse multiple intermediate commits into a single commit representing the overall feature
change. This helps keep the commit log clean and easy to scan across releases. PRs containing a
single commit should be rebased when possible.

[lbwexler]

Tom -- did we introduce this when we created our wrapper component for onsen? Should it just support forwardRef? Would that be a less invasive change, and allow us to still provide refs to the actual underlying controls?

[TomTirapani]

Good point -- I had the same thought at first, but dismissed it because it looked like we were already doing work to support forwardRefs in our wrapper:

https://github.com/xh/hoist-react/blob/develop/kit/onsen/index.ts#L60-L69

However, your comment prompted me to look closer, and it turns out that isForwardRef(rawCmp) is never true! Maybe we're using it wrong - perhaps it needs the element?

Removing that condition resolves the warnings, the problem is that the code is never called. Any reason not to always forward refs? e.g.

function safeCmp(rawCmp): FunctionComponent {
    return forwardRef((props, ref) => {
        const safeProps = omitBy(props, it => it instanceof HoistModel);
        if (ref) safeProps.ref = ref;
        return createElement(rawCmp, safeProps);
    });
}

[lbwexler]

Tom -- I think you are right -- it does need the element, not the component definition! And I think we can and should just always call it that way

[TomTirapani]

Great - closing this PR in favour of this better one: #3383