Implement complete semantic layer for all design tokens including typography, spacing, motion, colors, borders, shadows, z-index, opacity, and glass effects. Each semantic token maps base design tokens to contextual usage patterns for improved maintainability and developer experience. Features: - Complete semantic typography system with font weights, sizes, line heights, and letter spacing - Comprehensive spacing tokens for components, layouts, and interactions - Full motion system with durations, easing, transitions, and hover transforms - Semantic color system with individual access to all Material Design 3 colors - Border tokens with widths, radius, and styles for all use cases - Shadow system including standard and AI-themed shadows - Z-index layering system for proper stacking context - Opacity tokens for transparency and visibility states - Glass morphism tokens with blur, opacity, and theming support All semantic tokens provide direct access to base token values while offering meaningful contextual aliases for common UI patterns. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
202 lines
5.9 KiB
JSON
202 lines
5.9 KiB
JSON
{
|
|
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
|
|
"version": 1,
|
|
"newProjectRoot": "projects",
|
|
"projects": {
|
|
"shared-ui": {
|
|
"projectType": "library",
|
|
"root": "projects/shared-ui",
|
|
"sourceRoot": "projects/shared-ui/src",
|
|
"prefix": "lib",
|
|
"architect": {
|
|
"build": {
|
|
"builder": "@angular-devkit/build-angular:ng-packagr",
|
|
"options": {
|
|
"project": "projects/shared-ui/ng-package.json"
|
|
},
|
|
"configurations": {
|
|
"production": {
|
|
"tsConfig": "projects/shared-ui/tsconfig.lib.prod.json"
|
|
},
|
|
"development": {
|
|
"tsConfig": "projects/shared-ui/tsconfig.lib.json"
|
|
}
|
|
},
|
|
"defaultConfiguration": "production"
|
|
},
|
|
"test": {
|
|
"builder": "@angular-devkit/build-angular:karma",
|
|
"options": {
|
|
"tsConfig": "projects/shared-ui/tsconfig.spec.json",
|
|
"polyfills": [
|
|
"zone.js",
|
|
"zone.js/testing"
|
|
]
|
|
}
|
|
}
|
|
}
|
|
},
|
|
"shared-utils": {
|
|
"projectType": "library",
|
|
"root": "projects/shared-utils",
|
|
"sourceRoot": "projects/shared-utils/src",
|
|
"prefix": "lib",
|
|
"architect": {
|
|
"build": {
|
|
"builder": "@angular-devkit/build-angular:ng-packagr",
|
|
"options": {
|
|
"project": "projects/shared-utils/ng-package.json"
|
|
},
|
|
"configurations": {
|
|
"production": {
|
|
"tsConfig": "projects/shared-utils/tsconfig.lib.prod.json"
|
|
},
|
|
"development": {
|
|
"tsConfig": "projects/shared-utils/tsconfig.lib.json"
|
|
}
|
|
},
|
|
"defaultConfiguration": "production"
|
|
},
|
|
"test": {
|
|
"builder": "@angular-devkit/build-angular:karma",
|
|
"options": {
|
|
"tsConfig": "projects/shared-utils/tsconfig.spec.json",
|
|
"polyfills": [
|
|
"zone.js",
|
|
"zone.js/testing"
|
|
]
|
|
}
|
|
}
|
|
}
|
|
},
|
|
"ui-essentials": {
|
|
"projectType": "library",
|
|
"root": "projects/ui-essentials",
|
|
"sourceRoot": "projects/ui-essentials/src",
|
|
"prefix": "lib",
|
|
"architect": {
|
|
"build": {
|
|
"builder": "@angular-devkit/build-angular:ng-packagr",
|
|
"options": {
|
|
"project": "projects/ui-essentials/ng-package.json"
|
|
},
|
|
"configurations": {
|
|
"production": {
|
|
"tsConfig": "projects/ui-essentials/tsconfig.lib.prod.json"
|
|
},
|
|
"development": {
|
|
"tsConfig": "projects/ui-essentials/tsconfig.lib.json"
|
|
}
|
|
},
|
|
"defaultConfiguration": "production"
|
|
},
|
|
"test": {
|
|
"builder": "@angular-devkit/build-angular:karma",
|
|
"options": {
|
|
"tsConfig": "projects/ui-essentials/tsconfig.spec.json",
|
|
"polyfills": [
|
|
"zone.js",
|
|
"zone.js/testing"
|
|
]
|
|
}
|
|
}
|
|
}
|
|
},
|
|
"demo-ui-essentials": {
|
|
"projectType": "application",
|
|
"schematics": {
|
|
"@schematics/angular:component": {
|
|
"style": "scss"
|
|
}
|
|
},
|
|
"root": "projects/demo-ui-essentials",
|
|
"sourceRoot": "projects/demo-ui-essentials/src",
|
|
"prefix": "app",
|
|
"architect": {
|
|
"build": {
|
|
"builder": "@angular-devkit/build-angular:application",
|
|
"options": {
|
|
"outputPath": "dist/demo-ui-essentials",
|
|
"index": "projects/demo-ui-essentials/src/index.html",
|
|
"browser": "projects/demo-ui-essentials/src/main.ts",
|
|
"polyfills": [
|
|
"zone.js"
|
|
],
|
|
"tsConfig": "projects/demo-ui-essentials/tsconfig.app.json",
|
|
"inlineStyleLanguage": "scss",
|
|
"assets": [
|
|
{
|
|
"glob": "**/*",
|
|
"input": "projects/demo-ui-essentials/public"
|
|
}
|
|
],
|
|
"styles": [
|
|
"projects/demo-ui-essentials/src/styles.scss"
|
|
],
|
|
"scripts": []
|
|
},
|
|
"configurations": {
|
|
"production": {
|
|
"budgets": [
|
|
{
|
|
"type": "initial",
|
|
"maximumWarning": "500kB",
|
|
"maximumError": "1MB"
|
|
},
|
|
{
|
|
"type": "anyComponentStyle",
|
|
"maximumWarning": "4kB",
|
|
"maximumError": "8kB"
|
|
}
|
|
],
|
|
"outputHashing": "all"
|
|
},
|
|
"development": {
|
|
"optimization": false,
|
|
"extractLicenses": false,
|
|
"sourceMap": true
|
|
}
|
|
},
|
|
"defaultConfiguration": "production"
|
|
},
|
|
"serve": {
|
|
"builder": "@angular-devkit/build-angular:dev-server",
|
|
"configurations": {
|
|
"production": {
|
|
"buildTarget": "demo-ui-essentials:build:production"
|
|
},
|
|
"development": {
|
|
"buildTarget": "demo-ui-essentials:build:development"
|
|
}
|
|
},
|
|
"defaultConfiguration": "development"
|
|
},
|
|
"extract-i18n": {
|
|
"builder": "@angular-devkit/build-angular:extract-i18n"
|
|
},
|
|
"test": {
|
|
"builder": "@angular-devkit/build-angular:karma",
|
|
"options": {
|
|
"polyfills": [
|
|
"zone.js",
|
|
"zone.js/testing"
|
|
],
|
|
"tsConfig": "projects/demo-ui-essentials/tsconfig.spec.json",
|
|
"inlineStyleLanguage": "scss",
|
|
"assets": [
|
|
{
|
|
"glob": "**/*",
|
|
"input": "projects/demo-ui-essentials/public"
|
|
}
|
|
],
|
|
"styles": [
|
|
"projects/demo-ui-essentials/src/styles.scss"
|
|
],
|
|
"scripts": []
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|