Agent skill · forcedotcom
experience-lwc-base-components-integrate
Pick the right Lightning Base Component (`lightning-*`) for a given UI task, retrieve its full API (props, methods, events, slots) from the bundled per-component reference, and wire it into an LWC (LWC `.html`, `.js`, and `.css` files) without breaking SLDS. Use this skill when users say \"I need a Lightning modal / datatable / combobox / record form\", ask which `lightning-*` component fits a use case, want a shortlist of LBC candidates, are about to hand-roll a UI that a base component already provides, or are editing an LWC bundle's `.html` / `.js` / `.css` and need to select or wire a base component. Also triggers on \"Lightning base component\", \"LBC\", \"lightning-combobox\", \"lightning-datatable\", \"use `lightning-` tag\". DO NOT TRIGGER for applying SLDS design tokens, blueprints, or styling guidance in general — that is `design-systems-slds-apply`; this skill only selects and wires `lightning-*` base components.
What it needs
About 5k tokens when loaded.
What this skill does
<!-- adk-managed-skill --> Using Lightning Base Components Lightning Base Components (LBC) are the lightning- web components shipped by Salesforce. This skill routes an agent through the right decision sequence so the final component choice is as specific as possible and backed by real API docs — not a hand-rolled reimplementation of something that already exists. When to Use This Skill User describes a UI need ("searchable dropdown", "record edit form", "modal with footer") and asks which lightning- component fits. User is about to build a primitive (button group, combobox, toast) and should be using LBC instead. User asks you to review LWC markup for LBC-related issues — specifically overriding SLDS classes or restyling LBC internals. User needs the authoritative props/events/slots for a specific lightning- tag. Prerequisites Knowledge of which LBC namespace your org uses (lightning is the default public namespace; some platforms expose lightning-community or others — the user's meta files will clarify). The skill ships authoritative API docs for every Lightning Base Component in references/lightning-components.md. Each component is a # Component API Structure block; grep for Name: <camelCaseName> (e.g. Name: datatable) to jump to its Properties / Methods / Events / Slots. Read this rather than relying on cached knowledge — LBC evolves and the reference is the source of truth. Workflow Step 1 — Read the entire component index first Open lightning-component-index.md and scan all entries before making any selection. This is non-negotiable: LBC's value comes from picking the most specialized component, and skipping the scan leads to reinventing compound widgets out of primitives. As you scan, compile a candidate list — every component whose description touches any aspect of the use case. Do not filter or rank yet. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills forcedotcom/experience-lwc-base-components-integrate--6c4b21