{"_id":"@bessemeralliance/tools-design-system","_rev":"5-167324588aed1d78567daa0102201c4e","name":"@bessemeralliance/tools-design-system","dist-tags":{"latest":"0.8.0"},"versions":{"0.6.0":{"name":"@bessemeralliance/tools-design-system","version":"0.6.0","license":"MIT","_id":"@bessemeralliance/tools-design-system@0.6.0","maintainers":[{"name":"jkoempel2026","email":"jeremy@bessemeralliance.com"}],"homepage":"https://bessemeralliance.github.io/tools-design-system/","bugs":{"url":"https://github.com/BessemerAlliance/tools-design-system/issues"},"dist":{"shasum":"a97bb84052f308d23509e4021925ce85a579f884","tarball":"https://registry.npmjs.org/@bessemeralliance/tools-design-system/-/tools-design-system-0.6.0.tgz","fileCount":67,"integrity":"sha512-SGDManJgwl7PbK6R6MZSPgW4n2AhaKAXlbkndKiaikF7ztgRqbUF8ahhfj951Yh/neiSaWvZt6RVajTh1Tqz7g==","signatures":[{"sig":"MEQCIEGOheu9mrUCmUyG5ttXWgKXUIRuR7qXJw3ujTi18nuqAiBslV9AcPKr8UqovQ4ApCjqQ+hJkkiw8Sfucch4ozzeQw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":292719},"types":"./dist/types/ds-entry.d.ts","module":"./dist/index.mjs","engines":{"node":">=22.11"},"exports":{".":{"types":"./dist/types/ds-entry.d.ts","import":"./dist/index.mjs"},"./cn":{"types":"./dist/types/src/lib/cn.d.ts","import":"./dist/cn.mjs"},"./styles":"./dist/styles.css","./tokens":{"types":"./dist/types/src/tokens/index.d.ts","import":"./dist/tokens.mjs"},"./fonts.css":"./dist/fonts.css","./theme.css":"./dist/theme.css","./package.json":"./package.json","./components/ui":{"types":"./dist/types/src/components/ui/index.d.ts","import":"./dist/components/ui.mjs"},"./components/layout":{"types":"./dist/types/src/components/layout/index.d.ts","import":"./dist/components/layout.mjs"}},"gitHead":"5b22a23cb495f9f7711e99ed2090fb2bf6dfea82","scripts":{"dev":"next dev","lint":"eslint","test":"vitest run","build":"next build","start":"next start","prepack":"npm run build:lib","build:lib":"node scripts/build-lib.mjs && tsc -p tsconfig.ds.json","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit","test:watch":"vitest","test:package":"vitest run --project=package","prepublishOnly":"npm run build:lib","test:storybook":"vitest run --project=storybook","build-storybook":"storybook build"},"_npmUser":{"name":"jkoempel2026","email":"jeremy@bessemeralliance.com"},"repository":{"url":"git+https://github.com/BessemerAlliance/tools-design-system.git","type":"git"},"_npmVersion":"10.9.8","description":"Bessemer Tools design system: Tailwind tokens, React components, and app-shell patterns extracted from the Bessemer Portal.","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.22.3","dependencies":{"clsx":"^2.1.1","@base-ui/react":"^1.6.0","tailwind-merge":"^3.6.0","@carbon/icons-react":"^11.84.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"next":"16.2.6","react":"19.2.4","eslint":"^9","vitest":"^4.1.10","esbuild":"^0.28.1","postcss":"^8","react-dom":"19.2.4","storybook":"10.5.7","playwright":"^1.62.1","typescript":"^5.9.3","@types/node":"^20","tailwindcss":"^4","@types/react":"^19","@vitest/browser":"^4.1.10","@types/react-dom":"^19","eslint-config-next":"16.2.6","@tailwindcss/postcss":"^4","@storybook/addon-a11y":"10.5.7","@storybook/addon-docs":"10.5.7","@storybook/nextjs-vite":"10.5.7","@storybook/addon-vitest":"10.5.7","eslint-plugin-storybook":"10.5.7","@vitest/browser-playwright":"^4.1.10"},"peerDependencies":{"next":">=14","react":">=18.2.0","react-dom":">=18.2.0"},"_npmOperationalInternal":{"tmp":"tmp/tools-design-system_0.6.0_1786557579565_0.43245222892025037","host":"s3://npm-registry-packages-npm-production"}},"0.6.3":{"name":"@bessemeralliance/tools-design-system","version":"0.6.3","license":"MIT","_id":"@bessemeralliance/tools-design-system@0.6.3","maintainers":[{"name":"jkoempel2026","email":"jeremy@bessemeralliance.com"}],"homepage":"https://bessemeralliance.github.io/tools-design-system/","bugs":{"url":"https://github.com/BessemerAlliance/tools-design-system/issues"},"dist":{"shasum":"7ea2545e504c1853bf5d29516b91834ff73762aa","tarball":"https://registry.npmjs.org/@bessemeralliance/tools-design-system/-/tools-design-system-0.6.3.tgz","fileCount":67,"integrity":"sha512-0SeYbOjMb8IJ7m8JMG5ztZ7jq5QyCK9oGYIZhdY6RZ1mUvTw4KsRnBLJ5nUoHx2+fv5G+V/PX6a/IYCZkX6Wuw==","signatures":[{"sig":"MEYCIQDfLdA0ImJUuf0JPsUdwmptmuZPp+3nDHKddXkgHCeZFwIhAL9Pjp+zEj08OSMBEkie3VAOpljDmWR92K3sxvg+LVVF","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":295422},"_from":"file:bessemeralliance-tools-design-system-0.6.3.tgz","types":"./dist/types/ds-entry.d.ts","module":"./dist/index.mjs","engines":{"node":">=22.11"},"exports":{".":{"types":"./dist/types/ds-entry.d.ts","import":"./dist/index.mjs"},"./cn":{"types":"./dist/types/src/lib/cn.d.ts","import":"./dist/cn.mjs"},"./styles":"./dist/styles.css","./tokens":{"types":"./dist/types/src/tokens/index.d.ts","import":"./dist/tokens.mjs"},"./fonts.css":"./dist/fonts.css","./theme.css":"./dist/theme.css","./package.json":"./package.json","./components/ui":{"types":"./dist/types/src/components/ui/index.d.ts","import":"./dist/components/ui.mjs"},"./components/layout":{"types":"./dist/types/src/components/layout/index.d.ts","import":"./dist/components/layout.mjs"}},"scripts":{"dev":"next dev","lint":"eslint","test":"vitest run","build":"next build","start":"next start","prepack":"npm run build:lib","build:lib":"node scripts/build-lib.mjs && tsc -p tsconfig.ds.json","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit","test:watch":"vitest","test:package":"vitest run --project=package","prepublishOnly":"npm run build:lib","test:storybook":"vitest run --project=storybook","build-storybook":"storybook build"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:7becff8c-eb88-4f90-a401-d0d75a9558da"}},"_resolved":"/home/runner/work/tools-design-system/tools-design-system/bessemeralliance-tools-design-system-0.6.3.tgz","_integrity":"sha512-0SeYbOjMb8IJ7m8JMG5ztZ7jq5QyCK9oGYIZhdY6RZ1mUvTw4KsRnBLJ5nUoHx2+fv5G+V/PX6a/IYCZkX6Wuw==","repository":{"url":"git+https://github.com/BessemerAlliance/tools-design-system.git","type":"git"},"_npmVersion":"12.0.2","description":"Bessemer Tools design system: Tailwind tokens, React components, and app-shell patterns extracted from the Bessemer Portal.","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.23.1","dependencies":{"clsx":"^2.1.1","@base-ui/react":"^1.6.0","tailwind-merge":"^3.6.0","@carbon/icons-react":"^11.84.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"next":"16.2.6","react":"19.2.4","eslint":"^9","vitest":"^4.1.10","esbuild":"^0.28.1","postcss":"^8","react-dom":"19.2.4","storybook":"10.5.7","playwright":"^1.62.1","typescript":"^5.9.3","@types/node":"^20","tailwindcss":"^4","@types/react":"^19","@vitest/browser":"^4.1.10","@types/react-dom":"^19","eslint-config-next":"16.2.6","@tailwindcss/postcss":"^4","@storybook/addon-a11y":"10.5.7","@storybook/addon-docs":"10.5.7","@storybook/nextjs-vite":"10.5.7","@storybook/addon-vitest":"10.5.7","eslint-plugin-storybook":"10.5.7","@vitest/browser-playwright":"^4.1.10"},"peerDependencies":{"next":">=14","react":">=18.2.0","react-dom":">=18.2.0"},"_npmOperationalInternal":{"tmp":"tmp/tools-design-system_0.6.3_1786559055600_0.23760032963065414","host":"s3://npm-registry-packages-npm-production"}},"0.7.0":{"name":"@bessemeralliance/tools-design-system","version":"0.7.0","license":"MIT","_id":"@bessemeralliance/tools-design-system@0.7.0","maintainers":[{"name":"jkoempel2026","email":"jeremy@bessemeralliance.com"}],"homepage":"https://bessemeralliance.github.io/tools-design-system/","bugs":{"url":"https://github.com/BessemerAlliance/tools-design-system/issues"},"dist":{"shasum":"cb6a7226dfaf3575bb08b197bef955448aa375af","tarball":"https://registry.npmjs.org/@bessemeralliance/tools-design-system/-/tools-design-system-0.7.0.tgz","fileCount":67,"integrity":"sha512-KYvoVxW0oWA638eDAI1mmpcEFfJv+SnSWDse9fM30swu+WVuVRvOQnuU9/KlxH12eyYhabv7sQLK2MTR8yu/zw==","signatures":[{"sig":"MEQCIBuHfcDp7JZDZypzVjbUo6b+eH4k7+oNWwu82DC9tUngAiA9mTs1JOwyDwPTrD0aN9O97vfYIk53xzILzllJqmTDMw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":302007},"_from":"file:bessemeralliance-tools-design-system-0.7.0.tgz","types":"./dist/types/ds-entry.d.ts","module":"./dist/index.mjs","engines":{"node":">=22.11"},"exports":{".":{"types":"./dist/types/ds-entry.d.ts","import":"./dist/index.mjs"},"./cn":{"types":"./dist/types/src/lib/cn.d.ts","import":"./dist/cn.mjs"},"./styles":"./dist/styles.css","./tokens":{"types":"./dist/types/src/tokens/index.d.ts","import":"./dist/tokens.mjs"},"./fonts.css":"./dist/fonts.css","./theme.css":"./dist/theme.css","./package.json":"./package.json","./components/ui":{"types":"./dist/types/src/components/ui/index.d.ts","import":"./dist/components/ui.mjs"},"./components/layout":{"types":"./dist/types/src/components/layout/index.d.ts","import":"./dist/components/layout.mjs"}},"scripts":{"dev":"next dev","lint":"eslint","test":"vitest run","build":"next build","start":"next start","prepack":"npm run build:lib","build:lib":"node scripts/build-lib.mjs && tsc -p tsconfig.ds.json","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit","test:watch":"vitest","test:package":"vitest run --project=package","prepublishOnly":"npm run build:lib","test:storybook":"vitest run --project=storybook","build-storybook":"storybook build"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:7becff8c-eb88-4f90-a401-d0d75a9558da"}},"_resolved":"/home/runner/work/tools-design-system/tools-design-system/bessemeralliance-tools-design-system-0.7.0.tgz","_integrity":"sha512-KYvoVxW0oWA638eDAI1mmpcEFfJv+SnSWDse9fM30swu+WVuVRvOQnuU9/KlxH12eyYhabv7sQLK2MTR8yu/zw==","repository":{"url":"git+https://github.com/BessemerAlliance/tools-design-system.git","type":"git"},"_npmVersion":"12.0.2","description":"Bessemer Tools design system: Tailwind tokens, React components, and app-shell patterns extracted from the Bessemer Portal.","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.23.1","dependencies":{"clsx":"^2.1.1","@base-ui/react":"^1.6.0","tailwind-merge":"^3.6.0","@carbon/icons-react":"^11.84.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"next":"16.2.6","react":"19.2.4","eslint":"^9","vitest":"^4.1.10","esbuild":"^0.28.1","postcss":"^8","react-dom":"19.2.4","storybook":"10.5.7","playwright":"^1.62.1","typescript":"^5.9.3","@types/node":"^20","tailwindcss":"^4","@types/react":"^19","@vitest/browser":"^4.1.10","@types/react-dom":"^19","eslint-config-next":"16.2.6","@tailwindcss/postcss":"^4","@storybook/addon-a11y":"10.5.7","@storybook/addon-docs":"10.5.7","@storybook/nextjs-vite":"10.5.7","@storybook/addon-vitest":"10.5.7","eslint-plugin-storybook":"10.5.7","@vitest/browser-playwright":"^4.1.10"},"peerDependencies":{"next":">=14","react":">=18.2.0","react-dom":">=18.2.0"},"_npmOperationalInternal":{"tmp":"tmp/tools-design-system_0.7.0_1786575754194_0.9072598398626275","host":"s3://npm-registry-packages-npm-production"}},"0.7.1":{"name":"@bessemeralliance/tools-design-system","version":"0.7.1","license":"MIT","_id":"@bessemeralliance/tools-design-system@0.7.1","maintainers":[{"name":"jkoempel2026","email":"jeremy@bessemeralliance.com"}],"homepage":"https://bessemeralliance.github.io/tools-design-system/","bugs":{"url":"https://github.com/BessemerAlliance/tools-design-system/issues"},"dist":{"shasum":"0eaf3663fad49cd6f473c54181bdc1d3065cfab6","tarball":"https://registry.npmjs.org/@bessemeralliance/tools-design-system/-/tools-design-system-0.7.1.tgz","fileCount":67,"integrity":"sha512-xBcI8ZD5v8Jebr59sTIRDKEQ/URk9fQBRl2xPxVAzn+DRiJ0IM3kWvUo7N4Ct1fMoCnF/ZTsNTQQm7X2vhUn4w==","signatures":[{"sig":"MEQCICHrpOqTsX/1E1da98ADFbFOJGCfMgHvCvGY5lyIt8KwAiA+sFavQavNiIPsiC6aGKC6+JGgGqGLD45eSnp87O8KRA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":302163},"_from":"file:bessemeralliance-tools-design-system-0.7.1.tgz","types":"./dist/types/ds-entry.d.ts","module":"./dist/index.mjs","engines":{"node":">=22.11"},"exports":{".":{"types":"./dist/types/ds-entry.d.ts","import":"./dist/index.mjs"},"./cn":{"types":"./dist/types/src/lib/cn.d.ts","import":"./dist/cn.mjs"},"./styles":"./dist/styles.css","./tokens":{"types":"./dist/types/src/tokens/index.d.ts","import":"./dist/tokens.mjs"},"./fonts.css":"./dist/fonts.css","./theme.css":"./dist/theme.css","./package.json":"./package.json","./components/ui":{"types":"./dist/types/src/components/ui/index.d.ts","import":"./dist/components/ui.mjs"},"./components/layout":{"types":"./dist/types/src/components/layout/index.d.ts","import":"./dist/components/layout.mjs"}},"scripts":{"dev":"next dev","lint":"eslint","test":"vitest run","build":"next build","start":"next start","prepack":"npm run build:lib","build:lib":"node scripts/build-lib.mjs && tsc -p tsconfig.ds.json","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit","test:watch":"vitest","test:package":"vitest run --project=package","prepublishOnly":"npm run build:lib","test:storybook":"vitest run --project=storybook","build-storybook":"storybook build"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:7becff8c-eb88-4f90-a401-d0d75a9558da"}},"_resolved":"/home/runner/work/tools-design-system/tools-design-system/bessemeralliance-tools-design-system-0.7.1.tgz","_integrity":"sha512-xBcI8ZD5v8Jebr59sTIRDKEQ/URk9fQBRl2xPxVAzn+DRiJ0IM3kWvUo7N4Ct1fMoCnF/ZTsNTQQm7X2vhUn4w==","repository":{"url":"git+https://github.com/BessemerAlliance/tools-design-system.git","type":"git"},"_npmVersion":"12.0.2","description":"Bessemer Tools design system: Tailwind tokens, React components, and app-shell patterns extracted from the Bessemer Portal.","directories":{},"sideEffects":["**/*.css"],"_nodeVersion":"22.23.2","dependencies":{"clsx":"^2.1.1","@base-ui/react":"^1.6.0","tailwind-merge":"^3.6.0","@carbon/icons-react":"^11.84.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"next":"16.3.0","react":"19.2.8","eslint":"^9","vitest":"^4.1.10","esbuild":"^0.28.1","postcss":"^8","react-dom":"19.2.8","storybook":"10.5.7","playwright":"^1.62.1","typescript":"^5.9.3","@types/node":"^20","tailwindcss":"^4","@types/react":"^19","@vitest/browser":"^4.1.10","@types/react-dom":"^19","eslint-config-next":"16.3.0","@tailwindcss/postcss":"^4","@storybook/addon-a11y":"10.5.7","@storybook/addon-docs":"10.5.7","@storybook/nextjs-vite":"10.5.7","@storybook/addon-vitest":"10.5.7","eslint-plugin-storybook":"10.5.7","@vitest/browser-playwright":"^4.1.10"},"peerDependencies":{"next":">=14","react":">=18.2.0","react-dom":">=18.2.0"},"_npmOperationalInternal":{"tmp":"tmp/tools-design-system_0.7.1_1786632400025_0.3952252138715089","host":"s3://npm-registry-packages-npm-production"}},"0.8.0":{"name":"@bessemeralliance/tools-design-system","version":"0.8.0","description":"Bessemer Tools design system: Tailwind tokens, React components, and app-shell patterns extracted from the Bessemer Portal.","license":"MIT","repository":{"type":"git","url":"git+https://github.com/BessemerAlliance/tools-design-system.git"},"homepage":"https://bessemeralliance.github.io/tools-design-system/","bugs":{"url":"https://github.com/BessemerAlliance/tools-design-system/issues"},"engines":{"node":">=22.11"},"sideEffects":["**/*.css"],"types":"./dist/types/ds-entry.d.ts","module":"./dist/index.mjs","exports":{".":{"types":"./dist/types/ds-entry.d.ts","import":"./dist/index.mjs"},"./components/ui":{"types":"./dist/types/src/components/ui/index.d.ts","import":"./dist/components/ui.mjs"},"./components/layout":{"types":"./dist/types/src/components/layout/index.d.ts","import":"./dist/components/layout.mjs"},"./tokens":{"types":"./dist/types/src/tokens/index.d.ts","import":"./dist/tokens.mjs"},"./cn":{"types":"./dist/types/src/lib/cn.d.ts","import":"./dist/cn.mjs"},"./styles":"./dist/styles.css","./theme.css":"./dist/theme.css","./fonts.css":"./dist/fonts.css","./package.json":"./package.json"},"publishConfig":{"access":"public"},"scripts":{"dev":"next dev","build":"next build","start":"next start","lint":"eslint","typecheck":"tsc --noEmit","build:lib":"node scripts/build-lib.mjs && tsc -p tsconfig.ds.json","prepublishOnly":"npm run build:lib","prepack":"npm run build:lib","storybook":"storybook dev -p 6006","build-storybook":"storybook build","test":"vitest run","test:watch":"vitest","test:storybook":"vitest run --project=storybook","test:package":"vitest run --project=package"},"peerDependencies":{"next":">=14","react":">=18.2.0","react-dom":">=18.2.0"},"dependencies":{"@base-ui/react":"^1.6.0","@carbon/icons-react":"^11.84.0","clsx":"^2.1.1","tailwind-merge":"^3.6.0"},"devDependencies":{"@storybook/addon-a11y":"10.5.7","@storybook/addon-docs":"10.5.7","@storybook/addon-vitest":"10.5.7","@storybook/nextjs-vite":"10.5.7","@tailwindcss/postcss":"^4","@types/node":"^20","@types/react":"^19","@types/react-dom":"^19","@vitest/browser":"^4.1.10","@vitest/browser-playwright":"^4.1.10","esbuild":"^0.28.1","eslint":"^9","eslint-config-next":"16.3.0","eslint-plugin-storybook":"10.5.7","next":"16.3.0","playwright":"^1.62.1","postcss":"^8","react":"19.2.8","react-dom":"19.2.8","storybook":"10.5.7","tailwindcss":"^4","typescript":"^5.9.3","vitest":"^4.1.10"},"_id":"@bessemeralliance/tools-design-system@0.8.0","_integrity":"sha512-wIWjUwPSzzTYyMh7g6FCqGyuulaZkMe1Bx07YkjWtda4p4uYDEMn4M5GeglzInaMEiwSA2EFqEGpzh9zM6FQSg==","_resolved":"/home/runner/work/tools-design-system/tools-design-system/bessemeralliance-tools-design-system-0.8.0.tgz","_from":"file:bessemeralliance-tools-design-system-0.8.0.tgz","_nodeVersion":"22.23.2","_npmVersion":"12.0.2","dist":{"integrity":"sha512-wIWjUwPSzzTYyMh7g6FCqGyuulaZkMe1Bx07YkjWtda4p4uYDEMn4M5GeglzInaMEiwSA2EFqEGpzh9zM6FQSg==","shasum":"850c78ace6e38f85510cb0f94e391d717944e923","tarball":"https://registry.npmjs.org/@bessemeralliance/tools-design-system/-/tools-design-system-0.8.0.tgz","fileCount":68,"unpackedSize":307357,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDFX2PdFvnlCc1J4OQVUANIWeewvxMP0NelaiyeFKasxQIgOSrsAe7boGZiMe6uNgRjwpWvnu/2Ff97JdxCeJ+zbww="}]},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:7becff8c-eb88-4f90-a401-d0d75a9558da"}},"directories":{},"maintainers":[{"name":"jkoempel2026","email":"jeremy@bessemeralliance.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/tools-design-system_0.8.0_1786925158222_0.026030754121606936"},"_hasShrinkwrap":false}},"time":{"created":"2026-08-12T17:59:39.250Z","modified":"2026-08-17T00:05:58.613Z","0.6.0":"2026-08-12T17:59:39.784Z","0.6.3":"2026-08-12T18:24:15.826Z","0.7.0":"2026-08-12T23:02:34.340Z","0.7.1":"2026-08-13T14:46:40.175Z","0.8.0":"2026-08-17T00:05:58.397Z"},"bugs":{"url":"https://github.com/BessemerAlliance/tools-design-system/issues"},"license":"MIT","homepage":"https://bessemeralliance.github.io/tools-design-system/","repository":{"type":"git","url":"git+https://github.com/BessemerAlliance/tools-design-system.git"},"description":"Bessemer Tools design system: Tailwind tokens, React components, and app-shell patterns extracted from the Bessemer Portal.","maintainers":[{"name":"jkoempel2026","email":"jeremy@bessemeralliance.com"}],"readme":"# @bessemeralliance/tools-design-system\n\nTailwind 4 tokens, 45 React components, and app-shell patterns for Bessemer internal tools.\n\n**[Browse the component docs →](https://bessemeralliance.github.io/tools-design-system/)**\n\nEvery component has a story with live controls and generated prop tables. Start there — it answers \"what exists\" and \"what props does it take\" faster than this file can.\n\n---\n\n## Requirements\n\n| | |\n|---|---|\n| React | `>=18.2.0` (peer) |\n| React DOM | `>=18.2.0` (peer) |\n| Next.js | `>=14` (peer) — **required only by `Breadcrumb`**, which imports `next/link`. Everything else is framework-agnostic: `Sidebar` and `AppShell` take a `linkComponent` prop. |\n| Node | `>=22.11` for development of this repo (consumers are unconstrained) |\n| Module format | **ESM only.** The exports map has no `require` condition. |\n\n> **Jest users:** this package ships ESM with no CJS fallback. Jest fails with `Cannot use import statement outside a module` unless you add `transformIgnorePatterns: [\"/node_modules/(?!@bessemeralliance/)\"]` and run Jest in ESM mode. Vitest and Next's own bundler need no configuration.\n\n---\n\n## Install\n\n```bash\nnpm install @bessemeralliance/tools-design-system\n```\n\nThat is the whole of it. The package is public on npmjs.org — no registry\nconfiguration, no `.npmrc`, no personal access token, no scopes to get wrong.\n\n> **Upgrading from a GitHub Packages install?** Delete the\n> `@bessemeralliance:registry=...` line from your project's `.npmrc` (and the file\n> entirely if that was all it held), drop the `//npm.pkg.github.com/:_authToken`\n> line from your `~/.npmrc`, then re-run `npm install`. Nothing else changes:\n> same name, same version, same exports.\n\n\n## Setup\n\nTwo things are required and neither is optional. Skipping either produces a page that renders but looks subtly wrong, with no error.\n\n### Stylesheets — pick exactly one\n\n**Does your app run its own Tailwind 4 build?**\n\n**No** → import `./styles`. One line, nothing else to configure, works in any framework.\n\n```tsx\n// app/layout.tsx, or your app's single entry point\nimport \"@bessemeralliance/tools-design-system/styles\";\n```\n\nThis is a precompiled, self-contained sheet: theme tokens, a base reset, and exactly the utility classes this library's own components use.\n\n> **Know what you're trading.** This sheet is *closed*. It emits only the subset of theme custom properties its own utilities happen to reference — 9 of 28 as of 0.7.0, and that number moves whenever the library starts or stops referencing a token. So `var(--color-vermillion)` works in your CSS and `var(--color-background)` silently resolves to nothing, with no way to tell which is which short of reading the compiled file. If you need to write your own markup against these tokens, use the other option.\n\n**Yes** → import `./theme.css` *inside* your Tailwind entry and `@source` the package's `dist`, so your build generates the utilities the components reference:\n\n```css\n/* app/globals.css */\n@import \"tailwindcss\";\n@import \"@bessemeralliance/tools-design-system/theme.css\";\n@source \"../node_modules/@bessemeralliance/tools-design-system/dist\";\n```\n\nYou get every token as a real custom property in `:root`, the full utility surface over them, and one source of truth for the values. **Do not also import `./styles`** — you'll ship the base reset twice.\n\n> Two footguns: `@source` is relative to *the CSS file*, not the project root (`../node_modules/…` is right for `app/globals.css`, wrong for `src/app/globals.css`). And in a hoisting monorepo it must point at the hoisted location. Both mistakes produce unstyled components with zero errors — after wiring, grep your built CSS for `bg-vermillion`; if it's absent, `@source` isn't resolving.\n\n### Just want the tokens? Fetch the stylesheets over HTTP\n\nFor a prototype or a sketch where you want the tokens without adding a dependency,\nboth sheets are published alongside the docs at stable URLs:\n\n```css\n@import url(\"https://bessemeralliance.github.io/tools-design-system/css/theme.css\");\n/* or, if you do not run Tailwind: */\n@import url(\"https://bessemeralliance.github.io/tools-design-system/css/styles.css\");\n/* fonts, if you are not using next/font: */\n@import url(\"https://bessemeralliance.github.io/tools-design-system/css/fonts.css\");\n```\n\n**These track `main`, not a release.** They change the moment something merges,\nwith no version to pin and no changelog entry to warn you. Use them to get\nmoving, then switch to the package — which is versioned, tree-shakeable, and\nships the components too.\n\nDo **not** hand-copy rules out of these files into your own stylesheet. A\nrestated `.text-h1` silently stops matching the day the real one changes, and\nnothing will tell you.\n\n### Fonts — required, and silent if you skip it\n\nThe type scale is driven by two custom properties: `--font-body` (Inter) and `--font-heading` (Lexend Semibold). **The package does not load fonts for you.** Wire neither and `.text-h1`/`.text-h2`/`.text-h3` fall back to `system-ui` while body copy falls back to `ui-sans-serif` — no warning, no error state, everything just slightly off.\n\n```tsx\n// app/layout.tsx\nimport type { Metadata } from \"next\";\nimport { Inter, Lexend } from \"next/font/google\";\nimport \"@bessemeralliance/tools-design-system/styles\";\n\nconst inter = Inter({\n  subsets: [\"latin\"],\n  variable: \"--font-body\",\n  display: \"swap\",\n});\n\nconst lexend = Lexend({\n  subsets: [\"latin\"],\n  weight: [\"600\"], // the only cut the heading classes use\n  variable: \"--font-heading\",\n  display: \"swap\",\n});\n\nexport const metadata: Metadata = { title: \"Your app\" };\n\nexport default function RootLayout({\n  children,\n}: Readonly<{ children: React.ReactNode }>) {\n  return (\n    // BOTH variables, on the same wrapping element. Missing one is the most\n    // common setup mistake with this package.\n    <html lang=\"en\" className={`${inter.variable} ${lexend.variable}`}>\n      <body className=\"min-h-screen bg-background text-text antialiased\">\n        {children}\n      </body>\n    </html>\n  );\n}\n```\n\nThe package never calls `next/font` itself — you call it in your own app code. **Do not add `transpilePackages`.**\n\n**Not using Next, or want to defer this?**\n\n```tsx\nimport \"@bessemeralliance/tools-design-system/fonts.css\"; // Inter + Lexend from Google Fonts\nimport \"@bessemeralliance/tools-design-system/styles\";\n```\n\nSlower than `next/font` — a render-blocking third-party stylesheet, no preload, a flash of fallback text, and an origin your CSP must allow. Use it to get unblocked, not as the end state, and never alongside `next/font`.\n\n**Verify:** inspect any `.text-h1` element in DevTools. Computed `font-family` should start with a hashed name (`__Lexend_a1b2c3`) or literal `Lexend`. If it reads `system-ui`, the variables aren't reaching the element.\n\n---\n\n## Usage\n\n```tsx\nimport { Button, Card, CardBody, CardHeader, CardTitle } from \"@bessemeralliance/tools-design-system/components/ui\";\nimport { AppShell, PageBody, PageHeader } from \"@bessemeralliance/tools-design-system/components/layout\";\nimport { colors, radii, typography } from \"@bessemeralliance/tools-design-system/tokens\";\nimport { cn } from \"@bessemeralliance/tools-design-system/cn\";\n\nexport function Example() {\n  return (\n    <Card>\n      <CardHeader>\n        <CardTitle>Utilization</CardTitle>\n      </CardHeader>\n      <CardBody>\n        <Button variant=\"primary\">Run report</Button>\n      </CardBody>\n    </Card>\n  );\n}\n```\n\n### Use `cn` for className overrides\n\nIf you compose `className` on a component from this package, merge with **this** `cn`, not your own:\n\n```tsx\nimport { cn } from \"@bessemeralliance/tools-design-system/cn\";\n\n<Metric className={cn(\"text-[15px]\")} />\n```\n\nThe type scale (`.text-h1`, `.text-display`, …) ships as plain CSS classes, not generated Tailwind utilities, so a stock `twMerge` cannot classify them — it may drop `text-overline` when it sits beside a colour utility it doesn't actually conflict with, or let a component's own `text-display` beat your override. `tailwindMergeConfig` is exported too if you need to extend rather than replace it.\n\n### Exports\n\n| Subpath | Contents | Server-safe? |\n|---|---|---|\n| `.` | Every component, plus ~2,790 `@carbon/icons-react` re-exports | No (`\"use client\"`) |\n| `./components/ui` | The 41 UI primitives + the Carbon icon star | No |\n| `./components/layout` | `AppShell`, `Sidebar`, `PageHeader`, `PageBody`, `PageFooter` | No |\n| `./tokens` | Plain data: `colors`, `radii`, `typography`, `motion` | **Yes** |\n| `./cn` | `cn()` and `tailwindMergeConfig` | **Yes** |\n| `./styles` | Precompiled self-contained CSS | n/a |\n| `./theme.css` | Raw Tailwind 4 `@theme` + typography classes | n/a |\n| `./fonts.css` | Google Fonts `@import` + `:root` font variables | n/a |\n\nImporting from `.` pulls the icon barrel into your module graph for typechecking. In a large app, `./components/ui` plus a direct `@carbon/icons-react` import is faster.\n\nOur component names deliberately shadow the colliding Carbon icons — `Table`, `Menu`, `Tag`, `Badge`, `Switch`, `Checkbox`, `ProgressBar` all resolve to the design system's version.\n\n---\n\n## CI in a consuming app\n\nNothing special. The package is public, so a build just installs it:\n\n```yaml\nsteps:\n  - uses: actions/checkout@v7\n  - uses: actions/setup-node@v7\n    with:\n      node-version: 22\n      cache: npm\n  - run: npm ci\n```\n\nNo token, no `registry-url`, no package access grant, and nothing to rotate. The\nsame is true on Vercel, Netlify, or any other build container.\n\n---\n\n## Upgrading\n\nPin with a caret and commit your lockfile:\n\n```json\n\"@bessemeralliance/tools-design-system\": \"^0.5.0\"\n```\n\nOn a `0.x` package npm's caret allows **patches only** (`>=0.5.0 <0.6.0`), so this gives you automatic fixes and never an automatic feature. The range is the policy; the lockfile is the pin.\n\n> This changes at `1.0.0`, silently. The same `^` then allows minors. Treat the 1.0 bump as a scheduled decision about whether to switch to `~`.\n\nBefore upgrading:\n\n```bash\nnpm view @bessemeralliance/tools-design-system versions\ngh release view v0.6.0 --repo BessemerAlliance/tools-design-system\n```\n\nRelease notes are the hand-written CHANGELOG section, verbatim. **Scan for a `### Breaking` heading** — if it isn't there, there are no breaking changes. Each breaking item carries a mechanical migration instruction.\n\n---\n\n## Contributing\n\nLocal setup, the verification loop, how to add a component, and the release runbook are in **[CONTRIBUTING.md](./CONTRIBUTING.md)**.\n\n## Design direction\n\nA light, dense data-app aesthetic: white surfaces, zinc-neutral borders and text, restrained radius, Inter for body copy, Lexend Semibold for headings, and vermillion for primary actions, focus, and brand emphasis.\n","readmeFilename":"README.md"}