howone 0.1.20 → 0.1.23
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/package.json +1 -1
- package/templates/nextjs/lib/sdk.ts +3 -0
- package/templates/vite/.howone/skills/hallmark/LICENSE +21 -0
- package/templates/vite/.howone/skills/hallmark/README.md +147 -0
- package/templates/vite/.howone/skills/hallmark/ROADMAP.md +201 -0
- package/templates/vite/.howone/skills/hallmark/SKILL.md +551 -0
- package/templates/vite/.howone/skills/hallmark/docs/recipes.md +186 -0
- package/templates/vite/.howone/skills/hallmark/docs/screenshots/hero-anya.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/docs/screenshots/hero-bananastudio.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/docs/screenshots/hero-hyperlane.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/docs/screenshots/hero-najm.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/docs/screenshots/hero-slow-pour.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/docs/screenshots/hero-soroe.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/docs/screenshots/hero-tally.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/docs/screenshots/hero-wayfare.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/docs/study-examples.md +176 -0
- package/templates/vite/.howone/skills/hallmark/docs/talk-slides.md +364 -0
- package/templates/vite/.howone/skills/hallmark/package.json +36 -0
- package/templates/vite/.howone/skills/hallmark/references/anti-patterns.md +412 -0
- package/templates/vite/.howone/skills/hallmark/references/assets.md +399 -0
- package/templates/vite/.howone/skills/hallmark/references/color.md +95 -0
- package/templates/vite/.howone/skills/hallmark/references/component-cookbook.md +256 -0
- package/templates/vite/.howone/skills/hallmark/references/components/c1-outlined-chip.md +12 -0
- package/templates/vite/.howone/skills/hallmark/references/components/c2-inline-form-as-cta.md +16 -0
- package/templates/vite/.howone/skills/hallmark/references/components/c3-typographic-link.md +8 -0
- package/templates/vite/.howone/skills/hallmark/references/components/c4-sticky-bottom-bar.md +16 -0
- package/templates/vite/.howone/skills/hallmark/references/components/f1-bento-grid.md +20 -0
- package/templates/vite/.howone/skills/hallmark/references/components/f2-sticky-scroll-stack.md +20 -0
- package/templates/vite/.howone/skills/hallmark/references/components/f3-tabular-spec-sheet.md +11 -0
- package/templates/vite/.howone/skills/hallmark/references/components/f4-step-sequence.md +11 -0
- package/templates/vite/.howone/skills/hallmark/references/components/f5-annotated-screenshot.md +11 -0
- package/templates/vite/.howone/skills/hallmark/references/components/f6-product-card-grid.md +41 -0
- package/templates/vite/.howone/skills/hallmark/references/components/ft1-mast-headed.md +13 -0
- package/templates/vite/.howone/skills/hallmark/references/components/ft2-inline-rule-single-line.md +10 -0
- package/templates/vite/.howone/skills/hallmark/references/components/ft3-index-style-category-list.md +12 -0
- package/templates/vite/.howone/skills/hallmark/references/components/ft4-dense-typographic.md +10 -0
- package/templates/vite/.howone/skills/hallmark/references/components/ft5-statement.md +21 -0
- package/templates/vite/.howone/skills/hallmark/references/components/ft6-letter-close.md +19 -0
- package/templates/vite/.howone/skills/hallmark/references/components/ft7-newsletter-first.md +27 -0
- package/templates/vite/.howone/skills/hallmark/references/components/ft8-marquee-scroll.md +25 -0
- package/templates/vite/.howone/skills/hallmark/references/components/h1-marquee.md +15 -0
- package/templates/vite/.howone/skills/hallmark/references/components/h2-split-diptych.md +15 -0
- package/templates/vite/.howone/skills/hallmark/references/components/h3-quote-led.md +11 -0
- package/templates/vite/.howone/skills/hallmark/references/components/h4-stat-led.md +14 -0
- package/templates/vite/.howone/skills/hallmark/references/components/h5-letter-hero.md +11 -0
- package/templates/vite/.howone/skills/hallmark/references/components/h6-photographic-fold.md +16 -0
- package/templates/vite/.howone/skills/hallmark/references/components/h7-demo-video-clipped-by-viewport-edge.md +27 -0
- package/templates/vite/.howone/skills/hallmark/references/components/h8-mockup-split-browser-framed.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/components/h9-custom-illustration-centerpiece.md +27 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n1-wordmark-2-links.md +12 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n10-floating-on-scroll-morph.md +19 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n2-floating-chip.md +14 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n3-side-rail.md +14 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n4-hidden-behind-k.md +9 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n5-floating-pill.md +28 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n6-newspaper-masthead.md +24 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n7-brutal-slab.md +22 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n8-terminal-command.md +21 -0
- package/templates/vite/.howone/skills/hallmark/references/components/n9-edge-aligned-minimal.md +17 -0
- package/templates/vite/.howone/skills/hallmark/references/components/s1-left-margin-numbered.md +15 -0
- package/templates/vite/.howone/skills/hallmark/references/components/s2-hanging.md +13 -0
- package/templates/vite/.howone/skills/hallmark/references/components/s3-sticky-pinned.md +19 -0
- package/templates/vite/.howone/skills/hallmark/references/components/s4-inline-no-break.md +11 -0
- package/templates/vite/.howone/skills/hallmark/references/components/s5-bottom-anchored.md +13 -0
- package/templates/vite/.howone/skills/hallmark/references/components/t1-pull-quote-with-marginalia.md +12 -0
- package/templates/vite/.howone/skills/hallmark/references/components/t2-logo-wall-hairline.md +19 -0
- package/templates/vite/.howone/skills/hallmark/references/components/t3-single-huge-quote.md +11 -0
- package/templates/vite/.howone/skills/hallmark/references/components/t4-numbered-stat-strip.md +14 -0
- package/templates/vite/.howone/skills/hallmark/references/contract.md +24 -0
- package/templates/vite/.howone/skills/hallmark/references/copy.md +182 -0
- package/templates/vite/.howone/skills/hallmark/references/custom-craft.md +626 -0
- package/templates/vite/.howone/skills/hallmark/references/custom-theme.md +329 -0
- package/templates/vite/.howone/skills/hallmark/references/design-md.md +116 -0
- package/templates/vite/.howone/skills/hallmark/references/export-formats.md +328 -0
- package/templates/vite/.howone/skills/hallmark/references/floating-nav.md +89 -0
- package/templates/vite/.howone/skills/hallmark/references/genres/atmospheric.md +65 -0
- package/templates/vite/.howone/skills/hallmark/references/genres/editorial.md +70 -0
- package/templates/vite/.howone/skills/hallmark/references/genres/modern-minimal.md +67 -0
- package/templates/vite/.howone/skills/hallmark/references/genres/playful.md +65 -0
- package/templates/vite/.howone/skills/hallmark/references/hero-enrichment.md +474 -0
- package/templates/vite/.howone/skills/hallmark/references/imagery-kit.md +170 -0
- package/templates/vite/.howone/skills/hallmark/references/interaction-and-states.md +207 -0
- package/templates/vite/.howone/skills/hallmark/references/layout-and-space.md +111 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/01-bento-grid.md +35 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/02-long-document.md +34 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/03-marquee-hero.md +31 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/04-stat-led.md +32 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/05-workbench.md +32 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/06-conversational-faq.md +33 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/07-manifesto.md +32 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/08-photographic.md +34 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/09-quote-led.md +32 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/10-specimen.md +32 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/11-catalogue.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/12-letter.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/13-index-first.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/14-narrative-workflow.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/15-split-studio.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/16-feature-stack.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/17-type-specimen.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/18-portfolio-grid.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/19-map-diagram.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/20-ecosystem-index.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures/21-component-playground.md +23 -0
- package/templates/vite/.howone/skills/hallmark/references/macrostructures.md +89 -0
- package/templates/vite/.howone/skills/hallmark/references/microinteractions.md +260 -0
- package/templates/vite/.howone/skills/hallmark/references/motion.md +109 -0
- package/templates/vite/.howone/skills/hallmark/references/preview-examples.md +49 -0
- package/templates/vite/.howone/skills/hallmark/references/responsive.md +138 -0
- package/templates/vite/.howone/skills/hallmark/references/slop-test.md +205 -0
- package/templates/vite/.howone/skills/hallmark/references/structure.md +164 -0
- package/templates/vite/.howone/skills/hallmark/references/study.md +486 -0
- package/templates/vite/.howone/skills/hallmark/references/typography.md +243 -0
- package/templates/vite/.howone/skills/hallmark/references/verbs/audit.md +25 -0
- package/templates/vite/.howone/skills/hallmark/references/verbs/redesign.md +269 -0
- package/templates/vite/.howone/skills/hallmark/site/OG-hallmark.png +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/01-tide-podcast/brief.md +71 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/01-tide-podcast/index.html +64 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/01-tide-podcast/style.css +240 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/02-streampipe-cli/brief.md +65 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/02-streampipe-cli/index.html +105 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/02-streampipe-cli/style.css +250 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/03-maple-bakery/brief.md +64 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/03-maple-bakery/index.html +131 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/03-maple-bakery/style.css +240 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/04-meridian-manifesto/brief.md +67 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/04-meridian-manifesto/index.html +86 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/04-meridian-manifesto/style.css +262 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/05-tracejam-saas/brief.md +63 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/05-tracejam-saas/index.html +167 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/05-tracejam-saas/style.css +457 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/06-anya-portfolio/brief.md +65 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/06-anya-portfolio/index.html +159 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/06-anya-portfolio/style.css +288 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/07-foundry-compliance/brief.md +64 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/07-foundry-compliance/index.html +146 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/07-foundry-compliance/style.css +484 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/08-cohort-courses/brief.md +64 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/08-cohort-courses/index.html +116 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/08-cohort-courses/style.css +354 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/09-slow-pour/index.html +638 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/10-owl-hours/index.html +515 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/11-soroe-ceramics/index.html +515 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/12-loafer/index.html +608 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/13-alma/index.html +587 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/README.md +157 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/BananaStudio-loop.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/BananaStudio-still.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/Hyperlane-example.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/Hyperlane-still.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/Najm-loop.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/Najm-still.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/Podcast-loop.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/SaaS-loop.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/SaaS-still.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/Soroe-loop.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/Soroe-still.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/after-quiet-hour.png +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/anya-loop.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/anya-still.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/audit-example.png +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/before-quiet-hour.png +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/example-redesign-uractivation.png +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/slow-pour-loop.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/slow-pour-still.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/study-example.png +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/uractivation-after-loop.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/wayfare-loop.mp4 +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/_thumbs/wayfare-still.jpg +0 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/custom/01-coffeebox/index.html +77 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/custom/01-coffeebox/style.css +238 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/custom/02-loop/index.html +110 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/custom/02-loop/style.css +326 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/custom/03-mossroot/index.html +134 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/custom/03-mossroot/style.css +262 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/custom/README.md +30 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/README.md +17 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/audit/audit-report.md +56 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/audit/input.html +160 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/audit/notes.md +29 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/redesign/input.html +63 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/redesign/notes.md +72 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/redesign/output.html +374 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/study/diagnosis.md +52 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/study/input-description.md +29 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/study/notes.md +61 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/study/output.css +193 -0
- package/templates/vite/.howone/skills/hallmark/site/_tests/verbs/study/output.html +66 -0
- package/templates/vite/.howone/skills/hallmark/site/css/base.css +194 -0
- package/templates/vite/.howone/skills/hallmark/site/css/components.css +4886 -0
- package/templates/vite/.howone/skills/hallmark/site/css/sections.css +2072 -0
- package/templates/vite/.howone/skills/hallmark/site/css/tokens.css +1129 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/bananastudio/index.html +475 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/bananastudio/styles.css +1584 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/bananastudio/tokens.css +96 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/hyperlane/index.html +344 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/hyperlane/script.js +103 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/hyperlane/styles.css +1103 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/hyperlane/tokens.css +83 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/najm/index.html +368 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/najm/script.js +133 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/najm/styles.css +1062 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/najm/tokens.css +97 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/tally/app.js +84 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/tally/index.html +446 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/tally/styles.css +1087 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/tally/tokens.css +101 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/wayfare/index.html +359 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/wayfare/style.css +1168 -0
- package/templates/vite/.howone/skills/hallmark/site/examples/wayfare/tokens.css +81 -0
- package/templates/vite/.howone/skills/hallmark/site/favicon-dark.svg +5 -0
- package/templates/vite/.howone/skills/hallmark/site/favicon-light.svg +5 -0
- package/templates/vite/.howone/skills/hallmark/site/index.html +1043 -0
- package/templates/vite/.howone/skills/hallmark/site/js/main.js +1175 -0
- package/templates/vite/.howone/skills/hallmark/vercel.json +6 -0
- package/templates/vite/.howone/skills/howone-sdk/01-architect/01-app-generation.md +126 -0
- package/templates/vite/.howone/skills/howone-sdk/{references/08-manifest-codegen.md → 01-architect/02-manifest-codegen.md} +31 -19
- package/templates/vite/.howone/skills/howone-sdk/02-database/01-schema-design.md +147 -0
- package/templates/vite/.howone/skills/howone-sdk/02-database/02-schema-operations.md +96 -0
- package/templates/vite/.howone/skills/howone-sdk/02-database/03-data-access-patterns.md +172 -0
- package/templates/vite/.howone/skills/howone-sdk/{references → 03-sdk}/01-client-setup.md +3 -3
- package/templates/vite/.howone/skills/howone-sdk/{references/04-auth.md → 03-sdk/03-auth.md} +120 -3
- package/templates/vite/.howone/skills/howone-sdk/{references/06-react-integration.md → 03-sdk/04-react-integration.md} +2 -4
- package/templates/vite/.howone/skills/howone-sdk/{references/03-ai-actions.md → 03-sdk/07-ai-action-calls.md} +31 -34
- package/templates/vite/.howone/skills/howone-sdk/04-ai/.gitkeep +1 -0
- package/templates/vite/.howone/skills/howone-sdk/04-ai/01-ai-capability-architecture.md +142 -0
- package/templates/vite/.howone/skills/howone-sdk/04-ai/02-workflow-contract-rules.md +169 -0
- package/templates/vite/.howone/skills/howone-sdk/04-ai/03-ai-sdk-handoff.md +80 -0
- package/templates/vite/.howone/skills/howone-sdk/SKILL.md +118 -93
- package/templates/vite/.howone/skills/howone-sdk/agents/openai.yaml +3 -3
- package/templates/vite/.howone/skills/impeccable/SKILL.md +168 -0
- package/templates/vite/.howone/skills/impeccable/agents/impeccable-asset-producer.md +101 -0
- package/templates/vite/.howone/skills/impeccable/reference/adapt.md +190 -0
- package/templates/vite/.howone/skills/impeccable/reference/animate.md +175 -0
- package/templates/vite/.howone/skills/impeccable/reference/audit.md +133 -0
- package/templates/vite/.howone/skills/impeccable/reference/bolder.md +113 -0
- package/templates/vite/.howone/skills/impeccable/reference/brand.md +118 -0
- package/templates/vite/.howone/skills/impeccable/reference/clarify.md +174 -0
- package/templates/vite/.howone/skills/impeccable/reference/codex.md +105 -0
- package/templates/vite/.howone/skills/impeccable/reference/cognitive-load.md +106 -0
- package/templates/vite/.howone/skills/impeccable/reference/color-and-contrast.md +105 -0
- package/templates/vite/.howone/skills/impeccable/reference/colorize.md +154 -0
- package/templates/vite/.howone/skills/impeccable/reference/craft.md +123 -0
- package/templates/vite/.howone/skills/impeccable/reference/critique.md +273 -0
- package/templates/vite/.howone/skills/impeccable/reference/delight.md +302 -0
- package/templates/vite/.howone/skills/impeccable/reference/distill.md +111 -0
- package/templates/vite/.howone/skills/impeccable/reference/document.md +427 -0
- package/templates/vite/.howone/skills/impeccable/reference/extract.md +69 -0
- package/templates/vite/.howone/skills/impeccable/reference/harden.md +347 -0
- package/templates/vite/.howone/skills/impeccable/reference/heuristics-scoring.md +234 -0
- package/templates/vite/.howone/skills/impeccable/reference/interaction-design.md +195 -0
- package/templates/vite/.howone/skills/impeccable/reference/layout.md +141 -0
- package/templates/vite/.howone/skills/impeccable/reference/live.md +622 -0
- package/templates/vite/.howone/skills/impeccable/reference/motion-design.md +109 -0
- package/templates/vite/.howone/skills/impeccable/reference/onboard.md +234 -0
- package/templates/vite/.howone/skills/impeccable/reference/optimize.md +258 -0
- package/templates/vite/.howone/skills/impeccable/reference/overdrive.md +130 -0
- package/templates/vite/.howone/skills/impeccable/reference/personas.md +179 -0
- package/templates/vite/.howone/skills/impeccable/reference/polish.md +242 -0
- package/templates/vite/.howone/skills/impeccable/reference/product.md +62 -0
- package/templates/vite/.howone/skills/impeccable/reference/quieter.md +99 -0
- package/templates/vite/.howone/skills/impeccable/reference/responsive-design.md +114 -0
- package/templates/vite/.howone/skills/impeccable/reference/shape.md +165 -0
- package/templates/vite/.howone/skills/impeccable/reference/spatial-design.md +100 -0
- package/templates/vite/.howone/skills/impeccable/reference/teach.md +156 -0
- package/templates/vite/.howone/skills/impeccable/reference/typeset.md +124 -0
- package/templates/vite/.howone/skills/impeccable/reference/typography.md +159 -0
- package/templates/vite/.howone/skills/impeccable/reference/ux-writing.md +107 -0
- package/templates/vite/.howone/skills/impeccable/scripts/cleanup-deprecated.mjs +284 -0
- package/templates/vite/.howone/skills/impeccable/scripts/command-metadata.json +94 -0
- package/templates/vite/.howone/skills/impeccable/scripts/critique-storage.mjs +242 -0
- package/templates/vite/.howone/skills/impeccable/scripts/design-parser.mjs +820 -0
- package/templates/vite/.howone/skills/impeccable/scripts/detect-csp.mjs +198 -0
- package/templates/vite/.howone/skills/impeccable/scripts/detect.mjs +21 -0
- package/templates/vite/.howone/skills/impeccable/scripts/impeccable-paths.mjs +110 -0
- package/templates/vite/.howone/skills/impeccable/scripts/is-generated.mjs +69 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-accept.mjs +595 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-browser-session.js +123 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-browser.js +4860 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-complete.mjs +75 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-completion.mjs +18 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-inject.mjs +446 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-poll.mjs +200 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-resume.mjs +48 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-server.mjs +838 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-session-store.mjs +254 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-status.mjs +47 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live-wrap.mjs +632 -0
- package/templates/vite/.howone/skills/impeccable/scripts/live.mjs +247 -0
- package/templates/vite/.howone/skills/impeccable/scripts/load-context.mjs +141 -0
- package/templates/vite/.howone/skills/impeccable/scripts/modern-screenshot.umd.js +14 -0
- package/templates/vite/.howone/skills/impeccable/scripts/pin.mjs +214 -0
- package/templates/vite/AGENTS.md +2 -12
- package/templates/vite/package.json +1 -1
- package/templates/vite/src/lib/sdk.ts +3 -0
- /package/templates/vite/.howone/skills/howone-sdk/{references → 03-sdk}/02-entity-operations.md +0 -0
- /package/templates/vite/.howone/skills/howone-sdk/{references → 03-sdk}/05-file-upload.md +0 -0
- /package/templates/vite/.howone/skills/howone-sdk/{references/07-raw-http.md → 03-sdk/06-raw-http.md} +0 -0
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
# AI SDK Handoff
|
|
2
|
+
|
|
3
|
+
Use this reference after AI capability artifacts have been synced and app code needs to call the
|
|
4
|
+
workflow.
|
|
5
|
+
|
|
6
|
+
## Binding Source
|
|
7
|
+
|
|
8
|
+
Generate `src/lib/sdk.ts` from `.howone/ai/manifest.json`. Do not write AI bindings from memory or
|
|
9
|
+
from the original user prompt.
|
|
10
|
+
|
|
11
|
+
For each manifest capability:
|
|
12
|
+
|
|
13
|
+
1. Read `name`.
|
|
14
|
+
2. Read `workflowId`.
|
|
15
|
+
3. Read `inputSchema`.
|
|
16
|
+
4. Read `outputSchema`.
|
|
17
|
+
5. Generate zod input and output schemas from the JSON Schema fields.
|
|
18
|
+
6. Bind with `defineAiAction(name, { workflowId, inputSchema, outputSchema })`.
|
|
19
|
+
|
|
20
|
+
`workflowId` is mandatory. Without it, the SDK falls back to the action name as the execution URL
|
|
21
|
+
segment, which is not a workflow UUID.
|
|
22
|
+
|
|
23
|
+
## Output Handling
|
|
24
|
+
|
|
25
|
+
For a typed action with `outputSchema`, `.run()` returns the validated workflow output payload.
|
|
26
|
+
The SDK unwraps the EAX execution envelope and validates `finalResult` internally.
|
|
27
|
+
|
|
28
|
+
Use this pattern:
|
|
29
|
+
|
|
30
|
+
```ts
|
|
31
|
+
const output = await howone.ai.generateSummary.run(input)
|
|
32
|
+
// output is GenerateSummaryOutput when outputSchema is configured.
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
Do not read `raw.finalResult`, `raw.result`, or `raw.data.result` from a typed action result. Those
|
|
36
|
+
paths are execution/SSE internals. App code should use the value returned by `.run()` directly.
|
|
37
|
+
|
|
38
|
+
Do not make every output field `.optional()` or add `.passthrough()` to hide validation errors.
|
|
39
|
+
Required fields in the manifest must stay required in Zod. If validation fails, inspect
|
|
40
|
+
`AiSchemaValidationError.issues` and fix the capability contract or workflow output mapping.
|
|
41
|
+
|
|
42
|
+
## UI State
|
|
43
|
+
|
|
44
|
+
AI calls should run in event handlers, effects, or explicit async actions. Never call
|
|
45
|
+
`howone.ai.*.run()` inside JSX render.
|
|
46
|
+
|
|
47
|
+
Recommended UI states:
|
|
48
|
+
|
|
49
|
+
- idle
|
|
50
|
+
- running
|
|
51
|
+
- succeeded
|
|
52
|
+
- failed
|
|
53
|
+
- cancelled when using streaming
|
|
54
|
+
|
|
55
|
+
For streaming, keep the `AiSession` in a ref and call `cancel()` from the UI.
|
|
56
|
+
|
|
57
|
+
## Persistence Handoff
|
|
58
|
+
|
|
59
|
+
If the app stores generated output:
|
|
60
|
+
|
|
61
|
+
1. Run the AI workflow.
|
|
62
|
+
2. Use the typed output returned by `.run()`.
|
|
63
|
+
3. Write the resulting data through `howone.entities.*`.
|
|
64
|
+
|
|
65
|
+
Do not ask the workflow to write to the database. Do not pass owner fields for authenticated
|
|
66
|
+
user-owned entities; HowOne derives ownership from the JWT.
|
|
67
|
+
|
|
68
|
+
## Workflow Edit Handoff
|
|
69
|
+
|
|
70
|
+
When editing an external workflow implementation later, use `external-ai-capability` with:
|
|
71
|
+
|
|
72
|
+
- `mode: "update"`
|
|
73
|
+
- `capabilityName`
|
|
74
|
+
- `workflowConfigID`
|
|
75
|
+
- `updatePrompt`
|
|
76
|
+
|
|
77
|
+
`workflowConfigID` is not `workflowId`. It comes from a confirmed workflow status result:
|
|
78
|
+
`payload.workflow_details.new_workflow_config_id`.
|
|
79
|
+
|
|
80
|
+
If the schema changed, update and sync the capability contract before submitting the workflow edit.
|
|
@@ -1,101 +1,126 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: howone-sdk
|
|
3
|
-
description:
|
|
3
|
+
description: Required operating manual for HowOne generated apps. Use for backend schema/API design, frontend UI implementation that reads or writes HowOne data, AI capability/workflow design, SDK binding/codegen from .howone manifests, auth, uploads, public/private access, and any code that calls @howone/sdk, howone.entities.*, howone.public.entities.*, or howone.ai.*.
|
|
4
4
|
---
|
|
5
5
|
|
|
6
|
-
# HowOne
|
|
6
|
+
# HowOne App Architecture Skill
|
|
7
7
|
|
|
8
|
-
This skill is the
|
|
8
|
+
This skill is the operating manual for generated HowOne apps. Use it before making platform
|
|
9
|
+
decisions for backend data, frontend data access, auth, AI capabilities, SDK bindings, or generated
|
|
10
|
+
app code that depends on HowOne runtime behavior.
|
|
9
11
|
|
|
10
|
-
|
|
12
|
+
Load the smallest set of numbered references that match the task, but do not skip this skill for
|
|
13
|
+
backend schema design, frontend implementation, or AI features. The references define the contracts
|
|
14
|
+
that app code must follow.
|
|
11
15
|
|
|
12
|
-
|
|
16
|
+
## Active Tracks
|
|
17
|
+
|
|
18
|
+
| Track | Folder | Use For |
|
|
13
19
|
|---|---|---|
|
|
14
|
-
|
|
|
15
|
-
|
|
|
16
|
-
|
|
|
17
|
-
|
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
-
|
|
101
|
-
|
|
20
|
+
| `01-architect/` | App generation + manifest flow | End-to-end HowOne app generation flow: when to design backend, when to sync manifests, when to update SDK bindings, and how to choose auth/data posture. |
|
|
21
|
+
| `02-database/` | Backend schema + data access design | Entity schema contract, schema operations, access modes, owner/public data posture, indexes, versions, and guardrails. |
|
|
22
|
+
| `03-sdk/` | Frontend SDK usage | `src/lib/sdk.ts`, auth, React provider, entity calls, public data, uploads, raw HTTP, AI action calls. |
|
|
23
|
+
| `04-ai/` | AI capability + workflow design | HowOne AI capability contracts, external workflow create/update submission, workflow schema rules, persistence boundaries, and SDK handoff. |
|
|
24
|
+
|
|
25
|
+
## Routing
|
|
26
|
+
|
|
27
|
+
Read references by task shape. Prefer exact references over generic examples.
|
|
28
|
+
|
|
29
|
+
- New HowOne app or broad feature planning: read `01-architect/01-app-generation.md`.
|
|
30
|
+
- Any feature touching backend data, frontend data access, or saved records: read the architect
|
|
31
|
+
flow first, then the relevant database and SDK references below.
|
|
32
|
+
- Any feature touching AI generation, AI workflow behavior, or AI outputs: read the AI references
|
|
33
|
+
first, then the SDK handoff/action-call references.
|
|
34
|
+
- AI capability, AI workflow generation/editing, or full-stack AI feature planning: read
|
|
35
|
+
`04-ai/01-ai-capability-architecture.md` and `04-ai/02-workflow-contract-rules.md`.
|
|
36
|
+
- Backend database/schema creation or change: read `02-database/01-schema-design.md` and
|
|
37
|
+
`02-database/02-schema-operations.md`.
|
|
38
|
+
- AI output persistence: read the `04-ai/` files first, then `02-database/01-schema-design.md`.
|
|
39
|
+
- After schema sync, when app code must call the entity: read
|
|
40
|
+
`01-architect/02-manifest-codegen.md` and `03-sdk/02-entity-operations.md`.
|
|
41
|
+
- Custom login page, Email OTP, Phone OTP, Google, GitHub, token persistence, repeated login,
|
|
42
|
+
or missing token: read `03-sdk/03-auth.md` and `03-sdk/04-react-integration.md`.
|
|
43
|
+
- `src/lib/sdk.ts`, `createClient`, env vars, or generated bindings: read
|
|
44
|
+
`03-sdk/01-client-setup.md` and `01-architect/02-manifest-codegen.md`.
|
|
45
|
+
- Public landing pages or share URLs: read `02-database/03-data-access-patterns.md`,
|
|
46
|
+
`03-sdk/02-entity-operations.md`, and `01-architect/02-manifest-codegen.md`.
|
|
47
|
+
- File upload: read `03-sdk/05-file-upload.md`.
|
|
48
|
+
- Raw HTTP escape hatch: read `03-sdk/06-raw-http.md`.
|
|
49
|
+
- App-side AI action calls after `.howone/ai/manifest.json` exists: read
|
|
50
|
+
`03-sdk/07-ai-action-calls.md`.
|
|
51
|
+
|
|
52
|
+
## Reference Selection Protocol
|
|
53
|
+
|
|
54
|
+
Before writing code, classify the touched surfaces:
|
|
55
|
+
|
|
56
|
+
| Touched surface | Required references |
|
|
57
|
+
|---|---|
|
|
58
|
+
| New app, feature architecture, or uncertain data posture | `01-architect/01-app-generation.md` |
|
|
59
|
+
| Entity/schema/access/index change | `02-database/01-schema-design.md`, `02-database/02-schema-operations.md` |
|
|
60
|
+
| Existing synced manifest to TypeScript bindings | `01-architect/02-manifest-codegen.md` |
|
|
61
|
+
| UI reads/writes entities | `03-sdk/01-client-setup.md`, `03-sdk/02-entity-operations.md` |
|
|
62
|
+
| Public read/share flow | `02-database/03-data-access-patterns.md`, `03-sdk/02-entity-operations.md` |
|
|
63
|
+
| Auth/session/login behavior | `03-sdk/03-auth.md`, `03-sdk/04-react-integration.md` |
|
|
64
|
+
| AI capability or workflow design | `04-ai/01-ai-capability-architecture.md`, `04-ai/02-workflow-contract-rules.md` |
|
|
65
|
+
| AI manifest handoff to app code | `04-ai/03-ai-sdk-handoff.md`, `03-sdk/07-ai-action-calls.md` |
|
|
66
|
+
| File upload | `03-sdk/05-file-upload.md` |
|
|
67
|
+
| Raw HTTP escape hatch | `03-sdk/06-raw-http.md` |
|
|
68
|
+
|
|
69
|
+
If a task spans multiple surfaces, read one reference from each surface before editing. Do not
|
|
70
|
+
invent API parameters, response shapes, owner fields, workflow IDs, or output paths from memory.
|
|
71
|
+
|
|
72
|
+
## Core Workflow
|
|
73
|
+
|
|
74
|
+
For app features that touch backend data:
|
|
75
|
+
|
|
76
|
+
1. Decide the data posture in the architect track: private user data, authenticated shared data,
|
|
77
|
+
public list data, or public scoped share data.
|
|
78
|
+
2. Design or update the entity contract in the database track.
|
|
79
|
+
3. Use schema tools to preview/apply the same operations, then sync schema artifacts.
|
|
80
|
+
4. Read `.howone/database/manifest.json`.
|
|
81
|
+
5. Generate or update app SDK bindings from the manifest.
|
|
82
|
+
6. Implement frontend calls using the SDK track.
|
|
83
|
+
7. Validate with the app's typecheck/build.
|
|
84
|
+
|
|
85
|
+
For app features that touch AI:
|
|
86
|
+
|
|
87
|
+
1. Decide the AI feature boundary in the AI track: one workflow per feature, except RAG uses
|
|
88
|
+
indexing and query workflows.
|
|
89
|
+
2. Design or update the AI capability contract with `ai-capability-design`.
|
|
90
|
+
3. Preview/apply the same AI patch, then sync AI artifacts.
|
|
91
|
+
4. Submit external workflow create/update with `external-ai-capability`.
|
|
92
|
+
5. Preserve returned request IDs for the workflow status/background-task layer.
|
|
93
|
+
6. Read `.howone/ai/manifest.json`.
|
|
94
|
+
7. Generate or update app SDK bindings from the manifest.
|
|
95
|
+
8. Implement frontend calls using `howone.ai.*`.
|
|
96
|
+
9. If outputs are saved, derive entity fields from the AI `outputSchema`, then follow the database
|
|
97
|
+
workflow.
|
|
98
|
+
|
|
99
|
+
For frontend-only SDK work:
|
|
100
|
+
|
|
101
|
+
1. Read existing `src/lib/sdk.ts`.
|
|
102
|
+
2. Read only the SDK reference for the touched surface.
|
|
103
|
+
3. Preserve existing generated bindings and import style.
|
|
104
|
+
4. Validate.
|
|
105
|
+
|
|
106
|
+
## Non-Negotiable Rules
|
|
107
|
+
|
|
108
|
+
- Generate SDK bindings from synced manifests, not from memory.
|
|
109
|
+
- Keep `.howone/` as manifest storage only; do not write generated source files there.
|
|
110
|
+
- Configure `projectId` and `env` only in `createClient`.
|
|
111
|
+
- Use `import.meta.env.VITE_HOWONE_PROJECT_ID` and `import.meta.env.VITE_HOWONE_ENV`; do not
|
|
112
|
+
hardcode project IDs or add fallback env values.
|
|
113
|
+
- For private user-owned data, authenticated APIs derive owner from JWT. Do not pass
|
|
114
|
+
`created_by_id`, `created_by_user_id`, `createdById`, `ownerId`, or `puid`.
|
|
115
|
+
- For `access.authenticated.read = "own"`, prefer `howone.entities.Entity.query.mine(...)`.
|
|
116
|
+
- Public pages use `howone.public.entities.*` only when manifest access explicitly allows public
|
|
117
|
+
reads or writes.
|
|
118
|
+
- For custom in-app login, use `HowOneProvider auth="none"`, call
|
|
119
|
+
`howone.auth.setToken(token)` on success, and verify startup session with `await howone.me()`.
|
|
120
|
+
- AI workflows are implementation, not persistence. Never put CRUD, auth, upload handling, or app
|
|
121
|
+
state management into the workflow capability contract.
|
|
122
|
+
- For external workflow edits, pass `workflowConfigID` from a confirmed workflow status result; do
|
|
123
|
+
not invent it or omit it.
|
|
124
|
+
- If the user explicitly requires AI behavior that the available workflow service cannot support,
|
|
125
|
+
stop that AI implementation path and report the unsupported requirement instead of faking,
|
|
126
|
+
silently omitting, or replacing the AI capability with static behavior.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
interface:
|
|
2
|
-
display_name: "HowOne
|
|
3
|
-
short_description: "
|
|
4
|
-
default_prompt: "Use this skill
|
|
2
|
+
display_name: "HowOne App Architecture"
|
|
3
|
+
short_description: "Design HowOne app schema, SDK bindings, and auth/data integration."
|
|
4
|
+
default_prompt: "Use this skill to choose the HowOne app architecture track, then implement schema, SDK bindings, or frontend SDK calls correctly."
|
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: impeccable
|
|
3
|
+
description: "Use when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a frontend interface. Covers websites, landing pages, dashboards, product UI, app shells, components, forms, settings, onboarding, and empty states. Handles UX review, visual hierarchy, information architecture, cognitive load, accessibility, performance, responsive behavior, theming, anti-patterns, typography, fonts, spacing, layout, alignment, color, motion, micro-interactions, UX copy, error states, edge cases, i18n, and reusable design systems or tokens. Also use for bland designs that need to become bolder or more delightful, loud designs that should become quieter, live browser iteration on UI elements, or ambitious visual effects that should feel technically extraordinary. Not for backend-only or non-UI tasks."
|
|
4
|
+
argument-hint: "[{{command_hint}}] [target]"
|
|
5
|
+
user-invocable: true
|
|
6
|
+
allowed-tools:
|
|
7
|
+
- Bash(npx impeccable *)
|
|
8
|
+
license: Apache 2.0. Based on Anthropic's frontend-design skill. See NOTICE.md for attribution.
|
|
9
|
+
---
|
|
10
|
+
|
|
11
|
+
Designs and iterates production-grade frontend interfaces. Real working code, committed design choices, exceptional craft.
|
|
12
|
+
|
|
13
|
+
## Setup
|
|
14
|
+
|
|
15
|
+
Before any design work or file edits:
|
|
16
|
+
|
|
17
|
+
1. Load context (PRODUCT.md / DESIGN.md) via the loader script.
|
|
18
|
+
2. Identify the register and load the matching register reference (brand.md or product.md).
|
|
19
|
+
3. **If the user invoked a sub-command (e.g. `craft`, `shape`, `audit`), load its reference file too.** This is non-negotiable: `craft` without `craft.md` loaded means you'll skip the shape-and-confirm step the user expects.
|
|
20
|
+
|
|
21
|
+
Skipping these produces generic output that ignores the project.
|
|
22
|
+
|
|
23
|
+
### 1. Context gathering
|
|
24
|
+
|
|
25
|
+
Two files, case-insensitive. The loader looks at the project root by default and falls back to `.agents/context/` and `docs/` if the root is clean. Override with `IMPECCABLE_CONTEXT_DIR=path/to/dir` (absolute or relative to cwd).
|
|
26
|
+
|
|
27
|
+
- **PRODUCT.md**: required. Users, brand, tone, anti-references, strategic principles.
|
|
28
|
+
- **DESIGN.md**: optional, strongly recommended. Colors, typography, elevation, components.
|
|
29
|
+
|
|
30
|
+
Load both in one call:
|
|
31
|
+
|
|
32
|
+
```bash
|
|
33
|
+
node {{scripts_path}}/load-context.mjs
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
Consume the full JSON output. Never pipe through `head`, `tail`, `grep`, or `jq`. The output's `contextDir` field tells you where the files were resolved from.
|
|
37
|
+
|
|
38
|
+
If the output is already in this session's conversation history, don't re-run. Exceptions requiring a fresh load: you just ran `{{command_prefix}}impeccable teach` or `{{command_prefix}}impeccable document` (they rewrite the files), or the user manually edited one.
|
|
39
|
+
|
|
40
|
+
`{{command_prefix}}impeccable live` already warms context via `live.mjs`. If you've run `live.mjs`, don't also run `load-context.mjs` this session.
|
|
41
|
+
|
|
42
|
+
If PRODUCT.md is missing, empty, or placeholder (`[TODO]` markers, <200 chars): run `{{command_prefix}}impeccable teach`, then resume the user's original task with the fresh context. If the original task was `{{command_prefix}}impeccable craft`, resume into `{{command_prefix}}impeccable shape` before any implementation work.
|
|
43
|
+
|
|
44
|
+
If DESIGN.md is missing: nudge once per session (*"Run `{{command_prefix}}impeccable document` for more on-brand output"*), then proceed.
|
|
45
|
+
|
|
46
|
+
### 2. Register
|
|
47
|
+
|
|
48
|
+
Every design task is **brand** (marketing, landing, campaign, long-form content, portfolio: design IS the product) or **product** (app UI, admin, dashboard, tool: design SERVES the product).
|
|
49
|
+
|
|
50
|
+
Identify before designing. Priority: (1) cue in the task itself ("landing page" vs "dashboard"); (2) the surface in focus (the page, file, or route being worked on); (3) `register` field in PRODUCT.md. First match wins.
|
|
51
|
+
|
|
52
|
+
If PRODUCT.md lacks the `register` field (legacy), infer it once from its "Users" and "Product Purpose" sections, then cache the inferred value for the session. Suggest the user run `{{command_prefix}}impeccable teach` to add the field explicitly.
|
|
53
|
+
|
|
54
|
+
Load the matching reference: [reference/brand.md](reference/brand.md) or [reference/product.md](reference/product.md). The shared design laws below apply to both.
|
|
55
|
+
|
|
56
|
+
## Shared design laws
|
|
57
|
+
|
|
58
|
+
Apply to every design, both registers. Match implementation complexity to the aesthetic vision: maximalism needs elaborate code, minimalism needs precision. Interpret creatively. Vary across projects; never converge on the same choices. {{model}} is capable of extraordinary work. Don't hold back.
|
|
59
|
+
|
|
60
|
+
### Color
|
|
61
|
+
|
|
62
|
+
- Use OKLCH. Reduce chroma as lightness approaches 0 or 100; high chroma at extremes looks garish.
|
|
63
|
+
- Never use `#000` or `#fff`. Tint every neutral toward the brand hue (chroma 0.005–0.01 is enough).
|
|
64
|
+
- Pick a **color strategy** before picking colors. Four steps on the commitment axis:
|
|
65
|
+
- **Restrained**: tinted neutrals + one accent ≤10%. Product default; brand minimalism.
|
|
66
|
+
- **Committed**: one saturated color carries 30–60% of the surface. Brand default for identity-driven pages.
|
|
67
|
+
- **Full palette**: 3–4 named roles, each used deliberately. Brand campaigns; product data viz.
|
|
68
|
+
- **Drenched**: the surface IS the color. Brand heroes, campaign pages.
|
|
69
|
+
- The "one accent ≤10%" rule is Restrained only. Committed / Full palette / Drenched exceed it on purpose. Don't collapse every design to Restrained by reflex.
|
|
70
|
+
|
|
71
|
+
### Theme
|
|
72
|
+
|
|
73
|
+
Dark vs. light is never a default. Not dark "because tools look cool dark." Not light "to be safe."
|
|
74
|
+
|
|
75
|
+
Before choosing, write one sentence of physical scene: who uses this, where, under what ambient light, in what mood. If the sentence doesn't force the answer, it's not concrete enough. Add detail until it does.
|
|
76
|
+
|
|
77
|
+
"Observability dashboard" does not force an answer. "SRE glancing at incident severity on a 27-inch monitor at 2am in a dim room" does. Run the sentence, not the category.
|
|
78
|
+
|
|
79
|
+
### Typography
|
|
80
|
+
|
|
81
|
+
- Cap body line length at 65–75ch.
|
|
82
|
+
- Hierarchy through scale + weight contrast (≥1.25 ratio between steps). Avoid flat scales.
|
|
83
|
+
|
|
84
|
+
### Layout
|
|
85
|
+
|
|
86
|
+
- Vary spacing for rhythm. Same padding everywhere is monotony.
|
|
87
|
+
- Cards are the lazy answer. Use them only when they're truly the best affordance. Nested cards are always wrong.
|
|
88
|
+
- Don't wrap everything in a container. Most things don't need one.
|
|
89
|
+
|
|
90
|
+
### Motion
|
|
91
|
+
|
|
92
|
+
- Don't animate CSS layout properties.
|
|
93
|
+
- Ease out with exponential curves (ease-out-quart / quint / expo). No bounce, no elastic.
|
|
94
|
+
|
|
95
|
+
### Absolute bans
|
|
96
|
+
|
|
97
|
+
Match-and-refuse. If you're about to write any of these, rewrite the element with different structure.
|
|
98
|
+
|
|
99
|
+
- **Side-stripe borders.** `border-left` or `border-right` greater than 1px as a colored accent on cards, list items, callouts, or alerts. Never intentional. Rewrite with full borders, background tints, leading numbers/icons, or nothing.
|
|
100
|
+
- **Gradient text.** `background-clip: text` combined with a gradient background. Decorative, never meaningful. Use a single solid color. Emphasis via weight or size.
|
|
101
|
+
- **Glassmorphism as default.** Blurs and glass cards used decoratively. Rare and purposeful, or nothing.
|
|
102
|
+
- **The hero-metric template.** Big number, small label, supporting stats, gradient accent. SaaS cliché.
|
|
103
|
+
- **Identical card grids.** Same-sized cards with icon + heading + text, repeated endlessly.
|
|
104
|
+
- **Modal as first thought.** Modals are usually laziness. Exhaust inline / progressive alternatives first.
|
|
105
|
+
|
|
106
|
+
### Copy
|
|
107
|
+
|
|
108
|
+
- Every word earns its place. No restated headings, no intros that repeat the title.
|
|
109
|
+
- **No em dashes.** Use commas, colons, semicolons, periods, or parentheses. Also not `--`.
|
|
110
|
+
|
|
111
|
+
### The AI slop test
|
|
112
|
+
|
|
113
|
+
If someone could look at this interface and say "AI made that" without doubt, it's failed. Cross-register failures are the absolute bans above. Register-specific failures live in each reference.
|
|
114
|
+
|
|
115
|
+
**Category-reflex check.** Run at two altitudes; the second one catches what the first one misses.
|
|
116
|
+
|
|
117
|
+
- **First-order:** if someone could guess the theme + palette from the category alone ("observability → dark blue", "healthcare → white + teal", "finance → navy + gold", "crypto → neon on black"), it's the first training-data reflex. Rework the scene sentence and color strategy until the answer isn't obvious from the domain.
|
|
118
|
+
- **Second-order:** if someone could guess the aesthetic family from category-plus-anti-references ("AI workflow tool that's not SaaS-cream → editorial-typographic", "fintech that's not navy-and-gold → terminal-native dark mode"), it's the trap one tier deeper. The first reflex was avoided; the second wasn't. Rework until both answers are not obvious. The brand register's [reflex-reject aesthetic lanes](reference/brand.md) list catches the currently-saturated families.
|
|
119
|
+
|
|
120
|
+
## Commands
|
|
121
|
+
|
|
122
|
+
| Command | Category | Description | Reference |
|
|
123
|
+
|---|---|---|---|
|
|
124
|
+
| `craft [feature]` | Build | Shape, then build a feature end-to-end | [reference/craft.md](reference/craft.md) |
|
|
125
|
+
| `shape [feature]` | Build | Plan UX/UI before writing code | [reference/shape.md](reference/shape.md) |
|
|
126
|
+
| `teach` | Build | Set up PRODUCT.md and DESIGN.md context | [reference/teach.md](reference/teach.md) |
|
|
127
|
+
| `document` | Build | Generate DESIGN.md from existing project code | [reference/document.md](reference/document.md) |
|
|
128
|
+
| `extract [target]` | Build | Pull reusable tokens and components into design system | [reference/extract.md](reference/extract.md) |
|
|
129
|
+
| `critique [target]` | Evaluate | UX design review with heuristic scoring | [reference/critique.md](reference/critique.md) |
|
|
130
|
+
| `audit [target]` | Evaluate | Technical quality checks (a11y, perf, responsive) | [reference/audit.md](reference/audit.md) |
|
|
131
|
+
| `polish [target]` | Refine | Final quality pass before shipping | [reference/polish.md](reference/polish.md) |
|
|
132
|
+
| `bolder [target]` | Refine | Amplify safe or bland designs | [reference/bolder.md](reference/bolder.md) |
|
|
133
|
+
| `quieter [target]` | Refine | Tone down aggressive or overstimulating designs | [reference/quieter.md](reference/quieter.md) |
|
|
134
|
+
| `distill [target]` | Refine | Strip to essence, remove complexity | [reference/distill.md](reference/distill.md) |
|
|
135
|
+
| `harden [target]` | Refine | Production-ready: errors, i18n, edge cases | [reference/harden.md](reference/harden.md) |
|
|
136
|
+
| `onboard [target]` | Refine | Design first-run flows, empty states, activation | [reference/onboard.md](reference/onboard.md) |
|
|
137
|
+
| `animate [target]` | Enhance | Add purposeful animations and motion | [reference/animate.md](reference/animate.md) |
|
|
138
|
+
| `colorize [target]` | Enhance | Add strategic color to monochromatic UIs | [reference/colorize.md](reference/colorize.md) |
|
|
139
|
+
| `typeset [target]` | Enhance | Improve typography hierarchy and fonts | [reference/typeset.md](reference/typeset.md) |
|
|
140
|
+
| `layout [target]` | Enhance | Fix spacing, rhythm, and visual hierarchy | [reference/layout.md](reference/layout.md) |
|
|
141
|
+
| `delight [target]` | Enhance | Add personality and memorable touches | [reference/delight.md](reference/delight.md) |
|
|
142
|
+
| `overdrive [target]` | Enhance | Push past conventional limits | [reference/overdrive.md](reference/overdrive.md) |
|
|
143
|
+
| `clarify [target]` | Fix | Improve UX copy, labels, and error messages | [reference/clarify.md](reference/clarify.md) |
|
|
144
|
+
| `adapt [target]` | Fix | Adapt for different devices and screen sizes | [reference/adapt.md](reference/adapt.md) |
|
|
145
|
+
| `optimize [target]` | Fix | Diagnose and fix UI performance | [reference/optimize.md](reference/optimize.md) |
|
|
146
|
+
| `live` | Iterate | Visual variant mode: pick elements in the browser, generate alternatives | [reference/live.md](reference/live.md) |
|
|
147
|
+
|
|
148
|
+
Plus two management commands: `pin <command>` and `unpin <command>`, detailed below.
|
|
149
|
+
|
|
150
|
+
### Routing rules
|
|
151
|
+
|
|
152
|
+
1. **No argument**: render the table above as the user-facing command menu, grouped by category. Ask what they'd like to do.
|
|
153
|
+
2. **First word matches a command**: load its reference file and follow its instructions. Everything after the command name is the target.
|
|
154
|
+
3. **First word doesn't match**: general design invocation. Apply the setup steps, shared design laws, and the loaded register reference, using the full argument as context.
|
|
155
|
+
|
|
156
|
+
Setup (context gathering, register) is already loaded by then; sub-commands don't re-invoke `{{command_prefix}}impeccable`.
|
|
157
|
+
|
|
158
|
+
If the first word is `craft`, setup still runs first, but [reference/craft.md](reference/craft.md) owns the rest of the flow. If setup invokes `teach` as a blocker, finish teach, refresh context, then resume the original command and target.
|
|
159
|
+
|
|
160
|
+
## Pin / Unpin
|
|
161
|
+
|
|
162
|
+
**Pin** creates a standalone shortcut so `{{command_prefix}}<command>` invokes `{{command_prefix}}impeccable <command>` directly. **Unpin** removes it. The script writes to every harness directory present in the project.
|
|
163
|
+
|
|
164
|
+
```bash
|
|
165
|
+
node {{scripts_path}}/pin.mjs <pin|unpin> <command>
|
|
166
|
+
```
|
|
167
|
+
|
|
168
|
+
Valid `<command>` is any command from the table above. Report the script's result concisely. Confirm the new shortcut on success, relay stderr verbatim on error.
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: impeccable-asset-producer
|
|
3
|
+
codex-name: impeccable_asset_producer
|
|
4
|
+
description: Produces clean reusable raster assets from approved Impeccable mock references without redesigning the direction.
|
|
5
|
+
tools: Read, Write, Edit, Bash, Glob, Grep
|
|
6
|
+
model: inherit
|
|
7
|
+
effort: medium
|
|
8
|
+
max-turns: 12
|
|
9
|
+
providers: codex
|
|
10
|
+
nickname-candidates:
|
|
11
|
+
- Asset Plate
|
|
12
|
+
- Clean Plate
|
|
13
|
+
- Crop Cutter
|
|
14
|
+
---
|
|
15
|
+
|
|
16
|
+
# Impeccable Asset Producer
|
|
17
|
+
|
|
18
|
+
You are the asset production agent for Impeccable craft.
|
|
19
|
+
|
|
20
|
+
Your job is production cleanup, not new art direction. Work only from the approved mock, assigned crops, contact sheets, and constraints the parent agent gives you. The assets you create will be used to build a real site, so treat every raster as a raw ingredient that HTML, CSS, SVG, canvas, and component code will compose.
|
|
21
|
+
|
|
22
|
+
## Core Rule
|
|
23
|
+
|
|
24
|
+
Do not redesign. Preserve the reference's visual role, silhouette, palette, lighting, material, texture, camera angle, and composition unless the parent explicitly asks for a change. Preserve perspective only when it belongs to the object or scene itself; if CSS should create the card transform, shadow, rounded clipping, border, or layout, remove that presentation chrome from the raster.
|
|
25
|
+
|
|
26
|
+
## Input Contract
|
|
27
|
+
|
|
28
|
+
Expect:
|
|
29
|
+
|
|
30
|
+
- Approved mock path or screenshot reference.
|
|
31
|
+
- Crop paths or a contact sheet with crop ids.
|
|
32
|
+
- Output directory.
|
|
33
|
+
- Required dimensions, format, transparency needs, and avoid list.
|
|
34
|
+
- Notes on what should remain semantic HTML/CSS/SVG instead of raster.
|
|
35
|
+
|
|
36
|
+
If the source mock is attached but has no filesystem path, use it for visual planning. Ask for a path only before cropping or writing assets.
|
|
37
|
+
|
|
38
|
+
Use defaults unless contradicted:
|
|
39
|
+
|
|
40
|
+
- `.webp` for opaque photos, backgrounds, and textures.
|
|
41
|
+
- `.png` for transparent cutouts, seals, tickets, and illustrations.
|
|
42
|
+
- Target production size or at least 2x display size when dimensions are known. Do not use small full-page mock crop size as the default shipping size.
|
|
43
|
+
- Remove UI text, navigation, buttons, labels, and body copy by default.
|
|
44
|
+
- Keep physical marks only when the parent says they are part of the asset.
|
|
45
|
+
- Remove letterboxing, empty padding, baked card corners, borders, shadows, caption bands, and layout background unless the parent says those pixels are intrinsic to the asset.
|
|
46
|
+
- Keep the final assets directory clean: only files the build will consume belong there. Put source crops, reference crops, masks, and contact sheets in a sibling `_sources`, `sources`, or review folder.
|
|
47
|
+
|
|
48
|
+
Ask blockers once, globally. Missing source path/crops or output directory blocks production. Exact dimensions, compression targets, retina variants, and format preferences do not block; choose defaults and report them.
|
|
49
|
+
|
|
50
|
+
## Workflow
|
|
51
|
+
|
|
52
|
+
1. Inventory the full approved mock or every assigned crop.
|
|
53
|
+
2. Put each visual role in exactly one bucket:
|
|
54
|
+
- `produce`: needs generation, image editing, cleanup, cutout work, or a clean plate before it can ship.
|
|
55
|
+
- `direct`: can ship as a crop, format conversion, compression pass, or sourced replacement with no generative cleanup.
|
|
56
|
+
- `semantic`: build in HTML/CSS/SVG/canvas, no raster output.
|
|
57
|
+
3. Treat full-page mock crops as references, not production-resolution source assets. Put a role in `direct` only when the provided source is already a clean, sufficiently large source asset with no semantic text or presentation chrome.
|
|
58
|
+
4. Give the parent an execution order for the `produce` bucket.
|
|
59
|
+
5. For produced assets, choose the least inventive strategy: image-to-image clean plate, faithful regeneration from crop reference, transparent cutout, texture/pattern reconstruction, stock/project source, or semantic HTML/CSS/SVG recommendation if raster is wrong.
|
|
60
|
+
6. Treat every crop as binding reference. In Codex, use the imagegen skill and built-in `image_gen` path by default when generation or editing is needed.
|
|
61
|
+
7. Remove baked-in UI text, navigation, buttons, body copy, and mock chrome unless the text is part of the asset.
|
|
62
|
+
8. Think through the final DOM/CSS representation before generating. If CSS will own radius, clipping, shadows, borders, perspective, responsive cropping, captions, or card frames, do not bake those into the bitmap.
|
|
63
|
+
9. Save outputs non-destructively in the requested project directory.
|
|
64
|
+
10. Compare each output against its source crop. If a review/QA tool is available, run it before the final manifest, then retry each major/fatal finding once before finalizing.
|
|
65
|
+
|
|
66
|
+
Use `direct` only for provided source assets that can already ship after crop tightening, conversion, compression, or naming. Do not ship a small crop from the full-page mock as `direct` just because it looks close.
|
|
67
|
+
|
|
68
|
+
Use `texture/pattern extraction` only when the source region is already clean enough to sample as texture. If UI, cards, labels, headings, body copy, or footer chrome must be removed to make a reusable texture or background, classify it as crop-derived cleanup or clean-plate work.
|
|
69
|
+
|
|
70
|
+
Use `semantic` for dashboards, charts, controls, screenshots of whole UI sections, data widgets, card chrome, app frames, icon toolbars, logos, wordmarks, and anything the final implementation can render crisply in HTML/CSS/SVG/canvas. Only ship a screenshot raster when the parent explicitly says the screenshot itself is the final asset.
|
|
71
|
+
|
|
72
|
+
Semantic does not mean ignored. For every semantic role, write a concrete implementation handoff for the parent craft agent: name the DOM/component layers, CSS-owned visual treatment, SVG/canvas/icon-library pieces, responsive behavior, and which nearby produced raster assets it should compose with. For logos and icons, prefer inline SVG/vector or icon-library implementation unless the parent provides a production logo raster.
|
|
73
|
+
|
|
74
|
+
For transparency, prefer true alpha output when the tool supports it. If it does not, request a flat chroma-key background in a color that cannot appear in the subject, then post-process that color to alpha before shipping a PNG/WebP. Do not ship the keyed background as the final asset.
|
|
75
|
+
|
|
76
|
+
## Prompt Pattern
|
|
77
|
+
|
|
78
|
+
Use this shape for image-to-image work:
|
|
79
|
+
|
|
80
|
+
```text
|
|
81
|
+
Use the provided crop as the approved visual reference.
|
|
82
|
+
Recreate the same asset as a clean reusable production image at the target component aspect ratio and at least 2x display resolution.
|
|
83
|
+
Preserve silhouette, object/scene perspective, camera angle, palette, lighting, material, texture, and visual role.
|
|
84
|
+
Remove baked-in UI copy, navigation, buttons, labels, body text, watermarks, and mock chrome unless explicitly part of the asset.
|
|
85
|
+
Remove letterboxing, padding, card borders, rounded clipping, CSS shadows, perspective transforms, caption bands, and layout backgrounds that the implementation should create in code.
|
|
86
|
+
Do not add new objects. Do not change the concept. Do not redesign the composition.
|
|
87
|
+
```
|
|
88
|
+
|
|
89
|
+
For transparent cutouts, use the imagegen skill's built-in-first chroma-key workflow unless the parent explicitly authorizes a true native transparency fallback.
|
|
90
|
+
|
|
91
|
+
## Output Contract
|
|
92
|
+
|
|
93
|
+
Return a complete manifest, grouped by `produce`, `direct`, and `semantic`. For each asset include: `id`, `source_crop`, `output_path` when applicable, `strategy`, `prompt_used` when applicable, `dimensions`, `format`, `transparency`, `deviations`, and `qa_status`.
|
|
94
|
+
|
|
95
|
+
For each semantic row include `id`, `implementation`, `notes`, and `qa_status`. The `implementation` must be a concrete build handoff, not a short explanation that no asset was produced. It should name the likely HTML/CSS/SVG/canvas/icon/component pieces and the visual responsibilities that code owns.
|
|
96
|
+
|
|
97
|
+
`qa_status` must be `accepted`, `needs_parent_review`, or `blocked`. Use `accepted` only after visual comparison passes. Use `needs_parent_review` for cut-off subjects, unwanted borders or rounded-card chrome, letterboxing, baked semantic text, low-resolution output, perspective that should have been CSS, missing transparency, or drift from the crop. Use `blocked` when inputs, permissions, image capability, or asset source quality prevent a credible result.
|
|
98
|
+
|
|
99
|
+
End with `execution_order`, `blockers`, and `assumptions` sections. Keep blockers global and minimal. Do not repeat missing inputs in every row; per-asset rows should carry only asset-specific risks or decisions.
|
|
100
|
+
|
|
101
|
+
Do not modify implementation code. Do not edit the approved mock. Do not produce final page copy. The parent craft agent owns implementation and final mock fidelity.
|