RelationshipList
<caos-relationship-list>
an object’s child relationships, with the field behind each and what a delete does to it
May be placed on a page inside an app and a record page.
Inputs
Section titled “Inputs”| Name | Attribute | Description | Type | Default | Required |
|---|---|---|---|---|---|
relationships |
property only | What points here: { name, childObject, field, onDelete?, count? }[]. onDelete absent ⇒ NOT STATED, which is drawn as “not stated” and never guessed. count absent ⇒ not counted, which is not the same as none. |
json | empty list | Optional |
linkable |
linkable, markup only |
Make the object names pressable, raising caos-relationship-open. Off by default, because a link to somewhere the host has not wired is worse than plain text. |
boolean | false | Optional |
emptyText |
empty-text, markup only |
What to say when nothing points here. “Nothing points at this object” is a real and useful answer, so it is stated rather than left as a blank table. | text | Nothing points at this object. | Optional |
sortKey |
sort-key, markup only |
Which column orders the rows. | text — one of childObject, name, field, onDelete, count | childObject | Optional |
sortDirection |
sort-direction, markup only |
Which way. An uncounted relationship sorts last in both directions. | text — one of asc, desc | asc | Optional |
Events
Section titled “Events”| Name | When it fires | What it carries |
|---|---|---|
caos-relationship-open |
An object name is pressed, with linkable set. |
{ object }. |
Not documented yet — this piece has not said.
Styling hooks
Section titled “Styling hooks”Not documented yet — this piece has not said.
Methods
Section titled “Methods”Not documented yet — this piece has not said.
Readable state
Section titled “Readable state”| Name | Type | What it tells you |
|---|---|---|
cascading |
CaosRelationship[] | The relationships that would take records with this one. Read it to build a delete warning without re-deciding which behaviours are dangerous. |
ordered |
CaosRelationship[] | The relationships in the order they are shown. |
Styling parts
Section titled “Styling parts”| Part | Which piece of it | When it is there |
|---|---|---|
::part(list) |
The outer column. | Always |
::part(summary) |
The count line, including how many would cascade. | Always |
::part(table) |
The composed data table. | Always |
::part(object-link) |
A pressable object name. | linkable is set. |
::part(behaviour) |
The on-delete cell. | Always |
::part(count) |
The record-count cell. | Always |
When to use it
Section titled “When to use it”Before changing or deleting something, when the question is what ELSE depends on it. It is the reverse view of a lookup: not what this points at, but what points here.
What to use instead
Section titled “What to use instead”- ObjectFieldExplorer — the question is what is ON this object rather than what points at it.
- DataTable — the rows are related RECORDS being listed, not the relationships themselves.
Accessibility
Section titled “Accessibility”The summary is a role="status" live region and names the cascading count in words as well as in red, so “four of these would delete records with this one” is heard rather than only seen. Each delete behaviour is a sentence, not a vocabulary word, so a reader who does not already know what “cascade” means is not left to guess at the most consequential cell on the screen. Object names are <button> elements with an accessible name reading “Open
Examples
Section titled “Examples”What a delete would take with it
Section titled “What a delete would take with it”Two relationships cascade, one restricts, one empties the reference — each said in words beside its name, and the summary counts the dangerous ones.
{ "id": "example", "section": "What a delete would take with it", "columns": 1, "items": [ { "id": "relationship_list_1", "type": "component", "key": "relationship_list", "inputs": { "linkable": true, "relationships": [ { "name": "Contacts", "childObject": "Contact", "field": "AccountId", "onDelete": "cascade", "count": 4120 }, { "name": "Opportunities", "childObject": "Opportunity", "field": "AccountId", "onDelete": "cascade", "count": 860 }, { "name": "Invoices", "childObject": "Invoice__c", "field": "Account__c", "onDelete": "restrict", "count": 22 }, { "name": "Notes", "childObject": "Note", "field": "ParentId", "onDelete": "clear", "count": 0 } ] } } ]}<caos-relationship-list id="relationshipList1" linkable></caos-relationship-list>// What an attribute cannot hold, set as a property — the same values the preview is drawn with.const relationshipList1 = document.getElementById('relationshipList1');relationshipList1.relationships = [ { "name": "Contacts", "childObject": "Contact", "field": "AccountId", "onDelete": "cascade", "count": 4120 }, { "name": "Opportunities", "childObject": "Opportunity", "field": "AccountId", "onDelete": "cascade", "count": 860 }, { "name": "Invoices", "childObject": "Invoice__c", "field": "Account__c", "onDelete": "restrict", "count": 22 }, { "name": "Notes", "childObject": "Note", "field": "ParentId", "onDelete": "clear", "count": 0 }];What nobody checked
Section titled “What nobody checked”A behaviour the caller did not state reads “not stated”, and a relationship nobody counted reads “not counted” — neither is quietly rendered as the reassuring answer.
{ "id": "example", "section": "What nobody checked", "columns": 1, "items": [ { "id": "relationship_list_1", "type": "component", "key": "relationship_list", "inputs": { "relationships": [ { "name": "Contacts", "childObject": "Contact", "field": "AccountId", "onDelete": "cascade", "count": 4120 }, { "name": "Cases", "childObject": "Case", "field": "AccountId" }, { "name": "Assets", "childObject": "Asset", "field": "AccountId", "onDelete": "restrict" } ] } } ]}<caos-relationship-list id="relationshipList1"></caos-relationship-list>// What an attribute cannot hold, set as a property — the same values the preview is drawn with.const relationshipList1 = document.getElementById('relationshipList1');relationshipList1.relationships = [ { "name": "Contacts", "childObject": "Contact", "field": "AccountId", "onDelete": "cascade", "count": 4120 }, { "name": "Cases", "childObject": "Case", "field": "AccountId" }, { "name": "Assets", "childObject": "Asset", "field": "AccountId", "onDelete": "restrict" }];Nothing points here
Section titled “Nothing points here”A real answer, stated — not a blank table somebody reads as a screen that failed to load.
{ "id": "example", "section": "Nothing points here", "columns": 1, "items": [ { "id": "relationship_list_1", "type": "component", "key": "relationship_list", "inputs": { "relationships": [] } } ]}<caos-relationship-list id="relationshipList1"></caos-relationship-list>// What an attribute cannot hold, set as a property — the same values the preview is drawn with.const relationshipList1 = document.getElementById('relationshipList1');relationshipList1.relationships = [];