{"record":{"id":"9444fa3e910cd0c6","repo":"mantinedev/mantine","slug":"mantine-core-tooltip-floating-component-childre","errorCode":null,"errorMessage":"[@mantine/core] Tooltip.Floating component children should be an element or a component that accepts ref, fragments, strings, numbers and other primitive values are not supported","messagePattern":"\\[@mantine/core\\] Tooltip\\.Floating component children should be an element or a component that accepts ref, fragments, strings, numbers and other primitive values are not supported","errorType":"validation","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/@mantine/core/src/components/Tooltip/TooltipFloating/TooltipFloating.tsx","lineNumber":106,"sourceCode":"    style,\n    classNames,\n    styles,\n    unstyled,\n    attributes,\n    rootSelector: 'tooltip',\n    vars,\n    varsResolver,\n  });\n\n  const { handleMouseMove, x, y, opened, boundaryRef, floating, setOpened } = useFloatingTooltip({\n    offset,\n    position,\n    defaultOpened,\n  });\n\n  const child = getSingleElementChild(children);\n  if (!child) {\n    throw new Error(\n      '[@mantine/core] Tooltip.Floating component children should be an element or a component that accepts ref, fragments, strings, numbers and other primitive values are not supported'\n    );\n  }\n\n  const targetRef = useMergedRef(boundaryRef, getRefProp(child), ref);\n  const childProps = child.props as any;\n\n  const onMouseEnter = (event: React.MouseEvent<unknown, MouseEvent>) => {\n    childProps.onMouseEnter?.(event);\n    handleMouseMove(event);\n    setOpened(true);\n  };\n\n  const onMouseLeave = (event: React.MouseEvent<unknown, MouseEvent>) => {\n    childProps.onMouseLeave?.(event);\n    setOpened(false);\n  };\n","sourceCodeStart":88,"sourceCodeEnd":124,"githubUrl":"https://github.com/mantinedev/mantine/blob/8a284e2c2c53a9cb6f39f5dc389bf41b7a2073f8/packages/@mantine/core/src/components/Tooltip/TooltipFloating/TooltipFloating.tsx#L88-L124","documentation":"Tooltip.Floating follows the cursor by attaching refs/handlers to its single child. getSingleElementChild returns null for fragments, primitives or empty children, leaving no element to track, so it throws during render.","triggerScenarios":"Child of Tooltip.Floating is a string/number, fragment, multiple children, or a component that doesn't forward refs.","commonSituations":"Using text directly as the floating-tooltip trigger, or a custom component that lacks ref forwarding.","solutions":["Provide a single element child that accepts refs","Wrap primitives in a span/button","Add forwardRef to custom child components"],"exampleFix":"// before\n<Tooltip.Floating>info</Tooltip.Floating>\n\n// after\n<Tooltip.Floating><Button>info</Button></Tooltip.Floating>","handlingStrategy":"type-guard","validationCode":"// Ensure a single element child before rendering Tooltip.Floating","typeGuard":"const isValidTargetChild = (c: React.ReactNode): boolean => isElement(c);","tryCatchPattern":null,"preventionTips":["Wrap text triggers in Button/span","Forward refs in custom children","Never leave Tooltip.Floating without a child"],"tags":["mantine","react","children-validation","ref","tooltip"],"backgroundTag":"react-child-must-forward-ref","analyzedSha":"8a284e2c2c53a9cb6f39f5dc389bf41b7a2073f8","analyzedAt":"2026-08-28T10:25:51.087Z","schemaVersion":2},"datasetVersion":"2026-08-28T11:17:15.048Z"}