/* eslint-disable */
/* tslint:disable */
/**
 * This is an autogenerated file created by the Stencil compiler.
 * It contains typing information for all components that exist in this project.
 */
import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
import { Option } from "./components/salla-booking-field/interfaces";
import { Color, Options } from "./components/salla-color-picker/interfaces";
import { Comment, CommentType } from "./components/salla-comments/interfaces";
import { DateLimit, DateOption, LocaleKey } from "./components/salla-datetime-picker/interfaces";
import { FilePondFile } from "./components/salla-file-upload/interfaces";
import { FilePondErrorDescription } from "filepond/types/index";
import { Filter } from "./components/salla-filters/interfaces";
import { Item, LoyaltyProgram } from "./components/salla-loyalty/loyalty-schema";
import { Sources } from "./components/salla-menu/interfaces";
import { Notification } from "./components/salla-notifications/interfaces";
import { OrderQueryParameters } from "./components/salla-orders/interface";
import { Donation, Option as Option1 } from "./components/salla-product-options/interfaces";
import { Review } from "./components/salla-review-card/interfaces";
import { ReviewType, SortingOption, Source } from "./components/salla-reviews/interfaces";
import { Phone } from "./components/salla-tel-input/interfaces";
import { CustomField } from "./components/salla-user-profile/interfaces";
export { Option } from "./components/salla-booking-field/interfaces";
export { Color, Options } from "./components/salla-color-picker/interfaces";
export { Comment, CommentType } from "./components/salla-comments/interfaces";
export { DateLimit, DateOption, LocaleKey } from "./components/salla-datetime-picker/interfaces";
export { FilePondFile } from "./components/salla-file-upload/interfaces";
export { FilePondErrorDescription } from "filepond/types/index";
export { Filter } from "./components/salla-filters/interfaces";
export { Item, LoyaltyProgram } from "./components/salla-loyalty/loyalty-schema";
export { Sources } from "./components/salla-menu/interfaces";
export { Notification } from "./components/salla-notifications/interfaces";
export { OrderQueryParameters } from "./components/salla-orders/interface";
export { Donation, Option as Option1 } from "./components/salla-product-options/interfaces";
export { Review } from "./components/salla-review-card/interfaces";
export { ReviewType, SortingOption, Source } from "./components/salla-reviews/interfaces";
export { Phone } from "./components/salla-tel-input/interfaces";
export { CustomField } from "./components/salla-user-profile/interfaces";
export namespace Components {
    interface SallaAddProductButton {
        /**
          * Channels.
         */
        "channels": string;
        /**
          * Donating amount.
         */
        "donatingAmount": number;
        /**
          * Listen to product options availability.
         */
        "notifyOptionsAvailability": boolean;
        /**
          * Product id
         */
        "productId": any;
        /**
          * Product Status.Defaults to `sale`
          * @default 'sale'
         */
        "productStatus": 'sale' | 'out' | 'out-and-notify';
        /**
          * Product type. Defaults to `product`
          * @default 'product'
         */
        "productType": 'product' | 'service' | 'codes' | 'digital' | 'food' | 'donating' | 'group_products' | 'booking' | 'financial_support';
        /**
          * Product Quantity
         */
        "quantity": number;
        /**
          * Support Quick Pay Button
         */
        "quickBuy": boolean;
        /**
          * Subscribed Options ex: "[[139487,2394739],[1212,1544]]"
         */
        "subscribedOptions": string;
        /**
          * Support themes that have a sticky bar
         */
        "supportStickyBar": boolean;
    }
    interface SallaAdvertisement {
    }
    interface SallaAppInstallAlert {
    }
    interface SallaAppsIcons {
        /**
          * The title to display.
         */
        "appsTitle": string;
        /**
          * Flag to show or hide title.
         */
        "hideTitle": boolean;
        /**
          * Display flag to horizontal/vertical.
         */
        "vertical": boolean;
    }
    interface SallaBookingField {
        /**
          * The booking option configuration
         */
        "option": Option;
        /**
          * The ID of the product for which the booking is being made
         */
        "productId": number;
    }
    interface SallaBottomAlert {
        /**
          * Button label - used when type is link and popup
         */
        "actionLabel": string;
        /**
          * Button url - used when type is link
         */
        "actionUrl": string;
        /**
          * Alert Icon class from salla icons library - ex: sicon-user
         */
        "icon": string;
        /**
          * Alert Message
         */
        "message": string;
        /**
          * Alert Type
          * @default 'popup'
         */
        "type": 'link' | 'popup' | 'banner';
    }
    /**
     * @name SallaBreadcrumb
     * @description A StencilJS component for rendering breadcrumb navigation.
     * @tag salla-breadcrumb
     */
    interface SallaBreadcrumb {
    }
    interface SallaButton {
        /**
          * Button Color
          * @default 'primary'
         */
        "color": 'primary' | 'success' | 'warning' | 'danger' | 'light' | 'gray' | 'dark';
        /**
          * Add `disabled` attribute
         */
        "disable": () => Promise<HTMLElement>;
        /**
          * Is the button currently disabled
          * @default false
         */
        "disabled": boolean;
        /**
          * Remove `disabled` attribute
         */
        "enable": () => Promise<HTMLElement>;
        /**
          * Button Fill
          * @default 'solid'
         */
        "fill": 'solid' | 'outline' | 'none';
        /**
          * Button with href as normal link
         */
        "href": string;
        /**
          * Run loading animation
         */
        "load": () => Promise<HTMLElement>;
        /**
          * If there is need to change loader position, pass the position
          * @default 'after'
         */
        "loaderPosition": 'start' | 'end' | 'center' | 'after';
        /**
          * Is the button currently loading
          * @default false
         */
        "loading": boolean;
        /**
          * Changing the body of the button
          * @param html
         */
        "setText": (html: string) => Promise<HTMLElement>;
        /**
          * Button Type
          * @default 'btn'
         */
        "shape": 'link' | 'icon' | 'btn';
        /**
          * Button Size
          * @default 'medium'
         */
        "size": 'small' | 'large' | 'medium';
        /**
          * Stop loading animation
         */
        "stop": () => Promise<HTMLElement>;
        /**
          * Determines the type of the rendered button. By default, the type is set to "button," making it a general-purpose button. Setting `type` to "submit" makes the button behave as a submit button within a form, triggering form submission. Possible values for `type` include "button," "submit," "reset," and "menu.".  Possible values and their usage are as follows: "button" (default, used for general button functionality),  "reset" (resets form fields to their default values), and  "menu" (represents a button that, when activated, displays a context menu).
          * @default "button"
         */
        "type": string;
        /**
          * Button Width
          * @default 'normal'
         */
        "width": 'wide' | 'normal';
    }
    interface SallaCartItemOffers {
        /**
          * The unique identifier of the cart item
         */
        "itemId": number;
        /**
          * JSON string containing the offers associated with the cart item
         */
        "offers": string;
        /**
          * The original price of the product in the cart
         */
        "productPrice": number;
        /**
          * The quantity of the cart item
         */
        "quantity": number;
    }
    interface SallaCartSummary {
        /**
          * Animate product Image to cart summary
          * @param image the image element to animate
         */
        "animateToCart": (image: any) => Promise<void>;
        /**
          * Show cart label
         */
        "showCartLabel": boolean;
    }
    interface SallaColorPicker {
        /**
          * Close/Hide the picker.
         */
        "closePicker": () => Promise<void>;
        /**
          * Initial color for the picker.
         */
        "color": string;
        /**
          * Release all resources used by this picker instance.
         */
        "destroyPicker": () => Promise<void>;
        /**
          * Whether to enable adjusting the alpha channel.
          * @default false
         */
        "enableAlpha": boolean;
        /**
          * How to display the selected color in the text field (the text field still supports input in any format).
          * @default 'hex'
         */
        "format": 'hex' | 'hsl' | 'rgb';
        /**
          * Move the popup to a different parent, optionally opening it at the same time.  (Usually a new .parent and .color).
          * @param option Whether to open the popup immediately.
          * @param openImmediately
         */
        "movePopUp": (options: Options, openImmediately: boolean) => Promise<void>;
        /**
          * File input name for the native formData
          * @default 'color'
         */
        "name": string;
        /**
          * Show/open the picker.
         */
        "openPicker": () => Promise<void>;
        /**
          * Set if the color picker input is required or not
          * @default false
         */
        "required": boolean;
        /**
          * Set/initialize the picker's color.  Color name, RGBA/HSLA/HEX string, or RGBA array.
          * @param color If true, won't trigger onChange.
          * @param triggerEvent
         */
        "setColorValue": (color: string, triggerEvent: boolean) => Promise<void>;
        /**
          * Set the picker options.  (Usually a new .parent and .color).
          * @param options
         */
        "setPickerOption": (options: Options) => Promise<void>;
        /**
          * Whether to have a "Cancel" button which closes the popup.
          * @default false
         */
        "showCancelButton": boolean;
        /**
          * Whether to show a text field for color value editing.
          * @default true
         */
        "showTextField": boolean;
    }
    interface SallaCommentForm {
        /**
          * The ID of the item(as defined in the type), where the comment is for. defaults to `salla.config.get('page.id')`
         */
        "itemId"?: string | number;
        /**
          * To show the avatar or not in the comment form
         */
        "showAvatar": boolean;
        /**
          * Type of entity the comment is being submitted for. Defaults to `salla.url.is_page('page-single') ? 'page' : 'product'`
         */
        "type": 'product' | 'page' | 'blog';
    }
    interface SallaCommentItem {
        /**
          * Single Comment Instance
         */
        "comment": Comment;
        /**
          * Hide Bought
         */
        "hideBought": Boolean;
    }
    interface SallaComments {
        /**
          * Block Title
         */
        "blockTitle": string;
        /**
          * Hide Bought
          * @default false
         */
        "hideBought": boolean;
        /**
          * Load more text
         */
        "hideForm": boolean;
        /**
          * Hide Title
         */
        "hideTitle": boolean;
        /**
          * Page or product ID
         */
        "itemId": number;
        /**
          * Load more text
         */
        "loadMoreText": string;
        /**
          * Reloads the comments data from the server
         */
        "reload": () => Promise<void>;
        /**
          * Show or hide avatar
          * @default false
         */
        "showFormAvatar": boolean;
        /**
          * Sort comments
         */
        "sort": string | 'latest' | 'oldest' | 'bottom_rating' | 'top_rating';
        /**
          * Determines if the comments are testimonials
          * @default false
         */
        "testimonials": boolean;
        /**
          * Comment Type
          * @default CommentType.PAGE
         */
        "type": CommentType.PAGE | CommentType.PRODUCT | CommentType.BLOG;
    }
    /**
     * its to easy to use, currenlty its support select & checkbox input as trigger for show/hide the dom
     * the dom you can put it like this data-show-when="{name of the field} {= or !=} {value of the field}"
     */
    interface SallaConditionalFields {
    }
    interface SallaConditionalOffer {
    }
    interface SallaContacts {
        /**
          * Section title for social block of footer.
         */
        "contactsTitle": string;
        /**
          * Flag to toggle title visibility.
         */
        "hideTitle": boolean;
        /**
          * Flag to toggle list of contents whether vertical or horizontal.
         */
        "horizontal": boolean;
        /**
          * Flag condition to show icon only or icon with label
         */
        "iconsOnly": boolean;
        /**
          * Conditional flag to check whether the content is header or not.
         */
        "isHeader": boolean;
    }
    interface SallaCountDown {
        /**
          * If true, the count down numbers will be appear in a boxes
         */
        "boxed": boolean;
        /**
          * The color of the count down
          * @default 'dark'
         */
        "color": 'primary' | 'light' | 'dark';
        /**
          * The date to count down to Format: MMM DD, YYYY HH:mm:ss (e.g. Jan 2, 2023 16:37:52)
         */
        "date": string;
        /**
          * The digits lang to show in the count down
          * @default 'auto'
         */
        "digits": 'en' | 'auto';
        /**
          * End the count down
         */
        "endCountDown": () => Promise<void>;
        /**
          * If true, the count down will end at the end of the day
         */
        "endOfDay": boolean;
        /**
          * The text to show when the count down ends
         */
        "endText": string;
        /**
          * Show labels for each count down number
         */
        "labeled": boolean;
        /**
          * The size of the count down
          * @default 'md'
         */
        "size": 'sm' | 'md' | 'lg';
    }
    interface SallaDatetimePicker {
        /**
          * Allows the user to enter a date directly into the input field. By default, direct entry is disabled.
          * @default true
         */
        "allowInput": boolean;
        /**
          * Allows the preloading of an invalid date. When disabled, the field will be cleared if the provided date is invalid
          * @default false
         */
        "allowInvalidPreload": boolean;
        /**
          * Exactly the same as date format, but for the altInput field.
          * @default "F j, Y"
         */
        "altFormat": string;
        /**
          * Show the user a readable date (as per altFormat), but return something totally different to the server.
          * @default false
         */
        "altInput": boolean;
        /**
          * This class will be added to the input element created by the altInput option. Note that altInput already inherits classes from the original input.
         */
        "altInputClass": string;
        /**
          * Instead of body, appends the calendar to the specified node instead.
          * @default undefined
         */
        "appendTo": HTMLElement;
        /**
          * Defines how the date will be formatted in the aria-label for calendar days, using the same tokens as dateFormat. If you change this, you should choose a value that will make sense if a screen reader reads it out loud.
          * @default "F j, Y"
         */
        "ariaDateFormat": string;
        /**
          * Whether the default time should be auto-filled when the input is empty and gains or loses focus.
          * @default true
         */
        "autoFillDefaultTime": boolean;
        /**
          * Whether clicking on the input should open the picker. Set it to false if you only want to open the calendar programmatically with [open()]
          * @default true
         */
        "clickOpens": boolean;
        /**
          * Whether calendar should close after date selection or not
          * @default true
         */
        "closeOnSelect": boolean;
        /**
          * When in "multiple" mode, conjunction is used to separate dates in the entry field.
         */
        "conjunction"?: string;
        /**
          * A string of characters which are used to define how the date will be displayed in the input box. The supported characters are defined in the table below.
          * @default "Y-m-d"
         */
        "dateFormat": string;
        /**
          * A custom datestring parser
         */
        "dateParser": (date: string, format: string) => Date;
        /**
          * Sets the initial selected date(s). If you're using mode: "multiple" or a range calendar supply an Array of Date objects or an Array of date strings which follow your dateFormat. Otherwise, you can supply a single Date object or a date string.
         */
        "defaultDate": DateOption | DateOption[];
        /**
          * Initial value of the hour element, when no date is selected
          * @default 12
         */
        "defaultHour": number;
        /**
          * Initial value of the minute element, when no date is selected
          * @default 0
         */
        "defaultMinute": number;
        /**
          * Initial value of the seconds element, when no date is selected
          * @default 0
         */
        "defaultSeconds": number;
        /**
          * Disables certain dates, preventing them from being selected. See https://chmln.github.io/flatpickr/examples/#disabling-specific-dates
          * @default []
         */
        "disable": DateLimit<DateOption>[];
        /**
          * Set this to true to always use the non-native picker on mobile devices. By default, Flatpickr utilizes native datetime widgets unless certain options (e.g. disable) are used.
          * @default false
         */
        "disableMobile": boolean;
        /**
          * Whether the input is disabled
          * @default false
         */
        "disabled": boolean;
        /**
          * Disables all dates except these specified. See https://chmln.github.io/flatpickr/examples/#disabling-all-dates-except-select-few
          * @default [(_) => true]
         */
        "enable": DateLimit<DateOption>[];
        /**
          * Enables seconds selection in the time picker.
          * @default false
         */
        "enableSeconds": boolean;
        /**
          * Enables the time picker
          * @default false
         */
        "enableTime": boolean;
        /**
          * Allows using a custom date formatting function instead of the built-in handling for date formats using dateFormat, altFormat, etc.
         */
        "formatDate": (date: Date, format: string, locale: Object) => string;
        /**
          * Adjusts the step for the hour input (incl. scrolling)
          * @default 1
         */
        "hourIncrement": number;
        /**
          * Displays the calendar inline
          * @default false
         */
        "inline": boolean;
        /**
          * The locale, either as a string (e.g. "ar", "en") or as an object. See https://chmln.github.io/flatpickr/localization/
          * @default "en"
         */
        "locale": LocaleKey;
        /**
          * The maximum date that a user can pick to (inclusive).
          * @default null
         */
        "maxDate": DateOption;
        /**
          * The minimum date that a user can start picking from (inclusive).
          * @default null
         */
        "maxTime": DateOption;
        /**
          * The minimum date that a user can start picking from (inclusive).
          * @default null
         */
        "minDate": DateOption;
        /**
          * The minimum time that a user can start picking from (inclusive).
          * @default null
         */
        "minTime": DateOption;
        /**
          * Adjusts the step for the minute input (incl. scrolling) Defaults to 5
          * @default 5
         */
        "minuteIncrement": number;
        /**
          * Date selection mode, defaults to "single"
          * @default "single"
         */
        "mode": "single" | "multiple" | "range" | "time";
        /**
          * How the month should be displayed in the header of the calendar. If showMonths has a value greater than 1, the month is always shown as static.
          * @default "dropdown"
         */
        "monthSelectorType": "dropdown" | "static";
        /**
          * the name for the input
         */
        "name": string;
        /**
          * HTML for the arrow icon, used to switch months.
          * @default '<span class="sicon-keyboard_arrow_right"></span>'
         */
        "nextArrow": string;
        /**
          * Hides the day selection in calendar. Use it along with enableTime to create a time picker.
          * @default false
         */
        "noCalendar": boolean;
        /**
          * Placeholder text to show on the input element
          * @default salla.lang.get('blocks.buy_as_gift.select_send_date_and_time')
         */
        "placeholder": string;
        /**
          * How the calendar should be positioned with regards to the input. Defaults to "auto"
          * @default "auto"
         */
        "position": "auto" | "above" | "below" | "auto left" | "auto center" | "auto right" | "above left" | "above center" | "above right" | "below left" | "below center" | "below right" | ((self: any, customElement: HTMLElement | undefined) => void);
        /**
          * The element off of which the calendar will be positioned. Defaults to the date input
         */
        "positionElement": HTMLElement;
        /**
          * HTML for the left arrow icon, used to switch months.
          * @default '<span class="sicon-keyboard_arrow_left"></span>'
         */
        "prevArrow": string;
        /**
          * Whether this input i required or not
         */
        "required": boolean;
        /**
          * Whether to display the current month name in shorthand mode, e.g. "Sep" instead "September"
          * @default false
         */
        "shorthandCurrentMonth": boolean;
        /**
          * The number of months to be shown at the same time when displaying the calendar.
          * @default 1
         */
        "showMonths": number;
        /**
          * Position the calendar inside the wrapper and next to the input element*.
          * @default false
         */
        "static": boolean;
        /**
          * Displays time picker in 24 hour mode without AM/PM selection when enabled.
          * @default false
         */
        "time_24hr": boolean;
        /**
          * Two way data binding to retrieve the selected date[time] value
          * @default null
         */
        "value": string;
        /**
          * Enables display of week numbers in calendar.
          * @default false
         */
        "weekNumbers": boolean;
        /**
          * See https://chmln.github.io/flatpickr/examples/#flatpickr-external-elements
          * @default false
         */
        "wrap": boolean;
    }
    interface SallaFileUpload {
        /**
          * Accepted file types
          * @default "image/png, image/jpeg, image/jpg, image/gif"
         */
        "accept": string;
        /**
          * Enable or disable file browser
          * @default true
         */
        "allowBrowse": boolean;
        /**
          * Enable or disable drag n' drop
          * @default true
         */
        "allowDrop": boolean;
        /**
          * Enable or disable preview mode
          * @default true
         */
        "allowImagePreview": boolean;
        /**
          * Enable or disable adding multiple files
         */
        "allowMultiple": boolean;
        /**
          * Enable or disable pasting of files. Pasting files is not supported on all browesrs.
         */
        "allowPaste": boolean;
        /**
          * Enable or disable the process button
         */
        "allowProcess": boolean;
        /**
          * When set to false the remove button is hidden and disabled
          * @default true
         */
        "allowRemove": boolean;
        /**
          * Allow users to reorder files with drag and drop interaction. Note that this only works in single column mode. It also only works on browsers that support pointer events.
         */
        "allowReorder": boolean;
        /**
          * Allow drop to replace a file, only works when allowMultiple is false
          * @default true
         */
        "allowReplace": boolean;
        /**
          * Enable or disable the revert processing button
          * @default true
         */
        "allowRevert": boolean;
        /**
          * to prepare the upload url automatically pass this prop, ex to upload attach file in cart Item.
         */
        "cartItemId"?: string;
        /**
          * Set to true to enable custom validity messages. FilePond will throw an error when a parent form is submitted and it contains invalid files.
         */
        "checkValidity": boolean;
        /**
          * Force chunks even for files smaller than the set chunkSize
         */
        "chunkForce": boolean;
        /**
          * Amount of times, and delayes, between retried uploading of a chunk
          * @default [500, 1000, 3000]
         */
        "chunkRetryDelays": Array<number>;
        /**
          * The size of a chunk in bytes
          * @default 5000000
         */
        "chunkSize": number;
        /**
          * Enable chunked uploads, when enabled will automatically cut up files in chunkSize chunks before upload.
         */
        "chunkUploads": boolean;
        /**
          * Show credits at the bottom of the upload element. Structure is like [{label,url}]
         */
        "credits": false;
        /**
          * Sets the disabled attribute to the output field
         */
        "disabled": boolean;
        /**
          * Require drop on the FilePond element itself to catch the file.
          * @default true
         */
        "dropOnElement": boolean;
        /**
          * FilePond will catch all files dropped on the webpage
         */
        "dropOnPage": boolean;
        /**
          * When enabled, files are validated before they are dropped. A file is not added when it's invalid.
         */
        "dropValidation": boolean;
        /**
          * If current file has id, pass it here, to be passed back in the `removed` event
         */
        "fileId"?: number;
        /**
          * Fixed image poster height, overrides min and max preview height
          * @default null
         */
        "filePosterHeight": number;
        /**
          * The uploaded files as json `[{url:"...", id:123}]` for delete possibility
         */
        "files": string;
        /**
          * Set to true to require the file to be successfully reverted before continuing.
         */
        "forceRevert": boolean;
        /**
          * json formData to be injected in the submit request
          * @default "{}"
         */
        "formData": string;
        /**
          * The original height of the uploader, will be used to reset the height after the image is removed.
         */
        "height": string;
        /**
          * The icon used for process actions
          * @default '<svg>...</svg>'
         */
        "iconProcess": string;
        /**
          * The icon used for remove actions
          * @default '<svg>...</svg>'
         */
        "iconRemove": string;
        /**
          * The icon used for retry actions
          * @default '<svg>...</svg>'
         */
        "iconRetry": string;
        /**
          * The icon used for undo actions
          * @default '<svg>...</svg>'
         */
        "iconUndo": string;
        /**
          * Ignored file names when handling dropped directories. Dropping directories is not supported on all browsers.
          * @default ['.ds_store', 'thumbs.db', 'desktop.ini']
         */
        "ignoredFiles": Array<any>;
        /**
          * Fixed image preview height, overrides min and max preview height
          * @default null
         */
        "imagePreviewHeight": number;
        /**
          * Immediately upload new files to the server
         */
        "instantUpload": boolean;
        /**
          * The interval to use before showing each item being added to the list
          * @default 75
         */
        "itemInsertInterval": number;
        /**
          * Set to 'after' to add files to end of list (when dropped at the top of the list or added using browse or paste), set to 'before' to add files at start of list. Set to a compare function to automatically sort items when added
          * @default 'after'
         */
        "itemInsertLocation": 'before' | 'after' | ((a: FilePondFile, b: FilePondFile) => number);
        /**
          * The decimal separator used to render numbers. By default this is determined automatically.
          * @default undefined
         */
        "labelDecimalSeparator": string;
        /**
          * Default label shown to indicate this is a drop area. FilePond will automatically bind browse file events to the element with CSS class .filepond--label-action
          * @default `${salla.lang.get('common.uploader.drag_and_drop')}<span class="filepond--label-action"> ${salla.lang.get('common.uploader.browse')} </span>`
         */
        "labelIdle": string;
        /**
          * The thousdands separator used to render numbers. By default this is determined automatically.
          * @default undefined
         */
        "labelThousandsSeparator": string;
        /**
          * The maximum size of a file, for instance 2MB or 750KB
         */
        "maxFileSize": `${number}MB` | `${number}KB}`;
        /**
          * The maximum number of files that the pond can handle
          * @default 1
         */
        "maxFilesCount": number;
        /**
          * The maxmimum number of files that can be uploaded in parallel
          * @default 3
         */
        "maxParallelUploads": number;
        /**
          * The submit request method.
          * @default 'POST'
         */
        "method": string;
        /**
          * File input name for the native formData
         */
        "name"?: string;
        /**
          * File input name in the request payload
         */
        "payloadName": string;
        /**
          * Set the component to be profile image uploader with a preview and a circular shape
          * @default false
         */
        "profileImage": boolean;
        /**
          * Sets the required attribute to the output field
         */
        "required": boolean;
        /**
          * Method to set option for filepond
         */
        "setOption": (key: string, value: string | number) => Promise<void>;
        /**
          * Tells FilePond to store files in hidden file input elements so they can be posted along with normal form post. This only works if the browser supports the DataTransfer constructor (https://caniuse.com/mdn-api_datatransfer_datatransfer), this is the case on Firefox, Chrome, Chromium powered browsers and Safari version 14.1 and higher.
         */
        "storeAsFile": boolean;
        /**
          * Type to be sent to backend
         */
        "type": string;
        /**
          * The url to submit the image into.
         */
        "url": string;
        /**
          * The uploaded image link or URL
         */
        "value": any;
    }
    interface SallaFilters {
        /**
          * Apply filter action.
         */
        "applyFilters": () => Promise<void>;
        /**
          * Array of filter options
         */
        "filters"?: Filter[];
        /**
          * Method to get filter data.
         */
        "getFilters": () => Promise<any>;
        /**
          * Reset selected filters.
         */
        "resetFilters": () => Promise<void>;
    }
    interface SallaFiltersWidget {
        /**
          * Selected filter options value.
         */
        "filtersData": object;
        /**
          * Filter option along with possible values.
         */
        "option": Filter;
        /**
          * Reset selected filter options.
         */
        "reset": () => Promise<void>;
        /**
          * Asynchronously sets the height of a widget element to its current height, allowing for smooth transitions. This function is often used in scenarios where the widget's content changes dynamically, and animating the height adjustment is desired for a smoother user experience.
          * @param delay - Optional. The delay (in milliseconds) before updating the widget height.    Defaults to 250 milliseconds.
          * @returns - A Promise that resolves once the widget height is set after the specified delay.
          * @example // Set widget height with the default delay (250 milliseconds) await setWidgetHeight();  // Set widget height with a custom delay (e.g., 500 milliseconds) await setWidgetHeight(500);
         */
        "setWidgetHeight": (delay?: number) => Promise<void>;
        /**
          * Action to show more or less filter options.
         */
        "showMore": () => Promise<void>;
        /**
          * Action to toggle widget open or closed (expand/ collapse).
         */
        "toggleWidget": () => Promise<void>;
        /**
          * Show more or less filter options.
         */
        "withLoadMore": boolean;
    }
    interface SallaGifting {
        /**
          * Hide / close the gifting modal window
         */
        "close": () => Promise<HTMLElement>;
        /**
          * The form selector to be used to get the form data
          * @default 'form.product-form'
         */
        "formSelector": string;
        /**
          * Go to the step 2
         */
        "goToStep2": () => Promise<void>;
        /**
          * Show / Open the gifting modal window
         */
        "open": () => Promise<any>;
        /**
          * Is Physcial products
         */
        "physicalProducts": boolean;
        /**
          * The product id for which the gifting system is required.
         */
        "productId": number;
        /**
          * Is Vertical widget
         */
        "vertical": boolean;
        /**
          * Widget subtitle
         */
        "widgetSubtitle": string;
        /**
          * Widget title
         */
        "widgetTitle": string;
    }
    interface SallaInfiniteScroll {
        /**
          * Is there is need to autoload next page when scroll `next-page-autoload|next-page.autoload`
          * @default false
         */
        "autoload": boolean;
        /**
          * Class selector to know the container if it's not the host `<salla-infinite-scroll>`
          * @default 'salla-infinite-scroll'
         */
        "container": string;
        /**
          * Class selector to know list items
          * @default 'salla-infinite-scroll > *'
         */
        "item": string;
        /**
          * Load more text
         */
        "loadMoreText": string;
        /**
          * Next Page element
          * @default ''
         */
        "nextPage": string;
    }
    interface SallaInstallment {
        /**
          * Country code
          * @default salla.config.get('user.country_code')
         */
        "country": string;
        /**
          * Currency code
          * @default salla.config.get('user.currency_code')
         */
        "currency": string;
        /**
          * Language code
          * @default salla.config.get('user.language_code')
         */
        "language": string;
        /**
          * Current product price
         */
        "price": string;
    }
    interface SallaListTile {
        /**
          * Designates the component as anchor and applies the `href` attribute.
          * @default undefined
         */
        "href": string | undefined;
        /**
          * Designates the target attribute. This should only be applied when using the `href` prop.
          * @default "_self"
         */
        "target": "_blank" | "_self" | "_parent" | "_top" | "framename";
    }
    interface SallaLoading {
        /**
          * Spinner background color.
          * @default "#e5e7eb"
         */
        "bgColor": string;
        /**
          * Spinner content color.
          * @default undefined
         */
        "color": string;
        /**
          * Sets the diameter of the circle in pixels, Defaults to `32`
          * @default 32
         */
        "size": number | string;
        /**
          * Sets the stroke of the circle (border) in pixels, Defaults to `4`
          * @default 2
         */
        "width": number | string;
    }
    interface SallaLocalizationModal {
        /**
          * Hide the component
         */
        "close": () => Promise<HTMLElement>;
        /**
          * Current currency (existing or newly selected)
          * @default salla.config.get('user.currency_code')
         */
        "currency": string;
        /**
          * Current language (existing or newly selected)
          * @default salla.config.get('user.language_code')
         */
        "language": string;
        /**
          * open the component
         */
        "open": () => Promise<any>;
        /**
          * Change currency and language to the selected ones.
         */
        "submit": () => Promise<void>;
    }
    interface SallaLoginModal {
        /**
          * The API endpoint for authentication
         */
        "api": string;
        /**
          * Custom headers to be sent with API requests
         */
        "headers": { [key: string]: string } | string;
        /**
          * Display the login inline
         */
        "inline": boolean;
        /**
          * Does the merchant allow to login using email
         */
        "isEmailAllowed": boolean;
        /**
          * Does the merchant require registration with email & mobile
          * @default false
         */
        "isEmailRequired": boolean;
        /**
          * Does the merchant/current location for visitor allow to login using mobile, By default outside KSA is `false`
          * @default true
         */
        "isMobileAllowed": boolean;
        /**
          * Open login component
         */
        "open": (_event?: any) => Promise<void | HTMLElement>;
        /**
          * The store ID for authentication
         */
        "storeId": string | number;
        /**
          * Once the api verify success, it will be login the customer in web pages
          * @default true
         */
        "supportWebAuth": boolean;
        /**
          * Reload after a successful login
          * @default false
         */
        "withoutReload": boolean;
    }
    interface SallaLoyalty {
        /**
          * Does the merchant allow to login using email
          * @default true
         */
        "allowEmail": boolean;
        /**
          * Does the merchant/current location for visitor allow to login using mobile, By default outside KSA is `false`
          * @default true
         */
        "allowMobile": boolean;
        /**
          * Hide loyalty modal
         */
        "close": () => Promise<HTMLElement>;
        /**
          * Available customer points with which they can exchange.
         */
        "customerPoints": number;
        /**
          * Exchange loyalty points with the selected prize item
          * @param loyalty_prize_id
         */
        "exchangeLoyaltyPoint": () => Promise<any>;
        /**
          * Message to show for guest users.
         */
        "guestMessage": string;
        /**
          * Show loyalty modal
         */
        "open": () => Promise<any>;
        /**
          * The exchanged prize point
         */
        "prizePoints": string | number;
        /**
          * The prize title
         */
        "prizeTitle": string;
        /**
          * Does the merchant require registration with email & mobile
          * @default false
         */
        "requireEmail": boolean;
        /**
          * Cancel Exchanged prizes
         */
        "resetExchange": () => Promise<any>;
    }
    interface SallaLoyaltyPrizeItem {
        /**
          * Prize item to be displayed in this component.
         */
        "item": Item;
    }
    interface SallaLoyaltyProgram {
    }
    interface SallaMaintenanceAlert {
    }
    interface SallaMap {
        /**
          * Sets google api key value, default Merchant key
         */
        "apiKey": string;
        /**
          * Latitude coordinate, defaults to current user location
         */
        "lat": number;
        /**
          * Longitude coordinate, defaults to current user location
         */
        "lng": number;
        /**
          * Modal Title
         */
        "modalTitle": string;
        /**
          * File input name for the native formData
          * @default 'location'
         */
        "name": string;
        /**
          * Open location component
         */
        "open": () => Promise<HTMLElement>;
        /**
          * Disable or enable actions
          * @default false
         */
        "readonly": boolean;
        /**
          * Set if the location input is required or not
          * @default false
         */
        "required": boolean;
        /**
          * Sets the search bar visibility.
          * @default false
         */
        "searchable": boolean;
        /**
          * Sets map style.
          * @default 'light'
         */
        "theme": string;
        /**
          * Sets start map zoom.
          * @default 10
         */
        "zoom": number;
    }
    interface SallaMenu {
        /**
          * Limiting the number of menu items
         */
        "limit": number;
        /**
          * The source of the menu, specifying whether it is a header or footer menu.
          * @default "header"
         */
        "source": Sources;
        /**
          * The source value, a stringified JSON representation of the menu content.
         */
        "sourceValue"?: string;
        /**
          * Boolean indicating whether the menu is a top navigation menu.
         */
        "topnav": boolean;
        /**
          * Boolean indicating whether to use React Link elements for menu links.
          * @default false
         */
        "useReactLink": boolean;
    }
    interface SallaMetadata {
        /**
          * The entity type.
          * @default 'product'
         */
        "entity": string;
        /**
          * The id of the product/the endity to which the specs are going to be fetched for.
         */
        "entityId": number | number[] | string;
    }
    interface SallaModal {
        /**
          * Align modal content to center, defaults to `false`
          * @default false
         */
        "centered": boolean;
        /**
          * close the modal
         */
        "close": () => Promise<HTMLElement>;
        /**
          * open the modal on rendering
          * @default false
         */
        "hasSkeleton": boolean;
        /**
          * Set the style of the header icon.
          * @default undefined
         */
        "iconStyle": 'error' | 'success' | 'primary' | 'normal';
        /**
          * Sets the modal to be closable. Defaults to `true`
          * @default true
         */
        "isClosable": boolean;
        /**
          * Show loading in the middle
          * @default false
         */
        "isLoading": boolean;
        /**
          * Start loading
         */
        "loading": () => Promise<HTMLElement>;
        /**
          * Avoid padding in the modal body or not, defaults to `false`
          * @default false
         */
        "noPadding": boolean;
        /**
          * Open the modal
         */
        "open": () => Promise<HTMLElement>;
        /**
          * The position of the modal
          * @default 'middle'
         */
        "position": 'top' | 'middle' | 'bottom';
        /**
          * Change the Modal Title
          * @param modalTitle
         */
        "setTitle": (modalTitle: any) => Promise<HTMLElement>;
        /**
          * Stop the loading
         */
        "stopLoading": () => Promise<HTMLElement>;
        /**
          * Set modal sub title.
          * @default ''
         */
        "subTitle": string;
        /**
          * Show subtitle before the title or not, defaults to `false` (after the title)
          * @default false
         */
        "subTitleFirst": boolean;
        /**
          * open the modal on rendering
          * @default false
         */
        "visible": boolean;
        /**
          * The size of the modal
          * @default 'md'
         */
        "width": 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
    }
    interface SallaNotificationItem {
        /**
          * Notification instance to render.
         */
        "notification": Notification;
    }
    interface SallaNotifications {
        /**
          * Number of notifications to load per request.
          * @default 10
         */
        "itemPerPage": number;
        /**
          * Load more text
         */
        "loadMoreText": string;
    }
    /**
     * `salla-offer` is a StencilJS component that displays offers, categories, products, banks, and discount information.
     * It uses the `salla-slider` component for carousel functionality.
     * @csspart custom - Custom CSS part to target specific elements in the component.
     * @example <salla-offer product-id="123"></salla-offer>
     */
    interface SallaOffer {
        /**
          * Custom Card Component for the Salla Products List.  This component allows you to customize the appearance of individual product cards within a Salla Products List.
          * @example <salla-products-list product-card-component="my-custom-card-style1" ... <salla-products-list product-card-component="my-custom-card-style2" ...
          * @default 'custom-salla-product-card'
         */
        "productCardComponent": string;
    }
    interface SallaOfferModal {
        /**
          * Show the available offers for the product
          * @param product_id
         */
        "open": (product_id: number) => Promise<any>;
        /**
          * Show offer details
          * @param offer
         */
        "showOffer": (offer: any) => Promise<void>;
    }
    interface SallaOrderSummary {
        /**
          * The order ID to fetch items from
         */
        "orderId"?: number;
    }
    interface SallaOrders {
        /**
          * Load more text
         */
        "loadMoreText": string;
        /**
          * Query Parameter to send along with the fetch request
         */
        "params": OrderQueryParameters;
    }
    interface SallaPayments {
        /**
          * Array of the payments/items that are not supported, ex: ["sbc", "made-in-ksa", "cod", "mada", ""].
          * @default []
         */
        "exclude": string[];
    }
    interface SallaPlaceholder {
        /**
          * Defines the alignment of contents. Defaults to [`left`]
          * @default 'left'
         */
        "alignment": 'left' | 'center' | 'right';
        /**
          * Custom icon to display, defaults to [`Inbox`], can be any valid svg icon or inline element with font icon
          * @default Inbox
         */
        "icon": string;
        /**
          * The size of the icon. Defaults to [`md`] = 45px for font icon & width/height: 3.5rem for svg icon
          * @default 'md'
         */
        "iconSize": 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl';
    }
    interface SallaPriceRange {
        /**
          * Currently selected price filter data
         */
        "filtersData": any;
        /**
          * Maximum price threshold value
         */
        "maxPrice": any;
        /**
          * Minimum price threshold value
         */
        "minPrice": any;
        /**
          * Product price range filter option object instance
         */
        "option": Filter;
        /**
          * reset the price range inputs
         */
        "reset": () => Promise<void>;
    }
    interface SallaProductAvailability {
        /**
          * Notification channels
         */
        "channels": 'sms' | 'email' | 'sms,email';
        /**
          * is current user already subscribed
          * @default false
         */
        "isSubscribed": boolean;
        /**
          * Listen to product options availability.
          * @default false
         */
        "notifyOptionsAvailability": boolean;
        /**
          * product id that can visitor subscribe to its availability notification
         */
        "productId": number;
    }
    interface SallaProductCard {
        /**
          * Full image card.
         */
        "fullImage": boolean;
        /**
          * Hide add to cart button.
         */
        "hideAddBtn": boolean;
        /**
          * Horizontal card.
         */
        "horizontal": boolean;
        /**
          * Special card.
         */
        "isSpecial": boolean;
        /**
          * Minimal card.
         */
        "minimal": boolean;
        /**
          * Product information.
         */
        "product": string | object;
        /**
          * Support shadow on hover.
         */
        "shadowOnHover": boolean;
        /**
          * Show quantity.
         */
        "showQuantity": boolean;
    }
    interface SallaProductOptions {
        /**
          * Configuration for customizing the display layout of product options. The `config` prop accepts a JSON string that specifies the layout type for rendering options. It allows customization of how single-option and multiple-option selections are displayed.  Example Usage: ```html <salla-product-options    options="{{ product.options }}"    product-id="{{ product.id }}"    unique-key="abc123"   config='{     "single-option": { "type": "button" },     "multiple-option": { "type": "button" }   }'> </salla-product-options> ```  Example Config JSON: ```json {   "single-option": { "type": "button" },   "multiple-option": { "type": "default" } } ```  - `single-option`:   - Defines the display style for single-option selections.   - `type`: Supported values:     - `"button"`: Displays options in a button-style grid layout.     - `"default"`: Displays options as a dropdown (default).  - `multiple-option`:   - Defines the display style for multiple-option selections.   - `type`: Supported values:     - `"button"`: Displays options in a button-style grid layout.     - `"default"`: Displays options as a list of checkboxes (default).
         */
        "config": string;
        /**
          * Get a specific option by its id.
         */
        "getOption": (option_id: any) => Promise<Option1>;
        /**
          * Get selected options.
         */
        "getSelectedOptions": () => Promise<any[]>;
        /**
          * Get the id's of the selected options.
         */
        "getSelectedOptionsData": () => Promise<{}>;
        /**
          * Return true if there is any out of stock options are selected and vise versa.
         */
        "hasOutOfStockOption": () => Promise<boolean>;
        /**
          * Hide the out of stock label. Will be used in the case of live validation such as cart page and inline checkout
         */
        "hideOutLabel": string;
        /**
          * Product detail information.
         */
        "options": string;
        /**
          * The id of the product to which the options are going to be fetched for.
          * @default salla.config.get('page.id')
         */
        "productId": number;
        /**
          * Report options form validity.
         */
        "reportValidity": () => Promise<boolean>;
        /**
          * Sets the options data for the product
          * @param optionsData - Array of product options
         */
        "setOptionsData": (optionsData: Option1[]) => Promise<void>;
        /**
          * A unique key used to generate distinct identifiers.  This key is appended to a default value to ensure uniqueness across instances or components where differentiation is required.
         */
        "uniqueKey": string;
    }
    interface SallaProductSizeGuide {
        /**
          * Hide the size-guide modal window
         */
        "close": () => Promise<HTMLElement>;
        /**
          * Show the size-guide modal window
         */
        "open": (product_id: number) => Promise<any>;
    }
    interface SallaProductsList {
        /**
          * Autoload next page when scroll
          * @default false
         */
        "autoload": boolean;
        /**
          * should listen to filters events `salla-filters::changed` and re-render
         */
        "filtersResults": boolean;
        /**
          * Horizontal cards
         */
        "horizontalCards": boolean;
        /**
          * Specifies additional data to be included in the product fetch response. The value can be an array of strings or a JSON string.  Example: - As an array: includes=["options"] - As a JSON string: includes='["options", "metadata", 'images']'  The array or JSON string can include: - "options": Include product options in the response. - "images": Include product images in the response.
         */
        "includes": string[];
        /**
          * Limit for number of products in the list.
         */
        "limit": number;
        /**
          * Load more text
         */
        "loadMoreText": string;
        /**
          * Custom Card Component for the Salla Products List.  This component allows you to customize the appearance of individual product cards within a Salla Products List.
          * @example <salla-products-list product-card-component="my-custom-card-style1" ... <salla-products-list product-card-component="my-custom-card-style2" ...
          * @default 'custom-salla-product-card'
         */
        "productCardComponent": string;
        /**
          * Reload the list of products (entire content of the component).
         */
        "reload": () => Promise<void>;
        /**
          * Row cards
         */
        "rowCards": boolean;
        /**
          * Set parsed filters data from URI
          * @param filters
         */
        "setFilters": (filters: any) => Promise<void>;
        /**
          * Sorting the list of products
         */
        "sortBy"?: string | 'ourSuggest' | 'bestSell' | 'topRated' | 'priceFromTopToLow' | 'priceFromLowToTop';
        /**
          * The source of the products list
          * @type {string}
         */
        "source": 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'search' | 'tags' | 'selected' | 'offers' | 'landing-page' | 'sales' | 'wishlist' | 'top-rated';
        /**
          * The source value, cloud be different values as following: - array of ids when `source` in ['categories', 'brands', 'tags', 'selected'] - keyword when `source` = 'search' - products payload when `source` = 'json' - product_id when `source` = 'related'
          * @type {string}
         */
        "sourceValue": any;
    }
    interface SallaProductsSlider {
        /**
          * autoplay option for products slider
         */
        "autoplay": boolean;
        /**
          * Title of the block - works only if slider is true
          * @type {string}
          * @default ''
         */
        "blockTitle": string;
        /**
          * Display 'ALL' URL
          * @type {string}
          * @default ''
         */
        "displayAllUrl": string;
        /**
          * Specifies additional data to be included in the product fetch response. The value can be an array of strings or a JSON string.  Example: - As an array: includes=["options"] - As a JSON string: includes='["options"]'  The array or JSON string can include: - "options": Include product options in the response. - "images": Include product images in the response.
         */
        "includes": string[];
        /**
          * Limit for number of products in the list.
         */
        "limit": number;
        /**
          * Custom Card Component for the Salla Products Slider.  This component allows you to customize the appearance of individual product cards within a Salla Products Slider.
          * @example <salla-products-slider product-card-component="my-custom-card-style1" ... <salla-products-slider product-card-component="my-custom-card-style2" ...
          * @default 'custom-salla-product-card'
         */
        "productCardComponent": string;
        /**
          * Slider Configs refer to https://swiperjs.com/swiper-api#parameters and pass the entire config object
          * @example let productsSlider = document.querySelector('salla-products-slider');  productsSlider.sliderConfig = {  slidesPerView: 1,  spaceBetween : 30,  lazy: true, }
         */
        "sliderConfig": any;
        /**
          * Slider Id, if not provided will be generated automatically
          * @type {string}
          * @default ''
         */
        "sliderId": string;
        /**
          * Source of the products, if api will get the products from the API, if json will get the products from the products prop
          * @type {string}
          * @default ''
         */
        "source": 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'tags' | 'selected' | 'offers' | 'landing-page' | 'wishlist' | 'top-rated';
        /**
          * The source value, cloud be different values as following: - array of ids when `source` in ['categories', 'brands', 'tags', 'selected'] - products payload when `source` = 'json' - product_id when `source` = 'related'
          * @type {string}
         */
        "sourceValue": string;
        /**
          * Sub title of the block - works only if slider is true
          * @type {string}
          * @default ''
         */
        "subTitle": string;
    }
    interface SallaProgressBar {
        /**
          * Progress bar color, defaults to: `salla.config.get('theme.color.primary', "#ffd5c4")`
         */
        "color": string;
        /**
          * You can just pass the donation as json string ex: `{"target_message":null,"target_date":"2023-04-18","target_end_date":"2023-04-18","target_amount":400,"collected_amount":380,"can_donate":true}`
         */
        "donation": string | Donation;
        /**
          * Big Title, before the progress bar.
         */
        "header": string;
        /**
          * Set height for the wrapper.
          * @default "10px"
         */
        "height": string;
        /**
          * Hide units above the progress bar
         */
        "hideUnits": boolean;
        /**
          * Subtitle under the progress bar or instead of it if the target not being set.
         */
        "message": string;
        /**
          * Stripped effect for tje progress bar.
         */
        "stripped": boolean;
        /**
          * The goal of the progress bar
         */
        "target": number;
        /**
          * The unite to be added after the numbers, defaults to: `salla.config.currency().symbol`
         */
        "unit": string;
        /**
          * The progress so far as of the goal.
         */
        "value": number;
    }
    interface SallaQuantityInput {
        /**
          * Cart Item Id
         */
        "cartItemId": any;
        /**
          * decrease quantity by one.
          * @return HTMLSallaQuantityInputElement
         */
        "decrease": () => Promise<HTMLElement>;
        /**
          * increase quantity by one.
          * @return HTMLSallaQuantityInputElement
         */
        "increase": () => Promise<HTMLElement>;
        /**
          * set quantity by one.
          * @return HTMLSallaQuantityInputElement
         */
        "setValue": (value: any, fireChangeEvent?: boolean) => Promise<HTMLElement>;
    }
    interface SallaQuickBuy {
        /**
          * Product amount in base currency (SAR).
          * @type {number}
          * @default 0
         */
        "amount": number;
        /**
          * Show Apple Pay only
          * @type {boolean}
         */
        "applePayOnly": boolean;
        /**
          * Cart ID, when you need to applePay for existed cart
          * @type {string}
         */
        "cartId": string;
        /**
          * base currency
          * @type {string}
          * @default SAR
         */
        "currency": string;
        /**
          * To be passed to purchaseNow request
          * @type {boolean}
         */
        "isRequireShipping": boolean;
        /**
          * Product options, if is empty will get the data from the document.querySelector('salla-product-options[product-id="X"]')
          * @type {object}
          * @default {}
         */
        "options": {};
        /**
          * Product ID.
          * @type {string}
         */
        "productId": string;
        /**
          * Button type.
          * @type {string}
          * @default buy
         */
        "type": 'plain' | 'buy' | 'donate' | 'book' | 'pay' | 'order';
    }
    interface SallaQuickOrder {
        /**
          * agreement text from server or from props
          * @default salla.lang.get(     'pages.checkout.show_full_agreement'   )
         */
        "agreementText": string;
        /**
          * quick order confirm pay button text
          * @default 'اشتر الآن'
         */
        "confirmPayButtonTitle": string;
        /**
          * is email required
          * @default false
         */
        "isEmailRequired": boolean;
        /**
          * quick order pay button text
          * @default 'اطلب المنتج'
         */
        "payButtonTitle": string;
        /**
          * product id local or from page
         */
        "productId": string;
        /**
          * Quick Order Style
          * @default 'default'
         */
        "quickOrderStyle": 'gray' | 'white' | 'default';
        /**
          * quick order title
          * @default 'ليش تنتظر؟'
         */
        "quickOrderTitle": string;
        /**
          * quick order sub title
          * @default 'احصل على المنتج مباشرة الآن'
         */
        "subTitle": string;
        /**
          * product id local or from page
         */
        "thanksMessage": string;
    }
    interface SallaRatingModal {
        /**
          * Show the rating modal
         */
        "close": () => Promise<HTMLElement>;
        /**
          * Show the rating modal
         */
        "open": () => Promise<unknown>;
        /**
          * The order id, to rate on its products & shipping
         */
        "orderId": number;
    }
    interface SallaRatingStars {
        /**
          * Allows the rating to be editable.
          * @default false
         */
        "editable": boolean;
        /**
          * Sets input name.
          * @default 'rating'
         */
        "name": string;
        /**
          * Number of reviews to display.
          * @default 0
         */
        "reviews": number;
        /**
          * Sets the height and width of the component. Defaults to medium.
          * @default 'medium'
         */
        "size": "large" | "medium" | "small" | "mini";
        /**
          * The rating value.
         */
        "value": number;
        /**
          * Show the description label.
         */
        "withLabel": boolean;
    }
    interface SallaReviewCard {
        "review": Partial<Review>;
    }
    interface SallaReviews {
        /**
          * Controls the visibility of a link to the reviews page.  When set to `true`, a link will be displayed allowing users to navigate to the full reviews section.
          * @type {boolean}
         */
        "displayAllLink": boolean;
        /**
          * Specifies whether to hide customer information in the component. When set to true, customer information will be hidden. Defaults to false, meaning customer information will be displayed.
          * @default false
         */
        "hideCustomerInfo": boolean;
        /**
          * Defines the maximum number of reviews to retrieve from the API.
          * @type {number}
          * @default 5
         */
        "limit": number;
        /**
          * Specifies the sorting criteria for the fetched reviews. Available options: - "top_rating": Sorts reviews based on top ratings. - "random": Sorts reviews randomly. - "latest": Sorts reviews based on the latest ones (default).
          * @type {SortingOption}
          * @default latest
         */
        "sort": SortingOption;
        /**
          * Specifies the data source for reviews.  Valid options include:  - 'categories': Retrieves reviews for specific product categories.  - 'products': Retrieves reviews for individual products.  - 'json': Retrieves reviews from a custom JSON payload provided in `sourceValue`.  When using 'json' as the source, a valid payload must be provided in `sourceValue`.
          * @type {Source}
          * @default "store"
         */
        "source"?: Source;
        /**
          * Provides data specific to the chosen source.  Required when using 'categories', 'products', or 'json' as the source:   - 'categories': An array of category IDs.   - 'products': An array of product IDs.   - 'json': A custom JSON object containing review data.
          * @type {string | object | Array<number>}
         */
        "sourceValue"?: string | object | Array<number>;
        /**
          * Specifies the type of reviews to fetch. Available options: - "all": Fetches reviews from all sources. - "store": Fetches reviews specific to the store. - "products": Fetches reviews specific to products.
          * @type {ReviewType}
          * @default store
         */
        "type": ReviewType;
    }
    interface SallaReviewsPage {
    }
    interface SallaReviewsSummary {
        /**
          * Product ID
         */
        "itemId": number;
    }
    interface SallaScopes {
        /**
          * Closes the scope modal.
         */
        "close": () => Promise<HTMLElement>;
        /**
          * Submit form to change exsiting scope.
         */
        "handleSubmit": () => Promise<any>;
        /**
          * Opens the scope modal.
         */
        "open": (mode?: any, product_id?: number) => Promise<any>;
        /**
          * Dictates when to show the search field
          * @default 6
         */
        "searchDisplayLimit": number;
        /**
          * Optionally open the modal or enforce the pop-up to the viewer
          * @default 'optional'
         */
        "selection": 'optional' | 'mandatory';
    }
    interface SallaSearch {
        /**
          * Sets the height of the input
          * @default 60
         */
        "height": number;
        /**
          * Set the component display without modal window. Defaults to `false`
          * @default false
         */
        "inline": boolean;
        /**
          * Maximum number of words allowed in the input
          * @default 5
         */
        "maxWords": number;
        /**
          * Adds a border radius to the input. Half of the height.
          * @default false
         */
        "oval": boolean;
        /**
          * Show submit action buttons at the end.
          * @default false
         */
        "showAction": boolean;
    }
    interface SallaSkeleton {
        /**
          * Set the skeleton height
          * @default '100%'
         */
        "height": string;
        /**
          * Set the shape type of the skeleton is it circle or normal
          * @default 'normal'
         */
        "type": 'circle' | 'normal';
        /**
          * Set the skeleton width
          * @default '100%'
         */
        "width": string;
    }
    interface SallaSlider {
        /**
          * Show/hide display all button beside arrows
          * @default false
         */
        "arrowsCentered": boolean;
        /**
          * Auto Height slider
          * @default false
         */
        "autoHeight": boolean;
        /**
          * Enable autoplay  - working with `type="carousel" only`
          * @default false
         */
        "autoPlay": boolean;
        /**
          * Show/hide slider block sub title
          * @default ''
         */
        "blockSubtitle": string;
        /**
          * Show/hide slider block title
          * @default ''
         */
        "blockTitle": string;
        /**
          * Enable center mode  - working with `type="carousel" only`
          * @default false
         */
        "centered": boolean;
        /**
          * Show/hide arrows
          * @default false
         */
        "controlsOuter": boolean;
        /**
          * Slider direction. Default: document.documentElement.dir
         */
        "direction": string;
        /**
          * Show/hide display all button beside arrows
          * @default ''
         */
        "displayAllUrl": string;
        /**
          * Get slider slides *
         */
        "getSlides": () => Promise<any>;
        /**
          * Get thumbs slider slides *
         */
        "getThumbsSlides": () => Promise<any>;
        /**
          * Get thumbs slider updateSize *
         */
        "getThumbsUpdateSize": () => Promise<any>;
        /**
          * Disable thumbs slider and show it as a grid
          * @default false
         */
        "gridThumbs": boolean;
        /**
          * Enable call a specific slide by index from thumbnails option in `salla-slider-options` component, works only if `data-img-id` and `data-slid-index` attributes are set on each slide
          * @default false
         */
        "listenToThumbnailsOption": boolean;
        /**
          * Run slider in loop, Don't use it for slides with custom components inside it, because it may cause re-render issue
          * @default false
         */
        "loop": boolean;
        /**
          * Enable pagination
          * @default false
         */
        "pagination": boolean;
        /**
          * Show/hide arrows
          * @default true
         */
        "showControls": boolean;
        /**
          * Show/hide thumbs slider arrows
          * @default true
         */
        "showThumbsControls": boolean;
        /**
          * Run transition to the next slide.
          * @param speed - Transition duration (in ms).
          * @param runCallbacks - Set it to false (by default it is true) and transition will not produce transition events. *
         */
        "slideNext": (speed?: number, runCallbacks?: boolean) => Promise<void>;
        /**
          * Does the same as .slideNext but for the case when used with enabled loop. So this method will slide to next slide with realIndex matching to next index
          * @param speed - Transition duration (in ms).
          * @param runCallbacks - Set it to false (by default it is true) and transition will not produce transition events. *
         */
        "slideNextLoop": (speed?: number, runCallbacks?: boolean) => Promise<void>;
        /**
          * Run transition to the previous slide.
          * @param speed - Transition duration (in ms).
          * @param runCallbacks - Set it to false (by default it is true) and transition will not produce transition events. *
         */
        "slidePrev": (speed?: number, runCallbacks?: boolean) => Promise<void>;
        /**
          * Does the same as .slidePrev but for the case when used with enabled loop. So this method will slide to previous slide with realIndex matching to previous index
          * @param speed - Transition duration (in ms).
          * @param runCallbacks - Set it to false (by default it is true) and transition will not produce transition events. *
         */
        "slidePrevLoop": (speed?: number, runCallbacks?: boolean) => Promise<void>;
        /**
          * Reset slider position to currently active slide for the duration equal to 'speed' parameter.
          * @param speed - Transition duration (in ms).
          * @param runCallbacks - Set it to false (by default it is true) and transition will not produce transition events. *
         */
        "slideReset": (speed?: number, runCallbacks?: boolean) => Promise<void>;
        /**
          * Run transition to the slide with index number equal to 'index' parameter for the duration equal to 'speed' parameter.
          * @param index - Index number of slide.
          * @param speed - Transition duration (in ms).
          * @param runCallbacks - Set it to false (by default it is true) and transition will not produce transition events. *
         */
        "slideTo": (index: number, speed?: number, runCallbacks?: boolean) => Promise<any>;
        /**
          * Reset slider position to closest slide/snap point for the duration equal to 'speed' parameter.
          * @param speed - Transition duration (in ms).
          * @param runCallbacks - Set it to false (by default it is true) and transition will not produce transition events. *
         */
        "slideToClosest": (speed?: number, runCallbacks?: boolean) => Promise<void>;
        /**
          * Does the same as .slideTo but for the case when used with enabled loop. So this method will slide to slides with realIndex matching to passed index
          * @param speed - Transition duration (in ms).
          * @param runCallbacks - Set it to false (by default it is true) and transition will not produce transition events. *
         */
        "slideToLoop": (index: number, speed?: number, runCallbacks?: boolean) => Promise<void>;
        /**
          * Slider Configs refer to https://swiperjs.com/swiper-api#parameters and pass the entire config object
          * @example let slider = document.querySelector('salla-slider');  slider.sliderConfig = {  slidesPerView: 1,  spaceBetween : 30,  lazy: true, }
         */
        "sliderConfig": any;
        /**
          * Get thumbs slider update *
         */
        "sliderInit": () => Promise<any>;
        /**
          * Returns the Swiper instance to allow direct manipulation
          * @returns The Swiper slider instance
         */
        "sliderInstance": () => Promise<any>;
        /**
          * slidesPerView
          * @default "auto"
         */
        "slidesPerView": string;
        /**
          * Thumbs Slider Configs refer to https://swiperjs.com/swiper-api#parameters and pass the entire config object
          * @example let slider = document.querySelector('salla-slider');  slider.thumbsConfig = {  slidesPerView: 1,  spaceBetween : 30,  lazy: true, }
         */
        "thumbsConfig": any;
        /**
          * Does the same as .slideTo but for the case when used with enabled loop. So this method will slide to slides with realIndex matching to passed index
          * @param speed - Transition duration (in ms).
          * @param runCallbacks - Set it to false (by default it is true) and transition will not produce transition events. *
         */
        "thumbsSlideTo": (index: number, speed?: number, runCallbacks?: boolean) => Promise<any>;
        /**
          * Get thumbs slider update *
         */
        "thumbsSliderInit": () => Promise<any>;
        /**
          * Get thumbs slider slides *
         */
        "thumbsSliderInstance": () => Promise<any>;
        /**
          * Get thumbs slider update *
         */
        "thumbsSliderUpdate": () => Promise<any>;
        /**
          * Get thumbs slider updateSlides *
         */
        "thumbsSliderUpdateSlides": () => Promise<any>;
        /**
          * Set the type of the slider Default: ''
          * @default ''
         */
        "type": 'carousel' | 'fullscreen' | 'thumbs' | 'default' | 'hero' | 'testimonials' | 'blog' | 'fullwidth' | '';
        /**
          * You should call it after you add/remove slides manually, or after you hide/show it, or do any custom DOM modifications with Swiper This method also includes subcall of the following methods which you can use separately: *
         */
        "update": () => Promise<void>;
        /**
          * Force slider to update its height (when autoHeight enabled) for the duration equal to 'speed' parameter
          * @param speed - Transition duration (in ms). *
         */
        "updateAutoHeight": (speed?: number) => Promise<void>;
        /**
          * recalculate slider progress *
         */
        "updateProgress": () => Promise<void>;
        /**
          * Get slider slides *
         */
        "updateSize": () => Promise<any>;
        /**
          * recalculate number of slides and their offsets. Useful after you add/remove slides with JavaScript *
         */
        "updateSlides": () => Promise<void>;
        /**
          * update active/prev/next classes on slides and bullets *
         */
        "updateSlidesClasses": () => Promise<void>;
        /**
          * Vertical or Horizontal main slider
          * @default false
         */
        "vertical": boolean;
        /**
          * Vertical or Horizontal thumbs slider
          * @default false
         */
        "verticalThumbs": boolean;
    }
    interface SallaSocial {
    }
    interface SallaSocialShare {
        /**
          * Activate or open the share menu.
         */
        "open": () => Promise<void>;
        /**
          * selected platforms to share | all platforms
          * @default 'facebook,twitter,whatsapp,email,copy_link'
         */
        "platforms": string;
        /**
          * Asynchronously initializes the "AddToAny" (a2a) social sharing tool on the current page. If the global object `window.a2a` is available, it initializes the tool with the 'page' mode. The 'page' mode is typically used to enable sharing of the current webpage.
          * @remarks This function is designed to be used in scenarios where dynamic loading or refreshing of social sharing tools is needed. Ensure that the AddToAny script is properly included in the HTML document before calling this function.
          * @example // Call the refresh function to initialize AddToAny on the page. await refresh();
          * @throws {Error} Throws an error if the AddToAny script is not properly included or if there are issues during initialization.
          * @async 
          * @returns A promise that resolves once the initialization is complete.
         */
        "refresh": () => Promise<void>;
        /**
          * page url that will be shared custom | current page url
          * @default ""
         */
        "url": string;
        /**
          * page url name that will be shared custom | current page url
          * @default ""
         */
        "urlName": string;
    }
    interface SallaTabContent {
        /**
          * Expose self for the parent.
         */
        "getChild": () => Promise<{ selected: any; unselect: any; name: string; }>;
        /**
          * Set name of the tab content. Mainly used as a key to s ynchronize the content with it's respective header.
         */
        "name": string;
    }
    interface SallaTabHeader {
        /**
          * The class applied to the currently active(selected) tab
          * @default undefined
         */
        "activeClass": string;
        /**
          * Center tab items in the given flex.
          * @default false
         */
        "centered": boolean;
        /**
          * Expose self for the parent.
         */
        "getChild": () => Promise<{ selected: any; unselect: any; name: string; id: string; }>;
        /**
          * Set the height of the tab bar
          * @default undefined
         */
        "height": number | string;
        /**
          * Header identifier name to sync with the content.
         */
        "name": string;
    }
    interface SallaTabs {
        /**
          * Background color
          * @default undefined
         */
        "backgroundColor": string;
        /**
          * Align tabs vertically.
          * @default false
         */
        "vertical": boolean;
    }
    interface SallaTelInput {
        /**
          * Automatically focus telephone input
         */
        "autofocus": boolean;
        /**
          * Current country_code
          * @default salla.config.get('user.country_code', 'SA') || 'SA'
         */
        "countryCode": string;
        /**
          * input name
          * @default false
         */
        "disabled": boolean;
        /**
          * Get current values
          * @return
         */
        "getValues": () => Promise<{ [x: string]: any; countryCode: string; countryKey: any; }>;
        /**
          * Is current data valid or not
          * @return
         */
        "isValid": () => Promise<boolean>;
        /**
          * input name
          * @default 'phone'
         */
        "name": string;
        /**
          * Current mobile number
         */
        "phone": string;
    }
    interface SallaTooltip {
        /**
          * The ID of the target element to which the tooltip is attached
         */
        "targetId": string;
        /**
          * The text content to display in the tooltip
         */
        "text": string;
    }
    interface SallaUserMenu {
        /**
          * To display the trigger as an avatar only
          * @default false
         */
        "avatarOnly": boolean;
        /**
          * To display only the list without the dropdown functionality
          * @default false
         */
        "inline": boolean;
        /**
          * To Make the dropdown menu relative to parent element or not
          * @default false
         */
        "relativeDropdown": boolean;
        /**
          * To display the dropdown header in mobile sheet
          * @default false
         */
        "showHeader": boolean;
    }
    /**
     * The SallaUserProfile is a versatile user profile form 
     * generator within the Salla platform, offering localization support, 
     * customizable fields, and seamless integration with the Salla API. 
     * It dynamically fetches translated strings for labels and messages from the 
     * Salla localization object, allowing for a multilingual user interface. Users 
     * can extend the default form with custom fields through the `customFields`
     * property and the setCustomFields method. The component manages user data 
     * retrieval from the Salla configuration and includes fields for first name, 
     * last name, birthday, gender, email, mobile, and custom additions. Form 
     * validation and submission are handled through various event handlers, ensuring 
     * proper field handling and user input validation. The component supports file 
     * uploads for photo fields and includes a dedicated phone number input field. 
     * The componentWillLoad lifecycle method fetches additional user profile 
     * information from the API during initialization. Overall, this component 
     * provides an efficient and adaptable solution for creating user profiles with a 
     * rich set of features and customization options.
     */
    interface SallaUserProfile {
        /**
          * Custome fields to be rendered in addition to the default ones.
         */
        "customFields": string;
        /**
          * The minimum allowed age for a user. Users with a birthdate indicating an age less than this value will be considered invalid. Defaults to 10.
          * @type {number}
          * @default 10
         */
        "minAge": number;
        /**
          * Sets custom fields for the component. Can be handy for non HTML usage.
          * @param fields - An array of custom fields.
         */
        "setCustomFields": (fields: CustomField[]) => Promise<void>;
    }
    interface SallaUserSettings {
    }
    interface SallaVerify {
        /**
          * should auto reloading the page after success verification
          * @default true
         */
        "autoReload": boolean;
        /**
          * Should render component without modal
          * @default 'modal'
         */
        "display": 'inline' | 'modal';
        /**
          * Get current code
          * @return
         */
        "getCode": () => Promise<string>;
        /**
          * Open verifying modal
          * @param data
         */
        "open": (data: any) => Promise<void>;
        /**
          * Once the api verify success, it will be login the customer in web pages
          * @default true
         */
        "supportWebAuth": boolean;
        /**
          * Verifying method
          * @default 'mobile'
         */
        "type": 'mobile' | 'email';
    }
    interface SallaWallet {
    }
}
export interface SallaAddProductButtonCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaAddProductButtonElement;
}
export interface SallaBookingFieldCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaBookingFieldElement;
}
export interface SallaColorPickerCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaColorPickerElement;
}
export interface SallaDatetimePickerCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaDatetimePickerElement;
}
export interface SallaFileUploadCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaFileUploadElement;
}
export interface SallaFiltersCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaFiltersElement;
}
export interface SallaFiltersWidgetCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaFiltersWidgetElement;
}
export interface SallaLoyaltyPrizeItemCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaLoyaltyPrizeItemElement;
}
export interface SallaMapCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaMapElement;
}
export interface SallaModalCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaModalElement;
}
export interface SallaPriceRangeCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaPriceRangeElement;
}
export interface SallaProductOptionsCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaProductOptionsElement;
}
export interface SallaProductsListCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaProductsListElement;
}
export interface SallaQuickOrderCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaQuickOrderElement;
}
export interface SallaSliderCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaSliderElement;
}
export interface SallaTabHeaderCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaTabHeaderElement;
}
export interface SallaTelInputCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaTelInputElement;
}
export interface SallaVerifyCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSallaVerifyElement;
}
declare global {
    interface HTMLSallaAddProductButtonElementEventMap {
        "success": any;
        "failed": any;
    }
    interface HTMLSallaAddProductButtonElement extends Components.SallaAddProductButton, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaAddProductButtonElementEventMap>(type: K, listener: (this: HTMLSallaAddProductButtonElement, ev: SallaAddProductButtonCustomEvent<HTMLSallaAddProductButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaAddProductButtonElementEventMap>(type: K, listener: (this: HTMLSallaAddProductButtonElement, ev: SallaAddProductButtonCustomEvent<HTMLSallaAddProductButtonElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaAddProductButtonElement: {
        prototype: HTMLSallaAddProductButtonElement;
        new (): HTMLSallaAddProductButtonElement;
    };
    interface HTMLSallaAdvertisementElement extends Components.SallaAdvertisement, HTMLStencilElement {
    }
    var HTMLSallaAdvertisementElement: {
        prototype: HTMLSallaAdvertisementElement;
        new (): HTMLSallaAdvertisementElement;
    };
    interface HTMLSallaAppInstallAlertElement extends Components.SallaAppInstallAlert, HTMLStencilElement {
    }
    var HTMLSallaAppInstallAlertElement: {
        prototype: HTMLSallaAppInstallAlertElement;
        new (): HTMLSallaAppInstallAlertElement;
    };
    interface HTMLSallaAppsIconsElement extends Components.SallaAppsIcons, HTMLStencilElement {
    }
    var HTMLSallaAppsIconsElement: {
        prototype: HTMLSallaAppsIconsElement;
        new (): HTMLSallaAppsIconsElement;
    };
    interface HTMLSallaBookingFieldElementEventMap {
        "invalidInput": any;
    }
    interface HTMLSallaBookingFieldElement extends Components.SallaBookingField, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaBookingFieldElementEventMap>(type: K, listener: (this: HTMLSallaBookingFieldElement, ev: SallaBookingFieldCustomEvent<HTMLSallaBookingFieldElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaBookingFieldElementEventMap>(type: K, listener: (this: HTMLSallaBookingFieldElement, ev: SallaBookingFieldCustomEvent<HTMLSallaBookingFieldElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaBookingFieldElement: {
        prototype: HTMLSallaBookingFieldElement;
        new (): HTMLSallaBookingFieldElement;
    };
    interface HTMLSallaBottomAlertElement extends Components.SallaBottomAlert, HTMLStencilElement {
    }
    var HTMLSallaBottomAlertElement: {
        prototype: HTMLSallaBottomAlertElement;
        new (): HTMLSallaBottomAlertElement;
    };
    /**
     * @name SallaBreadcrumb
     * @description A StencilJS component for rendering breadcrumb navigation.
     * @tag salla-breadcrumb
     */
    interface HTMLSallaBreadcrumbElement extends Components.SallaBreadcrumb, HTMLStencilElement {
    }
    var HTMLSallaBreadcrumbElement: {
        prototype: HTMLSallaBreadcrumbElement;
        new (): HTMLSallaBreadcrumbElement;
    };
    interface HTMLSallaButtonElement extends Components.SallaButton, HTMLStencilElement {
    }
    var HTMLSallaButtonElement: {
        prototype: HTMLSallaButtonElement;
        new (): HTMLSallaButtonElement;
    };
    interface HTMLSallaCartItemOffersElement extends Components.SallaCartItemOffers, HTMLStencilElement {
    }
    var HTMLSallaCartItemOffersElement: {
        prototype: HTMLSallaCartItemOffersElement;
        new (): HTMLSallaCartItemOffersElement;
    };
    interface HTMLSallaCartSummaryElement extends Components.SallaCartSummary, HTMLStencilElement {
    }
    var HTMLSallaCartSummaryElement: {
        prototype: HTMLSallaCartSummaryElement;
        new (): HTMLSallaCartSummaryElement;
    };
    interface HTMLSallaColorPickerElementEventMap {
        "colorChanged": Color;
        "invalidInput": any;
        "submitted": Color;
        "popupOpened": Color;
        "popupClosed": Color;
    }
    interface HTMLSallaColorPickerElement extends Components.SallaColorPicker, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaColorPickerElementEventMap>(type: K, listener: (this: HTMLSallaColorPickerElement, ev: SallaColorPickerCustomEvent<HTMLSallaColorPickerElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaColorPickerElementEventMap>(type: K, listener: (this: HTMLSallaColorPickerElement, ev: SallaColorPickerCustomEvent<HTMLSallaColorPickerElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaColorPickerElement: {
        prototype: HTMLSallaColorPickerElement;
        new (): HTMLSallaColorPickerElement;
    };
    interface HTMLSallaCommentFormElement extends Components.SallaCommentForm, HTMLStencilElement {
    }
    var HTMLSallaCommentFormElement: {
        prototype: HTMLSallaCommentFormElement;
        new (): HTMLSallaCommentFormElement;
    };
    interface HTMLSallaCommentItemElement extends Components.SallaCommentItem, HTMLStencilElement {
    }
    var HTMLSallaCommentItemElement: {
        prototype: HTMLSallaCommentItemElement;
        new (): HTMLSallaCommentItemElement;
    };
    interface HTMLSallaCommentsElement extends Components.SallaComments, HTMLStencilElement {
    }
    var HTMLSallaCommentsElement: {
        prototype: HTMLSallaCommentsElement;
        new (): HTMLSallaCommentsElement;
    };
    /**
     * its to easy to use, currenlty its support select & checkbox input as trigger for show/hide the dom
     * the dom you can put it like this data-show-when="{name of the field} {= or !=} {value of the field}"
     */
    interface HTMLSallaConditionalFieldsElement extends Components.SallaConditionalFields, HTMLStencilElement {
    }
    var HTMLSallaConditionalFieldsElement: {
        prototype: HTMLSallaConditionalFieldsElement;
        new (): HTMLSallaConditionalFieldsElement;
    };
    interface HTMLSallaConditionalOfferElement extends Components.SallaConditionalOffer, HTMLStencilElement {
    }
    var HTMLSallaConditionalOfferElement: {
        prototype: HTMLSallaConditionalOfferElement;
        new (): HTMLSallaConditionalOfferElement;
    };
    interface HTMLSallaContactsElement extends Components.SallaContacts, HTMLStencilElement {
    }
    var HTMLSallaContactsElement: {
        prototype: HTMLSallaContactsElement;
        new (): HTMLSallaContactsElement;
    };
    interface HTMLSallaCountDownElement extends Components.SallaCountDown, HTMLStencilElement {
    }
    var HTMLSallaCountDownElement: {
        prototype: HTMLSallaCountDownElement;
        new (): HTMLSallaCountDownElement;
    };
    interface HTMLSallaDatetimePickerElementEventMap {
        "picked": any;
        "invalidInput": any;
    }
    interface HTMLSallaDatetimePickerElement extends Components.SallaDatetimePicker, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaDatetimePickerElementEventMap>(type: K, listener: (this: HTMLSallaDatetimePickerElement, ev: SallaDatetimePickerCustomEvent<HTMLSallaDatetimePickerElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaDatetimePickerElementEventMap>(type: K, listener: (this: HTMLSallaDatetimePickerElement, ev: SallaDatetimePickerCustomEvent<HTMLSallaDatetimePickerElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaDatetimePickerElement: {
        prototype: HTMLSallaDatetimePickerElement;
        new (): HTMLSallaDatetimePickerElement;
    };
    interface HTMLSallaFileUploadElementEventMap {
        "added": { error: FilePondErrorDescription | null, file: FilePondFile };
        "invalidInput": any;
        "uploaded": string;
        "removed": FilePondFile;
    }
    interface HTMLSallaFileUploadElement extends Components.SallaFileUpload, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaFileUploadElementEventMap>(type: K, listener: (this: HTMLSallaFileUploadElement, ev: SallaFileUploadCustomEvent<HTMLSallaFileUploadElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaFileUploadElementEventMap>(type: K, listener: (this: HTMLSallaFileUploadElement, ev: SallaFileUploadCustomEvent<HTMLSallaFileUploadElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaFileUploadElement: {
        prototype: HTMLSallaFileUploadElement;
        new (): HTMLSallaFileUploadElement;
    };
    interface HTMLSallaFiltersElementEventMap {
        "changed": any;
    }
    interface HTMLSallaFiltersElement extends Components.SallaFilters, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaFiltersElementEventMap>(type: K, listener: (this: HTMLSallaFiltersElement, ev: SallaFiltersCustomEvent<HTMLSallaFiltersElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaFiltersElementEventMap>(type: K, listener: (this: HTMLSallaFiltersElement, ev: SallaFiltersCustomEvent<HTMLSallaFiltersElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaFiltersElement: {
        prototype: HTMLSallaFiltersElement;
        new (): HTMLSallaFiltersElement;
    };
    interface HTMLSallaFiltersWidgetElementEventMap {
        "changed": any;
    }
    interface HTMLSallaFiltersWidgetElement extends Components.SallaFiltersWidget, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaFiltersWidgetElementEventMap>(type: K, listener: (this: HTMLSallaFiltersWidgetElement, ev: SallaFiltersWidgetCustomEvent<HTMLSallaFiltersWidgetElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaFiltersWidgetElementEventMap>(type: K, listener: (this: HTMLSallaFiltersWidgetElement, ev: SallaFiltersWidgetCustomEvent<HTMLSallaFiltersWidgetElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaFiltersWidgetElement: {
        prototype: HTMLSallaFiltersWidgetElement;
        new (): HTMLSallaFiltersWidgetElement;
    };
    interface HTMLSallaGiftingElement extends Components.SallaGifting, HTMLStencilElement {
    }
    var HTMLSallaGiftingElement: {
        prototype: HTMLSallaGiftingElement;
        new (): HTMLSallaGiftingElement;
    };
    interface HTMLSallaInfiniteScrollElement extends Components.SallaInfiniteScroll, HTMLStencilElement {
    }
    var HTMLSallaInfiniteScrollElement: {
        prototype: HTMLSallaInfiniteScrollElement;
        new (): HTMLSallaInfiniteScrollElement;
    };
    interface HTMLSallaInstallmentElement extends Components.SallaInstallment, HTMLStencilElement {
    }
    var HTMLSallaInstallmentElement: {
        prototype: HTMLSallaInstallmentElement;
        new (): HTMLSallaInstallmentElement;
    };
    interface HTMLSallaListTileElement extends Components.SallaListTile, HTMLStencilElement {
    }
    var HTMLSallaListTileElement: {
        prototype: HTMLSallaListTileElement;
        new (): HTMLSallaListTileElement;
    };
    interface HTMLSallaLoadingElement extends Components.SallaLoading, HTMLStencilElement {
    }
    var HTMLSallaLoadingElement: {
        prototype: HTMLSallaLoadingElement;
        new (): HTMLSallaLoadingElement;
    };
    interface HTMLSallaLocalizationModalElement extends Components.SallaLocalizationModal, HTMLStencilElement {
    }
    var HTMLSallaLocalizationModalElement: {
        prototype: HTMLSallaLocalizationModalElement;
        new (): HTMLSallaLocalizationModalElement;
    };
    interface HTMLSallaLoginModalElement extends Components.SallaLoginModal, HTMLStencilElement {
    }
    var HTMLSallaLoginModalElement: {
        prototype: HTMLSallaLoginModalElement;
        new (): HTMLSallaLoginModalElement;
    };
    interface HTMLSallaLoyaltyElement extends Components.SallaLoyalty, HTMLStencilElement {
    }
    var HTMLSallaLoyaltyElement: {
        prototype: HTMLSallaLoyaltyElement;
        new (): HTMLSallaLoyaltyElement;
    };
    interface HTMLSallaLoyaltyPrizeItemElementEventMap {
        "prizeItemSelected": Item;
    }
    interface HTMLSallaLoyaltyPrizeItemElement extends Components.SallaLoyaltyPrizeItem, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaLoyaltyPrizeItemElementEventMap>(type: K, listener: (this: HTMLSallaLoyaltyPrizeItemElement, ev: SallaLoyaltyPrizeItemCustomEvent<HTMLSallaLoyaltyPrizeItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaLoyaltyPrizeItemElementEventMap>(type: K, listener: (this: HTMLSallaLoyaltyPrizeItemElement, ev: SallaLoyaltyPrizeItemCustomEvent<HTMLSallaLoyaltyPrizeItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaLoyaltyPrizeItemElement: {
        prototype: HTMLSallaLoyaltyPrizeItemElement;
        new (): HTMLSallaLoyaltyPrizeItemElement;
    };
    interface HTMLSallaLoyaltyProgramElement extends Components.SallaLoyaltyProgram, HTMLStencilElement {
    }
    var HTMLSallaLoyaltyProgramElement: {
        prototype: HTMLSallaLoyaltyProgramElement;
        new (): HTMLSallaLoyaltyProgramElement;
    };
    interface HTMLSallaMaintenanceAlertElement extends Components.SallaMaintenanceAlert, HTMLStencilElement {
    }
    var HTMLSallaMaintenanceAlertElement: {
        prototype: HTMLSallaMaintenanceAlertElement;
        new (): HTMLSallaMaintenanceAlertElement;
    };
    interface HTMLSallaMapElementEventMap {
        "selected": any;
        "mapClicked": any;
        "currentLocationChanged": any;
        "invalidInput": any;
    }
    interface HTMLSallaMapElement extends Components.SallaMap, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaMapElementEventMap>(type: K, listener: (this: HTMLSallaMapElement, ev: SallaMapCustomEvent<HTMLSallaMapElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaMapElementEventMap>(type: K, listener: (this: HTMLSallaMapElement, ev: SallaMapCustomEvent<HTMLSallaMapElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaMapElement: {
        prototype: HTMLSallaMapElement;
        new (): HTMLSallaMapElement;
    };
    interface HTMLSallaMenuElement extends Components.SallaMenu, HTMLStencilElement {
    }
    var HTMLSallaMenuElement: {
        prototype: HTMLSallaMenuElement;
        new (): HTMLSallaMenuElement;
    };
    interface HTMLSallaMetadataElement extends Components.SallaMetadata, HTMLStencilElement {
    }
    var HTMLSallaMetadataElement: {
        prototype: HTMLSallaMetadataElement;
        new (): HTMLSallaMetadataElement;
    };
    interface HTMLSallaModalElementEventMap {
        "modalVisibilityChanged": Boolean;
    }
    interface HTMLSallaModalElement extends Components.SallaModal, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaModalElementEventMap>(type: K, listener: (this: HTMLSallaModalElement, ev: SallaModalCustomEvent<HTMLSallaModalElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaModalElementEventMap>(type: K, listener: (this: HTMLSallaModalElement, ev: SallaModalCustomEvent<HTMLSallaModalElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaModalElement: {
        prototype: HTMLSallaModalElement;
        new (): HTMLSallaModalElement;
    };
    interface HTMLSallaNotificationItemElement extends Components.SallaNotificationItem, HTMLStencilElement {
    }
    var HTMLSallaNotificationItemElement: {
        prototype: HTMLSallaNotificationItemElement;
        new (): HTMLSallaNotificationItemElement;
    };
    interface HTMLSallaNotificationsElement extends Components.SallaNotifications, HTMLStencilElement {
    }
    var HTMLSallaNotificationsElement: {
        prototype: HTMLSallaNotificationsElement;
        new (): HTMLSallaNotificationsElement;
    };
    /**
     * `salla-offer` is a StencilJS component that displays offers, categories, products, banks, and discount information.
     * It uses the `salla-slider` component for carousel functionality.
     * @csspart custom - Custom CSS part to target specific elements in the component.
     * @example <salla-offer product-id="123"></salla-offer>
     */
    interface HTMLSallaOfferElement extends Components.SallaOffer, HTMLStencilElement {
    }
    var HTMLSallaOfferElement: {
        prototype: HTMLSallaOfferElement;
        new (): HTMLSallaOfferElement;
    };
    interface HTMLSallaOfferModalElement extends Components.SallaOfferModal, HTMLStencilElement {
    }
    var HTMLSallaOfferModalElement: {
        prototype: HTMLSallaOfferModalElement;
        new (): HTMLSallaOfferModalElement;
    };
    interface HTMLSallaOrderSummaryElement extends Components.SallaOrderSummary, HTMLStencilElement {
    }
    var HTMLSallaOrderSummaryElement: {
        prototype: HTMLSallaOrderSummaryElement;
        new (): HTMLSallaOrderSummaryElement;
    };
    interface HTMLSallaOrdersElement extends Components.SallaOrders, HTMLStencilElement {
    }
    var HTMLSallaOrdersElement: {
        prototype: HTMLSallaOrdersElement;
        new (): HTMLSallaOrdersElement;
    };
    interface HTMLSallaPaymentsElement extends Components.SallaPayments, HTMLStencilElement {
    }
    var HTMLSallaPaymentsElement: {
        prototype: HTMLSallaPaymentsElement;
        new (): HTMLSallaPaymentsElement;
    };
    interface HTMLSallaPlaceholderElement extends Components.SallaPlaceholder, HTMLStencilElement {
    }
    var HTMLSallaPlaceholderElement: {
        prototype: HTMLSallaPlaceholderElement;
        new (): HTMLSallaPlaceholderElement;
    };
    interface HTMLSallaPriceRangeElementEventMap {
        "changed": any;
    }
    interface HTMLSallaPriceRangeElement extends Components.SallaPriceRange, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaPriceRangeElementEventMap>(type: K, listener: (this: HTMLSallaPriceRangeElement, ev: SallaPriceRangeCustomEvent<HTMLSallaPriceRangeElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaPriceRangeElementEventMap>(type: K, listener: (this: HTMLSallaPriceRangeElement, ev: SallaPriceRangeCustomEvent<HTMLSallaPriceRangeElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaPriceRangeElement: {
        prototype: HTMLSallaPriceRangeElement;
        new (): HTMLSallaPriceRangeElement;
    };
    interface HTMLSallaProductAvailabilityElement extends Components.SallaProductAvailability, HTMLStencilElement {
    }
    var HTMLSallaProductAvailabilityElement: {
        prototype: HTMLSallaProductAvailabilityElement;
        new (): HTMLSallaProductAvailabilityElement;
    };
    interface HTMLSallaProductCardElement extends Components.SallaProductCard, HTMLStencilElement {
    }
    var HTMLSallaProductCardElement: {
        prototype: HTMLSallaProductCardElement;
        new (): HTMLSallaProductCardElement;
    };
    interface HTMLSallaProductOptionsElementEventMap {
        "changed": any;
    }
    interface HTMLSallaProductOptionsElement extends Components.SallaProductOptions, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaProductOptionsElementEventMap>(type: K, listener: (this: HTMLSallaProductOptionsElement, ev: SallaProductOptionsCustomEvent<HTMLSallaProductOptionsElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaProductOptionsElementEventMap>(type: K, listener: (this: HTMLSallaProductOptionsElement, ev: SallaProductOptionsCustomEvent<HTMLSallaProductOptionsElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaProductOptionsElement: {
        prototype: HTMLSallaProductOptionsElement;
        new (): HTMLSallaProductOptionsElement;
    };
    interface HTMLSallaProductSizeGuideElement extends Components.SallaProductSizeGuide, HTMLStencilElement {
    }
    var HTMLSallaProductSizeGuideElement: {
        prototype: HTMLSallaProductSizeGuideElement;
        new (): HTMLSallaProductSizeGuideElement;
    };
    interface HTMLSallaProductsListElementEventMap {
        "productsFetched": any;
    }
    interface HTMLSallaProductsListElement extends Components.SallaProductsList, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaProductsListElementEventMap>(type: K, listener: (this: HTMLSallaProductsListElement, ev: SallaProductsListCustomEvent<HTMLSallaProductsListElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaProductsListElementEventMap>(type: K, listener: (this: HTMLSallaProductsListElement, ev: SallaProductsListCustomEvent<HTMLSallaProductsListElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaProductsListElement: {
        prototype: HTMLSallaProductsListElement;
        new (): HTMLSallaProductsListElement;
    };
    interface HTMLSallaProductsSliderElement extends Components.SallaProductsSlider, HTMLStencilElement {
    }
    var HTMLSallaProductsSliderElement: {
        prototype: HTMLSallaProductsSliderElement;
        new (): HTMLSallaProductsSliderElement;
    };
    interface HTMLSallaProgressBarElement extends Components.SallaProgressBar, HTMLStencilElement {
    }
    var HTMLSallaProgressBarElement: {
        prototype: HTMLSallaProgressBarElement;
        new (): HTMLSallaProgressBarElement;
    };
    interface HTMLSallaQuantityInputElement extends Components.SallaQuantityInput, HTMLStencilElement {
    }
    var HTMLSallaQuantityInputElement: {
        prototype: HTMLSallaQuantityInputElement;
        new (): HTMLSallaQuantityInputElement;
    };
    interface HTMLSallaQuickBuyElement extends Components.SallaQuickBuy, HTMLStencilElement {
    }
    var HTMLSallaQuickBuyElement: {
        prototype: HTMLSallaQuickBuyElement;
        new (): HTMLSallaQuickBuyElement;
    };
    interface HTMLSallaQuickOrderElementEventMap {
        "quickOrderSubmited": any;
    }
    interface HTMLSallaQuickOrderElement extends Components.SallaQuickOrder, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaQuickOrderElementEventMap>(type: K, listener: (this: HTMLSallaQuickOrderElement, ev: SallaQuickOrderCustomEvent<HTMLSallaQuickOrderElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaQuickOrderElementEventMap>(type: K, listener: (this: HTMLSallaQuickOrderElement, ev: SallaQuickOrderCustomEvent<HTMLSallaQuickOrderElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaQuickOrderElement: {
        prototype: HTMLSallaQuickOrderElement;
        new (): HTMLSallaQuickOrderElement;
    };
    interface HTMLSallaRatingModalElement extends Components.SallaRatingModal, HTMLStencilElement {
    }
    var HTMLSallaRatingModalElement: {
        prototype: HTMLSallaRatingModalElement;
        new (): HTMLSallaRatingModalElement;
    };
    interface HTMLSallaRatingStarsElement extends Components.SallaRatingStars, HTMLStencilElement {
    }
    var HTMLSallaRatingStarsElement: {
        prototype: HTMLSallaRatingStarsElement;
        new (): HTMLSallaRatingStarsElement;
    };
    interface HTMLSallaReviewCardElement extends Components.SallaReviewCard, HTMLStencilElement {
    }
    var HTMLSallaReviewCardElement: {
        prototype: HTMLSallaReviewCardElement;
        new (): HTMLSallaReviewCardElement;
    };
    interface HTMLSallaReviewsElement extends Components.SallaReviews, HTMLStencilElement {
    }
    var HTMLSallaReviewsElement: {
        prototype: HTMLSallaReviewsElement;
        new (): HTMLSallaReviewsElement;
    };
    interface HTMLSallaReviewsPageElement extends Components.SallaReviewsPage, HTMLStencilElement {
    }
    var HTMLSallaReviewsPageElement: {
        prototype: HTMLSallaReviewsPageElement;
        new (): HTMLSallaReviewsPageElement;
    };
    interface HTMLSallaReviewsSummaryElement extends Components.SallaReviewsSummary, HTMLStencilElement {
    }
    var HTMLSallaReviewsSummaryElement: {
        prototype: HTMLSallaReviewsSummaryElement;
        new (): HTMLSallaReviewsSummaryElement;
    };
    interface HTMLSallaScopesElement extends Components.SallaScopes, HTMLStencilElement {
    }
    var HTMLSallaScopesElement: {
        prototype: HTMLSallaScopesElement;
        new (): HTMLSallaScopesElement;
    };
    interface HTMLSallaSearchElement extends Components.SallaSearch, HTMLStencilElement {
    }
    var HTMLSallaSearchElement: {
        prototype: HTMLSallaSearchElement;
        new (): HTMLSallaSearchElement;
    };
    interface HTMLSallaSkeletonElement extends Components.SallaSkeleton, HTMLStencilElement {
    }
    var HTMLSallaSkeletonElement: {
        prototype: HTMLSallaSkeletonElement;
        new (): HTMLSallaSkeletonElement;
    };
    interface HTMLSallaSliderElementEventMap {
        "afterInit": any;
        "slideChange": any;
        "reachBeginning": any;
        "reachEnd": any;
        "slideChangeTransitionEnd": any;
        "slideChangeTransitionStart": any;
        "slideNextTransitionEnd": any;
        "slideNextTransitionStart": any;
        "slidePrevTransitionEnd": any;
        "slidePrevTransitionStart": any;
        "sliderMove": any;
        "touchSliderEnd": any;
        "touchSliderMove": any;
        "touchSliderStart": any;
        "sliderTransitionEnd": any;
        "sliderTransitionStart": any;
    }
    interface HTMLSallaSliderElement extends Components.SallaSlider, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaSliderElementEventMap>(type: K, listener: (this: HTMLSallaSliderElement, ev: SallaSliderCustomEvent<HTMLSallaSliderElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaSliderElementEventMap>(type: K, listener: (this: HTMLSallaSliderElement, ev: SallaSliderCustomEvent<HTMLSallaSliderElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaSliderElement: {
        prototype: HTMLSallaSliderElement;
        new (): HTMLSallaSliderElement;
    };
    interface HTMLSallaSocialElement extends Components.SallaSocial, HTMLStencilElement {
    }
    var HTMLSallaSocialElement: {
        prototype: HTMLSallaSocialElement;
        new (): HTMLSallaSocialElement;
    };
    interface HTMLSallaSocialShareElement extends Components.SallaSocialShare, HTMLStencilElement {
    }
    var HTMLSallaSocialShareElement: {
        prototype: HTMLSallaSocialShareElement;
        new (): HTMLSallaSocialShareElement;
    };
    interface HTMLSallaTabContentElement extends Components.SallaTabContent, HTMLStencilElement {
    }
    var HTMLSallaTabContentElement: {
        prototype: HTMLSallaTabContentElement;
        new (): HTMLSallaTabContentElement;
    };
    interface HTMLSallaTabHeaderElementEventMap {
        "tabSelected": any;
    }
    interface HTMLSallaTabHeaderElement extends Components.SallaTabHeader, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaTabHeaderElementEventMap>(type: K, listener: (this: HTMLSallaTabHeaderElement, ev: SallaTabHeaderCustomEvent<HTMLSallaTabHeaderElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaTabHeaderElementEventMap>(type: K, listener: (this: HTMLSallaTabHeaderElement, ev: SallaTabHeaderCustomEvent<HTMLSallaTabHeaderElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaTabHeaderElement: {
        prototype: HTMLSallaTabHeaderElement;
        new (): HTMLSallaTabHeaderElement;
    };
    interface HTMLSallaTabsElement extends Components.SallaTabs, HTMLStencilElement {
    }
    var HTMLSallaTabsElement: {
        prototype: HTMLSallaTabsElement;
        new (): HTMLSallaTabsElement;
    };
    interface HTMLSallaTelInputElementEventMap {
        "phoneEntered": Phone;
    }
    interface HTMLSallaTelInputElement extends Components.SallaTelInput, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaTelInputElementEventMap>(type: K, listener: (this: HTMLSallaTelInputElement, ev: SallaTelInputCustomEvent<HTMLSallaTelInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaTelInputElementEventMap>(type: K, listener: (this: HTMLSallaTelInputElement, ev: SallaTelInputCustomEvent<HTMLSallaTelInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaTelInputElement: {
        prototype: HTMLSallaTelInputElement;
        new (): HTMLSallaTelInputElement;
    };
    interface HTMLSallaTooltipElement extends Components.SallaTooltip, HTMLStencilElement {
    }
    var HTMLSallaTooltipElement: {
        prototype: HTMLSallaTooltipElement;
        new (): HTMLSallaTooltipElement;
    };
    interface HTMLSallaUserMenuElement extends Components.SallaUserMenu, HTMLStencilElement {
    }
    var HTMLSallaUserMenuElement: {
        prototype: HTMLSallaUserMenuElement;
        new (): HTMLSallaUserMenuElement;
    };
    /**
     * The SallaUserProfile is a versatile user profile form 
     * generator within the Salla platform, offering localization support, 
     * customizable fields, and seamless integration with the Salla API. 
     * It dynamically fetches translated strings for labels and messages from the 
     * Salla localization object, allowing for a multilingual user interface. Users 
     * can extend the default form with custom fields through the `customFields`
     * property and the setCustomFields method. The component manages user data 
     * retrieval from the Salla configuration and includes fields for first name, 
     * last name, birthday, gender, email, mobile, and custom additions. Form 
     * validation and submission are handled through various event handlers, ensuring 
     * proper field handling and user input validation. The component supports file 
     * uploads for photo fields and includes a dedicated phone number input field. 
     * The componentWillLoad lifecycle method fetches additional user profile 
     * information from the API during initialization. Overall, this component 
     * provides an efficient and adaptable solution for creating user profiles with a 
     * rich set of features and customization options.
     */
    interface HTMLSallaUserProfileElement extends Components.SallaUserProfile, HTMLStencilElement {
    }
    var HTMLSallaUserProfileElement: {
        prototype: HTMLSallaUserProfileElement;
        new (): HTMLSallaUserProfileElement;
    };
    interface HTMLSallaUserSettingsElement extends Components.SallaUserSettings, HTMLStencilElement {
    }
    var HTMLSallaUserSettingsElement: {
        prototype: HTMLSallaUserSettingsElement;
        new (): HTMLSallaUserSettingsElement;
    };
    interface HTMLSallaVerifyElementEventMap {
        "verified": any;
    }
    interface HTMLSallaVerifyElement extends Components.SallaVerify, HTMLStencilElement {
        addEventListener<K extends keyof HTMLSallaVerifyElementEventMap>(type: K, listener: (this: HTMLSallaVerifyElement, ev: SallaVerifyCustomEvent<HTMLSallaVerifyElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLSallaVerifyElementEventMap>(type: K, listener: (this: HTMLSallaVerifyElement, ev: SallaVerifyCustomEvent<HTMLSallaVerifyElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLSallaVerifyElement: {
        prototype: HTMLSallaVerifyElement;
        new (): HTMLSallaVerifyElement;
    };
    interface HTMLSallaWalletElement extends Components.SallaWallet, HTMLStencilElement {
    }
    var HTMLSallaWalletElement: {
        prototype: HTMLSallaWalletElement;
        new (): HTMLSallaWalletElement;
    };
    interface HTMLElementTagNameMap {
        "salla-add-product-button": HTMLSallaAddProductButtonElement;
        "salla-advertisement": HTMLSallaAdvertisementElement;
        "salla-app-install-alert": HTMLSallaAppInstallAlertElement;
        "salla-apps-icons": HTMLSallaAppsIconsElement;
        "salla-booking-field": HTMLSallaBookingFieldElement;
        "salla-bottom-alert": HTMLSallaBottomAlertElement;
        "salla-breadcrumb": HTMLSallaBreadcrumbElement;
        "salla-button": HTMLSallaButtonElement;
        "salla-cart-item-offers": HTMLSallaCartItemOffersElement;
        "salla-cart-summary": HTMLSallaCartSummaryElement;
        "salla-color-picker": HTMLSallaColorPickerElement;
        "salla-comment-form": HTMLSallaCommentFormElement;
        "salla-comment-item": HTMLSallaCommentItemElement;
        "salla-comments": HTMLSallaCommentsElement;
        "salla-conditional-fields": HTMLSallaConditionalFieldsElement;
        "salla-conditional-offer": HTMLSallaConditionalOfferElement;
        "salla-contacts": HTMLSallaContactsElement;
        "salla-count-down": HTMLSallaCountDownElement;
        "salla-datetime-picker": HTMLSallaDatetimePickerElement;
        "salla-file-upload": HTMLSallaFileUploadElement;
        "salla-filters": HTMLSallaFiltersElement;
        "salla-filters-widget": HTMLSallaFiltersWidgetElement;
        "salla-gifting": HTMLSallaGiftingElement;
        "salla-infinite-scroll": HTMLSallaInfiniteScrollElement;
        "salla-installment": HTMLSallaInstallmentElement;
        "salla-list-tile": HTMLSallaListTileElement;
        "salla-loading": HTMLSallaLoadingElement;
        "salla-localization-modal": HTMLSallaLocalizationModalElement;
        "salla-login-modal": HTMLSallaLoginModalElement;
        "salla-loyalty": HTMLSallaLoyaltyElement;
        "salla-loyalty-prize-item": HTMLSallaLoyaltyPrizeItemElement;
        "salla-loyalty-program": HTMLSallaLoyaltyProgramElement;
        "salla-maintenance-alert": HTMLSallaMaintenanceAlertElement;
        "salla-map": HTMLSallaMapElement;
        "salla-menu": HTMLSallaMenuElement;
        "salla-metadata": HTMLSallaMetadataElement;
        "salla-modal": HTMLSallaModalElement;
        "salla-notification-item": HTMLSallaNotificationItemElement;
        "salla-notifications": HTMLSallaNotificationsElement;
        "salla-offer": HTMLSallaOfferElement;
        "salla-offer-modal": HTMLSallaOfferModalElement;
        "salla-order-summary": HTMLSallaOrderSummaryElement;
        "salla-orders": HTMLSallaOrdersElement;
        "salla-payments": HTMLSallaPaymentsElement;
        "salla-placeholder": HTMLSallaPlaceholderElement;
        "salla-price-range": HTMLSallaPriceRangeElement;
        "salla-product-availability": HTMLSallaProductAvailabilityElement;
        "salla-product-card": HTMLSallaProductCardElement;
        "salla-product-options": HTMLSallaProductOptionsElement;
        "salla-product-size-guide": HTMLSallaProductSizeGuideElement;
        "salla-products-list": HTMLSallaProductsListElement;
        "salla-products-slider": HTMLSallaProductsSliderElement;
        "salla-progress-bar": HTMLSallaProgressBarElement;
        "salla-quantity-input": HTMLSallaQuantityInputElement;
        "salla-quick-buy": HTMLSallaQuickBuyElement;
        "salla-quick-order": HTMLSallaQuickOrderElement;
        "salla-rating-modal": HTMLSallaRatingModalElement;
        "salla-rating-stars": HTMLSallaRatingStarsElement;
        "salla-review-card": HTMLSallaReviewCardElement;
        "salla-reviews": HTMLSallaReviewsElement;
        "salla-reviews-page": HTMLSallaReviewsPageElement;
        "salla-reviews-summary": HTMLSallaReviewsSummaryElement;
        "salla-scopes": HTMLSallaScopesElement;
        "salla-search": HTMLSallaSearchElement;
        "salla-skeleton": HTMLSallaSkeletonElement;
        "salla-slider": HTMLSallaSliderElement;
        "salla-social": HTMLSallaSocialElement;
        "salla-social-share": HTMLSallaSocialShareElement;
        "salla-tab-content": HTMLSallaTabContentElement;
        "salla-tab-header": HTMLSallaTabHeaderElement;
        "salla-tabs": HTMLSallaTabsElement;
        "salla-tel-input": HTMLSallaTelInputElement;
        "salla-tooltip": HTMLSallaTooltipElement;
        "salla-user-menu": HTMLSallaUserMenuElement;
        "salla-user-profile": HTMLSallaUserProfileElement;
        "salla-user-settings": HTMLSallaUserSettingsElement;
        "salla-verify": HTMLSallaVerifyElement;
        "salla-wallet": HTMLSallaWalletElement;
    }
}
declare namespace LocalJSX {
    interface SallaAddProductButton {
        /**
          * Channels.
         */
        "channels"?: string;
        /**
          * Donating amount.
         */
        "donatingAmount"?: number;
        /**
          * Listen to product options availability.
         */
        "notifyOptionsAvailability"?: boolean;
        /**
          * Custome DOM event emitter when product addition to cart fails.
         */
        "onFailed"?: (event: SallaAddProductButtonCustomEvent<any>) => void;
        /**
          * Custome DOM event emitter when product gets added to cart successfully.
         */
        "onSuccess"?: (event: SallaAddProductButtonCustomEvent<any>) => void;
        /**
          * Product id
         */
        "productId"?: any;
        /**
          * Product Status.Defaults to `sale`
          * @default 'sale'
         */
        "productStatus"?: 'sale' | 'out' | 'out-and-notify';
        /**
          * Product type. Defaults to `product`
          * @default 'product'
         */
        "productType"?: 'product' | 'service' | 'codes' | 'digital' | 'food' | 'donating' | 'group_products' | 'booking' | 'financial_support';
        /**
          * Product Quantity
         */
        "quantity"?: number;
        /**
          * Support Quick Pay Button
         */
        "quickBuy"?: boolean;
        /**
          * Subscribed Options ex: "[[139487,2394739],[1212,1544]]"
         */
        "subscribedOptions"?: string;
        /**
          * Support themes that have a sticky bar
         */
        "supportStickyBar"?: boolean;
    }
    interface SallaAdvertisement {
    }
    interface SallaAppInstallAlert {
    }
    interface SallaAppsIcons {
        /**
          * The title to display.
         */
        "appsTitle"?: string;
        /**
          * Flag to show or hide title.
         */
        "hideTitle"?: boolean;
        /**
          * Display flag to horizontal/vertical.
         */
        "vertical"?: boolean;
    }
    interface SallaBookingField {
        /**
          * Event emitted when the input is invalid.
         */
        "onInvalidInput"?: (event: SallaBookingFieldCustomEvent<any>) => void;
        /**
          * The booking option configuration
         */
        "option"?: Option;
        /**
          * The ID of the product for which the booking is being made
         */
        "productId"?: number;
    }
    interface SallaBottomAlert {
        /**
          * Button label - used when type is link and popup
         */
        "actionLabel"?: string;
        /**
          * Button url - used when type is link
         */
        "actionUrl"?: string;
        /**
          * Alert Icon class from salla icons library - ex: sicon-user
         */
        "icon"?: string;
        /**
          * Alert Message
         */
        "message"?: string;
        /**
          * Alert Type
          * @default 'popup'
         */
        "type"?: 'link' | 'popup' | 'banner';
    }
    /**
     * @name SallaBreadcrumb
     * @description A StencilJS component for rendering breadcrumb navigation.
     * @tag salla-breadcrumb
     */
    interface SallaBreadcrumb {
    }
    interface SallaButton {
        /**
          * Button Color
          * @default 'primary'
         */
        "color"?: 'primary' | 'success' | 'warning' | 'danger' | 'light' | 'gray' | 'dark';
        /**
          * Is the button currently disabled
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Button Fill
          * @default 'solid'
         */
        "fill"?: 'solid' | 'outline' | 'none';
        /**
          * Button with href as normal link
         */
        "href"?: string;
        /**
          * If there is need to change loader position, pass the position
          * @default 'after'
         */
        "loaderPosition"?: 'start' | 'end' | 'center' | 'after';
        /**
          * Is the button currently loading
          * @default false
         */
        "loading"?: boolean;
        /**
          * Button Type
          * @default 'btn'
         */
        "shape"?: 'link' | 'icon' | 'btn';
        /**
          * Button Size
          * @default 'medium'
         */
        "size"?: 'small' | 'large' | 'medium';
        /**
          * Determines the type of the rendered button. By default, the type is set to "button," making it a general-purpose button. Setting `type` to "submit" makes the button behave as a submit button within a form, triggering form submission. Possible values for `type` include "button," "submit," "reset," and "menu.".  Possible values and their usage are as follows: "button" (default, used for general button functionality),  "reset" (resets form fields to their default values), and  "menu" (represents a button that, when activated, displays a context menu).
          * @default "button"
         */
        "type"?: string;
        /**
          * Button Width
          * @default 'normal'
         */
        "width"?: 'wide' | 'normal';
    }
    interface SallaCartItemOffers {
        /**
          * The unique identifier of the cart item
         */
        "itemId": number;
        /**
          * JSON string containing the offers associated with the cart item
         */
        "offers": string;
        /**
          * The original price of the product in the cart
         */
        "productPrice": number;
        /**
          * The quantity of the cart item
         */
        "quantity": number;
    }
    interface SallaCartSummary {
        /**
          * Show cart label
         */
        "showCartLabel"?: boolean;
    }
    interface SallaColorPicker {
        /**
          * Initial color for the picker.
         */
        "color"?: string;
        /**
          * Whether to enable adjusting the alpha channel.
          * @default false
         */
        "enableAlpha"?: boolean;
        /**
          * How to display the selected color in the text field (the text field still supports input in any format).
          * @default 'hex'
         */
        "format"?: 'hex' | 'hsl' | 'rgb';
        /**
          * File input name for the native formData
          * @default 'color'
         */
        "name"?: string;
        /**
          * Event whenever the color changes.
         */
        "onColorChanged"?: (event: SallaColorPickerCustomEvent<Color>) => void;
        /**
          * Event emitted when the input is invalid.
         */
        "onInvalidInput"?: (event: SallaColorPickerCustomEvent<any>) => void;
        /**
          * Event emitter when the popup closes.
         */
        "onPopupClosed"?: (event: SallaColorPickerCustomEvent<Color>) => void;
        /**
          * Event emitter when the popup opens.
         */
        "onPopupOpened"?: (event: SallaColorPickerCustomEvent<Color>) => void;
        /**
          * Event emitter when the user clicks "Ok".
         */
        "onSubmitted"?: (event: SallaColorPickerCustomEvent<Color>) => void;
        /**
          * Set if the color picker input is required or not
          * @default false
         */
        "required"?: boolean;
        /**
          * Whether to have a "Cancel" button which closes the popup.
          * @default false
         */
        "showCancelButton"?: boolean;
        /**
          * Whether to show a text field for color value editing.
          * @default true
         */
        "showTextField"?: boolean;
    }
    interface SallaCommentForm {
        /**
          * The ID of the item(as defined in the type), where the comment is for. defaults to `salla.config.get('page.id')`
         */
        "itemId"?: string | number;
        /**
          * To show the avatar or not in the comment form
         */
        "showAvatar"?: boolean;
        /**
          * Type of entity the comment is being submitted for. Defaults to `salla.url.is_page('page-single') ? 'page' : 'product'`
         */
        "type"?: 'product' | 'page' | 'blog';
    }
    interface SallaCommentItem {
        /**
          * Single Comment Instance
         */
        "comment"?: Comment;
        /**
          * Hide Bought
         */
        "hideBought"?: Boolean;
    }
    interface SallaComments {
        /**
          * Block Title
         */
        "blockTitle"?: string;
        /**
          * Hide Bought
          * @default false
         */
        "hideBought"?: boolean;
        /**
          * Load more text
         */
        "hideForm"?: boolean;
        /**
          * Hide Title
         */
        "hideTitle"?: boolean;
        /**
          * Page or product ID
         */
        "itemId": number;
        /**
          * Load more text
         */
        "loadMoreText"?: string;
        /**
          * Show or hide avatar
          * @default false
         */
        "showFormAvatar"?: boolean;
        /**
          * Sort comments
         */
        "sort"?: string | 'latest' | 'oldest' | 'bottom_rating' | 'top_rating';
        /**
          * Determines if the comments are testimonials
          * @default false
         */
        "testimonials"?: boolean;
        /**
          * Comment Type
          * @default CommentType.PAGE
         */
        "type"?: CommentType.PAGE | CommentType.PRODUCT | CommentType.BLOG;
    }
    /**
     * its to easy to use, currenlty its support select & checkbox input as trigger for show/hide the dom
     * the dom you can put it like this data-show-when="{name of the field} {= or !=} {value of the field}"
     */
    interface SallaConditionalFields {
    }
    interface SallaConditionalOffer {
    }
    interface SallaContacts {
        /**
          * Section title for social block of footer.
         */
        "contactsTitle"?: string;
        /**
          * Flag to toggle title visibility.
         */
        "hideTitle"?: boolean;
        /**
          * Flag to toggle list of contents whether vertical or horizontal.
         */
        "horizontal"?: boolean;
        /**
          * Flag condition to show icon only or icon with label
         */
        "iconsOnly"?: boolean;
        /**
          * Conditional flag to check whether the content is header or not.
         */
        "isHeader"?: boolean;
    }
    interface SallaCountDown {
        /**
          * If true, the count down numbers will be appear in a boxes
         */
        "boxed"?: boolean;
        /**
          * The color of the count down
          * @default 'dark'
         */
        "color"?: 'primary' | 'light' | 'dark';
        /**
          * The date to count down to Format: MMM DD, YYYY HH:mm:ss (e.g. Jan 2, 2023 16:37:52)
         */
        "date"?: string;
        /**
          * The digits lang to show in the count down
          * @default 'auto'
         */
        "digits"?: 'en' | 'auto';
        /**
          * If true, the count down will end at the end of the day
         */
        "endOfDay"?: boolean;
        /**
          * The text to show when the count down ends
         */
        "endText"?: string;
        /**
          * Show labels for each count down number
         */
        "labeled"?: boolean;
        /**
          * The size of the count down
          * @default 'md'
         */
        "size"?: 'sm' | 'md' | 'lg';
    }
    interface SallaDatetimePicker {
        /**
          * Allows the user to enter a date directly into the input field. By default, direct entry is disabled.
          * @default true
         */
        "allowInput"?: boolean;
        /**
          * Allows the preloading of an invalid date. When disabled, the field will be cleared if the provided date is invalid
          * @default false
         */
        "allowInvalidPreload"?: boolean;
        /**
          * Exactly the same as date format, but for the altInput field.
          * @default "F j, Y"
         */
        "altFormat"?: string;
        /**
          * Show the user a readable date (as per altFormat), but return something totally different to the server.
          * @default false
         */
        "altInput"?: boolean;
        /**
          * This class will be added to the input element created by the altInput option. Note that altInput already inherits classes from the original input.
         */
        "altInputClass"?: string;
        /**
          * Instead of body, appends the calendar to the specified node instead.
          * @default undefined
         */
        "appendTo"?: HTMLElement;
        /**
          * Defines how the date will be formatted in the aria-label for calendar days, using the same tokens as dateFormat. If you change this, you should choose a value that will make sense if a screen reader reads it out loud.
          * @default "F j, Y"
         */
        "ariaDateFormat"?: string;
        /**
          * Whether the default time should be auto-filled when the input is empty and gains or loses focus.
          * @default true
         */
        "autoFillDefaultTime"?: boolean;
        /**
          * Whether clicking on the input should open the picker. Set it to false if you only want to open the calendar programmatically with [open()]
          * @default true
         */
        "clickOpens"?: boolean;
        /**
          * Whether calendar should close after date selection or not
          * @default true
         */
        "closeOnSelect"?: boolean;
        /**
          * When in "multiple" mode, conjunction is used to separate dates in the entry field.
         */
        "conjunction"?: string;
        /**
          * A string of characters which are used to define how the date will be displayed in the input box. The supported characters are defined in the table below.
          * @default "Y-m-d"
         */
        "dateFormat"?: string;
        /**
          * A custom datestring parser
         */
        "dateParser"?: (date: string, format: string) => Date;
        /**
          * Sets the initial selected date(s). If you're using mode: "multiple" or a range calendar supply an Array of Date objects or an Array of date strings which follow your dateFormat. Otherwise, you can supply a single Date object or a date string.
         */
        "defaultDate"?: DateOption | DateOption[];
        /**
          * Initial value of the hour element, when no date is selected
          * @default 12
         */
        "defaultHour"?: number;
        /**
          * Initial value of the minute element, when no date is selected
          * @default 0
         */
        "defaultMinute"?: number;
        /**
          * Initial value of the seconds element, when no date is selected
          * @default 0
         */
        "defaultSeconds"?: number;
        /**
          * Disables certain dates, preventing them from being selected. See https://chmln.github.io/flatpickr/examples/#disabling-specific-dates
          * @default []
         */
        "disable"?: DateLimit<DateOption>[];
        /**
          * Set this to true to always use the non-native picker on mobile devices. By default, Flatpickr utilizes native datetime widgets unless certain options (e.g. disable) are used.
          * @default false
         */
        "disableMobile"?: boolean;
        /**
          * Whether the input is disabled
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Disables all dates except these specified. See https://chmln.github.io/flatpickr/examples/#disabling-all-dates-except-select-few
          * @default [(_) => true]
         */
        "enable"?: DateLimit<DateOption>[];
        /**
          * Enables seconds selection in the time picker.
          * @default false
         */
        "enableSeconds"?: boolean;
        /**
          * Enables the time picker
          * @default false
         */
        "enableTime"?: boolean;
        /**
          * Allows using a custom date formatting function instead of the built-in handling for date formats using dateFormat, altFormat, etc.
         */
        "formatDate"?: (date: Date, format: string, locale: Object) => string;
        /**
          * Adjusts the step for the hour input (incl. scrolling)
          * @default 1
         */
        "hourIncrement"?: number;
        /**
          * Displays the calendar inline
          * @default false
         */
        "inline"?: boolean;
        /**
          * The locale, either as a string (e.g. "ar", "en") or as an object. See https://chmln.github.io/flatpickr/localization/
          * @default "en"
         */
        "locale"?: LocaleKey;
        /**
          * The maximum date that a user can pick to (inclusive).
          * @default null
         */
        "maxDate"?: DateOption;
        /**
          * The minimum date that a user can start picking from (inclusive).
          * @default null
         */
        "maxTime"?: DateOption;
        /**
          * The minimum date that a user can start picking from (inclusive).
          * @default null
         */
        "minDate"?: DateOption;
        /**
          * The minimum time that a user can start picking from (inclusive).
          * @default null
         */
        "minTime"?: DateOption;
        /**
          * Adjusts the step for the minute input (incl. scrolling) Defaults to 5
          * @default 5
         */
        "minuteIncrement"?: number;
        /**
          * Date selection mode, defaults to "single"
          * @default "single"
         */
        "mode"?: "single" | "multiple" | "range" | "time";
        /**
          * How the month should be displayed in the header of the calendar. If showMonths has a value greater than 1, the month is always shown as static.
          * @default "dropdown"
         */
        "monthSelectorType"?: "dropdown" | "static";
        /**
          * the name for the input
         */
        "name"?: string;
        /**
          * HTML for the arrow icon, used to switch months.
          * @default '<span class="sicon-keyboard_arrow_right"></span>'
         */
        "nextArrow"?: string;
        /**
          * Hides the day selection in calendar. Use it along with enableTime to create a time picker.
          * @default false
         */
        "noCalendar"?: boolean;
        /**
          * Event emitted when the input is invalid.
         */
        "onInvalidInput"?: (event: SallaDatetimePickerCustomEvent<any>) => void;
        /**
          * Event emitted when the date input gets changed by the user when selecting file(s).
         */
        "onPicked"?: (event: SallaDatetimePickerCustomEvent<any>) => void;
        /**
          * Placeholder text to show on the input element
          * @default salla.lang.get('blocks.buy_as_gift.select_send_date_and_time')
         */
        "placeholder"?: string;
        /**
          * How the calendar should be positioned with regards to the input. Defaults to "auto"
          * @default "auto"
         */
        "position"?: "auto" | "above" | "below" | "auto left" | "auto center" | "auto right" | "above left" | "above center" | "above right" | "below left" | "below center" | "below right" | ((self: any, customElement: HTMLElement | undefined) => void);
        /**
          * The element off of which the calendar will be positioned. Defaults to the date input
         */
        "positionElement"?: HTMLElement;
        /**
          * HTML for the left arrow icon, used to switch months.
          * @default '<span class="sicon-keyboard_arrow_left"></span>'
         */
        "prevArrow"?: string;
        /**
          * Whether this input i required or not
         */
        "required"?: boolean;
        /**
          * Whether to display the current month name in shorthand mode, e.g. "Sep" instead "September"
          * @default false
         */
        "shorthandCurrentMonth"?: boolean;
        /**
          * The number of months to be shown at the same time when displaying the calendar.
          * @default 1
         */
        "showMonths"?: number;
        /**
          * Position the calendar inside the wrapper and next to the input element*.
          * @default false
         */
        "static"?: boolean;
        /**
          * Displays time picker in 24 hour mode without AM/PM selection when enabled.
          * @default false
         */
        "time_24hr"?: boolean;
        /**
          * Two way data binding to retrieve the selected date[time] value
          * @default null
         */
        "value"?: string;
        /**
          * Enables display of week numbers in calendar.
          * @default false
         */
        "weekNumbers"?: boolean;
        /**
          * See https://chmln.github.io/flatpickr/examples/#flatpickr-external-elements
          * @default false
         */
        "wrap"?: boolean;
    }
    interface SallaFileUpload {
        /**
          * Accepted file types
          * @default "image/png, image/jpeg, image/jpg, image/gif"
         */
        "accept"?: string;
        /**
          * Enable or disable file browser
          * @default true
         */
        "allowBrowse"?: boolean;
        /**
          * Enable or disable drag n' drop
          * @default true
         */
        "allowDrop"?: boolean;
        /**
          * Enable or disable preview mode
          * @default true
         */
        "allowImagePreview"?: boolean;
        /**
          * Enable or disable adding multiple files
         */
        "allowMultiple"?: boolean;
        /**
          * Enable or disable pasting of files. Pasting files is not supported on all browesrs.
         */
        "allowPaste"?: boolean;
        /**
          * Enable or disable the process button
         */
        "allowProcess"?: boolean;
        /**
          * When set to false the remove button is hidden and disabled
          * @default true
         */
        "allowRemove"?: boolean;
        /**
          * Allow users to reorder files with drag and drop interaction. Note that this only works in single column mode. It also only works on browsers that support pointer events.
         */
        "allowReorder"?: boolean;
        /**
          * Allow drop to replace a file, only works when allowMultiple is false
          * @default true
         */
        "allowReplace"?: boolean;
        /**
          * Enable or disable the revert processing button
          * @default true
         */
        "allowRevert"?: boolean;
        /**
          * to prepare the upload url automatically pass this prop, ex to upload attach file in cart Item.
         */
        "cartItemId"?: string;
        /**
          * Set to true to enable custom validity messages. FilePond will throw an error when a parent form is submitted and it contains invalid files.
         */
        "checkValidity"?: boolean;
        /**
          * Force chunks even for files smaller than the set chunkSize
         */
        "chunkForce"?: boolean;
        /**
          * Amount of times, and delayes, between retried uploading of a chunk
          * @default [500, 1000, 3000]
         */
        "chunkRetryDelays"?: Array<number>;
        /**
          * The size of a chunk in bytes
          * @default 5000000
         */
        "chunkSize"?: number;
        /**
          * Enable chunked uploads, when enabled will automatically cut up files in chunkSize chunks before upload.
         */
        "chunkUploads"?: boolean;
        /**
          * Show credits at the bottom of the upload element. Structure is like [{label,url}]
         */
        "credits"?: false;
        /**
          * Sets the disabled attribute to the output field
         */
        "disabled"?: boolean;
        /**
          * Require drop on the FilePond element itself to catch the file.
          * @default true
         */
        "dropOnElement"?: boolean;
        /**
          * FilePond will catch all files dropped on the webpage
         */
        "dropOnPage"?: boolean;
        /**
          * When enabled, files are validated before they are dropped. A file is not added when it's invalid.
         */
        "dropValidation"?: boolean;
        /**
          * If current file has id, pass it here, to be passed back in the `removed` event
         */
        "fileId"?: number;
        /**
          * Fixed image poster height, overrides min and max preview height
          * @default null
         */
        "filePosterHeight"?: number;
        /**
          * The uploaded files as json `[{url:"...", id:123}]` for delete possibility
         */
        "files"?: string;
        /**
          * Set to true to require the file to be successfully reverted before continuing.
         */
        "forceRevert"?: boolean;
        /**
          * json formData to be injected in the submit request
          * @default "{}"
         */
        "formData"?: string;
        /**
          * The original height of the uploader, will be used to reset the height after the image is removed.
         */
        "height"?: string;
        /**
          * The icon used for process actions
          * @default '<svg>...</svg>'
         */
        "iconProcess"?: string;
        /**
          * The icon used for remove actions
          * @default '<svg>...</svg>'
         */
        "iconRemove"?: string;
        /**
          * The icon used for retry actions
          * @default '<svg>...</svg>'
         */
        "iconRetry"?: string;
        /**
          * The icon used for undo actions
          * @default '<svg>...</svg>'
         */
        "iconUndo"?: string;
        /**
          * Ignored file names when handling dropped directories. Dropping directories is not supported on all browsers.
          * @default ['.ds_store', 'thumbs.db', 'desktop.ini']
         */
        "ignoredFiles"?: Array<any>;
        /**
          * Fixed image preview height, overrides min and max preview height
          * @default null
         */
        "imagePreviewHeight"?: number;
        /**
          * Immediately upload new files to the server
         */
        "instantUpload"?: boolean;
        /**
          * The interval to use before showing each item being added to the list
          * @default 75
         */
        "itemInsertInterval"?: number;
        /**
          * Set to 'after' to add files to end of list (when dropped at the top of the list or added using browse or paste), set to 'before' to add files at start of list. Set to a compare function to automatically sort items when added
          * @default 'after'
         */
        "itemInsertLocation"?: 'before' | 'after' | ((a: FilePondFile, b: FilePondFile) => number);
        /**
          * The decimal separator used to render numbers. By default this is determined automatically.
          * @default undefined
         */
        "labelDecimalSeparator"?: string;
        /**
          * Default label shown to indicate this is a drop area. FilePond will automatically bind browse file events to the element with CSS class .filepond--label-action
          * @default `${salla.lang.get('common.uploader.drag_and_drop')}<span class="filepond--label-action"> ${salla.lang.get('common.uploader.browse')} </span>`
         */
        "labelIdle"?: string;
        /**
          * The thousdands separator used to render numbers. By default this is determined automatically.
          * @default undefined
         */
        "labelThousandsSeparator"?: string;
        /**
          * The maximum size of a file, for instance 2MB or 750KB
         */
        "maxFileSize"?: `${number}MB` | `${number}KB}`;
        /**
          * The maximum number of files that the pond can handle
          * @default 1
         */
        "maxFilesCount"?: number;
        /**
          * The maxmimum number of files that can be uploaded in parallel
          * @default 3
         */
        "maxParallelUploads"?: number;
        /**
          * The submit request method.
          * @default 'POST'
         */
        "method"?: string;
        /**
          * File input name for the native formData
         */
        "name"?: string;
        /**
          * Event emitted when the file has been added
         */
        "onAdded"?: (event: SallaFileUploadCustomEvent<{ error: FilePondErrorDescription | null, file: FilePondFile }>) => void;
        /**
          * Event emitted when the input is invalid
         */
        "onInvalidInput"?: (event: SallaFileUploadCustomEvent<any>) => void;
        /**
          * Event emitted when the file is about to be removed. Returns boolean value.
         */
        "onRemoved"?: (event: SallaFileUploadCustomEvent<FilePondFile>) => void;
        /**
          * Event emitted when the file has been uploaded and link to the file has been recieved from the server. Returns string value.
         */
        "onUploaded"?: (event: SallaFileUploadCustomEvent<string>) => void;
        /**
          * File input name in the request payload
         */
        "payloadName"?: string;
        /**
          * Set the component to be profile image uploader with a preview and a circular shape
          * @default false
         */
        "profileImage"?: boolean;
        /**
          * Sets the required attribute to the output field
         */
        "required"?: boolean;
        /**
          * Tells FilePond to store files in hidden file input elements so they can be posted along with normal form post. This only works if the browser supports the DataTransfer constructor (https://caniuse.com/mdn-api_datatransfer_datatransfer), this is the case on Firefox, Chrome, Chromium powered browsers and Safari version 14.1 and higher.
         */
        "storeAsFile"?: boolean;
        /**
          * Type to be sent to backend
         */
        "type"?: string;
        /**
          * The url to submit the image into.
         */
        "url"?: string;
        /**
          * The uploaded image link or URL
         */
        "value"?: any;
    }
    interface SallaFilters {
        /**
          * Array of filter options
         */
        "filters"?: Filter[];
        /**
          * Custom event fired when the selected filters are changed.
         */
        "onChanged"?: (event: SallaFiltersCustomEvent<any>) => void;
    }
    interface SallaFiltersWidget {
        /**
          * Selected filter options value.
         */
        "filtersData"?: object;
        /**
          * Custom event emitted up on filter option selection changes.
         */
        "onChanged"?: (event: SallaFiltersWidgetCustomEvent<any>) => void;
        /**
          * Filter option along with possible values.
         */
        "option"?: Filter;
        /**
          * Show more or less filter options.
         */
        "withLoadMore"?: boolean;
    }
    interface SallaGifting {
        /**
          * The form selector to be used to get the form data
          * @default 'form.product-form'
         */
        "formSelector"?: string;
        /**
          * Is Physcial products
         */
        "physicalProducts"?: boolean;
        /**
          * The product id for which the gifting system is required.
         */
        "productId"?: number;
        /**
          * Is Vertical widget
         */
        "vertical"?: boolean;
        /**
          * Widget subtitle
         */
        "widgetSubtitle"?: string;
        /**
          * Widget title
         */
        "widgetTitle"?: string;
    }
    interface SallaInfiniteScroll {
        /**
          * Is there is need to autoload next page when scroll `next-page-autoload|next-page.autoload`
          * @default false
         */
        "autoload"?: boolean;
        /**
          * Class selector to know the container if it's not the host `<salla-infinite-scroll>`
          * @default 'salla-infinite-scroll'
         */
        "container"?: string;
        /**
          * Class selector to know list items
          * @default 'salla-infinite-scroll > *'
         */
        "item"?: string;
        /**
          * Load more text
         */
        "loadMoreText"?: string;
        /**
          * Next Page element
          * @default ''
         */
        "nextPage"?: string;
    }
    interface SallaInstallment {
        /**
          * Country code
          * @default salla.config.get('user.country_code')
         */
        "country"?: string;
        /**
          * Currency code
          * @default salla.config.get('user.currency_code')
         */
        "currency"?: string;
        /**
          * Language code
          * @default salla.config.get('user.language_code')
         */
        "language"?: string;
        /**
          * Current product price
         */
        "price"?: string;
    }
    interface SallaListTile {
        /**
          * Designates the component as anchor and applies the `href` attribute.
          * @default undefined
         */
        "href"?: string | undefined;
        /**
          * Designates the target attribute. This should only be applied when using the `href` prop.
          * @default "_self"
         */
        "target"?: "_blank" | "_self" | "_parent" | "_top" | "framename";
    }
    interface SallaLoading {
        /**
          * Spinner background color.
          * @default "#e5e7eb"
         */
        "bgColor"?: string;
        /**
          * Spinner content color.
          * @default undefined
         */
        "color"?: string;
        /**
          * Sets the diameter of the circle in pixels, Defaults to `32`
          * @default 32
         */
        "size"?: number | string;
        /**
          * Sets the stroke of the circle (border) in pixels, Defaults to `4`
          * @default 2
         */
        "width"?: number | string;
    }
    interface SallaLocalizationModal {
        /**
          * Current currency (existing or newly selected)
          * @default salla.config.get('user.currency_code')
         */
        "currency"?: string;
        /**
          * Current language (existing or newly selected)
          * @default salla.config.get('user.language_code')
         */
        "language"?: string;
    }
    interface SallaLoginModal {
        /**
          * The API endpoint for authentication
         */
        "api"?: string;
        /**
          * Custom headers to be sent with API requests
         */
        "headers"?: { [key: string]: string } | string;
        /**
          * Display the login inline
         */
        "inline"?: boolean;
        /**
          * Does the merchant allow to login using email
         */
        "isEmailAllowed"?: boolean;
        /**
          * Does the merchant require registration with email & mobile
          * @default false
         */
        "isEmailRequired"?: boolean;
        /**
          * Does the merchant/current location for visitor allow to login using mobile, By default outside KSA is `false`
          * @default true
         */
        "isMobileAllowed"?: boolean;
        /**
          * The store ID for authentication
         */
        "storeId"?: string | number;
        /**
          * Once the api verify success, it will be login the customer in web pages
          * @default true
         */
        "supportWebAuth"?: boolean;
        /**
          * Reload after a successful login
          * @default false
         */
        "withoutReload"?: boolean;
    }
    interface SallaLoyalty {
        /**
          * Does the merchant allow to login using email
          * @default true
         */
        "allowEmail"?: boolean;
        /**
          * Does the merchant/current location for visitor allow to login using mobile, By default outside KSA is `false`
          * @default true
         */
        "allowMobile"?: boolean;
        /**
          * Available customer points with which they can exchange.
         */
        "customerPoints"?: number;
        /**
          * Message to show for guest users.
         */
        "guestMessage"?: string;
        /**
          * The exchanged prize point
         */
        "prizePoints"?: string | number;
        /**
          * The prize title
         */
        "prizeTitle"?: string;
        /**
          * Does the merchant require registration with email & mobile
          * @default false
         */
        "requireEmail"?: boolean;
    }
    interface SallaLoyaltyPrizeItem {
        /**
          * Prize item to be displayed in this component.
         */
        "item"?: Item;
        /**
          * Event emmited when the user select this item.
         */
        "onPrizeItemSelected"?: (event: SallaLoyaltyPrizeItemCustomEvent<Item>) => void;
    }
    interface SallaLoyaltyProgram {
    }
    interface SallaMaintenanceAlert {
    }
    interface SallaMap {
        /**
          * Sets google api key value, default Merchant key
         */
        "apiKey"?: string;
        /**
          * Latitude coordinate, defaults to current user location
         */
        "lat"?: number;
        /**
          * Longitude coordinate, defaults to current user location
         */
        "lng"?: number;
        /**
          * Modal Title
         */
        "modalTitle"?: string;
        /**
          * File input name for the native formData
          * @default 'location'
         */
        "name"?: string;
        /**
          * Custom DOM event emitter when current location is selected
         */
        "onCurrentLocationChanged"?: (event: SallaMapCustomEvent<any>) => void;
        /**
          * Event emitted when the input is invalid.
         */
        "onInvalidInput"?: (event: SallaMapCustomEvent<any>) => void;
        /**
          * Custom DOM event emitter when map is clicked
         */
        "onMapClicked"?: (event: SallaMapCustomEvent<any>) => void;
        /**
          * Custom DOM event emitter when location is selected
         */
        "onSelected"?: (event: SallaMapCustomEvent<any>) => void;
        /**
          * Disable or enable actions
          * @default false
         */
        "readonly"?: boolean;
        /**
          * Set if the location input is required or not
          * @default false
         */
        "required"?: boolean;
        /**
          * Sets the search bar visibility.
          * @default false
         */
        "searchable"?: boolean;
        /**
          * Sets map style.
          * @default 'light'
         */
        "theme"?: string;
        /**
          * Sets start map zoom.
          * @default 10
         */
        "zoom"?: number;
    }
    interface SallaMenu {
        /**
          * Limiting the number of menu items
         */
        "limit"?: number;
        /**
          * The source of the menu, specifying whether it is a header or footer menu.
          * @default "header"
         */
        "source"?: Sources;
        /**
          * The source value, a stringified JSON representation of the menu content.
         */
        "sourceValue"?: string;
        /**
          * Boolean indicating whether the menu is a top navigation menu.
         */
        "topnav"?: boolean;
        /**
          * Boolean indicating whether to use React Link elements for menu links.
          * @default false
         */
        "useReactLink"?: boolean;
    }
    interface SallaMetadata {
        /**
          * The entity type.
          * @default 'product'
         */
        "entity"?: string;
        /**
          * The id of the product/the endity to which the specs are going to be fetched for.
         */
        "entityId"?: number | number[] | string;
    }
    interface SallaModal {
        /**
          * Align modal content to center, defaults to `false`
          * @default false
         */
        "centered"?: boolean;
        /**
          * open the modal on rendering
          * @default false
         */
        "hasSkeleton"?: boolean;
        /**
          * Set the style of the header icon.
          * @default undefined
         */
        "iconStyle"?: 'error' | 'success' | 'primary' | 'normal';
        /**
          * Sets the modal to be closable. Defaults to `true`
          * @default true
         */
        "isClosable"?: boolean;
        /**
          * Show loading in the middle
          * @default false
         */
        "isLoading"?: boolean;
        /**
          * Avoid padding in the modal body or not, defaults to `false`
          * @default false
         */
        "noPadding"?: boolean;
        /**
          * Event emitted when the modal visibilty is changed.
         */
        "onModalVisibilityChanged"?: (event: SallaModalCustomEvent<Boolean>) => void;
        /**
          * The position of the modal
          * @default 'middle'
         */
        "position"?: 'top' | 'middle' | 'bottom';
        /**
          * Set modal sub title.
          * @default ''
         */
        "subTitle"?: string;
        /**
          * Show subtitle before the title or not, defaults to `false` (after the title)
          * @default false
         */
        "subTitleFirst"?: boolean;
        /**
          * open the modal on rendering
          * @default false
         */
        "visible"?: boolean;
        /**
          * The size of the modal
          * @default 'md'
         */
        "width"?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
    }
    interface SallaNotificationItem {
        /**
          * Notification instance to render.
         */
        "notification"?: Notification;
    }
    interface SallaNotifications {
        /**
          * Number of notifications to load per request.
          * @default 10
         */
        "itemPerPage"?: number;
        /**
          * Load more text
         */
        "loadMoreText"?: string;
    }
    /**
     * `salla-offer` is a StencilJS component that displays offers, categories, products, banks, and discount information.
     * It uses the `salla-slider` component for carousel functionality.
     * @csspart custom - Custom CSS part to target specific elements in the component.
     * @example <salla-offer product-id="123"></salla-offer>
     */
    interface SallaOffer {
        /**
          * Custom Card Component for the Salla Products List.  This component allows you to customize the appearance of individual product cards within a Salla Products List.
          * @example <salla-products-list product-card-component="my-custom-card-style1" ... <salla-products-list product-card-component="my-custom-card-style2" ...
          * @default 'custom-salla-product-card'
         */
        "productCardComponent"?: string;
    }
    interface SallaOfferModal {
    }
    interface SallaOrderSummary {
        /**
          * The order ID to fetch items from
         */
        "orderId"?: number;
    }
    interface SallaOrders {
        /**
          * Load more text
         */
        "loadMoreText"?: string;
        /**
          * Query Parameter to send along with the fetch request
         */
        "params"?: OrderQueryParameters;
    }
    interface SallaPayments {
        /**
          * Array of the payments/items that are not supported, ex: ["sbc", "made-in-ksa", "cod", "mada", ""].
          * @default []
         */
        "exclude"?: string[];
    }
    interface SallaPlaceholder {
        /**
          * Defines the alignment of contents. Defaults to [`left`]
          * @default 'left'
         */
        "alignment"?: 'left' | 'center' | 'right';
        /**
          * Custom icon to display, defaults to [`Inbox`], can be any valid svg icon or inline element with font icon
          * @default Inbox
         */
        "icon"?: string;
        /**
          * The size of the icon. Defaults to [`md`] = 45px for font icon & width/height: 3.5rem for svg icon
          * @default 'md'
         */
        "iconSize"?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'xxxl';
    }
    interface SallaPriceRange {
        /**
          * Currently selected price filter data
         */
        "filtersData"?: any;
        /**
          * Maximum price threshold value
         */
        "maxPrice"?: any;
        /**
          * Minimum price threshold value
         */
        "minPrice"?: any;
        /**
          * Custome event emitted when there is a change in price input.
         */
        "onChanged"?: (event: SallaPriceRangeCustomEvent<any>) => void;
        /**
          * Product price range filter option object instance
         */
        "option"?: Filter;
    }
    interface SallaProductAvailability {
        /**
          * Notification channels
         */
        "channels"?: 'sms' | 'email' | 'sms,email';
        /**
          * is current user already subscribed
          * @default false
         */
        "isSubscribed"?: boolean;
        /**
          * Listen to product options availability.
          * @default false
         */
        "notifyOptionsAvailability"?: boolean;
        /**
          * product id that can visitor subscribe to its availability notification
         */
        "productId"?: number;
    }
    interface SallaProductCard {
        /**
          * Full image card.
         */
        "fullImage"?: boolean;
        /**
          * Hide add to cart button.
         */
        "hideAddBtn"?: boolean;
        /**
          * Horizontal card.
         */
        "horizontal"?: boolean;
        /**
          * Special card.
         */
        "isSpecial"?: boolean;
        /**
          * Minimal card.
         */
        "minimal"?: boolean;
        /**
          * Product information.
         */
        "product"?: string | object;
        /**
          * Support shadow on hover.
         */
        "shadowOnHover"?: boolean;
        /**
          * Show quantity.
         */
        "showQuantity"?: boolean;
    }
    interface SallaProductOptions {
        /**
          * Configuration for customizing the display layout of product options. The `config` prop accepts a JSON string that specifies the layout type for rendering options. It allows customization of how single-option and multiple-option selections are displayed.  Example Usage: ```html <salla-product-options    options="{{ product.options }}"    product-id="{{ product.id }}"    unique-key="abc123"   config='{     "single-option": { "type": "button" },     "multiple-option": { "type": "button" }   }'> </salla-product-options> ```  Example Config JSON: ```json {   "single-option": { "type": "button" },   "multiple-option": { "type": "default" } } ```  - `single-option`:   - Defines the display style for single-option selections.   - `type`: Supported values:     - `"button"`: Displays options in a button-style grid layout.     - `"default"`: Displays options as a dropdown (default).  - `multiple-option`:   - Defines the display style for multiple-option selections.   - `type`: Supported values:     - `"button"`: Displays options in a button-style grid layout.     - `"default"`: Displays options as a list of checkboxes (default).
         */
        "config"?: string;
        /**
          * Hide the out of stock label. Will be used in the case of live validation such as cart page and inline checkout
         */
        "hideOutLabel"?: string;
        /**
          * An event that emitted when any option is changed.
         */
        "onChanged"?: (event: SallaProductOptionsCustomEvent<any>) => void;
        /**
          * Product detail information.
         */
        "options"?: string;
        /**
          * The id of the product to which the options are going to be fetched for.
          * @default salla.config.get('page.id')
         */
        "productId"?: number;
        /**
          * A unique key used to generate distinct identifiers.  This key is appended to a default value to ensure uniqueness across instances or components where differentiation is required.
         */
        "uniqueKey"?: string;
    }
    interface SallaProductSizeGuide {
    }
    interface SallaProductsList {
        /**
          * Autoload next page when scroll
          * @default false
         */
        "autoload"?: boolean;
        /**
          * should listen to filters events `salla-filters::changed` and re-render
         */
        "filtersResults"?: boolean;
        /**
          * Horizontal cards
         */
        "horizontalCards"?: boolean;
        /**
          * Specifies additional data to be included in the product fetch response. The value can be an array of strings or a JSON string.  Example: - As an array: includes=["options"] - As a JSON string: includes='["options", "metadata", 'images']'  The array or JSON string can include: - "options": Include product options in the response. - "images": Include product images in the response.
         */
        "includes"?: string[];
        /**
          * Limit for number of products in the list.
         */
        "limit"?: number;
        /**
          * Load more text
         */
        "loadMoreText"?: string;
        /**
          * Custom event fired when the the products fetched.
         */
        "onProductsFetched"?: (event: SallaProductsListCustomEvent<any>) => void;
        /**
          * Custom Card Component for the Salla Products List.  This component allows you to customize the appearance of individual product cards within a Salla Products List.
          * @example <salla-products-list product-card-component="my-custom-card-style1" ... <salla-products-list product-card-component="my-custom-card-style2" ...
          * @default 'custom-salla-product-card'
         */
        "productCardComponent"?: string;
        /**
          * Row cards
         */
        "rowCards"?: boolean;
        /**
          * Sorting the list of products
         */
        "sortBy"?: string | 'ourSuggest' | 'bestSell' | 'topRated' | 'priceFromTopToLow' | 'priceFromLowToTop';
        /**
          * The source of the products list
          * @type {string}
         */
        "source"?: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'search' | 'tags' | 'selected' | 'offers' | 'landing-page' | 'sales' | 'wishlist' | 'top-rated';
        /**
          * The source value, cloud be different values as following: - array of ids when `source` in ['categories', 'brands', 'tags', 'selected'] - keyword when `source` = 'search' - products payload when `source` = 'json' - product_id when `source` = 'related'
          * @type {string}
         */
        "sourceValue"?: any;
    }
    interface SallaProductsSlider {
        /**
          * autoplay option for products slider
         */
        "autoplay"?: boolean;
        /**
          * Title of the block - works only if slider is true
          * @type {string}
          * @default ''
         */
        "blockTitle"?: string;
        /**
          * Display 'ALL' URL
          * @type {string}
          * @default ''
         */
        "displayAllUrl"?: string;
        /**
          * Specifies additional data to be included in the product fetch response. The value can be an array of strings or a JSON string.  Example: - As an array: includes=["options"] - As a JSON string: includes='["options"]'  The array or JSON string can include: - "options": Include product options in the response. - "images": Include product images in the response.
         */
        "includes"?: string[];
        /**
          * Limit for number of products in the list.
         */
        "limit"?: number;
        /**
          * Custom Card Component for the Salla Products Slider.  This component allows you to customize the appearance of individual product cards within a Salla Products Slider.
          * @example <salla-products-slider product-card-component="my-custom-card-style1" ... <salla-products-slider product-card-component="my-custom-card-style2" ...
          * @default 'custom-salla-product-card'
         */
        "productCardComponent"?: string;
        /**
          * Slider Configs refer to https://swiperjs.com/swiper-api#parameters and pass the entire config object
          * @example let productsSlider = document.querySelector('salla-products-slider');  productsSlider.sliderConfig = {  slidesPerView: 1,  spaceBetween : 30,  lazy: true, }
         */
        "sliderConfig"?: any;
        /**
          * Slider Id, if not provided will be generated automatically
          * @type {string}
          * @default ''
         */
        "sliderId"?: string;
        /**
          * Source of the products, if api will get the products from the API, if json will get the products from the products prop
          * @type {string}
          * @default ''
         */
        "source"?: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'tags' | 'selected' | 'offers' | 'landing-page' | 'wishlist' | 'top-rated';
        /**
          * The source value, cloud be different values as following: - array of ids when `source` in ['categories', 'brands', 'tags', 'selected'] - products payload when `source` = 'json' - product_id when `source` = 'related'
          * @type {string}
         */
        "sourceValue"?: string;
        /**
          * Sub title of the block - works only if slider is true
          * @type {string}
          * @default ''
         */
        "subTitle"?: string;
    }
    interface SallaProgressBar {
        /**
          * Progress bar color, defaults to: `salla.config.get('theme.color.primary', "#ffd5c4")`
         */
        "color"?: string;
        /**
          * You can just pass the donation as json string ex: `{"target_message":null,"target_date":"2023-04-18","target_end_date":"2023-04-18","target_amount":400,"collected_amount":380,"can_donate":true}`
         */
        "donation"?: string | Donation;
        /**
          * Big Title, before the progress bar.
         */
        "header"?: string;
        /**
          * Set height for the wrapper.
          * @default "10px"
         */
        "height"?: string;
        /**
          * Hide units above the progress bar
         */
        "hideUnits"?: boolean;
        /**
          * Subtitle under the progress bar or instead of it if the target not being set.
         */
        "message"?: string;
        /**
          * Stripped effect for tje progress bar.
         */
        "stripped"?: boolean;
        /**
          * The goal of the progress bar
         */
        "target"?: number;
        /**
          * The unite to be added after the numbers, defaults to: `salla.config.currency().symbol`
         */
        "unit"?: string;
        /**
          * The progress so far as of the goal.
         */
        "value"?: number;
    }
    interface SallaQuantityInput {
        /**
          * Cart Item Id
         */
        "cartItemId"?: any;
    }
    interface SallaQuickBuy {
        /**
          * Product amount in base currency (SAR).
          * @type {number}
          * @default 0
         */
        "amount"?: number;
        /**
          * Show Apple Pay only
          * @type {boolean}
         */
        "applePayOnly"?: boolean;
        /**
          * Cart ID, when you need to applePay for existed cart
          * @type {string}
         */
        "cartId"?: string;
        /**
          * base currency
          * @type {string}
          * @default SAR
         */
        "currency"?: string;
        /**
          * To be passed to purchaseNow request
          * @type {boolean}
         */
        "isRequireShipping"?: boolean;
        /**
          * Product options, if is empty will get the data from the document.querySelector('salla-product-options[product-id="X"]')
          * @type {object}
          * @default {}
         */
        "options"?: {};
        /**
          * Product ID.
          * @type {string}
         */
        "productId"?: string;
        /**
          * Button type.
          * @type {string}
          * @default buy
         */
        "type"?: 'plain' | 'buy' | 'donate' | 'book' | 'pay' | 'order';
    }
    interface SallaQuickOrder {
        /**
          * agreement text from server or from props
          * @default salla.lang.get(     'pages.checkout.show_full_agreement'   )
         */
        "agreementText"?: string;
        /**
          * quick order confirm pay button text
          * @default 'اشتر الآن'
         */
        "confirmPayButtonTitle"?: string;
        /**
          * is email required
          * @default false
         */
        "isEmailRequired"?: boolean;
        /**
          * Custome DOM event emitter when order gets submitted successfully.
         */
        "onQuickOrderSubmited"?: (event: SallaQuickOrderCustomEvent<any>) => void;
        /**
          * quick order pay button text
          * @default 'اطلب المنتج'
         */
        "payButtonTitle"?: string;
        /**
          * product id local or from page
         */
        "productId"?: string;
        /**
          * Quick Order Style
          * @default 'default'
         */
        "quickOrderStyle"?: 'gray' | 'white' | 'default';
        /**
          * quick order title
          * @default 'ليش تنتظر؟'
         */
        "quickOrderTitle"?: string;
        /**
          * quick order sub title
          * @default 'احصل على المنتج مباشرة الآن'
         */
        "subTitle"?: string;
        /**
          * product id local or from page
         */
        "thanksMessage"?: string;
    }
    interface SallaRatingModal {
        /**
          * The order id, to rate on its products & shipping
         */
        "orderId"?: number;
    }
    interface SallaRatingStars {
        /**
          * Allows the rating to be editable.
          * @default false
         */
        "editable"?: boolean;
        /**
          * Sets input name.
          * @default 'rating'
         */
        "name"?: string;
        /**
          * Number of reviews to display.
          * @default 0
         */
        "reviews"?: number;
        /**
          * Sets the height and width of the component. Defaults to medium.
          * @default 'medium'
         */
        "size"?: "large" | "medium" | "small" | "mini";
        /**
          * The rating value.
         */
        "value"?: number;
        /**
          * Show the description label.
         */
        "withLabel"?: boolean;
    }
    interface SallaReviewCard {
        "review"?: Partial<Review>;
    }
    interface SallaReviews {
        /**
          * Controls the visibility of a link to the reviews page.  When set to `true`, a link will be displayed allowing users to navigate to the full reviews section.
          * @type {boolean}
         */
        "displayAllLink"?: boolean;
        /**
          * Specifies whether to hide customer information in the component. When set to true, customer information will be hidden. Defaults to false, meaning customer information will be displayed.
          * @default false
         */
        "hideCustomerInfo"?: boolean;
        /**
          * Defines the maximum number of reviews to retrieve from the API.
          * @type {number}
          * @default 5
         */
        "limit"?: number;
        /**
          * Specifies the sorting criteria for the fetched reviews. Available options: - "top_rating": Sorts reviews based on top ratings. - "random": Sorts reviews randomly. - "latest": Sorts reviews based on the latest ones (default).
          * @type {SortingOption}
          * @default latest
         */
        "sort"?: SortingOption;
        /**
          * Specifies the data source for reviews.  Valid options include:  - 'categories': Retrieves reviews for specific product categories.  - 'products': Retrieves reviews for individual products.  - 'json': Retrieves reviews from a custom JSON payload provided in `sourceValue`.  When using 'json' as the source, a valid payload must be provided in `sourceValue`.
          * @type {Source}
          * @default "store"
         */
        "source"?: Source;
        /**
          * Provides data specific to the chosen source.  Required when using 'categories', 'products', or 'json' as the source:   - 'categories': An array of category IDs.   - 'products': An array of product IDs.   - 'json': A custom JSON object containing review data.
          * @type {string | object | Array<number>}
         */
        "sourceValue"?: string | object | Array<number>;
        /**
          * Specifies the type of reviews to fetch. Available options: - "all": Fetches reviews from all sources. - "store": Fetches reviews specific to the store. - "products": Fetches reviews specific to products.
          * @type {ReviewType}
          * @default store
         */
        "type"?: ReviewType;
    }
    interface SallaReviewsPage {
    }
    interface SallaReviewsSummary {
        /**
          * Product ID
         */
        "itemId": number;
    }
    interface SallaScopes {
        /**
          * Dictates when to show the search field
          * @default 6
         */
        "searchDisplayLimit"?: number;
        /**
          * Optionally open the modal or enforce the pop-up to the viewer
          * @default 'optional'
         */
        "selection"?: 'optional' | 'mandatory';
    }
    interface SallaSearch {
        /**
          * Sets the height of the input
          * @default 60
         */
        "height"?: number;
        /**
          * Set the component display without modal window. Defaults to `false`
          * @default false
         */
        "inline"?: boolean;
        /**
          * Maximum number of words allowed in the input
          * @default 5
         */
        "maxWords"?: number;
        /**
          * Adds a border radius to the input. Half of the height.
          * @default false
         */
        "oval"?: boolean;
        /**
          * Show submit action buttons at the end.
          * @default false
         */
        "showAction"?: boolean;
    }
    interface SallaSkeleton {
        /**
          * Set the skeleton height
          * @default '100%'
         */
        "height"?: string;
        /**
          * Set the shape type of the skeleton is it circle or normal
          * @default 'normal'
         */
        "type"?: 'circle' | 'normal';
        /**
          * Set the skeleton width
          * @default '100%'
         */
        "width"?: string;
    }
    interface SallaSlider {
        /**
          * Show/hide display all button beside arrows
          * @default false
         */
        "arrowsCentered"?: boolean;
        /**
          * Auto Height slider
          * @default false
         */
        "autoHeight"?: boolean;
        /**
          * Enable autoplay  - working with `type="carousel" only`
          * @default false
         */
        "autoPlay"?: boolean;
        /**
          * Show/hide slider block sub title
          * @default ''
         */
        "blockSubtitle"?: string;
        /**
          * Show/hide slider block title
          * @default ''
         */
        "blockTitle"?: string;
        /**
          * Enable center mode  - working with `type="carousel" only`
          * @default false
         */
        "centered"?: boolean;
        /**
          * Show/hide arrows
          * @default false
         */
        "controlsOuter"?: boolean;
        /**
          * Slider direction. Default: document.documentElement.dir
         */
        "direction"?: string;
        /**
          * Show/hide display all button beside arrows
          * @default ''
         */
        "displayAllUrl"?: string;
        /**
          * Disable thumbs slider and show it as a grid
          * @default false
         */
        "gridThumbs"?: boolean;
        /**
          * Enable call a specific slide by index from thumbnails option in `salla-slider-options` component, works only if `data-img-id` and `data-slid-index` attributes are set on each slide
          * @default false
         */
        "listenToThumbnailsOption"?: boolean;
        /**
          * Run slider in loop, Don't use it for slides with custom components inside it, because it may cause re-render issue
          * @default false
         */
        "loop"?: boolean;
        /**
          * Event will fired right after initialization.
         */
        "onAfterInit"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired when Swiper reach its beginning (initial position)
         */
        "onReachBeginning"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired when Swiper reach last slide
         */
        "onReachEnd"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired when currently active slide is changed
         */
        "onSlideChange"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired after animation to other slide (next or previous).
         */
        "onSlideChangeTransitionEnd"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired in the beginning of animation to other slide (next or previous).
         */
        "onSlideChangeTransitionStart"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Same as "slideChangeTransitionEnd" but for "forward" direction only
         */
        "onSlideNextTransitionEnd"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Same as "slideChangeTransitionStart" but for "forward" direction only
         */
        "onSlideNextTransitionStart"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Same as "slideChangeTransitionEnd" but for "backward" direction only
         */
        "onSlidePrevTransitionEnd"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Same as "slideChangeTransitionStart" but for "backward" direction only
         */
        "onSlidePrevTransitionStart"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired when user touch and move finger over Swiper and move it. Receives touchmove event as an arguments.
         */
        "onSliderMove"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired after transition.
         */
        "onSliderTransitionEnd"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired in the beginning of transition.
         */
        "onSliderTransitionStart"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired when user release Swiper. Receives touchend event as an arguments.
         */
        "onTouchSliderEnd"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired when user touch and move finger over Swiper. Receives touchmove event as an arguments.
         */
        "onTouchSliderMove"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Event will be fired when user touch Swiper. Receives touchstart event as an arguments.
         */
        "onTouchSliderStart"?: (event: SallaSliderCustomEvent<any>) => void;
        /**
          * Enable pagination
          * @default false
         */
        "pagination"?: boolean;
        /**
          * Show/hide arrows
          * @default true
         */
        "showControls"?: boolean;
        /**
          * Show/hide thumbs slider arrows
          * @default true
         */
        "showThumbsControls"?: boolean;
        /**
          * Slider Configs refer to https://swiperjs.com/swiper-api#parameters and pass the entire config object
          * @example let slider = document.querySelector('salla-slider');  slider.sliderConfig = {  slidesPerView: 1,  spaceBetween : 30,  lazy: true, }
         */
        "sliderConfig"?: any;
        /**
          * slidesPerView
          * @default "auto"
         */
        "slidesPerView"?: string;
        /**
          * Thumbs Slider Configs refer to https://swiperjs.com/swiper-api#parameters and pass the entire config object
          * @example let slider = document.querySelector('salla-slider');  slider.thumbsConfig = {  slidesPerView: 1,  spaceBetween : 30,  lazy: true, }
         */
        "thumbsConfig"?: any;
        /**
          * Set the type of the slider Default: ''
          * @default ''
         */
        "type"?: 'carousel' | 'fullscreen' | 'thumbs' | 'default' | 'hero' | 'testimonials' | 'blog' | 'fullwidth' | '';
        /**
          * Vertical or Horizontal main slider
          * @default false
         */
        "vertical"?: boolean;
        /**
          * Vertical or Horizontal thumbs slider
          * @default false
         */
        "verticalThumbs"?: boolean;
    }
    interface SallaSocial {
    }
    interface SallaSocialShare {
        /**
          * selected platforms to share | all platforms
          * @default 'facebook,twitter,whatsapp,email,copy_link'
         */
        "platforms"?: string;
        /**
          * page url that will be shared custom | current page url
          * @default ""
         */
        "url"?: string;
        /**
          * page url name that will be shared custom | current page url
          * @default ""
         */
        "urlName"?: string;
    }
    interface SallaTabContent {
        /**
          * Set name of the tab content. Mainly used as a key to s ynchronize the content with it's respective header.
         */
        "name"?: string;
    }
    interface SallaTabHeader {
        /**
          * The class applied to the currently active(selected) tab
          * @default undefined
         */
        "activeClass"?: string;
        /**
          * Center tab items in the given flex.
          * @default false
         */
        "centered"?: boolean;
        /**
          * Set the height of the tab bar
          * @default undefined
         */
        "height"?: number | string;
        /**
          * Header identifier name to sync with the content.
         */
        "name"?: string;
        /**
          * Emits event object when clicked or selected.
         */
        "onTabSelected"?: (event: SallaTabHeaderCustomEvent<any>) => void;
    }
    interface SallaTabs {
        /**
          * Background color
          * @default undefined
         */
        "backgroundColor"?: string;
        /**
          * Align tabs vertically.
          * @default false
         */
        "vertical"?: boolean;
    }
    interface SallaTelInput {
        /**
          * Automatically focus telephone input
         */
        "autofocus"?: boolean;
        /**
          * Current country_code
          * @default salla.config.get('user.country_code', 'SA') || 'SA'
         */
        "countryCode"?: string;
        /**
          * input name
          * @default false
         */
        "disabled"?: boolean;
        /**
          * input name
          * @default 'phone'
         */
        "name"?: string;
        /**
          * Event emmitted when user enters a phone number.
         */
        "onPhoneEntered"?: (event: SallaTelInputCustomEvent<Phone>) => void;
        /**
          * Current mobile number
         */
        "phone"?: string;
    }
    interface SallaTooltip {
        /**
          * The ID of the target element to which the tooltip is attached
         */
        "targetId"?: string;
        /**
          * The text content to display in the tooltip
         */
        "text"?: string;
    }
    interface SallaUserMenu {
        /**
          * To display the trigger as an avatar only
          * @default false
         */
        "avatarOnly"?: boolean;
        /**
          * To display only the list without the dropdown functionality
          * @default false
         */
        "inline"?: boolean;
        /**
          * To Make the dropdown menu relative to parent element or not
          * @default false
         */
        "relativeDropdown"?: boolean;
        /**
          * To display the dropdown header in mobile sheet
          * @default false
         */
        "showHeader"?: boolean;
    }
    /**
     * The SallaUserProfile is a versatile user profile form 
     * generator within the Salla platform, offering localization support, 
     * customizable fields, and seamless integration with the Salla API. 
     * It dynamically fetches translated strings for labels and messages from the 
     * Salla localization object, allowing for a multilingual user interface. Users 
     * can extend the default form with custom fields through the `customFields`
     * property and the setCustomFields method. The component manages user data 
     * retrieval from the Salla configuration and includes fields for first name, 
     * last name, birthday, gender, email, mobile, and custom additions. Form 
     * validation and submission are handled through various event handlers, ensuring 
     * proper field handling and user input validation. The component supports file 
     * uploads for photo fields and includes a dedicated phone number input field. 
     * The componentWillLoad lifecycle method fetches additional user profile 
     * information from the API during initialization. Overall, this component 
     * provides an efficient and adaptable solution for creating user profiles with a 
     * rich set of features and customization options.
     */
    interface SallaUserProfile {
        /**
          * Custome fields to be rendered in addition to the default ones.
         */
        "customFields"?: string;
        /**
          * The minimum allowed age for a user. Users with a birthdate indicating an age less than this value will be considered invalid. Defaults to 10.
          * @type {number}
          * @default 10
         */
        "minAge"?: number;
    }
    interface SallaUserSettings {
    }
    interface SallaVerify {
        /**
          * should auto reloading the page after success verification
          * @default true
         */
        "autoReload"?: boolean;
        /**
          * Should render component without modal
          * @default 'modal'
         */
        "display"?: 'inline' | 'modal';
        /**
          * Event when success verification
         */
        "onVerified"?: (event: SallaVerifyCustomEvent<any>) => void;
        /**
          * Once the api verify success, it will be login the customer in web pages
          * @default true
         */
        "supportWebAuth"?: boolean;
        /**
          * Verifying method
          * @default 'mobile'
         */
        "type"?: 'mobile' | 'email';
    }
    interface SallaWallet {
    }
    interface IntrinsicElements {
        "salla-add-product-button": SallaAddProductButton;
        "salla-advertisement": SallaAdvertisement;
        "salla-app-install-alert": SallaAppInstallAlert;
        "salla-apps-icons": SallaAppsIcons;
        "salla-booking-field": SallaBookingField;
        "salla-bottom-alert": SallaBottomAlert;
        "salla-breadcrumb": SallaBreadcrumb;
        "salla-button": SallaButton;
        "salla-cart-item-offers": SallaCartItemOffers;
        "salla-cart-summary": SallaCartSummary;
        "salla-color-picker": SallaColorPicker;
        "salla-comment-form": SallaCommentForm;
        "salla-comment-item": SallaCommentItem;
        "salla-comments": SallaComments;
        "salla-conditional-fields": SallaConditionalFields;
        "salla-conditional-offer": SallaConditionalOffer;
        "salla-contacts": SallaContacts;
        "salla-count-down": SallaCountDown;
        "salla-datetime-picker": SallaDatetimePicker;
        "salla-file-upload": SallaFileUpload;
        "salla-filters": SallaFilters;
        "salla-filters-widget": SallaFiltersWidget;
        "salla-gifting": SallaGifting;
        "salla-infinite-scroll": SallaInfiniteScroll;
        "salla-installment": SallaInstallment;
        "salla-list-tile": SallaListTile;
        "salla-loading": SallaLoading;
        "salla-localization-modal": SallaLocalizationModal;
        "salla-login-modal": SallaLoginModal;
        "salla-loyalty": SallaLoyalty;
        "salla-loyalty-prize-item": SallaLoyaltyPrizeItem;
        "salla-loyalty-program": SallaLoyaltyProgram;
        "salla-maintenance-alert": SallaMaintenanceAlert;
        "salla-map": SallaMap;
        "salla-menu": SallaMenu;
        "salla-metadata": SallaMetadata;
        "salla-modal": SallaModal;
        "salla-notification-item": SallaNotificationItem;
        "salla-notifications": SallaNotifications;
        "salla-offer": SallaOffer;
        "salla-offer-modal": SallaOfferModal;
        "salla-order-summary": SallaOrderSummary;
        "salla-orders": SallaOrders;
        "salla-payments": SallaPayments;
        "salla-placeholder": SallaPlaceholder;
        "salla-price-range": SallaPriceRange;
        "salla-product-availability": SallaProductAvailability;
        "salla-product-card": SallaProductCard;
        "salla-product-options": SallaProductOptions;
        "salla-product-size-guide": SallaProductSizeGuide;
        "salla-products-list": SallaProductsList;
        "salla-products-slider": SallaProductsSlider;
        "salla-progress-bar": SallaProgressBar;
        "salla-quantity-input": SallaQuantityInput;
        "salla-quick-buy": SallaQuickBuy;
        "salla-quick-order": SallaQuickOrder;
        "salla-rating-modal": SallaRatingModal;
        "salla-rating-stars": SallaRatingStars;
        "salla-review-card": SallaReviewCard;
        "salla-reviews": SallaReviews;
        "salla-reviews-page": SallaReviewsPage;
        "salla-reviews-summary": SallaReviewsSummary;
        "salla-scopes": SallaScopes;
        "salla-search": SallaSearch;
        "salla-skeleton": SallaSkeleton;
        "salla-slider": SallaSlider;
        "salla-social": SallaSocial;
        "salla-social-share": SallaSocialShare;
        "salla-tab-content": SallaTabContent;
        "salla-tab-header": SallaTabHeader;
        "salla-tabs": SallaTabs;
        "salla-tel-input": SallaTelInput;
        "salla-tooltip": SallaTooltip;
        "salla-user-menu": SallaUserMenu;
        "salla-user-profile": SallaUserProfile;
        "salla-user-settings": SallaUserSettings;
        "salla-verify": SallaVerify;
        "salla-wallet": SallaWallet;
    }
}
export { LocalJSX as JSX };
declare module "@stencil/core" {
    export namespace JSX {
        interface IntrinsicElements {
            "salla-add-product-button": LocalJSX.SallaAddProductButton & JSXBase.HTMLAttributes<HTMLSallaAddProductButtonElement>;
            "salla-advertisement": LocalJSX.SallaAdvertisement & JSXBase.HTMLAttributes<HTMLSallaAdvertisementElement>;
            "salla-app-install-alert": LocalJSX.SallaAppInstallAlert & JSXBase.HTMLAttributes<HTMLSallaAppInstallAlertElement>;
            "salla-apps-icons": LocalJSX.SallaAppsIcons & JSXBase.HTMLAttributes<HTMLSallaAppsIconsElement>;
            "salla-booking-field": LocalJSX.SallaBookingField & JSXBase.HTMLAttributes<HTMLSallaBookingFieldElement>;
            "salla-bottom-alert": LocalJSX.SallaBottomAlert & JSXBase.HTMLAttributes<HTMLSallaBottomAlertElement>;
            /**
             * @name SallaBreadcrumb
             * @description A StencilJS component for rendering breadcrumb navigation.
             * @tag salla-breadcrumb
             */
            "salla-breadcrumb": LocalJSX.SallaBreadcrumb & JSXBase.HTMLAttributes<HTMLSallaBreadcrumbElement>;
            "salla-button": LocalJSX.SallaButton & JSXBase.HTMLAttributes<HTMLSallaButtonElement>;
            "salla-cart-item-offers": LocalJSX.SallaCartItemOffers & JSXBase.HTMLAttributes<HTMLSallaCartItemOffersElement>;
            "salla-cart-summary": LocalJSX.SallaCartSummary & JSXBase.HTMLAttributes<HTMLSallaCartSummaryElement>;
            "salla-color-picker": LocalJSX.SallaColorPicker & JSXBase.HTMLAttributes<HTMLSallaColorPickerElement>;
            "salla-comment-form": LocalJSX.SallaCommentForm & JSXBase.HTMLAttributes<HTMLSallaCommentFormElement>;
            "salla-comment-item": LocalJSX.SallaCommentItem & JSXBase.HTMLAttributes<HTMLSallaCommentItemElement>;
            "salla-comments": LocalJSX.SallaComments & JSXBase.HTMLAttributes<HTMLSallaCommentsElement>;
            /**
             * its to easy to use, currenlty its support select & checkbox input as trigger for show/hide the dom
             * the dom you can put it like this data-show-when="{name of the field} {= or !=} {value of the field}"
             */
            "salla-conditional-fields": LocalJSX.SallaConditionalFields & JSXBase.HTMLAttributes<HTMLSallaConditionalFieldsElement>;
            "salla-conditional-offer": LocalJSX.SallaConditionalOffer & JSXBase.HTMLAttributes<HTMLSallaConditionalOfferElement>;
            "salla-contacts": LocalJSX.SallaContacts & JSXBase.HTMLAttributes<HTMLSallaContactsElement>;
            "salla-count-down": LocalJSX.SallaCountDown & JSXBase.HTMLAttributes<HTMLSallaCountDownElement>;
            "salla-datetime-picker": LocalJSX.SallaDatetimePicker & JSXBase.HTMLAttributes<HTMLSallaDatetimePickerElement>;
            "salla-file-upload": LocalJSX.SallaFileUpload & JSXBase.HTMLAttributes<HTMLSallaFileUploadElement>;
            "salla-filters": LocalJSX.SallaFilters & JSXBase.HTMLAttributes<HTMLSallaFiltersElement>;
            "salla-filters-widget": LocalJSX.SallaFiltersWidget & JSXBase.HTMLAttributes<HTMLSallaFiltersWidgetElement>;
            "salla-gifting": LocalJSX.SallaGifting & JSXBase.HTMLAttributes<HTMLSallaGiftingElement>;
            "salla-infinite-scroll": LocalJSX.SallaInfiniteScroll & JSXBase.HTMLAttributes<HTMLSallaInfiniteScrollElement>;
            "salla-installment": LocalJSX.SallaInstallment & JSXBase.HTMLAttributes<HTMLSallaInstallmentElement>;
            "salla-list-tile": LocalJSX.SallaListTile & JSXBase.HTMLAttributes<HTMLSallaListTileElement>;
            "salla-loading": LocalJSX.SallaLoading & JSXBase.HTMLAttributes<HTMLSallaLoadingElement>;
            "salla-localization-modal": LocalJSX.SallaLocalizationModal & JSXBase.HTMLAttributes<HTMLSallaLocalizationModalElement>;
            "salla-login-modal": LocalJSX.SallaLoginModal & JSXBase.HTMLAttributes<HTMLSallaLoginModalElement>;
            "salla-loyalty": LocalJSX.SallaLoyalty & JSXBase.HTMLAttributes<HTMLSallaLoyaltyElement>;
            "salla-loyalty-prize-item": LocalJSX.SallaLoyaltyPrizeItem & JSXBase.HTMLAttributes<HTMLSallaLoyaltyPrizeItemElement>;
            "salla-loyalty-program": LocalJSX.SallaLoyaltyProgram & JSXBase.HTMLAttributes<HTMLSallaLoyaltyProgramElement>;
            "salla-maintenance-alert": LocalJSX.SallaMaintenanceAlert & JSXBase.HTMLAttributes<HTMLSallaMaintenanceAlertElement>;
            "salla-map": LocalJSX.SallaMap & JSXBase.HTMLAttributes<HTMLSallaMapElement>;
            "salla-menu": LocalJSX.SallaMenu & JSXBase.HTMLAttributes<HTMLSallaMenuElement>;
            "salla-metadata": LocalJSX.SallaMetadata & JSXBase.HTMLAttributes<HTMLSallaMetadataElement>;
            "salla-modal": LocalJSX.SallaModal & JSXBase.HTMLAttributes<HTMLSallaModalElement>;
            "salla-notification-item": LocalJSX.SallaNotificationItem & JSXBase.HTMLAttributes<HTMLSallaNotificationItemElement>;
            "salla-notifications": LocalJSX.SallaNotifications & JSXBase.HTMLAttributes<HTMLSallaNotificationsElement>;
            /**
             * `salla-offer` is a StencilJS component that displays offers, categories, products, banks, and discount information.
             * It uses the `salla-slider` component for carousel functionality.
             * @csspart custom - Custom CSS part to target specific elements in the component.
             * @example <salla-offer product-id="123"></salla-offer>
             */
            "salla-offer": LocalJSX.SallaOffer & JSXBase.HTMLAttributes<HTMLSallaOfferElement>;
            "salla-offer-modal": LocalJSX.SallaOfferModal & JSXBase.HTMLAttributes<HTMLSallaOfferModalElement>;
            "salla-order-summary": LocalJSX.SallaOrderSummary & JSXBase.HTMLAttributes<HTMLSallaOrderSummaryElement>;
            "salla-orders": LocalJSX.SallaOrders & JSXBase.HTMLAttributes<HTMLSallaOrdersElement>;
            "salla-payments": LocalJSX.SallaPayments & JSXBase.HTMLAttributes<HTMLSallaPaymentsElement>;
            "salla-placeholder": LocalJSX.SallaPlaceholder & JSXBase.HTMLAttributes<HTMLSallaPlaceholderElement>;
            "salla-price-range": LocalJSX.SallaPriceRange & JSXBase.HTMLAttributes<HTMLSallaPriceRangeElement>;
            "salla-product-availability": LocalJSX.SallaProductAvailability & JSXBase.HTMLAttributes<HTMLSallaProductAvailabilityElement>;
            "salla-product-card": LocalJSX.SallaProductCard & JSXBase.HTMLAttributes<HTMLSallaProductCardElement>;
            "salla-product-options": LocalJSX.SallaProductOptions & JSXBase.HTMLAttributes<HTMLSallaProductOptionsElement>;
            "salla-product-size-guide": LocalJSX.SallaProductSizeGuide & JSXBase.HTMLAttributes<HTMLSallaProductSizeGuideElement>;
            "salla-products-list": LocalJSX.SallaProductsList & JSXBase.HTMLAttributes<HTMLSallaProductsListElement>;
            "salla-products-slider": LocalJSX.SallaProductsSlider & JSXBase.HTMLAttributes<HTMLSallaProductsSliderElement>;
            "salla-progress-bar": LocalJSX.SallaProgressBar & JSXBase.HTMLAttributes<HTMLSallaProgressBarElement>;
            "salla-quantity-input": LocalJSX.SallaQuantityInput & JSXBase.HTMLAttributes<HTMLSallaQuantityInputElement>;
            "salla-quick-buy": LocalJSX.SallaQuickBuy & JSXBase.HTMLAttributes<HTMLSallaQuickBuyElement>;
            "salla-quick-order": LocalJSX.SallaQuickOrder & JSXBase.HTMLAttributes<HTMLSallaQuickOrderElement>;
            "salla-rating-modal": LocalJSX.SallaRatingModal & JSXBase.HTMLAttributes<HTMLSallaRatingModalElement>;
            "salla-rating-stars": LocalJSX.SallaRatingStars & JSXBase.HTMLAttributes<HTMLSallaRatingStarsElement>;
            "salla-review-card": LocalJSX.SallaReviewCard & JSXBase.HTMLAttributes<HTMLSallaReviewCardElement>;
            "salla-reviews": LocalJSX.SallaReviews & JSXBase.HTMLAttributes<HTMLSallaReviewsElement>;
            "salla-reviews-page": LocalJSX.SallaReviewsPage & JSXBase.HTMLAttributes<HTMLSallaReviewsPageElement>;
            "salla-reviews-summary": LocalJSX.SallaReviewsSummary & JSXBase.HTMLAttributes<HTMLSallaReviewsSummaryElement>;
            "salla-scopes": LocalJSX.SallaScopes & JSXBase.HTMLAttributes<HTMLSallaScopesElement>;
            "salla-search": LocalJSX.SallaSearch & JSXBase.HTMLAttributes<HTMLSallaSearchElement>;
            "salla-skeleton": LocalJSX.SallaSkeleton & JSXBase.HTMLAttributes<HTMLSallaSkeletonElement>;
            "salla-slider": LocalJSX.SallaSlider & JSXBase.HTMLAttributes<HTMLSallaSliderElement>;
            "salla-social": LocalJSX.SallaSocial & JSXBase.HTMLAttributes<HTMLSallaSocialElement>;
            "salla-social-share": LocalJSX.SallaSocialShare & JSXBase.HTMLAttributes<HTMLSallaSocialShareElement>;
            "salla-tab-content": LocalJSX.SallaTabContent & JSXBase.HTMLAttributes<HTMLSallaTabContentElement>;
            "salla-tab-header": LocalJSX.SallaTabHeader & JSXBase.HTMLAttributes<HTMLSallaTabHeaderElement>;
            "salla-tabs": LocalJSX.SallaTabs & JSXBase.HTMLAttributes<HTMLSallaTabsElement>;
            "salla-tel-input": LocalJSX.SallaTelInput & JSXBase.HTMLAttributes<HTMLSallaTelInputElement>;
            "salla-tooltip": LocalJSX.SallaTooltip & JSXBase.HTMLAttributes<HTMLSallaTooltipElement>;
            "salla-user-menu": LocalJSX.SallaUserMenu & JSXBase.HTMLAttributes<HTMLSallaUserMenuElement>;
            /**
             * The SallaUserProfile is a versatile user profile form 
             * generator within the Salla platform, offering localization support, 
             * customizable fields, and seamless integration with the Salla API. 
             * It dynamically fetches translated strings for labels and messages from the 
             * Salla localization object, allowing for a multilingual user interface. Users 
             * can extend the default form with custom fields through the `customFields`
             * property and the setCustomFields method. The component manages user data 
             * retrieval from the Salla configuration and includes fields for first name, 
             * last name, birthday, gender, email, mobile, and custom additions. Form 
             * validation and submission are handled through various event handlers, ensuring 
             * proper field handling and user input validation. The component supports file 
             * uploads for photo fields and includes a dedicated phone number input field. 
             * The componentWillLoad lifecycle method fetches additional user profile 
             * information from the API during initialization. Overall, this component 
             * provides an efficient and adaptable solution for creating user profiles with a 
             * rich set of features and customization options.
             */
            "salla-user-profile": LocalJSX.SallaUserProfile & JSXBase.HTMLAttributes<HTMLSallaUserProfileElement>;
            "salla-user-settings": LocalJSX.SallaUserSettings & JSXBase.HTMLAttributes<HTMLSallaUserSettingsElement>;
            "salla-verify": LocalJSX.SallaVerify & JSXBase.HTMLAttributes<HTMLSallaVerifyElement>;
            "salla-wallet": LocalJSX.SallaWallet & JSXBase.HTMLAttributes<HTMLSallaWalletElement>;
        }
    }
}