@event4u/agent-config 14.18.0 → 14.19.0

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.
Files changed (146) hide show
  1. package/.augment-plugin/marketplace.json +3 -3
  2. package/.augment-plugin/plugin.json +1 -1
  3. package/.claude-plugin/marketplace.json +1 -1
  4. package/CHANGELOG.md +169 -130
  5. package/README.md +71 -149
  6. package/dist/agent-src/README.md +1 -1
  7. package/dist/agent-src/commands/agent-handoff.md +2 -2
  8. package/dist/agent-src/commands/review/changes.md +19 -19
  9. package/dist/agent-src/commands/review.md +2 -2
  10. package/dist/agent-src/contexts/execution/host-capability-manifest.md +30 -3
  11. package/dist/agent-src/rules/autonomous-execution.md +1 -1
  12. package/dist/agent-src/rules/git-history-discipline.md +2 -2
  13. package/dist/agent-src/rules/guidelines.md +1 -1
  14. package/dist/agent-src/rules/session-canary.md +2 -2
  15. package/dist/agent-src/rules/token-efficiency.md +1 -1
  16. package/dist/agent-src/skills/adversarial-review/SKILL.md +0 -8
  17. package/dist/agent-src/skills/canvas-design/SKILL.md +1 -1
  18. package/dist/agent-src/skills/design-intelligence/SKILL.md +1 -1
  19. package/dist/agent-src/skills/design-intelligence/data/app-interface.csv +1 -1
  20. package/dist/agent-src/skills/design-intelligence/data/motion.csv +17 -17
  21. package/dist/agent-src/skills/design-intelligence/data/ux-guidelines.csv +2 -2
  22. package/dist/agent-src/skills/design-intelligence/references/context-and-registers.md +17 -0
  23. package/dist/agent-src/skills/design-intelligence/references/design-rules-checklist.md +4 -4
  24. package/dist/agent-src/skills/design-review/SKILL.md +1 -1
  25. package/dist/agent-src/skills/design-variations/SKILL.md +1 -1
  26. package/dist/agent-src/skills/existing-ui-audit/SKILL.md +1 -1
  27. package/dist/agent-src/skills/fe-design/SKILL.md +32 -5
  28. package/dist/agent-src/skills/fe-design/references/craft-floor.md +7 -0
  29. package/dist/agent-src/skills/fe-design/references/design-patterns.md +47 -2
  30. package/dist/agent-src/skills/laravel-scheduling/SKILL.md +3 -1
  31. package/dist/agent-src/skills/project-analyzer/SKILL.md +0 -6
  32. package/dist/agent-src/skills/react-native-setup/SKILL.md +3 -3
  33. package/dist/agent-src/skills/react-shadcn-ui/SKILL.md +1 -1
  34. package/dist/agent-src/skills/sequential-thinking/SKILL.md +18 -8
  35. package/dist/agent-src/skills/tailwind-engineer/SKILL.md +1 -1
  36. package/dist/agent-src/skills/ui-apply-generic/SKILL.md +1 -1
  37. package/dist/agent-src/skills/ui-component-architect/SKILL.md +1 -1
  38. package/dist/agent-src/skills/using-git-worktrees/SKILL.md +17 -2
  39. package/dist/agent-src/templates/agents/agent-project-settings.example.yml +1 -1
  40. package/dist/cli/commands/recordTriggerEval.js +2 -2
  41. package/dist/cli/main.js +1 -1
  42. package/dist/cli-delegate/{chunk-AKJGUQNO.js → chunk-GZTMRYCN.js} +405 -341
  43. package/dist/cli-delegate/{chunk-7RXIKF62.js → chunk-IDHUQIXP.js} +283 -132
  44. package/dist/cli-delegate/cmd_adr_effective.js +318 -81
  45. package/dist/cli-delegate/cmd_conformance.js +420 -16
  46. package/dist/cli-delegate/cmd_doctor.js +1 -1
  47. package/dist/cli-delegate/cmd_export.js +1 -1
  48. package/dist/cli-delegate/cmd_handoff.js +1 -1
  49. package/dist/cli-delegate/cmd_prune.js +1 -1
  50. package/dist/cli-delegate/cmd_route_audit.js +1 -1
  51. package/dist/cli-delegate/cmd_settings_migrate.js +1 -1
  52. package/dist/cli-delegate/cmd_sync.js +1 -1
  53. package/dist/cli-delegate/cmd_uninstall.js +1 -1
  54. package/dist/cli-delegate/cmd_validate.js +1 -1
  55. package/dist/discovery/deprecation-report.md +1 -1
  56. package/dist/discovery/discovery-manifest.json +28 -27
  57. package/dist/discovery/discovery-manifest.json.sha256 +1 -1
  58. package/dist/discovery/discovery-manifest.summary.md +1 -1
  59. package/dist/discovery/dormancy-report.md +1 -1
  60. package/dist/discovery/orphan-report.md +1 -1
  61. package/dist/discovery/packs.json +2 -2
  62. package/dist/discovery/trust-report.md +1 -1
  63. package/dist/discovery/workspaces.json +2 -2
  64. package/dist/hooks/dispatch.js +2132 -1462
  65. package/dist/install/install.mjs +588 -527
  66. package/dist/mcp/registry-manifest.json +1 -1
  67. package/dist/mcp/server.json +2 -2
  68. package/dist/mcp/server.mjs +1619 -1045
  69. package/dist/scripts/_lib/model_tier.js +1 -1
  70. package/docs/guidelines/agent-infra/evaluator-independence-mechanics.md +1 -1
  71. package/docs/guidelines/agent-infra/roadmap-progress-mechanics.md +1 -1
  72. package/docs/guidelines/design-antipatterns.md +87 -64
  73. package/package.json +1 -1
  74. package/src/agent-src/README.md +1 -1
  75. package/src/config/ci-local-parity.yml +6 -0
  76. package/src/config/gate-coverage.yml +170 -0
  77. package/src/config/gate-violation-baselines.json +3 -3
  78. package/src/config/release-gate-locality.yml +12 -0
  79. package/src/scripts/_cli/cmd_doctor.ts +2 -2
  80. package/src/scripts/_cli/cmd_handoff.ts +1 -1
  81. package/src/scripts/_cli/cmd_update.ts +1 -1
  82. package/src/scripts/_cli/cmd_versions.ts +1 -1
  83. package/src/scripts/_lib/adr_frontmatter.ts +44 -0
  84. package/src/scripts/_lib/consequence_objects.ts +152 -0
  85. package/src/scripts/_lib/exec_evidence.ts +7 -0
  86. package/src/scripts/_lib/global_deploy_inventory.ts +2 -2
  87. package/src/scripts/_lib/host_permission_checks.ts +251 -0
  88. package/src/scripts/_lib/model_tier.ts +1 -1
  89. package/src/scripts/_lib/obligation_frequency.ts +2 -2
  90. package/src/scripts/_lib/release_highlights.ts +93 -0
  91. package/src/scripts/_lib/release_material.ts +64 -1
  92. package/src/scripts/_lib/runtime_journal.ts +26 -3
  93. package/src/scripts/_lib/runtime_wiring_checks.ts +12 -1
  94. package/src/scripts/_lib/session_register.ts +11 -6
  95. package/src/scripts/_lib/sqlite_schema.ts +22 -0
  96. package/src/scripts/_lib/surface.ts +86 -0
  97. package/src/scripts/_lib/ui_authority.ts +116 -0
  98. package/src/scripts/adr/regenerate_index.ts +54 -1
  99. package/src/scripts/adr_cite_check.ts +71 -15
  100. package/src/scripts/ai_council/clients.ts +1 -1
  101. package/src/scripts/autonomy_friction_corpus.ts +229 -0
  102. package/src/scripts/build_proof.ts +15 -2
  103. package/src/scripts/check_beta_review_markers.ts +141 -17
  104. package/src/scripts/check_enforcement_coverage.ts +1 -1
  105. package/src/scripts/check_enforcement_denominator.ts +121 -11
  106. package/src/scripts/check_finding_dispositions.ts +66 -9
  107. package/src/scripts/check_gate_coverage.ts +96 -0
  108. package/src/scripts/check_release_highlights.ts +74 -1
  109. package/src/scripts/check_skill_activation_claim.ts +179 -0
  110. package/src/scripts/check_trigger_evals.ts +1 -1
  111. package/src/scripts/conformance_scan.ts +44 -3
  112. package/src/scripts/explain_run.ts +1 -1
  113. package/src/scripts/generate_capability_matrix.ts +1 -1
  114. package/src/scripts/git_authorization_hook.ts +75 -1
  115. package/src/scripts/hook_manifest.json +1 -1
  116. package/src/scripts/hook_manifest.yaml +14 -11
  117. package/src/scripts/hooks/augment-dispatcher.sh +1 -1
  118. package/src/scripts/hooks/category_a.ts +291 -0
  119. package/src/scripts/hooks/cline-dispatcher.sh +1 -1
  120. package/src/scripts/hooks/cursor-dispatcher.sh +11 -5
  121. package/src/scripts/hooks/dispatch_hook.ts +17 -22
  122. package/src/scripts/hooks/git_command_classifier.ts +156 -1
  123. package/src/scripts/hooks/host_lowering.ts +215 -0
  124. package/src/scripts/hooks/host_lowering.yaml +185 -0
  125. package/src/scripts/hooks/host_semantics.ts +105 -37
  126. package/src/scripts/hooks/journal_record_hook.ts +10 -0
  127. package/src/scripts/hooks/permission_gate.ts +117 -0
  128. package/src/scripts/hooks_status.ts +12 -10
  129. package/src/scripts/install.ts +53 -82
  130. package/src/scripts/install_anthropic_key.sh +2 -2
  131. package/src/scripts/lint_design_antipattern_parity.ts +80 -0
  132. package/src/scripts/lint_evidence_artifacts.ts +45 -1
  133. package/src/scripts/lint_hook_manifest.ts +87 -3
  134. package/src/scripts/lint_motion_authority_drift.ts +731 -0
  135. package/src/scripts/lint_readme_size.ts +158 -12
  136. package/src/scripts/lint_reasoning_fixtures.ts +216 -0
  137. package/src/scripts/lint_skill_trigger_contradiction.ts +161 -0
  138. package/src/scripts/measure_sibling_naming.ts +150 -0
  139. package/src/scripts/redact_hook_capture.ts +1 -1
  140. package/src/scripts/report_skill_activation.ts +319 -7
  141. package/src/scripts/schemas/review-findings.schema.json +5 -0
  142. package/src/scripts/schemas/skill.schema.json +2 -2
  143. package/src/scripts/session_canary_hook.ts +1 -1
  144. package/src/scripts/session_register_hook.ts +4 -3
  145. package/src/scripts/trigger_eval_grandfather.json +5 -1
  146. package/src/scripts/validate_agent_settings.ts +1 -1
@@ -142,14 +142,6 @@ logic, ≥ 3 explicit must/must-not constraints, stateful operations,
142
142
  irreversibility} **and** estimated work ≥ ~1k tokens. Token length alone never
143
143
  triggers it. See [`rdp-gate`](../../contexts/execution/rdp-gate.md) (L12).
144
144
 
145
- ## Auto-trigger keywords
146
-
147
- - adversarial review
148
- - self-review
149
- - challenge plan
150
- - review my approach
151
- - sanity check
152
-
153
145
  ### Validate
154
146
 
155
147
  - Confirm each identified risk has a concrete mitigation or explicit acceptance.
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: inherit
3
3
  name: canvas-design
4
- description: "Use when creating static visual art — posters, marketing visuals, brand assets, PDF/PNG design pieces — even if the user just says 'design a poster' or 'mach uns ein Visual'."
4
+ description: "Creating static visual art — posters, marketing visuals, brand assets, PDF/PNG design pieces — on 'design a poster' or 'mach uns ein Visual'. Grounded by design-intelligence."
5
5
  domain: product
6
6
  workspaces:
7
7
  - small-business
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: inherit
3
3
  name: design-intelligence
4
- description: "Grounded design brief from the adopted corpus — style, WCAG-checked color tokens, typography, layout pattern, anti-patterns. Use on ui-design-brief or any which-style/palette/font/chart decision."
4
+ description: "Grounded design brief from the corpus — style, WCAG color tokens, typography, layout, anti-patterns. Use on ui-design-brief or any which-style/palette/font/chart call; feeds fe-design."
5
5
  domain: engineering
6
6
  personas:
7
7
  - frontend-engineer
@@ -21,7 +21,7 @@ No,Category,Issue,Keywords,Platform,Description,Do,Don't,Code Example Good,Code
21
21
  20,Performance,Virtualize Long Lists,FlatList SectionList virtualization,iOS/Android/React Native,Use FlatList/SectionList for lists over ~50 items,Use keyExtractor and initialNumToRender appropriately,Render hundreds of items with ScrollView,"<FlatList data={items} renderItem={...} />","<ScrollView>{items.map(renderItem)}</ScrollView>",High
22
22
  21,Performance,Image Size & Cache,Image resize cache,iOS/Android/React Native,Use correctly sized and cached images,Use Image component with proper resizeMode and caching,Load full-resolution images everywhere,"<Image source={{uri}} resizeMode=""cover"" />","<Image source={require('4k.png')} /> // small avatar",Medium
23
23
  22,Performance,Debounce High-Freq Events,debounce scroll search,iOS/Android/React Native,Debounce scroll/search callbacks to avoid jank,Wrap handlers with debounce/throttle,Run heavy logic on every event,"onScroll={debouncedHandleScroll}","onScroll={handleScrollHeavy}",Medium
24
- 23,Animation,Duration & Easing,animation duration easing,iOS/Android/React Native,Micro-interactions should be 150–300ms with native-like easing,Use ease-out for enter/ease-in for exit,Use long or linear animations for core UI,"Animated.timing(..., { duration: 200, easing: Easing.out(Easing.quad) })","Animated.timing(..., { duration: 800, easing: Easing.linear })",Medium
24
+ 23,Animation,Duration & Easing,animation duration easing,iOS/Android/React Native,"Micro-interactions follow the per-interaction bands in design-patterns.md § Motion, with native-like easing",Use ease-out for both enter and exit,Use long or linear animations for core UI,"Animated.timing(..., { duration: 200, easing: Easing.out(Easing.quad) })","Animated.timing(..., { duration: 800, easing: Easing.linear })",Medium
25
25
  24,Animation,Respect Reduced Motion,reduced motion accessibility,iOS/Android/React Native,Respect OS reduced-motion accessibility setting,Check reduceMotionEnabled and simplify animations,Ignore user motion preferences,"if (reduceMotionEnabled) skipAnimation()","Always run complex parallax animations",Critical
26
26
  25,Animation,Limited Continuous Motion,loop animation loader,iOS/Android/React Native,Reserve infinite animations for loaders and live data,Use looping only where necessary,Keep decorative elements looping forever,"Animated.loop(loaderAnim) for ActivityIndicator","Animated.loop(bounceAnim) on background icons",Medium
27
27
  26,Typography,Base Font Size,fontScale dynamic type,iOS/Android/React Native,Body text must be readable and support Dynamic Type,Use platform fontScale and at least 14–16pt base,Render critical text below 12pt,"<Text style={{ fontSize: 16 }}>Body</Text>","<Text style={{ fontSize: 10 }}>Body</Text>",High
@@ -1,17 +1,17 @@
1
- No,Category,Intensity Tier,Keywords,Trigger,Duration,Easing,GSAP Snippet,Framework Notes,Do,Don't,Performance Notes
2
- 1,Hover Micro-interaction,Subtle,"hover, button, opacity, lift, press feedback",hover,150-200ms,power1.out,"gsap.to(el, { y: -1, opacity: 0.9, duration: 0.15, ease: 'power1.out' });",Bind on mouseenter/mouseleave; in React wrap in a ref + useEffect (or onMouseEnter/onMouseLeave props directly calling gsap.to),Keep displacement under 2px so it reads as feedback not motion,Don't animate layout-affecting props (width/height/margin) on hover,Runs on transform/opacity only so it stays on the compositor thread
3
- 2,Hover Micro-interaction,Standard,"hover, card, scale, tilt, cursor feedback",hover,200-300ms,power2.out,"gsap.to(el, { y: -4, scale: 1.02, boxShadow: '0 12px 24px rgba(0,0,0,0.12)', duration: 0.25, ease: 'power2.out' });","Use gsap.quickTo(el, 'y') for cards with many hover targets to avoid re-creating tweens every event",Pair with a matching mouseleave tween that reverses the same properties,Don't leave the hover state stuck if the pointer leaves fast; always attach the reverse tween,quickTo() avoids GC churn on lists with 20+ hoverable cards
4
- 3,Hover Micro-interaction,Complex,"hover, magnetic, cursor follow, 3d tilt",hover + mousemove,300-500ms,"elastic.out(1,0.4)","const xTo = gsap.quickTo(el, 'x', { duration: 0.4, ease: 'elastic.out(1,0.4)' }); const yTo = gsap.quickTo(el, 'y', { duration: 0.4, ease: 'elastic.out(1,0.4)' }); el.addEventListener('mousemove', (e) => { const r = el.getBoundingClientRect(); xTo((e.clientX - r.left - r.width/2) * 0.3); yTo((e.clientY - r.top - r.height/2) * 0.3); });",Debounce is not needed since quickTo interpolates; remove listeners on component unmount in React/Vue to avoid leaks,Clamp the pull strength (e.g. * 0.3) so the element never fully leaves its hit box,Don't apply magnetic effect to more than 1-2 focal elements per screen; it becomes noisy,Use will-change: transform on the target element for smoother compositing
5
- 4,Scroll Reveal,Subtle,"scroll, fade in, reveal, on view",scroll (viewport enter),300-400ms,power1.out,"gsap.from(el, { opacity: 0, y: 12, duration: 0.35, ease: 'power1.out', scrollTrigger: { trigger: el, start: 'top 90%', toggleActions: 'play none none reverse' } });",Requires the ScrollTrigger plugin registered once via gsap.registerPlugin(ScrollTrigger),"Keep the y offset small (8-16px) so it reads as a fade, not a slide",Don't reveal below-the-fold content needed for SEO/crawlers as invisible-by-default without a no-JS fallback,toggleActions 'play none none reverse' avoids re-triggering on every scroll direction change
6
- 5,Scroll Reveal,Standard,"scroll, slide up, staggered section, reveal",scroll (viewport enter),400-600ms,power2.out,"gsap.from(el.children, { opacity: 0, y: 24, duration: 0.5, stagger: 0.08, ease: 'power2.out', scrollTrigger: { trigger: el, start: 'top 85%' } });","In React use useGSAP(() => {...}, { scope: containerRef }) from @gsap/react to auto-cleanup on unmount",Scope the ScrollTrigger to the section container so it doesn't re-scan the whole page,Don't stagger more than ~8 children; beyond that the last items feel laggy,Set scroller/markers: false in production; markers is dev-only
7
- 6,Scroll Reveal,Complex,"scroll, pin, scrub, storytelling, scrollytelling",scroll (continuous scrub),tied to scroll position,none (scrub-driven),"gsap.timeline({ scrollTrigger: { trigger: section, start: 'top top', end: '+=150%', scrub: 1, pin: true } }).from('.headline', { opacity: 0, y: 40 }).to('.bg-layer', { yPercent: -20 }, '<');",Pinning needs the section to have deterministic height; recalc ScrollTrigger.refresh() after images/fonts load,Use scrub: true or a small number (0.5-1.5) instead of instant jumps so it feels tied to the scrollbar,Don't pin more than 1-2 sections per page; excessive pinning fights native scroll feel and hurts mobile UX,"Pinning forces layout reflow; test on mid-tier mobile devices, not just desktop"
8
- 7,Stagger List,Subtle,"list, stagger, cards, grid entrance",load or scroll,250-350ms,power1.out,"gsap.from('.list-item', { opacity: 0, y: 8, duration: 0.3, stagger: 0.03 });",Select items with a stable class/data-attribute (not array index) so re-renders in React don't break targeting,Keep per-item stagger delay small (0.02-0.04s) for lists longer than 10 items,Don't stagger by more than 0.1s per item on long lists; total reveal time becomes sluggish,"For virtualized lists, only animate items currently mounted in the DOM"
9
- 8,Stagger List,Standard,"grid, bento, cards, staggered scale",load or scroll,300-450ms,back.out(1.4),"gsap.from('.grid-item', { opacity: 0, scale: 0.92, y: 16, duration: 0.4, stagger: { each: 0.06, from: 'start', grid: 'auto' }, ease: 'back.out(1.4)' });",grid: 'auto' lets GSAP infer rows/columns from a CSS grid layout for a natural wave stagger,Combine with from: 'center' for a bento-grid layout to draw the eye inward first,Don't use back.out on dense data tables; the overshoot reads as sloppy on informational UI,Group DOM writes; avoid interleaving layout reads (getBoundingClientRect) between staggered tweens
10
- 9,Stagger List,Complex,"stagger, wave, text reveal, split text",load or scroll,400-700ms,expo.out,"const split = new SplitText(headline, { type: 'chars' }); gsap.from(split.chars, { opacity: 0, y: 20, rotateX: -40, duration: 0.6, stagger: 0.015, ease: 'expo.out' });",SplitText is a GSAP Club/paid plugin; confirm license before shipping and provide a plain fade fallback if unavailable,Revert SplitText on unmount/cleanup (split.revert()) to restore original text nodes for accessibility tools,Don't split-animate long paragraphs; reserve for short headlines (under ~8 words),Splitting text creates one element per character; keep it to headline-length copy only for DOM size
11
- 10,Page Transition,Subtle,"route change, fade, page transition",route change,200-300ms,power1.inOut,"gsap.to(main, { opacity: 0, duration: 0.2, onComplete: () => { navigate(); gsap.fromTo(main, { opacity: 0 }, { opacity: 1, duration: 0.2 }); } });","Pair with the router's transition hooks (Next.js App Router transitions, React Router's useNavigate, Vue Router's beforeEach/afterEach)",Preload the destination route's critical assets before the exit tween finishes,Don't block navigation on animation; cap exit duration at ~250ms so the app never feels unresponsive,Exit animation should always resolve faster than entrance (asymmetric timing) so back/forward feels snappy
12
- 11,Page Transition,Standard,"route change, slide, overlay wipe",route change,400-600ms,power2.inOut,"const tl = gsap.timeline(); tl.to('.transition-overlay', { yPercent: 0, duration: 0.4, ease: 'power2.inOut' }).call(navigate).to('.transition-overlay', { yPercent: -100, duration: 0.4, ease: 'power2.inOut', delay: 0.1 });",Keep the overlay element mounted at the layout root (outside the page component) so it survives the route swap,Show a lightweight loading indicator if the destination route's data fetch outlasts the overlay,Don't tie the overlay's reveal directly to data-fetch completion without a max-wait timeout; a slow API stalls the whole transition,Prefer CSS transform (yPercent) over top/left to keep the overlay animation on the compositor thread
13
- 12,Page Transition,Complex,"shared element, morph, hero transition",route change,500-800ms,expo.inOut,"const state = Flip.getState('.hero-image'); navigate(); Flip.from(state, { duration: 0.6, ease: 'expo.inOut', absolute: true, zIndex: 100 });",Requires the GSAP Flip plugin; the 'from' and 'to' route must render the same element with a shared data-flip-id,Verify the shared element exists in both DOM states before calling Flip.from to avoid a silent no-op,Don't use shared-element transitions across more than one element pair per navigation; compounding Flips are hard to time correctly,Flip recalculates layout (FLIP technique) so test on low-end devices for jank
14
- 13,Parallax Scroll,Subtle,"parallax, background, depth, scroll speed",scroll (continuous),tied to scroll position,linear (scrub),"gsap.to('.bg-layer', { yPercent: 10, ease: 'none', scrollTrigger: { trigger: section, scrub: true } });","Apply parallax to background/decorative layers only, never to text or interactive controls",Keep the yPercent delta small (5-15) so foreground and background never desync distractingly,Don't parallax body copy; it hurts reading comfort and can trigger motion sickness,will-change: transform on the parallax layer only; remove it after scroll settles to free GPU memory
15
- 14,Parallax Scroll,Standard,"multi-layer parallax, depth, hero background",scroll (continuous),tied to scroll position,linear (scrub),"gsap.utils.toArray('.parallax-layer').forEach((layer, i) => { gsap.to(layer, { yPercent: (i + 1) * -8, ease: 'none', scrollTrigger: { trigger: layer.parentElement, scrub: 0.5 } }); });",Layer count beyond 3-4 has diminishing visual return and multiplies scroll-listener cost,"Vary speed per layer (background slowest, foreground fastest) to sell the depth illusion",Don't let parallax layers overflow their container; clip with overflow: hidden on the wrapper,Batch all layers under one ScrollTrigger container where possible instead of one per layer
16
- 15,Loading / Skeleton,Subtle,"loading, skeleton, shimmer, pulse",on mount / async wait,1200-1600ms loop,sine.inOut,"gsap.to('.skeleton', { backgroundPosition: '200% 0', duration: 1.4, ease: 'sine.inOut', repeat: -1 });",Kill the loop tween (tween.kill()) as soon as real content mounts to avoid orphaned repeating animations,Use a CSS gradient background-position sweep rather than opacity pulsing; reads as 'loading' more clearly,Don't run more than one shimmer loop per skeleton group; sync them under one timeline so the wave reads as a single unit,repeat: -1 tweens are cheap but must be explicitly killed on unmount or they leak in SPA route changes
17
- 16,Loading / Skeleton,Standard,"progress, spinner, morphing loader",on mount / async wait,800-1200ms loop,power1.inOut,"gsap.timeline({ repeat: -1 }).to('.loader-dot', { y: -8, duration: 0.4, stagger: { each: 0.15, yoyo: true, repeat: 1 } });",Wrap the whole loop timeline in useGSAP with { revertOnUpdate: false } in React so it isn't rebuilt every render,Cap total loop duration under ~1.5s so long waits don't feel like the UI froze on a single beat,Don't use elaborate loaders for sub-300ms waits; they flash and feel worse than no indicator,Pause the timeline (tl.pause()) when the loading tab/view is not visible to save CPU on background tabs
1
+ No,Category,Intensity Tier,Keywords,Trigger,Duration,Easing,GSAP Snippet,Framework Notes,Do,Don't,Performance Notes,Override Condition
2
+ 1,Hover Micro-interaction,Subtle,"hover, button, opacity, lift, press feedback",hover,100-160ms,power1.out,"gsap.to(el, { y: -1, opacity: 0.9, duration: 0.15, ease: 'power1.out' });",Bind on mouseenter/mouseleave; in React wrap in a ref + useEffect (or onMouseEnter/onMouseLeave props directly calling gsap.to),Keep displacement under 2px so it reads as feedback not motion,Don't animate layout-affecting props (width/height/margin) on hover,Runs on transform/opacity only so it stays on the compositor thread,
3
+ 2,Hover Micro-interaction,Standard,"hover, card, scale, tilt, cursor feedback",hover,200-300ms,power2.out,"gsap.to(el, { y: -4, scale: 1.02, boxShadow: '0 12px 24px rgba(0,0,0,0.12)', duration: 0.25, ease: 'power2.out' });","Use gsap.quickTo(el, 'y') for cards with many hover targets to avoid re-creating tweens every event",Pair with a matching mouseleave tween that reverses the same properties,Don't leave the hover state stuck if the pointer leaves fast; always attach the reverse tween,quickTo() avoids GC churn on lists with 20+ hoverable cards,
4
+ 3,Hover Micro-interaction,Complex,"hover, magnetic, cursor follow, 3d tilt",hover + mousemove,300-500ms,"elastic.out(1,0.4)","const xTo = gsap.quickTo(el, 'x', { duration: 0.4, ease: 'elastic.out(1,0.4)' }); const yTo = gsap.quickTo(el, 'y', { duration: 0.4, ease: 'elastic.out(1,0.4)' }); el.addEventListener('mousemove', (e) => { const r = el.getBoundingClientRect(); xTo((e.clientX - r.left - r.width/2) * 0.3); yTo((e.clientY - r.top - r.height/2) * 0.3); });",Debounce is not needed since quickTo interpolates; remove listeners on component unmount in React/Vue to avoid leaks,Clamp the pull strength (e.g. * 0.3) so the element never fully leaves its hit box,Don't apply magnetic effect to more than 1-2 focal elements per screen; it becomes noisy,Use will-change: transform on the target element for smoother compositing,"M1 override — declared playful register: the magnetic pull is the affordance itself, not decoration on a state change"
5
+ 4,Scroll Reveal,Subtle,"scroll, fade in, reveal, on view",scroll (viewport enter),300-400ms,power1.out,"gsap.from(el, { opacity: 0, y: 12, duration: 0.35, ease: 'power1.out', scrollTrigger: { trigger: el, start: 'top 90%', toggleActions: 'play none none reverse' } });",Requires the ScrollTrigger plugin registered once via gsap.registerPlugin(ScrollTrigger),"Keep the y offset small (8-16px) so it reads as a fade, not a slide",Don't reveal below-the-fold content needed for SEO/crawlers as invisible-by-default without a no-JS fallback,toggleActions 'play none none reverse' avoids re-triggering on every scroll direction change,
6
+ 5,Scroll Reveal,Standard,"scroll, slide up, staggered section, reveal",scroll (viewport enter),400-600ms,power2.out,"gsap.from(el.children, { opacity: 0, y: 24, duration: 0.5, stagger: 0.08, ease: 'power2.out', scrollTrigger: { trigger: el, start: 'top 85%' } });","In React use useGSAP(() => {...}, { scope: containerRef }) from @gsap/react to auto-cleanup on unmount",Scope the ScrollTrigger to the section container so it doesn't re-scan the whole page,Don't stagger more than ~8 children; beyond that the last items feel laggy,Set scroller/markers: false in production; markers is dev-only,
7
+ 6,Scroll Reveal,Complex,"scroll, pin, scrub, storytelling, scrollytelling",scroll (continuous scrub),tied to scroll position,none (scrub-driven),"gsap.timeline({ scrollTrigger: { trigger: section, start: 'top top', end: '+=150%', scrub: 1, pin: true } }).from('.headline', { opacity: 0, y: 40 }).to('.bg-layer', { yPercent: -20 }, '<');",Pinning needs the section to have deterministic height; recalc ScrollTrigger.refresh() after images/fonts load,Use scrub: true or a small number (0.5-1.5) instead of instant jumps so it feels tied to the scrollbar,Don't pin more than 1-2 sections per page; excessive pinning fights native scroll feel and hurts mobile UX,"Pinning forces layout reflow; test on mid-tier mobile devices, not just desktop",
8
+ 7,Stagger List,Subtle,"list, stagger, cards, grid entrance",load or scroll,250-350ms,power1.out,"gsap.from('.list-item', { opacity: 0, y: 8, duration: 0.3, stagger: 0.03 });",Select items with a stable class/data-attribute (not array index) so re-renders in React don't break targeting,Keep per-item stagger delay small (0.02-0.04s) for lists longer than 10 items,Don't stagger by more than 0.1s per item on long lists; total reveal time becomes sluggish,"For virtualized lists, only animate items currently mounted in the DOM",
9
+ 8,Stagger List,Standard,"grid, bento, cards, staggered scale",load or scroll,300-450ms,back.out(1.4),"gsap.from('.grid-item', { opacity: 0, scale: 0.92, y: 16, duration: 0.4, stagger: { each: 0.06, from: 'start', grid: 'auto' }, ease: 'back.out(1.4)' });",grid: 'auto' lets GSAP infer rows/columns from a CSS grid layout for a natural wave stagger,Combine with from: 'center' for a bento-grid layout to draw the eye inward first,Don't use back.out on dense data tables; the overshoot reads as sloppy on informational UI,Group DOM writes; avoid interleaving layout reads (getBoundingClientRect) between staggered tweens,"M1 override — declared playful register: the overshoot is the bento-grid entrance affordance; refused on data tables, per this row's Don't"
10
+ 9,Stagger List,Complex,"stagger, wave, text reveal, split text",load or scroll,400-700ms,expo.out,"const split = new SplitText(headline, { type: 'chars' }); gsap.from(split.chars, { opacity: 0, y: 20, rotateX: -40, duration: 0.6, stagger: 0.015, ease: 'expo.out' });",SplitText is a GSAP Club/paid plugin; confirm license before shipping and provide a plain fade fallback if unavailable,Revert SplitText on unmount/cleanup (split.revert()) to restore original text nodes for accessibility tools,Don't split-animate long paragraphs; reserve for short headlines (under ~8 words),Splitting text creates one element per character; keep it to headline-length copy only for DOM size,
11
+ 10,Page Transition,Subtle,"route change, fade, page transition",route change,200-300ms,power1.inOut,"gsap.to(main, { opacity: 0, duration: 0.2, onComplete: () => { navigate(); gsap.fromTo(main, { opacity: 0 }, { opacity: 1, duration: 0.2 }); } });","Pair with the router's transition hooks (Next.js App Router transitions, React Router's useNavigate, Vue Router's beforeEach/afterEach)",Preload the destination route's critical assets before the exit tween finishes,Don't block navigation on animation; cap exit duration at ~250ms so the app never feels unresponsive,Exit animation should always resolve faster than entrance (asymmetric timing) so back/forward feels snappy,
12
+ 11,Page Transition,Standard,"route change, slide, overlay wipe",route change,300-500ms,power2.inOut,"const tl = gsap.timeline(); tl.to('.transition-overlay', { yPercent: 0, duration: 0.4, ease: 'power2.inOut' }).call(navigate).to('.transition-overlay', { yPercent: -100, duration: 0.4, ease: 'power2.inOut', delay: 0.1 });",Keep the overlay element mounted at the layout root (outside the page component) so it survives the route swap,Show a lightweight loading indicator if the destination route's data fetch outlasts the overlay,Don't tie the overlay's reveal directly to data-fetch completion without a max-wait timeout; a slow API stalls the whole transition,Prefer CSS transform (yPercent) over top/left to keep the overlay animation on the compositor thread,
13
+ 12,Page Transition,Complex,"shared element, morph, hero transition",route change,300-500ms,expo.inOut,"const state = Flip.getState('.hero-image'); navigate(); Flip.from(state, { duration: 0.45, ease: 'expo.inOut', absolute: true, zIndex: 100 });",Requires the GSAP Flip plugin; the 'from' and 'to' route must render the same element with a shared data-flip-id,Verify the shared element exists in both DOM states before calling Flip.from to avoid a silent no-op,Don't use shared-element transitions across more than one element pair per navigation; compounding Flips are hard to time correctly,Flip recalculates layout (FLIP technique) so test on low-end devices for jank,
14
+ 13,Parallax Scroll,Subtle,"parallax, background, depth, scroll speed",scroll (continuous),tied to scroll position,linear (scrub),"gsap.to('.bg-layer', { yPercent: 10, ease: 'none', scrollTrigger: { trigger: section, scrub: true } });","Apply parallax to background/decorative layers only, never to text or interactive controls",Keep the yPercent delta small (5-15) so foreground and background never desync distractingly,Don't parallax body copy; it hurts reading comfort and can trigger motion sickness,will-change: transform on the parallax layer only; remove it after scroll settles to free GPU memory,
15
+ 14,Parallax Scroll,Standard,"multi-layer parallax, depth, hero background",scroll (continuous),tied to scroll position,linear (scrub),"gsap.utils.toArray('.parallax-layer').forEach((layer, i) => { gsap.to(layer, { yPercent: (i + 1) * -8, ease: 'none', scrollTrigger: { trigger: layer.parentElement, scrub: 0.5 } }); });",Layer count beyond 3-4 has diminishing visual return and multiplies scroll-listener cost,"Vary speed per layer (background slowest, foreground fastest) to sell the depth illusion",Don't let parallax layers overflow their container; clip with overflow: hidden on the wrapper,Batch all layers under one ScrollTrigger container where possible instead of one per layer,
16
+ 15,Loading / Skeleton,Subtle,"loading, skeleton, shimmer, pulse",on mount / async wait,1200-1600ms loop,sine.inOut,"gsap.to('.skeleton', { backgroundPosition: '200% 0', duration: 1.4, ease: 'sine.inOut', repeat: -1 });",Kill the loop tween (tween.kill()) as soon as real content mounts to avoid orphaned repeating animations,Use a CSS gradient background-position sweep rather than opacity pulsing; reads as 'loading' more clearly,Don't run more than one shimmer loop per skeleton group; sync them under one timeline so the wave reads as a single unit,repeat: -1 tweens are cheap but must be explicitly killed on unmount or they leak in SPA route changes,
17
+ 16,Loading / Skeleton,Standard,"progress, spinner, morphing loader",on mount / async wait,800-1200ms loop,power1.inOut,"gsap.timeline({ repeat: -1 }).to('.loader-dot', { y: -8, duration: 0.4, stagger: { each: 0.15, yoyo: true, repeat: 1 } });",Wrap the whole loop timeline in useGSAP with { revertOnUpdate: false } in React so it isn't rebuilt every render,Cap total loop duration under ~1.5s so long waits don't feel like the UI froze on a single beat,Don't use elaborate loaders for sub-300ms waits; they flash and feel worse than no indicator,Pause the timeline (tl.pause()) when the loading tab/view is not visible to save CPU on background tabs,
@@ -6,13 +6,13 @@ No,Category,Issue,Platform,Description,Do,Don't,Code Example Good,Code Example B
6
6
  5,Navigation,Deep Linking,All,URLs should reflect current state for sharing,Update URL on state/view changes,Static URLs for dynamic content,Use query params or hash,Single URL for all states,Medium
7
7
  6,Navigation,Breadcrumbs,Web,Show user location in site hierarchy,Use for sites with 3+ levels of depth,Use for flat single-level sites,Home > Category > Product,Only on deep nested pages,Low
8
8
  7,Animation,Excessive Motion,All,Too many animations cause distraction and motion sickness,Animate 1-2 key elements per view maximum,Animate everything that moves,Single hero animation,animate-bounce on 5+ elements,High
9
- 8,Animation,Duration Timing,All,Animations should feel responsive not sluggish,Use 150-300ms for micro-interactions,Use animations longer than 500ms for UI,transition-colors duration-200,transition-all duration-1000,Medium
9
+ 8,Animation,Duration Timing,All,Animations should feel responsive not sluggish,Use the per-interaction bands in design-patterns.md § Motion,Use animations longer than 500ms for UI,transition-colors duration-200,transition-all duration-1000,Medium
10
10
  9,Animation,Reduced Motion,All,Respect user's motion preferences,Check prefers-reduced-motion media query,Ignore accessibility motion settings,@media (prefers-reduced-motion: reduce),No motion query check,High
11
11
  10,Animation,Loading States,All,Show feedback during async operations,Use skeleton screens or spinners,Leave UI frozen with no feedback,animate-pulse skeleton,Blank screen while loading,High
12
12
  11,Animation,Hover vs Tap,All,Hover effects don't work on touch devices,Use click/tap for primary interactions,Rely only on hover for important actions,onClick handler,onMouseEnter only,High
13
13
  12,Animation,Continuous Animation,All,Infinite animations are distracting,Use for loading indicators only,Use for decorative elements,animate-spin on loader,animate-bounce on icons,Medium
14
14
  13,Animation,Transform Performance,Web,Some CSS properties trigger expensive repaints,Use transform and opacity for animations,Animate width/height/top/left properties,transform: translateY(),top: 10px animation,Medium
15
- 14,Animation,Easing Functions,All,Linear motion feels robotic,Use ease-out for entering ease-in for exiting,Use linear for UI transitions,ease-out,linear,Low
15
+ 14,Animation,Easing Functions,All,Linear motion feels robotic,Use ease-out in both directions entering and exiting,Use linear for UI transitions,ease-out,linear,Low
16
16
  15,Layout,Z-Index Management,Web,Stacking context conflicts cause hidden elements,Define z-index scale system (10 20 30 50),Use arbitrary large z-index values,z-10 z-20 z-50,z-[9999],High
17
17
  16,Layout,Overflow Hidden,Web,Hidden overflow can clip important content,Test all content fits within containers,Blindly apply overflow-hidden,overflow-auto with scroll,overflow-hidden truncating content,Medium
18
18
  17,Layout,Fixed Positioning,Web,Fixed elements can overlap or be inaccessible,Account for safe areas and other fixed elements,Stack multiple fixed elements carelessly,Fixed nav + fixed bottom with gap,Multiple overlapping fixed elements,Medium
@@ -78,6 +78,23 @@ config, not a vibe — never re-infer when `DESIGN.md` already sets them
78
78
  | default / unstated | 5–6 | 3–4 | 4–5 |
79
79
  | data-dense / dashboard / admin / cockpit | 4–6 | 2–3 | 7–9 |
80
80
  | bold / playful / expressive / awards / Dribbble | 8–10 | 7–10 | 3–5 |
81
+ | **DISQUALIFIER** — brief `frequency: high` or `initiation: keyboard` | — | **cap 3** | — |
82
+
83
+ The Motion row is the one dial with a **disqualifier**, and it outranks the
84
+ brief signal above it rather than averaging with it. The two brief fields it
85
+ reads are `frequency` and `initiation` ([`fe-design`](../../fe-design/SKILL.md)
86
+ § The loop, step 2): a surface used 100-plus times a day, or reached by
87
+ keyboard, does not get a high Motion dial however expressive the rest of the
88
+ brief reads. A keyboard-initiated surface is reached by someone who already
89
+ knows where they are going, so the animation is latency they pay on every
90
+ invocation — the decision tree in
91
+ [`design-patterns.md`](../../fe-design/references/design-patterns.md) § Motion
92
+ answers "should this animate at all" with *no* for exactly this case, and a
93
+ dial that could still reach 9 would contradict it.
94
+
95
+ A `bold / playful` brief on a command palette therefore resolves to `V 8–10 ·
96
+ M ≤ 3 · D 3–5`, and the cap is stated in the Design Read line so the user can
97
+ see it fired rather than wondering why the motion is flat.
81
98
 
82
99
  **Dial → downstream levers** (how a dial value changes generation):
83
100
 
@@ -25,7 +25,7 @@
25
25
  | 4 | Style Selection | HIGH | `style`, `product` | Match product type, Consistency, SVG icons (no emoji) | Mixing flat & skeuomorphic randomly, Emoji as icons |
26
26
  | 5 | Layout & Responsive | HIGH | `ux` | Mobile-first breakpoints, Viewport meta, No horizontal scroll | Horizontal scroll, Fixed px container widths, Disable zoom |
27
27
  | 6 | Typography & Color | MEDIUM | `typography`, `color` | Base 16px, Line-height 1.5, Semantic color tokens | Text &lt; 12px body, Gray-on-gray, Raw hex in components |
28
- | 7 | Animation | MEDIUM | `ux` | Duration 150–300ms, Motion conveys meaning, Spatial continuity | Decorative-only animation, Animating width/height, No reduced-motion |
28
+ | 7 | Animation | MEDIUM | `ux` | Duration within the authority's per-interaction bands, Motion conveys meaning, Spatial continuity | Decorative-only animation, Animating width/height, No reduced-motion |
29
29
  | 8 | Forms & Feedback | MEDIUM | `ux` | Visible labels, Error near field, Helper text, Progressive disclosure | Placeholder-only label, Errors only at top, Overwhelm upfront |
30
30
  | 9 | Navigation Patterns | HIGH | `ux` | Predictable back, Bottom nav ≤5, Deep linking | Overloaded nav, Broken back behavior, No deep links |
31
31
  | 10 | Charts & Data | LOW | `chart` | Legends, Tooltips, Accessible colors | Relying on color alone to convey meaning |
@@ -146,16 +146,16 @@
146
146
 
147
147
  ### 7. Animation (MEDIUM)
148
148
 
149
- - `duration-timing` - Use 150–300ms for micro-interactions; complex transitions ≤400ms; avoid >500ms (MD)
149
+ - `duration-timing` - Use the per-interaction bands in `design-patterns.md` § Motion; never above 500ms (MD)
150
150
  - `transform-performance` - Use transform/opacity only; avoid animating width/height/top/left
151
151
  - `loading-states` - Show skeleton or progress indicator when loading exceeds 300ms
152
152
  - `excessive-motion` - Animate 1-2 key elements per view max
153
- - `easing` - Use ease-out for entering, ease-in for exiting; avoid linear for UI transitions
153
+ - `easing` - Use ease-out in both directions, entering and exiting; avoid linear for UI transitions
154
154
  - `motion-meaning` - Every animation must express a cause-effect relationship, not just be decorative (Apple HIG)
155
155
  - `state-transition` - State changes (hover / active / expanded / collapsed / modal) should animate smoothly, not snap
156
156
  - `continuity` - Page/screen transitions should maintain spatial continuity (shared element, directional slide) (Apple HIG)
157
157
  - `parallax-subtle` - Use parallax sparingly; must respect reduced-motion and not cause disorientation (Apple HIG)
158
- - `spring-physics` - Prefer spring/physics-based curves over linear or cubic-bezier for natural feel (Apple HIG fluid animations)
158
+ - `spring-physics` - Prefer critically damped spring curves (no overshoot) over linear for natural feel (Apple HIG fluid animations)
159
159
  - `exit-faster-than-enter` - Exit animations shorter than enter (~60–70% of enter duration) to feel responsive (MD motion)
160
160
  - `stagger-sequence` - Stagger list/grid item entrance by 30–50ms per item; avoid all-at-once or too-slow reveals (MD)
161
161
  - `shared-element-transition` - Use shared element / hero transitions for visual continuity between screens (MD, HIG)
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: high
3
3
  name: design-review
4
- description: "When the user says \"review the design\", \"check the UI\", or wants a comprehensive UI/UX review. Uses a 7-phase methodology covering interaction, responsiveness, accessibility and more."
4
+ description: "When the user says \"review the design\", \"check the UI\", or wants a comprehensive UI/UX review. 7 phases: interaction, responsiveness, accessibility. Inventory via existing-ui-audit."
5
5
  domain: quality
6
6
  enforced_by:
7
7
  - "instruction-only: the Phase 4 sweep claims WCAG 2.1 AA and its criteria table is a deliberate SUBSET — depth is delegated to accessibility-auditor, which claims 2.2 AA and carries the resolver. No resolver checks this table against 2.1, so the claim is model-carried and the gap is recorded rather than implied."
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: inherit
3
3
  name: design-variations
4
- description: "Produce 3+ substantively distinct hi-fi design variations — basic to bold, one file with tweak controls — when the user asks for options, alternatives, or \"show me a few takes\"."
4
+ description: "Produce 3+ distinct hi-fi design variations — basic to bold, one file with tweak controls — when the user asks for options, alternatives, \"show me a few takes\". Extends fe-design."
5
5
  domain: product
6
6
  personas: []
7
7
  workspaces:
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: high
3
3
  name: existing-ui-audit
4
- description: "Use BEFORE writing or editing any non-trivial UI — inventories components, design tokens, shadcn primitives, and reusable patterns into state.ui_audit. Hard gate for the ui directive set."
4
+ description: "Use BEFORE writing or editing any non-trivial UI — inventories components, design tokens, shadcn primitives, and reusable patterns into state.ui_audit. Hard gate for fe-design."
5
5
  personas:
6
6
  - frontend-engineer
7
7
  domain: discovery
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: medium
3
3
  name: fe-design
4
- description: "Frontend design heuristics — and, outside the ticket engine, the loop that applies them: audit, brief, inventory, build, review. Use when building or changing any UI, not only when planning one."
4
+ description: "Frontend design heuristics and the loop applying them: existing-ui-audit, brief, inventory, build, review. Use when building or changing any UI, not only when planning one."
5
5
  personas:
6
6
  - frontend-engineer
7
7
  domain: engineering
@@ -46,10 +46,37 @@ else runs the loop.
46
46
  1. **Audit first** — run [`existing-ui-audit`](../existing-ui-audit/SKILL.md).
47
47
  What already exists (components, tokens, layout conventions) outranks every
48
48
  heuristic below. Reinventing an existing component is the #1 failure mode.
49
- 2. **Brief** — cover the same five keys the engine requires before any code:
50
- `layout`, `components`, `states`, `microcopy`, `a11y`. `states` means all
51
- five of `empty`, `loading`, `error`, `success`, `disabled` — a brief missing
52
- one is unfinished, not concise.
49
+ 2. **Brief** — seven keys before any code. Five are the ones the engine gates
50
+ (`REQUIRED_BRIEF_KEYS`): `layout`, `components`, `states`, `microcopy`,
51
+ `a11y`. `states` means all five of `empty`, `loading`, `error`, `success`,
52
+ `disabled` — a brief missing one is unfinished, not concise.
53
+
54
+ Two more are **declared, not gated**: `frequency` and `initiation`. The
55
+ engine does not halt on them, and that is stated rather than left to be
56
+ discovered — adding a required key would halt every brief already written
57
+ against the five.
58
+
59
+ | Key | Values | Why it is declared and never inferred |
60
+ |---|---|---|
61
+ | `frequency` | `one-time` · `low` · `medium` · `high` (100+ per day) | How often a surface is used decides whether motion on it reads as polish or as a toll. Nothing in a diff reveals it. |
62
+ | `initiation` | `keyboard` · `pointer` · `system` | A keyboard-initiated surface is reached by someone who already knows where they are going; an animation there is pure latency. |
63
+
64
+ Both are prefilled from the surface's role and overridden only on evidence.
65
+ There is no resolver and no inference from handlers: a `mousemove` listener
66
+ is not proof of pointer initiation, and a keyboard shortcut in the code is
67
+ not proof anyone uses it.
68
+
69
+ | Surface role | `frequency` | `initiation` |
70
+ |---|---|---|
71
+ | Command palette | `high` | `keyboard` |
72
+ | Tooltip | `high` | `pointer` |
73
+ | Modal / sheet | `medium` | `pointer` |
74
+ | Onboarding flow | `one-time` | `pointer` |
75
+ | Toast / notification | `medium` | `system` |
76
+ | Table row action | `high` | `pointer` |
77
+
78
+ The default for a role not listed is `medium` / `pointer`, stated in the
79
+ brief as a default rather than left blank.
53
80
  3. **Inventory — only when an artifact was provided, and before you build.**
54
81
  List the artifact's **interactions, keyframes, and script includes** from its
55
82
  source (`design-fidelity-mechanics` § Data-basis ladder — read it, do not
@@ -43,6 +43,13 @@ the moment the floor has to be present. Same content, later delivery.
43
43
  An undeclared pick is an undeclared choice (T7).
44
44
  12. **Zero silent drops.** A mechanic present in a supplied source and absent
45
45
  from the output, with no `flagged` entry, is a silent drop.
46
+ 13. **Shipped motion carries a `feel` line naming its method.** Duration and
47
+ easing being inside the bands in
48
+ [`design-patterns.md`](design-patterns.md) § Motion is a static check, and
49
+ motion that passes it can still be wrong to watch. The line names one of
50
+ `slow-motion` · `frame-step` · `device` · `next-day` and its outcome; an
51
+ outcome of `unbacked` is legal, an absent method is not
52
+ (`docs/contracts/evidence-artifact-types.md` § `feel`).
46
53
 
47
54
  ## What is NOT on this page
48
55
 
@@ -152,6 +152,16 @@ Step indicator (1 — 2 — 3)
152
152
 
153
153
  ## Motion — decision-tree and rationale
154
154
 
155
+ This section is the **sole carrier** of motion duration bands, easing choice and
156
+ the bounce prohibition; the five files that restate any of them are bound to the
157
+ values below and are checked against them by
158
+ `src/scripts/lint_motion_authority_drift.ts`:
159
+ `src/skills/design-intelligence/references/design-rules-checklist.md`,
160
+ `src/skills/design-intelligence/data/ux-guidelines.csv`,
161
+ `src/skills/design-intelligence/data/app-interface.csv`,
162
+ `src/skills/design-intelligence/data/styles.csv`,
163
+ `src/skills/design-intelligence/data/motion.csv`.
164
+
155
165
  Before adding any animation to a UI element, run through this decision tree:
156
166
 
157
167
  **1. Should this animate at all?**
@@ -162,8 +172,8 @@ Before adding any animation to a UI element, run through this decision tree:
162
172
 
163
173
  **2. Which easing?**
164
174
  - Entering (element appearing)? **ease-out** (starts fast, slows to rest). Why: the element arriving quickly signals responsiveness; the deceleration feels natural as it settles.
165
- - Exiting (element disappearing)? **ease-in** (starts slow, accelerates out). Why: the reverse is true — fast exit signals completion.
166
- - **Never ease-in for entering elements.** Why: ease-in delays the initial movement — the exact moment the user is watching most closely — making it feel slow even at the same total duration.
175
+ - Exiting (element disappearing)? **ease-out** as well. Why: one curve in both directions is the value a reader can hold and a gate can check; the field has no settled answer on exit easing, so a single shared curve removes the contradiction between carriers instead of propagating it. This line settles the **curve** only — how long an exit runs relative to its enter is a separate question it does not answer.
176
+ - **Never ease-in, in either direction.** Why: ease-in delays the initial movement — the exact moment the user is watching most closely — making it feel slow even at the same total duration.
167
177
  - **Never bounce or elastic easing in UI.** Why: bounce draws attention to the animation itself, not the content; it feels dated.
168
178
 
169
179
  **3. How long?**
@@ -199,6 +209,41 @@ The six interaction states every interactive element must assert are
199
209
  [`design-review`](../../design-review/SKILL.md)'s; this entry is the motion half
200
210
  of the hover one.
201
211
 
212
+ **6. Which mechanism carries it?**
213
+
214
+ Steps 1-5 decide *whether* and *how much*. This step decides *with what*, and it
215
+ is the step the tree used to skip: a CSS `transition` was the implicit answer to
216
+ everything, which is why an entry animation on a `<dialog>` or a popover
217
+ silently does nothing and a shared-element route change gets hand-rolled.
218
+
219
+ - **A CSS `transition` on `transform` and `opacity`** is the default and covers
220
+ most of steps 1-5. Reach past it only for the cases below.
221
+ - **An element entering or leaving the DOM, or the top layer** (`<dialog>`,
222
+ `popover`) has no "before" state to transition from and is gone before an exit
223
+ could run. That is what `@starting-style` is for — it supplies the entry's
224
+ starting values — together with `transition-behavior: allow-discrete` so
225
+ `display` and `overlay` participate instead of snapping. Without both, the
226
+ animation is not slow or wrong; it does not happen.
227
+ - **The Web Animations API** (`Element.animate()`) is the mechanism when the
228
+ values are computed at runtime, when the animation must be interruptible
229
+ (`Animation.cancel()`, `.reverse()`, `.finished`), or when several elements
230
+ share one timeline. A keyframe set known at author time does not need it.
231
+ - **A view transition** (`document.startViewTransition()`) is the mechanism for
232
+ a state or route change where an element persists across the change. It is the
233
+ first-party form of what a hand-built shared-element transition approximates,
234
+ and it is the case the 300-500ms page-transition band is for.
235
+ - **`transform-origin`** decides where a `scale()` grows from. A menu or popover
236
+ scaling in should originate at its trigger, not at its own centre, or it reads
237
+ as arriving from nowhere. Scale in from ~0.96, never from `scale(0)`: growing
238
+ from nothing is an entrance, and steps 1-2 asked for feedback.
239
+ - **`@media (hover: hover)`** gates any hover-carried motion. Without it a touch
240
+ device fires the hover treatment on tap and leaves it stuck, because there is
241
+ no pointer to leave.
242
+
243
+ All six still obey step 3's bands, step 2's single `ease-out` curve, and the
244
+ `@media (prefers-reduced-motion: reduce)` requirement above — a newer mechanism
245
+ is not an exemption from the authority, it is another way of spending it.
246
+
202
247
  **4. What to animate?**
203
248
  Animate `transform` and `opacity` only. Why: these run on the GPU compositor thread, not the main thread; they never trigger layout or paint.
204
249
  `scale(0)` → `scale(1)` is wrong. Why: nothing in the real world appears from nothing. Use `scale(0.95)` + `opacity: 0` → `scale(1)` + `opacity: 1` instead.
@@ -118,7 +118,9 @@ Schedule::command('queue:work')->everyMinute()->evenInMaintenanceMode();
118
118
  ## Running the scheduler
119
119
 
120
120
  ```bash
121
- # The scheduler itself runs every minute via system cron
121
+ # The scheduler itself runs every minute via system cron.
122
+ # cron has no working directory to inherit, and artisan takes no directory
123
+ # flag, so the `cd` is the shape here rather than a habit worth replacing.
122
124
  * * * * * cd /path-to-project && php artisan schedule:run >> /dev/null 2>&1
123
125
 
124
126
  # Test locally
@@ -350,12 +350,6 @@ After detecting **any** match, record the stack in the analysis output and selec
350
350
  2. Tech stack inventory with versions and dependencies
351
351
  3. Architecture diagram or module map
352
352
 
353
- ## Auto-trigger keywords
354
-
355
- - project analysis
356
- - codebase analysis
357
- - architecture analysis
358
-
359
353
  ## Gotcha
360
354
 
361
355
  - Full project analysis can take several minutes — warn the user about the time investment.
@@ -113,8 +113,8 @@ Before installing or upgrading anything, inspect what's already there — modify
113
113
  - Stuck pods: `pod deintegrate && pod install`.
114
114
 
115
115
  **Build failures**
116
- - Clean iOS: `cd ios && rm -rf build Pods Podfile.lock && pod install && cd ..`.
117
- - Clean Android: `cd android && ./gradlew clean && cd ..`.
116
+ - Clean iOS: `rm -rf ios/build ios/Pods ios/Podfile.lock` then `pod install --project-directory=ios`.
117
+ - Clean Android: `./gradlew -p android clean`.
118
118
  - Clear Xcode derived data when stale build artefacts persist.
119
119
 
120
120
  **New Architecture issues**
@@ -142,7 +142,7 @@ echo $ANDROID_HOME # non-empty
142
142
  ```bash
143
143
  npx @react-native-community/cli init MyProject
144
144
  cd MyProject
145
- cd ios && RCT_NEW_ARCH_ENABLED=1 pod install && cd ..
145
+ RCT_NEW_ARCH_ENABLED=1 pod install --project-directory=ios
146
146
  npm start # Metro
147
147
  npm run ios # in a second terminal
148
148
  npm run android # in a third terminal
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: medium
3
3
  name: react-shadcn-ui
4
- description: "Use when building React UI on shadcn/ui primitives + Tailwind — the apply/review/polish skill dispatched by `directives/ui/*` for the `react-shadcn` stack."
4
+ description: "Building React UI on shadcn/ui primitives + Tailwind — the apply/review/polish skill dispatched by `directives/ui/*` for the `react-shadcn` stack; idiom from tailwind-engineer."
5
5
  domain: engineering
6
6
  workspaces:
7
7
  - engineering
@@ -129,12 +129,22 @@ Explore alternatives when:
129
129
  1. Numbered reasoning steps with conclusions
130
130
  2. Final answer or recommendation with confidence level
131
131
 
132
- ## Auto-trigger keywords
132
+ ## Tool availability — this is a procedure, not a tool call
133
133
 
134
- - problem solving
135
- - step-by-step
136
- - reasoning
137
- - decomposition
134
+ Everything above runs **in-session**: it is a way of structuring reasoning, and
135
+ it needs nothing installed.
136
+
137
+ The wider MCP ecosystem carries a `sequentialthinking` server exposing a tool of
138
+ that name. **This package registers no MCP server** — `mcp.json` ships
139
+ `{"servers": {}}` — so on a default install that tool is not present, and
140
+ nothing here tries to call it. Registering one is a consumer-side install
141
+ decision this package deliberately does not make for you.
142
+
143
+ So a reader on a default install can answer the question directly: the tool is
144
+ not available to you, and none of this skill depends on it. If you have
145
+ registered such a server yourself, the once-per-task limit below governs that
146
+ call too — the limit is about looping, not about which mechanism does the
147
+ thinking.
138
148
 
139
149
  ## Gotcha
140
150
 
@@ -145,9 +155,9 @@ Explore alternatives when:
145
155
  ## Do NOT
146
156
 
147
157
  - Do NOT use this for simple, well-understood tasks — it adds unnecessary overhead.
148
- - Do NOT call `sequentialthinking` more than **once per task**. If you're calling it repeatedly,
149
- you're looping — stop and act directly instead.
150
- - Do NOT use `sequentialthinking` as a "thinking proxy" — if the task is "view a file" or
158
+ - Do NOT run this procedure more than **once per task**. If you are reaching for it
159
+ repeatedly, you are looping — stop and act directly instead.
160
+ - Do NOT use it as a "thinking proxy" — if the task is "view a file" or
151
161
  "run a command", just do it. No thinking step needed.
152
162
  - Do NOT skip the validation step — always check the solution against the original problem.
153
163
  - Do NOT ignore contradictions — they are signals, not noise.
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: medium
3
3
  name: tailwind-engineer
4
- description: "Use when writing or reviewing Tailwind CSS — utility-first, design-token discipline, no inline-style drift, responsive variants, dark mode — even on 'style this' or 'mach das hübsch'."
4
+ description: "Writing or reviewing Tailwind CSS — utility-first, design tokens, no inline-style drift, responsive variants, dark mode — 'style this' or 'mach das hübsch'. Pairs with react-shadcn-ui."
5
5
  personas:
6
6
  - frontend-engineer
7
7
  domain: engineering
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: medium
3
3
  name: ui-apply-generic
4
- description: "Use when implementing a UI brief on a stack with no framework executor — Svelte, Astro, Angular, plain HTML. Carries the stack-independent contract; idiom comes from the stack corpus."
4
+ description: "Use when implementing a UI brief on a stack with no framework executor — Svelte, Astro, Angular, plain HTML. Stack-independent sibling of react-shadcn-ui; idiom from the stack corpus."
5
5
  personas:
6
6
  - frontend-engineer
7
7
  domain: engineering
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  model_tier: high
3
3
  name: ui-component-architect
4
- description: "Use when shaping a UI component tree — composition vs inheritance, slot patterns, prop API design, controlled vs uncontrolled, polymorphic — even on 'split this component'."
4
+ description: "Shaping a UI component tree — composition vs inheritance, slot patterns, prop API design, controlled vs uncontrolled, polymorphic — on 'split this component'. Feeds react-shadcn-ui."
5
5
  personas:
6
6
  - frontend-engineer
7
7
  domain: engineering
@@ -105,7 +105,9 @@ Ask format:
105
105
 
106
106
  > 1. `.worktrees/` — project-local, hidden
107
107
  > 2. `worktrees/` — project-local, visible
108
- > 3. `~/.event4u/agent-config/worktrees/<project>/` — global
108
+ > 3. `~/.event4u/agent-config/worktrees/<project>/` — global, **outside the
109
+ > repository root**: costs the persistent shell cwd (see below) and requires
110
+ > declaring the parent in the host's working-directory allowlist
109
111
 
110
112
  **Recommendation: 1 — `.worktrees/`** — project-local keeps the worktree next to the repo (easy cleanup), and the leading dot keeps it out of `ls`. Caveat: pick 3 if multiple repos must share a single worktree root.
111
113
 
@@ -135,9 +137,22 @@ passes. For the global location, skip — path is outside the repo.
135
137
 
136
138
  ```bash
137
139
  git worktree add .worktrees/<branch-name> -b <branch-name>
138
- cd .worktrees/<branch-name>
139
140
  ```
140
141
 
142
+ **Then address the worktree by flag, not by `cd`.** Every tool that matters
143
+ takes a directory flag, and the flag survives where a `cd` does not:
144
+
145
+ ```bash
146
+ git -C .worktrees/<branch-name> status
147
+ npm --prefix .worktrees/<branch-name> test
148
+ composer -d .worktrees/<branch-name> install
149
+ ```
150
+
151
+ A `cd X && …` compound re-enters the directory on every single call, and the
152
+ one call that forgets it edits the main checkout silently — the failure is
153
+ invisible because the command succeeds. Where a tool genuinely has no directory
154
+ flag, use a subshell so the change cannot leak: `( cd <path> && <cmd> )`.
155
+
141
156
  Branch names must match the project convention — see
142
157
  `commit-conventions` rule.
143
158
 
@@ -39,7 +39,7 @@ schema_version: 1
39
39
  # CI guard: a release bump of `package.json` must update this value
40
40
  # in lockstep — see scripts/check_template_pin_drift.ts (road-to-
41
41
  # portable-runtime-and-update-check P3.3).
42
- agent_config_version: "14.18.0"
42
+ agent_config_version: "14.19.0"
43
43
 
44
44
  # --- Project identity ---
45
45
  project:
@@ -3,7 +3,7 @@
3
3
  *
4
4
  * Records a live trigger-eval result into a corpus manifest's `upstream`
5
5
  * block (the second half of the corpus-refresh DoD, ADR-061 §6). It does
6
- * NOT run the eval — `skill_trigger_eval.py`'s confirmation gate hard-aborts
6
+ * NOT run the eval — `skill_trigger_eval`'s confirmation gate hard-aborts
7
7
  * under automation by design, so the live run stays a human, interactive
8
8
  * step. This command is a *post-processor*: it reads the `EvalResult` JSON the
9
9
  * live run wrote (`--output`), enforces a precision/recall floor, and writes
@@ -36,7 +36,7 @@ import { logger } from '../log/logger.js';
36
36
  // Floors shared with the weekly canary rotation (ADR-118 §4) — values
37
37
  // unchanged, single source of truth.
38
38
  import { floor_for } from '../../scripts/_lib/trigger_eval_floors.js';
39
- /** Subset of `skill_trigger_eval.py`'s `EvalResult` we depend on. */
39
+ /** Subset of `skill_trigger_eval`'s `EvalResult` we depend on. */
40
40
  const EvalResultSchema = z.object({
41
41
  skill: z.string().optional(),
42
42
  model: z.string().optional(),
package/dist/cli/main.js CHANGED
@@ -83,7 +83,7 @@ async function main(rawArgv) {
83
83
  program
84
84
  .command('eval:record')
85
85
  .description('Record a live trigger-eval result into a corpus manifest (ADR-061 §6 refresh DoD)')
86
- .requiredOption('--eval-json <path>', 'EvalResult JSON written by skill_trigger_eval.py --output')
86
+ .requiredOption('--eval-json <path>', 'EvalResult JSON written by skill_trigger_eval --output')
87
87
  .requiredOption('--manifest <path>', 'corpus manifest.json to patch')
88
88
  .option('--min-recall <n>', 'Recall floor override (per-skill default otherwise)', (v) => Number.parseFloat(v))
89
89
  .option('--min-precision <n>', 'Precision floor override (per-skill default otherwise)', (v) => Number.parseFloat(v))