{"_id":"@bolttech/ob-atoms-segmented-control","_rev":"7-bb3d7118a8dfe3fa733ef6ecf526fdb4","name":"@bolttech/ob-atoms-segmented-control","dist-tags":{"latest":"1.0.6"},"versions":{"1.0.0":{"name":"@bolttech/ob-atoms-segmented-control","version":"1.0.0","_id":"@bolttech/ob-atoms-segmented-control@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":"17f1149d2c714a54fdd7c8d4b642f2eb978f2531","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-segmented-control/-/ob-atoms-segmented-control-1.0.0.tgz","fileCount":9,"integrity":"sha512-B/OTUG2GfGFBQw/JedUT19IVnugqlXjeankcDjTJX32ksWv8CbzapoPyTgsONFjJy63qd+V8OUJYLwKeoblETw==","signatures":[{"sig":"MEUCIQDbTG1wgSHv+bKsxVjskqqec82HM4thaclSKPaGKGAGIAIgSPi0R8JO+aBxcsiIQF4uO6OBw1E0jE2R9n+94GXtfVo=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":66730},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"d40229ed738dd969b59e2f2ae1120a43b81a43d4","_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-segmented-control_1.0.0_1778515922769_0.7188454624984737","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@bolttech/ob-atoms-segmented-control","version":"1.0.1","_id":"@bolttech/ob-atoms-segmented-control@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":"389d4e2238e16c91ca04ba6e300faa80bf3b4c61","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-segmented-control/-/ob-atoms-segmented-control-1.0.1.tgz","fileCount":5,"integrity":"sha512-jRuoWO/CLLAlObA91SASiXTrKmt9UMGN3v5G+LVo6Q37AWu9b5k3e4fFUK/ciqbpwr7x5By8m5MW7ggTUP1JVA==","signatures":[{"sig":"MEYCIQD05QtvMriw1DBRL9tks+TcnKxccrRK80lv0onijE1FPgIhAIGa3XF6kiKLJdLnETlyqAqcB3dqha6jlLAoc1bPmY0b","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":60782},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"adaf73f31e5499ddce1f253983bcc946d3cda0e5","_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-segmented-control_1.0.1_1780927121372_0.6031907661223535","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@bolttech/ob-atoms-segmented-control","version":"1.0.2","_id":"@bolttech/ob-atoms-segmented-control@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":"316436ce665e2bd1a4681b3a362f05034404cc24","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-segmented-control/-/ob-atoms-segmented-control-1.0.2.tgz","fileCount":5,"integrity":"sha512-Wlp4rqc1tRY0uXqKE0hbiHTlXgxAnYsesz0lfUDBpbYCFVRwPuHd8NJthkbrGJVSX8ptjVMNNj9fVs/My/RJjA==","signatures":[{"sig":"MEUCIEQE06XDC+tubzuwto7s3+vlQzvSvR50QFBPcBH609yiAiEA0Jt67LB5d1s9vqhS8pdQ1ZYbgI8WnoSLmP0HAVF2/Rk=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":61406},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"ebe1c8122e82e3b67fe2c916a4f70c115a6cbbd2","_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-segmented-control_1.0.2_1784627288000_0.5604372762003587","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@bolttech/ob-atoms-segmented-control","version":"1.0.3","_id":"@bolttech/ob-atoms-segmented-control@1.0.3","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":"78178546d5b1fa91822cb54515a625c189cf892a","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-segmented-control/-/ob-atoms-segmented-control-1.0.3.tgz","fileCount":9,"integrity":"sha512-sv9AxXZmacQG1DczH4AckptjRJsaE8y9qOVheVvaY/bKbcywc8EyKdV7wQCJncn1WTL3lw3jKnwmdhHKaHCn7Q==","signatures":[{"sig":"MEQCIFW6IDZptVsukbnEn4eyqREo7eRZlJ4QhBt1teapCZfoAiA6MnSuHx7JFZXmXAr3XZxyZ8fd7JEjzrk1R5eOVu9WCg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":65925},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"fb99e1e5a900d656fdb751198d7e3781bafa5404","_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-segmented-control_1.0.3_1788778968811_0.8571992085180364","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"name":"@bolttech/ob-atoms-segmented-control","version":"1.0.4","_id":"@bolttech/ob-atoms-segmented-control@1.0.4","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":"4cf775ec2dbf320c0859c8aef90f5902928b6325","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-segmented-control/-/ob-atoms-segmented-control-1.0.4.tgz","fileCount":8,"integrity":"sha512-+GrxhrTKkaHQjzYk7zq+Sj1xYigszS7LBXfIjUfS5roGFXJeen8vRkG8OsAG0dH5hSIrTMvmxMusUk0Us9ofWQ==","signatures":[{"sig":"MEUCIQCYfO7/BHP8+A+5a9BatHFFpU7Qqg0gtQ+OKDLOAjhyOwIgST3YLaJYQ2RgZ6g5K0gUMA1of0vk8z6GpyW3u3ylXic=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":69895},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"cf07cb92f2546097e43bfcd2c57ff6c04d8b16eb","_npmUser":{"name":"andsfranbolt","email":"anderson.francisco@bolttech.io"},"_npmVersion":"10.9.8","description":"The **SegmentedControl** component is a React component designed to provide a segmented control input for selecting options. This component allows users to choose from a set of options using a visually distinct set of buttons.","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-segmented-control_1.0.4_1788796517380_0.6083037832410163","host":"s3://npm-registry-packages-npm-production"}},"1.0.5":{"name":"@bolttech/ob-atoms-segmented-control","version":"1.0.5","_id":"@bolttech/ob-atoms-segmented-control@1.0.5","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":"5679c1e38e5f2e488ef1f49c559697bec42eca60","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-segmented-control/-/ob-atoms-segmented-control-1.0.5.tgz","fileCount":4,"integrity":"sha512-GiuN4ibZ0z9cUkaOiRkIP/9McfBwk9kp4cYkwOidTyaODwzRjlLBSGbBfC7gC60mVtdqMckKiQlJlYz0E8rOyg==","signatures":[{"sig":"MEQCIDNCFmk5Eatu7CoVOlOiYvBCZVtBoe6X07b/wvKdx5OwAiAHzzvGjh/vG5PjuFVpzFBIOKR948wLhzaNQeMQwHKQ8A==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"sig":"MEQCIDDAT6H5AHALzDxzoYZRWYSF+i5z+/guy2n/uwExKDE7AiASRawKmPtwFEf9Itb2eCR5+Ha/DgXWKJNXHXNyyZd22g==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":65400},"main":"./index.cjs.js","type":"commonjs","types":"./index.d.ts","gitHead":"0f8b9582b112f49905bc7d66cdd1402e0d19bc09","_npmUser":{"name":"bruno.gomes","email":"bruno.gomes@bolttech.io"},"_npmVersion":"10.8.2","description":"The **SegmentedControl** component is a React component designed to provide a segmented control input for selecting options. This component allows users to choose from a set of options using a visually distinct set of buttons.","directories":{},"_nodeVersion":"20.18.0","dependencies":{"react":"19.1.2","classnames":"^2.5.1","@bolttech/ui-utils":"0.6.7"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/ob-atoms-segmented-control_1.0.5_1790001444208_0.5355169732642282","host":"s3://npm-registry-packages-npm-production"}},"1.0.6":{"_id":"@bolttech/ob-atoms-segmented-control@1.0.6","dist":{"shasum":"2d43ac32f943fa409b71985eeda136a166112eac","tarball":"https://registry.npmjs.org/@bolttech/ob-atoms-segmented-control/-/ob-atoms-segmented-control-1.0.6.tgz","fileCount":4,"integrity":"sha512-F8DSMBpHvEQuNeETKy8iLFXagx5FlQmBeNymxKnA1HnRehPPp8sLRAAGvLQTG1a7HgVwWTj9vzu9/lxmK+4sjg==","signatures":[{"sig":"MEYCIQC+5qzI55lwdXmD6SXZ6UB4/7f5IOgLCbpzPKxeQc5ZpAIhAPQ4MGmUJrdNndINMke6bBWI709qAjDKiVZ28/YeVxlf","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIDFPRPTk8rKA9v7+rHxG+IlWeMznGxTENEvoB/NmYZtLAiB/I0DcD6y1rZnKdO9R2dj1MmWgh+wlrEWyCF6f1jhSuQ=="}],"unpackedSize":65400},"main":"./index.cjs.js","name":"@bolttech/ob-atoms-segmented-control","type":"commonjs","types":"./index.d.ts","gitHead":"3c454b5d63832106c1ab838239643127244aa471","version":"1.0.6","_npmUser":{"name":"bruno.gomes","email":"bruno.gomes@bolttech.io"},"_npmVersion":"10.9.4","description":"The **SegmentedControl** component is a React component designed to provide a segmented control input for selecting options. This component allows users to choose from a set of options using a visually distinct set of buttons.","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"}],"_nodeVersion":"22.22.0","dependencies":{"react":"19.1.2","classnames":"^2.5.1","@bolttech/ui-utils":"0.6.7"},"_hasShrinkwrap":false,"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ob-atoms-segmented-control_1.0.6_1790764395315_0.2643201986396033"}}},"time":{"created":"2026-05-11T16:12:02.681Z","modified":"2026-09-30T10:33:15.622Z","1.0.0":"2026-05-11T16:12:02.907Z","1.0.1":"2026-06-08T13:58:41.513Z","1.0.2":"2026-07-21T09:48:08.131Z","1.0.3":"2026-09-07T11:02:48.944Z","1.0.4":"2026-09-07T15:55:17.516Z","1.0.5":"2026-09-21T14:37:24.309Z","1.0.6":"2026-09-30T10:33:15.383Z"},"description":"The **SegmentedControl** component is a React component designed to provide a segmented control input for selecting options. This component allows users to choose from a set of options using a visually distinct set of buttons.","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":"# SegmentedControl Component\n\nThe **SegmentedControl** component is a React component designed to provide a segmented control input for selecting options. This component allows users to choose from a set of options using a visually distinct set of buttons.\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 **SegmentedControl** component in your React application, follow these steps:\n\n### Installation\n\n```bash\nnpm install @bolttech/atoms-segmented-control\n```\n\nor\n\n```bash\nyarn add @bolttech/atoms-segmented-control\n```\n\nOnce you have the required dependencies installed, you can start using the `SegmentedControl` component in your React application.\n\n## Usage\n\nThe **SegmentedControl** component provides a set of visually distinct buttons that allow users to select from a predefined set of options. It supports customization through various props.\n\nTo use the component, import it and include it in your JSX:\n\n```jsx\nimport React from 'react';\nimport { SegmentedControl } from '@bolttech/atoms-segmented-control';\n\nfunction App() {\n  return (\n    <BolttechThemeProvider theme={bolttechTheme}>\n      <SegmentedControl\n        value=\"option1\"\n        options={[\n          { label: 'Option 1', value: 'option1' },\n          { label: 'Option 2', value: 'option2' },\n        ]}\n        fullWidth={false}\n        errorMessage=\"An error occurred\"\n        dataTestId=\"segmented-control-component\"\n        onChange={(selectedValue) => console.log(`Selected: ${selectedValue}`)}\n      />\n    </BolttechThemeProvider>\n  );\n}\n\nexport default App;\n```\n\n## Props\n\nThe **SegmentedControl** component accepts the following props:\n\n| Prop           | Type     | Description                                                                       |\n| -------------- | -------- | --------------------------------------------------------------------------------- |\n| `id`           | string   | The HTML `id` attribute for the segmented control.                                |\n| `dataTestId`   | string   | The data-testid attribute for testing purposes.                                   |\n| `value`        | string   | The currently selected option value.                                              |\n| `options`      | Option[] | An array of option objects to be displayed.                                       |\n| `fullWidth`    | boolean  | Boolean representing if should take the containers full width on desktop devices. |\n| `errorMessage` | string   | An optional error message to display.                                             |\n| `onChange`     | function | A callback function triggered on option change.                                   |\n| `onBlur`       | function | A callback function triggered on blur event.                                      |\n| `onFocus`      | function | A callback function triggered on focus event.                                     |\n\n## Example\n\nHere's an example of using the **SegmentedControl** component:\n\n```jsx\n<SegmentedControl\n  value=\"option1\"\n  options={[\n    { label: 'Option 1', value: 'option1' },\n    { label: 'Option 2', value: 'option2' },\n  ]}\n  fullWidth={false}\n  errorMessage=\"An error occurred\"\n  dataTestId=\"segmented-control-component\"\n  onChange={(selectedValue) => console.log(`Selected: ${selectedValue}`)}\n/>\n```\n\nThis will render a **SegmentedControl** component with two options, the first option selected, and an error message displayed.\n\n## Contributing\n\nContributions to the **SegmentedControl** 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"}