@amsterdamdatalabs/enact-extensions 0.1.37 → 0.1.47

package/extensions/enact-repo/skills/interaction-design/references/scroll-animations-reveals.md

@@ -0,0 +1,213 @@
+# Scroll Animations Reference — Reveals, Sticky, Smooth Scroll, Performance
+
+Continuation of [scroll-animations.md](scroll-animations.md) (Intersection Observer, scroll progress, parallax, scroll-linked animation).
+
+## Reveal Animations
+
+### Staggered List Reveal
+
+```tsx
+function StaggeredList({ items }) {
+  const [ref, isInView] = useInView({ threshold: 0.1, triggerOnce: true });
+
+  return (
+    <ul ref={ref} className="space-y-4">
+      {items.map((item, i) => (
+        <motion.li
+          key={item.id}
+          initial={{ opacity: 0, x: -20 }}
+          animate={isInView ? { opacity: 1, x: 0 } : {}}
+          transition={{ delay: i * 0.1, duration: 0.5 }}
+          className="p-4 bg-white rounded-lg shadow"
+        >
+          {item.content}
+        </motion.li>
+      ))}
+    </ul>
+  );
+}
+```
+
+### Text Reveal
+
+```tsx
+function TextReveal({ text }) {
+  const [ref, isInView] = useInView({ threshold: 0.5, triggerOnce: true });
+  const words = text.split(" ");
+
+  return (
+    <p ref={ref} className="text-4xl font-bold">
+      {words.map((word, i) => (
+        <motion.span
+          key={i}
+          initial={{ opacity: 0, y: 20 }}
+          animate={isInView ? { opacity: 1, y: 0 } : {}}
+          transition={{ delay: i * 0.05, duration: 0.3 }}
+          className="inline-block mr-2"
+        >
+          {word}
+        </motion.span>
+      ))}
+    </p>
+  );
+}
+```
+
+### Clip Path Reveal
+
+```tsx
+function ClipReveal({ children }) {
+  const [ref, isInView] = useInView({ threshold: 0.3, triggerOnce: true });
+
+  return (
+    <motion.div
+      ref={ref}
+      initial={{ clipPath: "inset(0 100% 0 0)" }}
+      animate={isInView ? { clipPath: "inset(0 0% 0 0)" } : {}}
+      transition={{ duration: 0.8, ease: [0.16, 1, 0.3, 1] }}
+    >
+      {children}
+    </motion.div>
+  );
+}
+```
+
+## Sticky Scroll Sections
+
+```tsx
+function StickySection({ title, content, image }) {
+  const ref = useRef(null);
+  const { scrollYProgress } = useScroll({
+    target: ref,
+    offset: ["start start", "end start"],
+  });
+
+  const opacity = useTransform(scrollYProgress, [0, 0.5, 1], [1, 1, 0]);
+  const scale = useTransform(scrollYProgress, [0, 0.5, 1], [1, 1, 0.8]);
+
+  return (
+    <section ref={ref} className="relative h-[200vh]">
+      <motion.div
+        style={{ opacity, scale }}
+        className="sticky top-0 h-screen flex items-center"
+      >
+        <div className="grid grid-cols-2 gap-16 container mx-auto">
+          <div>
+            <h2 className="text-4xl font-bold">{title}</h2>
+            <p className="mt-4 text-lg text-gray-600">{content}</p>
+          </div>
+          <div>
+            <img src={image} alt="" className="rounded-2xl shadow-xl" />
+          </div>
+        </div>
+      </motion.div>
+    </section>
+  );
+}
+```
+
+## Smooth Scroll
+
+```tsx
+// Using CSS
+html {
+  scroll-behavior: smooth;
+}
+
+// Using Lenis for butter-smooth scrolling
+import Lenis from '@studio-freight/lenis';
+
+function SmoothScrollProvider({ children }) {
+  useEffect(() => {
+    const lenis = new Lenis({
+      duration: 1.2,
+      easing: (t) => Math.min(1, 1.001 - Math.pow(2, -10 * t)),
+      direction: 'vertical',
+      smooth: true,
+    });
+
+    function raf(time) {
+      lenis.raf(time);
+      requestAnimationFrame(raf);
+    }
+    requestAnimationFrame(raf);
+
+    return () => lenis.destroy();
+  }, []);
+
+  return children;
+}
+```
+
+## Scroll Snap
+
+```css
+/* Scroll snap container */
+.snap-container {
+  scroll-snap-type: y mandatory;
+  overflow-y: scroll;
+  height: 100vh;
+}
+
+.snap-section {
+  scroll-snap-align: start;
+  height: 100vh;
+}
+
+/* Smooth scrolling with snap */
+@supports (scroll-snap-type: y mandatory) {
+  .snap-container {
+    scroll-behavior: smooth;
+  }
+}
+```
+
+```tsx
+function FullPageScroll({ sections }) {
+  return (
+    <div className="snap-container">
+      {sections.map((section, i) => (
+        <section
+          key={i}
+          className="snap-section flex items-center justify-center"
+        >
+          {section}
+        </section>
+      ))}
+    </div>
+  );
+}
+```
+
+## Performance Optimization
+
+```tsx
+// Use will-change sparingly
+const AnimatedElement = styled(motion.div)`
+  will-change: transform;
+`;
+
+// Debounce scroll handlers
+function useThrottledScroll(callback, delay = 16) {
+  const lastRun = useRef(0);
+
+  useEffect(() => {
+    const handler = () => {
+      const now = Date.now();
+      if (now - lastRun.current >= delay) {
+        lastRun.current = now;
+        callback();
+      }
+    };
+
+    window.addEventListener("scroll", handler, { passive: true });
+    return () => window.removeEventListener("scroll", handler);
+  }, [callback, delay]);
+}
+
+// Use transform instead of top/left
+// Good
+const goodAnimation = { transform: "translateY(100px)" };
+// Bad (causes reflow)
+const badAnimation = { top: "100px" };
+```

package/extensions/enact-repo/skills/interaction-design/references/scroll-animations.md

@@ -0,0 +1,209 @@
+# Scroll Animations Reference
+
+Intersection observation, scroll progress, and parallax/scroll-linked motion. See also [scroll-animations-reveals.md](scroll-animations-reveals.md) for reveal, sticky, smooth-scroll, scroll-snap, and performance patterns.
+
+## Intersection Observer Hook
+
+```tsx
+import { useEffect, useRef, useState, type RefObject } from "react";
+
+interface UseInViewOptions {
+  threshold?: number | number[];
+  rootMargin?: string;
+  triggerOnce?: boolean;
+}
+
+function useInView<T extends HTMLElement>({
+  threshold = 0,
+  rootMargin = "0px",
+  triggerOnce = false,
+}: UseInViewOptions = {}): [RefObject<T>, boolean] {
+  const ref = useRef<T>(null);
+  const [isInView, setIsInView] = useState(false);
+
+  useEffect(() => {
+    const element = ref.current;
+    if (!element) return;
+
+    const observer = new IntersectionObserver(
+      ([entry]) => {
+        const inView = entry.isIntersecting;
+        setIsInView(inView);
+        if (inView && triggerOnce) {
+          observer.unobserve(element);
+        }
+      },
+      { threshold, rootMargin },
+    );
+
+    observer.observe(element);
+    return () => observer.disconnect();
+  }, [threshold, rootMargin, triggerOnce]);
+
+  return [ref, isInView];
+}
+
+// Usage
+function FadeInSection({ children }) {
+  const [ref, isInView] = useInView({ threshold: 0.2, triggerOnce: true });
+
+  return (
+    <div
+      ref={ref}
+      className={`transition-all duration-700 ${
+        isInView ? "opacity-100 translate-y-0" : "opacity-0 translate-y-8"
+      }`}
+    >
+      {children}
+    </div>
+  );
+}
+```
+
+## Scroll Progress Indicator
+
+```tsx
+import { motion, useScroll, useSpring } from "framer-motion";
+
+function ScrollProgress() {
+  const { scrollYProgress } = useScroll();
+  const scaleX = useSpring(scrollYProgress, {
+    stiffness: 100,
+    damping: 30,
+    restDelta: 0.001,
+  });
+
+  return (
+    <motion.div
+      className="fixed top-0 left-0 right-0 h-1 bg-blue-600 origin-left z-50"
+      style={{ scaleX }}
+    />
+  );
+}
+```
+
+## Parallax Scrolling
+
+### Simple CSS Parallax
+
+```css
+.parallax-container {
+  height: 100vh;
+  overflow-x: hidden;
+  overflow-y: auto;
+  perspective: 10px;
+}
+
+.parallax-layer-back {
+  transform: translateZ(-10px) scale(2);
+}
+
+.parallax-layer-base {
+  transform: translateZ(0);
+}
+```
+
+### Framer Motion Parallax
+
+```tsx
+import { motion, useScroll, useTransform } from "framer-motion";
+
+function ParallaxHero() {
+  const ref = useRef(null);
+  const { scrollYProgress } = useScroll({
+    target: ref,
+    offset: ["start start", "end start"],
+  });
+
+  const y = useTransform(scrollYProgress, [0, 1], ["0%", "50%"]);
+  const opacity = useTransform(scrollYProgress, [0, 0.5], [1, 0]);
+  const scale = useTransform(scrollYProgress, [0, 1], [1, 1.2]);
+
+  return (
+    <section ref={ref} className="relative h-screen overflow-hidden">
+      {/* Background image with parallax */}
+      <motion.div style={{ y, scale }} className="absolute inset-0">
+        <img src="/hero-bg.jpg" alt="" className="w-full h-full object-cover" />
+      </motion.div>
+
+      {/* Content fades out on scroll */}
+      <motion.div
+        style={{ opacity }}
+        className="relative z-10 flex items-center justify-center h-full"
+      >
+        <h1 className="text-6xl font-bold text-white">Welcome</h1>
+      </motion.div>
+    </section>
+  );
+}
+```
+
+## Scroll-Linked Animations
+
+### Progress-Based Animation
+
+```tsx
+function ScrollAnimation() {
+  const containerRef = useRef(null);
+  const { scrollYProgress } = useScroll({
+    target: containerRef,
+    offset: ["start end", "end start"],
+  });
+
+  // Different transformations based on scroll progress
+  const x = useTransform(scrollYProgress, [0, 1], [-200, 200]);
+  const rotate = useTransform(scrollYProgress, [0, 1], [0, 360]);
+  const backgroundColor = useTransform(
+    scrollYProgress,
+    [0, 0.5, 1],
+    ["#3b82f6", "#8b5cf6", "#ec4899"],
+  );
+
+  return (
+    <div ref={containerRef} className="h-[200vh] py-20">
+      <div className="sticky top-1/2 -translate-y-1/2 flex justify-center">
+        <motion.div
+          style={{ x, rotate, backgroundColor }}
+          className="w-32 h-32 rounded-2xl"
+        />
+      </div>
+    </div>
+  );
+}
+```
+
+### Horizontal Scroll Section
+
+```tsx
+function HorizontalScroll({ items }) {
+  const containerRef = useRef(null);
+  const { scrollYProgress } = useScroll({
+    target: containerRef,
+    offset: ["start start", "end end"],
+  });
+
+  const x = useTransform(
+    scrollYProgress,
+    [0, 1],
+    ["0%", `-${(items.length - 1) * 100}%`],
+  );
+
+  return (
+    <section ref={containerRef} className="relative h-[300vh]">
+      <div className="sticky top-0 h-screen overflow-hidden">
+        <motion.div style={{ x }} className="flex h-full">
+          {items.map((item, i) => (
+            <div
+              key={i}
+              className="flex-shrink-0 w-screen h-full flex items-center justify-center"
+            >
+              {item}
+            </div>
+          ))}
+        </motion.div>
+      </div>
+    </section>
+  );
+}
+```
+

package/extensions/enact-repo/skills/lean-ctx/SKILL.md

@@ -0,0 +1,81 @@
+---
+name: lean-ctx
+description: Local context tooling for AI agents. Use it to select, shape, reuse, recover, and inspect context before inference when reading files, running shell commands, searching code, or exploring directories.
+disable-model-invocation: false
+---
+
+# lean-ctx — Local Context SDK for AI Agents
+
+## Use When
+
+- lean-ctx is installed and available in this environment, and you want token-efficient context handling — reading files, running shell commands, searching code, or exploring directories — before inference.
+- You need anchored, source-addressable file edits, or want to pick the right `ctx_read` mode for the task.
+
+## Do Not Use When
+
+- lean-ctx is not installed and the client does not expose the `ctx_*` tool surface — install it first (see Setup) or fall back to native Read/Edit tools.
+
+## Setup
+
+```bash
+which lean-ctx || curl -fsSL https://raw.githubusercontent.com/yvgude/lean-ctx/main/skills/lean-ctx/scripts/install.sh | bash
+lean-ctx setup
+```
+
+## Tool Visibility Profiles
+
+| Profile | Tools advertised |
+|---------|------------------|
+| Lean (default, unpinned) | `ctx_read`, `ctx_shell`, `shell`, `ctx_search`, `ctx_glob`, `ctx_tree`, `ctx_session`, `ctx_compose`, `ctx_callgraph`, `ctx_patch`*, `ctx_call`, `ctx_expand` |
+| `minimal` | `ctx_read`, `ctx_shell`, `ctx_search`, `ctx_glob`, `ctx_tree`; `ctx_call` is also advertised as the fallback invoker |
+| `standard` | Minimal + `ctx_compose`, `ctx_explore`, `ctx_knowledge`, `ctx_session`, `ctx_callgraph`, `ctx_graph`, `ctx_delta`, `ctx_execute`, `ctx_expand`, `ctx_overview`, `ctx_url_read`, `ctx_patch`; `ctx_call` is also advertised as the fallback invoker |
+| `power` | Full public tool registry |
+
+\* Lean hides `ctx_patch` for clients with a reliable native editor. Disabled
+tools, role policy, and client compatibility can further narrow every profile.
+
+## Shell Hook (use instead of raw exec)
+
+```bash
+lean-ctx -c "git status"
+lean-ctx -c "cargo test"
+lean-ctx -c "npm install"
+lean-ctx ls src/
+```
+
+## ctx_read Modes
+
+| Mode | When |
+|------|------|
+| `anchored` | Files you will edit (full text + `N:hh\|` anchors for ctx_patch) |
+| `full` | Verbatim cached read |
+| `map` | Context-only (deps + exports) |
+| `signatures` | API surface only |
+| `diff` | After edits (changed lines) |
+| `aggressive` | Large files, syntax-stripped; JSON arrays row-deduped (lossless) |
+| `entropy` | Shannon filtering |
+| `task` | Task-relevant lines |
+| `lines:N-M` | Specific range |
+| `auto` | System selects optimal |
+
+Re-reads may use the local cache. Set `fresh=true` to bypass it.
+Redundant JSON (arrays of like objects) is crushed losslessly into a compact
+`_defaults` + per-row form; if a slice was dropped, recover it with
+`ctx_expand(id, json_path=… | search=…)`.
+
+## File Editing
+
+Anchored editing keeps an exact, source-addressable view: `ctx_read(mode="anchored")` → `ctx_patch(path, op, line, hash, new_text)`.
+Never reproduce old text byte-for-byte; batch via `ops:[…]`; `op=create` writes new files.
+Stale anchor → CONFLICT with fresh anchors (retry once). Native Edit/StrReplace stay fine;
+`ctx_edit` (str_replace) is the legacy fallback via ctx_call/power profile.
+
+## More Tools (via ctx_call or ctx_load_tools)
+
+Architecture: ctx_symbol, ctx_callgraph, ctx_impact, ctx_architecture, ctx_routes, ctx_smells, ctx_quality
+  ↳ "What breaks if I change this file/class/type?" → ctx_impact (file-level blast radius; resolves same-package/namespace type usage with no import for C#, Java, Go and Kotlin). "Who calls this function?" → ctx_callgraph (symbol-level). "How navigable / how much is complexity costing me?" → ctx_quality (navigability score + token quality tax).
+Experimental local collaboration (explicit opt-in only): ctx_agent, ctx_share, ctx_task, ctx_handoff, ctx_workflow
+Verify: ctx_benchmark, ctx_verify, ctx_proof, ctx_review
+Batch: ctx_fill, ctx_execute, ctx_expand, ctx_pack
+
+Full docs: https://leanctx.com/docs

package/extensions/enact-repo/skills/orca-cli/SKILL.md

@@ -0,0 +1,88 @@
+---
+name: orca-cli
+description: >-
+  Use the public `orca` CLI to operate Orca-managed worktrees, folder contexts,
+  terminals, repos, automations, artifacts, skill sharing, worktree comments, and the browser
+  embedded inside the Orca app. Use when the user says "$orca-cli", "use orca cli",
+  "Orca worktree", "child worktree", "cardStatus", "spawn codex/claude in a worktree",
+  "read/wait/send Orca terminal", "terminal send", "full handoff", "handover",
+  "give this to another agent", "another worktree", "Orca browser", "orca artifacts",
+  "share HTML/Markdown", "public artifact link", "share skills", or "control the browser inside
+  Orca". Prefer this over raw `git worktree`, ad hoc
+  PTYs, Playwright, or Computer Use when the task touches Orca-managed state.
+  Use Computer Use for browser windows, webviews, or desktop UI outside Orca's
+  embedded browser.
+disable-model-invocation: false
+---
+
+# Orca CLI
+
+This file is a discovery stub, not the usage guide. The full, version-matched Orca CLI
+reference is served by the `orca` binary itself — kept out of this file on purpose so it
+can never drift from the binary that will actually run your commands.
+
+## Use When
+
+Orca's running editor/runtime is the source of truth: Orca-managed worktrees,
+folder contexts, terminals, repos, automations, worktree comments, and the
+browser embedded inside the Orca app. Also full ownership handoffs — "hand
+off", "handover", "give this to another agent", "another worktree" — when the
+user did not ask to supervise, monitor, wait for results, or coordinate a DAG.
+
+## Do Not Use When
+
+Orca state does not matter — use plain shell tools. Desktop UI, browser
+windows, or webviews outside Orca's embedded browser — use `computer-use`.
+Structured multi-agent coordination that needs supervision, blocking ask/reply,
+task dispatch, or decision gates — use `orchestration`.
+
+## Resolve the CLI for this session
+
+Choose the executable once and reuse it for every later command:
+
+- If the `ORCA_CLI_COMMAND` environment variable is set, use its value. Orca exports this
+  for managed WSL sessions.
+- Otherwise, in a dev checkout whose session exposes `ORCA_DEV_REPO_ROOT`, use `orca-dev`.
+- Otherwise, on Linux outside an Orca-managed terminal, use `orca-ide`. Never run bare
+  `orca` there — outside Orca's terminals it normally resolves to the
+  GNOME Orca screen reader (`/usr/bin/orca`) and starts speech on the user's machine.
+- Otherwise, use `orca`.
+
+Below, `ORCA` is a placeholder for the executable you resolved. Substitute it before
+running anything; do not create a shell variable or run `ORCA` literally. This works the
+same way in POSIX shells, PowerShell, and cmd.exe.
+
+If the selected executable cannot run, report its exact error and stop. Do not fall through
+to another executable, which could silently target a different Orca build.
+
+## Load the full guide before running Orca commands
+
+```text
+ORCA skills get orca-cli
+```
+
+That prints the complete, version-matched guide for the exact binary that will handle your
+next commands — worktrees, handoffs, terminals, automations, and the built-in browser.
+Read it first, then run the specific command you need.
+
+Don't guess subcommands or flags from memory or from a cached copy of this stub. They
+change between Orca releases, and this file deliberately no longer lists them. Confirm the
+app is up with `ORCA status --json` (start it with `ORCA open --json` if needed), and
+prefer `--json` for agent-driven calls.
+
+## If an older Orca does not recognize `skills get`
+
+Use this fallback only when the selected binary explicitly reports that `skills get` is an
+unknown command. Another failure is not proof of an older binary; report it rather than
+guessing or changing executables. For a confirmed pre-guide binary, use only this bounded,
+read-only bootstrap to orient. Do not dead-end and do not invent commands:
+
+```text
+ORCA status --json
+ORCA worktree ps --json
+ORCA terminal list --json
+```
+
+Then tell the user that updating Orca restores the full, version-matched guide via
+`ORCA skills get orca-cli`. Beyond these commands, ask the user rather than guessing a
+command surface this older binary may not support.

package/extensions/enact-repo/skills/orchestration/SKILL.md

@@ -0,0 +1,80 @@
+---
+name: orchestration
+description: >-
+  Use Orca orchestration for structured multi-agent coordination: threaded
+  messages, blocking ask/reply flows, task dispatch, worker_done/escalation
+  waits, task DAGs, decision gates, coordinator loops, or decomposing work
+  across agents. Use `orca-cli` instead for full ownership handoffs, including
+  requests phrased as "hand off", "handoff", "handover", "give this to another
+  agent", or "another worktree" when the user did not explicitly ask to
+  supervise, monitor, wait for results, or coordinate a DAG. Use `orca-cli` for
+  ordinary terminal control, lightweight terminal prompts, shell commands, Orca
+  worktree management, reading or waiting on terminals, and automation of the
+  browser embedded inside Orca. Use Computer Use for browser windows, webviews,
+  Orca app UI, or desktop UI outside Orca's embedded browser.
+disable-model-invocation: false
+---
+
+# Orca Orchestration
+
+This file is a discovery stub, not the usage guide. The full, version-matched Orca
+orchestration reference is served by the `orca` binary itself — kept out of this file on
+purpose so it can never drift from the binary that will actually run your commands.
+
+## Use When
+
+Structured multi-agent coordination is needed: threaded messages, blocking
+ask/reply flows, task dispatch, worker_done/escalation waits, task DAGs,
+decision gates, coordinator loops, or decomposing work across agents.
+Coordination requires real Orca runtime state; never substitute a non-Orca
+subagent tool.
+
+## Do Not Use When
+
+Full ownership handoffs ("hand off", "handoff", "handover", "give this to
+another agent", "another worktree") when the user did not ask to supervise,
+monitor, wait for results, or coordinate a DAG — use `orca-cli`. Ordinary
+terminal control, shell commands, worktree management, or automating the
+browser embedded inside Orca — use `orca-cli`. Desktop UI, browser windows, or
+webviews outside Orca's embedded browser — use `computer-use`.
+
+## Resolve the CLI for this session
+
+`orca-cli` owns the resolution order for this session's executable —
+`ORCA_CLI_COMMAND`, else `orca-dev`, else `orca-ide`, else `orca` — under its
+**Resolve the CLI for this session** heading, along with the `ORCA` placeholder
+convention used below. If the resolved executable fails, report the error and
+stop rather than trying another one.
+
+## Load the full guide before running Orca commands
+
+```text
+ORCA skills get orchestration
+```
+
+That prints the complete, version-matched guide for the exact binary that will
+handle your next commands — task creation and dispatch, injected lifecycle
+preambles, worker_done authority, decision gates, and coordinator loops. Read
+it first, then run the specific command you need. This stub does not list
+orchestration subcommands or flags — they change between Orca releases, so
+confirm behavior against the live guide rather than memory or a cached copy of
+this file. Confirm the app is up with `ORCA status --json` (start it with
+`ORCA open --json` if needed), and prefer `--json` for agent-driven calls.
+
+## If an older Orca does not recognize `skills get`
+
+Fall back to this bootstrap only when the selected binary explicitly reports
+`skills get` as an unknown command — a different failure is not proof of an
+older binary, so report it instead of guessing or switching executables. For a
+confirmed pre-guide binary, use only this bounded, read-only sequence to
+orient. Do not dead-end and do not invent commands:
+
+```text
+ORCA status --json
+ORCA orchestration task-list --json
+ORCA terminal list --json
+```
+
+Then tell the user that updating Orca restores the full, version-matched guide via
+`ORCA skills get orchestration`. Beyond these commands, ask the user rather than guessing a
+command surface this older binary may not support.