{"_id":"@edux-design/accordions","_rev":"7-71ec95bc9979e1a2541a52bc95329cf9","name":"@edux-design/accordions","dist-tags":{"latest":"1.0.0"},"versions":{"0.0.1":{"name":"@edux-design/accordions","version":"0.0.1","_id":"@edux-design/accordions@0.0.1","maintainers":[{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"}],"dist":{"shasum":"b5dabdf9e2b21eaebffdfb439fdcb4042caa0851","tarball":"https://registry.npmjs.org/@edux-design/accordions/-/accordions-0.0.1.tgz","fileCount":6,"integrity":"sha512-ARfd0A/oCt7kwiqMvb8lkLhAd5tDeyNAb6hKBgbUk5Bxvt+ctHSHZVUpDfJkULYMQgUwuWCheTKEobaFXm4d4A==","signatures":[{"sig":"MEQCIEhl+pgzDXh10o4ZaAHF5SOc2HzM8ewNiFmNXpYrRDedAiBFsS1mD7fQBfMbPAA03Who11rgM5dXCm8O3Rk+SpKEhg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":44173},"types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"}},"gitHead":"f750b449d736d14f6fb7f26c7a4f02143b485150","private":false,"scripts":{"dev":"tsup src/index.js --watch --format esm,cjs --dts","lint":"eslint . --max-warnings 0","build":"tsup src/index.js --format esm,cjs --dts","check-types":"tsc --noEmit","generate:component":"turbo gen react-component"},"_npmUser":{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"},"_npmVersion":"10.9.2","description":"Composable React primitives for building multi-step flows, accordions, and vertical timelines that stay perfectly in sync with the Edux design tokens. The package currently ships the Stepper system: `Stepper`, `Step`, `Label`, `StepContent`, and `Descript","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","postcss":"^8.5.6","typescript":"^5.9.2","tailwindcss":"^4.1.12","@tailwindcss/cli":"^4.1.12","@tailwindcss/postcss":"^4.1.12","@repo/typescript-config":"*"},"peerDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","@edux-design/utils":"*"},"_npmOperationalInternal":{"tmp":"tmp/accordions_0.0.1_1762653415015_0.5831761254004302","host":"s3://npm-registry-packages-npm-production"}},"0.0.2":{"name":"@edux-design/accordions","version":"0.0.2","_id":"@edux-design/accordions@0.0.2","maintainers":[{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"}],"dist":{"shasum":"5834fe7c6aa3d0581b280449da7918360a374f8d","tarball":"https://registry.npmjs.org/@edux-design/accordions/-/accordions-0.0.2.tgz","fileCount":6,"integrity":"sha512-GL5/Tik0j3jqJFlIe8b2tYwQry7ySVvu/FY4w4TbYPu/AYAQScAF9Q7UD/QtHntHwZIHPrO8oIqQo9xeH2Nmsw==","signatures":[{"sig":"MEUCIQDYRoJgGys1z2lyNhl3VSNkfap8UdJDLMDvtpdeoRAPLAIgN3FkkzkJM5q2hovyhOsQyEiqJFS0B53KkfaEU2psAWE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":44173},"types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"}},"gitHead":"f5cbe7e930f10ef501a97afc6c5cdcb4edd29812","private":false,"scripts":{"dev":"tsup src/index.js --watch --format esm,cjs --dts","lint":"eslint . --max-warnings 0","build":"tsup src/index.js --format esm,cjs --dts","check-types":"tsc --noEmit","generate:component":"turbo gen react-component"},"_npmUser":{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"},"_npmVersion":"10.9.2","description":"Composable React primitives for building multi-step flows, accordions, and vertical timelines that stay perfectly in sync with the Edux design tokens. The package currently ships the Stepper system: `Stepper`, `Step`, `Label`, `StepContent`, and `Descript","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","postcss":"^8.5.6","typescript":"^5.9.2","tailwindcss":"^4.1.12","@tailwindcss/cli":"^4.1.12","@tailwindcss/postcss":"^4.1.12","@repo/typescript-config":"*"},"peerDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","@edux-design/utils":"*"},"_npmOperationalInternal":{"tmp":"tmp/accordions_0.0.2_1765248137527_0.1821133469998275","host":"s3://npm-registry-packages-npm-production"}},"0.0.3":{"name":"@edux-design/accordions","version":"0.0.3","_id":"@edux-design/accordions@0.0.3","maintainers":[{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"}],"dist":{"shasum":"569707960b2b2116ad11f6b5637114ff5e3235d6","tarball":"https://registry.npmjs.org/@edux-design/accordions/-/accordions-0.0.3.tgz","fileCount":6,"integrity":"sha512-m3QMcMOoNrJyJqfYN9kFpoDrhrH2GOC6lxnIjS+a5S30Jx958o82mKdY+NDfQilwn81Dzr9mhvRSPl5FpH7Neg==","signatures":[{"sig":"MEUCIDDGdUSC+8cmFlEFIPbKzsF3u+QCF73G+7JKb7wSJYjcAiEA9/h1CGgBjiv03rNzFg1dJq7q8hBqJs/D+IzH2qeDUdU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":210516},"types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"}},"gitHead":"19816a324bf9442a5c26b9f38f108a2ea29c0f80","private":false,"scripts":{"dev":"tsup src/index.js --watch --format esm,cjs --dts","lint":"eslint . --max-warnings 0","build":"tsup src/index.js --format esm,cjs --dts","check-types":"tsc --noEmit","generate:component":"turbo gen react-component"},"_npmUser":{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"},"_npmVersion":"10.9.2","description":"Composable React primitives for building multi-step flows, accordions, and vertical timelines that stay perfectly in sync with the Edux design tokens. The package currently ships the Stepper system: `Stepper`, `Step`, `Label`, `StepContent`, and `Descript","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","postcss":"^8.5.6","typescript":"^5.9.2","tailwindcss":"^4.1.12","@tailwindcss/cli":"^4.1.12","@tailwindcss/postcss":"^4.1.12","@repo/typescript-config":"*"},"peerDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","@edux-design/utils":"*"},"_npmOperationalInternal":{"tmp":"tmp/accordions_0.0.3_1766879507702_0.4783694786388679","host":"s3://npm-registry-packages-npm-production"}},"0.0.4":{"name":"@edux-design/accordions","version":"0.0.4","_id":"@edux-design/accordions@0.0.4","maintainers":[{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"}],"dist":{"shasum":"e083a67f71bbd95db31dccc0775488cae3575d96","tarball":"https://registry.npmjs.org/@edux-design/accordions/-/accordions-0.0.4.tgz","fileCount":6,"integrity":"sha512-3HmPZwaRSFdEaygTWEiuLi6V/bLHfMQuoFu+BoSHwFb1bMkfnPuRQxMkOhTyl/Kro6cNgBLwgepbEPyOEZ2Evw==","signatures":[{"sig":"MEYCIQCic/0Xk9/GbS+v33x6IpXQbe+rYGzvTYcIqu5MxKN1gQIhALL5cpcHSbBhNvdQqT6sXSFJWtZ8tyo3OFA35SyiLw5J","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":541808},"types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"}},"gitHead":"19816a324bf9442a5c26b9f38f108a2ea29c0f80","private":false,"scripts":{"dev":"tsup src/index.js --watch --format esm,cjs --dts","lint":"eslint . --max-warnings 0","build":"tsup src/index.js --format esm,cjs --dts","check-types":"tsc --noEmit","generate:component":"turbo gen react-component"},"_npmUser":{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"},"_npmVersion":"10.9.2","description":"Composable React primitives for building multi-step flows, accordions, and vertical timelines that stay perfectly in sync with the Edux design tokens. The package currently ships the Stepper system: `Stepper`, `Step`, `Label`, `StepContent`, and `Descript","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","postcss":"^8.5.6","typescript":"^5.9.2","tailwindcss":"^4.1.12","@tailwindcss/cli":"^4.1.12","@tailwindcss/postcss":"^4.1.12","@repo/typescript-config":"*"},"peerDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","@edux-design/utils":"*"},"_npmOperationalInternal":{"tmp":"tmp/accordions_0.0.4_1766911381439_0.28724372888389516","host":"s3://npm-registry-packages-npm-production"}},"0.0.5":{"name":"@edux-design/accordions","version":"0.0.5","_id":"@edux-design/accordions@0.0.5","maintainers":[{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"}],"dist":{"shasum":"9368d11ee8248dd5bc61b247eef44ea38a758a30","tarball":"https://registry.npmjs.org/@edux-design/accordions/-/accordions-0.0.5.tgz","fileCount":6,"integrity":"sha512-4GrZlGyjm3PfxlXwJpcdNIjlXzrA9Gy75QwAWBN7Or4JkaX08TDUXZ5dluy3z/ag3GqfJA3q6yXDVdce59EcUg==","signatures":[{"sig":"MEYCIQC6tdpMr0jMU0ZALmI9t/u2xFv/yAj6zH2tcDudtG9MmwIhANJytzeclhFUe9gXmPemXnJ7RmmWAI1iI7MwgDXWDN1x","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":210608},"types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"}},"gitHead":"c109365714691a5b974d9f3f74f10d3e18066f54","private":false,"scripts":{"dev":"tsup src/index.js --watch --format esm,cjs --dts --external react,react-dom,@edux-design/utils","lint":"eslint . --max-warnings 0","build":"tsup src/index.js --format esm,cjs --dts --external react,react-dom,@edux-design/utils","check-types":"tsc --noEmit","generate:component":"turbo gen react-component"},"_npmUser":{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"},"_npmVersion":"10.9.2","description":"Composable React primitives for building multi-step flows, accordions, and vertical timelines that stay perfectly in sync with the Edux design tokens. The package currently ships the Stepper system: `Stepper`, `Step`, `Label`, `StepContent`, and `Descript","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","postcss":"^8.5.6","typescript":"^5.9.2","tailwindcss":"^4.1.12","@tailwindcss/cli":"^4.1.12","@tailwindcss/postcss":"^4.1.12","@repo/typescript-config":"*"},"peerDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","@edux-design/utils":"*"},"_npmOperationalInternal":{"tmp":"tmp/accordions_0.0.5_1766911927749_0.4207144936659528","host":"s3://npm-registry-packages-npm-production"}},"0.0.6":{"name":"@edux-design/accordions","version":"0.0.6","_id":"@edux-design/accordions@0.0.6","maintainers":[{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"}],"dist":{"shasum":"3ec20b7fb336cb05de76456874c3e197a6de3338","tarball":"https://registry.npmjs.org/@edux-design/accordions/-/accordions-0.0.6.tgz","fileCount":6,"integrity":"sha512-IWjmutNg7+KnX6Dv+5IX+sobulnzFsgZdRdHGXESoTG0voequndr+5J99yGk+JXPVw4aHtL1r1YgiUFaMAT7mA==","signatures":[{"sig":"MEUCIGzJ2unZGhGxy6lQabW8hvZUmBefgQrSUB1XRZAYgBLqAiEA9vgy5/8+epjlMC1nfcdhAWTlUTx9dszlGOEjW9gfAj4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":210654},"types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.mjs","require":"./dist/index.js"}},"gitHead":"c109365714691a5b974d9f3f74f10d3e18066f54","private":false,"scripts":{"dev":"tsup src/index.js --watch --format esm,cjs --dts --external react,react-dom,@edux-design/utils","lint":"eslint . --max-warnings 0","build":"tsup src/index.js --format esm,cjs --dts --external react,react-dom,@edux-design/utils","check-types":"tsc --noEmit","generate:component":"turbo gen react-component"},"_npmUser":{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"},"_npmVersion":"10.9.2","description":"Composable React primitives for building multi-step flows, accordions, and vertical timelines that stay perfectly in sync with the Edux design tokens. The package currently ships the Stepper system: `Stepper`, `Step`, `Label`, `StepContent`, and `Descript","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.14.0","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.0","postcss":"^8.5.6","typescript":"^5.9.2","tailwindcss":"^4.1.12","@tailwindcss/cli":"^4.1.12","@tailwindcss/postcss":"^4.1.12","@repo/typescript-config":"*"},"peerDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","@edux-design/utils":"*"},"_npmOperationalInternal":{"tmp":"tmp/accordions_0.0.6_1766914263095_0.962725535992798","host":"s3://npm-registry-packages-npm-production"}},"1.0.0":{"name":"@edux-design/accordions","version":"1.0.0","private":false,"sideEffects":["**/*.css"],"types":"./dist/index.d.ts","exports":{".":{"import":"./dist/index.mjs","require":"./dist/index.js","types":"./dist/index.d.ts"}},"scripts":{"lint":"eslint . --max-warnings 0","build":"tsup src/index.js --format esm,cjs --dts --external react,react-dom,@edux-design/utils","dev":"tsup src/index.js --watch --format esm,cjs --dts --external react,react-dom,@edux-design/utils","generate:component":"turbo gen react-component","check-types":"tsc --noEmit"},"peerDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","@edux-design/utils":"*"},"devDependencies":{"@repo/typescript-config":"*","typescript":"^5.9.2","tailwindcss":"^4.1.12","postcss":"^8.5.6","tsup":"^8.5.0","@tailwindcss/cli":"^4.1.12","@tailwindcss/postcss":"^4.1.12"},"_id":"@edux-design/accordions@1.0.0","gitHead":"7250cb811a32db15e58b04e1b9865d3876905b5f","description":"Composable React primitives for building multi-step flows, accordions, and vertical timelines that stay perfectly in sync with the Edux design tokens. The package currently ships the Stepper system: `Stepper`, `Step`, `Label`, `StepContent`, and `Descript","_nodeVersion":"22.14.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-QIc7HcH0Un4iGzGImUpctW1kT10SD57VdZn03EfE8DvSpyU7v/Gobq8IxWf49T6+V6NAA1GDwxFpmI+FTQxfBw==","shasum":"9d43d86a88ee64c61ff9bc1bbc6f093a0005ea6a","tarball":"https://registry.npmjs.org/@edux-design/accordions/-/accordions-1.0.0.tgz","fileCount":6,"unpackedSize":51395,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCekgPBGBRNEfdc71M1i2VqVo2A30Vl1dA9nIp8oZwpjAIhAIQg8oq2gTTPOratZ7Bs51JZ99PcrEB+1xnrb/Fz+Z9J"}]},"_npmUser":{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"},"directories":{},"maintainers":[{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/accordions_1.0.0_1767265775461_0.5401820723064485"},"_hasShrinkwrap":false}},"time":{"created":"2025-11-09T01:56:54.894Z","modified":"2026-01-01T11:09:35.842Z","0.0.1":"2025-11-09T01:56:55.221Z","0.0.2":"2025-12-09T02:42:17.666Z","0.0.3":"2025-12-27T23:51:47.846Z","0.0.4":"2025-12-28T08:43:01.591Z","0.0.5":"2025-12-28T08:52:07.901Z","0.0.6":"2025-12-28T09:31:03.246Z","1.0.0":"2026-01-01T11:09:35.603Z"},"description":"Composable React primitives for building multi-step flows, accordions, and vertical timelines that stay perfectly in sync with the Edux design tokens. The package currently ships the Stepper system: `Stepper`, `Step`, `Label`, `StepContent`, and `Descript","maintainers":[{"name":"vjdalsanto26","email":"viraj.gunawardana@cambridge.org"}],"readme":"# @edux-design/accordions\n\nComposable React primitives for building multi-step flows, accordions, and vertical timelines that stay perfectly in sync with the Edux design tokens. The package currently ships the Stepper system: `Stepper`, `Step`, `Label`, `StepContent`, and `Description`.\n\n- **Context-driven** – `Stepper` wires IDs, status, aria attributes, and animation state for every `Step` child.\n- **Flexible layout** – switch between horizontal and vertical orientations with a prop; the progress track automatically realigns.\n- **Accessible-first** – step indicators render as real buttons, labels retain semantic text, and all content stays announced via `aria-current`, `aria-disabled`, and live updates.\n- **Design-token ready** – styling hooks use the shared `@edux-design/utils` `cx` helper so your tokens map directly to Tailwind utilities.\n\n---\n\n## Installation\n\n```bash\nnpm install @edux-design/accordions @edux-design/utils\n# or\npnpm add @edux-design/accordions @edux-design/utils\n```\n\nPeer deps: `react@^19.1.0`, `react-dom@^19.1.0`.\n\n---\n\n## Usage\n\n```jsx\nimport {\n Stepper,\n Step,\n Label,\n StepContent,\n Description,\n} from \"@edux-design/accordions\";\n\nexport function SignupStepper() {\n const [activeStep, setActiveStep] = useState(0);\n\n return (\n \n \n \n \n Pick a username and password so we can create your profile.\n \n Required\n \n\n \n \n \n Tell us about your background to tailor the experience.\n \n \n\n \n \n Review everything before submitting\n \n \n );\n}\n```\n\n### Props at a Glance\n\n| Component | Key props |\n| ------------- | ------------------------------------------------------------------------------------------- |\n| `Stepper` | `activeStep`, `defaultStep`, `onStepChange`, `orientation` (`horizontal`\\|`vertical`), `linear` |\n| `Step` | `value`, `disabled`, `status`, `stepKey` (maps to style variants), `as` |\n| `Label` | `as`, standard button/link props |\n| `StepContent` | `as`, `unmountOnInactive`, `className` (merged via `cx`), arbitrary DOM props |\n| `Description` | No special props; renders subdued supporting text |\n\n---\n\n## How the Progress Track Works\n\nEach `Step` registers its indicator node with the `Stepper`. The parent measures the center points of the first and last indicators and renders a dashed track behind them. The filled portion animates between those centers whenever `activeStep` changes. This logic runs for both horizontal and vertical orientations.\n\n---\n\n## Storybook Demos\n\n- `Basic` – controlled horizontal flow with inline `StepContent` and `Description`.\n- `NonLinear` – demonstrates `linear={false}` so users can jump steps freely.\n- `Vertical` – showcases the vertical orientation with the shared content rendering at the root.\n\nSee `src/demos/Stepper.stories.jsx` for setups you can copy.\n\n---\n\n## Development\n\n- `pnpm build` – bundle with `tsup` to `dist/` (ESM, CJS, and types).\n- `pnpm dev` – watch mode for local development.\n- `pnpm lint` – run ESLint with zero-warning policy.\n- `pnpm check-types` – type-check via `tsc --noEmit`.\n\nWhen adding new primitives, follow the existing folder structure: `src/elements`, `src/utils`, `src/demos`, and update `src/index.js` exports plus `CHANGELOG.md`.\n\n---\n\n## Roadmap / Notes\n\n- Additional accordion primitives will live in this package as they’re designed.\n- Stepper currently assumes each `Step` provides a consistent width/height indicator; if your design deviates, revisit the measurement helpers inside `Stepper.jsx`.\n- Vertical progress animations reuse the same measurement logic; confirm large content blocks don’t shift the indicator layout unexpectedly.\n\nContributions, tweaks, and style overrides should stick to the shared design tokens to keep parity with the rest of the Edux system.\n\n","readmeFilename":"README.md"}