addressing review feedback, enhancing component knowledge

This commit is contained in:
Ethan Clapham 2026-03-20 09:09:46 -07:00
parent 2c2ab90576
commit de1e6e357f
4 changed files with 184 additions and 17 deletions

View File

@ -188,7 +188,7 @@ npm install -g @salesforce/cli@latest
### Step 2: Deploy Base Page
```bash
sf project deploy start --source-dir force-app/main/default/flexipages
sf project deploy start --dry-run --source-dir force-app/main/default/flexipages
```
**Deploy early, deploy often.** Start with the bootstrapped page, validate it works, then enhance.

View File

@ -1,4 +1,4 @@
# fieldSection
# flexipage:fieldSection
**Use for:** Displaying fields in columns.
@ -7,10 +7,108 @@
2. Column Facets (Facet type)
3. Field Facets (Facet type)
**Critical:** the `columns` property must match the name of the facet where the columns are defined. It is *not* a number.
**Referenced in component property:**
```xml
<componentInstanceProperties>
<name>columns</name>
<value>Facet-{uuid}</value>
</componentInstanceProperties>
<!-- field facet for first column -->
<flexiPageRegions>
<itemInstances>
<fieldInstance>
<fieldInstanceProperties>
<name>uiBehavior</name>
<value>required</value>
</fieldInstanceProperties>
<fieldItem>Record.Field0</fieldItem>
<identifier>RecordColumn1Field0</identifier>
</fieldInstance>
</itemInstances>
<itemInstances>
<fieldInstance>
<fieldInstanceProperties>
<name>uiBehavior</name>
<value>none</value>
</fieldInstanceProperties>
<fieldItem>Record.Field1</fieldItem>
<identifier>RecordColumn1Field1</identifier>
</fieldInstance>
</itemInstances>
<!-- any additional fields in first column -->
<name>Facet-FieldSection-Column1</name>
<type>Facet</type>
</flexiPageRegions>
<!-- field facet for second column -->
<flexiPageRegions>
<itemInstances>
<fieldInstance>
<fieldInstanceProperties>
<name>uiBehavior</name>
<value>none</value>
</fieldInstanceProperties>
<fieldItem>Record.Field2</fieldItem>
<identifier>RecordColumn2Field0</identifier>
</fieldInstance>
</itemInstances>
<itemInstances>
<fieldInstance>
<fieldInstanceProperties>
<name>uiBehavior</name>
<value>none</value>
</fieldInstanceProperties>
<fieldItem>Record.Type</fieldItem>
<identifier>RecordColumn2Field1</identifier>
</fieldInstance>
</itemInstances>
<!-- any additional fields in second column -->
<name>Facet-FieldSection-Column2</name>
<type>Facet</type>
</flexiPageRegions>
<!-- columns facet -->
<flexiPageRegions>
<itemInstances>
<componentInstance>
<componentInstanceProperties>
<name>body</name>
<value>Facet-FieldSection-Column1</value> <!-- matches name of field facet for first column -->
</componentInstanceProperties>
<componentName>flexipage:column</componentName>
<identifier>flexipage_column1</identifier>
</componentInstance>
</itemInstances>
<itemInstances>
<componentInstance>
<componentInstanceProperties>
<name>body</name>
<value>Facet-FieldSection-Column2</value> <!-- matches name of field facet for second column -->
</componentInstanceProperties>
<componentName>flexipage:column</componentName>
<identifier>flexipage_column2</identifier>
</componentInstance>
</itemInstances>
<name>Facet-FieldSection-Columns</name>
<type>Facet</type>
</flexiPageRegions>
<!-- template region -->
<flexiPageRegions>
<itemInstances>
<componentInstance>
<componentInstanceProperties>
<name>columns</name>
<value>Facet-FieldSection-Columns</value> <!-- matches name of columns facet -->
</componentInstanceProperties>
<componentInstanceProperties>
<name>horizontalAlignment</name>
<value>false</value>
</componentInstanceProperties>
<componentInstanceProperties>
<name>label</name>
<value>Information</value>
</componentInstanceProperties>
<componentName>flexipage:fieldSection</componentName>
<identifier>flexipage_fieldSection</identifier>
</componentInstance>
</itemInstances>
<name>main</name>
<type>Region</type>
</flexiPageRegions>
```

View File

@ -1,4 +1,4 @@
# Rich Text Component
# flexipage:richText (Rich Text Component)
**Component name:** `flexipage:richText`
@ -17,10 +17,12 @@
<name>decorate</name>
<value>true</value>
</componentInstanceProperties>
<componentInstanceProperties>
<name>richTextValue</name>
<value>{encoded text goes here}</value>
</componentInstanceProperties>
<componentName>flexipage:richText</componentName>
<identifier>flexipage_richText</identifier>
<identifier>flexipage_richText_{uuid}</identifier>
</componentInstance>
</itemInstances>
```
**Identifier Pattern:** `flexipage_richText` or `flexipage_richText_{sequence}`

View File

@ -1,12 +1,79 @@
# dynamicHighlights (RecordPage Header)
# record_flexipage:dynamicHighlights (RecordPage Header)
**Use for:** Displaying key record information and actions prominently. This component is particularly useful for providing a quick and configurable overview of record details.
**Location:** Must be in `header` region.
**Explicit Fields** (via CLI): Use the most important fields to show a summary of the record. The single primary field is used to identify the record, like a name. The secondary fields (max 12, recommended 6) are used as a summary of the record.
**Explicit Fields:** Use the most important fields to show a summary of the record. The single primary field is used to identify the record, like a name. The secondary fields (max 12, recommended 6) are used as a summary of the record.
```bash
--primary-field Name
--secondary-fields Phone,Industry,AnnualRevenue
**Structure:** Requires three flexiPageRegions: one template region (Region type) that contains the component and two facets (one for the primary field and one for the secondary fields) that are referenced by the component.
```xml
<flexiPageRegions>
<itemInstances>
<fieldInstance>
<fieldInstanceProperties>
<name>uiBehavior</name>
<value>none</value>
</fieldInstanceProperties>
<fieldItem>Record.Name</fieldItem> <!-- or other primary field -->
<identifier>RecordNamePrimaryField</identifier>
</fieldInstance>
</itemInstances>
<name>Facet-PrimaryFields</name>
<type>Facet</type>
</flexiPageRegions>
<flexiPageRegions>
<itemInstances>
<fieldInstance>
<fieldInstanceProperties>
<name>uiBehavior</name>
<value>none</value>
</fieldInstanceProperties>
<fieldItem>Record.Phone</fieldItem> <!-- or other secondary field -->
<identifier>RecordPhoneSecondaryField0</identifier>
</fieldInstance>
</itemInstances>
<!-- additional secondary fields -->
<itemInstances>
...
</itemInstances>
<name>Facet-SecondaryFields</name>
<type>Facet</type>
</flexiPageRegions>
<flexiPageRegions>
<itemInstances>
<componentInstance>
<componentInstanceProperties>
<name>actionNames</name>
<valueList>
<valueListItems>
<value>Edit</value>
</valueListItems>
<valueListItems>
<value>Delete</value>
</valueListItems>
</valueList>
</componentInstanceProperties>
<componentInstanceProperties>
<name>numVisibleActions</name>
<value>3</value>
</componentInstanceProperties>
<componentInstanceProperties>
<name>primaryField</name>
<value>Facet-PrimaryFields</value> <!-- reference to facet containing primary field -->
</componentInstanceProperties>
<componentInstanceProperties>
<name>secondaryFields</name>
<value>Facet-SecondaryFields</value> <!-- reference to facet containing secondary fields -->
</componentInstanceProperties>
<componentName>record_flexipage:dynamicHighlights</componentName>
<identifier>record_flexipage_dynamicHighlights</identifier>
</componentInstance>
</itemInstances>
<name>header</name>
<type>Region</type>
</flexiPageRegions>
```
CLI generates Facets with field references automatically.