@mmerterden/multi-agent-pipeline 8.6.2 → 10.2.0

package/pipeline/skills/figma-common/figma-overlays/SKILL.md

@@ -0,0 +1,128 @@
+---
+name: figma-overlays
+description: "Overlay pattern integration for Figma-to-SwiftUI components — toasts/snackbars, blocking loading HUDs, alert dialogs, and data-driven modal cards presented from anywhere without the component owning presentation. Native SwiftUI (.alert/.confirmationDialog/.overlay + a ref-counted loading + data-driven .sheet) by default; an optional project-supplied overlay center when figma-config declares one. Reach for this when a design shows a toast/snackbar, a spinner/HUD, an alert, or a modal card, or when giving post-action feedback (saved/deleted/error) from a view model."
+user-invocable: true
+allowed-tools: Read, Glob, Grep
+status: wip-v5
+sourced-from: upstream/figma-overlays
+---
+
+# /figma-overlays  -  Overlay Pattern Integration
+
+## Purpose
+
+Consumed by the figma-to-swiftui pipeline (Phase 3D detection, Phase 4B view) and available ad-hoc, this skill defines how transient/blocking UI is presented **without a component owning the presentation surface**. Overlays counterpart of `/figma-form-integration` / `/figma-price-integration`: native-SwiftUI default + a config-driven hook for projects that ship an overlay center.
+
+Four channels: **toast** (transient, non-blocking), **loading** (blocking HUD), **alert** (blocking dialog), **modal** (data-driven card). Rich/interactive content is a local view-modifier, never routed as an erased view.
+
+**Generic by design.** Default is stock SwiftUI. If `figma-config.json` declares `ui.overlaySystem`, route through that DI'd center by name instead  -  same rules, project vocabulary.
+
+---
+
+## Strict Rules (non-negotiable)
+
+1. **A component does not present its own app-level overlays.** A reusable component emits an intent (`onSaved`, `output: .removed`) or exposes state; the **caller** (scene/VM/coordinator) shows the toast/alert/modal. A component owning a global toast/alert makes it un-reusable and double-fires when composed.
+2. **Overlay requests are pure data, not erased views.** Toast/alert/modal content is a value (title, style, actions), mapped to a design-system view at the host. **Never** pass `AnyView` through an overlay center. Rich/interactive content uses a **local** `.modal/.sheet { }` view modifier declared at the owning view.
+3. **Loading is ref-counted with a min-show.** Pair every begin with an end (or use a `withLoading { }` wrapper); enforce a ~300ms minimum visible so it doesn't flash. Never leave a HUD un-ended on an error path.
+4. **Presentable from non-view code.** Post-action feedback originates in a VM/coordinator; the overlay API must be callable there (a DI'd center or a bound state), not only from SwiftUI `body`.
+5. **Native SwiftUI is the default; a custom center is opt-in via config.** Only use a project overlay center when `ui.overlaySystem.mode == "custom"`.
+
+---
+
+## When to Invoke This Skill
+
+1. **Phase 3D  -  overlay affordance/pattern:** the design shows a toast/snackbar, a spinner/HUD or blocking dim, an alert dialog (1-3 buttons), or a data-driven modal card; or a component action needs post-action feedback.
+2. **Phase 4B  -  View:** the view triggers feedback after an action, or renders a dim/HUD/alert/modal.
+3. **Ad-hoc:** "show a confirmation", "flash a message", "block the screen while loading", "pop a dialog", "feedback after save".
+
+**Not an overlay (guards):**
+- A bottom sheet / half-sheet / drawer *surface* → `/figma-bottom-sheets`.
+- Screen-to-screen routing / tabs / deep links → `/figma-navigation`.
+- An inline banner that is part of the component's own layout (not app-level, not dismissible-over-content) → plain component content.
+
+---
+
+## Native-first architecture (default)
+
+```
+Scene / VM (caller)
+    |  owns overlay state, calls after an action
+    v
+SwiftUI presentation modifiers on the scene root:
+  toast    → .overlay(alignment:) of a transient message view + auto-dismiss task
+  loading  → a ref-counted @Observable LoadingState → dim + ProgressView, min-show
+  alert    → .alert(_:isPresented:) / .confirmationDialog (roles: cancel/destructive/default)
+  modal    → .sheet(item:) driven by an Identifiable data value → host maps data → card
+  rich     → local .sheet/.fullScreenCover { InteractiveContent() } at the owning view
+```
+
+- **Toast:** newest-replaces (single visible), `hug`≈2s / `fill`≈5s auto-dismiss; anchor above any bottom bar. Model as a small value + an `.overlay`.
+- **Loading:** an observable counter (`begin`/`end`, `withLoading`) with min-show; dim + `ProgressView`.
+- **Alert:** native `.alert` / `.confirmationDialog` with proper button roles; data-driven.
+- **Modal card:** `.sheet(item:)` with an `Identifiable` request value; the host builds the design-system card from data (no `AnyView`).
+- **Over a bottom sheet:** mount the toast/HUD host on the sheet's own content (a root-level host sits *behind* a presented sheet).
+
+Tokens per `reference/ui` + figma-config token patterns; no literals.
+
+## Config hook  -  project-supplied overlay center
+
+When `figma-config.json` declares:
+```jsonc
+"ui": { "overlaySystem": {
+  "mode": "custom",
+  "center": "OverlayCenter",       // DI'd protocol callable from VM/coordinator
+  "surfaces": ["root", "currentScene"]  // independent render surfaces (optional)
+}}
+```
+apply the SAME rules via the project's center (names from config, do NOT hardcode):
+- Inject `any {center}` (with a Noop default for previews/tests); call `.toast/.withLoading/.alert/.modal` from the VM.
+- Keep the center **UI-framework-free**: it stores data; a host maps data → design-system component. If you reach for `AnyView`, use a local `.modal { }` view modifier instead.
+- Choose the surface from the caller's context (`root` vs `currentScene`); over-a-sheet fires on `currentScene`.
+
+If `mode` is absent or `native`, use the native-first section.
+
+---
+
+## Integration with Phase 3D
+
+Record overlays in `04b_component_architecture.md` as **caller intents**, not component-owned UI:
+
+```markdown
+## Overlays
+| Trigger | Channel | Owner | Note |
+|---|---|---|---|
+| Row "Sil" tapped | alert (confirm) | caller | component emits .removeRequested(id) |
+| Save succeeded | toast (success) | caller VM | component emits .saved |
+| Async fetch | loading HUD | caller VM | withLoading around the call |
+```
+
+Property classification addition:
+
+| Classification | When | Swift Pattern |
+|---|---|---|
+| Overlay intent | Component action needs app-level feedback/confirm | `output`/`onX` closure on the View (caller shows the overlay) |
+| Local rich modal | Interactive content owned by this view | local `.sheet/.modal { }` at the owning view, caller state |
+
+## Integration with Phase 4B
+- Never present an app-level toast/alert/modal from inside a reusable component  -  emit the intent.
+- Use native `.alert`/`.confirmationDialog` for 1-3 button dialogs; `.sheet(item:)` for data modal cards.
+- Ref-count loading; guarantee `end` on all paths; min-show to avoid flash.
+- If `ui.overlaySystem.mode == custom`, inject and call `{center}`; keep it data-only.
+- Verify on the simulator: toast above the bottom bar, HUD min-show, alert roles, data modal, overlays over a sheet.
+
+---
+
+## When NOT to Use Overlay Integration
+- Bottom-sheet surface → `/figma-bottom-sheets`. Routing/tabs/deep links → `/figma-navigation`.
+- A static inline banner that is part of the component layout → plain content.
+- Form validation error shown inline on a field → `/figma-form-integration` (field state), not an overlay.
+
+## Checklist  -  Before Leaving the Skill
+```
+[ ] Reusable component emits intent/state; caller owns the overlay (no self-presentation)
+[ ] Overlay content is data, not AnyView; rich content uses a local .sheet/.modal { }
+[ ] Loading is ref-counted with min-show; end guaranteed on error paths
+[ ] Alerts use native roles (cancel/destructive/default) unless a design card is required
+[ ] Default native SwiftUI; custom center only when figma-config ui.overlaySystem.mode == custom
+[ ] Over-a-sheet feedback mounts on the sheet's content surface, not the root
+```

package/pipeline/skills/figma-common/figma-price-integration/SKILL.md

@@ -7,7 +7,7 @@ status: wip-v5
 sourced-from: upstream/figma-price-integration
 ---
 
-# /figma-price-integration — Price Pattern Integration
+# /figma-price-integration  -  Price Pattern Integration
 
 ## Purpose
 
@@ -24,9 +24,9 @@ It is also **user-invocable** for vibe-coding / ad-hoc work: whenever you are wi
    - An `AttributedString` / `CurrencyTextRenderer` inline price inside surrounding text.
    - Any nested `Price` sub-component detected in Figma.
    If you see either of those two cases → PriceRepresentable, always.
-2. **Price belongs in Configuration, not View — if a Configuration exists.** When the component has a Configuration struct, the nested `Price: PriceRepresentable` type MUST be declared inside Configuration and the `price` property MUST live on Configuration. Only components with NO Configuration may nest `Price` inside the View.
+2. **Price belongs in Configuration, not View  -  if a Configuration exists.** When the component has a Configuration struct, the nested `Price: PriceRepresentable` type MUST be declared inside Configuration and the `price` property MUST live on Configuration. Only components with NO Configuration may nest `Price` inside the View.
 3. **The View never owns price data.** It reads `configuration.price` and renders. No raw amount/currency properties on the View when a Configuration exists.
-4. **Nested `Price` mirrors the design exactly.** The nested `Price` type declares ONLY the protocol properties the component actually uses — do not include fields the design doesn't render, and do not drop fields the design does render. The struct's shape is dictated by the design, not by developer convenience or a shared/generic price model.
+4. **Nested `Price` mirrors the design exactly.** The nested `Price` type declares ONLY the protocol properties the component actually uses  -  do not include fields the design doesn't render, and do not drop fields the design does render. The struct's shape is dictated by the design, not by developer convenience or a shared/generic price model.
 
 ---
 
@@ -34,10 +34,10 @@ It is also **user-invocable** for vibe-coding / ad-hoc work: whenever you are wi
 
 Invoke when ANY of these are detected:
 
-1. **Phase 3D — Layer Text Classification (section 1.5.1):** A currency code + numeric amount pair (e.g., "TRY" + "10.000")
-2. **Phase 3D — Sub-Component Integration (section 2.2):** A nested `Price` component instance
-3. **Phase 4A — Configuration:** A property group contains price-related fields (amount, currency, originalAmount, etc.)
-4. **Phase 4B — View:** The view renders price data using `Price`, `CurrencyTextRenderer`, or similar
+1. **Phase 3D  -  Layer Text Classification (section 1.5.1):** A currency code + numeric amount pair (e.g., "TRY" + "10.000")
+2. **Phase 3D  -  Sub-Component Integration (section 2.2):** A nested `Price` component instance
+3. **Phase 4A  -  Configuration:** A property group contains price-related fields (amount, currency, originalAmount, etc.)
+4. **Phase 4B  -  View:** The view renders price data using `Price`, `CurrencyTextRenderer`, or similar
 
 ---
 
@@ -100,7 +100,7 @@ public enum PriceSign: String, Sendable, Equatable {
 
 ## How to Create a Component-Specific Model
 
-**Rule: Each component defines its own nested `.Price` type conforming to `PriceRepresentable`.** The nested type exposes ONLY the properties that component accepts — no silent discard of unused props.
+**Rule: Each component defines its own nested `.Price` type conforming to `PriceRepresentable`.** The nested type exposes ONLY the properties that component accepts  -  no silent discard of unused props.
 
 ### Step 1: Determine Which Properties the Component Needs
 
@@ -119,11 +119,11 @@ From the Figma design, identify which price features are used:
 
 ### Step 2: Define the Nested Type
 
-**If the component has a Configuration struct (default case):** Nest inside Configuration. The `price` property lives on Configuration, never on the View. This is strict — see Rule 2.
+**If the component has a Configuration struct (default case):** Nest inside Configuration. The `price` property lives on Configuration, never on the View. This is strict  -  see Rule 2.
 
 ```swift
 public struct SomeCardConfiguration: Sendable {
-    // Nested price model — only amount + currency needed
+    // Nested price model  -  only amount + currency needed
     public struct Price: PriceRepresentable {
         public let amount: Double
         public let currency: String
@@ -161,7 +161,7 @@ public struct SomeBadge: View {
 
 ### Step 3: Use in the View
 
-**Option A — Full Price view (standalone price display):**
+**Option A  -  Full Price view (standalone price display):**
 
 ```swift
 Price(price)          // init(_ price: some PriceRepresentable)
@@ -169,10 +169,10 @@ Price(price)          // init(_ price: some PriceRepresentable)
     .line(.single)
 ```
 
-**Option B — Inline price in attributed text (price + surrounding text):**
+**Option B  -  Inline price in attributed text (price + surrounding text):**
 
 Use when price appears within a text sentence (e.g., "TRY 10.000 dan başlayan fiyatlarla").
-The price is NOT a standalone view — it's a styled segment inside an `AttributedString`.
+The price is NOT a standalone view  -  it's a styled segment inside an `AttributedString`.
 
 ```swift
 // 1. Template from localization: "%@ dan başlayan fiyatlarla"
@@ -192,10 +192,10 @@ Text(template.format(priceAttr))
 ```
 
 **This pattern must be explicitly identified during Phase 3D analysis (section 1.5.1b).**
-Check the Figma layer structure — if the price and surrounding text are in the same text layer
+Check the Figma layer structure  -  if the price and surrounding text are in the same text layer
 with different font styles, it's inline attributed text, NOT a standalone Price view + separate Text.
 
-**Option C — CurrencyTextRenderer (standalone inline price without surrounding text):**
+**Option C  -  CurrencyTextRenderer (standalone inline price without surrounding text):**
 
 ```swift
 let config = price.toConfiguration()
@@ -213,7 +213,7 @@ let attributed = CurrencyTextRenderer.attributedString(
 Text(attributed)
 ```
 
-**Option D — Direct formatted amount (custom rendering):**
+**Option D  -  Direct formatted amount (custom rendering):**
 
 ```swift
 let config = price.toConfiguration()
@@ -226,19 +226,19 @@ let config = price.toConfiguration()
 ## Configuration vs Style Separation
 
 **In the PriceRepresentable model (semantic/data):**
-- `sign` — backend says refund/charge
-- `milesDisplay` — business rule
-- `showPrimaryMil` — miles-only pricing
-- `hideCurrency` — miles-only mode
-- `showLeadingText` — contextual label
+- `sign`  -  backend says refund/charge
+- `milesDisplay`  -  business rule
+- `showPrimaryMil`  -  miles-only pricing
+- `hideCurrency`  -  miles-only mode
+- `showLeadingText`  -  contextual label
 
 **NOT in the model (visual, set via view modifiers):**
-- `size` — parent component decides
-- `alignment` — layout concern
-- `line` (single/double) — layout concern
+- `size`  -  parent component decides
+- `alignment`  -  layout concern
+- `line` (single/double)  -  layout concern
 
 **Auto-resolved (not in model):**
-- `currencyPlacement` — derived from `CurrencyFormatProvider` per currency code
+- `currencyPlacement`  -  derived from `CurrencyFormatProvider` per currency code
 
 ---
 
@@ -269,7 +269,7 @@ In the Sub-Components section:
 
 | Element | Scope | Integration |
 |---------|-------|-------------|
-| Price | {Optional/Required} | `PriceRepresentable` — nested `Price` struct with {list fields} |
+| Price | {Optional/Required} | `PriceRepresentable`  -  nested `Price` struct with {list fields} |
 ```
 
 In the Final API Design:
@@ -296,7 +296,7 @@ When writing the Configuration struct for a COMPLEX component that contains pric
 1. Define the nested `Price: PriceRepresentable` struct inside the Configuration
 2. Only include the properties identified in Phase 3D analysis
 3. The price property is `Price?` if the price section is boolean-gated, `Price` if always present
-4. Do NOT flatten price fields into the Configuration — keep them grouped in the nested type
+4. Do NOT flatten price fields into the Configuration  -  keep them grouped in the nested type
 
 ```swift
 @GenerateChainModifiers
@@ -365,8 +365,8 @@ if let price = configuration.price {
 ## When NOT to Use PriceRepresentable
 
 - **Static price labels** with no real data binding (e.g., placeholder text in a design mockup)
-- **Non-currency numeric amounts** (counts, percentages, scores) — these are plain `Int`/`Double`/`String`
-- **Price data that is purely a display string** from the backend with no formatting needed — use `String` directly
+- **Non-currency numeric amounts** (counts, percentages, scores)  -  these are plain `Int`/`Double`/`String`
+- **Price data that is purely a display string** from the backend with no formatting needed  -  use `String` directly
 
 ---
 
@@ -395,4 +395,4 @@ Price(PriceUIModel(amount: 12810.99, currency: "TRY",
 | Extra baggage charge | `(amount: 200.00, currency: "USD", sign: .negative)` |
 | Miles-only pricing | `(amount: 45000, currency: "TRY", showPrimaryMil: true, hideCurrency: true)` |
 | Money + miles | `(amount: 12810.99, currency: "TRY", milesValue: 2000, milesDisplay: .slash)` |
-| Price badge (lean) | `(amount: 42000, currency: "TRY")` — only 2 fields |
+| Price badge (lean) | `(amount: 42000, currency: "TRY")`  -  only 2 fields |

package/pipeline/skills/figma-common/figma-remote-mcp-auth/SKILL.md

@@ -8,7 +8,7 @@ status: wip-v5
 sourced-from: upstream/figma-remote-mcp-auth
 ---
 
-# /figma-remote-mcp-auth — Figma Remote MCP OAuth Token
+# /figma-remote-mcp-auth  -  Figma Remote MCP OAuth Token
 
 Runs the Figma MCP OAuth flow via browser, exchanges the authorization code for an access token, verifies it, and saves it to macOS Keychain as `FIGMA_MCP_TOKEN`.
 

package/pipeline/skills/figma-common/figma-review/SKILL.md

@@ -1,4 +1,9 @@
-# /figma-review — Interactive Code Review for Figma Components
+---
+name: figma-review
+description: Guided review session for a Figma component implementation. Resolves the component, finds or creates the GitHub issue, shows relevant code, and walks the reviewer through approve/bug/inspect actions.
+---
+
+# /figma-review  -  Interactive Code Review for Figma Components
 
 ## Purpose
 
@@ -12,7 +17,7 @@ Guided review session for a Figma component implementation. Resolves the compone
 
 ```
 /figma-review ModalsTitle
-/figma-review CheckinBoardingPassFlightInfo
+/figma-review MyComponent
 /figma-review 175
 ```
 
@@ -29,7 +34,7 @@ PROJECT_ID      = {github.projectV2Id}
 
 ---
 
-## STEP 0 — Resolve Component
+## STEP 0  -  Resolve Component
 
 ### Determine input type
 
@@ -67,7 +72,7 @@ If no `.swift` file found → HALT: "Component `{ComponentName}` not found in co
 
 ### Find GitHub issue (if input was ComponentName)
 
-**Primary: node-id search (deterministic)** — if the registry has an entry for this component, look up its nodeId and search for issues whose body references that exact string:
+**Primary: node-id search (deterministic)**  -  if the registry has an entry for this component, look up its nodeId and search for issues whose body references that exact string:
 
 ```bash
 # Resolve ComponentName → nodeId via registry
@@ -88,7 +93,7 @@ if [ -n "$NODE_ID" ]; then
 fi
 ```
 
-**Fallback: fuzzy name search** — only if node-id lookup returned nothing (component not in registry, or registry not cloned):
+**Fallback: fuzzy name search**  -  only if node-id lookup returned nothing (component not in registry, or registry not cloned):
 
 ```bash
 gh issue list --repo ${GH_REPO} --state open --label component --search "{ComponentName}" --json number,title,body,labels,state
@@ -105,8 +110,8 @@ No open issue found for {ComponentName}.
 2. Continue without issue
 ```
 
-- If "1": run the same flow as `/figma-issue open` — registry lookup, create issue, add to board. Then continue.
-- If "2": continue review without issue tracking (no labels, no sub-issues — just code inspection).
+- If "1": run the same flow as `/figma-issue open`  -  registry lookup, create issue, add to board. Then continue.
+- If "2": continue review without issue tracking (no labels, no sub-issues  -  just code inspection).
 
 ### Extract issue metadata
 
@@ -118,9 +123,9 @@ From the issue body:
 
 ---
 
-## STEP 1 — Show Review Context
+## STEP 1  -  Show Review Context
 
-## STEP 2 — Review Menu
+## STEP 2  -  Review Menu
 
 Print the full review context AND the menu **together in a single output block**, then STOP. Wait for user's response.
 
@@ -128,7 +133,7 @@ Print the full review context AND the menu **together in a single output block**
 ═══════════════════════════════════════════════
   REVIEW: {ComponentName}
 ═══════════════════════════════════════════════
-  Issue:    #{N} — {title}
+  Issue:    #{N}  -  {title}
   Jira:     {JIRA_KEY or "none"}
   Phase:    {current phase from labels}
   Review:   {X/4 from label or "not started"}
@@ -155,7 +160,7 @@ What would you like to do?
 6. Done (exit review)
 ```
 
-### Action: `1` — Open in Xcode
+### Action: `1`  -  Open in Xcode
 
 Find the component's Swift file using Glob, then open it:
 
@@ -165,7 +170,7 @@ open -a Xcode "<resolved_path>"
 
 Return to menu.
 
-### Action: `2` — Open in Xcode + Figma
+### Action: `2`  -  Open in Xcode + Figma
 
 1. Open the Swift file in Xcode (same as Action 1):
 ```bash
@@ -187,7 +192,7 @@ fi
 
 Return to menu.
 
-### Action: `3` — Approve
+### Action: `3`  -  Approve
 
 1. Get current reviewer's GitHub username:
 ```bash
@@ -223,7 +228,7 @@ Print: "Approved. Review status: {APPROVED}/4"
 
 Return to menu.
 
-### Action: `4` — Open bug
+### Action: `4`  -  Open bug
 
 Print and STOP:
 
@@ -233,13 +238,13 @@ Describe the bug:
 
 Wait for user's response. Capture as `BUG_DESCRIPTION`.
 
-Then ask via **AskUserQuestion** (discrete options only — no free text):
+Then ask via **AskUserQuestion** (discrete options only  -  no free text):
 
 ```
 Question: "Bug severity?"
 Options:
-  - label: "Minor"  description: "Cosmetic, non-blocking — label bug-minor"
-  - label: "Major"  description: "Functional issue, must fix — label bug-major"
+  - label: "Minor"  description: "Cosmetic, non-blocking  -  label bug-minor"
+  - label: "Major"  description: "Functional issue, must fix  -  label bug-major"
 ```
 
 The answer drives a label, not a free-text comparison. Map:
@@ -308,7 +313,7 @@ Print: "Bug #M created and linked to #N."
 
 Return to menu.
 
-### Action: `5` — Status
+### Action: `5`  -  Status
 
 Show detailed review progress:
 
@@ -316,17 +321,17 @@ Show detailed review progress:
 Review Status: {ComponentName} (#N)
 
 Approvals: {COUNT}/4
-  ✅ @reviewer1 — approved 2026-03-22
-  ✅ @reviewer2 — approved 2026-03-22
+  ✅ @reviewer1  -  approved 2026-03-22
+  ✅ @reviewer2  -  approved 2026-03-22
   ⬜ @reviewer3
   ⬜ @reviewer4
 
 Open Bugs: {COUNT}
-  🔴 #108 — dark mode text color wrong (Major)
-  🟡 #109 — RTL padding missing (Minor)
+  🔴 #108  -  dark mode text color wrong (Major)
+  🟡 #109  -  RTL padding missing (Minor)
 
 Closed Bugs: {COUNT}
-  ✅ #110 — wrong font token (fixed)
+  ✅ #110  -  wrong font token (fixed)
 ```
 
 Fetch sub-issues:
@@ -336,7 +341,7 @@ gh api graphql -f query='{ repository(owner: "{github.org}", name: "{project.slu
 
 Return to menu.
 
-### Action: `6` — Done
+### Action: `6`  -  Done
 
 Print: "Review session ended." Exit.
 
@@ -351,7 +356,7 @@ When STEP 1 detects no `### Review` section in the issue body:
 gh api user --jq '.login'
 ```
 
-2. Add them as the first reviewer, **unchecked** (pending — they must use Action 3 to formally approve):
+2. Add them as the first reviewer, **unchecked** (pending  -  they must use Action 3 to formally approve):
 
 ```markdown
 ### Review
@@ -372,7 +377,7 @@ You've been added as reviewer (@{current_username}). Review requires 4 approvals
 Other reviewers can be added via the GitHub issue or by running /figma-review.
 ```
 
-6. Continue to STEP 2 (review menu) — no need to stop again.
+6. Continue to STEP 2 (review menu)  -  no need to stop again.
 
 ---
 

package/pipeline/skills/figma-common/figma-setup/SKILL.md

@@ -8,7 +8,7 @@ status: wip-v5
 sourced-from: upstream/figma-setup
 ---
 
-# /figma-setup — Environment Setup
+# /figma-setup  -  Environment Setup
 
 One-time environment setup for the Figma-to-SwiftUI workflow. Run before your first `/figma` invocation, or when `/figma` reports missing prerequisites.
 
@@ -147,7 +147,7 @@ else:
 - If output starts with `figu_` → valid OAuth token
 - If `EXTRACT_FAILED` → Claude Code has no figma-remote credentials
 
-#### 3b-c. If extraction succeeded — save to keychain
+#### 3b-c. If extraction succeeded  -  save to keychain
 
 ```bash
 TOKEN="<extracted_token>" && "$HOME/.claude/lib/credential-store.sh" set \1 \"\2\" >/dev/null 2>&1 && echo "MCP_TOKEN_STORED" || echo "MCP_TOKEN_STORE_FAILED"
@@ -189,7 +189,7 @@ Record as `skipped`. Scripts will fall back to extracting at runtime (slower but
 "$HOME/.claude/lib/credential-store.sh" get \1 >/dev/null 2>&1 && echo "TOKEN_EXISTS" || echo "TOKEN_MISSING"
 ```
 
-#### 4b. If TOKEN_EXISTS — verify it works
+#### 4b. If TOKEN_EXISTS  -  verify it works
 
 ```bash
 curl -s -o /dev/null -w "%{http_code}" -H "X-Figma-Token: $("$HOME/.claude/lib/credential-store.sh" get \1 2>/dev/null)" "https://api.figma.com/v1/me"
@@ -199,7 +199,7 @@ curl -s -o /dev/null -w "%{http_code}" -H "X-Figma-Token: $("$HOME/.claude/lib/c
 - `403` → token expired or revoked, proceed to 4c
 - Other → network issue, retry
 
-#### 4c. If TOKEN_MISSING or expired — secure setup
+#### 4c. If TOKEN_MISSING or expired  -  secure setup
 
 Tell the user:
 
@@ -260,7 +260,7 @@ npx @figma/code-connect@latest --version 2>/dev/null
 > - Download from https://nodejs.org/ (LTS recommended)
 > - Or: `brew install node`
 >
-> Code Connect uses `npx` — no global install needed.
+> Code Connect uses `npx`  -  no global install needed.
 
 Ask: "Confirm when Node.js is installed, or say 'skip'."
 
@@ -333,7 +333,7 @@ If `INSUFFICIENT_SCOPES` error mentioning `project`:
 "$HOME/.claude/lib/credential-store.sh" get \1 >/dev/null 2>&1 && echo "TOKEN_EXISTS" || echo "TOKEN_MISSING"
 ```
 
-#### 9a. If TOKEN_EXISTS — verify
+#### 9a. If TOKEN_EXISTS  -  verify
 
 ```bash
 curl -s -o /dev/null -w "%{http_code}" "{jira.baseUrl}/rest/api/2/myself" \
@@ -379,7 +379,7 @@ Same flow as CHECK 9 but for Confluence:
 - Verify: `curl -s -o /dev/null -w "%{http_code}" "{confluence.baseUrl}/rest/api/content?limit=1" -H "Authorization: Bearer ..."`
 - If missing: guide user to create PAT at `{confluence.baseUrl}`
 - Clipboard flow, same as Jira
-- VPN required — if not connected, record as `skipped (no VPN)`
+- VPN required  -  if not connected, record as `skipped (no VPN)`
 
 ---
 
@@ -410,19 +410,19 @@ After all checks complete, create `{repos.packagesContainer}/{repos.artifactsRep
 
 ## Token Management
 
-### `retrieve-token` — Retrieve Remote MCP OAuth Token
+### `retrieve-token`  -  Retrieve Remote MCP OAuth Token
 
 Looks up the Figma remote MCP OAuth token (`figu_` prefix) and prints it for the user.
 
 **Resolution order:**
 
-1. **Keychain `FIGMA_MCP_TOKEN`** — the dedicated keychain entry saved by `save-token` or CHECK 3b.
+1. **Keychain `FIGMA_MCP_TOKEN`**  -  the dedicated keychain entry saved by `save-token` or CHECK 3b.
 
 ```bash
 "$HOME/.claude/lib/credential-store.sh" get \1 2>/dev/null
 ```
 
-2. **Claude Code credentials** — if not in dedicated keychain, extract from Claude Code's credential store.
+2. **Claude Code credentials**  -  if not in dedicated keychain, extract from Claude Code's credential store.
 
 ```bash
 python3 -c "
@@ -444,7 +444,7 @@ print(match.group(1) if match else 'NOT_FOUND')
 
 ---
 
-### `save-token` — Save Remote MCP OAuth Token to Keychain
+### `save-token`  -  Save Remote MCP OAuth Token to Keychain
 
 Saves a provided token (or extracts from Claude Code credentials) to the dedicated `FIGMA_MCP_TOKEN` keychain entry so scripts can use it.
 

package/pipeline/skills/figma-common/figma-setup/scripts/fetch-mcp-token.py

@@ -4,11 +4,11 @@ Figma Remote MCP Token Fetcher
 
 Retrieves or refreshes a Figma MCP OAuth token. Three modes:
 
-MODE 1 — Extract (default):
+MODE 1  -  Extract (default):
     Reads existing token from Keychain or Claude Code credentials.
     python3 fetch-mcp-token.py
 
-MODE 2 — OAuth (--oauth):
+MODE 2  -  OAuth (--oauth):
     Runs full OAuth flow. Opens browser for Figma consent, runs local
     callback server, exchanges code for token. Works from ANY terminal.
     python3 fetch-mcp-token.py --oauth --client-id X --client-secret Y --save-keychain
@@ -354,7 +354,7 @@ def run_oauth_flow(client_id, client_secret, port):
         return None
 
     if OAuthCallbackHandler.auth_state != state:
-        log("State mismatch — possible CSRF.")
+        log("State mismatch  -  possible CSRF.")
         return None
 
     auth_code = OAuthCallbackHandler.auth_code
@@ -530,7 +530,7 @@ def main():
             if not args.quiet:
                 log("Token is VALID.")
         else:
-            # Token invalid — try auto-refresh before giving up
+            # Token invalid  -  try auto-refresh before giving up
             if not args.quiet:
                 log("Token is INVALID or EXPIRED. Attempting auto-refresh...")
             refresh_tok = get_refresh_token_from_keychain()
@@ -564,7 +564,7 @@ def main():
                                 log(f"Updated Keychain '{KEYCHAIN_SERVICE}'.")
                     else:
                         if not args.quiet:
-                            log("Refresh failed — token or credentials expired.")
+                            log("Refresh failed  -  token or credentials expired.")
                 else:
                     if not args.quiet:
                         log("No client credentials available for refresh.")