Salla Docs
Merchant API
  • Merchant API
  • Salla OAuth 2.0
Partner APIs
  • App API
  • Shipment API
Storefront
  • Twilight Engine
  • Twilight SDK
  • Web Components
  • Change Log
Salla CLI
Merchant API
  • Merchant API
  • Salla OAuth 2.0
Partner APIs
  • App API
  • Shipment API
Storefront
  • Twilight Engine
  • Twilight SDK
  • Web Components
  • Change Log
Salla CLI
Salla - Opensource
Salla - Developers Community
  1. Elements
  • Overview
  • Usage
  • Components Customization
  • Elements
    • Apps Icons
    • Breadcrumb
    • Color Picker
    • Conditional Fields
    • Count Down
    • Filters
    • Infinite Scroll
    • List Tile
    • Loading
    • Map
    • Modal
    • Placeholder
    • Progress Bar
    • Rating Stars
    • Reviews
    • Reviews Summary
    • Sheet
    • Skeleton
    • Slider
    • Social
    • Social Share
    • Tabs
  • Form
    • Button
    • Bottom Alert
    • Contacts
    • Date Time Picker
    • File Upload
    • Menu
    • Quantity Input
    • Select
    • Tel Input
  • Product
    • Add Product
    • Advertisement
    • Comments
    • Conditional Offer
    • Gifting
    • Installment
    • Meta Data
    • Offer
    • Offer Modal
    • Orders
    • Payments
    • Product Availability
    • Product Card
    • Products List
    • Product Options
    • Product Size Guide
    • Products Slider
    • Quick Buy
    • Quick Order
    • Scopes
    • Search
  • User
    • Cart Summary
    • Localization
    • Login
    • Loyalty
    • Rating
    • User Menu
    • User Profile
    • User Settings
    • Verify
  1. Elements

Sheet

The <salla-sheet> component is the baseline for numerous components such as the Button component. It is a transformable layout, based on the position property, that provides a basic foundation for other components to be set on.

Example#

Sheet

Usage#

HTML
SASS

Properties#

PropertyAttributeDescriptionTypeDefault
HeightheightSets the vertical height of the componentnumber300
PersistentpersistentWhether or not the component is in a force view mode where it is not closablebooleanfalse
PositionpositionPositions the component for different UI layout usecases, such as mobile view"bottom" | "left" | "right" | "top"'bottom'
Sheet Colorsheet-colorCustomizable coloring of the componentstring"#ffffff"
WidthwidthSets the horizontal height of the componentnumber600

Methods#

The pre-defined methods allow for calling functions built by Salla to carry out certain actvities, such as open and close which opens and closes the sheet layout.
MethodDescriptionReturn Type
openOpens the sheet layoutPromise<void>
closeCloses the sheet layoutPromise<void>
Modified at 2025-03-04 12:54:02
Previous
Reviews Summary
Next
Skeleton