{"_id":"@anarchitects/common-angular-design","_rev":"6-0a4f651a67e85fd9b53bd0de5742865e","name":"@anarchitects/common-angular-design","dist-tags":{"latest":"0.1.1"},"versions":{"0.0.1":{"name":"@anarchitects/common-angular-design","version":"0.0.1","_id":"@anarchitects/common-angular-design@0.0.1","maintainers":[{"name":"vrxj81","email":"johan@anarchitects.dev"}],"dist":{"shasum":"d225d7c2993c7d3fc47de3c1d7af28f38a6934e7","tarball":"https://registry.npmjs.org/@anarchitects/common-angular-design/-/common-angular-design-0.0.1.tgz","fileCount":21,"integrity":"sha512-8vNw0g82CPMqtddQ1jURWKIvKPAi6IxiLcITES6yj6efJp+K1JS3TB6q3fRIotE0Y7AtCVBXCe3v38bXpNOkvQ==","signatures":[{"sig":"MEUCICz9ea5HUuhTeqZIbL/H+3Ji4XRV18c9H1hDGVIs42fhAiEA6MaJVaKs517h5rS6GGcYPXpKyR8FHfrrWKUvlJQ1K94=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":59564},"module":"fesm2022/anarchitects-common-angular-design.mjs","exports":{".":{"types":"./types/anarchitects-common-angular-design.d.ts","default":"./fesm2022/anarchitects-common-angular-design.mjs"},"./config":{"types":"./types/anarchitects-common-angular-design-config.d.ts","default":"./fesm2022/anarchitects-common-angular-design-config.mjs"},"./styles":{"types":"./types/anarchitects-common-angular-design-styles.d.ts","default":"./fesm2022/anarchitects-common-angular-design-styles.mjs"},"./tokens":{"types":"./types/anarchitects-common-angular-design-tokens.d.ts","default":"./fesm2022/anarchitects-common-angular-design-tokens.mjs"},"./contracts":{"types":"./types/anarchitects-common-angular-design-contracts.d.ts","default":"./fesm2022/anarchitects-common-angular-design-contracts.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"ee887ca63337e863260838bd9ee22dc649dffbc8","typings":"types/anarchitects-common-angular-design.d.ts","_npmUser":{"name":"vrxj81","email":"johan@anarchitects.dev"},"_npmVersion":"10.9.4","description":"Reusable Angular design foundations for Anarchitecture bricks.","directories":{},"sideEffects":false,"_nodeVersion":"22.22.0","dependencies":{"tslib":"^2.3.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.0.0"},"_npmOperationalInternal":{"tmp":"tmp/common-angular-design_0.0.1_1773588684494_0.7940256040867129","host":"s3://npm-registry-packages-npm-production"},"deprecated":"Package no longer supported. Contact Support at https://www.npmjs.com/support for more info."},"0.0.2":{"name":"@anarchitects/common-angular-design","version":"0.0.2","_id":"@anarchitects/common-angular-design@0.0.2","maintainers":[{"name":"vrxj81","email":"johan@anarchitects.dev"}],"homepage":"https://github.com/anarchitects/anarchitecture-bricks-3tier/tree/main/libs/common/angular/design","bugs":{"url":"https://github.com/anarchitects/anarchitecture-bricks-3tier/issues"},"dist":{"shasum":"236f178228819dd5ab4cfc839cefcce2ec4a2c71","tarball":"https://registry.npmjs.org/@anarchitects/common-angular-design/-/common-angular-design-0.0.2.tgz","fileCount":21,"integrity":"sha512-MCyxKPFgMifEQNe2ZwsXYpK9wUAzkOY0DzcwE3bRJndxmz74OhqaEb1KRUZvGd+O6Pw6SeS+id4DJbgMShvjsg==","signatures":[{"sig":"MEYCIQC7J52i3R3EuwBkAp5YMPcFpuaaynvzk5+bY3aZSRnE0gIhAP1yHwObFM9pZbxXF72GV+mw81RGp/+mmHj+jqGpaK1y","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@anarchitects%2fcommon-angular-design@0.0.2","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":60737},"module":"fesm2022/anarchitects-common-angular-design.mjs","exports":{".":{"types":"./types/anarchitects-common-angular-design.d.ts","default":"./fesm2022/anarchitects-common-angular-design.mjs"},"./config":{"types":"./types/anarchitects-common-angular-design-config.d.ts","default":"./fesm2022/anarchitects-common-angular-design-config.mjs"},"./styles":{"types":"./types/anarchitects-common-angular-design-styles.d.ts","default":"./fesm2022/anarchitects-common-angular-design-styles.mjs"},"./tokens":{"types":"./types/anarchitects-common-angular-design-tokens.d.ts","default":"./fesm2022/anarchitects-common-angular-design-tokens.mjs"},"./contracts":{"types":"./types/anarchitects-common-angular-design-contracts.d.ts","default":"./fesm2022/anarchitects-common-angular-design-contracts.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"ec365290ab5f59c8b8d7190c1c92b4c8188041f6","typings":"types/anarchitects-common-angular-design.d.ts","_npmUser":{"name":"vrxj81","email":"johan@anarchitects.dev"},"repository":{"url":"git+https://github.com/anarchitects/anarchitecture-bricks-3tier.git","type":"git","directory":"libs/common/angular/design"},"_npmVersion":"10.9.4","description":"Reusable Angular design foundations for Anarchitecture bricks.","directories":{},"sideEffects":false,"_nodeVersion":"22.22.1","dependencies":{"tslib":"^2.3.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.0.0"},"_npmOperationalInternal":{"tmp":"tmp/common-angular-design_0.0.2_1774607922225_0.371054981942587","host":"s3://npm-registry-packages-npm-production"},"deprecated":"Package no longer supported. Contact Support at https://www.npmjs.com/support for more info."},"0.0.3":{"name":"@anarchitects/common-angular-design","version":"0.0.3","_id":"@anarchitects/common-angular-design@0.0.3","maintainers":[{"name":"vrxj81","email":"johan@anarchitects.dev"}],"homepage":"https://github.com/anarchitects/anarchitecture-bricks-3tier/tree/main/libs/common/angular/design","bugs":{"url":"https://github.com/anarchitects/anarchitecture-bricks-3tier/issues"},"dist":{"shasum":"e9495811b81b9fb6d810e9a17f92fb0e7ab02bae","tarball":"https://registry.npmjs.org/@anarchitects/common-angular-design/-/common-angular-design-0.0.3.tgz","fileCount":21,"integrity":"sha512-k4TXvM2IXgFhz+zfCwp0Mc2TJEOY2LZovb8gtLIod+2EQC+X1trMiVLwKaKJWHvV9aGL9o+Iwf5Hiv2b698TvA==","signatures":[{"sig":"MEMCIA1nx5Ndw892lb3uMIpAF8ZDTXZSVxSH/g4SiyQYfdWsAh8gh1XhzlvjtUIa87a2rOEe2/evajaAgcGG3Sw5Rh+5","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@anarchitects%2fcommon-angular-design@0.0.3","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":60737},"module":"fesm2022/anarchitects-common-angular-design.mjs","exports":{".":{"types":"./types/anarchitects-common-angular-design.d.ts","default":"./fesm2022/anarchitects-common-angular-design.mjs"},"./config":{"types":"./types/anarchitects-common-angular-design-config.d.ts","default":"./fesm2022/anarchitects-common-angular-design-config.mjs"},"./styles":{"types":"./types/anarchitects-common-angular-design-styles.d.ts","default":"./fesm2022/anarchitects-common-angular-design-styles.mjs"},"./tokens":{"types":"./types/anarchitects-common-angular-design-tokens.d.ts","default":"./fesm2022/anarchitects-common-angular-design-tokens.mjs"},"./contracts":{"types":"./types/anarchitects-common-angular-design-contracts.d.ts","default":"./fesm2022/anarchitects-common-angular-design-contracts.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"b517f35d18965302e17711e107bd16309abf3ef1","typings":"types/anarchitects-common-angular-design.d.ts","_npmUser":{"name":"vrxj81","email":"johan@anarchitects.dev"},"repository":{"url":"git+https://github.com/anarchitects/anarchitecture-bricks-3tier.git","type":"git","directory":"libs/common/angular/design"},"_npmVersion":"10.9.4","description":"Reusable Angular design foundations for Anarchitecture bricks.","directories":{},"sideEffects":false,"_nodeVersion":"22.22.1","dependencies":{"tslib":"^2.3.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.0.0"},"_npmOperationalInternal":{"tmp":"tmp/common-angular-design_0.0.3_1774814843573_0.05981035175302685","host":"s3://npm-registry-packages-npm-production"},"deprecated":"Package no longer supported. Contact Support at https://www.npmjs.com/support for more info."},"0.1.0":{"name":"@anarchitects/common-angular-design","version":"0.1.0","_id":"@anarchitects/common-angular-design@0.1.0","maintainers":[{"name":"vrxj81","email":"johan@anarchitects.dev"}],"homepage":"https://github.com/anarchitects/anarchitecture-bricks-3tier/tree/main/libs/common/angular/design","bugs":{"url":"https://github.com/anarchitects/anarchitecture-bricks-3tier/issues"},"dist":{"shasum":"3807d85373fb35950341140755766d89783ca176","tarball":"https://registry.npmjs.org/@anarchitects/common-angular-design/-/common-angular-design-0.1.0.tgz","fileCount":21,"integrity":"sha512-x/oGJXy6dwC4KVNZElJUvXmt8mBQmUDUmSaNPjMf/S7eTrpouL+aPn5Q+M/kcbSSFypeBv54f+g8BMYK82tEOw==","signatures":[{"sig":"MEYCIQDphOfzz366nGQWq12v+q18oh1dG/F3v+Zm0Lrv5NTNBgIhALpxyI11r7y06MBU3QRi/GJ9g4aaWVqquYNWyvuTw0NM","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@anarchitects%2fcommon-angular-design@0.1.0","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":98039},"module":"fesm2022/anarchitects-common-angular-design.mjs","exports":{".":{"types":"./types/anarchitects-common-angular-design.d.ts","default":"./fesm2022/anarchitects-common-angular-design.mjs"},"./config":{"types":"./types/anarchitects-common-angular-design-config.d.ts","default":"./fesm2022/anarchitects-common-angular-design-config.mjs"},"./styles":{"types":"./types/anarchitects-common-angular-design-styles.d.ts","default":"./fesm2022/anarchitects-common-angular-design-styles.mjs"},"./tokens":{"types":"./types/anarchitects-common-angular-design-tokens.d.ts","default":"./fesm2022/anarchitects-common-angular-design-tokens.mjs"},"./contracts":{"types":"./types/anarchitects-common-angular-design-contracts.d.ts","default":"./fesm2022/anarchitects-common-angular-design-contracts.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"538b17d1113c2b6dd320d8faaeb9ecf2b835d6dd","typings":"types/anarchitects-common-angular-design.d.ts","_npmUser":{"name":"vrxj81","email":"johan@anarchitects.dev"},"repository":{"url":"git+https://github.com/anarchitects/anarchitecture-bricks-3tier.git","type":"git","directory":"libs/common/angular/design"},"_npmVersion":"10.9.4","description":"Reusable Angular design foundations for Anarchitecture bricks.","directories":{},"sideEffects":false,"_nodeVersion":"22.22.1","dependencies":{"tslib":"^2.3.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.0.0","@angular/common":"^21.0.0"},"_npmOperationalInternal":{"tmp":"tmp/common-angular-design_0.1.0_1775031459045_0.7588881236909499","host":"s3://npm-registry-packages-npm-production"},"deprecated":"Package no longer supported. Contact Support at https://www.npmjs.com/support for more info."},"0.1.1":{"name":"@anarchitects/common-angular-design","version":"0.1.1","_id":"@anarchitects/common-angular-design@0.1.1","maintainers":[{"name":"vrxj81","email":"johan@anarchitects.dev"}],"homepage":"https://github.com/anarchitects/anarchitecture-bricks-3tier/tree/main/libs/common/angular/design","bugs":{"url":"https://github.com/anarchitects/anarchitecture-bricks-3tier/issues"},"dist":{"shasum":"f87c3f6769505025221c3587dc1c8de702a0ff4e","tarball":"https://registry.npmjs.org/@anarchitects/common-angular-design/-/common-angular-design-0.1.1.tgz","fileCount":21,"integrity":"sha512-9j/VLzxesADYah+4phUc/vG0rrRFUvF54ApDzpvvZJahtJERO3GyYP847QEQibXLzxaKBAw+BY4eeWSx8P4SMQ==","signatures":[{"sig":"MEYCIQD0NEFhLgj/48Rif1kVarPkk6/ER8usvzvRXoR/1ub28AIhANefL4LjxxjEwwwFkhoBay/p/+oT//SsJkbTOsLE7L0c","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@anarchitects%2fcommon-angular-design@0.1.1","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":98674},"type":"module","module":"fesm2022/anarchitects-common-angular-design.mjs","exports":{".":{"types":"./types/anarchitects-common-angular-design.d.ts","default":"./fesm2022/anarchitects-common-angular-design.mjs"},"./config":{"types":"./types/anarchitects-common-angular-design-config.d.ts","default":"./fesm2022/anarchitects-common-angular-design-config.mjs"},"./styles":{"types":"./types/anarchitects-common-angular-design-styles.d.ts","default":"./fesm2022/anarchitects-common-angular-design-styles.mjs"},"./tokens":{"types":"./types/anarchitects-common-angular-design-tokens.d.ts","default":"./fesm2022/anarchitects-common-angular-design-tokens.mjs"},"./contracts":{"types":"./types/anarchitects-common-angular-design-contracts.d.ts","default":"./fesm2022/anarchitects-common-angular-design-contracts.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"2d6a4b3ada94f466ae25aa0f78c308f34f232b90","typings":"types/anarchitects-common-angular-design.d.ts","_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:800b16d5-4378-4cb0-8899-241ce6d59931"}},"repository":{"url":"git+https://github.com/anarchitects/anarchitecture-bricks-3tier.git","type":"git","directory":"libs/common/angular/design"},"_npmVersion":"11.17.0","description":"> Transition status: retained for the final compatibility line; do not adopt for new work. The package is > scheduled for source removal and later npm deprecation under > [ADR-0003](../../../../docs/adr/0003-adopt-tailwind-v4-frontend-foundation-and-retir","directories":{},"sideEffects":false,"_nodeVersion":"24.19.0","dependencies":{"tslib":"^2.3.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"peerDependencies":{"@angular/core":"^21.0.0 || ^22.0.0","@angular/common":"^21.0.0 || ^22.0.0"},"_npmOperationalInternal":{"tmp":"tmp/common-angular-design_0.1.1_1788352860551_0.5398848557219067","host":"s3://npm-registry-packages-npm-production"},"deprecated":"Package no longer supported. Contact Support at https://www.npmjs.com/support for more info."}},"time":{"created":"2026-03-15T15:31:24.423Z","modified":"2026-09-04T13:10:49.244Z","0.0.1":"2026-03-15T15:31:24.640Z","0.0.2":"2026-03-27T10:38:42.378Z","0.0.3":"2026-03-29T20:07:23.714Z","0.1.0":"2026-04-01T08:17:39.177Z","0.1.1":"2026-09-02T12:41:00.675Z"},"bugs":{"url":"https://github.com/anarchitects/anarchitecture-bricks-3tier/issues"},"homepage":"https://github.com/anarchitects/anarchitecture-bricks-3tier/tree/main/libs/common/angular/design","repository":{"url":"git+https://github.com/anarchitects/anarchitecture-bricks-3tier.git","type":"git","directory":"libs/common/angular/design"},"description":"> Transition status: retained for the final compatibility line; do not adopt for new work. The package is > scheduled for source removal and later npm deprecation under > [ADR-0003](../../../../docs/adr/0003-adopt-tailwind-v4-frontend-foundation-and-retir","maintainers":[{"name":"vrxj81","email":"johan@anarchitects.dev"}],"readme":"# @anarchitects/common-angular-design\n\n> Transition status: retained for the final compatibility line; do not adopt for new work. The package is\n> scheduled for source removal and later npm deprecation under\n> [ADR-0003](../../../../docs/adr/0003-adopt-tailwind-v4-frontend-foundation-and-retire-common-angular-ui-packages.md).\n> Published versions will not be unpublished.\n\nReusable Angular design foundations for Anarchitecture bricks.\n\nThis package provides the design contract foundation: tokens, semantic hook\nconventions, base scoped styles, and typed configuration providers. It is\nintentionally unbranded and extensible for consumer applications.\n\n## Features\n\n- Typed design-system config providers for theme, density, surface, and layout defaults\n- Explicit root-host directive for syncing theme, density, and surface to DOM attributes\n- Shared semantic token contracts for cross-library visual consistency\n- Base styles and semantic hooks designed for consumer override\n- Package-author rules for shell utility class boundaries\n\n## Installation\n\n```bash\nnpm install @anarchitects/common-angular-design\n# or\nyarn add @anarchitects/common-angular-design\n```\n\n## Entry points\n\n- `@anarchitects/common-angular-design/config`\n  - Typed provider helpers and injection tokens (`provideDesignSystemConfig`)\n- `@anarchitects/common-angular-design/tokens`\n  - Typed CSS custom property names and default token values\n- `@anarchitects/common-angular-design/contracts`\n  - Stable data-attribute and semantic-class contracts\n- `@anarchitects/common-angular-design/styles`\n  - Base stylesheet contract and package-author class rules\n\n## Shell Utility Class Contract\n\nSource-of-truth symbols in `contracts`:\n\n- `ANX_SHELL_UTILITY_CLASSNAMES`\n- `ANX_DESIGN_HOOK_CLASSNAMES`\n- `ANX_SEMANTIC_CLASSNAMES` (backward-compatible union)\n- `isAnxShellUtilityClass(...)`\n\nPackage-author rule in `styles`:\n\n- `ANX_PACKAGE_AUTHOR_RULES.forbiddenOnComponentHost`\n\nShell utility classes (`anx-region`, `anx-stack`, `anx-inline`, `anx-grid`) are\nconsumer shell layout classes and must not be applied to shared package\ncomponent hosts. Use explicit `:host` CSS for component-internal spacing.\n\n## Consumer extensibility model\n\nCore is closed around naming and contracts.\nConsumers extend at the edges by:\n\n1. Overriding semantic tokens (`--anx-sys-*`, `--anx-layout-*`)\n2. Defining app-specific themes under `data-anx-theme=\"...\"`\n3. Wrapping shared primitives/layouts in app-level components later\n4. Applying app-specific styles without modifying core libraries\n\n## Quickstart\n\n### 1) Apply base styles before render\n\n```ts\nimport { applyAnxBaseStyles } from '@anarchitects/common-angular-design/styles';\n\napplyAnxBaseStyles();\n```\n\n### 2) Register context defaults\n\n```ts\nimport { provideDesignSystemConfig } from '@anarchitects/common-angular-design/config';\n\nexport const appConfig = {\n  providers: [\n    ...provideDesignSystemConfig({\n      theme: 'default',\n      density: 'comfortable',\n      surface: 'plain',\n      layout: 'list',\n      columns: 1,\n    }),\n  ],\n};\n```\n\n### 3) Keep shell classes in consumer wrappers\n\n```html\n<section class=\"anx-region anx-stack\" data-anx-layout=\"list\" data-anx-columns=\"1\">\n  <h2 class=\"anx-heading\">Contact</h2>\n  <p class=\"anx-text\">A neutral foundation, ready for consumer theming.</p>\n</section>\n```\n\n`provideDesignSystemConfig(...)` applies `anx-root`, `data-anx-theme`,\n`data-anx-density`, and `data-anx-surface` to `document.documentElement`\nautomatically during bootstrap.\n\n`data-anx-layout` and `data-anx-columns` remain explicit where local layout\nscoping is needed.\n\nUse `anarchitectsDesignRoot` only when a subtree needs explicit local theme,\ndensity, or surface overrides.\n\nExisting apps can keep manual `data-anx-theme`, `data-anx-density`, and\n`data-anx-surface` attributes during migration. Explicit manual attributes stay\nauthoritative over provider-derived defaults.\n\n## Usage\n\nUse this package as the root design contract for shared Angular UI libraries.\nApply base styles once, configure provider defaults at app bootstrap, and keep\nshell utility classes in consumer wrappers rather than shared package hosts.\n\n## Validation workflow\n\nFor shell/layout contract migration checks:\n\n1. `yarn nx run guardrails:test`\n2. `yarn nx run forms-angular-ui:test --testFile=libs/forms/angular/ui/src/form.spec.ts`\n3. `yarn nx run docs-hub:validate-content`\n4. `yarn nx run docs-hub:build`\n5. `yarn nx run docs-hub:verify`\n\n## Documentation\n\n- System guide: `docs/guides/design-ui-systems.md`\n- Migration guide: `docs/guides/theme-migration.md`\n\n## Development notes\n\n- Keep this package unbranded and contract-first.\n- Add new tokens and semantic hooks only when they generalize across multiple domains.\n- Prefer consumer extension points over package-specific styling decisions.\n","readmeFilename":"README.md"}