{"_id":"@bolttech/ob-atoms-backdrop","_rev":"4-0a0e785d14a815073efbe2450eed03a7","name":"@bolttech/ob-atoms-backdrop","dist-tags":{"latest":"1.0.3"},"versions":{"1.0.0":{"name":"@bolttech/ob-atoms-backdrop","version":"1.0.0","_id":"@bolttech/ob-atoms-backdrop@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":"9ac2de1204cb75ac8b1932599649a9bf385b614e","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-backdrop/-/ob-atoms-backdrop-1.0.0.tgz","fileCount":8,"integrity":"sha512-IPXRwaNS8kmlerND2zk8Ik57CjRmMTfq+cUtLwX7lcGI4G++JB9+XPZHcDSJRb48GQkhLgu9DEEq0q3l0vE7FQ==","signatures":[{"sig":"MEUCIQDFyVZAEisYLlI6BtDFGNbAtbCVdt0PD70KtuvLVmZuEAIgIzCZCV7UwkwbNXfTq/G2zLxZzTt//PQM5sa8zSahYWU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":41983},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"7990f68bd84d235efe6b39f732dcbfe800572e7a","_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":{"react":"19.1.2","react-dom":"19.1.2","classnames":"^2.5.1","@bolttech/ui-utils":"0.6.5","@bolttech/ob-atoms-icon":"1.0.0"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/ob-atoms-backdrop_1.0.0_1778515315468_0.31854718587400455","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@bolttech/ob-atoms-backdrop","version":"1.0.1","_id":"@bolttech/ob-atoms-backdrop@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":"d1d7bd3440878de7a4ae0aa081fa5058f99f3ca4","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-backdrop/-/ob-atoms-backdrop-1.0.1.tgz","fileCount":4,"integrity":"sha512-XTJQg1jVpw4PPq9wJDp98gR6LiLE1ndng+npKew4h4be1+mslkokhPjp+M9TAGBELz2zPXVDbGlBP+EVlmZZGQ==","signatures":[{"sig":"MEUCID5hJk9DZLBK/nUHvM01FVmYi0L2yHVKenKAK7VnQlC4AiEA9AhCS58LmdWxf5lzfgIBskJYCmtOHddOUaT0WbRloiU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":38640},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"f099b01bcbcdae745433b9ed00056c8ac19170d7","_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","react-dom":"19.1.2","classnames":"^2.5.1","@bolttech/ui-utils":"0.6.7"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/ob-atoms-backdrop_1.0.1_1780926430122_0.9342119465067131","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@bolttech/ob-atoms-backdrop","version":"1.0.2","_id":"@bolttech/ob-atoms-backdrop@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":"a5ed94cf3ccfaff68bee84bbb9c508667dbb44d2","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-backdrop/-/ob-atoms-backdrop-1.0.2.tgz","fileCount":8,"integrity":"sha512-tc5VtSUEFXzeN/dg+vaKCcAOzC6T8pUPBuz80dQuHAAhNUgDakQlcF4Qthp8nw1zcd/6k6Qm5/0N+TA1d7kxwQ==","signatures":[{"sig":"MEYCIQCgwwd4ciC/uLxF31VwuoKaBhodLHRMmaBDqZHo0NK2TgIhALYLRIwD9IgeHN585+U0+SpsW/yiO6VbEeuEgOF/cnHP","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":41941},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"25b8f73c32d545707107d87532fd5eda00fe8cd2","_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","react-dom":"19.1.2","classnames":"^2.5.1","@bolttech/ui-utils":"0.6.7"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/ob-atoms-backdrop_1.0.2_1788778050574_0.12736300379097099","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@bolttech/ob-atoms-backdrop","version":"1.0.3","dependencies":{"@bolttech/ui-utils":"0.6.7","react":"19.1.2","classnames":"^2.5.1","react-dom":"19.1.2"},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","_id":"@bolttech/ob-atoms-backdrop@1.0.3","gitHead":"a76c637e07c73a98019c647bf0b79ce25438059c","description":"A React component that provides a backdrop for overlay content.","_nodeVersion":"22.17.1","_npmVersion":"10.9.8","dist":{"integrity":"sha512-n8DWnOKiYLV4wbVufiIxz3gChPTCHzUUcqKpmtcvbvJgqLjX7mGJjjL23dowUJB7FhlaXDmQxAPVW3hNW4jhZg==","shasum":"c9357705b2b67f8a8927df585650037b3ac39cd7","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-backdrop/-/ob-atoms-backdrop-1.0.3.tgz","fileCount":8,"unpackedSize":43965,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCJ+QlbzHI/bBU1GTpuDIwhDWDXfL9xsKYF8mXJDBc7WgIhAK/3VKbGhnKasc37qi3SxnBUhvtGywRTfar+4QqxwZUe"}]},"_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-backdrop_1.0.3_1788796109741_0.5562773549027276"},"_hasShrinkwrap":false}},"time":{"created":"2026-05-11T16:01:55.336Z","modified":"2026-09-07T15:48:30.087Z","1.0.0":"2026-05-11T16:01:55.615Z","1.0.1":"2026-06-08T13:47:10.252Z","1.0.2":"2026-09-07T10:47:30.698Z","1.0.3":"2026-09-07T15:48:29.884Z"},"description":"A React component that provides a backdrop for overlay content.","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":"# Backdrop Component\n\nA React component that provides a backdrop for overlay content.\n\n## Installation\n\nUse the package manager [npm](https://www.npmjs.com/) or [yarn](https://yarnpkg.com/) to install the component.\n\n```bash\nnpm install @bolttech/frontend-foundations @bolttech/atoms-backdrop\n```\n\nor\n\n```bash\nyarn add @bolttech/frontend-foundations @bolttech/atoms-backdrop\n```\n\n## Props\n\nThe `Backdrop` component accepts the following properties:\n\n| Prop | Type | Description |\n|-------------|---------------|--------------------------------------------------------------------------------------------------------|\n| id | `string` | The ID attribute for the backdrop element. |\n| dataTestId | `string` | The `data-testid` attribute for testing. |\n| onClick | `function` | Callback function to handle the backdrop click event. |\n| appendTo | `HTMLElement` | The element to which the backdrop should be appended. If not provided, it will default to specific elements (`#root`, `#__next`, or `document.body`). |\n| className | `string` | Additional class name for styling purposes. |\n| children | `node` | The child elements to be rendered inside the backdrop. |\n\n## Usage\n\n```jsx\nimport React from 'react';\nimport {Backdrop} from '@bolttech/atoms-backdrop';\nimport {BolttechThemeProvider, bolttechTheme} from \"@bolttech/frontend-foundations\";\n\nconst ExampleComponent = () => {\n const handleBackdropClick = () => {\n // Logic to handle the backdrop click event\n };\n\n return (\n \n \n {/* Content to display within the backdrop */}\n \n \n );\n};\n\nexport default ExampleComponent;\n```\n\n## Contributing\n\nContributions are welcome! For any bug fixes, improvements, or new features, please open an [issue](link-to-issues) or submit a pull request.\n\nPlease make sure to follow the code standards and test your changes before submitting.\n","readmeFilename":"README.md"}