HelpTooltip

Guidelines#

Use it for explaining a field or metric right beside its label ("Max never sends more than this per mailbox per day"). Required instructions go on the page.

What you provide: content — one or two plain sentences.

Facts#

API#

TypeScript declarations emitted from src/components/shared/help-tooltip.tsx (the module also exports HelpTooltip).

/**
 * Reusable HelpTooltip component
 * @param {string} content - The tooltip content to display
 */
interface HelpTooltipProps {
    content: React.ReactNode;
}
export default function HelpTooltip({ content }: HelpTooltipProps): JSX.Element;

Example#

The code of the preview above: plain React.createElement against window.DigitalCrew, with realistic data.

<div id="root" class="p-6"></div>
<script>
(function () {
  var h = React.createElement, DC = window.DigitalCrew, I = DC.Icons;
function App() {
  return h("div", { className: "flex items-center gap-2 pt-10" },
    h(DC.Label, null, "Daily sending limit"),
    h(DC.HelpTooltip, { content: "Max never sends more than this per mailbox per day, across all campaigns." }));
}
  ReactDOM.createRoot(document.getElementById("root")).render(h(DC.TooltipProvider, { delayDuration: 80 }, h(App)));
})();
</script>

More in Feedback#