{"_id":"@arcos-harmony/lighthouse-theme","_rev":"7-dd92ba82b87b15110bfb833f127fbcc1","name":"@arcos-harmony/lighthouse-theme","dist-tags":{"latest":"0.1.6"},"versions":{"0.1.0":{"name":"@arcos-harmony/lighthouse-theme","version":"0.1.0","keywords":["design-system","mui","material-ui","material-design","components","patterns","theme","design-tokens","css-variables","lighthouse","arcos-harmony","react","typescript","figma","theming"],"author":{"name":"ARCOS Harmony"},"license":"MIT","_id":"@arcos-harmony/lighthouse-theme@0.1.0","maintainers":[{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"}],"homepage":"https://github.com/arcos-harmony/lighthouse-theme#readme","bugs":{"url":"https://github.com/arcos-harmony/lighthouse-theme/issues"},"dist":{"shasum":"546f514c894309b01bd7079bffe00a0ac0e04925","tarball":"https://registry.npmjs.org/@arcos-harmony/lighthouse-theme/-/lighthouse-theme-0.1.0.tgz","fileCount":42,"integrity":"sha512-wib9BqUZFjfBDLgeswDcuwlpJ49avf32U4ml+dffz37+P6elW4VHwa7jnQnyXhjoWu94/lgRn3aKwglJH9isgg==","signatures":[{"sig":"MEYCIQDANwe0EqoiQDcoqH45lPtsz8+YntY3/HLpKG1mOJItJwIhANTr0zSYgURKdo04LuFXeVhpBCRGu3KNdF+JTsGwEqu0","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":18336714},"main":"./dist/cjs/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/esm/index.js","engines":{"node":">=18.18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./dark":{"types":"./dist/dark.d.ts","import":"./dist/esm/dark.js","require":"./dist/cjs/dark.js"},"./light":{"types":"./dist/light.d.ts","import":"./dist/esm/light.js","require":"./dist/cjs/light.js"},"./theme":{"types":"./dist/theme.d.ts","import":"./dist/esm/theme.js","require":"./dist/cjs/theme.js"},"./styles":{"default":"./dist/styles/index.css"},"./tokens":{"types":"./dist/tokens.d.ts","import":"./dist/esm/tokens.js","require":"./dist/cjs/tokens.js"},"./patterns":{"types":"./dist/patterns.d.ts","import":"./dist/esm/patterns.js","require":"./dist/cjs/patterns.js"},"./components":{"types":"./dist/components.d.ts","import":"./dist/esm/components.js","require":"./dist/cjs/components.js"}},"gitHead":"2e00f03d46013da90864d89ee6b7a005afb30280","scripts":{"dev":"tsup --watch","build":"npm run clean && npm run build:tokens && npm run build:theme","clean":"rimraf dist","typecheck":"tsc --noEmit","build:theme":"tsup --config tsup.config.ts","build:tokens":"tsx ./scripts/build-tokens.ts"},"_npmUser":{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"},"repository":{"url":"git+https://github.com/arcos-harmony/lighthouse-theme.git","type":"git"},"_npmVersion":"11.6.0","description":"Complete Lighthouse design system - components, patterns, themes, and design tokens for Material UI","directories":{},"sideEffects":["./dist/styles/*.css","./src/components/types.d.ts","./src/theme/theme-palette-augmentation.d.ts"],"_nodeVersion":"24.9.0","dependencies":{"@arcos-harmony/design-tokens":"file:../design-tokens"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.20.6","tsup":"^8.5.0","rimraf":"^6.0.1","fs-extra":"^11.3.2","typescript":"^5.7.2","@types/react":"^18.3.12","@types/fs-extra":"^11.0.4","@types/react-dom":"^18.3.1"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0","@mui/material":"^6.0.0 || ^7.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lighthouse-theme_0.1.0_1759945650257_0.7129549100826871","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@arcos-harmony/lighthouse-theme","version":"0.1.1","keywords":["design-system","mui","material-ui","material-design","components","patterns","theme","design-tokens","css-variables","lighthouse","arcos-harmony","react","typescript","figma","theming"],"author":{"name":"ARCOS Harmony"},"license":"MIT","_id":"@arcos-harmony/lighthouse-theme@0.1.1","maintainers":[{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"}],"homepage":"https://github.com/arcos-harmony/lighthouse-theme#readme","bugs":{"url":"https://github.com/arcos-harmony/lighthouse-theme/issues"},"dist":{"shasum":"a6d97faff402f99c696c6b6204a0457691f0e0ca","tarball":"https://registry.npmjs.org/@arcos-harmony/lighthouse-theme/-/lighthouse-theme-0.1.1.tgz","fileCount":42,"integrity":"sha512-njr9Pg+DieXJzPvBH1Bslf2vJ3y1+gzv/iHlISCyHZtmxmgHyv6R9/vlyp2cHL3G/7x7Lau41uu7OdY+Wg0l0Q==","signatures":[{"sig":"MEUCIAblQudsbrLzxO3MBYft27Hck06Oeo1upu3O/OD7oSj8AiEAuHeMipJoDf3wzgSOJ+iAUPHI9gPlYqtsP93VvlrizfU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":18336712},"main":"./dist/cjs/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/esm/index.js","engines":{"node":">=18.18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./dark":{"types":"./dist/dark.d.ts","import":"./dist/esm/dark.js","require":"./dist/cjs/dark.js"},"./light":{"types":"./dist/light.d.ts","import":"./dist/esm/light.js","require":"./dist/cjs/light.js"},"./theme":{"types":"./dist/theme.d.ts","import":"./dist/esm/theme.js","require":"./dist/cjs/theme.js"},"./styles":{"default":"./dist/styles/index.css"},"./tokens":{"types":"./dist/tokens.d.ts","import":"./dist/esm/tokens.js","require":"./dist/cjs/tokens.js"},"./patterns":{"types":"./dist/patterns.d.ts","import":"./dist/esm/patterns.js","require":"./dist/cjs/patterns.js"},"./components":{"types":"./dist/components.d.ts","import":"./dist/esm/components.js","require":"./dist/cjs/components.js"}},"gitHead":"2e00f03d46013da90864d89ee6b7a005afb30280","scripts":{"dev":"tsup --watch","build":"npm run clean && npm run build:tokens && npm run build:theme","clean":"rimraf dist","typecheck":"tsc --noEmit","build:theme":"tsup --config tsup.config.ts","build:tokens":"tsx ./scripts/build-tokens.ts"},"_npmUser":{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"},"repository":{"url":"git+https://github.com/arcos-harmony/lighthouse-theme.git","type":"git"},"_npmVersion":"11.6.0","description":"Complete Lighthouse design system - components, patterns, themes, and design tokens for Material UI","directories":{},"sideEffects":["./dist/styles/*.css","./src/components/types.d.ts","./src/theme/theme-palette-augmentation.d.ts"],"_nodeVersion":"24.9.0","dependencies":{},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.20.6","tsup":"^8.5.0","rimraf":"^6.0.1","fs-extra":"^11.3.2","typescript":"^5.7.2","@types/react":"^18.3.12","@types/fs-extra":"^11.0.4","@types/react-dom":"^18.3.1","@arcos-harmony/design-tokens":"file:../design-tokens"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0","@mui/material":"^6.0.0 || ^7.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lighthouse-theme_0.1.1_1759946016848_0.46695193505981725","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@arcos-harmony/lighthouse-theme","version":"0.1.2","keywords":["design-system","mui","material-ui","material-design","components","patterns","theme","design-tokens","css-variables","lighthouse","arcos-harmony","react","typescript","figma","theming"],"author":{"name":"ARCOS Harmony"},"license":"MIT","_id":"@arcos-harmony/lighthouse-theme@0.1.2","maintainers":[{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"}],"homepage":"https://github.com/arcos-harmony/lighthouse-theme#readme","bugs":{"url":"https://github.com/arcos-harmony/lighthouse-theme/issues"},"dist":{"shasum":"af1e9befce8103a104c42abec0b35bb2b0b2d73e","tarball":"https://registry.npmjs.org/@arcos-harmony/lighthouse-theme/-/lighthouse-theme-0.1.2.tgz","fileCount":42,"integrity":"sha512-vRE9VBlHlAwjGVxxlttmKUyAE81GHLo2BmvvfSJV8VqDcA8yjJkJamjoJgX1sWQ7vsAJtWYKsV5BvuUq1jIkuA==","signatures":[{"sig":"MEQCIBlFSJAbewKtEB/d/uhkJiAlCwzs9vKE1wnQpMtYqvxHAiAtA5l7kDdYECweFXt02BxcL6Po1eUca99J7ddB+bmM7g==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":18361882},"main":"./dist/cjs/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/esm/index.js","engines":{"node":">=18.18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./dark":{"types":"./dist/dark.d.ts","import":"./dist/esm/dark.js","require":"./dist/cjs/dark.js"},"./light":{"types":"./dist/light.d.ts","import":"./dist/esm/light.js","require":"./dist/cjs/light.js"},"./theme":{"types":"./dist/theme.d.ts","import":"./dist/esm/theme.js","require":"./dist/cjs/theme.js"},"./styles":{"default":"./dist/styles/index.css"},"./tokens":{"types":"./dist/tokens.d.ts","import":"./dist/esm/tokens.js","require":"./dist/cjs/tokens.js"},"./patterns":{"types":"./dist/patterns.d.ts","import":"./dist/esm/patterns.js","require":"./dist/cjs/patterns.js"},"./components":{"types":"./dist/components.d.ts","import":"./dist/esm/components.js","require":"./dist/cjs/components.js"}},"gitHead":"8f74e018cc305a6a8a055eea6f64f1fe0075e7d7","scripts":{"dev":"tsup --watch","build":"npm run clean && npm run build:tokens && npm run build:theme","clean":"rimraf dist","typecheck":"tsc --noEmit","build:theme":"tsup --config tsup.config.ts","build:tokens":"tsx ./scripts/build-tokens.ts"},"_npmUser":{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"},"repository":{"url":"git+https://github.com/arcos-harmony/lighthouse-theme.git","type":"git"},"_npmVersion":"11.6.0","description":"Complete Lighthouse design system - components, patterns, themes, and design tokens for Material UI","directories":{},"sideEffects":["./dist/styles/*.css","./src/components/types.d.ts","./src/theme/theme-palette-augmentation.d.ts"],"_nodeVersion":"24.9.0","dependencies":{},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.20.6","tsup":"^8.5.0","rimraf":"^6.0.1","fs-extra":"^11.3.2","typescript":"^5.7.2","@types/react":"^18.3.12","@types/fs-extra":"^11.0.4","@types/react-dom":"^18.3.1","@arcos-harmony/design-tokens":"file:../design-tokens"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0","@mui/material":"^6.0.0 || ^7.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lighthouse-theme_0.1.2_1759949848499_0.3871172328332142","host":"s3://npm-registry-packages-npm-production"}},"0.1.3":{"name":"@arcos-harmony/lighthouse-theme","version":"0.1.3","keywords":["design-system","mui","material-ui","material-design","components","patterns","theme","design-tokens","css-variables","lighthouse","arcos-harmony","react","typescript","figma","theming"],"author":{"name":"ARCOS Harmony"},"license":"MIT","_id":"@arcos-harmony/lighthouse-theme@0.1.3","maintainers":[{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"}],"homepage":"https://github.com/arcos-harmony/lighthouse-theme#readme","bugs":{"url":"https://github.com/arcos-harmony/lighthouse-theme/issues"},"dist":{"shasum":"5de67a93425a448803233e8ca4d2a91fe5f554b8","tarball":"https://registry.npmjs.org/@arcos-harmony/lighthouse-theme/-/lighthouse-theme-0.1.3.tgz","fileCount":45,"integrity":"sha512-tQh8i0Yy5la6yvmzsEtXOV0kdrADOBfQhU35pLJ0CfWpcb90XibxLrMuLt1sVB2RBlplgALxiPLGgi6oXpTL9A==","signatures":[{"sig":"MEYCIQDDOUITl//lbZs+odS4nKvq4sDr7BPQoba+EiYa64HuyQIhANpmYqFlxOqvReHOL/eA9djieXyBcuAh4OVAWUyUzuuz","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":18365082},"main":"./dist/cjs/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/esm/index.js","engines":{"node":">=18.18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./dark":{"types":"./dist/dark.d.ts","import":"./dist/esm/dark.js","require":"./dist/cjs/dark.js"},"./light":{"types":"./dist/light.d.ts","import":"./dist/esm/light.js","require":"./dist/cjs/light.js"},"./theme":{"types":"./dist/theme.d.ts","import":"./dist/esm/theme.js","require":"./dist/cjs/theme.js"},"./styles":{"default":"./dist/styles/index.css"},"./tokens":{"types":"./dist/tokens.d.ts","import":"./dist/esm/tokens.js","require":"./dist/cjs/tokens.js"},"./patterns":{"types":"./dist/patterns.d.ts","import":"./dist/esm/patterns.js","require":"./dist/cjs/patterns.js"},"./components":{"types":"./dist/components.d.ts","import":"./dist/esm/components.js","require":"./dist/cjs/components.js"}},"gitHead":"8f74e018cc305a6a8a055eea6f64f1fe0075e7d7","scripts":{"dev":"tsup --watch","build":"npm run clean && npm run build:tokens && npm run build:theme","clean":"rimraf dist","typecheck":"tsc --noEmit","build:theme":"tsup --config tsup.config.ts","build:tokens":"tsx ./scripts/build-tokens.ts"},"_npmUser":{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"},"repository":{"url":"git+https://github.com/arcos-harmony/lighthouse-theme.git","type":"git"},"_npmVersion":"11.6.0","description":"Complete Lighthouse design system - components, patterns, themes, and design tokens for Material UI","directories":{},"sideEffects":["./dist/styles/*.css","./src/components/types.d.ts","./src/theme/theme-palette-augmentation.d.ts"],"_nodeVersion":"24.9.0","dependencies":{},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.20.6","tsup":"^8.5.0","rimraf":"^6.0.1","fs-extra":"^11.3.2","typescript":"^5.7.2","@types/react":"^18.3.12","@types/fs-extra":"^11.0.4","@types/react-dom":"^18.3.1","@arcos-harmony/design-tokens":"file:../design-tokens"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0","@mui/material":"^6.0.0 || ^7.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lighthouse-theme_0.1.3_1759959618950_0.7268772265319057","host":"s3://npm-registry-packages-npm-production"}},"0.1.4":{"name":"@arcos-harmony/lighthouse-theme","version":"0.1.4","keywords":["design-system","mui","material-ui","material-design","components","patterns","theme","design-tokens","css-variables","lighthouse","arcos-harmony","react","typescript","figma","theming"],"author":{"name":"ARCOS Harmony"},"license":"MIT","_id":"@arcos-harmony/lighthouse-theme@0.1.4","maintainers":[{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"}],"homepage":"https://github.com/arcos-harmony/lighthouse-theme#readme","bugs":{"url":"https://github.com/arcos-harmony/lighthouse-theme/issues"},"dist":{"shasum":"1cc9498b31b3a0af2c4e110bc7e07b08174ef196","tarball":"https://registry.npmjs.org/@arcos-harmony/lighthouse-theme/-/lighthouse-theme-0.1.4.tgz","fileCount":46,"integrity":"sha512-U5IQ4AGwkIWLitEmbfvApBbFQbNjos/wNrl98uNVxEBgODM+TeeVJjduWN8K3qx2ZsZvGlhbmvV91dkpNrYLhQ==","signatures":[{"sig":"MEQCIDeoIXPCwTAGQU1S/PpJ+qQ3h7VhaC0d2AQ+40x7ItoLAiB6zWCIeIATp7RlJ7F0yimUQ+bTAjfE8v+TZfyApMB76g==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":18605738},"main":"./dist/cjs/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/esm/index.js","engines":{"node":">=18.18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./dark":{"types":"./dist/dark.d.ts","import":"./dist/esm/dark.js","require":"./dist/cjs/dark.js"},"./light":{"types":"./dist/light.d.ts","import":"./dist/esm/light.js","require":"./dist/cjs/light.js"},"./theme":{"types":"./dist/theme.d.ts","import":"./dist/esm/theme.js","require":"./dist/cjs/theme.js"},"./styles":{"default":"./dist/styles/index.css"},"./tokens":{"types":"./dist/tokens.d.ts","import":"./dist/esm/tokens.js","require":"./dist/cjs/tokens.js"},"./patterns":{"types":"./dist/patterns.d.ts","import":"./dist/esm/patterns.js","require":"./dist/cjs/patterns.js"},"./components":{"types":"./dist/components.d.ts","import":"./dist/esm/components.js","require":"./dist/cjs/components.js"}},"gitHead":"8f74e018cc305a6a8a055eea6f64f1fe0075e7d7","scripts":{"dev":"tsup --watch","build":"npm run clean && npm run build:tokens && npm run build:theme","clean":"rimraf dist","typecheck":"tsc --noEmit","build:theme":"tsup --config tsup.config.ts","build:tokens":"tsx ./scripts/build-tokens.ts"},"_npmUser":{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"},"repository":{"url":"git+https://github.com/arcos-harmony/lighthouse-theme.git","type":"git"},"_npmVersion":"11.6.0","description":"Complete Lighthouse design system - components, patterns, themes, and design tokens for Material UI","directories":{},"sideEffects":["./dist/styles/*.css","./src/components/types.d.ts","./src/theme/theme-palette-augmentation.d.ts"],"_nodeVersion":"24.9.0","dependencies":{},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.20.6","tsup":"^8.5.0","rimraf":"^6.0.1","fs-extra":"^11.3.2","typescript":"^5.7.2","@types/react":"^18.3.12","@types/fs-extra":"^11.0.4","@types/react-dom":"^18.3.1","@arcos-harmony/design-tokens":"file:../design-tokens"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0","@mui/material":"^6.0.0 || ^7.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lighthouse-theme_0.1.4_1759970294027_0.7652097173431671","host":"s3://npm-registry-packages-npm-production"}},"0.1.5":{"name":"@arcos-harmony/lighthouse-theme","version":"0.1.5","keywords":["design-system","mui","material-ui","material-design","components","patterns","theme","design-tokens","css-variables","lighthouse","arcos-harmony","react","typescript","figma","theming"],"author":{"name":"ARCOS Harmony"},"license":"MIT","_id":"@arcos-harmony/lighthouse-theme@0.1.5","maintainers":[{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"}],"homepage":"https://github.com/arcos-harmony/lighthouse-theme#readme","bugs":{"url":"https://github.com/arcos-harmony/lighthouse-theme/issues"},"dist":{"shasum":"abf2b484168484e0dacfadeb96a018d10315a32b","tarball":"https://registry.npmjs.org/@arcos-harmony/lighthouse-theme/-/lighthouse-theme-0.1.5.tgz","fileCount":46,"integrity":"sha512-YVQ39F3DgK1J/xBGg0+gJa0HxfTyItzmwLy+LF2chW7rt9dM1+Gfbg4TJO21r+5E3aj0EjurOFE3uuyGpo6CxA==","signatures":[{"sig":"MEQCIDSdyVsZVVeYHfV2GO8h6TnVHf8gUeUOQ0W4MJkp8gBCAiBaCKNR2Paeo+4ti1EhC7lej58RLRIKAYca/36BdDrazw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":18605749},"main":"./dist/cjs/index.js","type":"module","types":"./dist/index.d.ts","module":"./dist/esm/index.js","engines":{"node":">=18.18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./dark":{"types":"./dist/dark.d.ts","import":"./dist/esm/dark.js","require":"./dist/cjs/dark.js"},"./light":{"types":"./dist/light.d.ts","import":"./dist/esm/light.js","require":"./dist/cjs/light.js"},"./theme":{"types":"./dist/theme.d.ts","import":"./dist/esm/theme.js","require":"./dist/cjs/theme.js"},"./styles":{"default":"./dist/styles/index.css"},"./tokens":{"types":"./dist/tokens.d.ts","import":"./dist/esm/tokens.js","require":"./dist/cjs/tokens.js"},"./patterns":{"types":"./dist/patterns.d.ts","import":"./dist/esm/patterns.js","require":"./dist/cjs/patterns.js"},"./components":{"types":"./dist/components.d.ts","import":"./dist/esm/components.js","require":"./dist/cjs/components.js"}},"gitHead":"ee3129fae98dce4c091d443f330ae8abc267b9f3","scripts":{"dev":"tsup --watch","build":"npm run clean && npm run build:tokens && npm run build:theme","clean":"rimraf dist","typecheck":"tsc --noEmit","build:theme":"tsup --config tsup.config.ts","build:tokens":"tsx ./scripts/build-tokens.ts"},"_npmUser":{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"},"repository":{"url":"git+https://github.com/arcos-harmony/lighthouse-theme.git","type":"git"},"_npmVersion":"11.6.0","description":"Complete Lighthouse design system - components, patterns, themes, and design tokens for Material UI","directories":{},"sideEffects":["./dist/styles/*.css","./src/components/types.d.ts","./src/theme/theme-palette-augmentation.d.ts"],"_nodeVersion":"24.9.0","dependencies":{},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_hasShrinkwrap":false,"devDependencies":{"tsx":"^4.20.6","tsup":"^8.5.0","rimraf":"^6.0.1","fs-extra":"^11.3.2","typescript":"^5.7.2","@types/react":"^18.3.12","@types/fs-extra":"^11.0.4","@types/react-dom":"^18.3.1","@arcos-harmony/design-tokens":"file:../design-tokens"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0","@mui/material":"^6.0.0 || ^7.0.0"},"_npmOperationalInternal":{"tmp":"tmp/lighthouse-theme_0.1.5_1760043260127_0.23085997796483881","host":"s3://npm-registry-packages-npm-production"}},"0.1.6":{"name":"@arcos-harmony/lighthouse-theme","version":"0.1.6","description":"Complete Lighthouse design system - components, patterns, themes, and design tokens for Material UI","license":"MIT","type":"module","main":"./dist/cjs/index.js","module":"./dist/esm/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"},"./components":{"types":"./dist/components.d.ts","import":"./dist/esm/components.js","require":"./dist/cjs/components.js"},"./patterns":{"types":"./dist/patterns.d.ts","import":"./dist/esm/patterns.js","require":"./dist/cjs/patterns.js"},"./theme":{"types":"./dist/theme.d.ts","import":"./dist/esm/theme.js","require":"./dist/cjs/theme.js"},"./light":{"types":"./dist/light.d.ts","import":"./dist/esm/light.js","require":"./dist/cjs/light.js"},"./dark":{"types":"./dist/dark.d.ts","import":"./dist/esm/dark.js","require":"./dist/cjs/dark.js"},"./tokens":{"types":"./dist/tokens.d.ts","import":"./dist/esm/tokens.js","require":"./dist/cjs/tokens.js"},"./styles":{"default":"./dist/styles/index.css"}},"sideEffects":["./dist/styles/*.css","./src/components/types.d.ts","./src/theme/theme-palette-augmentation.d.ts"],"engines":{"node":">=18.18"},"scripts":{"clean":"rimraf dist","build:tokens":"tsx ./scripts/build-tokens.ts","build:theme":"tsup --config tsup.config.ts","build":"npm run clean && npm run build:tokens && npm run build:theme","dev":"tsup --watch","typecheck":"tsc --noEmit"},"peerDependencies":{"@mui/material":"^6.0.0 || ^7.0.0","react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"dependencies":{},"devDependencies":{"@arcos-harmony/design-tokens":"file:../design-tokens","@types/fs-extra":"^11.0.4","@types/react":"^18.3.12","@types/react-dom":"^18.3.1","fs-extra":"^11.3.2","rimraf":"^6.0.1","tsup":"^8.5.0","tsx":"^4.20.6","typescript":"^5.7.2"},"keywords":["design-system","mui","material-ui","material-design","components","patterns","theme","design-tokens","css-variables","lighthouse","arcos-harmony","react","typescript","figma","theming"],"author":{"name":"ARCOS Harmony"},"repository":{"type":"git","url":"git+https://github.com/arcos-harmony/lighthouse-theme.git"},"bugs":{"url":"https://github.com/arcos-harmony/lighthouse-theme/issues"},"homepage":"https://github.com/arcos-harmony/lighthouse-theme#readme","publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"_id":"@arcos-harmony/lighthouse-theme@0.1.6","gitHead":"ee3129fae98dce4c091d443f330ae8abc267b9f3","_nodeVersion":"24.9.0","_npmVersion":"11.6.0","dist":{"integrity":"sha512-Jh+7+krb0d2Nx1PEG89uDZI1Zvxe1Qmer46V8SuwkpfUmfa1YyzskvohKu84h9oLaqWigtjxTcLOWEH75C2BwA==","shasum":"8b5e408d9e0be539bfeaafd30e1fabecf14115e0","tarball":"https://registry.npmjs.org/@arcos-harmony/lighthouse-theme/-/lighthouse-theme-0.1.6.tgz","fileCount":46,"unpackedSize":18605720,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDLldhLnIKxATqIAPRAAAl4xCn2zBLLLX8ge3jDUiT+EAIgFv/o1jQ2hLqL/WVm0S9ma/LBr9xdjpMBd6dqx+Wcc/0="}]},"_npmUser":{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"},"directories":{},"maintainers":[{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/lighthouse-theme_0.1.6_1760045395537_0.9988676453128553"},"_hasShrinkwrap":false}},"time":{"created":"2025-10-08T17:47:30.194Z","modified":"2025-10-09T21:29:55.964Z","0.1.0":"2025-10-08T17:47:30.573Z","0.1.1":"2025-10-08T17:53:37.069Z","0.1.2":"2025-10-08T18:57:28.736Z","0.1.3":"2025-10-08T21:40:19.396Z","0.1.4":"2025-10-09T00:38:14.324Z","0.1.5":"2025-10-09T20:54:20.353Z","0.1.6":"2025-10-09T21:29:55.752Z"},"bugs":{"url":"https://github.com/arcos-harmony/lighthouse-theme/issues"},"author":{"name":"ARCOS Harmony"},"license":"MIT","homepage":"https://github.com/arcos-harmony/lighthouse-theme#readme","keywords":["design-system","mui","material-ui","material-design","components","patterns","theme","design-tokens","css-variables","lighthouse","arcos-harmony","react","typescript","figma","theming"],"repository":{"type":"git","url":"git+https://github.com/arcos-harmony/lighthouse-theme.git"},"description":"Complete Lighthouse design system - components, patterns, themes, and design tokens for Material UI","maintainers":[{"name":"arcosharmony","email":"jsonderman@arcos-inc.com"}],"readme":"# @arcos-harmony/lighthouse-theme\n\n> 🎨 Complete Lighthouse design system for Material-UI - Components, Patterns, Themes, and Design Tokens\n\n[![npm version](https://img.shields.io/npm/v/@arcos-harmony/lighthouse-theme.svg)](https://www.npmjs.com/package/@arcos-harmony/lighthouse-theme)\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)\n\nA comprehensive, production-ready design system built on Material-UI v6/v7 with 1,714 design tokens, 49 semantic component wrappers, and a flexible theming system.\n\n## ✨ Features\n\n- 🎨 **1,714 Design Tokens** - CSS variables synced from Figma\n- 🧩 **49 Semantic Components** - Pre-styled MUI wrappers with consistent naming\n- 🌓 **Light & Dark Themes** - Built-in theme switching support\n- 🎯 **Custom Color Palette** - Extended with `approve`, `destructive`, and `tertiary` colors\n- 📦 **Tree-shakeable** - Import only what you need\n- 🔧 **TypeScript First** - Full type safety with module augmentation\n- 🎭 **Pattern Library** - Reusable UI patterns (coming soon)\n- ♿ **Accessible** - WCAG compliant components\n\n## 📦 Installation\n\n```bash\nnpm install @arcos-harmony/lighthouse-theme\n```\n\n**Peer dependencies** (if not already installed):\n```bash\nnpm install @mui/material react react-dom\n```\n\n## 🚀 Quick Start\n\n### Basic Setup\n\n```tsx\nimport { lightTheme, darkTheme } from '@arcos-harmony/lighthouse-theme';\nimport '@arcos-harmony/lighthouse-theme/styles/themes.css';\nimport { ThemeProvider, CssBaseline } from '@mui/material';\n\nfunction App() {\n  const [mode, setMode] = React.useState<'light' | 'dark'>('light');\n  const theme = mode === 'light' ? lightTheme : darkTheme;\n\n  return (\n    <ThemeProvider theme={theme}>\n      <CssBaseline />\n      {/* Your app */}\n    </ThemeProvider>\n  );\n}\n```\n\n**Note:** The default styles import (`'@arcos-harmony/lighthouse-theme/styles'`) includes **light mode** CSS variables. For dynamic theme switching, see the Dark Mode section below.\n\n### Available CSS Files\n\nThe package provides multiple CSS files optimized for different use cases:\n\n| File | Size | What's Included | When to Use |\n|------|------|-----------------|-------------|\n| **`styles/themes.css`** ⭐ | **192KB** | Core + Light + Dark (switchable) | **Your app has a theme toggle** |\n| `styles/index.css` | 118B* | @import core + light | Default import, backward compatibility |\n| `styles/light.css` | 116KB* | Core + Light theme | **Your app is light mode only** (40% smaller!) |\n| `styles/dark.css` | 116KB* | Core + Dark theme | **Your app is dark mode only** (40% smaller!) |\n| `styles/core.css` | 40KB | Core tokens only | Advanced: Custom theme composition |\n| `styles/theme.light.css` | 76KB | Light theme tokens | Advanced: Custom theme composition |\n| `styles/theme.dark.css` | 76KB | Dark theme tokens | Advanced: Custom theme composition |\n\n<sup>* Files using `@import` load additional CSS: light.css loads core.css + theme.light.css = 116KB total</sup>\n\n#### Quick Decision Guide\n\n**Choose your CSS file:**\n\n```\nDoes your app switch between light and dark themes?\n├─ YES → Use themes.css (192KB)\n│   ✅ Both themes always available\n│   ✅ Instant switching with data-theme attribute\n│\n└─ NO → Which theme do you need?\n    ├─ Light only → Use light.css (116KB) - 40% smaller!\n    │   ✅ Smaller bundle for better performance\n    │   ✅ Saves 76KB vs themes.css\n    │\n    └─ Dark only → Use dark.css (116KB) - 40% smaller!\n        ✅ Smaller bundle for better performance\n        ✅ Saves 76KB vs themes.css\n```\n\n**Bundle Size Matters:** If your app will **never switch themes**, using `light.css` or `dark.css` saves 76KB (40% reduction) compared to loading the full `themes.css` file.\n\n### Dark Mode Support\n\nThe package includes full dark mode support with multiple implementation options:\n\n#### Option 1: Switchable CSS (Recommended ⭐)\n**Best for apps with theme switching.** Import the single combined CSS file and toggle themes via a data attribute:\n\n```tsx\n// 1. Import the switchable themes CSS\nimport '@arcos-harmony/lighthouse-theme/styles/themes.css';\n\n// 2. Import both theme objects\nimport { lightTheme, darkTheme } from '@arcos-harmony/lighthouse-theme';\nimport { ThemeProvider } from '@mui/material';\n\nfunction App() {\n  const [mode, setMode] = React.useState<'light' | 'dark'>('light');\n  \n  // Toggle the data-theme attribute\n  React.useEffect(() => {\n    document.documentElement.setAttribute('data-theme', mode);\n  }, [mode]);\n  \n  return (\n    <ThemeProvider theme={mode === 'light' ? lightTheme : darkTheme}>\n      <button onClick={() => setMode(mode === 'light' ? 'dark' : 'light')}>\n        Toggle Theme\n      </button>\n      {/* Your app */}\n    </ThemeProvider>\n  );\n}\n```\n\n**Why this is best:**\n- ✅ Single CSS file (~150KB) loads once\n- ✅ Instant theme switching (no CSS reload)\n- ✅ No flash of unstyled content\n- ✅ Simple implementation\n\n#### Option 2: Dynamic Import\nFor runtime CSS switching (less recommended):\n\n```tsx\nimport { lightTheme, darkTheme } from '@arcos-harmony/lighthouse-theme';\nimport { ThemeProvider } from '@mui/material';\n\nfunction App() {\n  const [mode, setMode] = React.useState<'light' | 'dark'>('light');\n  \n  // Dynamically load CSS based on mode\n  React.useEffect(() => {\n    // Remove existing theme CSS\n    const existingLink = document.querySelector('link[data-theme-css]');\n    if (existingLink) existingLink.remove();\n    \n    // Add new theme CSS\n    const link = document.createElement('link');\n    link.rel = 'stylesheet';\n    link.href = mode === 'light' \n      ? '/node_modules/@arcos-harmony/lighthouse-theme/dist/styles/light.css'\n      : '/node_modules/@arcos-harmony/lighthouse-theme/dist/styles/dark.css';\n    link.setAttribute('data-theme-css', 'true');\n    document.head.appendChild(link);\n  }, [mode]);\n\n  const theme = mode === 'light' ? lightTheme : darkTheme;\n\n  return (\n    <ThemeProvider theme={theme}>\n      {/* Your app */}\n    </ThemeProvider>\n  );\n}\n```\n\n**Downsides:**\n- ⚠️ Requires CSS file reload (brief flash possible)\n- ⚠️ More complex implementation\n- ⚠️ Need to manage DOM manipulation\n\n#### Option 3: Static Single Mode\nIf you only need one mode, import the specific CSS:\n\n```tsx\n// Light mode only\nimport '@arcos-harmony/lighthouse-theme/dist/styles/light.css';\nimport { lightTheme } from '@arcos-harmony/lighthouse-theme';\n\n// OR Dark mode only\nimport '@arcos-harmony/lighthouse-theme/dist/styles/dark.css';\nimport { darkTheme } from '@arcos-harmony/lighthouse-theme';\n```\n\n### Using Components\n\n```tsx\nimport { PrimaryButton, ApproveButton, ErrorAlert } from '@arcos-harmony/lighthouse-theme';\n\nfunction MyComponent() {\n  return (\n    <>\n      <PrimaryButton size=\"large\">Primary Action</PrimaryButton>\n      <ApproveButton>Approve</ApproveButton>\n      <ErrorAlert>Something went wrong!</ErrorAlert>\n    </>\n  );\n}\n```\n\n## � Migrating from MUI to Lighthouse Components\n\nLighthouse-theme provides wrapped versions of MUI components with design tokens pre-applied. Simply replace your MUI imports with Lighthouse imports:\n\n### Before (MUI)\n```tsx\nimport { Button, Alert, TextField } from '@mui/material';\n\n<Button color=\"primary\" variant=\"contained\">Primary</Button>\n<Button color=\"error\" variant=\"contained\">Delete</Button>\n<Alert severity=\"error\">Error message</Alert>\n<TextField variant=\"outlined\" />\n```\n\n### After (Lighthouse)\n```tsx\nimport { PrimaryButton, DestructiveButton, ErrorAlert, TextField } from '@arcos-harmony/lighthouse-theme';\n\n<PrimaryButton>Primary</PrimaryButton>\n<DestructiveButton>Delete</DestructiveButton>\n<ErrorAlert>Error message</ErrorAlert>\n<TextField />\n```\n\n**Benefits:**\n- ✅ Design tokens automatically applied\n- ✅ Semantic component names (clearer intent)\n- ✅ Fewer props to remember\n- ✅ Same MUI API for advanced usage\n- ✅ Full TypeScript support\n\n## �📚 Import Options\n\nThe package provides multiple entry points for optimal tree-shaking:\n\n```tsx\n// Import everything (components + patterns + theme + tokens)\nimport { PrimaryButton, lightTheme } from '@arcos-harmony/lighthouse-theme';\n\n// Import components only (best for tree-shaking)\nimport { PrimaryButton, ApproveButton } from '@arcos-harmony/lighthouse-theme/components';\n\n// Import patterns only\nimport { FormField, ActionCard } from '@arcos-harmony/lighthouse-theme/patterns';\n\n// Import theme only\nimport { lightTheme, darkTheme, createModeTheme } from '@arcos-harmony/lighthouse-theme/theme';\n\n// Import specific themes\nimport lightTheme from '@arcos-harmony/lighthouse-theme/light';\nimport darkTheme from '@arcos-harmony/lighthouse-theme/dark';\n\n// Import token utilities\nimport { getTokenValue, resolveTokenValue } from '@arcos-harmony/lighthouse-theme/tokens';\n\n// Import CSS styles\nimport '@arcos-harmony/lighthouse-theme/styles';\n```\n\n## 📖 Component Reference\n\n### Button Components\n\nLighthouse provides semantic button wrappers that map to MUI Button with pre-configured colors:\n\n| Lighthouse Component | MUI Equivalent | Use Case |\n|---------------------|----------------|----------|\n| `<PrimaryButton>` | `<Button color=\"primary\" variant=\"contained\">` | Primary actions (submit, save, next) |\n| `<SecondaryButton>` | `<Button color=\"secondary\" variant=\"contained\">` | Secondary actions (cancel, back) |\n| `<ApproveButton>` | `<Button color=\"approve\" variant=\"contained\">` | Approval actions (approve, confirm, accept) |\n| `<DestructiveButton>` | `<Button color=\"destructive\" variant=\"contained\">` | Destructive actions (delete, remove, clear) |\n| `<TertiaryButton>` | `<Button color=\"tertiary\" variant=\"contained\">` | Tertiary actions (alternative choices) |\n| `<Button>` | `<Button>` | Generic button with full MUI API |\n\n**Example:**\n```tsx\nimport {\n  PrimaryButton,\n  SecondaryButton,\n  ApproveButton,\n  DestructiveButton,\n  TertiaryButton,\n} from '@arcos-harmony/lighthouse-theme';\n\nfunction MyComponent() {\n  return (\n    <>\n      <PrimaryButton size=\"large\">Save Changes</PrimaryButton>\n      <SecondaryButton size=\"medium\">Cancel</SecondaryButton>\n      <ApproveButton>Approve Request</ApproveButton>\n      <DestructiveButton>Delete Account</DestructiveButton>\n      <TertiaryButton variant=\"outlined\">More Options</TertiaryButton>\n    </>\n  );\n}\n```\n\n### Alert Components\n\nSemantic alert wrappers that map to MUI Alert with pre-configured severity:\n\n| Lighthouse Component | MUI Equivalent | Use Case |\n|---------------------|----------------|----------|\n| `<InfoAlert>` | `<Alert severity=\"info\">` | Informational messages |\n| `<SuccessAlert>` | `<Alert severity=\"success\">` | Success confirmations |\n| `<WarningAlert>` | `<Alert severity=\"warning\">` | Warning messages |\n| `<ErrorAlert>` | `<Alert severity=\"error\">` | Error messages |\n| `<Alert>` | `<Alert>` | Generic alert with full MUI API |\n\n**Example:**\n```tsx\nimport {\n  InfoAlert,\n  SuccessAlert,\n  WarningAlert,\n  ErrorAlert,\n} from '@arcos-harmony/lighthouse-theme';\n\nfunction Notifications() {\n  return (\n    <>\n      <InfoAlert>Your session will expire in 5 minutes</InfoAlert>\n      <SuccessAlert variant=\"filled\">Profile updated successfully!</SuccessAlert>\n      <WarningAlert variant=\"outlined\">Storage almost full</WarningAlert>\n      <ErrorAlert>Failed to save changes. Please try again.</ErrorAlert>\n    </>\n  );\n}\n```\n\n### Chip Components\n\nSemantic chip wrappers that map to MUI Chip with pre-configured colors:\n\n| Lighthouse Component | MUI Equivalent | Use Case |\n|---------------------|----------------|----------|\n| `<DefaultChip>` | `<Chip color=\"default\">` | Default/neutral chips |\n| `<PrimaryChip>` | `<Chip color=\"primary\">` | Primary category chips |\n| `<SecondaryChip>` | `<Chip color=\"secondary\">` | Secondary category chips |\n| `<SuccessChip>` | `<Chip color=\"success\">` | Success status chips |\n| `<ErrorChip>` | `<Chip color=\"error\">` | Error status chips |\n| `<WarningChip>` | `<Chip color=\"warning\">` | Warning status chips |\n| `<InfoChip>` | `<Chip color=\"info\">` | Info status chips |\n| `<Chip>` | `<Chip>` | Generic chip with full MUI API |\n\n**Example:**\n```tsx\nimport {\n  DefaultChip,\n  PrimaryChip,\n  SuccessChip,\n  ErrorChip,\n} from '@arcos-harmony/lighthouse-theme';\n\nfunction TagList() {\n  return (\n    <>\n      <DefaultChip label=\"Draft\" />\n      <PrimaryChip label=\"Featured\" />\n      <SuccessChip label=\"Active\" />\n      <ErrorChip label=\"Inactive\" onDelete={() => {}} />\n    </>\n  );\n}\n```\n\n### Form Components\n\nAll form components are direct wrappers of MUI components with design tokens applied:\n\n| Lighthouse Component | MUI Equivalent | Notes |\n|---------------------|----------------|-------|\n| `<TextField>` | `<TextField>` | Defaults to outlined variant |\n| `<OutlinedTextField>` | `<TextField variant=\"outlined\">` | Explicitly outlined |\n| `<FilledTextField>` | `<TextField variant=\"filled\">` | Filled background variant |\n| `<StandardTextField>` | `<TextField variant=\"standard\">` | Underlined variant |\n| `<Select>` | `<Select>` | Dropdown select |\n| `<MenuItem>` | `<MenuItem>` | Select option items |\n| `<Checkbox>` | `<Checkbox>` | Checkbox input |\n| `<Radio>` | `<Radio>` | Radio button input |\n| `<Switch>` | `<Switch>` | Toggle switch |\n| `<FormControl>` | `<FormControl>` | Form control wrapper |\n| `<FormLabel>` | `<FormLabel>` | Form field label |\n| `<FormHelperText>` | `<FormHelperText>` | Help text below fields |\n\n**Example:**\n```tsx\nimport {\n  TextField,\n  Select,\n  MenuItem,\n  Checkbox,\n  Radio,\n  Switch,\n  FormControl,\n  FormLabel,\n  FormHelperText,\n} from '@arcos-harmony/lighthouse-theme';\n\nfunction MyForm() {\n  const [country, setCountry] = React.useState('');\n  \n  return (\n    <>\n      <FormControl fullWidth>\n        <FormLabel>Email</FormLabel>\n        <TextField placeholder=\"Enter your email\" type=\"email\" />\n        <FormHelperText>We'll never share your email</FormHelperText>\n      </FormControl>\n\n      <FormControl fullWidth>\n        <FormLabel>Country</FormLabel>\n        <Select value={country} onChange={(e) => setCountry(e.target.value)}>\n          <MenuItem value=\"us\">United States</MenuItem>\n          <MenuItem value=\"ca\">Canada</MenuItem>\n          <MenuItem value=\"uk\">United Kingdom</MenuItem>\n        </Select>\n      </FormControl>\n\n      <FormControl>\n        <Checkbox /> Accept terms and conditions\n      </FormControl>\n    </>\n  );\n}\n```\n\n### Typography Components\n\nSemantic typography wrappers that map to MUI Typography with pre-configured variants:\n\n| Lighthouse Component | MUI Equivalent | Use Case |\n|---------------------|----------------|----------|\n| `<H1>` | `<Typography variant=\"h1\">` | Page title |\n| `<H2>` | `<Typography variant=\"h2\">` | Section heading |\n| `<H3>` | `<Typography variant=\"h3\">` | Subsection heading |\n| `<H4>` | `<Typography variant=\"h4\">` | Card/group heading |\n| `<H5>` | `<Typography variant=\"h5\">` | Small heading |\n| `<H6>` | `<Typography variant=\"h6\">` | Smallest heading |\n| `<Body1>` | `<Typography variant=\"body1\">` | Primary body text |\n| `<Body2>` | `<Typography variant=\"body2\">` | Secondary body text |\n| `<Caption>` | `<Typography variant=\"caption\">` | Small text/labels |\n| `<Overline>` | `<Typography variant=\"overline\">` | Uppercase labels |\n| `<Typography>` | `<Typography>` | Generic typography with full MUI API |\n\n**Example:**\n```tsx\nimport { H1, H2, Body1, Caption } from '@arcos-harmony/lighthouse-theme';\n\nfunction Content() {\n  return (\n    <article>\n      <H1>Getting Started Guide</H1>\n      <H2>Installation</H2>\n      <Body1>\n        To install the package, run the following command in your terminal.\n        This will add the package to your project dependencies.\n      </Body1>\n      <Caption>Last updated: January 2025</Caption>\n    </article>\n  );\n}\n```\n\n### Layout Components\n\nLayout components provide structure with design tokens applied:\n\n| Lighthouse Component | MUI Equivalent | Use Case |\n|---------------------|----------------|----------|\n| `<Card>` | `<Card>` | Content container with elevation |\n| `<Paper>` | `<Paper>` | Surface container |\n| `<Dialog>` | `<Dialog>` | Modal dialog |\n\n**Example:**\n```tsx\nimport { Card, Paper, Dialog } from '@arcos-harmony/lighthouse-theme';\n\nfunction MyLayout() {\n  const [open, setOpen] = React.useState(false);\n  \n  return (\n    <>\n      <Card>\n        <h3>User Profile</h3>\n        <p>Profile information goes here</p>\n      </Card>\n\n      <Paper elevation={3}>\n        <p>Elevated content</p>\n      </Paper>\n\n      <Dialog open={open} onClose={() => setOpen(false)}>\n        Dialog content\n      </Dialog>\n    </>\n  );\n}\n```\n\n### Navigation Components\n\nNavigation components for tabs and menus:\n\n| Lighthouse Component | MUI Equivalent | Use Case |\n|---------------------|----------------|----------|\n| `<Tabs>` | `<Tabs>` | Tab container |\n| `<Tab>` | `<Tab>` | Individual tab |\n\n**Example:**\n```tsx\nimport { Tabs, Tab } from '@arcos-harmony/lighthouse-theme';\n\nfunction Navigation() {\n  const [value, setValue] = React.useState(0);\n  \n  return (\n    <Tabs value={value} onChange={(e, newValue) => setValue(newValue)}>\n      <Tab label=\"Overview\" />\n      <Tab label=\"Details\" />\n      <Tab label=\"Settings\" />\n    </Tabs>\n  );\n}\n```\n\n### Other Components\n\nAdditional utility components:\n\n| Lighthouse Component | MUI Equivalent | Use Case |\n|---------------------|----------------|----------|\n| `<Avatar>` | `<Avatar>` | User avatar/icon |\n| `<Snackbar>` | `<Snackbar>` | Toast notifications |\n\n**Example:**\n```tsx\nimport { Avatar, Snackbar } from '@arcos-harmony/lighthouse-theme';\n\nfunction UserProfile() {\n  const [open, setOpen] = React.useState(false);\n  \n  return (\n    <>\n      <Avatar alt=\"User Name\" src=\"/avatar.jpg\" />\n      \n      <Snackbar\n        open={open}\n        autoHideDuration={6000}\n        onClose={() => setOpen(false)}\n        message=\"Profile updated\"\n      />\n    </>\n  );\n}\n```\n\n## 🚀 Step-by-Step Migration Guide\n\n### Step 1: Install the Package\n\n```bash\nnpm install @arcos-harmony/lighthouse-theme\n```\n\n### Step 2: Update Your Theme Provider\n\nReplace your existing MUI theme with Lighthouse theme:\n\n**Before:**\n```tsx\nimport { createTheme, ThemeProvider } from '@mui/material/styles';\n\nconst theme = createTheme({\n  palette: {\n    primary: { main: '#1976d2' },\n    secondary: { main: '#dc004e' },\n  },\n});\n\nfunction App() {\n  return (\n    <ThemeProvider theme={theme}>\n      <YourApp />\n    </ThemeProvider>\n  );\n}\n```\n\n**After:**\n```tsx\nimport { lightTheme } from '@arcos-harmony/lighthouse-theme';\nimport '@arcos-harmony/lighthouse-theme/styles';\nimport { ThemeProvider } from '@mui/material/styles';\n\nfunction App() {\n  return (\n    <ThemeProvider theme={lightTheme}>\n      <YourApp />\n    </ThemeProvider>\n  );\n}\n```\n\n### Step 3: Replace MUI Imports\n\nUpdate your component imports to use Lighthouse wrapped components:\n\n**Before:**\n```tsx\nimport { Button, Alert, TextField, Chip } from '@mui/material';\n```\n\n**After:**\n```tsx\nimport { \n  PrimaryButton, \n  ErrorAlert, \n  TextField, \n  SuccessChip \n} from '@arcos-harmony/lighthouse-theme';\n```\n\n### Step 4: Update Component Usage\n\nReplace MUI component props with semantic components:\n\n**Before:**\n```tsx\nfunction MyComponent() {\n  return (\n    <>\n      <Button color=\"primary\" variant=\"contained\">Save</Button>\n      <Button color=\"error\" variant=\"contained\">Delete</Button>\n      <Alert severity=\"error\">Error message</Alert>\n      <Alert severity=\"success\">Success message</Alert>\n      <Chip color=\"primary\" label=\"Active\" />\n      <TextField variant=\"outlined\" label=\"Email\" />\n    </>\n  );\n}\n```\n\n**After:**\n```tsx\nfunction MyComponent() {\n  return (\n    <>\n      <PrimaryButton>Save</PrimaryButton>\n      <DestructiveButton>Delete</DestructiveButton>\n      <ErrorAlert>Error message</ErrorAlert>\n      <SuccessAlert>Success message</SuccessAlert>\n      <PrimaryChip label=\"Active\" />\n      <TextField label=\"Email\" />\n    </>\n  );\n}\n```\n\n### Step 5: Gradual Migration Strategy\n\nYou don't have to migrate everything at once! Both approaches can coexist:\n\n```tsx\n// Mix MUI and Lighthouse components during migration\nimport { Button } from '@mui/material';  // Old code\nimport { PrimaryButton } from '@arcos-harmony/lighthouse-theme';  // New code\n\nfunction MixedComponent() {\n  return (\n    <>\n      {/* Legacy code - still works */}\n      <Button color=\"primary\" variant=\"contained\">Old Button</Button>\n      \n      {/* New code - using Lighthouse */}\n      <PrimaryButton>New Button</PrimaryButton>\n    </>\n  );\n}\n```\n\n### Common Migration Patterns\n\n#### Button Migration\n\n| Old MUI Code | New Lighthouse Code |\n|-------------|-------------------|\n| `<Button color=\"primary\" variant=\"contained\">` | `<PrimaryButton>` |\n| `<Button color=\"secondary\" variant=\"contained\">` | `<SecondaryButton>` |\n| `<Button color=\"error\" variant=\"contained\">` | `<DestructiveButton>` |\n| `<Button color=\"success\" variant=\"contained\">` | `<ApproveButton>` |\n| `<Button color=\"primary\" variant=\"outlined\">` | `<PrimaryButton variant=\"outlined\">` |\n| `<Button color=\"primary\" variant=\"text\">` | `<PrimaryButton variant=\"text\">` |\n\n#### Alert Migration\n\n| Old MUI Code | New Lighthouse Code |\n|-------------|-------------------|\n| `<Alert severity=\"info\">` | `<InfoAlert>` |\n| `<Alert severity=\"success\">` | `<SuccessAlert>` |\n| `<Alert severity=\"warning\">` | `<WarningAlert>` |\n| `<Alert severity=\"error\">` | `<ErrorAlert>` |\n| `<Alert severity=\"info\" variant=\"filled\">` | `<InfoAlert variant=\"filled\">` |\n\n#### Chip Migration\n\n| Old MUI Code | New Lighthouse Code |\n|-------------|-------------------|\n| `<Chip color=\"default\">` | `<DefaultChip>` |\n| `<Chip color=\"primary\">` | `<PrimaryChip>` |\n| `<Chip color=\"success\">` | `<SuccessChip>` |\n| `<Chip color=\"error\">` | `<ErrorChip>` |\n| `<Chip color=\"warning\">` | `<WarningChip>` |\n| `<Chip color=\"info\">` | `<InfoChip>` |\n\n#### Typography Migration\n\n| Old MUI Code | New Lighthouse Code |\n|-------------|-------------------|\n| `<Typography variant=\"h1\">` | `<H1>` |\n| `<Typography variant=\"h2\">` | `<H2>` |\n| `<Typography variant=\"body1\">` | `<Body1>` |\n| `<Typography variant=\"body2\">` | `<Body2>` |\n| `<Typography variant=\"caption\">` | `<Caption>` |\n\n### Patterns (Coming Soon)\n\nReusable component combinations for common UI patterns:\n\n```tsx\nimport { FormField, ActionCard } from '@arcos-harmony/lighthouse-theme/patterns';\n\nfunction MyComponent() {\n  return (\n    <ActionCard\n      title=\"User Settings\"\n      actions={\n        <>\n          <SecondaryButton>Cancel</SecondaryButton>\n          <PrimaryButton>Save</PrimaryButton>\n        </>\n      }\n    >\n      <FormField\n        label=\"Email\"\n        helperText=\"Your email address\"\n        required\n      />\n    </ActionCard>\n  );\n}\n```\n\nSee `/src/patterns/README.md` for pattern guidelines and examples.\n\n### Typography\n\nSemantic typography components:\n\n```tsx\nimport { H1, H2, Body1, Caption } from '@arcos-harmony/web-theme-components';\n\nfunction Content() {\n  return (\n    <>\n      <H1>Main Heading</H1>\n      <H2>Subheading</H2>\n      <Body1>Body text goes here</Body1>\n      <Caption>Small caption text</Caption>\n    </>\n  );\n}\n```\n\n## 💡 Benefits of Wrapped Components\n\n1. **Type Safety**: Full TypeScript support with proper type inference\n2. **Semantic API**: `<ApproveButton>` is clearer and more maintainable than `<Button color=\"approve\">`\n3. **Design Tokens**: 1,714 design tokens automatically applied - no manual configuration needed\n4. **Easier Refactoring**: Change all approve buttons by updating one component definition\n5. **Better DX**: IDE autocomplete shows only relevant props for each semantic component\n6. **Consistent Theming**: All components guaranteed to use the same design system\n7. **Reduced Boilerplate**: Less props to pass, fewer decisions to make\n8. **Design System Compliance**: Enforces design system patterns across your application\n\n## 🔧 Advanced Usage\n\n### Full MUI API Access\n\nAll wrapped components support their complete MUI API. You can override defaults or use advanced features:\n\n```tsx\nimport { PrimaryButton, ErrorAlert, TextField } from '@arcos-harmony/lighthouse-theme';\n\n// Override variant on semantic button\n<PrimaryButton variant=\"outlined\" size=\"large\" startIcon={<SaveIcon />}>\n  Save Draft\n</PrimaryButton>\n\n// Override severity on semantic alert\n<ErrorAlert variant=\"filled\" onClose={() => {}}>\n  Custom error alert with close button\n</ErrorAlert>\n\n// Full TextField API available\n<TextField\n  fullWidth\n  multiline\n  rows={4}\n  helperText=\"Enter description\"\n  error={hasError}\n/>\n```\n\n### Using Generic Components\n\nWhen you need full control, use the generic components:\n\n```tsx\nimport { Button, Alert, Chip, Typography } from '@arcos-harmony/lighthouse-theme';\n\n// Full color control\n<Button color=\"primary\" variant=\"outlined\">Custom Button</Button>\n<Alert severity=\"info\" variant=\"standard\">Custom Alert</Alert>\n<Chip color=\"success\" variant=\"outlined\" label=\"Custom Chip\" />\n<Typography variant=\"h4\" color=\"textSecondary\">Custom Text</Typography>\n```\n\n### Mixing Semantic and Generic Components\n\nYou can mix both approaches in the same application:\n\n```tsx\nimport { \n  PrimaryButton,    // Semantic\n  Button,           // Generic\n  ErrorAlert,       // Semantic\n  Alert             // Generic\n} from '@arcos-harmony/lighthouse-theme';\n\nfunction MyComponent() {\n  return (\n    <>\n      {/* Use semantic for common cases */}\n      <PrimaryButton>Save</PrimaryButton>\n      <ErrorAlert>Error occurred</ErrorAlert>\n      \n      {/* Use generic for special cases */}\n      <Button color=\"warning\" variant=\"text\" size=\"small\">\n        Custom Action\n      </Button>\n      <Alert severity=\"info\" icon={<CustomIcon />}>\n        Custom alert with icon\n      </Alert>\n    </>\n  );\n}\n```\n\n## 📋 Complete Component List\n\n### Buttons (6 components)\n- `PrimaryButton`, `SecondaryButton`, `ApproveButton`, `DestructiveButton`, `TertiaryButton`, `Button`\n\n### Alerts (5 components)\n- `InfoAlert`, `SuccessAlert`, `WarningAlert`, `ErrorAlert`, `Alert`\n\n### Chips (8 components)\n- `DefaultChip`, `PrimaryChip`, `SecondaryChip`, `SuccessChip`, `ErrorChip`, `WarningChip`, `InfoChip`, `Chip`\n\n### Form Inputs (12 components)\n- `TextField`, `OutlinedTextField`, `FilledTextField`, `StandardTextField`\n- `Select`, `MenuItem`\n- `Checkbox`, `Radio`, `Switch`\n- `FormControl`, `FormLabel`, `FormHelperText`\n\n### Typography (11 components)\n- `H1`, `H2`, `H3`, `H4`, `H5`, `H6`\n- `Body1`, `Body2`, `Caption`, `Overline`, `Typography`\n\n### Layout (3 components)\n- `Card`, `Paper`, `Dialog`\n\n### Navigation (2 components)\n- `Tabs`, `Tab`\n\n### Other (2 components)\n- `Avatar`, `Snackbar`\n\n**Total: 49 wrapped components**\n\n## 📊 Quick Reference: All Component Mappings\n\n### Complete Component Map\n\n| Lighthouse Component | MUI Equivalent | Import From |\n|---------------------|----------------|-------------|\n| **Buttons** |\n| `PrimaryButton` | `<Button color=\"primary\" variant=\"contained\">` | `@arcos-harmony/lighthouse-theme` |\n| `SecondaryButton` | `<Button color=\"secondary\" variant=\"contained\">` | `@arcos-harmony/lighthouse-theme` |\n| `ApproveButton` | `<Button color=\"approve\" variant=\"contained\">` | `@arcos-harmony/lighthouse-theme` |\n| `DestructiveButton` | `<Button color=\"destructive\" variant=\"contained\">` | `@arcos-harmony/lighthouse-theme` |\n| `TertiaryButton` | `<Button color=\"tertiary\" variant=\"contained\">` | `@arcos-harmony/lighthouse-theme` |\n| `Button` | `<Button>` | `@arcos-harmony/lighthouse-theme` |\n| **Alerts** |\n| `InfoAlert` | `<Alert severity=\"info\">` | `@arcos-harmony/lighthouse-theme` |\n| `SuccessAlert` | `<Alert severity=\"success\">` | `@arcos-harmony/lighthouse-theme` |\n| `WarningAlert` | `<Alert severity=\"warning\">` | `@arcos-harmony/lighthouse-theme` |\n| `ErrorAlert` | `<Alert severity=\"error\">` | `@arcos-harmony/lighthouse-theme` |\n| `Alert` | `<Alert>` | `@arcos-harmony/lighthouse-theme` |\n| **Chips** |\n| `DefaultChip` | `<Chip color=\"default\">` | `@arcos-harmony/lighthouse-theme` |\n| `PrimaryChip` | `<Chip color=\"primary\">` | `@arcos-harmony/lighthouse-theme` |\n| `SecondaryChip` | `<Chip color=\"secondary\">` | `@arcos-harmony/lighthouse-theme` |\n| `SuccessChip` | `<Chip color=\"success\">` | `@arcos-harmony/lighthouse-theme` |\n| `ErrorChip` | `<Chip color=\"error\">` | `@arcos-harmony/lighthouse-theme` |\n| `WarningChip` | `<Chip color=\"warning\">` | `@arcos-harmony/lighthouse-theme` |\n| `InfoChip` | `<Chip color=\"info\">` | `@arcos-harmony/lighthouse-theme` |\n| `Chip` | `<Chip>` | `@arcos-harmony/lighthouse-theme` |\n| **Typography** |\n| `H1` | `<Typography variant=\"h1\">` | `@arcos-harmony/lighthouse-theme` |\n| `H2` | `<Typography variant=\"h2\">` | `@arcos-harmony/lighthouse-theme` |\n| `H3` | `<Typography variant=\"h3\">` | `@arcos-harmony/lighthouse-theme` |\n| `H4` | `<Typography variant=\"h4\">` | `@arcos-harmony/lighthouse-theme` |\n| `H5` | `<Typography variant=\"h5\">` | `@arcos-harmony/lighthouse-theme` |\n| `H6` | `<Typography variant=\"h6\">` | `@arcos-harmony/lighthouse-theme` |\n| `Body1` | `<Typography variant=\"body1\">` | `@arcos-harmony/lighthouse-theme` |\n| `Body2` | `<Typography variant=\"body2\">` | `@arcos-harmony/lighthouse-theme` |\n| `Caption` | `<Typography variant=\"caption\">` | `@arcos-harmony/lighthouse-theme` |\n| `Overline` | `<Typography variant=\"overline\">` | `@arcos-harmony/lighthouse-theme` |\n| `Typography` | `<Typography>` | `@arcos-harmony/lighthouse-theme` |\n| **Form Inputs** |\n| `TextField` | `<TextField>` | `@arcos-harmony/lighthouse-theme` |\n| `OutlinedTextField` | `<TextField variant=\"outlined\">` | `@arcos-harmony/lighthouse-theme` |\n| `FilledTextField` | `<TextField variant=\"filled\">` | `@arcos-harmony/lighthouse-theme` |\n| `StandardTextField` | `<TextField variant=\"standard\">` | `@arcos-harmony/lighthouse-theme` |\n| `Select` | `<Select>` | `@arcos-harmony/lighthouse-theme` |\n| `MenuItem` | `<MenuItem>` | `@arcos-harmony/lighthouse-theme` |\n| `Checkbox` | `<Checkbox>` | `@arcos-harmony/lighthouse-theme` |\n| `Radio` | `<Radio>` | `@arcos-harmony/lighthouse-theme` |\n| `Switch` | `<Switch>` | `@arcos-harmony/lighthouse-theme` |\n| `FormControl` | `<FormControl>` | `@arcos-harmony/lighthouse-theme` |\n| `FormLabel` | `<FormLabel>` | `@arcos-harmony/lighthouse-theme` |\n| `FormHelperText` | `<FormHelperText>` | `@arcos-harmony/lighthouse-theme` |\n| **Layout** |\n| `Card` | `<Card>` | `@arcos-harmony/lighthouse-theme` |\n| `Paper` | `<Paper>` | `@arcos-harmony/lighthouse-theme` |\n| `Dialog` | `<Dialog>` | `@arcos-harmony/lighthouse-theme` |\n| **Navigation** |\n| `Tabs` | `<Tabs>` | `@arcos-harmony/lighthouse-theme` |\n| `Tab` | `<Tab>` | `@arcos-harmony/lighthouse-theme` |\n| **Other** |\n| `Avatar` | `<Avatar>` | `@arcos-harmony/lighthouse-theme` |\n| `Snackbar` | `<Snackbar>` | `@arcos-harmony/lighthouse-theme` |\n\n### Import Patterns\n\n```tsx\n// Single import for multiple components\nimport { \n  PrimaryButton, \n  SecondaryButton, \n  TextField, \n  SuccessAlert \n} from '@arcos-harmony/lighthouse-theme';\n\n// Import from specific entry point (better tree-shaking)\nimport { PrimaryButton } from '@arcos-harmony/lighthouse-theme/components';\n\n// Import theme and styles\nimport { lightTheme } from '@arcos-harmony/lighthouse-theme/theme';\nimport '@arcos-harmony/lighthouse-theme/styles';\n```\n\n## 🤖 For AI Code Generators (Lovable, Cursor, etc.)\n\n### How to Use This Package in AI-Generated Code\n\nWhen generating React code with Material-UI, **replace standard MUI components** with Lighthouse semantic components:\n\n#### ✅ DO THIS (Recommended)\n\n```tsx\nimport { \n  PrimaryButton, \n  SecondaryButton, \n  DestructiveButton,\n  TextField,\n  SuccessAlert,\n  H1,\n  Body1\n} from '@arcos-harmony/lighthouse-theme';\n\nfunction UserProfile() {\n  return (\n    <>\n      <H1>User Profile</H1>\n      <Body1>Update your profile information below.</Body1>\n      \n      <TextField label=\"Full Name\" fullWidth />\n      <TextField label=\"Email\" type=\"email\" fullWidth />\n      \n      <PrimaryButton>Save Changes</PrimaryButton>\n      <SecondaryButton>Cancel</SecondaryButton>\n      <DestructiveButton>Delete Account</DestructiveButton>\n      \n      <SuccessAlert>Profile updated successfully!</SuccessAlert>\n    </>\n  );\n}\n```\n\n#### ❌ DON'T DO THIS (Standard MUI)\n\n```tsx\nimport { Button, TextField, Alert, Typography } from '@mui/material';\n\nfunction UserProfile() {\n  return (\n    <>\n      <Typography variant=\"h1\">User Profile</Typography>\n      <Typography variant=\"body1\">Update your profile information below.</Typography>\n      \n      <TextField label=\"Full Name\" fullWidth variant=\"outlined\" />\n      <TextField label=\"Email\" type=\"email\" fullWidth variant=\"outlined\" />\n      \n      <Button color=\"primary\" variant=\"contained\">Save Changes</Button>\n      <Button color=\"secondary\" variant=\"contained\">Cancel</Button>\n      <Button color=\"error\" variant=\"contained\">Delete Account</Button>\n      \n      <Alert severity=\"success\">Profile updated successfully!</Alert>\n    </>\n  );\n}\n```\n\n### Component Selection Rules for AI\n\n#### When generating buttons:\n- `color=\"primary\"` → Use `<PrimaryButton>`\n- `color=\"secondary\"` → Use `<SecondaryButton>`\n- `color=\"error\"` → Use `<DestructiveButton>`\n- `color=\"success\"` → Use `<ApproveButton>`\n- For delete/remove actions → Use `<DestructiveButton>`\n- For approve/confirm actions → Use `<ApproveButton>`\n\n#### When generating alerts:\n- `severity=\"info\"` → Use `<InfoAlert>`\n- `severity=\"success\"` → Use `<SuccessAlert>`\n- `severity=\"warning\"` → Use `<WarningAlert>`\n- `severity=\"error\"` → Use `<ErrorAlert>`\n\n#### When generating chips:\n- `color=\"default\"` → Use `<DefaultChip>`\n- `color=\"primary\"` → Use `<PrimaryChip>`\n- `color=\"success\"` → Use `<SuccessChip>`\n- `color=\"error\"` → Use `<ErrorChip>`\n- `color=\"warning\"` → Use `<WarningChip>`\n- `color=\"info\"` → Use `<InfoChip>`\n\n#### When generating typography:\n- `variant=\"h1\"` through `variant=\"h6\"` → Use `<H1>` through `<H6>`\n- `variant=\"body1\"` → Use `<Body1>`\n- `variant=\"body2\"` → Use `<Body2>`\n- `variant=\"caption\"` → Use `<Caption>`\n- `variant=\"overline\"` → Use `<Overline>`\n\n#### Form components:\n- Always use `<TextField>`, `<Select>`, `<MenuItem>`, `<Checkbox>`, `<Radio>`, `<Switch>` from `@arcos-harmony/lighthouse-theme`\n- Use `<FormControl>`, `<FormLabel>`, `<FormHelperText>` for form structure\n- No need to specify `variant=\"outlined\"` for TextField (it's the default)\n\n### Setup Template for AI Code Generation\n\nUse this boilerplate when starting a new component or app:\n\n```tsx\nimport React from 'react';\nimport { ThemeProvider, CssBaseline } from '@mui/material';\nimport { lightTheme } from '@arcos-harmony/lighthouse-theme';\nimport '@arcos-harmony/lighthouse-theme/styles';\nimport {\n  PrimaryButton,\n  SecondaryButton,\n  TextField,\n  H1,\n  Body1,\n  // ... other components as needed\n} from '@arcos-harmony/lighthouse-theme';\n\nfunction App() {\n  return (\n    <ThemeProvider theme={lightTheme}>\n      <CssBaseline />\n      {/* Your components here */}\n    </ThemeProvider>\n  );\n}\n\nexport default App;\n```\n\n### Key Points for AI Generation\n\n1. **Always import from `@arcos-harmony/lighthouse-theme`**, not `@mui/material`\n2. **Use semantic component names** (PrimaryButton, not Button with color prop)\n3. **Import theme and styles** in your root component\n4. **All MUI props are still available** - you can pass size, variant, onClick, etc.\n5. **Form validation, state management** work exactly the same as with MUI\n6. **No breaking changes** - this is a wrapper, not a replacement\n\n### Common AI Code Generation Patterns\n\n#### Login Form\n```tsx\nimport { \n  TextField, \n  PrimaryButton, \n  SecondaryButton,\n  H2,\n  Body2 \n} from '@arcos-harmony/lighthouse-theme';\n\nfunction LoginForm() {\n  return (\n    <>\n      <H2>Sign In</H2>\n      <Body2>Enter your credentials to continue</Body2>\n      \n      <TextField label=\"Email\" type=\"email\" fullWidth />\n      <TextField label=\"Password\" type=\"password\" fullWidth />\n      \n      <PrimaryButton fullWidth>Sign In</PrimaryButton>\n      <SecondaryButton fullWidth>Forgot Password?</SecondaryButton>\n    </>\n  );\n}\n```\n\n#### Dashboard Card\n```tsx\nimport { \n  Card, \n  H3, \n  Body1, \n  PrimaryButton,\n  SuccessChip \n} from '@arcos-harmony/lighthouse-theme';\n\nfunction DashboardCard({ title, status, description }) {\n  return (\n    <Card>\n      <H3>{title}</H3>\n      <SuccessChip label={status} />\n      <Body1>{description}</Body1>\n      <PrimaryButton>View Details</PrimaryButton>\n    </Card>\n  );\n}\n```\n\n#### Data Table Actions\n```tsx\nimport { \n  PrimaryButton, \n  SecondaryButton, \n  DestructiveButton \n} from '@arcos-harmony/lighthouse-theme';\n\nfunction TableActions({ onEdit, onView, onDelete }) {\n  return (\n    <>\n      <PrimaryButton size=\"small\" onClick={onEdit}>Edit</PrimaryButton>\n      <SecondaryButton size=\"small\" onClick={onView}>View</SecondaryButton>\n      <DestructiveButton size=\"small\" onClick={onDelete}>Delete</DestructiveButton>\n    </>\n  );\n}\n```\n\n## 🔗 Related Packages\n\n- **@arcos-harmony/design-tokens** - Raw design tokens (used internally)\n- **@mui/material** - Material-UI component library (peer dependency)\n\n## 📄 License\n\nMIT © ARCOS Inc.\n\n## 🤝 Contributing\n\nThis is an internal package for ARCOS Harmony design system. For issues or questions, please contact the design system team.\n\n---\n\n**Built with ❤️ by the ARCOS Design System Team**\n","readmeFilename":"README.md"}