{"_id":"@4i4/starter-theme","_rev":"5-0d06d4bfbd7918ff5a1a1a4267eb661b","name":"@4i4/starter-theme","dist-tags":{"latest":"0.1.3"},"versions":{"0.1.0":{"name":"@4i4/starter-theme","version":"0.1.0","author":{"name":"Petyo Stoyanov","email":"petyosv@gmail.com"},"license":"MIT","_id":"@4i4/starter-theme@0.1.0","maintainers":[{"name":"petyosv","email":"petyosv@gmail.com"}],"dist":{"shasum":"a57921531253e96a3b9f38279aca39abfa8074ae","tarball":"https://registry.npmjs.org/@4i4/starter-theme/-/starter-theme-0.1.0.tgz","fileCount":2,"integrity":"sha512-WcZV4Ub+L5JMw1Q3Xsgzvq0c6TM2x6BjeS6lHEISnu/blMPqtLE3TAY4pK+7rDMLc+aX1EzVqd6LscoFWVtoBQ==","signatures":[{"sig":"MEUCICwtZGO3naSih8KdcHhNccGJ7qrVIfEYj7eScgh5vHE7AiEAwvTjN5fcMYX0Qtwf0F0wJ1Nj8VQodCyv+zgvlIJlt3o=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":3817},"main":"./dist/cjs/index.js","types":"./dist/index.d.ts","module":"./dist/esm/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"}},"gitHead":"2e0da79cd781667cea1a244d79d2971a2f1203af","scripts":{"build":"npm run clean && rollup -c","clean":"rimraf dist","start":"rollup -c -w"},"_npmUser":{"name":"petyosv","email":"petyosv@gmail.com"},"_npmVersion":"10.8.2","description":"Base layout theme primitives shared across @4i4 themes.","directories":{},"_nodeVersion":"20.18.2","_hasShrinkwrap":false,"devDependencies":{"next":"^14.0.0","react":"^18.2.0","rimraf":"^5.0.5","rollup":"^3.29.4","typescript":"^5.4.2","@types/react":"^18.2.74","@4i4/registry":"^1.0.0","rollup-plugin-dts":"^5.3.0","styled-components":"^6.1.11","@4i4/theme-registry":"^1.1.5","@rollup/plugin-terser":"^0.4.4","@types/styled-components":"^5.1.34","@rollup/plugin-typescript":"^11.1.6","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"next":"^13.5.0 || ^14.0.0","react":"^18.2.0 || ^19.0.0","@4i4/registry":"^1.0.0","styled-components":"^5.3.0 || ^6.0.0","@4i4/theme-registry":"^1.1.5"},"_npmOperationalInternal":{"tmp":"tmp/starter-theme_0.1.0_1761083336696_0.12079393920620385","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@4i4/starter-theme","version":"0.1.1","author":{"name":"Petyo Stoyanov","email":"petyosv@gmail.com"},"license":"MIT","_id":"@4i4/starter-theme@0.1.1","maintainers":[{"name":"petyosv","email":"petyosv@gmail.com"}],"dist":{"shasum":"4a5ae671edc2b2ce3944fec503320eec121be2b3","tarball":"https://registry.npmjs.org/@4i4/starter-theme/-/starter-theme-0.1.1.tgz","fileCount":435,"integrity":"sha512-Vswd1VWN+FQgr16dTvN9eQhDvejZ2I2SDVgPOU/uWdVbXGZ+MKpt9APV9Wur7+eKQxf6cTyNquHC/Fiw2EutgQ==","signatures":[{"sig":"MEYCIQDZlihcMd/qC4lME8YzOMNagM0ph27clIfYR/KfVL8IQQIhAJb2ZWrcEHxQKc4JgXWUdvocg4yhjyYLQKU0oqi/T44j","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":5852471},"main":"./dist/cjs/index.js","types":"./dist/index.d.ts","module":"./dist/esm/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"}},"gitHead":"0f807c1b2df23aa56bbba80c5a26ab018103f1c3","scripts":{"build":"npm run clean && rollup -c","clean":"rimraf dist","start":"rollup -c -w"},"_npmUser":{"name":"petyosv","email":"petyosv@gmail.com"},"_npmVersion":"10.8.2","description":"Base layout theme primitives shared across @4i4 themes.","directories":{},"_nodeVersion":"20.18.2","_hasShrinkwrap":false,"devDependencies":{"next":"^14.0.0","react":"^18.2.0","rimraf":"^5.0.5","rollup":"^3.29.4","typescript":"^5.4.2","@types/react":"^18.2.74","@4i4/registry":"^1.0.0","react-hook-form":"^7.50.0","rollup-plugin-dts":"^5.3.0","styled-components":"^6.1.11","@4i4/theme-toolkit":"*","@4i4/theme-registry":"^1.1.12","@rollup/plugin-json":"^6.1.0","@rollup/plugin-terser":"^0.4.4","@types/styled-components":"^5.1.34","@rollup/plugin-typescript":"^11.1.6","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"next":"^13.5.0 || ^14.0.0","react":"^18.2.0 || ^19.0.0","@4i4/registry":"^1.0.0","react-hook-form":"^7.50.0","styled-components":"^5.3.0 || ^6.0.0","@4i4/theme-toolkit":"*","@4i4/theme-registry":"^1.1.12"},"_npmOperationalInternal":{"tmp":"tmp/starter-theme_0.1.1_1761134797540_0.3179893876817319","host":"s3://npm-registry-packages-npm-production"}},"0.1.2":{"name":"@4i4/starter-theme","version":"0.1.2","author":{"name":"Petyo Stoyanov","email":"petyosv@gmail.com"},"license":"MIT","_id":"@4i4/starter-theme@0.1.2","maintainers":[{"name":"petyosv","email":"petyosv@gmail.com"}],"dist":{"shasum":"19c5011e0713e1e5881977e7f825e05ae311c0d8","tarball":"https://registry.npmjs.org/@4i4/starter-theme/-/starter-theme-0.1.2.tgz","fileCount":435,"integrity":"sha512-SxWAiUBxGWByxo81/AbnSaLJfI6XSWnVFQH50kORlS/GxMvzcfwHi4f4yB/BCqg6ssOGA22sE3KA+RNyTPZNQQ==","signatures":[{"sig":"MEYCIQDYVT3GPyxzlv1honCTU/fmRbq5zQfH8qyRCRmqv+92hgIhANp/uciJPsUJ7cpWgFBpOLJJsAu19DdvezwQ2Oi5y8xg","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":5852581},"main":"./dist/cjs/index.js","types":"./dist/index.d.ts","module":"./dist/esm/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/esm/index.js","require":"./dist/cjs/index.js"}},"gitHead":"0fc9624f2d791568089b059d0f33863ba6ae27ce","scripts":{"build":"npm run clean && rollup -c","clean":"rimraf dist","start":"rollup -c -w"},"_npmUser":{"name":"petyosv","email":"petyosv@gmail.com"},"_npmVersion":"10.8.2","description":"Base layout theme primitives shared across @4i4 themes.","directories":{},"_nodeVersion":"20.18.2","_hasShrinkwrap":false,"devDependencies":{"next":"^14.0.0","react":"^18.2.0","rimraf":"^5.0.5","rollup":"^3.29.4","typescript":"^5.4.2","@types/react":"^18.2.74","@4i4/registry":"^1.0.0","react-hook-form":"^7.50.0","rollup-plugin-dts":"^5.3.0","styled-components":"^6.1.11","@4i4/theme-toolkit":"*","@4i4/theme-registry":"^1.1.12","@rollup/plugin-json":"^6.1.0","@rollup/plugin-terser":"^0.4.4","@types/styled-components":"^5.1.34","@rollup/plugin-typescript":"^11.1.6","rollup-plugin-peer-deps-external":"^2.2.4"},"peerDependencies":{"next":"^13.5.0 || ^14.0.0","react":"^18.2.0 || ^19.0.0","@4i4/registry":"^1.0.0","react-hook-form":"^7.50.0","styled-components":"^5.3.0 || ^6.0.0","@4i4/theme-toolkit":"*","@4i4/theme-registry":"^1.1.12"},"_npmOperationalInternal":{"tmp":"tmp/starter-theme_0.1.2_1761136610791_0.7067829119266085","host":"s3://npm-registry-packages-npm-production"}},"0.1.3":{"name":"@4i4/starter-theme","version":"0.1.3","description":"Base layout theme primitives shared across @4i4 themes.","author":{"name":"Petyo Stoyanov","email":"petyosv@gmail.com"},"license":"MIT","main":"./dist/cjs/index.js","module":"./dist/esm/index.js","types":"./dist/index.d.ts","scripts":{"build":"npm run clean && rollup -c","clean":"rimraf dist","start":"rollup -c -w"},"exports":{".":{"import":"./dist/esm/index.js","require":"./dist/cjs/index.js","types":"./dist/index.d.ts"}},"peerDependencies":{"@4i4/registry":"^1.0.0","@4i4/theme-registry":"^1.1.12","@4i4/theme-toolkit":"*","next":"^13.5.0 || ^14.0.0","react":"^18.2.0 || ^19.0.0","styled-components":"^5.3.0 || ^6.0.0","react-hook-form":"^7.50.0"},"devDependencies":{"@4i4/registry":"^1.0.0","@4i4/theme-registry":"^1.1.12","@4i4/theme-toolkit":"*","@rollup/plugin-json":"^6.1.0","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-typescript":"^11.1.6","@types/react":"^18.2.74","@types/styled-components":"^5.1.34","next":"^14.0.0","react":"^18.2.0","rimraf":"^5.0.5","rollup":"^3.29.4","rollup-plugin-dts":"^5.3.0","rollup-plugin-peer-deps-external":"^2.2.4","styled-components":"^6.1.11","typescript":"^5.4.2","react-hook-form":"^7.50.0"},"_id":"@4i4/starter-theme@0.1.3","gitHead":"5df233e277228e153a3273e4ed3ef9d38dcce077","_nodeVersion":"20.18.2","_npmVersion":"10.8.2","dist":{"integrity":"sha512-rALoC+Pj4f4B38+tiMrbg2J/ykh+MsPruES4/DXt8UkvY7e+5mmmtnxIK4nRPvZ8bmfFOlpft73HzdpRIiS6dA==","shasum":"8d9384737b593519dea3dcc4164d73ee3fd5401d","tarball":"https://registry.npmjs.org/@4i4/starter-theme/-/starter-theme-0.1.3.tgz","fileCount":435,"unpackedSize":5853049,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQDuAyJwq/vwTSShH4eDo5+/4XDfyf7eAz/TWtbna5D97gIhAKnbHkMl17u/clN1waxJ6OAQrJDkzl8isA4MApuChtqY"}]},"_npmUser":{"name":"petyosv","email":"petyosv@gmail.com"},"directories":{},"maintainers":[{"name":"petyosv","email":"petyosv@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/starter-theme_0.1.3_1761430237145_0.126290192178804"},"_hasShrinkwrap":false}},"time":{"created":"2025-10-21T21:48:56.695Z","modified":"2025-10-25T22:10:37.636Z","0.1.0":"2025-10-21T21:48:56.907Z","0.1.1":"2025-10-22T12:06:37.789Z","0.1.2":"2025-10-22T12:36:51.043Z","0.1.3":"2025-10-25T22:10:37.419Z"},"author":{"name":"Petyo Stoyanov","email":"petyosv@gmail.com"},"license":"MIT","description":"Base layout theme primitives shared across @4i4 themes.","maintainers":[{"name":"petyosv","email":"petyosv@gmail.com"}],"readme":"# @4i4/starter-theme\n\n> Base layout theme extracted from the Moto React application. The package exposes the shared layout templates and helpers that other themes can extend.\n\n## Development\n\n```bash\npnpm install\npnpm build\n```\n\nThe build step emits ESM and CJS bundles under `dist/` with the original module structure preserved so Next.js dynamic imports keep working.\n\n## Extending Colors in Child Themes\n\nChild themes can import the palette helpers and build their own color tokens while still using the shared layout primitives:\n\n```ts\nimport {\n  buildPalettes,\n  buildButtons,\n  container,\n  media,\n  buildColumn,\n} from \"@4i4/starter-theme\";\n\nconst breakpoints = { xs: 0, sm: 576, md: 768, lg: 992, xl: 1280 };\n\nconst palettes = {\n  primary: { main: \"#0057ff\", text: \"#ffffff\" },\n  secondary: { main: \"#ffb400\", text: \"#1d1d1d\" },\n  accent: { main: \"#6c5ce7\", text: \"#ffffff\" },\n};\n\nconst theme = {\n  palettes: buildPalettes(palettes),\n  media: media(breakpoints),\n  container: container(breakpoints),\n  column: buildColumn(12, breakpoints),\n  buttons: buildButtons([\"primary\", \"secondary\", \"accent\"]),\n};\n```\n\nThe starter theme now sources these layout helpers from `@4i4/theme-toolkit`, so you can import them directly from that package if you already depend on it elsewhere.\n\nAny palette entry can omit the darker or lighter shades and they will be derived from the `main` color automatically. New palette keys become available through CSS variables like `var(--color-accent)` and by listing them in `buildButtons`.\n\n## Theme Settings via `_settings`\n\n`@4i4/starter-theme` ships its defaults (palette, breakpoints, button order, and grid) through the `_settings` scope. The generated `theme.json` already lists those modules:\n\n```json\n{\n  \"settings\": {\n    \"palette\": \"./settings/palette\",\n    \"breakpoints\": \"./settings/breakpoints\",\n    \"buttons\": \"./settings/buttons\",\n    \"grid\": \"./settings/grid\"\n  }\n}\n```\n\nInside your runtime code you can hydrate the theme via `useThemeSettings` while keeping access to the package defaults:\n\n```ts\nimport { useThemeSettings } from \"@4i4/theme-registry\";\nimport {\n  starterSettingsDefaults,\n  type StarterSettings,\n} from \"@4i4/starter-theme\";\n\nconst palette = useThemeSettings<StarterSettings>(\n  \"palette\",\n  starterSettingsDefaults,\n);\nconst breakpoints = useThemeSettings<StarterSettings>(\n  \"breakpoints\",\n  starterSettingsDefaults,\n);\n```\n\nChild themes can override any of these entries by calling `registry.set(\"palette\", overrideObject, \"_settings\")` before rendering. Only the overridden keys need to be provided—the hook merges them with the defaults shipped by the starter theme.\n","readmeFilename":"README.md"}