// Lightning Web Components with PICKLES methodology and 165-point scoring. TRIGGER when: user creates/edits LWC components, touches lwc/**/*.js, .html, .css, .js-meta.xml files, or asks about wire service, SLDS, or Jest LWC tests. DO NOT TRIGGER when: Apex classes (use sf-apex), Aura components, or Visualforce.
Use this skill whenever users want to build, inspect, debug, automate, or publish workflows in Agentforce Grid (AI Workbench) using Salesforce plus the Grid MCP or direct Grid REST calls. Trigger it for Grid workbook creation, worksheet setup, Object/Reference/AI/Agent/AgentTest/Evaluation/PromptTemplate/InvocableAction column design, prompt drafting inside Grid, worksheet execution troubleshooting, Grid YAML `apply_grid` specs, and Windows-specific Grid setup issues. Also use it when users mention AI Workbench, Grid Studio, workbook IDs, worksheet IDs, Grid Connect, or ask for recipes like "top opportunities with AI email drafts", "agent test suite in Grid", or "build this worksheet from YAML". Do not use it for generic Salesforce work unrelated to Agentforce Grid.
Agent Script DSL for deterministic Agentforce agents. TRIGGER when: user writes or edits .agent files, builds FSM-based agents, uses Agent Script CLI (sf agent generate authoring-bundle, sf agent validate authoring-bundle, sf agent preview, sf agent publish authoring-bundle, sf agent activate), or asks about deterministic agent patterns, slot filling, or instruction resolution. DO NOT TRIGGER when: Builder metadata work (use sf-ai-agentforce), agent testing (use sf-ai-agentforce-testing), or persona design (use sf-ai-agentforce-persona).
Deep persona design for Agentforce agents with 50-point scoring. TRIGGER when: user designs agent personas, defines agent personality/identity, creates persona documents, encodes persona into Agentforce Builder fields or Agent Script, translates brand guidelines to agent voice, or asks about agent tone/voice/register. DO NOT TRIGGER when: building agent metadata (use sf-ai-agentforce), testing agents (use sf-ai-agentforce-testing), or Agent Script DSL (use sf-ai-agentscript).
Agentforce Builder metadata path for Builder-managed topics/actions, Prompt Builder templates, GenAiFunction/GenAiPlugin, Models API, and custom Lightning types. TRIGGER when: user maintains or configures Builder metadata agents, creates topics/actions, works with Prompt Builder templates, or touches .genAiFunction, .genAiPlugin, or .genAiPromptTemplate metadata XML files. DO NOT TRIGGER when: Agent Script DSL .agent files (use sf-ai-agentscript), agent testing (use sf-ai-agentforce-testing), or persona design (use sf-ai-agentforce-persona).
Agentforce agent testing with dual-track workflow and 100-point scoring. TRIGGER when: user tests Agentforce agents, runs sf agent test commands, creates test specs, validates topic routing, or analyzes agent test coverage. DO NOT TRIGGER when: Apex unit tests (use sf-testing), building agents (use sf-ai-agentforce), or Agent Script DSL (use sf-ai-agentscript).
Agentforce session tracing extraction and analysis. TRIGGER when: user extracts STDM data from Data Cloud, analyzes agent session traces, debugs agent conversations via telemetry, or works with .parquet files from Agentforce. DO NOT TRIGGER when: testing agents (use sf-ai-agentforce-testing), Apex debug logs (use sf-debug), or building agents (use sf-ai-agentforce).
| name | sf-lwc |
| description | Lightning Web Components with PICKLES methodology and 165-point scoring. TRIGGER when: user creates/edits LWC components, touches lwc/**/*.js, .html, .css, .js-meta.xml files, or asks about wire service, SLDS, or Jest LWC tests. DO NOT TRIGGER when: Apex classes (use sf-apex), Aura components, or Visualforce. |
| license | MIT |
| metadata | {"version":"2.1.0","author":"Jag Valaiyapathy","scoring":"165 points across 8 categories (SLDS 2 + Dark Mode compliant)"} |
Use this skill when the user needs Lightning Web Components: LWC bundles, wire patterns, Apex/GraphQL integration, SLDS 2 styling, accessibility, performance work, or Jest unit tests.
Use sf-lwc when the work involves:
lwc/**/*.js, .html, .css, .js-meta.xmlDelegate elsewhere when the user is:
Ask for or infer:
Use the PICKLES mindset:
| Need | Default pattern |
|---|---|
| single-record UI | LDS / getRecord |
| simple CRUD form | base record form components |
| complex server query | Apex @AuraEnabled(cacheable=true) |
| related graph data | GraphQL wire adapter |
| cross-DOM communication | Lightning Message Service |
Use provided assets for:
Check:
Use:
@wire for reactive read-only use cases; imperative calls for explicit actions and DML pathsrenderedCallback()When finishing, report in this order:
Suggested shape:
LWC work: <summary>
Pattern: <wire / apex / graphql / lms / flow-screen>
Files: <paths>
Quality: <a11y, SLDS2, dark mode, Jest>
Next step: <deploy, add controller, or run tests>
Preview LWC components locally with hot reload — no deployment needed:
# Preview LWC components in isolation
sf lightning dev component --target-org <alias>
# Preview a Lightning Experience app locally
sf lightning dev app --target-org <alias>
# Preview an Experience Cloud site locally
sf lightning dev site --target-org <alias>
In current SF CLI releases, these Local Dev commands are installed just-in-time the first time you run them. They are long-running processes that open a browser with live preview. Changes to .js, .html, and .css files auto-reload instantly. Requires an active org connection for data and Apex callouts.
| Need | Delegate to | Reason |
|---|---|---|
| Apex controller or service | sf-apex | backend logic |
| embed in Flow screens | sf-flow | declarative orchestration |
| deploy component bundle | sf-deploy | org rollout |
| create metadata like message channels | sf-metadata | supporting metadata |
| Score | Meaning |
|---|---|
| 150+ | production-ready LWC bundle |
| 125–149 | strong component with minor polish left |
| 100–124 | functional but review recommended |
| < 100 | needs significant improvement |