Sheet Table of Contents

• Props
• Events
• Slots
• CSS Variables

PropertiesPropertyAttributeDescriptionTypeDefaultaria ariaSets ARIA attributes.type SheetAriaAttribute = {
  'aria-label'?: string;
  'role'?: string;
}undefinedbackground backgroundDefines the background colortype SheetBackground =
'canvas'
'surface''canvas'disableBackdropClick disable-backdrop-clickIf true, the sheet will not be closable via backdrop click.booleanfalsedismissButton dismiss-buttonIf false, the sheet will not have a dismiss button.booleantrueopen openIf true, the sheet is open.booleanfalseEventsEventDescriptionTypedismiss Emitted when the component requests to be dismissed.CustomEvent<void>motionHiddenEnd Emitted when the sheet is closed and the transition is finished.type SheetMotionHiddenEndEventDetail = TransitionEvent
CustomEvent<SheetMotionHiddenEndEventDetail>motionVisibleEnd Emitted when the sheet is opened and the transition is finished.type SheetMotionVisibleEndEventDetail = TransitionEvent
CustomEvent<SheetMotionVisibleEndEventDetail>SlotsSlotDescriptionisRequiredaltPropallowedTagNames<slot name="header"> Renders a header section above the content area.<slot> Default slot for the main content.CSS VariablesCSS VariableDescriptiondefaultValue--ref-p-sheet-pt Exposes the internally used padding-top of the Sheet as read only CSS variable. When slotting e.g. a media container, this variable can be used to stretch the element to the top of the Sheet.--ref-p-sheet-pb Exposes the internally used padding-bottom of the Sheet as read only CSS variable. When slotting e.g. a media container, this variable can be used to stretch the element to the bottom of the Sheet.--ref-p-sheet-px Exposes the internally used padding-inline of the Sheet as read only CSS variable. When slotting e.g. a media container, this variable can be used to stretch the element to the full horizontal size of the Sheet.