health-cloud-lwc-components
Use this skill when building custom LWC components for Health Cloud: extending patient card configurations, building custom timeline components using TimelineObjectDefinition metadata, creating care plan visualizations, and surfacing clinical data via LWC. NOT for standard LWC development unrelated to Health Cloud clinical components, or OmniStudio FlexCard development.
Best use case
health-cloud-lwc-components is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Use this skill when building custom LWC components for Health Cloud: extending patient card configurations, building custom timeline components using TimelineObjectDefinition metadata, creating care plan visualizations, and surfacing clinical data via LWC. NOT for standard LWC development unrelated to Health Cloud clinical components, or OmniStudio FlexCard development.
Teams using health-cloud-lwc-components should expect a more consistent output, faster repeated execution, less prompt rewriting, better workflow continuity with your supporting tools.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
- You already have the supporting tools or dependencies needed by this skill.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/health-cloud-lwc-components/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How health-cloud-lwc-components Compares
| Feature / Agent | health-cloud-lwc-components | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Use this skill when building custom LWC components for Health Cloud: extending patient card configurations, building custom timeline components using TimelineObjectDefinition metadata, creating care plan visualizations, and surfacing clinical data via LWC. NOT for standard LWC development unrelated to Health Cloud clinical components, or OmniStudio FlexCard development.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
# Health Cloud LWC Components
Use this skill when building custom LWC components for Health Cloud: adding clinical fields to the patient card via Health Cloud Setup, configuring the Industries Timeline with custom object entries via TimelineObjectDefinition metadata, and building custom LWCs that query Health Cloud clinical data objects. This skill covers Health Cloud-specific component extension patterns. It does NOT cover standard LWC development for non-Health Cloud use cases, OmniStudio FlexCard development, or general Lightning App Builder component placement.
---
## Before Starting
Gather this context before working on anything in this domain:
- Confirm whether the org uses the **legacy Health Cloud managed-package timeline** or the **Industries Timeline** (backed by TimelineObjectDefinition). These are different components with different configuration mechanisms. The legacy managed-package timeline is deprecated in favor of the Industries Timeline.
- Understand that the Patient Card component (`healthCloudUtility:patientCard`) is NOT extensible via Lightning App Builder slot injection or standard child component override. Clinical field additions to the patient card must go through Health Cloud Setup > Patient Card Configuration, not standard App Builder drag-and-drop.
- Know that custom LWCs surfacing clinical data must query Health Cloud clinical objects (HealthCondition, ClinicalEncounter, EhrPatientMedication, etc.) using the Account lookup relationship. Clinical data is stored on clinical objects linked to the patient Account — NOT in custom fields on Account or Contact. Custom Account/Contact fields are invisible to all Health Cloud clinical UI components.
---
## Core Concepts
### Patient Card Extension via Health Cloud Setup (Not App Builder)
The Health Cloud Patient Card component cannot be extended via Lightning App Builder slot injection, child component override, or standard Lightning component composition. Adding new clinical fields to the patient card requires:
1. Navigate to Health Cloud Setup > Patient Card Configuration.
2. Add the clinical field from the appropriate object (must be an object with a lookup to the patient Account).
3. Save the configuration.
Attempting to extend the patient card by placing a child LWC inside it via App Builder will not work — the component does not support child slots in the Lightning App Builder.
### Industries Timeline vs. Legacy HC Package Timeline
Health Cloud ships two timeline components with different configuration mechanisms:
**Industries Timeline (recommended):**
- Configured via `TimelineObjectDefinition` metadata type (API v55.0+)
- Configured in Setup as a declarative JSON definition on the `TimelineObjectDefinition` metadata
- Supports any object related to the patient Account
- Receives ongoing Salesforce investment
- Category-based filtering in the timeline UI
**Legacy HC Package Timeline:**
- Deprecated — no new Salesforce investment
- Configured via custom metadata in the HC managed package
- Orgs still using the legacy component must plan migration to the Industries Timeline
- Different configuration mechanism from Industries Timeline; changes to one do not apply to the other
Use the Industries Timeline for all new development. Document the migration plan from legacy timeline to Industries Timeline if the org currently uses the legacy component.
### Clinical Data via Account Lookups (Not Account/Contact Fields)
Custom LWCs that need to display clinical data must query Health Cloud clinical objects using their Account lookup:
- `HealthCondition` where `PatientId = :accountId`
- `ClinicalEncounter` where `PatientId = :accountId`
- `PatientMedication` where `PatientId = :accountId`
- `CareObservation` where `PatientId = :accountId` (via parent records)
**Critical rule:** Data stored in custom fields on Account or Contact is NOT accessible to Health Cloud clinical UI components. The PatientCard, Timeline, and other Health Cloud components query clinical objects via their standard Account lookup fields. A custom `RecentCondition__c` text field on Account will never appear in clinical components regardless of how it is placed on the page layout.
---
## Common Patterns
### Adding Custom Objects to the Industries Timeline
**When to use:** A custom clinical workflow creates records on a custom sObject (or standard object) that needs to appear on the patient timeline.
**How it works:**
1. Ensure the custom object has an Account lookup field (required for timeline inclusion).
2. Create a `TimelineObjectDefinition` metadata record in Setup.
3. Define the JSON configuration: object API name, date field, title field, subtitle field, icon name, and filter criteria.
4. Save and deploy the metadata.
5. The custom object entries now appear in the Industries Timeline filtered by the configured date field.
```xml
<!-- TimelineObjectDefinition metadata example -->
<TimelineObjectDefinition>
<active>true</active>
<baseObject>ClinicalServiceRequest</baseObject>
<dateField>ReferralDate</dateField>
<iconType>standard:clinical_service_request</iconType>
<label>Referrals</label>
<objectColor>#1589EE</objectColor>
<referenceObjectField>PatientId</referenceObjectField>
</TimelineObjectDefinition>
```
**Why not the alternative:** Manually wiring a custom LWC into the timeline area via page layout defeats the purpose of the Industries Timeline's configurable approach and does not benefit from timeline filtering and categorization.
### Custom LWC for Clinical Data Display
**When to use:** A care coordinator needs to see a summary of recent conditions and encounters on the patient page, beyond what the standard clinical components show.
**How it works:**
1. Define an Apex controller that queries clinical objects with Account lookup:
```apex
@AuraEnabled(cacheable=true)
public static List<HealthCondition> getConditions(Id accountId) {
return [SELECT Id, Name, ConditionSeverity, OnsetDate
FROM HealthCondition
WHERE PatientId = :accountId
ORDER BY OnsetDate DESC LIMIT 10];
}
```
2. In the LWC, retrieve the Account ID from the record context and call the Apex controller.
3. Render the clinical data in the component.
4. Apply appropriate FLS checks in Apex — clinical data is PHI and requires field-level security enforcement.
**Why not the alternative:** Using custom Account fields for clinical summaries means the data is not in the Health Cloud clinical data model and cannot be used by clinical components, reports, or FHIR APIs.
---
## Decision Guidance
| Situation | Recommended Approach | Reason |
|---|---|---|
| Add fields to patient card | Health Cloud Setup > Patient Card Configuration | App Builder slot injection does not work for this component |
| Add custom object to timeline | TimelineObjectDefinition metadata | Declarative; receives platform investment |
| Display clinical data in custom LWC | Query clinical objects via Account lookup | Clinical data is on clinical objects, not Account fields |
| Legacy timeline in org | Plan migration to Industries Timeline | Legacy component is deprecated |
| New timeline entry needed | Industries Timeline + TimelineObjectDefinition | Not legacy HC package timeline configuration |
---
## Recommended Workflow
1. **Identify component type** — determine whether the requirement is: patient card field addition, timeline entry addition, or a net-new custom clinical LWC component. Each follows a different implementation path.
2. **Verify timeline component version** — check which timeline component is active on the patient page (Industries Timeline backed by TimelineObjectDefinition vs. legacy HC package timeline). Confirm the implementation approach for the correct component type.
3. **For patient card additions** — navigate to Health Cloud Setup > Patient Card Configuration. Add the clinical field from the appropriate source object. Test that the field appears on the patient card.
4. **For timeline additions** — create a TimelineObjectDefinition metadata record with the correct object API name, date field, Account lookup field reference, and display configuration. Deploy and test in sandbox.
5. **For custom LWC** — write the Apex controller using Account lookup queries on clinical objects. Implement FLS checks. Build the LWC HTML/JS to display results. Add to page layout and test with a patient record.
6. **Security review** — verify the LWC and Apex enforce FLS for all clinical fields. Clinical data is PHI; HIPAA compliance requires proper field-level security enforcement in all custom code.
---
## Review Checklist
- [ ] Patient card field additions done via Health Cloud Setup (not App Builder)
- [ ] Industries Timeline vs. legacy timeline component confirmed
- [ ] TimelineObjectDefinition metadata created for custom timeline entries
- [ ] Custom LWC queries clinical objects via Account lookup (not Account fields)
- [ ] Apex controller enforces FLS for PHI fields
- [ ] Custom components tested with a real patient record in sandbox
---
## Salesforce-Specific Gotchas
1. **Patient Card cannot be extended via App Builder** — Lightning App Builder slot injection and child component override do not work for the Health Cloud Patient Card component. All patient card field additions must go through Health Cloud Setup > Patient Card Configuration.
2. **Industries Timeline and legacy timeline require different configuration** — changing TimelineObjectDefinition metadata does not affect the legacy HC package timeline. If the org has both components on different pages, they must be configured separately and through different mechanisms.
3. **Clinical data in Account fields is invisible to HC components** — only data stored on clinical objects (HealthCondition, ClinicalEncounter, PatientMedication) with proper Account lookups is accessible to Health Cloud clinical UI components. Custom denormalized summary fields on Account will not be consumed by the PatientCard, Timeline, or related components.
---
## Output Artifacts
| Artifact | Description |
|---|---|
| TimelineObjectDefinition metadata | XML definition for custom object timeline entries |
| Patient card field configuration | Documented fields added via HC Setup > Patient Card Configuration |
| Custom clinical LWC | Component with Apex controller querying clinical objects via Account lookup |
| FLS enforcement pattern | Apex security review checklist for clinical data access in custom components |
---
## Related Skills
- admin/health-cloud-patient-setup — Patient account configuration and patient card baseline setup
- admin/health-cloud-timeline — Timeline configuration and TimelineObjectDefinition overview
- apex/health-cloud-apex-extensions — Apex extension points for Health Cloud managed package callbacksRelated Skills
security-health-check
Use when running, interpreting, or acting on Salesforce Security Health Check results — reading the score, understanding risk categories, evaluating specific settings, creating or importing a custom baseline, querying the Tooling API programmatically, or planning remediation from findings. Triggers: 'security health check score', 'health check failing settings', 'custom baseline', 'remediate health check findings', 'fix risk'. NOT for org hardening implementation, permission model design, or broad baseline config beyond what Health Check directly measures.
experience-cloud-security
Use when configuring access controls, sharing, or site security for authenticated or guest Experience Cloud (community) users: external OWD, Sharing Sets, Share Groups, CSP, clickjack protection, guest user record access. NOT for internal sharing model configuration (use sharing-and-visibility).
lwc-web-components-interop
LWC interop with non-LWC web components: consuming third-party standard custom elements in LWC, exposing LWC as custom elements externally, Shadow DOM vs native web components, polyfills, and slotting patterns. NOT for LWC-to-LWC composition (use lwc-best-practices). NOT for Aura interop (use aura-to-lwc-migration).
lwc-dynamic-components
Dynamic LWC component creation using the `lwc:component` directive, lazy-loaded dynamic imports (`import()`), and runtime component resolution for conditional rendering at scale. Triggers: 'render different components based on record type', 'dynamically load lwc at runtime', 'lwc:component lwc:is constructor', 'lazy load component only when needed', 'dynamic import lwc'. NOT for static component composition or `lwc:if` conditional rendering when the component set is fixed at build time (use lwc-conditional-rendering).
headless-experience-cloud
Use when building custom frontends (React, Vue, mobile, static sites) that consume Salesforce CMS content via the Connect REST API headless delivery endpoint. Triggers: 'headless Salesforce CMS', 'deliver CMS content to external frontend', 'React app Salesforce content API', 'custom frontend Experience Cloud data', 'CMS delivery channel API'. NOT for standard Experience Builder site development. NOT for CMS Connect (3rd-party CMS federation into Experience Builder). NOT for Experience Cloud LWC components rendered inside a site.
experience-cloud-search-customization
Use this skill when configuring or extending search on an Experience Cloud site — covering Search Manager scope configuration, LWR vs Aura search component selection, federated search setup, guest user search access, and custom search result components. NOT for SOSL/SOQL query development. NOT for internal Salesforce global search or Einstein Search for agents.
experience-cloud-multi-idp-sso
Use this skill when configuring multiple identity providers (OIDC and/or SAML) on a single Experience Cloud site or across tenant-specific portals in the same org — covering auth provider registration, Start SSO URL routing, Federation ID mapping, RegistrationHandler implementation, and simultaneous SP+IdP topology. Trigger keywords: multiple identity providers Experience Cloud, multi-tenant SSO community portal, vendor and citizen portal same site, OIDC SAML both on login page, tenant-specific login routing community. NOT for internal Salesforce employee SSO configuration. NOT for single auth provider setups — see experience-cloud-authentication for basic SSO.
experience-cloud-lwc-components
Use when building custom LWC components for Experience Cloud (Experience Builder sites, LWR portals, Aura-based communities). Covers community context imports, guest user Apex access patterns, navigation API differences between LWR and Aura, and JS-meta.xml target configuration for Experience Builder exposure. NOT for internal LWC components deployed to Lightning App Builder or standard record pages (see lwc/lwc-development). NOT for Aura community components. Trigger keywords: build LWC for Experience Cloud, custom component community portal LWC, guest user LWC component, community context import salesforce, lightningCommunity target, @salesforce/community, guest Apex.
experience-cloud-authentication
Use when building custom login pages, social SSO flows, self-registration flows, or passwordless OTP login for Experience Cloud (community) sites. Trigger keywords: custom login page Experience Cloud, social SSO community portal, passwordless login Experience Cloud, self-registration custom flow, headless authentication community, auth provider OIDC SAML site. NOT for internal SSO configuration (use identity/sso skills). NOT for standard username/password authentication with no customization.
experience-cloud-api-access
Use this skill when configuring or troubleshooting API access for Experience Cloud external users and guest users: guest user Apex data access, Customer Community Plus or Partner Community REST/SOAP API access, external user OAuth scopes, and sharing enforcement on API responses. Trigger keywords: Experience Cloud API access external user, community user REST API, guest user API limits, Customer Community API permissions, external user OAuth. NOT for internal Salesforce API authentication, non-community OAuth flows, or internal user API security.
commerce-lwc-components
Use this skill when building or customizing Lightning Web Components for B2B Commerce or D2C LWR storefronts — product display tiles, cart line-item components, checkout step components, wishlist buttons, and product comparison widgets that rely on Commerce Storefront wire adapters from the commerce namespace. NOT for standard LWC development outside a Commerce store context, not for Aura-based Community Builder components, and not for legacy B2B Commerce (CloudCraze) Aura widgets.
net-zero-cloud-setup
Use this skill when configuring Salesforce Net Zero Cloud — including Scope 1/2/3 emission source modeling via the StnryAssetCrbnFtprnt / VehicleAssetCrbnFtprnt / Scope3CrbnFtprnt object families, emission factor library setup (EmssnFctr / EmssnFctrSet), DPE-driven carbon calculation jobs, supplier engagement scoring, and CSRD / ESRS / TCFD disclosure pack mapping. Triggers on: Net Zero Cloud setup, Sustainability Cloud carbon accounting, Scope 1 2 3 emissions Salesforce, emission factor library, supplier engagement Net Zero, ESG disclosure pack mapping. NOT for ESG content scoring (use Marketing Cloud), NOT for general financial reporting (use Accounting Subledger), NOT for energy-only utility billing (use Energy & Utilities Cloud).