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. Product
  • 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. Product

Scopes

The <salla-Scopes> web component shows a list of scopes (Branches) owned by the store. It consists of Button component that enables the addition of a header component, and that can be customized using the properties' parameters.

Example#

Branch Example

Usage#

HTML
JS
SASS

Properties#

PropertyAttributeDescriptionTypeDefault
Search Display Limitsearch-display-limitDetermines when to show the search fieldnumber6
SelectionselectionEither optionally open the modal or enforce the pop-up to the viewer`"mandatory" | "optional" |optional

Methods#

The pre-defined methods allow for calling functions built by Salla to carry out certain actvities, such as show and/or hide the component.
MethodDescriptionReturn Type
close()Closes the scope modal dialog.Promise<HTMLElement>
open(mode?: any, product_id?: number)Opens the scope modal dialog.Promise<any>
handleSubmit()Submits a form which modifies the existing scopes.Promise<any>

Slots#

The slots makes it customizable to modify certain labels, such as footer
SlotDescription
footerThis slot utilizes the "handleSubmit" method to submit the form. The bottom section of the component, which is used for form action.
Modified at 2025-03-04 12:54:02
Previous
Quick Order
Next
Search