{"_id":"@dupagelabs/ui","_rev":"8-33cafa78023310d7b32542f1352cd4cb","name":"@dupagelabs/ui","dist-tags":{"latest":"0.5.1"},"versions":{"0.1.0":{"name":"@dupagelabs/ui","version":"0.1.0","keywords":["dupagelabs","design-system","tamagui","react-native","expo","react"],"license":"MIT","_id":"@dupagelabs/ui@0.1.0","maintainers":[{"name":"mobinahmed","email":"mobinahmed@gmail.com"}],"homepage":"https://github.com/mobinahmed/dupagelabs-ui#readme","bugs":{"url":"https://github.com/mobinahmed/dupagelabs-ui/issues"},"dist":{"shasum":"676113580699659063eab3b9a9c8413429abe659","tarball":"https://registry.npmjs.org/@dupagelabs/ui/-/ui-0.1.0.tgz","fileCount":79,"integrity":"sha512-ceB5FswjTFPKE+DE2cSiDdDH9SLpimBv5eBXOj8Z/QkEGJB13Xq9UF02QVnIa+H3+se31h9jwsM3WcRaXVYeww==","signatures":[{"sig":"MEUCIHV830jbev5imNoysxuj8FL7FsXtfRT4p+tRqS8P++LpAiEAm9ZCURRVJGqFAtyvCqwywcRfQ8HzI9dF6atwNhvBxSk=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":100859},"main":"dist/cjs/index.js","type":"module","_from":"file:dupagelabs-ui-0.1.0.tgz","types":"types/index.d.ts","module":"dist/esm/index.js","exports":{".":{"types":"./types/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./config":{"types":"./types/config/tamagui.config.d.ts","import":"./dist/esm/config/tamagui.config.js","require":"./dist/cjs/config/tamagui.config.js"},"./package.json":"./package.json"},"scripts":{"dev":"tamagui-build --watch","lint":"tsc --noEmit","build":"tamagui-build","watch":"tamagui-build --watch","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit","build-storybook":"storybook build"},"_npmUser":{"name":"mobinahmed","email":"mobinahmed@gmail.com"},"_resolved":"/private/var/folders/tx/hd4bvkqd2glcmmfx9qhy0wnm0000gn/T/bf8424994a260f4ea290d4c5d53ea4d4/dupagelabs-ui-0.1.0.tgz","_integrity":"sha512-ceB5FswjTFPKE+DE2cSiDdDH9SLpimBv5eBXOj8Z/QkEGJB13Xq9UF02QVnIa+H3+se31h9jwsM3WcRaXVYeww==","module:jsx":"dist/jsx/index.js","repository":{"url":"git+https://github.com/mobinahmed/dupagelabs-ui.git","type":"git"},"_npmVersion":"10.8.2","description":"DuPage Labs universal design system for web and React Native / Expo","directories":{},"sideEffects":["*.css"],"_nodeVersion":"20.20.2","dependencies":{"tamagui":"2.5.1","@tamagui/core":"2.5.1","@tamagui/config":"2.5.1","@tamagui/themes":"2.5.1","@tamagui/font-inter":"2.5.1","@tamagui/shorthands":"2.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^6.3.5","react":"^19.1.0","react-dom":"^19.1.0","storybook":"^8.6.14","typescript":"^5.8.3","@types/react":"^19.1.8","react-native":"^0.79.3","@tamagui/build":"2.5.1","@storybook/test":"^8.6.14","@storybook/react":"^8.6.14","@types/react-dom":"^19.1.6","react-native-web":"^0.20.0","@storybook/blocks":"^8.6.14","@tamagui/vite-plugin":"2.5.1","@vitejs/plugin-react":"^4.5.2","@storybook/react-vite":"^8.6.14","@storybook/addon-links":"^8.6.14","@storybook/addon-essentials":"^8.6.14","@storybook/addon-interactions":"^8.6.14"},"peerDependencies":{"react":">=18","react-dom":">=18","react-native":"*"},"peerDependenciesMeta":{"react-dom":{"optional":true},"react-native":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/ui_0.1.0_1784865028338_0.9331090565710249","host":"s3://npm-registry-packages-npm-production"}},"0.3.0":{"name":"@dupagelabs/ui","version":"0.3.0","keywords":["dupagelabs","design-system","tamagui","react-native","expo","react"],"license":"MIT","_id":"@dupagelabs/ui@0.3.0","maintainers":[{"name":"mobinahmed","email":"mobinahmed@gmail.com"}],"homepage":"https://github.com/mobinahmed/dupagelabs-ui#readme","bugs":{"url":"https://github.com/mobinahmed/dupagelabs-ui/issues"},"dist":{"shasum":"2040b740de36b7cb19677e045d096ca9942ba582","tarball":"https://registry.npmjs.org/@dupagelabs/ui/-/ui-0.3.0.tgz","fileCount":292,"integrity":"sha512-XZNZ3NVerAeizuu/nhI/LVKhdwfbEh5XXcV6ZLBWP6rUd9JdikJuAyI/DRKhcMQR6m83NyKsyBKVMqVziSFpZw==","signatures":[{"sig":"MEUCIDgIVSYugY61WGso8HYv7PskscIdAT5+OHqd7xVgYsiMAiEAqcXN4e2l2R31DE8PUYvg2ElinXGSxIJ+EMaS2qCv0kY=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":546382},"main":"dist/cjs/index.js","type":"module","_from":"file:dupagelabs-ui-0.3.0.tgz","types":"types/index.d.ts","module":"dist/esm/index.js","exports":{".":{"types":"./types/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./config":{"types":"./types/config/tamagui.config.d.ts","import":"./dist/esm/config/tamagui.config.js","require":"./dist/cjs/config/tamagui.config.js"},"./package.json":"./package.json"},"scripts":{"dev":"tamagui-build --watch","lint":"tsc --noEmit","build":"tamagui-build","watch":"tamagui-build --watch","storybook":"storybook dev -p 6006","typecheck":"tsc --noEmit","build-storybook":"storybook build"},"_npmUser":{"name":"mobinahmed","email":"mobinahmed@gmail.com"},"_resolved":"/private/var/folders/tx/hd4bvkqd2glcmmfx9qhy0wnm0000gn/T/a758c332758502ed013f631c4b322c8e/dupagelabs-ui-0.3.0.tgz","_integrity":"sha512-XZNZ3NVerAeizuu/nhI/LVKhdwfbEh5XXcV6ZLBWP6rUd9JdikJuAyI/DRKhcMQR6m83NyKsyBKVMqVziSFpZw==","module:jsx":"dist/jsx/index.js","repository":{"url":"git+https://github.com/mobinahmed/dupagelabs-ui.git","type":"git"},"_npmVersion":"10.8.2","description":"DuPage Labs universal design system for web and React Native / Expo","directories":{},"sideEffects":["*.css"],"_nodeVersion":"20.20.2","dependencies":{"tamagui":"2.5.1","@tamagui/core":"2.5.1","@tamagui/config":"2.5.1","@tamagui/themes":"2.5.1","@tamagui/font-inter":"2.5.1","@tamagui/shorthands":"2.5.1","@tamagui/dismissable":"2.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^6.3.5","react":"^19.1.0","react-dom":"^19.1.0","storybook":"^8.6.14","typescript":"^5.8.3","@types/react":"^19.1.8","react-native":"^0.79.3","@tamagui/build":"2.5.1","@storybook/test":"^8.6.14","@storybook/react":"^8.6.14","@types/react-dom":"^19.1.6","react-native-web":"^0.20.0","@storybook/blocks":"^8.6.14","@tamagui/vite-plugin":"2.5.1","@vitejs/plugin-react":"^4.5.2","@storybook/react-vite":"^8.6.14","@storybook/addon-links":"^8.6.14","@storybook/addon-essentials":"^8.6.14","@storybook/addon-interactions":"^8.6.14"},"peerDependencies":{"react":">=18","react-dom":">=18","react-native":"*"},"peerDependenciesMeta":{"react-dom":{"optional":true},"react-native":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/ui_0.3.0_1784866152304_0.4643229445436843","host":"s3://npm-registry-packages-npm-production"}},"0.3.1":{"name":"@dupagelabs/ui","version":"0.3.1","keywords":["dupagelabs","design-system","tamagui","react-native","expo","react"],"license":"MIT","_id":"@dupagelabs/ui@0.3.1","maintainers":[{"name":"mobinahmed","email":"mobinahmed@gmail.com"}],"homepage":"https://github.com/mobinahmed/dupagelabs-ui#readme","bugs":{"url":"https://github.com/mobinahmed/dupagelabs-ui/issues"},"dist":{"shasum":"eba184f5bb68f439eb9b7f4bc2d92b08a255b824","tarball":"https://registry.npmjs.org/@dupagelabs/ui/-/ui-0.3.1.tgz","fileCount":201,"integrity":"sha512-xCGDteIuCIP3GziPBg+xF0lgn6ezpTYEOj/l3AYHpQeMhQKUFUkTkm9cuLr69EPncwR3RfG3+7tHEn3YQDUyLQ==","signatures":[{"sig":"MEUCICHN27WIOja3m6BlBHc73YlAG9ucgmkmPLzbQ5X/vVYzAiEA0+qR07W13Sx2OnSs+ChakFX44qDfDT8NHUAHPNyUHH0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":300559},"main":"dist/cjs/index.js","type":"module","_from":"file:dupagelabs-ui-0.3.1.tgz","types":"types/index.d.ts","module":"dist/esm/index.js","exports":{".":{"types":"./types/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./config":{"types":"./types/config/tamagui.config.d.ts","import":"./dist/esm/config/tamagui.config.js","require":"./dist/cjs/config/tamagui.config.js"},"./package.json":"./package.json"},"scripts":{"dev":"tamagui-build --watch","lint":"tsc --noEmit","build":"tamagui-build","watch":"tamagui-build --watch","typecheck":"tsc --noEmit"},"_npmUser":{"name":"mobinahmed","email":"mobinahmed@gmail.com"},"_resolved":"/private/var/folders/tx/hd4bvkqd2glcmmfx9qhy0wnm0000gn/T/2ebf9f4dabc6e08f97f0060688ebba15/dupagelabs-ui-0.3.1.tgz","_integrity":"sha512-xCGDteIuCIP3GziPBg+xF0lgn6ezpTYEOj/l3AYHpQeMhQKUFUkTkm9cuLr69EPncwR3RfG3+7tHEn3YQDUyLQ==","module:jsx":"dist/jsx/index.js","repository":{"url":"git+https://github.com/mobinahmed/dupagelabs-ui.git","type":"git"},"_npmVersion":"10.8.2","description":"DuPage Labs universal design system for web and React Native / Expo","directories":{},"sideEffects":["*.css"],"_nodeVersion":"20.20.2","dependencies":{"tamagui":"2.5.1","@tamagui/core":"2.5.1","@tamagui/config":"2.5.1","@tamagui/themes":"2.5.1","@tamagui/font-inter":"2.5.1","@tamagui/shorthands":"2.5.1","@tamagui/dismissable":"2.5.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","typescript":"^5.8.3","@types/react":"^19.1.8","react-native":"0.86.0","@tamagui/build":"2.5.1","@types/react-dom":"^19.1.6"},"peerDependencies":{"react":">=18","react-dom":">=18","react-native":"*"},"peerDependenciesMeta":{"react-dom":{"optional":true},"react-native":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/ui_0.3.1_1784868297077_0.2439489163006905","host":"s3://npm-registry-packages-npm-production"}},"0.3.2":{"name":"@dupagelabs/ui","version":"0.3.2","keywords":["dupagelabs","design-system","tamagui","react-native","expo","react"],"license":"MIT","_id":"@dupagelabs/ui@0.3.2","maintainers":[{"name":"mobinahmed","email":"mobinahmed@gmail.com"}],"homepage":"https://github.com/mobinahmed/dupagelabs-ui#readme","bugs":{"url":"https://github.com/mobinahmed/dupagelabs-ui/issues"},"dist":{"shasum":"e821ee4b80ad20a4dbf73f61172a8b14be74a537","tarball":"https://registry.npmjs.org/@dupagelabs/ui/-/ui-0.3.2.tgz","fileCount":202,"integrity":"sha512-COsSirrweE/Xo9f0n0qiYzBrr5+NhovCIaAiGpMMUrUMLvFTxxdwt8Bv9GcUP0YBH9BwThVdmQSwuO0X7JnaSQ==","signatures":[{"sig":"MEQCIGWZeVt8aVsL70BCqwadaqRlhuXnS7n2CpV3XZTtGSnvAiBy7rrjgqEhRbeK/YaYkJSrD8lP2ukTMao4ed7IsdBFMA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":314185},"main":"dist/cjs/index.js","type":"module","_from":"file:dupagelabs-ui-0.3.2.tgz","types":"types/index.d.ts","module":"dist/esm/index.js","exports":{".":{"types":"./types/index.d.ts","import":"./dist/esm/index.js","default":"./dist/esm/index.js","require":"./dist/cjs/index.js","react-native":"./dist/esm/index.native.js"},"./config":{"types":"./types/config/tamagui.config.d.ts","import":"./dist/esm/config/tamagui.config.js","default":"./dist/esm/config/tamagui.config.js","require":"./dist/cjs/config/tamagui.config.js","react-native":"./dist/esm/config/tamagui.config.native.js"},"./package.json":"./package.json"},"scripts":{"dev":"tamagui-build --watch","lint":"tsc --noEmit","build":"tamagui-build","watch":"tamagui-build --watch","typecheck":"tsc --noEmit"},"_npmUser":{"name":"mobinahmed","email":"mobinahmed@gmail.com"},"_resolved":"/private/var/folders/tx/hd4bvkqd2glcmmfx9qhy0wnm0000gn/T/7755550810af633a6b5a2c06ba4eb8e1/dupagelabs-ui-0.3.2.tgz","_integrity":"sha512-COsSirrweE/Xo9f0n0qiYzBrr5+NhovCIaAiGpMMUrUMLvFTxxdwt8Bv9GcUP0YBH9BwThVdmQSwuO0X7JnaSQ==","module:jsx":"dist/jsx/index.js","repository":{"url":"git+https://github.com/mobinahmed/dupagelabs-ui.git","type":"git"},"_npmVersion":"10.8.2","description":"DuPage Labs universal design system for web and React Native / Expo","directories":{},"sideEffects":["*.css"],"_nodeVersion":"20.20.2","dependencies":{"tamagui":"2.5.1","@tamagui/core":"2.5.1","@tamagui/config":"2.5.1","@tamagui/themes":"2.5.1","@tamagui/font-inter":"2.5.1","@tamagui/shorthands":"2.5.1","@tamagui/dismissable":"2.5.1"},"react-native":"dist/esm/index.native.js","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","typescript":"^5.8.3","@types/react":"^19.1.8","react-native":"0.86.0","@tamagui/build":"2.5.1","@types/react-dom":"^19.1.6"},"peerDependencies":{"react":">=18","react-dom":">=18","react-native":"*"},"peerDependenciesMeta":{"react-dom":{"optional":true},"react-native":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/ui_0.3.2_1785518150822_0.3711589720975299","host":"s3://npm-registry-packages-npm-production"}},"0.4.0":{"name":"@dupagelabs/ui","version":"0.4.0","keywords":["dupagelabs","design-system","ui-kit","ui-library","react","react-native","expo","nextjs","white-label","multi-brand","cross-platform","components"],"license":"MIT","_id":"@dupagelabs/ui@0.4.0","maintainers":[{"name":"mobinahmed","email":"mobinahmed@gmail.com"}],"homepage":"https://github.com/mobinahmed/dupagelabs-ui/tree/master/apps/docs#readme","bugs":{"url":"https://github.com/mobinahmed/dupagelabs-ui/issues"},"dist":{"shasum":"ffa318e3457b7170a5e45da44e1c9164eb11bafd","tarball":"https://registry.npmjs.org/@dupagelabs/ui/-/ui-0.4.0.tgz","fileCount":217,"integrity":"sha512-CxnRtg3suQ8RHpX5UfCFTfsgbmyN5vOtv/9nfdbHLzI9J+m+n7xiBvvuXnXLYYsrCs6dtCTJ1vmSHICY2tAV+w==","signatures":[{"sig":"MEUCICLoDIoC+r3hZ6EMhFwUslYPuj5nWrZnl3sz5ZN58KVgAiEAx7z8KhvJNCSgEUYgzyM4oBfGvjSYqXaP0OYnuGJPmd4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":322290},"main":"dist/cjs/index.js","type":"module","types":"types/index.d.ts","module":"dist/esm/index.js","exports":{".":{"types":"./types/index.d.ts","import":"./dist/esm/index.js","default":"./dist/esm/index.js","require":"./dist/cjs/index.js","react-native":"./dist/esm/index.native.js"},"./config":{"types":"./types/config/tamagui.config.d.ts","import":"./dist/esm/config/tamagui.config.js","default":"./dist/esm/config/tamagui.config.js","require":"./dist/cjs/config/tamagui.config.js","react-native":"./dist/esm/config/tamagui.config.native.js"},"./package.json":"./package.json"},"gitHead":"5bde59b81e03473580cd0be154f1b24d5575371b","scripts":{"dev":"tamagui-build --watch","lint":"tsc --noEmit","build":"tamagui-build","watch":"tamagui-build --watch","typecheck":"tsc --noEmit"},"_npmUser":{"name":"mobinahmed","email":"mobinahmed@gmail.com"},"module:jsx":"dist/jsx/index.js","repository":{"url":"git+https://github.com/mobinahmed/dupagelabs-ui.git","type":"git"},"_npmVersion":"10.8.2","description":"DuPage Labs universal UI for React, Next.js, and Expo — shared components and white-label themes for web + React Native","directories":{},"sideEffects":["*.css"],"_nodeVersion":"20.20.2","dependencies":{"tamagui":"2.5.1","@tamagui/core":"2.5.1","@tamagui/config":"2.5.1","@tamagui/themes":"2.5.1","@tamagui/font-inter":"2.5.1","@tamagui/shorthands":"2.5.1","@tamagui/dismissable":"2.5.1"},"react-native":"dist/esm/index.native.js","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","typescript":"^5.8.3","@types/react":"^19.1.8","react-native":"0.86.0","@tamagui/build":"2.5.1","@types/react-dom":"^19.1.6"},"peerDependencies":{"react":">=18","react-dom":">=18","react-native":"*"},"peerDependenciesMeta":{"react-dom":{"optional":true},"react-native":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/ui_0.4.0_1786262285049_0.8960475865569557","host":"s3://npm-registry-packages-npm-production"}},"0.4.1":{"name":"@dupagelabs/ui","version":"0.4.1","keywords":["dupagelabs","design-system","ui-kit","ui-library","react","react-native","expo","nextjs","white-label","multi-brand","cross-platform","components"],"license":"MIT","_id":"@dupagelabs/ui@0.4.1","maintainers":[{"name":"mobinahmed","email":"mobinahmed@gmail.com"}],"homepage":"https://github.com/mobinahmed/dupagelabs-ui#readme","bugs":{"url":"https://github.com/mobinahmed/dupagelabs-ui/issues"},"dist":{"shasum":"497e695b61e5ece46d57307d84bc158469bb7538","tarball":"https://registry.npmjs.org/@dupagelabs/ui/-/ui-0.4.1.tgz","fileCount":217,"integrity":"sha512-uYJ8ha8jVRl4/sW02U5y5lPsRQu60E64gYyFZnFj+V6l/0jnlrwiFo5qoBqBLVz8ettJ8J0maOl9xTxauuee4Q==","signatures":[{"sig":"MEQCIAZecA+HtU9xYNOSpE8wnCdGBqoJgwJKr1dNFjLYy+dGAiBHMFbdkUYu/vZKk47k+JEQO+ChfCTWB/njqx8mko8qFQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":322279},"main":"dist/cjs/index.js","type":"module","types":"types/index.d.ts","module":"dist/esm/index.js","exports":{".":{"types":"./types/index.d.ts","import":"./dist/esm/index.js","default":"./dist/esm/index.js","require":"./dist/cjs/index.js","react-native":"./dist/esm/index.native.js"},"./config":{"types":"./types/config/tamagui.config.d.ts","import":"./dist/esm/config/tamagui.config.js","default":"./dist/esm/config/tamagui.config.js","require":"./dist/cjs/config/tamagui.config.js","react-native":"./dist/esm/config/tamagui.config.native.js"},"./package.json":"./package.json"},"gitHead":"9d7e1ae43851e96c4eca8eb0e0ede07a1235c575","scripts":{"dev":"tamagui-build --watch","lint":"tsc --noEmit","build":"tamagui-build","watch":"tamagui-build --watch","typecheck":"tsc --noEmit"},"_npmUser":{"name":"mobinahmed","email":"mobinahmed@gmail.com"},"module:jsx":"dist/jsx/index.js","repository":{"url":"git+https://github.com/mobinahmed/dupagelabs-ui.git","type":"git"},"_npmVersion":"10.8.2","description":"DuPage Labs universal UI for React, Next.js, and Expo — shared components and white-label themes for web + React Native","directories":{},"sideEffects":["*.css"],"_nodeVersion":"20.20.2","dependencies":{"tamagui":"2.5.1","@tamagui/core":"2.5.1","@tamagui/config":"2.5.1","@tamagui/themes":"2.5.1","@tamagui/font-inter":"2.5.1","@tamagui/shorthands":"2.5.1","@tamagui/dismissable":"2.5.1"},"react-native":"dist/esm/index.native.js","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","typescript":"^5.8.3","@types/react":"^19.1.8","react-native":"0.86.0","@tamagui/build":"2.5.1","@types/react-dom":"^19.1.6"},"peerDependencies":{"react":">=18","react-dom":">=18","react-native":"*"},"peerDependenciesMeta":{"react-dom":{"optional":true},"react-native":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/ui_0.4.1_1786264063308_0.024243945481014828","host":"s3://npm-registry-packages-npm-production"}},"0.5.0":{"name":"@dupagelabs/ui","version":"0.5.0","keywords":["dupagelabs","design-system","ui-kit","ui-library","react","react-native","expo","nextjs","white-label","multi-brand","cross-platform","components"],"license":"MIT","_id":"@dupagelabs/ui@0.5.0","maintainers":[{"name":"mobinahmed","email":"mobinahmed@gmail.com"}],"homepage":"https://github.com/mobinahmed/dupagelabs-ui#readme","bugs":{"url":"https://github.com/mobinahmed/dupagelabs-ui/issues"},"dist":{"shasum":"8c88cd65bb2a908de72276de43dae3229c7d2512","tarball":"https://registry.npmjs.org/@dupagelabs/ui/-/ui-0.5.0.tgz","fileCount":232,"integrity":"sha512-zc072evCMdsAPfOqbHH7QID188v+vp2QgbtyaAFiWYhKAniRlhZQyRFagxU2PV9GD1rnfAtVAkFoK7OlXMWb9g==","signatures":[{"sig":"MEUCIQD950t/UW0oYYfcSRfvZYd1kVdrK1kICPWAPki08FqK/gIgJvVgTTCF9CFUf4Eo2P70OHsG3ItRI1YTzf5ss35x8G0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":382662},"main":"dist/cjs/index.js","type":"module","types":"types/index.d.ts","module":"dist/esm/index.js","exports":{".":{"types":"./types/index.d.ts","import":"./dist/esm/index.js","default":"./dist/esm/index.js","require":"./dist/cjs/index.js","react-native":"./dist/esm/index.native.js"},"./config":{"types":"./types/config/tamagui.config.d.ts","import":"./dist/esm/config/tamagui.config.js","default":"./dist/esm/config/tamagui.config.js","require":"./dist/cjs/config/tamagui.config.js","react-native":"./dist/esm/config/tamagui.config.native.js"},"./package.json":"./package.json"},"gitHead":"117a6abd3035657a1b9af50c8373f76b67b55df2","scripts":{"dev":"tamagui-build --watch","lint":"tsc --noEmit","build":"tamagui-build","watch":"tamagui-build --watch","typecheck":"tsc --noEmit"},"_npmUser":{"name":"mobinahmed","email":"mobinahmed@gmail.com"},"module:jsx":"dist/jsx/index.js","repository":{"url":"git+https://github.com/mobinahmed/dupagelabs-ui.git","type":"git"},"_npmVersion":"10.9.8","description":"DuPage Labs universal UI for React, Next.js, and Expo — shared components and white-label themes for web + React Native","directories":{},"sideEffects":["*.css"],"_nodeVersion":"22.23.2","dependencies":{"tamagui":"2.5.1","@tamagui/core":"2.5.1","@tamagui/config":"2.5.1","@tamagui/themes":"2.5.1","@tamagui/font-inter":"2.5.1","@tamagui/shorthands":"2.5.1","@tamagui/dismissable":"2.5.1"},"react-native":"dist/esm/index.native.js","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^19.1.0","react-dom":"^19.1.0","typescript":"^5.8.3","@types/react":"^19.1.8","react-native":"0.86.0","@tamagui/build":"2.5.1","@types/react-dom":"^19.1.6"},"peerDependencies":{"react":">=18","react-dom":">=18","react-native":"*"},"peerDependenciesMeta":{"react-dom":{"optional":true},"react-native":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/ui_0.5.0_1787439045309_0.7436513517988927","host":"s3://npm-registry-packages-npm-production"}},"0.5.1":{"name":"@dupagelabs/ui","version":"0.5.1","description":"DuPage Labs universal UI for React, Next.js, and Expo — shared components and white-label themes for web + React Native","license":"MIT","type":"module","main":"dist/cjs/index.js","module":"dist/esm/index.js","react-native":"dist/esm/index.native.js","types":"types/index.d.ts","module:jsx":"dist/jsx/index.js","exports":{".":{"react-native":"./dist/esm/index.native.js","types":"./types/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js","default":"./dist/esm/index.js"},"./config":{"react-native":"./dist/esm/config/tamagui.config.native.js","types":"./types/config/tamagui.config.d.ts","import":"./dist/esm/config/tamagui.config.js","require":"./dist/cjs/config/tamagui.config.js","default":"./dist/esm/config/tamagui.config.js"},"./package.json":"./package.json"},"publishConfig":{"access":"public"},"sideEffects":["*.css"],"peerDependencies":{"react":">=18","react-dom":">=18","react-native":"*"},"peerDependenciesMeta":{"react-dom":{"optional":true},"react-native":{"optional":true}},"dependencies":{"@tamagui/config":"2.5.1","@tamagui/core":"2.5.1","@tamagui/dismissable":"2.5.1","@tamagui/font-inter":"2.5.1","@tamagui/shorthands":"2.5.1","@tamagui/themes":"2.5.1","tamagui":"2.5.1"},"devDependencies":{"@tamagui/build":"2.5.1","@types/react":"^19.1.8","@types/react-dom":"^19.1.6","react":"^19.1.0","react-dom":"^19.1.0","react-native":"0.86.0","typescript":"^5.8.3"},"keywords":["dupagelabs","design-system","ui-kit","ui-library","react","react-native","expo","nextjs","white-label","multi-brand","cross-platform","components"],"repository":{"type":"git","url":"git+https://github.com/mobinahmed/dupagelabs-ui.git"},"bugs":{"url":"https://github.com/mobinahmed/dupagelabs-ui/issues"},"homepage":"https://ui.dupagelabs.com","scripts":{"build":"tamagui-build","watch":"tamagui-build --watch","dev":"tamagui-build --watch","typecheck":"tsc --noEmit","lint":"tsc --noEmit"},"_id":"@dupagelabs/ui@0.5.1","_integrity":"sha512-sXfimzgjP5H3lTEZXKpQvU4E1jWJvDWO/lH79wp00a4Q2nQKI6ND07+9pSl4kmgrqJDmH601OF69UuVMKonr3A==","_resolved":"/private/var/folders/tx/hd4bvkqd2glcmmfx9qhy0wnm0000gn/T/c96287dc8d60084a1cbfff895b0537ba/dupagelabs-ui-0.5.1.tgz","_from":"file:dupagelabs-ui-0.5.1.tgz","_nodeVersion":"20.20.2","_npmVersion":"10.8.2","dist":{"integrity":"sha512-sXfimzgjP5H3lTEZXKpQvU4E1jWJvDWO/lH79wp00a4Q2nQKI6ND07+9pSl4kmgrqJDmH601OF69UuVMKonr3A==","shasum":"c67459ff2ace623b3101f8d4cedff34708a871f9","tarball":"https://registry.npmjs.org/@dupagelabs/ui/-/ui-0.5.1.tgz","fileCount":547,"unpackedSize":1342971,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDnOiI2Ia4sHDGlhSSfPWspiGTDuoJfXyqyyxUthZOZPwIgWTMQRLNb212hkaII67msm5+fMyWfSdTwF5ncajdWhn4="}]},"_npmUser":{"name":"mobinahmed","email":"mobinahmed@gmail.com"},"directories":{},"maintainers":[{"name":"mobinahmed","email":"mobinahmed@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ui_0.5.1_1787477843933_0.06773407458922565"},"_hasShrinkwrap":false}},"time":{"created":"2026-07-24T03:50:28.174Z","modified":"2026-08-23T09:37:24.235Z","0.1.0":"2026-07-24T03:50:28.475Z","0.3.0":"2026-07-24T04:09:12.464Z","0.3.1":"2026-07-24T04:44:57.220Z","0.3.2":"2026-07-31T17:15:50.964Z","0.4.0":"2026-08-09T07:58:05.213Z","0.4.1":"2026-08-09T08:27:43.463Z","0.5.0":"2026-08-22T22:50:45.449Z","0.5.1":"2026-08-23T09:37:24.086Z"},"bugs":{"url":"https://github.com/mobinahmed/dupagelabs-ui/issues"},"license":"MIT","homepage":"https://ui.dupagelabs.com","keywords":["dupagelabs","design-system","ui-kit","ui-library","react","react-native","expo","nextjs","white-label","multi-brand","cross-platform","components"],"repository":{"type":"git","url":"git+https://github.com/mobinahmed/dupagelabs-ui.git"},"description":"DuPage Labs universal UI for React, Next.js, and Expo — shared components and white-label themes for web + React Native","maintainers":[{"name":"mobinahmed","email":"mobinahmed@gmail.com"}],"readme":"<div align=\"center\">\n\n# @dupagelabs/ui\n\n**DuPage Labs UI — one component library for web and mobile.**\n\nShip the same buttons, forms, and overlays to Next.js and Expo. Swap client brands with `createConfig` — no forked components, no parallel design systems.\n\n**See the live UI:** [ui.dupagelabs.com](https://ui.dupagelabs.com)\n\n[![live ui](https://img.shields.io/badge/Live_UI-ui.dupagelabs.com-2563eb)](https://ui.dupagelabs.com)\n[![npm version](https://img.shields.io/npm/v/%40dupagelabs%2Fui?color=2563eb&label=npm)](https://www.npmjs.com/package/@dupagelabs/ui)\n[![downloads](https://img.shields.io/npm/dw/%40dupagelabs%2Fui?color=2563eb)](https://www.npmjs.com/package/@dupagelabs/ui)\n[![types](https://img.shields.io/npm/types/%40dupagelabs%2Fui?color=2563eb)](https://www.npmjs.com/package/@dupagelabs/ui)\n[![license](https://img.shields.io/npm/l/%40dupagelabs%2Fui?color=2563eb)](./LICENSE)\n\n</div>\n\n---\n\n```tsx\nimport { DupageUIProvider, Button, Text, config } from '@dupagelabs/ui'\n\n<DupageUIProvider config={config} defaultTheme=\"light\">\n  <Text size=\"2xl\" weight=\"bold\">Ship faster</Text>\n  <Button variant=\"primary\">Get started</Button>\n</DupageUIProvider>\n```\n\nThat exact code runs unchanged on **web, iOS, and Android**.\n\n## Why this package\n\n| | |\n|---|---|\n| **Truly universal** | One import path for React DOM and React Native. No `.web.tsx` / `.native.tsx` forks, no parallel component libraries to keep in sync. |\n| **White-label in one line** | `createConfig({ brand: 'acme' })` re-themes every component. Ship the same product to multiple clients without forking a single file. |\n| **Typed variants, not class soup** | `<Button variant=\"danger\" size=\"lg\" />` — autocompleted, type-checked, impossible to typo. |\n| **Tokens all the way down** | Components read `$brand`, `$background`, `$color`. Change a token, the whole system moves together. |\n| **Light and dark, free** | Both themes ship with the package. Flip `defaultTheme` and you're done. |\n| **Your public API** | Engineers depend on `@dupagelabs/ui` — tokens, themes, and components we own and version. |\n\n## Install\n\n```bash\nnpm i @dupagelabs/ui\n# pnpm add @dupagelabs/ui  •  yarn add @dupagelabs/ui\n```\n\n## Quick start\n\nWrap your app once, then use components anywhere.\n\n```tsx\nimport { DupageUIProvider, YStack, Text, Button, config } from '@dupagelabs/ui'\n\nexport default function App() {\n  return (\n    <DupageUIProvider config={config} defaultTheme=\"light\">\n      <YStack padding=\"$4\" gap=\"$3\" backgroundColor=\"$background\">\n        <Text size=\"2xl\" weight=\"bold\">\n          Welcome\n        </Text>\n        <Text tone=\"muted\">Same components on web and mobile.</Text>\n        <Button onPress={() => console.log('pressed')}>Continue</Button>\n      </YStack>\n    </DupageUIProvider>\n  )\n}\n```\n\n`defaultTheme` takes `\"light\"` or `\"dark\"`. That's the whole setup.\n\n## The white-label superpower\n\nMost design systems make you fork components to serve a second client. This one makes you change one line.\n\n```tsx\nimport { createConfig, DupageUIProvider, Button } from '@dupagelabs/ui'\n\n// Built-in presets: 'dupagelabs' | 'northshore' | 'ember'\nconst config = createConfig({ brand: 'northshore' })\n\n// Or bring your own client brand\nconst acmeConfig = createConfig({\n  brand: {\n    id: 'acme',\n    label: 'Acme',\n    brand: {\n      brand: '#7c3aed',\n      brandHover: '#6d28d9',\n      brandPress: '#5b21b6',\n      brandContrast: '#ffffff',\n    },\n    // Optional: override surfaces too (defaults keep DuPage neutrals)\n    light: { background: '#fdfcff' },\n    dark: { background: '#161122' },\n  },\n})\n\n<DupageUIProvider config={acmeConfig} defaultTheme=\"light\">\n  <Button>Continue</Button>\n</DupageUIProvider>\n```\n\nEvery button, input, card, and dialog re-themes instantly. **No component code changes. No forks. No drift.**\n\nSwitching brands at runtime (client picker, tenant switch) works too — memoize the config and remount the provider with a `key`:\n\n```tsx\nconst config = useMemo(() => createConfig({ brand: brandId }), [brandId])\n\n<DupageUIProvider key={brandId} config={config} defaultTheme=\"light\">\n  {children}\n</DupageUIProvider>\n```\n\n## Components\n\n### Button\n\n```tsx\n<Button variant=\"primary\" size=\"md\">Save</Button>\n<Button variant=\"secondary\">Cancel</Button>\n<Button variant=\"ghost\">Learn more</Button>\n<Button variant=\"danger\" onPress={remove}>Delete</Button>\n<Button disabled>Unavailable</Button>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `variant` | `primary` `secondary` `ghost` `danger` | `primary` |\n| `size` | `sm` `md` `lg` | `md` |\n\nUse `onPress` — it works on web and native. Layout props work too: `<Button flex={1} marginTop=\"$2\" />`.\n\n### Checkbox\n\n```tsx\n<Checkbox label=\"Email me updates\" defaultChecked />\n<Checkbox\n  label=\"Accept terms\"\n  description=\"Required to continue.\"\n  invalid\n  onCheckedChange={setAccepted}\n/>\n<Checkbox checked=\"indeterminate\" label=\"Select all\" onCheckedChange={setAll} />\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `checked` | `boolean` \\| `'indeterminate'` | uncontrolled |\n| `size` | `sm` `md` | `md` |\n| `label` / `description` | string | — |\n| `invalid` / `disabled` | boolean | `false` |\n\nUse `onCheckedChange` (or `onChange`) — indeterminate always activates to `true`.\n\n### Switch\n\n```tsx\n<Switch label=\"Email notifications\" defaultChecked />\n<Switch\n  label=\"Marketing\"\n  description=\"Occasional product updates.\"\n  onCheckedChange={setMarketing}\n/>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `checked` | `boolean` | uncontrolled |\n| `size` | `sm` `md` | `md` |\n| `label` / `description` | string | — |\n| `invalid` / `disabled` | boolean | `false` |\n\nUse `onCheckedChange` (or `onChange`).\n\n### Radio / RadioGroup\n\n```tsx\n<RadioGroup defaultValue=\"weekly\" onValueChange={setFrequency} label=\"Digest\">\n  <Radio value=\"daily\" label=\"Daily\" />\n  <Radio value=\"weekly\" label=\"Weekly\" description=\"Recommended.\" />\n  <Radio value=\"off\" label=\"Off\" />\n</RadioGroup>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `RadioGroup.value` | `string` | uncontrolled |\n| `RadioGroup.size` | `sm` `md` | `md` |\n| `Radio.value` | `string` | required |\n| `label` / `description` | string | — |\n| `invalid` / `disabled` | boolean | `false` |\n\n`Radio` must be inside `RadioGroup`.\n\n### Text\n\n```tsx\n<Text size=\"2xl\" weight=\"bold\">Heading</Text>\n<Text tone=\"muted\">Supporting copy</Text>\n<Text tone=\"brand\" weight=\"semibold\">Accent</Text>\n<Text tone=\"danger\">Something went wrong</Text>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `size` | `xs` `sm` `md` `lg` `xl` `2xl` | `md` |\n| `tone` | `default` `muted` `brand` `danger` `inverse` | `default` |\n| `weight` | `regular` `medium` `semibold` `bold` | `regular` |\n\n### Input\n\n```tsx\n<Input placeholder=\"you@example.com\" value={email} onChangeText={setEmail} />\n<Input tone=\"error\" placeholder=\"Invalid email\" />\n<Input size=\"lg\" secureTextEntry placeholder=\"Password\" />\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `size` | `sm` `md` `lg` | `md` |\n| `tone` | `default` `error` | `default` |\n\n`onChangeText` gives you the value directly on both platforms.\n\n### TextArea\n\n```tsx\n<TextArea placeholder=\"Add a note…\" value={notes} onChangeText={setNotes} />\n<TextArea tone=\"error\" placeholder=\"Required\" />\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `size` | `sm` `md` `lg` | `md` |\n| `tone` | `default` `error` | `default` |\n\nSame `onChangeText` contract as `Input`.\n\n### Alert\n\n```tsx\n<Alert tone=\"success\" title=\"Saved\" description=\"Your tokens are live.\" />\n<Alert tone=\"danger\" title=\"Could not save\" description=\"Try again.\" />\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `tone` | `info` `success` `warning` `danger` | `info` |\n| `title` | string | required |\n| `description` | string | — |\n\n### Badge\n\n```tsx\n<Badge tone=\"brand\">New</Badge>\n<Badge tone=\"danger\" size=\"sm\">3</Badge>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `tone` | `default` `brand` `success` `warning` `danger` | `default` |\n| `size` | `sm` `md` | `md` |\n\nStatic status only. Use `Chip` when the user can toggle or dismiss.\n\n### Chip\n\n```tsx\n<Chip selected={on} onPress={() => setOn(!on)}>Web</Chip>\n<Chip onDismiss={() => remove(id)}>Expo</Chip>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `selected` / `disabled` | boolean | `false` |\n| `size` | `sm` `md` | `md` |\n\n### Tooltip\n\n```tsx\n<Tooltip content=\"Saves to every surface\">\n  <Button size=\"sm\">Hover or press</Button>\n</Tooltip>\n```\n\n### Divider\n\n```tsx\n<Divider />\n<Divider label=\"or\" />\n<Divider orientation=\"vertical\" />\n```\n\n### Avatar\n\n```tsx\n<Avatar name=\"Ada Lovelace\" size=\"md\" />\n<Avatar src=\"https://example.com/ada.jpg\" name=\"Ada Lovelace\" />\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `size` | `sm` `md` `lg` | `md` |\n| `name` / `src` | string | — |\n\n### Tabs\n\n```tsx\n<Tabs value={tab} onValueChange={setTab}>\n  <Tabs.List>\n    <Tabs.Tab value=\"web\">Web</Tabs.Tab>\n    <Tabs.Tab value=\"mobile\">Mobile</Tabs.Tab>\n  </Tabs.List>\n  <Tabs.Panel value=\"web\">Web preview</Tabs.Panel>\n  <Tabs.Panel value=\"mobile\">Mobile preview</Tabs.Panel>\n</Tabs>\n```\n\n### Dropdown\n\n```tsx\n<Dropdown\n  label=\"Region\"\n  value={region}\n  onValueChange={setRegion}\n  options={[\n    { value: 'us', label: 'United States' },\n    { value: 'ca', label: 'Canada' },\n  ]}\n/>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `value` | `string` | uncontrolled |\n| `size` | `sm` `md` `lg` | `md` |\n| `placeholder` / `label` | string | `Select…` / — |\n| `invalid` / `disabled` | boolean | `false` |\n\n### Dropdown Menu\n\n```tsx\n<DropdownMenu\n  items={[\n    { label: 'Edit', onPress: onEdit },\n    { label: 'Delete', onPress: onDelete, danger: true },\n  ]}\n>\n  <Button size=\"sm\" variant=\"secondary\">Actions</Button>\n</DropdownMenu>\n```\n\nA string child renders a Button. Item flags: `disabled`, `danger`.\n\n### Search Field\n\n```tsx\n<SearchField value={query} onChangeText={setQuery} placeholder=\"Search brands\" />\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `value` | `string` | uncontrolled |\n| `size` | `sm` `md` `lg` | `md` |\n| `placeholder` | string | `Search` |\n\nClear (×) appears when the field has a value.\n\n### Pagination\n\n```tsx\n<Pagination page={page} pageCount={12} onPageChange={setPage} />\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `page` / `pageCount` | number | required |\n| `siblingCount` | number | `1` |\n| `disabled` | boolean | `false` |\n\n### Progress Tracker\n\n```tsx\n<ProgressTracker\n  steps={['Brand', 'Tokens', 'Preview']}\n  current={1}\n  onStepPress={setStep}\n/>\n```\n\n`current` is zero-based. Steps may be strings or `{ label, description }`.\n\n### Breadcrumb\n\n```tsx\n<Breadcrumb\n  items={[\n    { label: 'Gallery', onPress: goHome },\n    { label: 'Components', onPress: goComponents },\n    { label: 'Button' },\n  ]}\n/>\n```\n\nThe last item is the current page. Use `onPress` — the package does not wrap Next `Link`.\n\n### Accordion\n\n```tsx\n<Accordion type=\"single\" value={open} onValueChange={setOpen}>\n  <Accordion.Item value=\"billing\">\n    <Accordion.Trigger>How does billing work?</Accordion.Trigger>\n    <Accordion.Panel>\n      <Text>Signup lives on ui.dupagelabs.com.</Text>\n    </Accordion.Panel>\n  </Accordion.Item>\n</Accordion>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `type` | `single` `multiple` | `single` |\n| `value` | `string[]` | uncontrolled |\n\n`type=\"single\"` keeps at most one item open. Item `disabled` blocks the trigger.\n\n### File Upload\n\n```tsx\n<FileUpload\n  label=\"Upload brand files\"\n  accept=\".json,.css\"\n  files={files}\n  onFilesChange={setFiles}\n  onPick={openNativePicker}\n/>\n```\n\nWeb opens the OS file dialog. Native calls `onPick` so the app can use Expo DocumentPicker — this package does not add that dependency.\n\n### Date & Time Picker\n\n```tsx\n<DateTimePicker\n  label=\"Publish at\"\n  value={when}\n  onValueChange={setWhen}\n  granularity=\"datetime\"\n/>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `granularity` | `date` `datetime` | `datetime` |\n| `minDate` / `maxDate` | `Date` | — |\n\nCalendar grid plus hour/minute steppers. No `<input type=\"datetime-local\">` and no extra native picker package.\n\n### Data Table\n\n```tsx\n<DataTable\n  columns={[\n    { key: 'brand', header: 'Brand', sortable: true },\n    { key: 'price', header: 'Price', align: 'right', sortable: true },\n  ]}\n  rows={[{ brand: 'DuPage Labs', price: 19.99 }]}\n  onRowPress={setSelected}\n/>\n```\n\nClick a sortable header to cycle ascending → descending → off.\n\n### Empty State\n\n```tsx\n<EmptyState title=\"No brands yet\" description=\"Create a company design system.\">\n  <Button size=\"sm\">Add brand</Button>\n</EmptyState>\n```\n\n### Card\n\n```tsx\n<Card variant=\"outlined\" pad=\"md\">\n  <Text weight=\"semibold\">Project</Text>\n  <Text tone=\"muted\">Grouped content on a surface.</Text>\n</Card>\n```\n\n| Prop | Values | Default |\n|------|--------|---------|\n| `variant` | `elevated` `outlined` `filled` | `outlined` |\n| `pad` | `none` `sm` `md` `lg` | `md` |\n\nSpacing is `pad` rather than `padding`, so you can still pass one-off `padding` overrides when needed.\n\n### Dialog (also exported as `Modal`)\n\nCentered modal, composable parts, animated in and out.\n\n```tsx\nimport { useState } from 'react'\nimport { Dialog, Button, XStack } from '@dupagelabs/ui'\n\nfunction ConfirmDialog() {\n  const [open, setOpen] = useState(false)\n\n  return (\n    <Dialog.Root modal open={open} onOpenChange={setOpen}>\n      <Dialog.Trigger asChild>\n        <Button>Delete account</Button>\n      </Dialog.Trigger>\n      <Dialog.Portal>\n        <Dialog.Overlay key=\"overlay\" />\n        <Dialog.Content key=\"content\">\n          <Dialog.Title>Are you sure?</Dialog.Title>\n          <Dialog.Description>This cannot be undone.</Dialog.Description>\n          <XStack gap=\"$3\" justifyContent=\"flex-end\">\n            <Dialog.Close asChild>\n              <Button variant=\"ghost\">Cancel</Button>\n            </Dialog.Close>\n            <Dialog.Close asChild>\n              <Button variant=\"danger\">Delete</Button>\n            </Dialog.Close>\n          </XStack>\n        </Dialog.Content>\n      </Dialog.Portal>\n    </Dialog.Root>\n  )\n}\n```\n\nParts: `Dialog.Root` `Dialog.Trigger` `Dialog.Portal` `Dialog.Overlay` `Dialog.Content` `Dialog.Title` `Dialog.Description` `Dialog.Close`\n\n`Modal` is the same object under a friendlier name for app code.\n\n### Sheet\n\nNative-feeling bottom sheet with snap points and drag-to-dismiss.\n\n```tsx\nimport { useState } from 'react'\nimport { Sheet, Button, Text } from '@dupagelabs/ui'\n\nfunction ActionsSheet() {\n  const [open, setOpen] = useState(false)\n\n  return (\n    <>\n      <Button onPress={() => setOpen(true)}>Open actions</Button>\n      <Sheet.Root\n        modal\n        open={open}\n        onOpenChange={setOpen}\n        snapPoints={[40]}\n        dismissOnSnapToBottom\n        position={0}\n      >\n        <Sheet.Overlay />\n        <Sheet.Frame>\n          <Sheet.Handle />\n          <Text weight=\"semibold\" size=\"lg\">\n            Actions\n          </Text>\n          <Button variant=\"secondary\" onPress={() => setOpen(false)}>\n            Close\n          </Button>\n        </Sheet.Frame>\n      </Sheet.Root>\n    </>\n  )\n}\n```\n\nParts: `Sheet.Root` `Sheet.Overlay` `Sheet.Frame` `Sheet.Handle` `Sheet.ScrollView`\n\nOn React Native, install `react-native-reanimated`, `react-native-gesture-handler`, and `react-native-safe-area-context` in your app.\n\n### Layout primitives, included\n\nCommon layout and feedback primitives ship with the package:\n\n`DupageUIProvider` `Theme` `XStack` `YStack` `H1` `H2` `H3` `Paragraph` `Separator` `Spinner` `Label` `Adapt`\n\n```tsx\n<XStack gap=\"$3\" alignItems=\"center\">\n  <Spinner />\n  <Text tone=\"muted\">Loading…</Text>\n</XStack>\n```\n\n## Theming\n\n### Light and dark\n\n```tsx\nimport { DupageUIProvider, Theme, config } from '@dupagelabs/ui'\nimport { useColorScheme } from 'react-native' // or your own web hook\n\nfunction Root({ children }) {\n  const theme = useColorScheme() === 'dark' ? 'dark' : 'light'\n\n  return (\n    <DupageUIProvider config={config} defaultTheme={theme}>\n      <Theme name={theme}>{children}</Theme>\n    </DupageUIProvider>\n  )\n}\n```\n\n### Design tokens\n\nUse these in any style prop — `backgroundColor=\"$brand\"`, `color=\"$colorHover\"`, `borderColor=\"$borderColor\"`:\n\n| Token | Purpose |\n|-------|---------|\n| `$brand` `$brandHover` `$brandPress` | Primary action and accent states |\n| `$brandContrast` | Text and icons on brand backgrounds |\n| `$background` `$backgroundHover` `$backgroundPress` | Surfaces |\n| `$color` `$colorHover` | Primary and secondary text |\n| `$borderColor` | Borders and dividers |\n| `$placeholderColor` | Input placeholders |\n\nSpacing, radius, and font scales (`$1`–`$16`) are included in the default token set.\n\n## Platform setup\n\n### Next.js\n\n```bash\nnpm i @dupagelabs/ui react-native-web\n```\n\n```ts\n// next.config.ts\nimport type { NextConfig } from 'next'\n\nconst nextConfig: NextConfig = {\n  transpilePackages: [\n    '@dupagelabs/ui',\n    'tamagui',\n    '@tamagui/core',\n    '@tamagui/config',\n    'react-native-web',\n  ],\n  turbopack: {\n    resolveAlias: { 'react-native': 'react-native-web' },\n  },\n  webpack: (config) => {\n    config.resolve.alias = {\n      ...(config.resolve.alias ?? {}),\n      'react-native': 'react-native-web',\n    }\n    return config\n  },\n}\n\nexport default nextConfig\n```\n\nWith the App Router, put `DupageUIProvider` in a `'use client'` component and render it from `app/layout.tsx`.\n\n### Expo / React Native\n\n```bash\nnpx expo install react-native-safe-area-context react-native-reanimated react-native-gesture-handler\n```\n\n```js\n// babel.config.js\nmodule.exports = function (api) {\n  api.cache(true)\n  return {\n    presets: ['babel-preset-expo'],\n    plugins: ['react-native-reanimated/plugin'],\n  }\n}\n```\n\nIn a pnpm monorepo, prefer a hoisted install layout (`node-linker=hoisted`) so Metro resolves workspace packages cleanly.\n\n### Peer dependencies\n\n| Package | When |\n|---------|------|\n| `react` `>=18` | always |\n| `react-dom` | web only |\n| `react-native` | native only |\n\n## API reference\n\n**Provider** — `DupageUIProvider` (preferred) · `TamaguiProvider` (alias, deprecated)\n\n**Components** — `Button` `Checkbox` `Switch` `Radio` `RadioGroup` `Input` `TextArea` `Alert` `Badge` `Chip` `Tooltip` `Divider` `Avatar` `EmptyState` `Tabs` `Dropdown` `DropdownMenu` `SearchField` `Pagination` `ProgressTracker` `Breadcrumb` `Accordion` `FileUpload` `DateTimePicker` `DataTable` `Text` `Card` `Dialog` `Modal` `Sheet`\n\n**Config** — `config` `createConfig` `createThemesFromBrand` `brandPresets` `dupagelabsBrand` `northshoreBrand` `emberBrand` `defaultLightSurface` `defaultDarkSurface`\n\n**Types** — `ButtonProps` `CheckboxProps` `CheckboxCheckedState` `SwitchProps` `RadioProps` `RadioGroupProps` `InputProps` `TextAreaProps` `AlertProps` `AlertTone` `BadgeProps` `BadgeTone` `BadgeSize` `ChipProps` `TooltipProps` `DividerProps` `AvatarProps` `AvatarSize` `EmptyStateProps` `TabsProps` `DropdownProps` `DropdownOption` `DropdownMenuProps` `DropdownMenuItem` `SearchFieldProps` `PaginationProps` `ProgressTrackerProps` `ProgressTrackerStep` `BreadcrumbProps` `BreadcrumbItem` `AccordionProps` `FileUploadProps` `UploadedFile` `DateTimePickerProps` `DataTableProps` `DataTableColumn` `DataTableRow` `TextProps` `CardProps` `DialogContentProps` `SheetFrameProps` `AppConfig` `CreateConfigOptions` `ClientBrand` `BrandPalette` `SurfacePalette` `BrandPresetId`\n\nThe config is also a subpath import:\n\n```ts\nimport config from '@dupagelabs/ui/config'\n```\n\n## Links\n\n| | |\n|---|---|\n| **Docs** | [ui.dupagelabs.com](https://ui.dupagelabs.com) |\n| **Docs (local)** | `pnpm web` in this repo → [apps/web](../../apps/web) |\n| **Mobile preview (local)** | `pnpm mobile` → [apps/mobile](../../apps/mobile) |\n| **npm** | [npmjs.com/package/@dupagelabs/ui](https://www.npmjs.com/package/@dupagelabs/ui) |\n| **Source** | [github.com/mobinahmed/dupagelabs-ui](https://github.com/mobinahmed/dupagelabs-ui) |\n\n---\n\n<div align=\"center\">\n\nBuilt by **DuPage Labs** · MIT licensed · PRs and issues welcome\n\n</div>\n","readmeFilename":"README.md"}