{
    "componentChunkName": "component---src-layouts-rails-component-layout-tsx",
    "path": "/components/tooltip/rails",
    "result": {"data":{"primerRailsVersion":{"version":"0.2.0"},"sitePage":{"path":"/components/tooltip","context":{"frontmatter":{"title":"Tooltip","description":"Tooltips add additional context to other UI elements and appear on mouse hover or keyboard focus.","reactId":null,"railsId":"Primer::Alpha::Tooltip","figmaId":null}}},"railsComponent":{"name":"Tooltip","railsId":"Primer::Alpha::Tooltip","description":"`Tooltip` only appears on mouse hover or keyboard focus and contain a label or description text. Use tooltips sparingly and as a last resort.\nUse tooltips as a last resort. Please consider [Tooltips alternatives](https://primer.style/design/accessibility/tooltip-alternatives).\n\nWhen using a tooltip, follow the provided guidelines to avoid accessibility issues:\n- Tooltips should contain only **non-essential text**. Tooltips can easily be missed and are not accessible on touch devices so never use tooltips to convey critical information.\n- `Tooltip` should be rendered through the API of {{#link_to_component}}Primer::ButtonComponent{{/link_to_component}}, {{#link_to_component}}Primer::Beta::Link{{/link_to_component}}, or {{#link_to_component}}Primer::IconButton{{/link_to_component}}. Avoid using `Tooltip` a standalone component unless absolutely necessary (and **only** on interactive elements).","status":"alpha","a11y_reviewed":false,"short_name":"Tooltip","is_form_component":false,"is_published":true,"props":[{"name":"for_id","type":"String","description":"The ID of the element that the tooltip should be attached to.","default":"N/A"},{"name":"type","type":"Symbol","description":"One of `:description` or `:label`.","default":"N/A"},{"name":"direction","type":"Symbol","description":"One of `:e`, `:n`, `:ne`, `:nw`, `:s`, `:se`, `:sw`, or `:w`.","default":"`:s`"},{"name":"text","type":"String","description":"The text content of the tooltip. This should be brief and no longer than a sentence.","default":"N/A"},{"name":"system_arguments","type":"Hash","description":"{{link_to_system_arguments_docs}}","default":"N/A"}],"slots":[],"methods":[],"previews":[{"name":"playground","preview_path":"primer/alpha/tooltip/playground"},{"name":"default","preview_path":"primer/alpha/tooltip/default"},{"name":"label_tooltip_on_button_with_existing_labelledby","preview_path":"primer/alpha/tooltip/label_tooltip_on_button_with_existing_labelledby"},{"name":"description_tooltip_on_button_with_existing_describedby","preview_path":"primer/alpha/tooltip/description_tooltip_on_button_with_existing_describedby"},{"name":"with_right_most_position","preview_path":"primer/alpha/tooltip/with_right_most_position"},{"name":"with_multiple_on_a_page","preview_path":"primer/alpha/tooltip/with_multiple_on_a_page"},{"name":"tooltip_with_button","preview_path":"primer/alpha/tooltip/tooltip_with_button"},{"name":"tooltip_with_link","preview_path":"primer/alpha/tooltip/tooltip_with_link"},{"name":"tooltip_with_icon_button","preview_path":"primer/alpha/tooltip/tooltip_with_icon_button"}],"subcomponents":[]}},"pageContext":{"componentId":"Primer::Alpha::Tooltip","parentPath":"/components/tooltip"}},
    "staticQueryHashes": ["2468112454","2580293464","2745756513","2790671566","3907230164"]}