feat: wrap contextual help if primitive (#817)

- Adds #733 
- If the `contextualHelp` prop is a primitive, wrap it in
`ContextualHelp` and `Content`

---------

Co-authored-by: Vlad Babich <[email protected]>

plugins/ui/src/js/src/widget/WidgetUtils.tsx

@@ -35,6 +35,7 @@ import {
   isCallableNode,
   CALLABLE_KEY,
   wrapTextChildren,
+  isPrimitive,
 } from '../elements/utils/ElementUtils';
 import HTMLElementView from '../elements/HTMLElementView';
 import { isHTMLElementNode } from '../elements/utils/HTMLElementUtils';
@@ -160,14 +161,20 @@ export function getComponentForElement(element: ElementNode): React.ReactNode {
     const Component = getComponentTypeForElement(newElement);
 
     if (Component != null) {
-      const props =
+      const props = { ...newElement.props };
+      if (
         shouldWrapTextChildren.has(newElement[ELEMENT_KEY]) &&
-        newElement.props?.children != null
-          ? {
-              ...newElement.props,
-              children: wrapTextChildren(newElement.props.children),
-            }
-          : newElement.props;
+        props?.children != null
+      ) {
+        props.children = wrapTextChildren(props.children);
+      }
+      if (props?.contextualHelp != null && isPrimitive(props.contextualHelp)) {
+        props.contextualHelp = (
+          <ContextualHelp>
+            <Content>{props.contextualHelp}</Content>
+          </ContextualHelp>
+        );
+      }
 
       return <Component {...props} />;
     }