Using Sheet Component in Custom Lightning Web Component

The Sheet component can be used not only by placing it on a page from Lightning App Builder, but also by placing it inside the template of a Lightning web component you have developed yourself. This makes it possible to compose a screen that combines the sheet display with your own controls.

For the Sheet component itself and how to place it on a Lightning page, see "Sheet Component".

Embedding in a Template

Write the following in the template of the Lightning web component. The values that can be specified as attributes are the same as the properties set in Lightning App Builder.

<msmxsheet-sheet-component
  title="Opportunity List"
  book-id={bookId}
  sheet-id={sheetId}
  record-id={recordId}
  parameters={parameters}
  publish-events={publishEvents}
  component-id={componentId}
  height="500px"
  onselectrecord={handleSelectRecord}
></msmxsheet-sheet-component>

The meaning of each attribute is the same as the property of the same name in Lightning App Builder. For details, see "Properties of Sheet Component" in "Sheet Component".

Changing the Book / Sheet to Display Dynamically

The "Book ID" and "Sheet ID" of the placed Sheet component can be changed at runtime. When you change the value, the book and sheet to display are switched without the component being recreated. This makes it possible to compose a screen that switches the sheet to display in conjunction with a selection made in your own controls.

When no value is set for "Book ID", or when the value of "Book ID" becomes empty at runtime, nothing is displayed in the Sheet component.

Receiving the Selected Record

The record selected in the sheet can be received directly in the component where it is placed, by subscribing to the selection event (selectrecord).

To use events raised from the Sheet component, "Publish Events" must be enabled. For how to work with other components, see also "Developing Apps using Message Channel API" and "Wiring Components using Dynamic Interaction".

When placing multiple Sheet components on the same page, specify a different "Component ID" for each of them. It is used to identify the source of an event.