foreign-record-selector

Used for selecting a foreign record

Usage no npm install needed!

<script type="module">
  import foreignRecordSelector from 'https://cdn.skypack.dev/foreign-record-selector';
</script>

README

ForeignRecordSelector

npm package

Used for selecting a foreign record.

Getting started

npm install @cmds/foreign-record-selector --save

Prop Types

Property Type Required? Description
id String Unique id for the instance of this foreign record selector
query String Search query to display inside the input
loading Boolean Displays loading indicator instead of the results
noResults Boolean Displays 'No matching records.' instead of the results
records Array An array of record ids
createRecordName Array The name of the record created when the create new record button is click
onQueryChange Function Triggers when the user updates the search query input: ({query: string})
onCreateRecordClick Function Triggers when the user clicks on the create new record button: ({e: ClickEvent})
onCloseClick Function Triggers when the user clicks on the close button: ({e: ClickEvent})
onSelect Function Triggers when the user clicks on one of the records displayed in the results: ({id: string, e: ClickEvent})
recordRenderer Function Responsible for rendering a record given the id to be displayed in the results: ({id: string, onClick: Function})

More information

This component is designed and developed as part of Cosmos Design System.