generating-fragment

Generate reusable Salesforce UI fragments with UEM tree structures and TypeScript interfaces.

Updated Apr 19, 2026
One-click install
npx skills add https://github.com/cchrisv/professorFlowVisualPicker --skill generating-fragment
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: generating-fragment
Source: https://github.com/cchrisv/professorFlowVisualPicker/tree/main/.agents/skills/generating-fragment
Command: npx skills add https://github.com/cchrisv/professorFlowVisualPicker --skill generating-fragment

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Fragments are reusable pieces of UI for Salesforce experiences that enable consistent rendering and faster delivery, but creating and editing them manually can be error-prone and time-consuming.

Core Features & Use Cases

  • Fragment-driven UI: Define a fragment as a UEM tree of blocks and regions that can render across Slack, Mobile, and LEX.
  • Guided composition: Use the built-in workflow to assemble blocks into regions following TypeScript interfaces for blocks and regions.
  • Schema-aware editing: Leverage block discovery and schemas to configure attributes correctly before rendering.
  • End-to-end fragment workflows: Generate, validate, and export fragments for multiple Salesforce experiences from a single source of truth.

Quick Start

Create a reusable UI fragment by selecting blocks, defining regions, and exporting a UEM-compliant fragment.

Frequently Asked Questions about generating-fragment

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create reusable Salesforce UI fragments for multiple experiences?

Salesforce UI fragments are created by assembling a Unified Experience Model tree of blocks and regions, which can then render consistently across Slack, Mobile, and LUX platforms.

What is the Unified Experience Model tree structure for fragment generation?

The Unified Experience Model (UEM) tree structure defines fragments using a hierarchy of blocks and regions, enforcing TypeScript interface conformance to ensure valid component composition before rendering.

How do I generate Salesforce metadata for UI components without manual errors?

You generate Salesforce metadata by using schema-aware editing and block discovery to configure component attributes correctly, validating against schemas before exporting the fragment.

Can I use Salesforce fragments across Slack, Mobile, and LEX from a single source?

Yes, fragments defined as a UEM tree can be generated, validated, and exported as a single source of truth to render across Slack, Mobile, and LEX experiences.

How do I validate blocks and regions when building a Salesforce fragment?

Validation is enforced by checking the assembled blocks and regions against TypeScript interfaces and block schemas to ensure correct attribute configuration before the fragment is rendered.

What are the limitations of manual fragment editing in Salesforce experiences?

Manual fragment editing is time-consuming and error-prone, lacking the guided composition and schema validation needed to correctly enforce UEM tree structures across multiple platforms.