@aexol/spectral 0.9.270 → 0.9.271
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/agent/index.d.ts +10 -1
- package/dist/agent/index.d.ts.map +1 -1
- package/dist/agent/index.js +26 -10
- package/dist/commands/serve.d.ts.map +1 -1
- package/dist/commands/serve.js +29 -5
- package/dist/commands/update.d.ts +2 -2
- package/dist/commands/update.js +3 -3
- package/dist/designer/index.d.ts +13 -18
- package/dist/designer/index.d.ts.map +1 -1
- package/dist/designer/index.js +128 -201
- package/dist/extensions/aexol-mcp.d.ts.map +1 -1
- package/dist/extensions/aexol-mcp.js +23 -0
- package/dist/memory/debug-log.d.ts.map +1 -1
- package/dist/memory/debug-log.js +20 -2
- package/dist/memory/tools/compact-context.d.ts +1 -1
- package/dist/memory/tools/compact-context.d.ts.map +1 -1
- package/dist/memory/tools/compact-context.js +4 -1
- package/dist/memory/tools/recall-observation.d.ts +3 -3
- package/dist/memory/tools/recall-observation.d.ts.map +1 -1
- package/dist/memory/tools/recall-observation.js +4 -1
- package/dist/memory/tools/receive-agent-observations.d.ts +3 -3
- package/dist/memory/tools/receive-agent-observations.d.ts.map +1 -1
- package/dist/memory/tools/receive-agent-observations.js +4 -1
- package/dist/memory/tools/share-project-observation.d.ts +3 -3
- package/dist/memory/tools/share-project-observation.d.ts.map +1 -1
- package/dist/memory/tools/share-project-observation.js +4 -1
- package/dist/memory/tools/write-project-observation.d.ts +3 -3
- package/dist/memory/tools/write-project-observation.d.ts.map +1 -1
- package/dist/memory/tools/write-project-observation.js +4 -1
- package/dist/relay/client.d.ts.map +1 -1
- package/dist/relay/client.js +5 -2
- package/dist/sdk/ai/env-api-keys.js +1 -1
- package/dist/sdk/coding-agent/core/extensions/loader.d.ts.map +1 -1
- package/dist/sdk/coding-agent/core/extensions/loader.js +31 -3
- package/dist/sdk/coding-agent/core/theme.js +1 -1
- package/dist/server/handlers/agent-settings.d.ts.map +1 -1
- package/dist/server/handlers/agent-settings.js +4 -1
- package/dist/server/handlers/settings-lock.d.ts.map +1 -1
- package/dist/server/handlers/settings-lock.js +4 -1
- package/dist/server/storage.d.ts.map +1 -1
- package/dist/server/storage.js +13 -1
- package/dist/utils/serve-state.d.ts +17 -0
- package/dist/utils/serve-state.d.ts.map +1 -1
- package/dist/utils/serve-state.js +73 -0
- package/package.json +1 -1
- package/dist/designer/data/skills/blog-post.d.ts +0 -3
- package/dist/designer/data/skills/blog-post.d.ts.map +0 -1
- package/dist/designer/data/skills/blog-post.js +0 -84
- package/dist/designer/data/skills/blog-post.ts +0 -87
- package/dist/designer/data/skills/critique.d.ts +0 -3
- package/dist/designer/data/skills/critique.d.ts.map +0 -1
- package/dist/designer/data/skills/critique.js +0 -109
- package/dist/designer/data/skills/critique.ts +0 -112
- package/dist/designer/data/skills/dashboard.d.ts +0 -3
- package/dist/designer/data/skills/dashboard.d.ts.map +0 -1
- package/dist/designer/data/skills/dashboard.js +0 -165
- package/dist/designer/data/skills/dashboard.ts +0 -168
- package/dist/designer/data/skills/design-brief.d.ts +0 -3
- package/dist/designer/data/skills/design-brief.d.ts.map +0 -1
- package/dist/designer/data/skills/design-brief.js +0 -141
- package/dist/designer/data/skills/design-brief.ts +0 -144
- package/dist/designer/data/skills/design-skill.d.ts +0 -10
- package/dist/designer/data/skills/design-skill.d.ts.map +0 -1
- package/dist/designer/data/skills/design-skill.js +0 -1
- package/dist/designer/data/skills/design-skill.ts +0 -9
- package/dist/designer/data/skills/docs-page.d.ts +0 -3
- package/dist/designer/data/skills/docs-page.d.ts.map +0 -1
- package/dist/designer/data/skills/docs-page.js +0 -68
- package/dist/designer/data/skills/docs-page.ts +0 -71
- package/dist/designer/data/skills/index.d.ts +0 -3
- package/dist/designer/data/skills/index.d.ts.map +0 -1
- package/dist/designer/data/skills/index.js +0 -28
- package/dist/designer/data/skills/index.ts +0 -30
- package/dist/designer/data/skills/magazine-poster.d.ts +0 -3
- package/dist/designer/data/skills/magazine-poster.d.ts.map +0 -1
- package/dist/designer/data/skills/magazine-poster.js +0 -70
- package/dist/designer/data/skills/magazine-poster.ts +0 -73
- package/dist/designer/data/skills/mobile-app.d.ts +0 -3
- package/dist/designer/data/skills/mobile-app.d.ts.map +0 -1
- package/dist/designer/data/skills/mobile-app.js +0 -229
- package/dist/designer/data/skills/mobile-app.ts +0 -232
- package/dist/designer/data/skills/motion-frames.d.ts +0 -3
- package/dist/designer/data/skills/motion-frames.d.ts.map +0 -1
- package/dist/designer/data/skills/motion-frames.js +0 -121
- package/dist/designer/data/skills/motion-frames.ts +0 -124
- package/dist/designer/data/skills/pricing-page.d.ts +0 -3
- package/dist/designer/data/skills/pricing-page.d.ts.map +0 -1
- package/dist/designer/data/skills/pricing-page.js +0 -76
- package/dist/designer/data/skills/pricing-page.ts +0 -79
- package/dist/designer/data/skills/saas-landing.d.ts +0 -3
- package/dist/designer/data/skills/saas-landing.d.ts.map +0 -1
- package/dist/designer/data/skills/saas-landing.js +0 -71
- package/dist/designer/data/skills/saas-landing.ts +0 -74
- package/dist/designer/data/skills/slide-deck.d.ts +0 -3
- package/dist/designer/data/skills/slide-deck.d.ts.map +0 -1
- package/dist/designer/data/skills/slide-deck.js +0 -213
- package/dist/designer/data/skills/slide-deck.ts +0 -216
- package/dist/designer/data/skills/social-carousel.d.ts +0 -3
- package/dist/designer/data/skills/social-carousel.d.ts.map +0 -1
- package/dist/designer/data/skills/social-carousel.js +0 -135
- package/dist/designer/data/skills/social-carousel.ts +0 -138
- package/dist/designer/data/skills/web-prototype.d.ts +0 -3
- package/dist/designer/data/skills/web-prototype.d.ts.map +0 -1
- package/dist/designer/data/skills/web-prototype.js +0 -159
- package/dist/designer/data/skills/web-prototype.ts +0 -162
- package/dist/designer/data/systems/agentic/DESIGN.md +0 -71
- package/dist/designer/data/systems/agentic/components.html +0 -154
- package/dist/designer/data/systems/agentic/tokens.css +0 -63
- package/dist/designer/data/systems/airbnb/DESIGN.md +0 -393
- package/dist/designer/data/systems/airbnb/components.html +0 -1373
- package/dist/designer/data/systems/airbnb/tokens.css +0 -261
- package/dist/designer/data/systems/airtable/DESIGN.md +0 -92
- package/dist/designer/data/systems/airtable/components.html +0 -489
- package/dist/designer/data/systems/airtable/tokens.css +0 -261
- package/dist/designer/data/systems/ant/DESIGN.md +0 -71
- package/dist/designer/data/systems/ant/components.html +0 -154
- package/dist/designer/data/systems/ant/tokens.css +0 -63
- package/dist/designer/data/systems/apple/DESIGN.md +0 -250
- package/dist/designer/data/systems/apple/components.html +0 -749
- package/dist/designer/data/systems/apple/tokens.css +0 -286
- package/dist/designer/data/systems/application/DESIGN.md +0 -71
- package/dist/designer/data/systems/application/components.html +0 -154
- package/dist/designer/data/systems/application/tokens.css +0 -63
- package/dist/designer/data/systems/arc/DESIGN.md +0 -152
- package/dist/designer/data/systems/arc/components.html +0 -432
- package/dist/designer/data/systems/arc/tokens.css +0 -137
- package/dist/designer/data/systems/artistic/DESIGN.md +0 -71
- package/dist/designer/data/systems/artistic/components.html +0 -136
- package/dist/designer/data/systems/artistic/tokens.css +0 -63
- package/dist/designer/data/systems/atelier-zero/DESIGN.md +0 -316
- package/dist/designer/data/systems/atelier-zero/components.html +0 -136
- package/dist/designer/data/systems/atelier-zero/tokens.css +0 -63
- package/dist/designer/data/systems/bento/DESIGN.md +0 -71
- package/dist/designer/data/systems/bento/components.html +0 -136
- package/dist/designer/data/systems/bento/tokens.css +0 -63
- package/dist/designer/data/systems/binance/DESIGN.md +0 -348
- package/dist/designer/data/systems/binance/components.html +0 -550
- package/dist/designer/data/systems/binance/tokens.css +0 -255
- package/dist/designer/data/systems/bmw/DESIGN.md +0 -183
- package/dist/designer/data/systems/bmw/components.html +0 -551
- package/dist/designer/data/systems/bmw/tokens.css +0 -179
- package/dist/designer/data/systems/bmw-m/DESIGN.md +0 -246
- package/dist/designer/data/systems/bmw-m/components.html +0 -342
- package/dist/designer/data/systems/bmw-m/tokens.css +0 -64
- package/dist/designer/data/systems/bold/DESIGN.md +0 -71
- package/dist/designer/data/systems/bold/components.html +0 -136
- package/dist/designer/data/systems/bold/tokens.css +0 -63
- package/dist/designer/data/systems/brutalism/DESIGN.md +0 -71
- package/dist/designer/data/systems/brutalism/components.html +0 -154
- package/dist/designer/data/systems/brutalism/tokens.css +0 -63
- package/dist/designer/data/systems/bugatti/DESIGN.md +0 -271
- package/dist/designer/data/systems/bugatti/components.html +0 -342
- package/dist/designer/data/systems/bugatti/tokens.css +0 -64
- package/dist/designer/data/systems/cafe/DESIGN.md +0 -71
- package/dist/designer/data/systems/cafe/components.html +0 -136
- package/dist/designer/data/systems/cafe/tokens.css +0 -63
- package/dist/designer/data/systems/cal/DESIGN.md +0 -262
- package/dist/designer/data/systems/cal/components.html +0 -376
- package/dist/designer/data/systems/cal/tokens.css +0 -265
- package/dist/designer/data/systems/canva/DESIGN.md +0 -157
- package/dist/designer/data/systems/canva/components.html +0 -461
- package/dist/designer/data/systems/canva/tokens.css +0 -147
- package/dist/designer/data/systems/cisco/DESIGN.md +0 -201
- package/dist/designer/data/systems/cisco/components.html +0 -342
- package/dist/designer/data/systems/cisco/tokens.css +0 -64
- package/dist/designer/data/systems/claude/DESIGN.md +0 -315
- package/dist/designer/data/systems/claude/components.html +0 -483
- package/dist/designer/data/systems/claude/tokens.css +0 -130
- package/dist/designer/data/systems/clay/DESIGN.md +0 -307
- package/dist/designer/data/systems/clay/components.html +0 -136
- package/dist/designer/data/systems/clay/tokens.css +0 -63
- package/dist/designer/data/systems/claymorphism/DESIGN.md +0 -71
- package/dist/designer/data/systems/claymorphism/components.html +0 -136
- package/dist/designer/data/systems/claymorphism/tokens.css +0 -63
- package/dist/designer/data/systems/clean/DESIGN.md +0 -71
- package/dist/designer/data/systems/clean/components.html +0 -136
- package/dist/designer/data/systems/clean/tokens.css +0 -63
- package/dist/designer/data/systems/clickhouse/DESIGN.md +0 -284
- package/dist/designer/data/systems/clickhouse/components.html +0 -506
- package/dist/designer/data/systems/clickhouse/tokens.css +0 -135
- package/dist/designer/data/systems/cohere/DESIGN.md +0 -269
- package/dist/designer/data/systems/cohere/components.html +0 -353
- package/dist/designer/data/systems/cohere/tokens.css +0 -126
- package/dist/designer/data/systems/coinbase/DESIGN.md +0 -132
- package/dist/designer/data/systems/coinbase/components.html +0 -501
- package/dist/designer/data/systems/coinbase/tokens.css +0 -257
- package/dist/designer/data/systems/colorful/DESIGN.md +0 -71
- package/dist/designer/data/systems/colorful/components.html +0 -136
- package/dist/designer/data/systems/colorful/tokens.css +0 -63
- package/dist/designer/data/systems/composio/DESIGN.md +0 -310
- package/dist/designer/data/systems/composio/components.html +0 -342
- package/dist/designer/data/systems/composio/tokens.css +0 -64
- package/dist/designer/data/systems/contemporary/DESIGN.md +0 -71
- package/dist/designer/data/systems/contemporary/components.html +0 -136
- package/dist/designer/data/systems/contemporary/tokens.css +0 -63
- package/dist/designer/data/systems/corporate/DESIGN.md +0 -71
- package/dist/designer/data/systems/corporate/components.html +0 -136
- package/dist/designer/data/systems/corporate/tokens.css +0 -63
- package/dist/designer/data/systems/cosmic/DESIGN.md +0 -71
- package/dist/designer/data/systems/cosmic/components.html +0 -136
- package/dist/designer/data/systems/cosmic/tokens.css +0 -63
- package/dist/designer/data/systems/creative/DESIGN.md +0 -71
- package/dist/designer/data/systems/creative/components.html +0 -136
- package/dist/designer/data/systems/creative/tokens.css +0 -63
- package/dist/designer/data/systems/cursor/DESIGN.md +0 -312
- package/dist/designer/data/systems/cursor/components.html +0 -654
- package/dist/designer/data/systems/cursor/tokens.css +0 -218
- package/dist/designer/data/systems/dashboard/DESIGN.md +0 -71
- package/dist/designer/data/systems/dashboard/components.html +0 -154
- package/dist/designer/data/systems/dashboard/tokens.css +0 -63
- package/dist/designer/data/systems/default/DESIGN.md +0 -62
- package/dist/designer/data/systems/default/components.html +0 -523
- package/dist/designer/data/systems/default/tokens.css +0 -200
- package/dist/designer/data/systems/discord/DESIGN.md +0 -162
- package/dist/designer/data/systems/discord/components.html +0 -359
- package/dist/designer/data/systems/discord/tokens.css +0 -125
- package/dist/designer/data/systems/dithered/DESIGN.md +0 -71
- package/dist/designer/data/systems/dithered/components.html +0 -136
- package/dist/designer/data/systems/dithered/tokens.css +0 -63
- package/dist/designer/data/systems/doodle/DESIGN.md +0 -71
- package/dist/designer/data/systems/doodle/components.html +0 -136
- package/dist/designer/data/systems/doodle/tokens.css +0 -63
- package/dist/designer/data/systems/dramatic/DESIGN.md +0 -71
- package/dist/designer/data/systems/dramatic/components.html +0 -136
- package/dist/designer/data/systems/dramatic/tokens.css +0 -63
- package/dist/designer/data/systems/duolingo/DESIGN.md +0 -154
- package/dist/designer/data/systems/duolingo/components.html +0 -532
- package/dist/designer/data/systems/duolingo/tokens.css +0 -130
- package/dist/designer/data/systems/editorial/DESIGN.md +0 -71
- package/dist/designer/data/systems/editorial/components.html +0 -154
- package/dist/designer/data/systems/editorial/tokens.css +0 -63
- package/dist/designer/data/systems/elegant/DESIGN.md +0 -71
- package/dist/designer/data/systems/elegant/components.html +0 -136
- package/dist/designer/data/systems/elegant/tokens.css +0 -63
- package/dist/designer/data/systems/elevenlabs/DESIGN.md +0 -268
- package/dist/designer/data/systems/elevenlabs/components.html +0 -342
- package/dist/designer/data/systems/elevenlabs/tokens.css +0 -127
- package/dist/designer/data/systems/energetic/DESIGN.md +0 -72
- package/dist/designer/data/systems/energetic/components.html +0 -136
- package/dist/designer/data/systems/energetic/tokens.css +0 -63
- package/dist/designer/data/systems/enterprise/DESIGN.md +0 -71
- package/dist/designer/data/systems/enterprise/components.html +0 -154
- package/dist/designer/data/systems/enterprise/tokens.css +0 -63
- package/dist/designer/data/systems/expo/DESIGN.md +0 -284
- package/dist/designer/data/systems/expo/components.html +0 -342
- package/dist/designer/data/systems/expo/tokens.css +0 -64
- package/dist/designer/data/systems/expressive/DESIGN.md +0 -71
- package/dist/designer/data/systems/expressive/components.html +0 -136
- package/dist/designer/data/systems/expressive/tokens.css +0 -63
- package/dist/designer/data/systems/fantasy/DESIGN.md +0 -71
- package/dist/designer/data/systems/fantasy/components.html +0 -136
- package/dist/designer/data/systems/fantasy/tokens.css +0 -63
- package/dist/designer/data/systems/ferrari/DESIGN.md +0 -317
- package/dist/designer/data/systems/ferrari/components.html +0 -342
- package/dist/designer/data/systems/ferrari/tokens.css +0 -64
- package/dist/designer/data/systems/figma/DESIGN.md +0 -223
- package/dist/designer/data/systems/figma/components.html +0 -344
- package/dist/designer/data/systems/figma/tokens.css +0 -126
- package/dist/designer/data/systems/flat/DESIGN.md +0 -71
- package/dist/designer/data/systems/flat/components.html +0 -136
- package/dist/designer/data/systems/flat/tokens.css +0 -63
- package/dist/designer/data/systems/framer/DESIGN.md +0 -249
- package/dist/designer/data/systems/framer/components.html +0 -438
- package/dist/designer/data/systems/framer/tokens.css +0 -238
- package/dist/designer/data/systems/friendly/DESIGN.md +0 -71
- package/dist/designer/data/systems/friendly/components.html +0 -136
- package/dist/designer/data/systems/friendly/tokens.css +0 -63
- package/dist/designer/data/systems/futuristic/DESIGN.md +0 -71
- package/dist/designer/data/systems/futuristic/components.html +0 -136
- package/dist/designer/data/systems/futuristic/tokens.css +0 -63
- package/dist/designer/data/systems/github/DESIGN.md +0 -155
- package/dist/designer/data/systems/github/components.html +0 -383
- package/dist/designer/data/systems/github/tokens.css +0 -125
- package/dist/designer/data/systems/glassmorphism/DESIGN.md +0 -71
- package/dist/designer/data/systems/glassmorphism/components.html +0 -154
- package/dist/designer/data/systems/glassmorphism/tokens.css +0 -63
- package/dist/designer/data/systems/gradient/DESIGN.md +0 -71
- package/dist/designer/data/systems/gradient/components.html +0 -154
- package/dist/designer/data/systems/gradient/tokens.css +0 -63
- package/dist/designer/data/systems/hashicorp/DESIGN.md +0 -281
- package/dist/designer/data/systems/hashicorp/components.html +0 -502
- package/dist/designer/data/systems/hashicorp/tokens.css +0 -272
- package/dist/designer/data/systems/hud/DESIGN.md +0 -173
- package/dist/designer/data/systems/hud/components.html +0 -136
- package/dist/designer/data/systems/hud/tokens.css +0 -63
- package/dist/designer/data/systems/huggingface/DESIGN.md +0 -149
- package/dist/designer/data/systems/huggingface/components.html +0 -346
- package/dist/designer/data/systems/huggingface/tokens.css +0 -125
- package/dist/designer/data/systems/ibm/DESIGN.md +0 -335
- package/dist/designer/data/systems/ibm/components.html +0 -342
- package/dist/designer/data/systems/ibm/tokens.css +0 -64
- package/dist/designer/data/systems/intercom/DESIGN.md +0 -149
- package/dist/designer/data/systems/intercom/components.html +0 -557
- package/dist/designer/data/systems/intercom/tokens.css +0 -150
- package/dist/designer/data/systems/kami/DESIGN.md +0 -410
- package/dist/designer/data/systems/kami/components.html +0 -601
- package/dist/designer/data/systems/kami/tokens.css +0 -272
- package/dist/designer/data/systems/kraken/DESIGN.md +0 -128
- package/dist/designer/data/systems/kraken/components.html +0 -342
- package/dist/designer/data/systems/kraken/tokens.css +0 -64
- package/dist/designer/data/systems/lamborghini/DESIGN.md +0 -291
- package/dist/designer/data/systems/lamborghini/components.html +0 -342
- package/dist/designer/data/systems/lamborghini/tokens.css +0 -64
- package/dist/designer/data/systems/levels/DESIGN.md +0 -71
- package/dist/designer/data/systems/levels/components.html +0 -154
- package/dist/designer/data/systems/levels/tokens.css +0 -63
- package/dist/designer/data/systems/linear-app/DESIGN.md +0 -370
- package/dist/designer/data/systems/linear-app/components.html +0 -370
- package/dist/designer/data/systems/linear-app/tokens.css +0 -130
- package/dist/designer/data/systems/lingo/DESIGN.md +0 -71
- package/dist/designer/data/systems/lingo/components.html +0 -154
- package/dist/designer/data/systems/lingo/tokens.css +0 -63
- package/dist/designer/data/systems/loom/DESIGN.md +0 -201
- package/dist/designer/data/systems/loom/components.html +0 -446
- package/dist/designer/data/systems/loom/tokens.css +0 -138
- package/dist/designer/data/systems/lovable/DESIGN.md +0 -301
- package/dist/designer/data/systems/lovable/components.html +0 -441
- package/dist/designer/data/systems/lovable/tokens.css +0 -258
- package/dist/designer/data/systems/luxury/DESIGN.md +0 -71
- package/dist/designer/data/systems/luxury/components.html +0 -154
- package/dist/designer/data/systems/luxury/tokens.css +0 -63
- package/dist/designer/data/systems/mastercard/DESIGN.md +0 -368
- package/dist/designer/data/systems/mastercard/components.html +0 -342
- package/dist/designer/data/systems/mastercard/tokens.css +0 -64
- package/dist/designer/data/systems/material/DESIGN.md +0 -71
- package/dist/designer/data/systems/material/components.html +0 -154
- package/dist/designer/data/systems/material/tokens.css +0 -63
- package/dist/designer/data/systems/meta/DESIGN.md +0 -369
- package/dist/designer/data/systems/meta/components.html +0 -398
- package/dist/designer/data/systems/meta/tokens.css +0 -263
- package/dist/designer/data/systems/minimal/DESIGN.md +0 -71
- package/dist/designer/data/systems/minimal/components.html +0 -154
- package/dist/designer/data/systems/minimal/tokens.css +0 -63
- package/dist/designer/data/systems/minimax/DESIGN.md +0 -260
- package/dist/designer/data/systems/minimax/components.html +0 -590
- package/dist/designer/data/systems/minimax/tokens.css +0 -148
- package/dist/designer/data/systems/mintlify/DESIGN.md +0 -329
- package/dist/designer/data/systems/mintlify/components.html +0 -737
- package/dist/designer/data/systems/mintlify/tokens.css +0 -256
- package/dist/designer/data/systems/miro/DESIGN.md +0 -111
- package/dist/designer/data/systems/miro/components.html +0 -342
- package/dist/designer/data/systems/miro/tokens.css +0 -64
- package/dist/designer/data/systems/mission-control/DESIGN.md +0 -474
- package/dist/designer/data/systems/mission-control/components.html +0 -136
- package/dist/designer/data/systems/mission-control/tokens.css +0 -63
- package/dist/designer/data/systems/mistral-ai/DESIGN.md +0 -264
- package/dist/designer/data/systems/mistral-ai/components.html +0 -338
- package/dist/designer/data/systems/mistral-ai/tokens.css +0 -125
- package/dist/designer/data/systems/modern/DESIGN.md +0 -71
- package/dist/designer/data/systems/modern/components.html +0 -154
- package/dist/designer/data/systems/modern/tokens.css +0 -63
- package/dist/designer/data/systems/mongodb/DESIGN.md +0 -269
- package/dist/designer/data/systems/mongodb/components.html +0 -462
- package/dist/designer/data/systems/mongodb/tokens.css +0 -176
- package/dist/designer/data/systems/mono/DESIGN.md +0 -71
- package/dist/designer/data/systems/mono/components.html +0 -136
- package/dist/designer/data/systems/mono/tokens.css +0 -63
- package/dist/designer/data/systems/neobrutalism/DESIGN.md +0 -71
- package/dist/designer/data/systems/neobrutalism/components.html +0 -136
- package/dist/designer/data/systems/neobrutalism/tokens.css +0 -63
- package/dist/designer/data/systems/neon/DESIGN.md +0 -71
- package/dist/designer/data/systems/neon/components.html +0 -136
- package/dist/designer/data/systems/neon/tokens.css +0 -63
- package/dist/designer/data/systems/neumorphism/DESIGN.md +0 -71
- package/dist/designer/data/systems/neumorphism/components.html +0 -136
- package/dist/designer/data/systems/neumorphism/tokens.css +0 -63
- package/dist/designer/data/systems/nike/DESIGN.md +0 -366
- package/dist/designer/data/systems/nike/components.html +0 -512
- package/dist/designer/data/systems/nike/tokens.css +0 -304
- package/dist/designer/data/systems/notion/DESIGN.md +0 -312
- package/dist/designer/data/systems/notion/components.html +0 -413
- package/dist/designer/data/systems/notion/tokens.css +0 -130
- package/dist/designer/data/systems/nvidia/DESIGN.md +0 -296
- package/dist/designer/data/systems/nvidia/components.html +0 -414
- package/dist/designer/data/systems/nvidia/tokens.css +0 -133
- package/dist/designer/data/systems/ollama/DESIGN.md +0 -270
- package/dist/designer/data/systems/ollama/components.html +0 -700
- package/dist/designer/data/systems/ollama/tokens.css +0 -242
- package/dist/designer/data/systems/openai/DESIGN.md +0 -140
- package/dist/designer/data/systems/openai/components.html +0 -382
- package/dist/designer/data/systems/openai/tokens.css +0 -133
- package/dist/designer/data/systems/opencode-ai/DESIGN.md +0 -284
- package/dist/designer/data/systems/opencode-ai/components.html +0 -389
- package/dist/designer/data/systems/opencode-ai/tokens.css +0 -126
- package/dist/designer/data/systems/pacman/DESIGN.md +0 -71
- package/dist/designer/data/systems/pacman/components.html +0 -342
- package/dist/designer/data/systems/pacman/tokens.css +0 -64
- package/dist/designer/data/systems/paper/DESIGN.md +0 -71
- package/dist/designer/data/systems/paper/components.html +0 -136
- package/dist/designer/data/systems/paper/tokens.css +0 -63
- package/dist/designer/data/systems/perplexity/DESIGN.md +0 -286
- package/dist/designer/data/systems/perplexity/components.html +0 -455
- package/dist/designer/data/systems/perplexity/tokens.css +0 -151
- package/dist/designer/data/systems/perspective/DESIGN.md +0 -71
- package/dist/designer/data/systems/perspective/components.html +0 -136
- package/dist/designer/data/systems/perspective/tokens.css +0 -63
- package/dist/designer/data/systems/pinterest/DESIGN.md +0 -233
- package/dist/designer/data/systems/pinterest/components.html +0 -865
- package/dist/designer/data/systems/pinterest/tokens.css +0 -262
- package/dist/designer/data/systems/playstation/DESIGN.md +0 -367
- package/dist/designer/data/systems/playstation/components.html +0 -414
- package/dist/designer/data/systems/playstation/tokens.css +0 -150
- package/dist/designer/data/systems/posthog/DESIGN.md +0 -259
- package/dist/designer/data/systems/posthog/components.html +0 -827
- package/dist/designer/data/systems/posthog/tokens.css +0 -272
- package/dist/designer/data/systems/premium/DESIGN.md +0 -71
- package/dist/designer/data/systems/premium/components.html +0 -154
- package/dist/designer/data/systems/premium/tokens.css +0 -63
- package/dist/designer/data/systems/professional/DESIGN.md +0 -71
- package/dist/designer/data/systems/professional/components.html +0 -136
- package/dist/designer/data/systems/professional/tokens.css +0 -63
- package/dist/designer/data/systems/publication/DESIGN.md +0 -71
- package/dist/designer/data/systems/publication/components.html +0 -154
- package/dist/designer/data/systems/publication/tokens.css +0 -63
- package/dist/designer/data/systems/raycast/DESIGN.md +0 -271
- package/dist/designer/data/systems/raycast/components.html +0 -507
- package/dist/designer/data/systems/raycast/tokens.css +0 -143
- package/dist/designer/data/systems/refined/DESIGN.md +0 -71
- package/dist/designer/data/systems/refined/components.html +0 -136
- package/dist/designer/data/systems/refined/tokens.css +0 -63
- package/dist/designer/data/systems/renault/DESIGN.md +0 -314
- package/dist/designer/data/systems/renault/components.html +0 -154
- package/dist/designer/data/systems/renault/tokens.css +0 -63
- package/dist/designer/data/systems/replicate/DESIGN.md +0 -264
- package/dist/designer/data/systems/replicate/components.html +0 -340
- package/dist/designer/data/systems/replicate/tokens.css +0 -125
- package/dist/designer/data/systems/resend/DESIGN.md +0 -306
- package/dist/designer/data/systems/resend/components.html +0 -839
- package/dist/designer/data/systems/resend/tokens.css +0 -353
- package/dist/designer/data/systems/retro/DESIGN.md +0 -71
- package/dist/designer/data/systems/retro/components.html +0 -136
- package/dist/designer/data/systems/retro/tokens.css +0 -63
- package/dist/designer/data/systems/revolut/DESIGN.md +0 -188
- package/dist/designer/data/systems/revolut/components.html +0 -342
- package/dist/designer/data/systems/revolut/tokens.css +0 -64
- package/dist/designer/data/systems/runwayml/DESIGN.md +0 -247
- package/dist/designer/data/systems/runwayml/components.html +0 -638
- package/dist/designer/data/systems/runwayml/tokens.css +0 -204
- package/dist/designer/data/systems/sanity/DESIGN.md +0 -360
- package/dist/designer/data/systems/sanity/components.html +0 -342
- package/dist/designer/data/systems/sanity/tokens.css +0 -64
- package/dist/designer/data/systems/sentry/DESIGN.md +0 -265
- package/dist/designer/data/systems/sentry/components.html +0 -387
- package/dist/designer/data/systems/sentry/tokens.css +0 -219
- package/dist/designer/data/systems/shadcn/DESIGN.md +0 -71
- package/dist/designer/data/systems/shadcn/components.html +0 -732
- package/dist/designer/data/systems/shadcn/tokens.css +0 -255
- package/dist/designer/data/systems/shopify/DESIGN.md +0 -353
- package/dist/designer/data/systems/shopify/components.html +0 -342
- package/dist/designer/data/systems/shopify/tokens.css +0 -141
- package/dist/designer/data/systems/simple/DESIGN.md +0 -71
- package/dist/designer/data/systems/simple/components.html +0 -136
- package/dist/designer/data/systems/simple/tokens.css +0 -63
- package/dist/designer/data/systems/skeumorphism/DESIGN.md +0 -71
- package/dist/designer/data/systems/skeumorphism/components.html +0 -136
- package/dist/designer/data/systems/skeumorphism/tokens.css +0 -63
- package/dist/designer/data/systems/slack/DESIGN.md +0 -363
- package/dist/designer/data/systems/slack/components.html +0 -387
- package/dist/designer/data/systems/slack/tokens.css +0 -127
- package/dist/designer/data/systems/sleek/DESIGN.md +0 -71
- package/dist/designer/data/systems/sleek/components.html +0 -136
- package/dist/designer/data/systems/sleek/tokens.css +0 -63
- package/dist/designer/data/systems/spacex/DESIGN.md +0 -197
- package/dist/designer/data/systems/spacex/components.html +0 -496
- package/dist/designer/data/systems/spacex/tokens.css +0 -154
- package/dist/designer/data/systems/spacious/DESIGN.md +0 -71
- package/dist/designer/data/systems/spacious/components.html +0 -136
- package/dist/designer/data/systems/spacious/tokens.css +0 -63
- package/dist/designer/data/systems/spotify/DESIGN.md +0 -249
- package/dist/designer/data/systems/spotify/components.html +0 -365
- package/dist/designer/data/systems/spotify/tokens.css +0 -127
- package/dist/designer/data/systems/starbucks/DESIGN.md +0 -583
- package/dist/designer/data/systems/starbucks/components.html +0 -493
- package/dist/designer/data/systems/starbucks/tokens.css +0 -182
- package/dist/designer/data/systems/storytelling/DESIGN.md +0 -71
- package/dist/designer/data/systems/storytelling/components.html +0 -136
- package/dist/designer/data/systems/storytelling/tokens.css +0 -63
- package/dist/designer/data/systems/stripe/DESIGN.md +0 -325
- package/dist/designer/data/systems/stripe/components.html +0 -1018
- package/dist/designer/data/systems/stripe/tokens.css +0 -295
- package/dist/designer/data/systems/supabase/DESIGN.md +0 -258
- package/dist/designer/data/systems/supabase/components.html +0 -741
- package/dist/designer/data/systems/supabase/tokens.css +0 -294
- package/dist/designer/data/systems/superhuman/DESIGN.md +0 -255
- package/dist/designer/data/systems/superhuman/components.html +0 -537
- package/dist/designer/data/systems/superhuman/tokens.css +0 -160
- package/dist/designer/data/systems/tesla/DESIGN.md +0 -289
- package/dist/designer/data/systems/tesla/components.html +0 -724
- package/dist/designer/data/systems/tesla/tokens.css +0 -285
- package/dist/designer/data/systems/tetris/DESIGN.md +0 -71
- package/dist/designer/data/systems/tetris/components.html +0 -342
- package/dist/designer/data/systems/tetris/tokens.css +0 -64
- package/dist/designer/data/systems/theverge/DESIGN.md +0 -342
- package/dist/designer/data/systems/theverge/components.html +0 -342
- package/dist/designer/data/systems/theverge/tokens.css +0 -64
- package/dist/designer/data/systems/together-ai/DESIGN.md +0 -266
- package/dist/designer/data/systems/together-ai/components.html +0 -422
- package/dist/designer/data/systems/together-ai/tokens.css +0 -127
- package/dist/designer/data/systems/totality-festival/DESIGN.md +0 -206
- package/dist/designer/data/systems/totality-festival/components.html +0 -136
- package/dist/designer/data/systems/totality-festival/tokens.css +0 -63
- package/dist/designer/data/systems/trading-terminal/DESIGN.md +0 -178
- package/dist/designer/data/systems/trading-terminal/components.html +0 -154
- package/dist/designer/data/systems/trading-terminal/tokens.css +0 -63
- package/dist/designer/data/systems/uber/DESIGN.md +0 -298
- package/dist/designer/data/systems/uber/components.html +0 -347
- package/dist/designer/data/systems/uber/tokens.css +0 -131
- package/dist/designer/data/systems/urdu/DESIGN.md +0 -1002
- package/dist/designer/data/systems/urdu/components.html +0 -136
- package/dist/designer/data/systems/urdu/tokens.css +0 -63
- package/dist/designer/data/systems/vercel/DESIGN.md +0 -313
- package/dist/designer/data/systems/vercel/components.html +0 -839
- package/dist/designer/data/systems/vercel/tokens.css +0 -270
- package/dist/designer/data/systems/vibrant/DESIGN.md +0 -71
- package/dist/designer/data/systems/vibrant/components.html +0 -136
- package/dist/designer/data/systems/vibrant/tokens.css +0 -63
- package/dist/designer/data/systems/vintage/DESIGN.md +0 -71
- package/dist/designer/data/systems/vintage/components.html +0 -136
- package/dist/designer/data/systems/vintage/tokens.css +0 -63
- package/dist/designer/data/systems/vodafone/DESIGN.md +0 -426
- package/dist/designer/data/systems/vodafone/components.html +0 -342
- package/dist/designer/data/systems/vodafone/tokens.css +0 -64
- package/dist/designer/data/systems/voltagent/DESIGN.md +0 -326
- package/dist/designer/data/systems/voltagent/components.html +0 -154
- package/dist/designer/data/systems/voltagent/tokens.css +0 -63
- package/dist/designer/data/systems/warm-editorial/DESIGN.md +0 -65
- package/dist/designer/data/systems/warm-editorial/components.html +0 -136
- package/dist/designer/data/systems/warm-editorial/tokens.css +0 -63
- package/dist/designer/data/systems/warp/DESIGN.md +0 -256
- package/dist/designer/data/systems/warp/components.html +0 -411
- package/dist/designer/data/systems/warp/tokens.css +0 -156
- package/dist/designer/data/systems/webex/DESIGN.md +0 -207
- package/dist/designer/data/systems/webex/components.html +0 -342
- package/dist/designer/data/systems/webex/tokens.css +0 -64
- package/dist/designer/data/systems/webflow/DESIGN.md +0 -95
- package/dist/designer/data/systems/webflow/components.html +0 -413
- package/dist/designer/data/systems/webflow/tokens.css +0 -191
- package/dist/designer/data/systems/wechat/DESIGN.md +0 -302
- package/dist/designer/data/systems/wechat/components.html +0 -507
- package/dist/designer/data/systems/wechat/tokens.css +0 -176
- package/dist/designer/data/systems/wired/DESIGN.md +0 -281
- package/dist/designer/data/systems/wired/components.html +0 -342
- package/dist/designer/data/systems/wired/tokens.css +0 -64
- package/dist/designer/data/systems/wise/DESIGN.md +0 -176
- package/dist/designer/data/systems/wise/components.html +0 -365
- package/dist/designer/data/systems/wise/tokens.css +0 -141
- package/dist/designer/data/systems/x-ai/DESIGN.md +0 -260
- package/dist/designer/data/systems/x-ai/components.html +0 -460
- package/dist/designer/data/systems/x-ai/tokens.css +0 -268
- package/dist/designer/data/systems/xiaohongshu/DESIGN.md +0 -402
- package/dist/designer/data/systems/xiaohongshu/components.html +0 -865
- package/dist/designer/data/systems/xiaohongshu/tokens.css +0 -193
- package/dist/designer/data/systems/zapier/DESIGN.md +0 -331
- package/dist/designer/data/systems/zapier/components.html +0 -342
- package/dist/designer/data/systems/zapier/tokens.css +0 -64
- package/dist/designer/guidelines.d.ts +0 -23
- package/dist/designer/guidelines.d.ts.map +0 -1
- package/dist/designer/guidelines.js +0 -176
- package/dist/designer/philosophies.d.ts +0 -33
- package/dist/designer/philosophies.d.ts.map +0 -1
- package/dist/designer/philosophies.js +0 -668
- package/dist/designer/skills.d.ts +0 -21
- package/dist/designer/skills.d.ts.map +0 -1
- package/dist/designer/skills.js +0 -34
- package/dist/designer/systems.d.ts +0 -36
- package/dist/designer/systems.d.ts.map +0 -1
- package/dist/designer/systems.js +0 -221
|
@@ -1,162 +0,0 @@
|
|
|
1
|
-
import type { DesignSkill } from "./design-skill.js";
|
|
2
|
-
|
|
3
|
-
export const webPrototype: DesignSkill = {
|
|
4
|
-
name: "web-prototype",
|
|
5
|
-
scenario: "design",
|
|
6
|
-
description:
|
|
7
|
-
"General-purpose web prototype. Single self-contained HTML file with modern CSS, responsive layout, and polished design tokens.",
|
|
8
|
-
outputKind: "html",
|
|
9
|
-
workflow: `# Web Prototype Skill
|
|
10
|
-
|
|
11
|
-
Produce a single, self-contained HTML file for a web page prototype. This is your workflow — follow it exactly.
|
|
12
|
-
|
|
13
|
-
## Phase 0 — Pre-flight (before writing any code)
|
|
14
|
-
|
|
15
|
-
1. Read the active DESIGN SYSTEM (provided below). Map its color tokens to CSS custom properties.
|
|
16
|
-
2. Determine: what kind of page? Landing page, marketing site, docs, SaaS, portfolio?
|
|
17
|
-
3. Vocalize the system you'll use before writing: "I'll use the [X] design system with [Y] color palette and [Z] typography."
|
|
18
|
-
|
|
19
|
-
## Phase 1 — HTML Shell
|
|
20
|
-
|
|
21
|
-
Create \`index.html\` with this skeleton:
|
|
22
|
-
|
|
23
|
-
\`\`\`html
|
|
24
|
-
<!doctype html>
|
|
25
|
-
<html lang="en">
|
|
26
|
-
<head>
|
|
27
|
-
<meta charset="utf-8">
|
|
28
|
-
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
29
|
-
<title>Page Title</title>
|
|
30
|
-
<style>
|
|
31
|
-
*, *::before, *::after { box-sizing: border-box; margin: 0; }
|
|
32
|
-
|
|
33
|
-
:root {
|
|
34
|
-
/* Map design system tokens here */
|
|
35
|
-
--color-bg: ...;
|
|
36
|
-
--color-text: ...;
|
|
37
|
-
--color-accent: ...;
|
|
38
|
-
--font-sans: ...;
|
|
39
|
-
--font-serif: ...;
|
|
40
|
-
--radius: 8px;
|
|
41
|
-
--max-width: 1080px;
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
body {
|
|
45
|
-
font-family: var(--font-sans);
|
|
46
|
-
color: var(--color-text);
|
|
47
|
-
background: var(--color-bg);
|
|
48
|
-
line-height: 1.6;
|
|
49
|
-
-webkit-font-smoothing: antialiased;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.container { max-width: var(--max-width); margin: 0 auto; padding: 0 24px; }
|
|
53
|
-
|
|
54
|
-
/* Write all component styles below */
|
|
55
|
-
</style>
|
|
56
|
-
</head>
|
|
57
|
-
<body>
|
|
58
|
-
<!-- Sections go here -->
|
|
59
|
-
</body>
|
|
60
|
-
</html>
|
|
61
|
-
\`\`\`
|
|
62
|
-
|
|
63
|
-
## Phase 2 — Compose Sections
|
|
64
|
-
|
|
65
|
-
Pick from these section patterns based on the page type. Each section is a semantic HTML block inside \`.container\`:
|
|
66
|
-
|
|
67
|
-
### Hero (always first)
|
|
68
|
-
\`\`\`html
|
|
69
|
-
<section class="hero">
|
|
70
|
-
<div class="container">
|
|
71
|
-
<h1>Bold headline that states the value</h1>
|
|
72
|
-
<p>One-sentence subtext that adds context. 20-30 words max.</p>
|
|
73
|
-
<div class="hero-actions">
|
|
74
|
-
<a href="#" class="btn-primary">Primary CTA</a>
|
|
75
|
-
<a href="#" class="btn-secondary">Secondary</a>
|
|
76
|
-
</div>
|
|
77
|
-
</div>
|
|
78
|
-
</section>
|
|
79
|
-
\`\`\`
|
|
80
|
-
|
|
81
|
-
### Feature Grid
|
|
82
|
-
\`\`\`html
|
|
83
|
-
<section class="features">
|
|
84
|
-
<div class="container">
|
|
85
|
-
<h2>Section heading</h2>
|
|
86
|
-
<div class="grid-3">
|
|
87
|
-
<div class="feature-card">
|
|
88
|
-
<div class="feature-icon">[icon]</div>
|
|
89
|
-
<h3>Feature name</h3>
|
|
90
|
-
<p>Concise description. One sentence.</p>
|
|
91
|
-
</div>
|
|
92
|
-
<!-- repeat 3-6 times -->
|
|
93
|
-
</div>
|
|
94
|
-
</div>
|
|
95
|
-
</section>
|
|
96
|
-
\`\`\`
|
|
97
|
-
|
|
98
|
-
### Social Proof
|
|
99
|
-
\`\`\`html
|
|
100
|
-
<section class="proof">
|
|
101
|
-
<div class="container">
|
|
102
|
-
<h2>Trusted by</h2>
|
|
103
|
-
<div class="logo-strip">[company logos or names]</div>
|
|
104
|
-
<blockquote>"Compelling quote from a real-sounding persona." <cite>— Name, Role at Company</cite></blockquote>
|
|
105
|
-
</div>
|
|
106
|
-
</section>
|
|
107
|
-
\`\`\`
|
|
108
|
-
|
|
109
|
-
### CTA Footer
|
|
110
|
-
\`\`\`html
|
|
111
|
-
<section class="cta">
|
|
112
|
-
<div class="container">
|
|
113
|
-
<h2>Ready to start?</h2>
|
|
114
|
-
<p>One-sentence prompt.</p>
|
|
115
|
-
<a href="#" class="btn-primary">Get Started</a>
|
|
116
|
-
</div>
|
|
117
|
-
</section>
|
|
118
|
-
\`\`\`
|
|
119
|
-
|
|
120
|
-
### Pricing (if needed)
|
|
121
|
-
\`\`\`html
|
|
122
|
-
<section class="pricing">
|
|
123
|
-
<div class="container">
|
|
124
|
-
<h2>Simple pricing</h2>
|
|
125
|
-
<div class="grid-3">
|
|
126
|
-
<div class="pricing-card">
|
|
127
|
-
<h3>Starter</h3>
|
|
128
|
-
<div class="price">$X<span>/mo</span></div>
|
|
129
|
-
<ul>
|
|
130
|
-
<li>Feature one</li>
|
|
131
|
-
<li>Feature two</li>
|
|
132
|
-
</ul>
|
|
133
|
-
<a href="#" class="btn-primary">Get Started</a>
|
|
134
|
-
</div>
|
|
135
|
-
<!-- 2-3 tiers -->
|
|
136
|
-
</div>
|
|
137
|
-
</div>
|
|
138
|
-
</section>
|
|
139
|
-
\`\`\`
|
|
140
|
-
|
|
141
|
-
## Phase 3 — Component Styles
|
|
142
|
-
|
|
143
|
-
Apply design-system tokens to each component:
|
|
144
|
-
|
|
145
|
-
- **Hero**: Full-bleed background matching --color-bg-secondary or --color-bg-primary (dark systems). h1 at 48-80px, 700-800 weight, tight line-height. Subtext at 18-20px, --color-text-secondary.
|
|
146
|
-
- **Grid**: CSS Grid, \`grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))\`, 24-32px gap.
|
|
147
|
-
- **Feature Cards**: Padding 32px, background --color-bg-surface, border-radius --radius, subtle border from --color-border.
|
|
148
|
-
- **Buttons**: Display inline-flex, align-items center, padding 12px 24px, border-radius --radius, font-weight 600. Primary: --color-accent bg, white text. Secondary: transparent, accent border.
|
|
149
|
-
- **Responsive**: Mobile-first. At 768px, adjust grid columns, reduce heading sizes by 25%, stack hero content vertically.
|
|
150
|
-
|
|
151
|
-
## Phase 4 — Anti-Slop Check
|
|
152
|
-
|
|
153
|
-
Before finalizing, verify:
|
|
154
|
-
- [ ] No warm beige/cream/peach backgrounds (unless the design system specifies them)
|
|
155
|
-
- [ ] No Inter or Roboto unless the design system calls for them
|
|
156
|
-
- [ ] No gradient backgrounds unless the design system uses them
|
|
157
|
-
- [ ] No emoji as icons — use Unicode symbols or SVG
|
|
158
|
-
- [ ] No lorem ipsum — every word is meaningful
|
|
159
|
-
- [ ] No rounded-left-border accent cards (the "AI slop" signature)
|
|
160
|
-
- [ ] Colors come from the design system, not defaults
|
|
161
|
-
- [ ] Typography scale is consistent (not random sizes)`,
|
|
162
|
-
};
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
# Design System Inspired by Agentic
|
|
2
|
-
|
|
3
|
-
> Category: Themed & Unique
|
|
4
|
-
> Conversational AI-first interface with minimal controls, clear outcomes, and delegated task flows for agentic workflows.
|
|
5
|
-
|
|
6
|
-
## 1. Visual Theme & Atmosphere
|
|
7
|
-
|
|
8
|
-
Conversational AI-first interface with minimal controls, clear outcomes, and delegated task flows for agentic workflows.
|
|
9
|
-
|
|
10
|
-
- **Visual style:** modern, bold
|
|
11
|
-
- **Color stance:** surface/subtle layers
|
|
12
|
-
- **Design intent:** Keep outputs recognizable to this style family while preserving usability and readability.
|
|
13
|
-
|
|
14
|
-
## 2. Color
|
|
15
|
-
|
|
16
|
-
- **Primary:** `#FF5701` — Token from style foundations.
|
|
17
|
-
- **Secondary:** `#F6F6F1` — Token from style foundations.
|
|
18
|
-
- **Success:** `#16A34A` — Token from style foundations.
|
|
19
|
-
- **Warning:** `#D97706` — Token from style foundations.
|
|
20
|
-
- **Danger:** `#DC2626` — Token from style foundations.
|
|
21
|
-
- **Surface:** `#FFFFFF` — Token from style foundations.
|
|
22
|
-
- **Text:** `#111827` — Token from style foundations.
|
|
23
|
-
- **Neutral:** `#FFFFFF` — Derived from the surface token for official format compatibility.
|
|
24
|
-
|
|
25
|
-
- Favor Primary (#FF5701) for CTA emphasis.
|
|
26
|
-
- Use Surface (#FFFFFF) for large backgrounds and cards.
|
|
27
|
-
- Keep body copy on Text (#111827) for legibility.
|
|
28
|
-
|
|
29
|
-
## 3. Typography
|
|
30
|
-
|
|
31
|
-
- **Scale:** 14/16/18/24/32/40
|
|
32
|
-
- **Families:** primary=Playfair Display, display=Playfair Display, mono=JetBrains Mono
|
|
33
|
-
- **Weights:** 100, 200, 300, 400, 500, 600, 700, 800, 900
|
|
34
|
-
- Headings should carry the style personality; body text should optimize scanability and contrast.
|
|
35
|
-
|
|
36
|
-
## 4. Spacing & Grid
|
|
37
|
-
|
|
38
|
-
- **Spacing scale:** 8pt baseline grid
|
|
39
|
-
- Keep vertical rhythm consistent across sections and components.
|
|
40
|
-
- Align columns and modules to a predictable grid; avoid ad-hoc offsets.
|
|
41
|
-
|
|
42
|
-
## 5. Layout & Composition
|
|
43
|
-
|
|
44
|
-
- Prefer clear content blocks with consistent internal padding.
|
|
45
|
-
- Keep hierarchy obvious: headline → support text → primary action.
|
|
46
|
-
- Use whitespace to separate concerns before adding borders or shadows.
|
|
47
|
-
|
|
48
|
-
## 6. Components
|
|
49
|
-
|
|
50
|
-
- Buttons: primary action uses `#FF5701`; secondary actions stay neutral.
|
|
51
|
-
- Inputs: strong focus-visible states, clear labels, and predictable error messaging.
|
|
52
|
-
- Cards/sections: use consistent radii, spacing, and elevation strategy across the page.
|
|
53
|
-
|
|
54
|
-
## 7. Motion & Interaction
|
|
55
|
-
|
|
56
|
-
- Use subtle transitions that emphasize Primary (#FF5701) as the interaction signal.
|
|
57
|
-
- Default to short, purposeful transitions (150–250ms) with stable easing.
|
|
58
|
-
- Ensure hover, focus-visible, active, disabled, and loading states are explicit.
|
|
59
|
-
|
|
60
|
-
## 8. Voice & Brand
|
|
61
|
-
|
|
62
|
-
- Tone should reflect the visual style: concise, confident, and product-specific.
|
|
63
|
-
- Keep microcopy action-oriented and avoid generic filler language.
|
|
64
|
-
- Preserve the style identity in headlines while keeping UI labels literal and clear.
|
|
65
|
-
|
|
66
|
-
## 9. Anti-patterns
|
|
67
|
-
|
|
68
|
-
- Do not introduce off-palette colors when an existing token can solve the problem.
|
|
69
|
-
- Do not flatten hierarchy by using the same type size/weight for all text.
|
|
70
|
-
- Do not add decorative effects that reduce readability or accessibility.
|
|
71
|
-
- Do not mix unrelated visual metaphors in the same interface.
|
|
@@ -1,154 +0,0 @@
|
|
|
1
|
-
<!doctype html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8" />
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
6
|
-
<title>Agentic - reference components</title>
|
|
7
|
-
<meta name="description" content="Reference fixture for design-systems/agentic: agent workflow interface with dark command surfaces, blue automation signals, and traceable task cards." />
|
|
8
|
-
<style>
|
|
9
|
-
:root {
|
|
10
|
-
--bg: #0b1020;
|
|
11
|
-
--surface: #131b2f;
|
|
12
|
-
--surface-warm: #182343;
|
|
13
|
-
--fg: #f8fafc;
|
|
14
|
-
--fg-2: #cbd5e1;
|
|
15
|
-
--muted: #8ea0b8;
|
|
16
|
-
--meta: #60a5fa;
|
|
17
|
-
--border: #293653;
|
|
18
|
-
--border-soft: #1e2a43;
|
|
19
|
-
--accent: #60a5fa;
|
|
20
|
-
--accent-on: #06111f;
|
|
21
|
-
--accent-hover: color-mix(in oklab, var(--accent), black 8%);
|
|
22
|
-
--accent-active: color-mix(in oklab, var(--accent), black 14%);
|
|
23
|
-
--success: #22c55e;
|
|
24
|
-
--warn: #fbbf24;
|
|
25
|
-
--danger: #fb7185;
|
|
26
|
-
--font-display: Inter, system-ui, sans-serif;
|
|
27
|
-
--font-body: Inter, system-ui, sans-serif;
|
|
28
|
-
--font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
|
|
29
|
-
--text-xs: 12px;
|
|
30
|
-
--text-sm: 13px;
|
|
31
|
-
--text-base: 15px;
|
|
32
|
-
--text-lg: 17px;
|
|
33
|
-
--text-xl: 22px;
|
|
34
|
-
--text-2xl: 32px;
|
|
35
|
-
--text-3xl: 48px;
|
|
36
|
-
--text-4xl: 66px;
|
|
37
|
-
--leading-body: 1.55;
|
|
38
|
-
--leading-tight: 1.06;
|
|
39
|
-
--tracking-display: -0.02em;
|
|
40
|
-
--space-1: 4px;
|
|
41
|
-
--space-2: 8px;
|
|
42
|
-
--space-3: 12px;
|
|
43
|
-
--space-4: 16px;
|
|
44
|
-
--space-5: 20px;
|
|
45
|
-
--space-6: 24px;
|
|
46
|
-
--space-8: 32px;
|
|
47
|
-
--space-12: 48px;
|
|
48
|
-
--section-y-desktop: 96px;
|
|
49
|
-
--section-y-tablet: 68px;
|
|
50
|
-
--section-y-phone: 48px;
|
|
51
|
-
--radius-sm: 8px;
|
|
52
|
-
--radius-md: 12px;
|
|
53
|
-
--radius-lg: 20px;
|
|
54
|
-
--radius-pill: 9999px;
|
|
55
|
-
--elev-flat: none;
|
|
56
|
-
--elev-ring: 0 0 0 1px var(--border);
|
|
57
|
-
--elev-raised: 0 24px 72px rgba(0, 0, 0, 0.36);
|
|
58
|
-
--focus-ring: 0 0 0 4px rgba(96, 165, 250, 0.28);
|
|
59
|
-
--motion-fast: 130ms;
|
|
60
|
-
--motion-base: 220ms;
|
|
61
|
-
--ease-standard: cubic-bezier(0.2, 0, 0, 1);
|
|
62
|
-
--container-max: 1200px;
|
|
63
|
-
--container-gutter-desktop: 36px;
|
|
64
|
-
--container-gutter-tablet: 24px;
|
|
65
|
-
--container-gutter-phone: 16px;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
*, *::before, *::after { box-sizing: border-box; }
|
|
69
|
-
html, body { margin: 0; padding: 0; }
|
|
70
|
-
body {
|
|
71
|
-
min-height: 100vh;
|
|
72
|
-
background: var(--bg);
|
|
73
|
-
color: var(--fg);
|
|
74
|
-
font-family: var(--font-body);
|
|
75
|
-
font-size: var(--text-base);
|
|
76
|
-
line-height: var(--leading-body);
|
|
77
|
-
-webkit-font-smoothing: antialiased;
|
|
78
|
-
}
|
|
79
|
-
.page { min-height: 100vh; background: radial-gradient(circle at 80% 8%, rgba(96, 165, 250, 0.26), transparent 34%), #0b1020; }
|
|
80
|
-
.container { max-width: var(--container-max); margin-inline: auto; padding-inline: var(--container-gutter-desktop); }
|
|
81
|
-
section { padding-block: var(--section-y-desktop); }
|
|
82
|
-
@media (max-width: 1023px) { .container { padding-inline: var(--container-gutter-tablet); } section { padding-block: var(--section-y-tablet); } }
|
|
83
|
-
@media (max-width: 639px) { .container { padding-inline: var(--container-gutter-phone); } section { padding-block: var(--section-y-phone); } }
|
|
84
|
-
h1, h2, h3, p { margin: 0; }
|
|
85
|
-
h1, h2, h3 { font-family: var(--font-display); line-height: var(--leading-tight); letter-spacing: var(--tracking-display); }
|
|
86
|
-
h1 { max-width: 820px; font-size: var(--text-4xl); font-weight: 760; }
|
|
87
|
-
h2 { font-size: var(--text-3xl); font-weight: 700; }
|
|
88
|
-
h3 { font-size: var(--text-xl); font-weight: 700; }
|
|
89
|
-
.eyebrow { color: var(--meta); font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
|
|
90
|
-
.lead { max-width: 640px; color: var(--fg-2); font-size: var(--text-lg); }
|
|
91
|
-
.hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr); gap: var(--space-8); align-items: center; }
|
|
92
|
-
.stack > * + * { margin-block-start: var(--space-4); }
|
|
93
|
-
.actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-block-start: var(--space-6); }
|
|
94
|
-
.btn {
|
|
95
|
-
display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 var(--space-5);
|
|
96
|
-
border: 1px solid transparent; border-radius: var(--radius-md); font: 700 var(--text-sm) / 1 var(--font-body);
|
|
97
|
-
color: inherit; text-decoration: none; cursor: pointer; transition: background-color var(--motion-fast) var(--ease-standard), border-color var(--motion-fast) var(--ease-standard), color var(--motion-fast) var(--ease-standard), transform var(--motion-fast) var(--ease-standard), box-shadow var(--motion-fast) var(--ease-standard);
|
|
98
|
-
}
|
|
99
|
-
.btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }
|
|
100
|
-
.btn-primary { background: var(--accent); color: var(--accent-on); }
|
|
101
|
-
.btn-primary:hover { background: var(--accent-hover); transform: translateY(-1px); }
|
|
102
|
-
.btn-secondary { background: var(--surface); color: var(--fg); border-color: var(--border); box-shadow: var(--elev-ring); }
|
|
103
|
-
.btn-secondary:hover { border-color: var(--accent); color: var(--accent); }
|
|
104
|
-
.panel { background: color-mix(in oklab, var(--surface), transparent 4%); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--elev-raised); overflow: hidden; }
|
|
105
|
-
.panel-head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding: var(--space-5); border-bottom: 1px solid var(--border-soft); }
|
|
106
|
-
.status { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--meta); font: 700 var(--text-xs) / 1 var(--font-mono); text-transform: uppercase; letter-spacing: 0.08em; }
|
|
107
|
-
.status::before { width: 8px; height: 8px; border-radius: var(--radius-pill); background: var(--success); content: ""; }
|
|
108
|
-
.metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--border-soft); }
|
|
109
|
-
.metric { padding: var(--space-5); border-right: 1px solid var(--border-soft); }
|
|
110
|
-
.metric:last-child { border-right: 0; }
|
|
111
|
-
.metric strong { display: block; font-family: var(--font-display); font-size: var(--text-2xl); line-height: var(--leading-tight); }
|
|
112
|
-
.metric span { color: var(--muted); font-size: var(--text-sm); }
|
|
113
|
-
.card-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); padding: var(--space-5); }
|
|
114
|
-
.mini-card { min-height: 148px; padding: var(--space-5); border: 1px solid var(--border-soft); border-radius: var(--radius-md); background: var(--surface-warm); }
|
|
115
|
-
.mini-card p, .tile p { color: var(--muted); font-size: var(--text-sm); margin-block-start: var(--space-3); }
|
|
116
|
-
.swatches { display: flex; gap: var(--space-2); margin-block-start: var(--space-4); }
|
|
117
|
-
.swatch { width: 32px; height: 32px; border-radius: var(--radius-sm); border: 1px solid var(--border); }
|
|
118
|
-
.swatch.accent { background: var(--accent); } .swatch.surface { background: var(--surface); } .swatch.warm { background: var(--surface-warm); } .swatch.fg { background: var(--fg); }
|
|
119
|
-
.field { display: grid; gap: var(--space-2); margin-block-start: var(--space-5); }
|
|
120
|
-
label { color: var(--fg-2); font-size: var(--text-sm); font-weight: 700; }
|
|
121
|
-
input { width: 100%; min-height: 46px; padding: 0 var(--space-4); border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); color: var(--fg); font: inherit; }
|
|
122
|
-
input:focus { outline: none; box-shadow: var(--focus-ring); border-color: var(--accent); }
|
|
123
|
-
.lower { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
|
|
124
|
-
.tile { padding: var(--space-5); border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
|
|
125
|
-
@media (max-width: 860px) { .hero, .lower { grid-template-columns: 1fr; } .metric-grid, .card-row { grid-template-columns: 1fr; } .metric { border-right: 0; border-bottom: 1px solid var(--border-soft); } .metric:last-child { border-bottom: 0; } }
|
|
126
|
-
</style>
|
|
127
|
-
</head>
|
|
128
|
-
<body>
|
|
129
|
-
<main class="page">
|
|
130
|
-
<section>
|
|
131
|
-
<div class="container hero">
|
|
132
|
-
<div class="stack">
|
|
133
|
-
<p class="eyebrow">Agentic design system</p>
|
|
134
|
-
<h1>Autonomous workflow surface</h1>
|
|
135
|
-
<p class="lead">Multi-step agent planning, tool traces, and high-confidence execution modules.</p>
|
|
136
|
-
<div class="actions" aria-label="Reference actions">
|
|
137
|
-
<a class="btn btn-primary" href="#">Primary action</a>
|
|
138
|
-
<a class="btn btn-secondary" href="#">Secondary action</a>
|
|
139
|
-
</div>
|
|
140
|
-
</div>
|
|
141
|
-
<article class="panel" aria-label="Agentic component preview">
|
|
142
|
-
<div class="panel-head"><div><p class="eyebrow">Live module</p><h3>Reference component</h3></div><span class="status">online</span></div>
|
|
143
|
-
<div class="metric-grid"><div class="metric"><strong>98%</strong><span>Signal quality</span></div><div class="metric"><strong>24</strong><span>Active flows</span></div><div class="metric"><strong>3.2s</strong><span>Response time</span></div></div>
|
|
144
|
-
<div class="card-row">
|
|
145
|
-
<div class="mini-card"><h3>Palette</h3><p>agent workflow interface with dark command surfaces, blue automation signals, and traceable task cards.</p><div class="swatches" aria-label="Token swatches"><span class="swatch accent"></span><span class="swatch surface"></span><span class="swatch warm"></span><span class="swatch fg"></span></div></div>
|
|
146
|
-
<div class="mini-card"><h3>Control</h3><p>Focus, hover, and status states share the same brand signal.</p><div class="field"><label for="agentic-input">Reference input</label><input id="agentic-input" value="Agentic system token" /></div></div>
|
|
147
|
-
</div>
|
|
148
|
-
</article>
|
|
149
|
-
</div>
|
|
150
|
-
</section>
|
|
151
|
-
<section><div class="container lower"><article class="tile"><p class="eyebrow">Typography</p><h2>Display rhythm</h2><p>Headlines use the display stack with the declared scale and leading.</p></article><article class="tile"><p class="eyebrow">Surface</p><h2>Layer system</h2><p>Cards, warm panels, borders, and raised states resolve through shared tokens.</p></article><article class="tile"><p class="eyebrow">Interaction</p><h2>Motion states</h2><p>Buttons, inputs, and panels use brand-specific focus rings and easing.</p></article></div></section>
|
|
152
|
-
</main>
|
|
153
|
-
</body>
|
|
154
|
-
</html>
|
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
/* design-systems/agentic/tokens.css
|
|
2
|
-
* Structured token bindings for Agentic.
|
|
3
|
-
* agent workflow interface with dark command surfaces, blue automation signals, and traceable task cards.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
:root {
|
|
7
|
-
--bg: #0b1020;
|
|
8
|
-
--surface: #131b2f;
|
|
9
|
-
--surface-warm: #182343;
|
|
10
|
-
--fg: #f8fafc;
|
|
11
|
-
--fg-2: #cbd5e1;
|
|
12
|
-
--muted: #8ea0b8;
|
|
13
|
-
--meta: #60a5fa;
|
|
14
|
-
--border: #293653;
|
|
15
|
-
--border-soft: #1e2a43;
|
|
16
|
-
--accent: #60a5fa;
|
|
17
|
-
--accent-on: #06111f;
|
|
18
|
-
--accent-hover: color-mix(in oklab, var(--accent), black 8%);
|
|
19
|
-
--accent-active: color-mix(in oklab, var(--accent), black 14%);
|
|
20
|
-
--success: #22c55e;
|
|
21
|
-
--warn: #fbbf24;
|
|
22
|
-
--danger: #fb7185;
|
|
23
|
-
--font-display: Inter, system-ui, sans-serif;
|
|
24
|
-
--font-body: Inter, system-ui, sans-serif;
|
|
25
|
-
--font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
|
|
26
|
-
--text-xs: 12px;
|
|
27
|
-
--text-sm: 13px;
|
|
28
|
-
--text-base: 15px;
|
|
29
|
-
--text-lg: 17px;
|
|
30
|
-
--text-xl: 22px;
|
|
31
|
-
--text-2xl: 32px;
|
|
32
|
-
--text-3xl: 48px;
|
|
33
|
-
--text-4xl: 66px;
|
|
34
|
-
--leading-body: 1.55;
|
|
35
|
-
--leading-tight: 1.06;
|
|
36
|
-
--tracking-display: -0.02em;
|
|
37
|
-
--space-1: 4px;
|
|
38
|
-
--space-2: 8px;
|
|
39
|
-
--space-3: 12px;
|
|
40
|
-
--space-4: 16px;
|
|
41
|
-
--space-5: 20px;
|
|
42
|
-
--space-6: 24px;
|
|
43
|
-
--space-8: 32px;
|
|
44
|
-
--space-12: 48px;
|
|
45
|
-
--section-y-desktop: 96px;
|
|
46
|
-
--section-y-tablet: 68px;
|
|
47
|
-
--section-y-phone: 48px;
|
|
48
|
-
--radius-sm: 8px;
|
|
49
|
-
--radius-md: 12px;
|
|
50
|
-
--radius-lg: 20px;
|
|
51
|
-
--radius-pill: 9999px;
|
|
52
|
-
--elev-flat: none;
|
|
53
|
-
--elev-ring: 0 0 0 1px var(--border);
|
|
54
|
-
--elev-raised: 0 24px 72px rgba(0, 0, 0, 0.36);
|
|
55
|
-
--focus-ring: 0 0 0 4px rgba(96, 165, 250, 0.28);
|
|
56
|
-
--motion-fast: 130ms;
|
|
57
|
-
--motion-base: 220ms;
|
|
58
|
-
--ease-standard: cubic-bezier(0.2, 0, 0, 1);
|
|
59
|
-
--container-max: 1200px;
|
|
60
|
-
--container-gutter-desktop: 36px;
|
|
61
|
-
--container-gutter-tablet: 24px;
|
|
62
|
-
--container-gutter-phone: 16px;
|
|
63
|
-
}
|