feat: create ai-elements-ui demo application

Demo app showcasing ai-elements-ui components:
- AI Canvas with resizable split-panel layout
- Conversation history sidebar
- Avatar with animated states (idle, thinking, speaking)
- Typing indicators (dots, pulse, wave variants)
- Confidence meters (bar, gauge, dots, ring variants)
- Code blocks with syntax highlighting
- Skeleton loaders for various content types

Uses base-ui design tokens and Apple theme for styling.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Giuliano Silvestro
2026-02-07 21:02:21 +10:00
parent b7bf402647
commit 348186a395
7 changed files with 499 additions and 337 deletions

71
package-lock.json generated
View File

@@ -8,6 +8,7 @@
"name": "ai-elements-demo",
"version": "0.0.0",
"dependencies": {
"@angular/animations": "^19.2.0",
"@angular/common": "^19.2.0",
"@angular/compiler": "^19.2.0",
"@angular/core": "^19.2.0",
@@ -15,6 +16,8 @@
"@angular/platform-browser": "^19.2.0",
"@angular/platform-browser-dynamic": "^19.2.0",
"@angular/router": "^19.2.0",
"ai-elements-ui": "file:../ai-elements-ui/dist",
"base-ui": "file:../sda-frontend/libs/base-ui/dist",
"rxjs": "~7.8.0",
"tslib": "^2.3.0",
"zone.js": "~0.15.0"
@@ -33,6 +36,46 @@
"typescript": "~5.7.2"
}
},
"../ai-elements-ui/dist": {
"name": "ai-elements-ui",
"version": "0.1.0",
"license": "MIT",
"dependencies": {
"tslib": "^2.3.0"
},
"peerDependencies": {
"@angular/animations": "^19.0.0",
"@angular/common": "^19.0.0",
"@angular/core": "^19.0.0",
"@angular/forms": "^19.0.0",
"@angular/platform-browser": "^19.0.0",
"@angular/router": "^19.0.0",
"base-ui": "^0.1.0",
"rxjs": "^7.8.0"
},
"peerDependenciesMeta": {
"base-ui": {
"optional": true
}
}
},
"../sda-frontend/libs/base-ui/dist": {
"name": "base-ui",
"version": "0.1.0",
"license": "MIT",
"dependencies": {
"tslib": "^2.3.0"
},
"peerDependencies": {
"@angular/animations": "^19.0.0",
"@angular/common": "^19.0.0",
"@angular/core": "^19.0.0",
"@angular/forms": "^19.0.0",
"@angular/platform-browser": "^19.0.0",
"@angular/router": "^19.0.0",
"rxjs": "^7.8.0"
}
},
"node_modules/@ampproject/remapping": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
@@ -306,6 +349,23 @@
"tslib": "^2.1.0"
}
},
"node_modules/@angular/animations": {
"version": "19.2.18",
"resolved": "https://registry.npmjs.org/@angular/animations/-/animations-19.2.18.tgz",
"integrity": "sha512-c76x1t+OiSstPsvJdHmV8Q4taF+8SxWKqiY750fOjpd01it4jJbU6YQqIroC6Xie7154zZIxOTHH2uTj+nm5qA==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
"engines": {
"node": "^18.19.1 || ^20.11.1 || >=22.0.0"
},
"peerDependencies": {
"@angular/common": "19.2.18",
"@angular/core": "19.2.18"
}
},
"node_modules/@angular/build": {
"version": "19.2.19",
"resolved": "https://registry.npmjs.org/@angular/build/-/build-19.2.19.tgz",
@@ -6003,6 +6063,10 @@
"node": ">= 14"
}
},
"node_modules/ai-elements-ui": {
"resolved": "../ai-elements-ui/dist",
"link": true
},
"node_modules/ajv": {
"version": "8.17.1",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
@@ -6276,6 +6340,10 @@
"dev": true,
"license": "MIT"
},
"node_modules/base-ui": {
"resolved": "../sda-frontend/libs/base-ui/dist",
"link": true
},
"node_modules/base64-js": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
@@ -9544,6 +9612,7 @@
"integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==",
"dev": true,
"license": "MIT",
"peer": true,
"bin": {
"jiti": "bin/jiti.js"
}
@@ -12537,7 +12606,6 @@
"integrity": "sha512-3ToiC1xZ1Y8aU7+CkgCI/tqyuPXEmYGJXO7H4uqp0xkLXUqp88rQQ4j1HmP37xSJLbCJPaIiv+cT1y+grssrww==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"chokidar": "^4.0.0",
"immutable": "^5.0.2",
@@ -14598,6 +14666,7 @@
"integrity": "sha512-QcQ72gh8a+7JO63TAx/6XZf/CWhgMzu5m0QirvPfGvptOusAxG12w2+aua1Jkjr7hzaWDnJ2n6JFeexMHI+Zjg==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@types/bonjour": "^3.5.13",
"@types/connect-history-api-fallback": "^1.5.4",