{"_id":"@bolttech/ob-atoms-tooltip","_rev":"4-d2775ab8dc3acecb5e97b3a93c1dd6e1","name":"@bolttech/ob-atoms-tooltip","dist-tags":{"latest":"1.0.3"},"versions":{"1.0.0":{"name":"@bolttech/ob-atoms-tooltip","version":"1.0.0","_id":"@bolttech/ob-atoms-tooltip@1.0.0","maintainers":[{"name":"andsfranbolt","email":"anderson.francisco@bolttech.io"},{"name":"danielkhalebbatista","email":"daniel.batista@bolttech.io"},{"name":"pauloazevedo-ed","email":"paulo.azevedo@bolttech.io"},{"name":"bruno.gomes","email":"bruno.gomes@bolttech.io"},{"name":"plinio.altoe","email":"plinio.altoe@bolttech.io"},{"name":"joaoteixeira20","email":"joao.teixeira@bolttech.io"},{"name":"esteve-cabrera","email":"esteve.cabrera@bolttech.io"},{"name":"jabolttech","email":"jhonatan.amorim@bolttech.io"},{"name":"lucasvpaiva","email":"lucas.paiva@bolttech.io"},{"name":"herberts.fortuna","email":"herberts.fortuna@bolttech.io"},{"name":"matheus.maciel.bolttech","email":"matheus.maciel@bolttech.io"},{"name":"silas.silva.bolttech","email":"silas.silva@bolttech.io"}],"dist":{"shasum":"ab623697da161cf972f8a5fecc8c9d4f069fd284","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-tooltip/-/ob-atoms-tooltip-1.0.0.tgz","fileCount":9,"integrity":"sha512-ChQV2xlm0Wl+ReHPdX9q28KbwskY8ltPkVB3IAlJgx1WwpKqtR1ibc1YCwzww3asGWpG/PDehelNCn/n15bJmA==","signatures":[{"sig":"MEUCIGdSYrjHON7mYoyegMzvVWwO4zqvQ1gD2ofGj4wzKcBzAiEAkhIEmkFBg30LDuRQjMSmTKcmXEY6uf/rr3S3nJYuLco=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":66940},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"571cc27039bfb5e431e912f4798793e1e4ff528a","_npmUser":{"name":"andsfranbolt","email":"anderson.francisco@bolttech.io"},"_npmVersion":"11.10.1","description":"```bash npx nx g @nx/react:lib ${lib_name} ```","directories":{},"_nodeVersion":"22.17.1","dependencies":{"@bolttech/ui-utils":"0.6.5"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/ob-atoms-tooltip_1.0.0_1778516201773_0.07410323147931752","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@bolttech/ob-atoms-tooltip","version":"1.0.1","_id":"@bolttech/ob-atoms-tooltip@1.0.1","maintainers":[{"name":"andsfranbolt","email":"anderson.francisco@bolttech.io"},{"name":"danielkhalebbatista","email":"daniel.batista@bolttech.io"},{"name":"pauloazevedo-ed","email":"paulo.azevedo@bolttech.io"},{"name":"bruno.gomes","email":"bruno.gomes@bolttech.io"},{"name":"plinio.altoe","email":"plinio.altoe@bolttech.io"},{"name":"joaoteixeira20","email":"joao.teixeira@bolttech.io"},{"name":"esteve-cabrera","email":"esteve.cabrera@bolttech.io"},{"name":"jabolttech","email":"jhonatan.amorim@bolttech.io"},{"name":"lucasvpaiva","email":"lucas.paiva@bolttech.io"},{"name":"herberts.fortuna","email":"herberts.fortuna@bolttech.io"},{"name":"matheus.maciel.bolttech","email":"matheus.maciel@bolttech.io"},{"name":"silas.silva.bolttech","email":"silas.silva@bolttech.io"}],"dist":{"shasum":"42ea6990947f392e0b7242314190b4d2c016f062","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-tooltip/-/ob-atoms-tooltip-1.0.1.tgz","fileCount":5,"integrity":"sha512-3ve4RdbJIMaEy8+qwNCoRfy00n8VGgd8hlofty5FUu0+YuUcWd7htAVmfq5cvq2VOe26bUzHN8Ft3mWqULI1TQ==","signatures":[{"sig":"MEQCIBNN0WGoi+6FXmGkWaMvfAGwPNm8C64ei6QSGKGzxbPjAiBYQzGTMH+ZmE47kzXVvhby/aDyacYzLF8n/unWrH8iQA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":61505},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"983a6d9e1c85375a0c9a9107b7c23229df933c43","_npmUser":{"name":"silas.silva.bolttech","email":"silas.silva@bolttech.io"},"_npmVersion":"10.9.4","description":"```bash npx nx g @nx/react:lib ${lib_name} ```","directories":{},"_nodeVersion":"22.22.0","dependencies":{"react":"19.1.2","classnames":"^2.5.1","@bolttech/ui-utils":"0.6.7"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/ob-atoms-tooltip_1.0.1_1780926133672_0.9016700173545502","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@bolttech/ob-atoms-tooltip","version":"1.0.2","_id":"@bolttech/ob-atoms-tooltip@1.0.2","maintainers":[{"name":"andsfranbolt","email":"anderson.francisco@bolttech.io"},{"name":"danielkhalebbatista","email":"daniel.batista@bolttech.io"},{"name":"pauloazevedo-ed","email":"paulo.azevedo@bolttech.io"},{"name":"bruno.gomes","email":"bruno.gomes@bolttech.io"},{"name":"plinio.altoe","email":"plinio.altoe@bolttech.io"},{"name":"joaoteixeira20","email":"joao.teixeira@bolttech.io"},{"name":"esteve-cabrera","email":"esteve.cabrera@bolttech.io"},{"name":"jabolttech","email":"jhonatan.amorim@bolttech.io"},{"name":"lucasvpaiva","email":"lucas.paiva@bolttech.io"},{"name":"herberts.fortuna","email":"herberts.fortuna@bolttech.io"},{"name":"matheus.maciel.bolttech","email":"matheus.maciel@bolttech.io"},{"name":"silas.silva.bolttech","email":"silas.silva@bolttech.io"}],"dist":{"shasum":"d98284da9c26f919ec0d76cc6daf0124f4b7efd7","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-tooltip/-/ob-atoms-tooltip-1.0.2.tgz","fileCount":9,"integrity":"sha512-bOyZ1kTtSP4HrtXpEbsUjR1//eoz5S2v3bvuBJZ8OCvmitF98yw2YJBDPjWkpmGYCJDa3Iz8PLXbgQ84Eeh4vg==","signatures":[{"sig":"MEYCIQCK38oaWanYwFBGQyhd18OeFLkLPKuuzq+eALRV7v5ndQIhAPMNFNhXWmfIGEFb2EL3kPrt8Z3I6bERWz5vuZb1cZ0w","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":65383},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"fc7bc1b7f0f001dc496e6b51c68012d373afc2e8","_npmUser":{"name":"andsfranbolt","email":"anderson.francisco@bolttech.io"},"_npmVersion":"10.9.8","description":"```bash npx nx g @nx/react:lib ${lib_name} ```","directories":{},"_nodeVersion":"22.17.1","dependencies":{"react":"19.1.2","classnames":"^2.5.1","@bolttech/ui-utils":"0.6.7"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/ob-atoms-tooltip_1.0.2_1788779498590_0.1029113152525587","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@bolttech/ob-atoms-tooltip","version":"1.0.3","dependencies":{"@bolttech/ui-utils":"0.6.7","react":"19.1.2","classnames":"^2.5.1"},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","_id":"@bolttech/ob-atoms-tooltip@1.0.3","gitHead":"b6126aa86994d5b7e97c74c72245b66798456cf3","description":"The **Tooltip** component is a React component designed display additional information data when hovering/taping a component.","_nodeVersion":"22.17.1","_npmVersion":"10.9.8","dist":{"integrity":"sha512-QJNhaGZ21Icb7vQKfSOg38SDEXGYah5FuI5BPeL03j+tu0FB+iPaon73nPzIaJv0q3Vpwn1/oisSfzf2STD4tA==","shasum":"0bdfb9e2e796c77dc92f8fb59608191818fe07b2","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-tooltip/-/ob-atoms-tooltip-1.0.3.tgz","fileCount":8,"unpackedSize":68273,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQDG1s/Ox6wPMpeUKYKCs6l1XfUDjxC0NuMfk5vrIB8+xwIhAPZ9j8PhdnAQE0rkMZ0pYjrMHNpeT3UmQqkHZxs6LJ57"}]},"_npmUser":{"name":"andsfranbolt","email":"anderson.francisco@bolttech.io"},"directories":{},"maintainers":[{"name":"andsfranbolt","email":"anderson.francisco@bolttech.io"},{"name":"danielkhalebbatista","email":"daniel.batista@bolttech.io"},{"name":"pauloazevedo-ed","email":"paulo.azevedo@bolttech.io"},{"name":"bruno.gomes","email":"bruno.gomes@bolttech.io"},{"name":"plinio.altoe","email":"plinio.altoe@bolttech.io"},{"name":"joaoteixeira20","email":"joao.teixeira@bolttech.io"},{"name":"esteve-cabrera","email":"esteve.cabrera@bolttech.io"},{"name":"jabolttech","email":"jhonatan.amorim@bolttech.io"},{"name":"lucasvpaiva","email":"lucas.paiva@bolttech.io"},{"name":"herberts.fortuna","email":"herberts.fortuna@bolttech.io"},{"name":"matheus.maciel.bolttech","email":"matheus.maciel@bolttech.io"},{"name":"silas.silva.bolttech","email":"silas.silva@bolttech.io"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ob-atoms-tooltip_1.0.3_1788796745301_0.5556017608385884"},"_hasShrinkwrap":false}},"time":{"created":"2026-05-11T16:16:41.685Z","modified":"2026-09-07T15:59:05.613Z","1.0.0":"2026-05-11T16:16:41.915Z","1.0.1":"2026-06-08T13:42:13.850Z","1.0.2":"2026-09-07T11:11:38.729Z","1.0.3":"2026-09-07T15:59:05.431Z"},"description":"The **Tooltip** component is a React component designed display additional information data when hovering/taping a component.","maintainers":[{"name":"andsfranbolt","email":"anderson.francisco@bolttech.io"},{"name":"danielkhalebbatista","email":"daniel.batista@bolttech.io"},{"name":"pauloazevedo-ed","email":"paulo.azevedo@bolttech.io"},{"name":"bruno.gomes","email":"bruno.gomes@bolttech.io"},{"name":"plinio.altoe","email":"plinio.altoe@bolttech.io"},{"name":"joaoteixeira20","email":"joao.teixeira@bolttech.io"},{"name":"esteve-cabrera","email":"esteve.cabrera@bolttech.io"},{"name":"jabolttech","email":"jhonatan.amorim@bolttech.io"},{"name":"lucasvpaiva","email":"lucas.paiva@bolttech.io"},{"name":"herberts.fortuna","email":"herberts.fortuna@bolttech.io"},{"name":"matheus.maciel.bolttech","email":"matheus.maciel@bolttech.io"},{"name":"silas.silva.bolttech","email":"silas.silva@bolttech.io"}],"readme":"# Tooltip Component\n\nThe **Tooltip** component is a React component designed display additional information data when hovering/taping a component.\n\n## Table of Contents\n\n- [Installation](#installation)\n- [Usage](#usage)\n- [Props](#props)\n- [Example](#example)\n- [Contributing](#contributing)\n\n## Installation\n\nTo use the **Tooltip** component in your React application, follow these steps:\n\n### Installation\n\n```bash\nnpm install @bolttech/atoms-tooltip\n```\n\nor\n\n```bash\nyarn add @bolttech/atoms-tooltip\n```\n\nOnce you have the required dependencies installed, you can start using the `Tooltip` component in your React application.\n\n## Usage\n\nThe **Tooltip** component provides a easy way to display additional data when hovering on desktop or taping on a component on mobile.\n\nTo use the component, import it and include it in your JSX:\n\n```jsx\nimport React from 'react';\nimport { Tooltip } from '@bolttech/atoms-tooltip';\nimport { Icon } from '@bolttech/atoms-icon';\n\nfunction App() {\n  return (\n    <Tooltip size=\"small\" variant=\"dark\" content=\"This is the tooltip text\">\n      <Icon icon=\"help\" />\n    </Tooltip>\n  );\n}\n\nexport default App;\n```\n\n## Props\n\nThe **Tooltip** component accepts the following props:\n\n| Prop         | Type            | Description                                                     |\n| ------------ | --------------- | --------------------------------------------------------------- |\n| `id`         | string          | The HTML `id` attribute for the tooltip.                        |\n| `dataTestId` | string          | The data-testid attribute for testing purposes.                 |\n| `variant`    | TooltipVariants | Variant of the Tooltip component.                               |\n| `size`       | TooltipSizes    | Size of the Tooltip component.                                  |\n| `content`    | React.ReactNode | React node that will be rendered as the content of the Tooltip. |\n| `children`   | React.ReactNode | Component that will be used as the Tooltip wrapper.             |\n\n## Example\n\nHere's an example of using the **Tooltip** component:\n\n```jsx\nimport React from 'react';\nimport { Tooltip } from '@bolttech/atoms-tooltip';\nimport { Icon } from '@bolttech/atoms-icon';\n\nfunction App() {\n  return (\n    <Tooltip size=\"small\" variant=\"dark\" content=\"This is the tooltip text\">\n      <Icon icon=\"help\" />\n    </Tooltip>\n  );\n}\n\nexport default App;\n```\n\nThis will render a icon with a **Tooltip** when you hover over it.\n\n## Contributing\n\nContributions to the **Tooltip** component are welcome. If you find any issues or have suggestions for improvements, please feel free to open an issue or submit a pull request on the project's Bitbucket repository.\n","readmeFilename":"README.md"}