/* 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 { Address } from "./components/address/address";
import { DateEvent } from "./types/date-event";
import { ChartType } from "chart.js";
import { IconLibraryMutator, IconLibraryResolver } from "./components/icon-library/icon-library-registry";
import { AnyLayer, AnySourceData } from "mapbox-gl";
import { CalendarDataSource } from "./types/calendar-data-source";
import { Period } from "./types/period";
import { Resource } from "./types/resource";
export namespace Components {
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAddress {
        /**
          * The list of countries to show in the list, defined as alpha-2 (fx. DA, EN, NO). If not specified, all countries are shown.
         */
        "countries": string[];
        /**
          * Set to true to disable the input.
         */
        "disabled": boolean;
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText": string;
        /**
          * The input's help text. Alternatively, you can use the help-text slot.
         */
        "helpText": string;
        /**
          * The input's label. Alternatively, you can use the label slot.
         */
        "label": string;
        /**
          * The input's value attribute.
         */
        "value": Address;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAlert {
        /**
          * Set to true to make the alert closable.
         */
        "closable": boolean;
        /**
          * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the alert before it closes (e.g. moves the mouse over it), the timer will restart.
         */
        "duration": number;
        /**
          * Hides the alert
         */
        "hide": () => Promise<void>;
        /**
          * Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods.
         */
        "open": boolean;
        /**
          * Shows the alert.
         */
        "show": () => Promise<void>;
        /**
          * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by calling this method again. The returned promise will resolve after the alert is hidden.
         */
        "toast": () => Promise<void>;
        /**
          * The type of alert.
         */
        "type": 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'neutral';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAnimation {
        /**
          * Clears all KeyframeEffects caused by this animation and aborts its playback.
         */
        "cancel": () => Promise<void>;
        /**
          * The number of milliseconds to delay the start of the animation.
         */
        "delay": number;
        /**
          * Determines the direction of playback as well as the behavior when reaching the end of an iteration.
         */
        "direction": PlaybackDirection;
        /**
          * The number of milliseconds each iteration of the animation takes to complete.
         */
        "duration": number;
        /**
          * The easing function to use for the animation. This can be a Stallion easing function or a custom easing function such as `cubic-bezier(0, 1, .76, 1.14)`.
         */
        "easing": string;
        /**
          * The number of milliseconds to delay after the active period of an animation sequence.
         */
        "endDelay": number;
        /**
          * Sets how the animation applies styles to its target before and after its execution.
         */
        "fill": FillMode;
        /**
          * Sets the playback time to the end of the animation corresponding to the current playback direction.
         */
        "finish": () => Promise<void>;
        /**
          * Gets a list of all supported animation names.
         */
        "getAnimationNames": () => Promise<string[]>;
        /**
          * Gets the current time of the animation in milliseconds.
         */
        "getCurrentTime": () => Promise<number>;
        /**
          * Gets a list of all supported easing function names.
         */
        "getEasingNames": () => Promise<string[]>;
        /**
          * The offset at which to start the animation, usually between 0 (start) and 1 (end).
         */
        "iterationStart": number;
        /**
          * The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.
         */
        "iterations": number;
        /**
          * The keyframes to use for the animation. If this is set, `name` will be ignored.
         */
        "keyframes": Keyframe[];
        /**
          * The name of the built-in animation to use. For custom animations, use the `keyframes` prop.
         */
        "name": string;
        /**
          * Pauses the animation. The animation will resume when this prop is removed.
         */
        "pause": boolean;
        /**
          * Sets the animation's playback rate. The default is `1`, which plays the animation at a normal speed. Setting this to `2`, for example, will double the animation's speed. A negative value can be used to reverse the animation. This value can be changed without causing the animation to restart.
         */
        "playbackRate": number;
        /**
          * Sets the current time of the animation in milliseconds.
         */
        "setCurrentTime": (time: number) => Promise<void>;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAuth {
        /**
          * The url of the auth api
         */
        "api": string;
        /**
          * The email to preset in the input
         */
        "email": string;
        /**
          * Whether changing email should be prevented
         */
        "preventEmailChange": boolean;
        /**
          * Reset the view
         */
        "reset": () => Promise<void>;
        /**
          * The optional description for the sign in view.
         */
        "signInDescription": string;
        /**
          * The header for the sign in view.
         */
        "signInHeader": any;
        /**
          * The url of the terms
         */
        "terms": string;
        /**
          * Whether webauthn is enabled if supported by client.
         */
        "webauthn": boolean;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAuthProfile {
        /**
          * The url of the auth api
         */
        "api": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAvatar {
        /**
          * Alternative text for the image.
         */
        "alt": string;
        /**
          * The image source to use for the avatar.
         */
        "image": string;
        /**
          * Initials to use as a fallback when no image is available (1-2 characters max recommended).
         */
        "initials": string;
        /**
          * The shape of the avatar.
         */
        "shape": 'circle' | 'square' | 'rounded';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlBadge {
        /**
          * Set to true to draw a pill-style badge with rounded edges.
         */
        "pill": boolean;
        /**
          * Set to true to make the badge pulsate to draw attention.
         */
        "pulse": boolean;
        /**
          * The badge's type.
         */
        "type": 'primary' | 'success' | 'info' | 'warning' | 'danger';
    }
    /**
     * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.
     * @documentation https://shoelace.style/components/breadcrumb
     * @status stable
     * @since $.0
     * @dependency sl-icon
     * @csspart base - The component's base wrapper.
     */
    interface SlBreadcrumb {
        /**
          * The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by screen readers and other assistive devices to provide more context for users.
         */
        "label": string;
    }
    /**
     * @summary Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.
     * @status stable
     * @since $.0
     * @csspart base - The component's base wrapper.
     * @csspart label - The breadcrumb item's label.
     * @csspart prefix - The container that wraps the prefix.
     * @csspart suffix - The container that wraps the suffix.
     * @csspart separator - The container that wraps the separator.
     */
    interface SlBreadcrumbItem {
        /**
          * Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered internally. When unset, a button will be rendered instead.
         */
        "href"?: string;
        /**
          * Whether this is displayed as leaf or not.
         */
        "leaf": boolean;
        /**
          * The `rel` attribute to use on the link. Only used when `href` is set.
         */
        "rel": string;
        /**
          * Tells the browser where to open the link. Only used when `href` is set.
         */
        "target"?: '_blank' | '_parent' | '_self' | '_top';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlBubble {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlButton {
        /**
          * Set to true to draw the button with a caret for use with dropdowns, popovers, etc.
         */
        "caret": boolean;
        /**
          * When true, the button will be rendered in a 'pushed' state.
         */
        "checked": boolean;
        /**
          * Set to true to draw a circle button.
         */
        "circle": boolean;
        /**
          * Set to true to disable the button.
         */
        "disabled": boolean;
        /**
          * Tells the browser to download the linked file as this filename. Only used when `href` is set.
         */
        "download": string;
        /**
          * When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.
         */
        "href": string;
        /**
          * Set to true to draw the button in a loading state.
         */
        "loading": boolean;
        /**
          * An optional name for the button. Ignored when `href` is set.
         */
        "name": string;
        /**
          * Set to true to draw a pill-style button with rounded edges.
         */
        "pill": boolean;
        /**
          * Removes focus from the button.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Sets focus on the button.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * The shape of the button.
         */
        "shape": 'block' | 'circle' | 'pill' | 'block-first' | 'block-middle' | 'block-last';
        /**
          * The button's size.
         */
        "size": 'small' | 'medium' | 'large';
        /**
          * Indicates if activating the button should submit the form. Ignored when `href` is set.
         */
        "submit": boolean;
        /**
          * Tells the browser where to open the link. Only used when `href` is set.
         */
        "target": '_blank' | '_parent' | '_self' | '_top';
        /**
          * The button's type.
         */
        "type": 'default' | 'primary' | 'danger' | 'text';
        /**
          * An optional value for the button. Ignored when `href` is set.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlButtonGroup {
        /**
          * A label to use for the button group's `aria-label` attribute.
         */
        "label": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlCalendar {
        /**
          * A date in the month to display.
         */
        "date": Date;
        /**
          * The date events to display in the calendar.
         */
        "events": DateEvent[];
        /**
          * Retrieves the currently displayable timerange
         */
        "getDisplayableRange": () => Promise<{ start: Date; end: Date; }>;
        /**
          * Retrieves detailed properties about the event that was emitted from the calendar, fx. date and resource related to the event.
         */
        "getEventProperties": (event: MouseEvent | DragEvent) => Promise<any>;
        /**
          * Optional resource id
         */
        "resourceId": string;
        /**
          * Selects an event specified by id.
         */
        "select": (id: string) => Promise<void>;
        /**
          * Sets date for the calendar
         */
        "setDate": (date: Date) => Promise<void>;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlCalendarDate {
        /**
          * The date for the cell.
         */
        "date": Date;
        /**
          * Events to show in cell.
         */
        "events": DateEvent[];
        /**
          * Removes focus
         */
        "removeFocus": () => Promise<void>;
        /**
          * The resource id for the cell.
         */
        "resourceId": string;
        /**
          * Set focus.
         */
        "setFocus": () => Promise<void>;
        /**
          * Whether to show date in cell.
         */
        "showBackgroundTitle": boolean;
        /**
          * Whether to show date in cell.
         */
        "showDate": boolean;
        /**
          * Whether to show week number in cell.
         */
        "showWeekNumber": boolean;
        /**
          * Whether to show date in cell.
         */
        "type": 'normal' | 'dimmed';
        /**
          * The id of the selected event.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlCard {
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlCell {
        /**
          * The allignment of the cell.
         */
        "align": 'left' | 'center' | 'right';
        /**
          * The property sets how overflowing inside an element is handled(normal/nowrap).
         */
        "nowrap": boolean;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlChart {
        /**
          * The chart data
         */
        "data": any;
        /**
          * The chart options
         */
        "options": any;
        /**
          * The chart type
         */
        "type": ChartType;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlCheckbox {
        /**
          * Set to true to draw the checkbox in a checked state.
         */
        "checked": boolean;
        /**
          * Set to true to disable the checkbox.
         */
        "disabled": boolean;
        /**
          * Set to true to draw the checkbox in an indeterminate state.
         */
        "indeterminate": boolean;
        /**
          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
         */
        "invalid": boolean;
        /**
          * The checkbox's name attribute.
         */
        "name": string;
        /**
          * Removes focus from the checkbox.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Checks for validity and shows the browser's validation message if the control is invalid.
         */
        "reportValidity": () => Promise<boolean>;
        /**
          * Set to true to make the checkbox a required field.
         */
        "required": boolean;
        /**
          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
         */
        "setCustomValidity": (message: string) => Promise<void>;
        /**
          * Sets focus on the checkbox.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * The checkbox's size.
         */
        "size": 'small' | 'medium' | 'large';
        /**
          * The checkbox's value attribute.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlColumn {
        /**
          * The alignment of the column.
         */
        "align": 'left' | 'center' | 'right';
    }
    interface SlDateCell {
        /**
          * The color of the background. Defaults to none.
         */
        "backgroundColor": 'blue' | 'red' | 'yellow' | 'green' | 'purple' | 'gray' | 'indigo' | 'pink';
        /**
          * Removes focus from the button.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Sets focus on the button.
         */
        "setFocus": () => Promise<void>;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDatePicker {
        /**
          * value of this control specified as an ISO-formatted date, fx. 2021-12-31
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDetails {
        /**
          * Set to true to prevent the user from toggling the details.
         */
        "disabled": boolean;
        /**
          * Hides the alert
         */
        "hide": () => Promise<void>;
        /**
          * Indicates whether or not the details is open. You can use this in lieu of the show/hide methods.
         */
        "open": boolean;
        /**
          * Shows the alert.
         */
        "show": () => Promise<void>;
        /**
          * The summary to show in the details header. If you need to display HTML, use the `summary` slot instead.
         */
        "summary": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDialog {
        /**
          * Set style for header. If hidden it will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the dialog.
         */
        "headerStyle": 'dense' | 'normal' | 'discreet' | 'hidden';
        /**
          * Hides the dialog
         */
        "hide": () => Promise<void>;
        /**
          * The dialog's label as displayed in the header. You should always include a relevant label even when hiding the header, as it is required for proper accessibility.
         */
        "label": string;
        /**
          * Indicates whether or not the dialog is open. You can use this in lieu of the show/hide methods.
         */
        "open": boolean;
        /**
          * The vertical position of the dialog. The normal behavior is to center it, but in some cirumstances it may be better to align it to the top, especially if the dialog changes its size.
         */
        "position": 'center' | 'top';
        /**
          * Shows the dialog
         */
        "show": () => Promise<void>;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDivider {
        /**
          * The direction of the divider
         */
        "direction": 'vertical' | 'horizontal';
        /**
          * Optional text to show in divider
         */
        "label"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDrawer {
        /**
          * By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of its parent element, set this prop and add `position: relative` to the parent.
         */
        "contained": boolean;
        /**
          * Hides the drawer
         */
        "hide": () => Promise<void>;
        /**
          * The drawer's label as displayed in the header. You should always include a relevant label even when using `no-header`, as it is required for proper accessibility.
         */
        "label": string;
        /**
          * Removes the header. This will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the drawer.
         */
        "noHeader": boolean;
        /**
          * Indicates whether or not the drawer is open. You can use this in lieu of the show/hide methods.
         */
        "open": boolean;
        /**
          * The direction from which the drawer will open.
         */
        "placement": 'top' | 'right' | 'bottom' | 'left';
        /**
          * Shows the drawer
         */
        "show": () => Promise<void>;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDropdown {
        /**
          * Determines whether the dropdown should hide when a menu item is selected.
         */
        "closeOnSelect": boolean;
        /**
          * The dropdown will close when the user interacts outside of this element (e.g. clicking).
         */
        "containingElement": HTMLElement;
        /**
          * The distance in pixels from which to offset the panel away from its trigger.
         */
        "distance": number;
        /**
          * Hides the dropdown panel
         */
        "hide": () => Promise<void>;
        /**
          * Enable this option to prevent the panel from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
         */
        "hoist": boolean;
        /**
          * Indicates whether or not the dropdown is open. You can use this in lieu of the show/hide methods.
         */
        "open": boolean;
        /**
          * The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel inside of the viewport.
         */
        "placement": | 'top'
    | 'top-start'
    | 'top-end'
    | 'bottom'
    | 'bottom-start'
    | 'bottom-end'
    | 'right'
    | 'right-start'
    | 'right-end'
    | 'left'
    | 'left-start'
    | 'left-end';
        /**
          * Shows the dropdown panel
         */
        "show": () => Promise<void>;
        /**
          * The distance in pixels from which to offset the panel along its trigger.
         */
        "skidding": number;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlEmpty {
        /**
          * The empty headline
         */
        "header": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFieldrow {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFieldset {
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText": string;
        /**
          * The input's help text. Alternatively, you can use the help-text slot.
         */
        "helpText": string;
        /**
          * The input's label. Alternatively, you can use the label slot.
         */
        "label": string;
        /**
          * The input's size.
         */
        "size": 'small' | 'medium' | 'large';
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlFlex {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlForm {
        /**
          * Gets all form control elements (native and custom).
         */
        "getFormControls": () => Promise<HTMLElement[]>;
        /**
          * Serializes all form controls elements and returns a `FormData` object.
         */
        "getFormData": () => Promise<FormData>;
        /**
          * Prevent the form from validating inputs before submitting.
         */
        "novalidate": boolean;
        /**
          * Submits the form. If all controls are valid, the `sl-submit` event will be emitted and the promise will resolve with `true`. If any form control is invalid, the promise will resolve with `false` and no event will be emitted.
         */
        "submit": () => Promise<boolean>;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFormatBytes {
        /**
          * The locale to use when formatting the number.
         */
        "locale": string;
        /**
          * The unit to display.
         */
        "unit": 'bytes' | 'bits';
        /**
          * The number to format in bytes.
         */
        "value": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFormatDate {
        /**
          * The date/time to format. If not set, the current date and time will be used.
         */
        "date": Date | string;
        /**
          * The format for displaying the day.
         */
        "day": 'numeric' | '2-digit';
        /**
          * The format for displaying the era.
         */
        "era": 'narrow' | 'short' | 'long';
        /**
          * The format for displaying the hour.
         */
        "hour": 'numeric' | '2-digit';
        /**
          * When set, 24 hour time will always be used.
         */
        "hourFormat": 'auto' | '12' | '24';
        /**
          * The locale to use when formatting the date/time.
         */
        "locale": string;
        /**
          * The format for displaying the minute.
         */
        "minute": 'numeric' | '2-digit';
        /**
          * The format for displaying the month.
         */
        "month": 'numeric' | '2-digit' | 'narrow' | 'short' | 'long';
        /**
          * The format for displaying the second.
         */
        "second": 'numeric' | '2-digit';
        /**
          * The time zone to express the time in.
         */
        "timeZone": string;
        /**
          * The format for displaying the time.
         */
        "timeZoneName": 'short' | 'long';
        /**
          * The format for displaying the weekday.
         */
        "weekday": 'narrow' | 'short' | 'long';
        /**
          * The format for displaying the year.
         */
        "year": 'numeric' | '2-digit';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFormatNumber {
        /**
          * The currency to use when formatting. Must be an ISO 4217 currency code such as `USD` or `EUR`.
         */
        "currency": string;
        /**
          * How to display the currency.
         */
        "currencyDisplay": 'symbol' | 'narrowSymbol' | 'code' | 'name';
        /**
          * The locale to use when formatting the number.
         */
        "locale": string;
        /**
          * The maximum number of fraction digits to use. Possible values are 0 - 20.
         */
        "maximumFractionDigits": number;
        /**
          * The maximum number of significant digits to use,. Possible values are 1 - 21.
         */
        "maximumSignificantDigits": number;
        /**
          * The minimum number of fraction digits to use. Possible values are 0 - 20.
         */
        "minimumFractionDigits": number;
        /**
          * The minimum number of integer digits to use. Possible values are 1 - 21.
         */
        "minimumIntegerDigits": number;
        /**
          * The minimum number of significant digits to use. Possible values are 1 - 21.
         */
        "minimumSignificantDigits": number;
        /**
          * Turns off grouping separators.
         */
        "noGrouping": boolean;
        /**
          * The formatting style to use.
         */
        "type": 'currency' | 'decimal' | 'percent';
        /**
          * The number to format.
         */
        "value": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFormatRrule {
        /**
          * The recurrence rule to format.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlGrid {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlIcon {
        /**
          * An alternative description to use for accessibility. If omitted, the name or src will be used to generate it.
         */
        "label": string;
        /**
          * The name of a registered custom icon library.
         */
        "library": string;
        /**
          * The name of the icon to draw.
         */
        "name": string;
        "redraw": () => Promise<void>;
        /**
          * An external URL of an SVG file.
         */
        "src": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlIconButton {
        /**
          * Set to true to disable the button.
         */
        "disabled": boolean;
        /**
          * A description that gets read by screen readers and other assistive devices. For optimal accessibility, you should always include a label that describes what the icon button does.
         */
        "label": string;
        /**
          * The name of a registered custom icon library.
         */
        "library": string;
        /**
          * The name of the icon to draw.
         */
        "name": string;
        /**
          * An external URL of an SVG file.
         */
        "src": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlIconLibrary {
        /**
          * A function that mutates the SVG element before it renders.
         */
        "mutator": IconLibraryMutator;
        /**
          * The name of the icon library.
         */
        "name": string;
        /**
          * A function that translates an icon name to a URL where the corresponding SVG file exists The URL can be local or a CORS-enabled endpoint.
         */
        "resolver": IconLibraryResolver;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlInclude {
        /**
          * Allows included scripts to be executed. You must ensure the content you're including is trusted, otherwise this option can lead to XSS vulnerabilities in your app!
         */
        "allowScripts": boolean;
        /**
          * The fetch mode to use.
         */
        "mode": 'cors' | 'no-cors' | 'same-origin';
        /**
          * The location of the HTML file to include.
         */
        "src": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlInput {
        /**
          * The input's horizontal align.
         */
        "align": 'left' | 'center' | 'right';
        /**
          * The input's autocaptialize attribute.
         */
        "autocapitalize": string;
        /**
          * The input's autocomplete attribute.
         */
        "autocomplete": string;
        /**
          * The input's autocorrect attribute.
         */
        "autocorrect": string;
        /**
          * The input's autofocus attribute.
         */
        "autofocus": boolean;
        /**
          * Set to true to add a clear button when the input is populated.
         */
        "clearable": boolean;
        /**
          * Set to true to disable the input.
         */
        "disabled": boolean;
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText": string;
        /**
          * The input's help text. Alternatively, you can use the help-text slot.
         */
        "helpText": string;
        /**
          * Enable this option to prevent input editor using dropdowns from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
         */
        "hoist": boolean;
        /**
          * The input's inputmode attribute.
         */
        "inputmode": 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
        /**
          * This will be true when the control is in an invalid state. Validity is determined by props such as `type`, `required`, `minlength`, `maxlength`, and `pattern` using the browser's constraint validation API.
         */
        "invalid": boolean;
        /**
          * The input's label. Alternatively, you can use the label slot.
         */
        "label": string;
        /**
          * The input's maximum value.
         */
        "max": number;
        /**
          * The maximum length of input that will be considered valid.
         */
        "maxlength": number;
        /**
          * The input's minimum value.
         */
        "min": number;
        /**
          * The minimum length of input that will be considered valid.
         */
        "minlength": number;
        /**
          * The input's name attribute.
         */
        "name": string;
        /**
          * A pattern to validate input against.
         */
        "pattern": string;
        /**
          * Set to true to draw a pill-style input with rounded edges.
         */
        "pill": boolean;
        /**
          * The input's placeholder text.
         */
        "placeholder": string;
        /**
          * Set to true to make the input readonly.
         */
        "readonly": boolean;
        /**
          * Removes focus from the input.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Checks for validity and shows the browser's validation message if the control is invalid.
         */
        "reportValidity": () => Promise<boolean>;
        /**
          * Set to true to make the input a required field.
         */
        "required": boolean;
        /**
          * Selects all the text in the input.
         */
        "select": () => Promise<void>;
        /**
          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
         */
        "setCustomValidity": (message: string) => Promise<void>;
        /**
          * Sets focus on the input.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * Replaces a range of text with a new string.
         */
        "setRangeText": (replacement: string, start: number, end: number, selectMode?: 'select' | 'start' | 'end' | 'preserve') => Promise<void>;
        /**
          * Sets the start and end positions of the text selection (0-based).
         */
        "setSelectionRange": (selectionStart: number, selectionEnd: number, selectionDirection?: 'forward' | 'backward' | 'none') => Promise<void>;
        /**
          * The input's size.
         */
        "size": 'small' | 'medium' | 'large';
        /**
          * Enables spell checking on the input.
         */
        "spellcheck": boolean;
        /**
          * The input's step attribute.
         */
        "step": number;
        /**
          * Set to true to add a password toggle button for password inputs.
         */
        "togglePassword": boolean;
        /**
          * The input's type.
         */
        "type": 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url' | 'date' | 'time';
        /**
          * The input's value attribute.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlLabel {
        /**
          * The label's size
         */
        "color"?: | 'blue'
    | 'green'
    | 'red'
    | 'yellow'
    | 'purple'
    | 'light'
    | 'dark'
    | 'medium'
    | 'very-light'
    | 'very-dark';
        /**
          * Whether the label is multiline.
         */
        "multiline": boolean;
        /**
          * The label's size
         */
        "size": 'x-small' | 'small' | 'medium' | 'large' | 'x-large';
        /**
          * The label's weight
         */
        "weight": 'light' | 'normal' | 'semibold' | 'bold';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlLayout {
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlList {
        /**
          * Set to 'full' to show lines between list items.
         */
        "lines": 'full' | 'none';
        /**
          * The value of the control..
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlListDivider {
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlListItem {
        /**
          * Whether this item is visually active or not.
         */
        "active": boolean;
        /**
          * Whether the items are vertically centered or not. By default they align to the top
         */
        "center": boolean;
        /**
          * A value that can be attached to the list item.
         */
        "value": any;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlMap {
        /**
          * The mapbox access token (Required)
         */
        "accessToken": string;
        /**
          * Adds new layer.
         */
        "addLayer": (layer: AnyLayer) => Promise<void>;
        /**
          * Adds a marker to the map.
         */
        "addMarker": (id: string, longitude: number, latitude: number, options?: { element?: HTMLElement; anchor: 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'; }) => Promise<void>;
        /**
          * Adds new source.
          * @param source
         */
        "addSource": (id: string, source: AnySourceData) => Promise<void>;
        /**
          * Removes layers added to map.
         */
        "clearLayers": () => Promise<void>;
        /**
          * Removes all markers on the map.
         */
        "clearMarkers": () => Promise<void>;
        /**
          * Removes sources added to map.
         */
        "clearSources": () => Promise<void>;
        /**
          * Fits map to markers if any
         */
        "fitBounds": () => Promise<void>;
        /**
          * Retrieves the inner mapbox object.
          * @returns
         */
        "getInnerMap": () => Promise<mapboxgl.Map>;
        /**
          * Retrieves a marker
         */
        "getMarker": (id: string) => Promise<mapboxgl.Marker | undefined>;
        /**
          * The latitude center
         */
        "lat": number;
        /**
          * The longitude center
         */
        "lng": number;
        /**
          * Centers the map on the specified coordinate.
         */
        "locate": (latitude: number, longitude: number) => Promise<void>;
        /**
          * The map style.
         */
        "mapStyle": string;
        /**
          * Removes a marker from the map.
         */
        "removeMarker": (id: string) => Promise<void>;
        /**
          * The default zoom
         */
        "zoom": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlMenu {
        /**
          * Initiates type-to-select logic, which automatically selects an option based on what the user is currently typing. The key passed will be appended to the internal query and the selection will be updated. After a brief period, the internal query is cleared automatically. This method is intended to be used with the keydown event. Useful for enabling type-to-select when the menu doesn't have focus.
         */
        "typeToSelect": (key: string) => Promise<void>;
    }
    /**
     * @since 1.0
     * @status deprecated
     */
    interface SlMenuDivider {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlMenuItem {
        /**
          * Set to true to draw the item in a checked state.
         */
        "checked": boolean;
        /**
          * Set to true to draw the menu item in a disabled state.
         */
        "disabled": boolean;
        /**
          * Removes focus from the menu item
         */
        "removeFocus": () => Promise<void>;
        /**
          * Sets focus on the menu item.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * The menu items type.
         */
        "type": 'default' | 'primary' | 'danger';
        /**
          * A unique value to store in the menu item. This can be used as a way to identify menu items when selected.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlMenuLabel {
    }
    interface SlOtpInput {
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText": string;
        /**
          * Removes focus from the input.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Sets focus on the input.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * The value of the component.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlOtpView {
        /**
          * The email the display as recipient of the code.
         */
        "email": string;
        /**
          * Optional error text for show under the input.
         */
        "errorText": string;
        /**
          * The default otp to use in the input
         */
        "otp": string;
        /**
          * Sets focus on the input element
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlPageHeader {
        /**
          * The header text.
         */
        "header": string;
        /**
          * Whether the position of the header is sticky or not.
         */
        "sticky": boolean;
        /**
          * The type of page header.
         */
        "type": 'opaque' | 'frosted';
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlPagination {
        /**
          * The current page.
         */
        "page": number;
        /**
          * The total pages available.
         */
        "totalPages": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlPopover {
        /**
          * The positioning anchor that defines the attachment point of the popover.
         */
        "anchorElement": HTMLElement;
        /**
          * A Boolean value that determines whether to show an arrow pointing at the anchorElement.
         */
        "arrow": boolean;
        /**
          * The distance in pixels from which to offset the popover away from its trigger.
         */
        "distance": number;
        /**
          * Hides the dropdown panel
         */
        "hide": () => Promise<void>;
        /**
          * Indicates whether or not the popover is open. You can use this in lieu of the show/hide methods.
         */
        "open": boolean;
        /**
          * The preferred placement of the popover panel. Note that the actual placement may vary as needed to keep the panel inside of the viewport.
         */
        "placement": | 'top'
    | 'top-start'
    | 'top-end'
    | 'bottom'
    | 'bottom-start'
    | 'bottom-end'
    | 'right'
    | 'right-start'
    | 'right-end'
    | 'left'
    | 'left-start'
    | 'left-end';
        /**
          * Shows the dropdown panel
         */
        "show": () => Promise<void>;
        /**
          * The distance in pixels from which to offset the popover along its trigger.
         */
        "skidding": number;
        /**
          * Updates the position of the popover
         */
        "update": () => Promise<void>;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlProgressBar {
        /**
          * When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.
         */
        "indeterminate": boolean;
        /**
          * The progress bar's percentage, 0 to 100.
         */
        "percentage": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlProgressRing {
        /**
          * The current progress percentage, 0 - 100.
         */
        "percentage": number;
        /**
          * The size of the progress ring in pixels.
         */
        "size": number;
        /**
          * The stroke width of the progress ring in pixels.
         */
        "strokeWidth": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRadio {
        /**
          * Set to true to draw the radio in a checked state.
         */
        "checked": boolean;
        /**
          * Set to true to disable the radio.
         */
        "disabled": boolean;
        /**
          * This will be true when the control is in an invalid state. Validity in range inputs is determined by the message provided by the `setCustomValidity` method.
         */
        "invalid": boolean;
        /**
          * The radio's name attribute.
         */
        "name": string;
        /**
          * Set to true to make the radio readonly.
         */
        "readonly": boolean;
        /**
          * Removes focus from the radio.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Checks for validity and shows the browser's validation message if the control is invalid.
         */
        "reportValidity": () => Promise<boolean>;
        /**
          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
         */
        "setCustomValidity": (message: string) => Promise<void>;
        /**
          * Sets focus on the radio.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * The radio's size.
         */
        "size": 'small' | 'medium' | 'large';
        /**
          * The radio's value attribute.
         */
        "value": string;
    }
    /**
     * @since 1.8
     * @status experimental
     */
    interface SlRadioGroup {
        /**
          * Set to true to disable the component.
         */
        "disabled": boolean;
        /**
          * The value of this component.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRange {
        /**
          * Set to true to disable the input.
         */
        "disabled": boolean;
        /**
          * The range's help text. Alternatively, you can use the help-text slot.
         */
        "helpText": string;
        /**
          * This will be true when the control is in an invalid state. Validity in range inputs is determined by the message provided by the `setCustomValidity` method.
         */
        "invalid": boolean;
        /**
          * The range's label. Alternatively, you can use the label slot.
         */
        "label": string;
        /**
          * The input's max attribute.
         */
        "max": number;
        /**
          * The input's min attribute.
         */
        "min": number;
        /**
          * The input's name attribute.
         */
        "name": string;
        /**
          * Removes focus from the input.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
         */
        "setCustomValidity": (message: string) => Promise<void>;
        /**
          * Sets focus on the input.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * The input's step attribute.
         */
        "step": number;
        /**
          * The preferred placedment of the tooltip.
         */
        "tooltip": 'top' | 'bottom' | 'none';
        /**
          * A function used to format the tooltip's value.
         */
        "tooltipFormatter": (value: number) => string;
        /**
          * The input's value attribute.
         */
        "value": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRating {
        /**
          * Disables the rating.
         */
        "disabled": boolean;
        /**
          * A function that returns the symbols to display. Accepts an option `value` parameter you can use to map a specific symbol to a value.
         */
        "getSymbol": (value?: number) => string;
        /**
          * The highest rating to show.
         */
        "max": number;
        /**
          * The minimum increment value allowed by the control.
         */
        "precision": number;
        /**
          * Makes the rating readonly.
         */
        "readonly": boolean;
        /**
          * Removes focus from the rating.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Sets focus on the rating.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * The current rating.
         */
        "value": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRelativeTime {
        /**
          * The date from which to calculate time from.
         */
        "date": Date | string;
        /**
          * The formatting style to use.
         */
        "format": 'long' | 'short' | 'narrow';
        /**
          * The locale to use when formatting the number.
         */
        "locale": string;
        /**
          * When `auto`, values such as "yesterday" and "tomorrow" will be shown when possible. When `always`, values such as "1 day ago" and "in 1 day" will be shown.
         */
        "numeric": 'always' | 'auto';
        /**
          * Keep the displayed value up to date as time passes.
         */
        "sync": boolean;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlResizeObserver {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlResponsiveEmbed {
        /**
          * The aspect ratio of the embedded media in the format of `width:height`, e.g. `16:9`, `4:3`, or `1:1`. Ratios not in this format will be ignored.
         */
        "aspectRatio": string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlRow {
        /**
          * The columns.
         */
        "columns": HTMLSlColumnElement[];
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRrulePicker {
        /**
          * Whether the rrule-picker allows selection of specific rules that includes BYDAY, BYMONTH, BYWEEK etc.
         */
        "allowSpecific": boolean;
        /**
          * The value of the rrule picker.
         */
        "value": string;
    }
    interface SlScheduler {
        /**
          * The data source for the timeline. Enables the timeline to load resources and events when needed.
         */
        "dataSource": CalendarDataSource;
        /**
          * Retrieves detailed properties about the event that was emitted from the timeline, fx. date and resource related to the event.
         */
        "getEventProperties": (event: MouseEvent | DragEvent) => Promise<any>;
        /**
          * Refreshes the active view.
         */
        "refresh": () => Promise<void>;
        /**
          * Selects event with specified id
         */
        "select": (id: string) => Promise<void>;
        /**
          * The selected resources
         */
        "selectedResources": string[];
        /**
          * Whether to show controls for selecting resource
         */
        "showResourceSelector": boolean;
        /**
          * Whether to show controls for selecting view
         */
        "showViewSelector": boolean;
        /**
          * The start date of the current view in the scheduler.
         */
        "startDate": Date;
        /**
          * The view of the scheduler
         */
        "view": 'timeline' | 'calendar';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSection {
        /**
          * The description of the section
         */
        "description": string;
        /**
          * The header of the section
         */
        "header": string;
        /**
          * Defines the type of section layout
         */
        "type": 'two-column';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSelect {
        /**
          * Set to true to add a clear button when the select is populated.
         */
        "clearable": boolean;
        /**
          * Set the amount of time, in milliseconds, to wait to trigger the `search` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.
         */
        "debounce": number;
        /**
          * Set to true to disable the select control.
         */
        "disabled": boolean;
        /**
          * The select's error text. Alternatively, you can use the error-text slot.
         */
        "errorText": string;
        /**
          * The select's help text. Alternatively, you can use the help-text slot.
         */
        "helpText": string;
        /**
          * Enable this option to prevent the panel from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
         */
        "hoist": boolean;
        /**
          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
         */
        "invalid": boolean;
        /**
          * The select's label. Alternatively, you can use the label slot.
         */
        "label": string;
        /**
          * The maximum number of tags to show when `multiple` is true. After the maximum, "+n" will be shown to indicate the number of additional items that are selected. Set to -1 to remove the limit.
         */
        "maxTagsVisible": number;
        /**
          * Set to true to enable multiselect.
         */
        "multiple": boolean;
        /**
          * The select's name.
         */
        "name": string;
        /**
          * Set to true to draw a pill-style select with rounded edges.
         */
        "pill": boolean;
        /**
          * The select's placeholder text.
         */
        "placeholder": string;
        /**
          * Checks for validity and shows the browser's validation message if the control is invalid.
         */
        "reportValidity": () => Promise<boolean>;
        /**
          * The select's required attribute.
         */
        "required": boolean;
        /**
          * The label displayed in the input field when select is searchable. Can be used to set the display value of a searchbox before anyhing has been searched for.
         */
        "search": string;
        /**
          * Set to true to add a clear button when the select is populated.
         */
        "searchable": boolean;
        /**
          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
         */
        "setCustomValidity": (message: string) => Promise<void>;
        /**
          * The select's size.
         */
        "size": 'small' | 'medium' | 'large';
        /**
          * The value of the control. This will be a string or an array depending on `multiple`.
         */
        "value": string | Array<string>;
    }
    interface SlSidebar {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSkeleton {
        /**
          * Determines which effect the skeleton will use.
         */
        "effect": 'pulse' | 'sheen' | 'none';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSpinner {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSplitLayout {
        /**
          * Sets the direction of the split layout.
         */
        "direction": 'vertical' | 'horizontal';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlStatistic {
        /**
          * The legend for the statistic
         */
        "legend": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlStep {
        /**
          * The active step.
         */
        "step": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlStepItem {
        /**
          * Whether the step is active or not. (Will be set by the Step component)
         */
        "active": boolean;
        /**
          * Header for the step item. (Will be set by the Step component.)
         */
        "header": string;
        /**
          * Label for the step item.
         */
        "label": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSwitch {
        /**
          * Set to true to draw the switch in a checked state.
         */
        "checked": boolean;
        /**
          * Set to true to disable the switch.
         */
        "disabled": boolean;
        /**
          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
         */
        "invalid": boolean;
        /**
          * The switch's name attribute.
         */
        "name": string;
        /**
          * Removes focus from the switch.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Checks for validity and shows the browser's validation message if the control is invalid.
         */
        "reportValidity": () => Promise<boolean>;
        /**
          * Set to true to make the switch a required field.
         */
        "required": boolean;
        /**
          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
         */
        "setCustomValidity": (message: string) => Promise<void>;
        /**
          * Sets focus on the switch.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * The switch's value attribute.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTab {
        /**
          * Set to true to draw the tab in an active state.
         */
        "active": boolean;
        /**
          * When true, the tab will be rendered with a close icon.
         */
        "closable": boolean;
        /**
          * Set to true to draw the tab in a disabled state.
         */
        "disabled": boolean;
        /**
          * The name of the tab panel the tab will control. The panel must be located in the same tab group.
         */
        "panel": string;
        /**
          * Removes focus from the tab.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Sets focus to the tab.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTabGroup {
        /**
          * Disables the scroll arrows that appear when tabs overflow.
         */
        "noScrollControls": boolean;
        /**
          * The placement of the tabs.
         */
        "placement": 'top' | 'bottom' | 'left' | 'right';
        /**
          * Shows the specified tab panel.
         */
        "show": (panel: string) => Promise<void>;
        /**
          * Name of the selected tab
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTabPanel {
        /**
          * When true, the tab panel will be shown.
         */
        "active": boolean;
        /**
          * The tab panel's name.
         */
        "name": string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlTable {
        /**
          * Defines how the table can scroll.
         */
        "scrollBehaviour": 'none' | 'vertical' | 'horizontal' | 'both';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTag {
        /**
          * Set to true to make the tag clearable.
         */
        "clearable": boolean;
        /**
          * Name of icon to display in tag.
         */
        "icon": any;
        /**
          * Set to true to draw a pill-style tag with rounded edges.
         */
        "pill": boolean;
        /**
          * The tag's size.
         */
        "size": 'small' | 'medium' | 'large';
        /**
          * The tag's type.
         */
        "type": 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'text';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTextarea {
        /**
          * The textarea's autocaptialize attribute.
         */
        "autocapitalize": string;
        /**
          * The textarea's autocomplete attribute.
         */
        "autocomplete": string;
        /**
          * The textarea's autocorrect attribute.
         */
        "autocorrect": string;
        /**
          * The textarea's autofocus attribute.
         */
        "autofocus": boolean;
        /**
          * Set to true to disable the textarea.
         */
        "disabled": boolean;
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText": string;
        /**
          * The textarea's help text. Alternatively, you can use the help-text slot.
         */
        "helpText": string;
        /**
          * The textarea's inputmode attribute.
         */
        "inputmode": 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
        /**
          * This will be true when the control is in an invalid state. Validity is determined by props such as `required`, `minlength`, and `maxlength` using the browser's constraint validation API.
         */
        "invalid": boolean;
        /**
          * The textarea's label. Alternatively, you can use the label slot.
         */
        "label": string;
        /**
          * The maximum length of input that will be considered valid.
         */
        "maxlength": number;
        /**
          * The minimum length of input that will be considered valid.
         */
        "minlength": number;
        /**
          * The textarea's name attribute.
         */
        "name": string;
        /**
          * The textarea's placeholder text.
         */
        "placeholder": string;
        /**
          * Set to true for a readonly textarea.
         */
        "readonly": boolean;
        /**
          * Removes focus fromt the textarea.
         */
        "removeFocus": () => Promise<void>;
        /**
          * Checks for validity and shows the browser's validation message if the control is invalid.
         */
        "reportValidity": () => Promise<boolean>;
        /**
          * The textarea's required attribute.
         */
        "required": boolean;
        /**
          * Controls how the textarea can be resized.
         */
        "resize": 'none' | 'vertical' | 'auto';
        /**
          * The number of rows to display by default.
         */
        "rows": number;
        /**
          * Selects all the text in the input.
         */
        "select": () => Promise<void>;
        /**
          * Sets a custom validation message. If `message` is not empty, the field will be considered invalid.
         */
        "setCustomValidity": (message: string) => Promise<void>;
        /**
          * Sets focus on the textarea.
         */
        "setFocus": (options?: FocusOptions) => Promise<void>;
        /**
          * Replaces a range of text with a new string.
         */
        "setRangeText": (replacement: string, start: number, end: number, selectMode?: 'select' | 'start' | 'end' | 'preserve') => Promise<void>;
        /**
          * Sets the start and end positions of the text selection (0-based).
         */
        "setSelectionRange": (selectionStart: number, selectionEnd: number, selectionDirection?: 'forward' | 'backward' | 'none') => Promise<void>;
        /**
          * The textarea's size.
         */
        "size": 'small' | 'medium' | 'large';
        /**
          * The textarea's spellcheck attribute.
         */
        "spellcheck": boolean;
        /**
          * The textarea's value attribute.
         */
        "value": string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlTheme {
        /**
          * The name of the theme to use. The user is responsible for including the associated stylesheet(s). Supportive themes must adhere to theme guidelines by exposing a class that follows the `sl-theme-{name}` convention.
         */
        "name": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTimePeriod {
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText": string;
        /**
          * The input's help text. Alternatively, you can use the help-text slot.
         */
        "helpText": string;
        /**
          * The input's label.
         */
        "label"?: string;
        /**
          * The input's size.
         */
        "size": 'small' | 'medium' | 'large';
        /**
          * The input's value.
         */
        "value": Period;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTimeline {
        /**
          * The first date to display in the timeline.
         */
        "date": Date;
        /**
          * The date events to display in the timeline.
         */
        "events": DateEvent[];
        /**
          * Retrieves the currently displayable timerange
         */
        "getDisplayableRange": () => Promise<{ start: Date; end: Date; }>;
        /**
          * Retrieves detailed properties about the event that was emitted from the timeline, fx. date and resource related to the event.
         */
        "getEventProperties": (event: MouseEvent | DragEvent) => Promise<any>;
        /**
          * The resources to display in the timeline.
         */
        "resources": Resource[];
        /**
          * Selects an event specified by id.
         */
        "select": (id: string) => Promise<void>;
        /**
          * Optional preselected id
         */
        "selectedId": string;
        /**
          * Sets date for the timeline
         */
        "setDate": (date: Date) => Promise<void>;
        /**
          * Number of weeks to display. Must be between 1 to 4.
         */
        "weeks": number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTooltip {
        /**
          * The tooltip's content. Alternatively, you can use the content slot.
         */
        "content": string;
        /**
          * Set to true to disable the tooltip so it won't show when triggered.
         */
        "disabled": boolean;
        /**
          * The distance in pixels from which to offset the tooltip away from its target.
         */
        "distance": number;
        /**
          * Shows the tooltip.
         */
        "hide": () => Promise<void>;
        /**
          * Indicates whether or not the tooltip is open. You can use this in lieu of the show/hide methods.
         */
        "open": boolean;
        /**
          * The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip inside of the viewport.
         */
        "placement": | 'top'
    | 'top-start'
    | 'top-end'
    | 'right'
    | 'right-start'
    | 'right-end'
    | 'bottom'
    | 'bottom-start'
    | 'bottom-end'
    | 'left'
    | 'left-start'
    | 'left-end';
        /**
          * Shows the tooltip.
         */
        "show": () => Promise<void>;
        /**
          * The distance in pixels from which to offset the tooltip along its target.
         */
        "skidding": number;
        /**
          * Controls how the tooltip is activated. Possible options include `click`, `hover`, `focus`, and `manual`. Multiple options can be passed by separating them with a space. When manual is used, the tooltip must be activated programmatically.
         */
        "trigger": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlUpload {
        /**
          * The comma seperated accept filter applied to the html file input (fx. image/*,.pdf).
         */
        "accept": string;
        /**
          * Additional description displayed under the link.
         */
        "description": string;
        /**
          * Whether single of multi selection is allowed.
         */
        "multiple": boolean;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlVideo {
        /**
          * a method for pausing the video
         */
        "pause": () => Promise<void>;
        /**
          * a method for playing the video
         */
        "play": () => Promise<void>;
        /**
          * an image for preview before showing the video
         */
        "previewImage": string;
        /**
          * url for the video to show
         */
        "src": string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlWell {
        /**
          * Whether padding should be added to the well or not.
         */
        "padding": boolean;
    }
}
export interface SlAlertCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlAlertElement;
}
export interface SlAnimationCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlAnimationElement;
}
export interface SlAuthCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlAuthElement;
}
export interface SlAuthProfileCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlAuthProfileElement;
}
export interface SlButtonCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlButtonElement;
}
export interface SlCalendarCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlCalendarElement;
}
export interface SlCalendarDateCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlCalendarDateElement;
}
export interface SlCheckboxCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlCheckboxElement;
}
export interface SlDatePickerCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlDatePickerElement;
}
export interface SlDetailsCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlDetailsElement;
}
export interface SlDialogCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlDialogElement;
}
export interface SlDrawerCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlDrawerElement;
}
export interface SlDropdownCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlDropdownElement;
}
export interface SlFormCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlFormElement;
}
export interface SlIconCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlIconElement;
}
export interface SlIncludeCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlIncludeElement;
}
export interface SlInputCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlInputElement;
}
export interface SlListCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlListElement;
}
export interface SlMapCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlMapElement;
}
export interface SlMenuCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlMenuElement;
}
export interface SlOtpInputCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlOtpInputElement;
}
export interface SlOtpViewCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlOtpViewElement;
}
export interface SlPaginationCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlPaginationElement;
}
export interface SlPopoverCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlPopoverElement;
}
export interface SlRadioCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlRadioElement;
}
export interface SlRadioGroupCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlRadioGroupElement;
}
export interface SlRangeCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlRangeElement;
}
export interface SlRatingCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlRatingElement;
}
export interface SlResizeObserverCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlResizeObserverElement;
}
export interface SlRrulePickerCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlRrulePickerElement;
}
export interface SlSchedulerCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlSchedulerElement;
}
export interface SlSelectCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlSelectElement;
}
export interface SlSwitchCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlSwitchElement;
}
export interface SlTabCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlTabElement;
}
export interface SlTabGroupCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlTabGroupElement;
}
export interface SlTagCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlTagElement;
}
export interface SlTextareaCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlTextareaElement;
}
export interface SlTimePeriodCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlTimePeriodElement;
}
export interface SlTimelineCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlTimelineElement;
}
export interface SlTooltipCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlTooltipElement;
}
export interface SlUploadCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLSlUploadElement;
}
declare global {
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlAddressElement extends Components.SlAddress, HTMLStencilElement {
    }
    var HTMLSlAddressElement: {
        prototype: HTMLSlAddressElement;
        new (): HTMLSlAddressElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlAlertElement extends Components.SlAlert, HTMLStencilElement {
    }
    var HTMLSlAlertElement: {
        prototype: HTMLSlAlertElement;
        new (): HTMLSlAlertElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlAnimationElement extends Components.SlAnimation, HTMLStencilElement {
    }
    var HTMLSlAnimationElement: {
        prototype: HTMLSlAnimationElement;
        new (): HTMLSlAnimationElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlAuthElement extends Components.SlAuth, HTMLStencilElement {
    }
    var HTMLSlAuthElement: {
        prototype: HTMLSlAuthElement;
        new (): HTMLSlAuthElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlAuthProfileElement extends Components.SlAuthProfile, HTMLStencilElement {
    }
    var HTMLSlAuthProfileElement: {
        prototype: HTMLSlAuthProfileElement;
        new (): HTMLSlAuthProfileElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlAvatarElement extends Components.SlAvatar, HTMLStencilElement {
    }
    var HTMLSlAvatarElement: {
        prototype: HTMLSlAvatarElement;
        new (): HTMLSlAvatarElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlBadgeElement extends Components.SlBadge, HTMLStencilElement {
    }
    var HTMLSlBadgeElement: {
        prototype: HTMLSlBadgeElement;
        new (): HTMLSlBadgeElement;
    };
    /**
     * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.
     * @documentation https://shoelace.style/components/breadcrumb
     * @status stable
     * @since $.0
     * @dependency sl-icon
     * @csspart base - The component's base wrapper.
     */
    interface HTMLSlBreadcrumbElement extends Components.SlBreadcrumb, HTMLStencilElement {
    }
    var HTMLSlBreadcrumbElement: {
        prototype: HTMLSlBreadcrumbElement;
        new (): HTMLSlBreadcrumbElement;
    };
    /**
     * @summary Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.
     * @status stable
     * @since $.0
     * @csspart base - The component's base wrapper.
     * @csspart label - The breadcrumb item's label.
     * @csspart prefix - The container that wraps the prefix.
     * @csspart suffix - The container that wraps the suffix.
     * @csspart separator - The container that wraps the separator.
     */
    interface HTMLSlBreadcrumbItemElement extends Components.SlBreadcrumbItem, HTMLStencilElement {
    }
    var HTMLSlBreadcrumbItemElement: {
        prototype: HTMLSlBreadcrumbItemElement;
        new (): HTMLSlBreadcrumbItemElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlBubbleElement extends Components.SlBubble, HTMLStencilElement {
    }
    var HTMLSlBubbleElement: {
        prototype: HTMLSlBubbleElement;
        new (): HTMLSlBubbleElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlButtonElement extends Components.SlButton, HTMLStencilElement {
    }
    var HTMLSlButtonElement: {
        prototype: HTMLSlButtonElement;
        new (): HTMLSlButtonElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlButtonGroupElement extends Components.SlButtonGroup, HTMLStencilElement {
    }
    var HTMLSlButtonGroupElement: {
        prototype: HTMLSlButtonGroupElement;
        new (): HTMLSlButtonGroupElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlCalendarElement extends Components.SlCalendar, HTMLStencilElement {
    }
    var HTMLSlCalendarElement: {
        prototype: HTMLSlCalendarElement;
        new (): HTMLSlCalendarElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlCalendarDateElement extends Components.SlCalendarDate, HTMLStencilElement {
    }
    var HTMLSlCalendarDateElement: {
        prototype: HTMLSlCalendarDateElement;
        new (): HTMLSlCalendarDateElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlCardElement extends Components.SlCard, HTMLStencilElement {
    }
    var HTMLSlCardElement: {
        prototype: HTMLSlCardElement;
        new (): HTMLSlCardElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlCellElement extends Components.SlCell, HTMLStencilElement {
    }
    var HTMLSlCellElement: {
        prototype: HTMLSlCellElement;
        new (): HTMLSlCellElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlChartElement extends Components.SlChart, HTMLStencilElement {
    }
    var HTMLSlChartElement: {
        prototype: HTMLSlChartElement;
        new (): HTMLSlChartElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlCheckboxElement extends Components.SlCheckbox, HTMLStencilElement {
    }
    var HTMLSlCheckboxElement: {
        prototype: HTMLSlCheckboxElement;
        new (): HTMLSlCheckboxElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlColumnElement extends Components.SlColumn, HTMLStencilElement {
    }
    var HTMLSlColumnElement: {
        prototype: HTMLSlColumnElement;
        new (): HTMLSlColumnElement;
    };
    interface HTMLSlDateCellElement extends Components.SlDateCell, HTMLStencilElement {
    }
    var HTMLSlDateCellElement: {
        prototype: HTMLSlDateCellElement;
        new (): HTMLSlDateCellElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlDatePickerElement extends Components.SlDatePicker, HTMLStencilElement {
    }
    var HTMLSlDatePickerElement: {
        prototype: HTMLSlDatePickerElement;
        new (): HTMLSlDatePickerElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlDetailsElement extends Components.SlDetails, HTMLStencilElement {
    }
    var HTMLSlDetailsElement: {
        prototype: HTMLSlDetailsElement;
        new (): HTMLSlDetailsElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlDialogElement extends Components.SlDialog, HTMLStencilElement {
    }
    var HTMLSlDialogElement: {
        prototype: HTMLSlDialogElement;
        new (): HTMLSlDialogElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlDividerElement extends Components.SlDivider, HTMLStencilElement {
    }
    var HTMLSlDividerElement: {
        prototype: HTMLSlDividerElement;
        new (): HTMLSlDividerElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlDrawerElement extends Components.SlDrawer, HTMLStencilElement {
    }
    var HTMLSlDrawerElement: {
        prototype: HTMLSlDrawerElement;
        new (): HTMLSlDrawerElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlDropdownElement extends Components.SlDropdown, HTMLStencilElement {
    }
    var HTMLSlDropdownElement: {
        prototype: HTMLSlDropdownElement;
        new (): HTMLSlDropdownElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlEmptyElement extends Components.SlEmpty, HTMLStencilElement {
    }
    var HTMLSlEmptyElement: {
        prototype: HTMLSlEmptyElement;
        new (): HTMLSlEmptyElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlFieldrowElement extends Components.SlFieldrow, HTMLStencilElement {
    }
    var HTMLSlFieldrowElement: {
        prototype: HTMLSlFieldrowElement;
        new (): HTMLSlFieldrowElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlFieldsetElement extends Components.SlFieldset, HTMLStencilElement {
    }
    var HTMLSlFieldsetElement: {
        prototype: HTMLSlFieldsetElement;
        new (): HTMLSlFieldsetElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlFlexElement extends Components.SlFlex, HTMLStencilElement {
    }
    var HTMLSlFlexElement: {
        prototype: HTMLSlFlexElement;
        new (): HTMLSlFlexElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlFormElement extends Components.SlForm, HTMLStencilElement {
    }
    var HTMLSlFormElement: {
        prototype: HTMLSlFormElement;
        new (): HTMLSlFormElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlFormatBytesElement extends Components.SlFormatBytes, HTMLStencilElement {
    }
    var HTMLSlFormatBytesElement: {
        prototype: HTMLSlFormatBytesElement;
        new (): HTMLSlFormatBytesElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlFormatDateElement extends Components.SlFormatDate, HTMLStencilElement {
    }
    var HTMLSlFormatDateElement: {
        prototype: HTMLSlFormatDateElement;
        new (): HTMLSlFormatDateElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlFormatNumberElement extends Components.SlFormatNumber, HTMLStencilElement {
    }
    var HTMLSlFormatNumberElement: {
        prototype: HTMLSlFormatNumberElement;
        new (): HTMLSlFormatNumberElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlFormatRruleElement extends Components.SlFormatRrule, HTMLStencilElement {
    }
    var HTMLSlFormatRruleElement: {
        prototype: HTMLSlFormatRruleElement;
        new (): HTMLSlFormatRruleElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlGridElement extends Components.SlGrid, HTMLStencilElement {
    }
    var HTMLSlGridElement: {
        prototype: HTMLSlGridElement;
        new (): HTMLSlGridElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlIconElement extends Components.SlIcon, HTMLStencilElement {
    }
    var HTMLSlIconElement: {
        prototype: HTMLSlIconElement;
        new (): HTMLSlIconElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlIconButtonElement extends Components.SlIconButton, HTMLStencilElement {
    }
    var HTMLSlIconButtonElement: {
        prototype: HTMLSlIconButtonElement;
        new (): HTMLSlIconButtonElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlIconLibraryElement extends Components.SlIconLibrary, HTMLStencilElement {
    }
    var HTMLSlIconLibraryElement: {
        prototype: HTMLSlIconLibraryElement;
        new (): HTMLSlIconLibraryElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlIncludeElement extends Components.SlInclude, HTMLStencilElement {
    }
    var HTMLSlIncludeElement: {
        prototype: HTMLSlIncludeElement;
        new (): HTMLSlIncludeElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlInputElement extends Components.SlInput, HTMLStencilElement {
    }
    var HTMLSlInputElement: {
        prototype: HTMLSlInputElement;
        new (): HTMLSlInputElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlLabelElement extends Components.SlLabel, HTMLStencilElement {
    }
    var HTMLSlLabelElement: {
        prototype: HTMLSlLabelElement;
        new (): HTMLSlLabelElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlLayoutElement extends Components.SlLayout, HTMLStencilElement {
    }
    var HTMLSlLayoutElement: {
        prototype: HTMLSlLayoutElement;
        new (): HTMLSlLayoutElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlListElement extends Components.SlList, HTMLStencilElement {
    }
    var HTMLSlListElement: {
        prototype: HTMLSlListElement;
        new (): HTMLSlListElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlListDividerElement extends Components.SlListDivider, HTMLStencilElement {
    }
    var HTMLSlListDividerElement: {
        prototype: HTMLSlListDividerElement;
        new (): HTMLSlListDividerElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlListItemElement extends Components.SlListItem, HTMLStencilElement {
    }
    var HTMLSlListItemElement: {
        prototype: HTMLSlListItemElement;
        new (): HTMLSlListItemElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlMapElement extends Components.SlMap, HTMLStencilElement {
    }
    var HTMLSlMapElement: {
        prototype: HTMLSlMapElement;
        new (): HTMLSlMapElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlMenuElement extends Components.SlMenu, HTMLStencilElement {
    }
    var HTMLSlMenuElement: {
        prototype: HTMLSlMenuElement;
        new (): HTMLSlMenuElement;
    };
    /**
     * @since 1.0
     * @status deprecated
     */
    interface HTMLSlMenuDividerElement extends Components.SlMenuDivider, HTMLStencilElement {
    }
    var HTMLSlMenuDividerElement: {
        prototype: HTMLSlMenuDividerElement;
        new (): HTMLSlMenuDividerElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlMenuItemElement extends Components.SlMenuItem, HTMLStencilElement {
    }
    var HTMLSlMenuItemElement: {
        prototype: HTMLSlMenuItemElement;
        new (): HTMLSlMenuItemElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlMenuLabelElement extends Components.SlMenuLabel, HTMLStencilElement {
    }
    var HTMLSlMenuLabelElement: {
        prototype: HTMLSlMenuLabelElement;
        new (): HTMLSlMenuLabelElement;
    };
    interface HTMLSlOtpInputElement extends Components.SlOtpInput, HTMLStencilElement {
    }
    var HTMLSlOtpInputElement: {
        prototype: HTMLSlOtpInputElement;
        new (): HTMLSlOtpInputElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlOtpViewElement extends Components.SlOtpView, HTMLStencilElement {
    }
    var HTMLSlOtpViewElement: {
        prototype: HTMLSlOtpViewElement;
        new (): HTMLSlOtpViewElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlPageHeaderElement extends Components.SlPageHeader, HTMLStencilElement {
    }
    var HTMLSlPageHeaderElement: {
        prototype: HTMLSlPageHeaderElement;
        new (): HTMLSlPageHeaderElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlPaginationElement extends Components.SlPagination, HTMLStencilElement {
    }
    var HTMLSlPaginationElement: {
        prototype: HTMLSlPaginationElement;
        new (): HTMLSlPaginationElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlPopoverElement extends Components.SlPopover, HTMLStencilElement {
    }
    var HTMLSlPopoverElement: {
        prototype: HTMLSlPopoverElement;
        new (): HTMLSlPopoverElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlProgressBarElement extends Components.SlProgressBar, HTMLStencilElement {
    }
    var HTMLSlProgressBarElement: {
        prototype: HTMLSlProgressBarElement;
        new (): HTMLSlProgressBarElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlProgressRingElement extends Components.SlProgressRing, HTMLStencilElement {
    }
    var HTMLSlProgressRingElement: {
        prototype: HTMLSlProgressRingElement;
        new (): HTMLSlProgressRingElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlRadioElement extends Components.SlRadio, HTMLStencilElement {
    }
    var HTMLSlRadioElement: {
        prototype: HTMLSlRadioElement;
        new (): HTMLSlRadioElement;
    };
    /**
     * @since 1.8
     * @status experimental
     */
    interface HTMLSlRadioGroupElement extends Components.SlRadioGroup, HTMLStencilElement {
    }
    var HTMLSlRadioGroupElement: {
        prototype: HTMLSlRadioGroupElement;
        new (): HTMLSlRadioGroupElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlRangeElement extends Components.SlRange, HTMLStencilElement {
    }
    var HTMLSlRangeElement: {
        prototype: HTMLSlRangeElement;
        new (): HTMLSlRangeElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlRatingElement extends Components.SlRating, HTMLStencilElement {
    }
    var HTMLSlRatingElement: {
        prototype: HTMLSlRatingElement;
        new (): HTMLSlRatingElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlRelativeTimeElement extends Components.SlRelativeTime, HTMLStencilElement {
    }
    var HTMLSlRelativeTimeElement: {
        prototype: HTMLSlRelativeTimeElement;
        new (): HTMLSlRelativeTimeElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlResizeObserverElement extends Components.SlResizeObserver, HTMLStencilElement {
    }
    var HTMLSlResizeObserverElement: {
        prototype: HTMLSlResizeObserverElement;
        new (): HTMLSlResizeObserverElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlResponsiveEmbedElement extends Components.SlResponsiveEmbed, HTMLStencilElement {
    }
    var HTMLSlResponsiveEmbedElement: {
        prototype: HTMLSlResponsiveEmbedElement;
        new (): HTMLSlResponsiveEmbedElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlRowElement extends Components.SlRow, HTMLStencilElement {
    }
    var HTMLSlRowElement: {
        prototype: HTMLSlRowElement;
        new (): HTMLSlRowElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlRrulePickerElement extends Components.SlRrulePicker, HTMLStencilElement {
    }
    var HTMLSlRrulePickerElement: {
        prototype: HTMLSlRrulePickerElement;
        new (): HTMLSlRrulePickerElement;
    };
    interface HTMLSlSchedulerElement extends Components.SlScheduler, HTMLStencilElement {
    }
    var HTMLSlSchedulerElement: {
        prototype: HTMLSlSchedulerElement;
        new (): HTMLSlSchedulerElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlSectionElement extends Components.SlSection, HTMLStencilElement {
    }
    var HTMLSlSectionElement: {
        prototype: HTMLSlSectionElement;
        new (): HTMLSlSectionElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlSelectElement extends Components.SlSelect, HTMLStencilElement {
    }
    var HTMLSlSelectElement: {
        prototype: HTMLSlSelectElement;
        new (): HTMLSlSelectElement;
    };
    interface HTMLSlSidebarElement extends Components.SlSidebar, HTMLStencilElement {
    }
    var HTMLSlSidebarElement: {
        prototype: HTMLSlSidebarElement;
        new (): HTMLSlSidebarElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlSkeletonElement extends Components.SlSkeleton, HTMLStencilElement {
    }
    var HTMLSlSkeletonElement: {
        prototype: HTMLSlSkeletonElement;
        new (): HTMLSlSkeletonElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlSpinnerElement extends Components.SlSpinner, HTMLStencilElement {
    }
    var HTMLSlSpinnerElement: {
        prototype: HTMLSlSpinnerElement;
        new (): HTMLSlSpinnerElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlSplitLayoutElement extends Components.SlSplitLayout, HTMLStencilElement {
    }
    var HTMLSlSplitLayoutElement: {
        prototype: HTMLSlSplitLayoutElement;
        new (): HTMLSlSplitLayoutElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlStatisticElement extends Components.SlStatistic, HTMLStencilElement {
    }
    var HTMLSlStatisticElement: {
        prototype: HTMLSlStatisticElement;
        new (): HTMLSlStatisticElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlStepElement extends Components.SlStep, HTMLStencilElement {
    }
    var HTMLSlStepElement: {
        prototype: HTMLSlStepElement;
        new (): HTMLSlStepElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlStepItemElement extends Components.SlStepItem, HTMLStencilElement {
    }
    var HTMLSlStepItemElement: {
        prototype: HTMLSlStepItemElement;
        new (): HTMLSlStepItemElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlSwitchElement extends Components.SlSwitch, HTMLStencilElement {
    }
    var HTMLSlSwitchElement: {
        prototype: HTMLSlSwitchElement;
        new (): HTMLSlSwitchElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlTabElement extends Components.SlTab, HTMLStencilElement {
    }
    var HTMLSlTabElement: {
        prototype: HTMLSlTabElement;
        new (): HTMLSlTabElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlTabGroupElement extends Components.SlTabGroup, HTMLStencilElement {
    }
    var HTMLSlTabGroupElement: {
        prototype: HTMLSlTabGroupElement;
        new (): HTMLSlTabGroupElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlTabPanelElement extends Components.SlTabPanel, HTMLStencilElement {
    }
    var HTMLSlTabPanelElement: {
        prototype: HTMLSlTabPanelElement;
        new (): HTMLSlTabPanelElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlTableElement extends Components.SlTable, HTMLStencilElement {
    }
    var HTMLSlTableElement: {
        prototype: HTMLSlTableElement;
        new (): HTMLSlTableElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlTagElement extends Components.SlTag, HTMLStencilElement {
    }
    var HTMLSlTagElement: {
        prototype: HTMLSlTagElement;
        new (): HTMLSlTagElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlTextareaElement extends Components.SlTextarea, HTMLStencilElement {
    }
    var HTMLSlTextareaElement: {
        prototype: HTMLSlTextareaElement;
        new (): HTMLSlTextareaElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlThemeElement extends Components.SlTheme, HTMLStencilElement {
    }
    var HTMLSlThemeElement: {
        prototype: HTMLSlThemeElement;
        new (): HTMLSlThemeElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlTimePeriodElement extends Components.SlTimePeriod, HTMLStencilElement {
    }
    var HTMLSlTimePeriodElement: {
        prototype: HTMLSlTimePeriodElement;
        new (): HTMLSlTimePeriodElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlTimelineElement extends Components.SlTimeline, HTMLStencilElement {
    }
    var HTMLSlTimelineElement: {
        prototype: HTMLSlTimelineElement;
        new (): HTMLSlTimelineElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlTooltipElement extends Components.SlTooltip, HTMLStencilElement {
    }
    var HTMLSlTooltipElement: {
        prototype: HTMLSlTooltipElement;
        new (): HTMLSlTooltipElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlUploadElement extends Components.SlUpload, HTMLStencilElement {
    }
    var HTMLSlUploadElement: {
        prototype: HTMLSlUploadElement;
        new (): HTMLSlUploadElement;
    };
    /**
     * @since 1.0
     * @status experimental
     */
    interface HTMLSlVideoElement extends Components.SlVideo, HTMLStencilElement {
    }
    var HTMLSlVideoElement: {
        prototype: HTMLSlVideoElement;
        new (): HTMLSlVideoElement;
    };
    /**
     * @since 1.0
     * @status stable
     */
    interface HTMLSlWellElement extends Components.SlWell, HTMLStencilElement {
    }
    var HTMLSlWellElement: {
        prototype: HTMLSlWellElement;
        new (): HTMLSlWellElement;
    };
    interface HTMLElementTagNameMap {
        "sl-address": HTMLSlAddressElement;
        "sl-alert": HTMLSlAlertElement;
        "sl-animation": HTMLSlAnimationElement;
        "sl-auth": HTMLSlAuthElement;
        "sl-auth-profile": HTMLSlAuthProfileElement;
        "sl-avatar": HTMLSlAvatarElement;
        "sl-badge": HTMLSlBadgeElement;
        "sl-breadcrumb": HTMLSlBreadcrumbElement;
        "sl-breadcrumb-item": HTMLSlBreadcrumbItemElement;
        "sl-bubble": HTMLSlBubbleElement;
        "sl-button": HTMLSlButtonElement;
        "sl-button-group": HTMLSlButtonGroupElement;
        "sl-calendar": HTMLSlCalendarElement;
        "sl-calendar-date": HTMLSlCalendarDateElement;
        "sl-card": HTMLSlCardElement;
        "sl-cell": HTMLSlCellElement;
        "sl-chart": HTMLSlChartElement;
        "sl-checkbox": HTMLSlCheckboxElement;
        "sl-column": HTMLSlColumnElement;
        "sl-date-cell": HTMLSlDateCellElement;
        "sl-date-picker": HTMLSlDatePickerElement;
        "sl-details": HTMLSlDetailsElement;
        "sl-dialog": HTMLSlDialogElement;
        "sl-divider": HTMLSlDividerElement;
        "sl-drawer": HTMLSlDrawerElement;
        "sl-dropdown": HTMLSlDropdownElement;
        "sl-empty": HTMLSlEmptyElement;
        "sl-fieldrow": HTMLSlFieldrowElement;
        "sl-fieldset": HTMLSlFieldsetElement;
        "sl-flex": HTMLSlFlexElement;
        "sl-form": HTMLSlFormElement;
        "sl-format-bytes": HTMLSlFormatBytesElement;
        "sl-format-date": HTMLSlFormatDateElement;
        "sl-format-number": HTMLSlFormatNumberElement;
        "sl-format-rrule": HTMLSlFormatRruleElement;
        "sl-grid": HTMLSlGridElement;
        "sl-icon": HTMLSlIconElement;
        "sl-icon-button": HTMLSlIconButtonElement;
        "sl-icon-library": HTMLSlIconLibraryElement;
        "sl-include": HTMLSlIncludeElement;
        "sl-input": HTMLSlInputElement;
        "sl-label": HTMLSlLabelElement;
        "sl-layout": HTMLSlLayoutElement;
        "sl-list": HTMLSlListElement;
        "sl-list-divider": HTMLSlListDividerElement;
        "sl-list-item": HTMLSlListItemElement;
        "sl-map": HTMLSlMapElement;
        "sl-menu": HTMLSlMenuElement;
        "sl-menu-divider": HTMLSlMenuDividerElement;
        "sl-menu-item": HTMLSlMenuItemElement;
        "sl-menu-label": HTMLSlMenuLabelElement;
        "sl-otp-input": HTMLSlOtpInputElement;
        "sl-otp-view": HTMLSlOtpViewElement;
        "sl-page-header": HTMLSlPageHeaderElement;
        "sl-pagination": HTMLSlPaginationElement;
        "sl-popover": HTMLSlPopoverElement;
        "sl-progress-bar": HTMLSlProgressBarElement;
        "sl-progress-ring": HTMLSlProgressRingElement;
        "sl-radio": HTMLSlRadioElement;
        "sl-radio-group": HTMLSlRadioGroupElement;
        "sl-range": HTMLSlRangeElement;
        "sl-rating": HTMLSlRatingElement;
        "sl-relative-time": HTMLSlRelativeTimeElement;
        "sl-resize-observer": HTMLSlResizeObserverElement;
        "sl-responsive-embed": HTMLSlResponsiveEmbedElement;
        "sl-row": HTMLSlRowElement;
        "sl-rrule-picker": HTMLSlRrulePickerElement;
        "sl-scheduler": HTMLSlSchedulerElement;
        "sl-section": HTMLSlSectionElement;
        "sl-select": HTMLSlSelectElement;
        "sl-sidebar": HTMLSlSidebarElement;
        "sl-skeleton": HTMLSlSkeletonElement;
        "sl-spinner": HTMLSlSpinnerElement;
        "sl-split-layout": HTMLSlSplitLayoutElement;
        "sl-statistic": HTMLSlStatisticElement;
        "sl-step": HTMLSlStepElement;
        "sl-step-item": HTMLSlStepItemElement;
        "sl-switch": HTMLSlSwitchElement;
        "sl-tab": HTMLSlTabElement;
        "sl-tab-group": HTMLSlTabGroupElement;
        "sl-tab-panel": HTMLSlTabPanelElement;
        "sl-table": HTMLSlTableElement;
        "sl-tag": HTMLSlTagElement;
        "sl-textarea": HTMLSlTextareaElement;
        "sl-theme": HTMLSlThemeElement;
        "sl-time-period": HTMLSlTimePeriodElement;
        "sl-timeline": HTMLSlTimelineElement;
        "sl-tooltip": HTMLSlTooltipElement;
        "sl-upload": HTMLSlUploadElement;
        "sl-video": HTMLSlVideoElement;
        "sl-well": HTMLSlWellElement;
    }
}
declare namespace LocalJSX {
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAddress {
        /**
          * The list of countries to show in the list, defined as alpha-2 (fx. DA, EN, NO). If not specified, all countries are shown.
         */
        "countries"?: string[];
        /**
          * Set to true to disable the input.
         */
        "disabled"?: boolean;
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText"?: string;
        /**
          * The input's help text. Alternatively, you can use the help-text slot.
         */
        "helpText"?: string;
        /**
          * The input's label. Alternatively, you can use the label slot.
         */
        "label"?: string;
        /**
          * The input's value attribute.
         */
        "value"?: Address;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAlert {
        /**
          * Set to true to make the alert closable.
         */
        "closable"?: boolean;
        /**
          * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the alert before it closes (e.g. moves the mouse over it), the timer will restart.
         */
        "duration"?: number;
        /**
          * Emitted after the alert closes and all transitions are complete.
         */
        "onSlAfterHide"?: (event: SlAlertCustomEvent<any>) => void;
        /**
          * Emitted after the alert opens and all transitions are complete.
         */
        "onSlAfterShow"?: (event: SlAlertCustomEvent<any>) => void;
        /**
          * Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed.
         */
        "onSlHide"?: (event: SlAlertCustomEvent<any>) => void;
        /**
          * Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened.
         */
        "onSlShow"?: (event: SlAlertCustomEvent<any>) => void;
        /**
          * Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods.
         */
        "open"?: boolean;
        /**
          * The type of alert.
         */
        "type"?: 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'neutral';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAnimation {
        /**
          * The number of milliseconds to delay the start of the animation.
         */
        "delay"?: number;
        /**
          * Determines the direction of playback as well as the behavior when reaching the end of an iteration.
         */
        "direction"?: PlaybackDirection;
        /**
          * The number of milliseconds each iteration of the animation takes to complete.
         */
        "duration"?: number;
        /**
          * The easing function to use for the animation. This can be a Stallion easing function or a custom easing function such as `cubic-bezier(0, 1, .76, 1.14)`.
         */
        "easing"?: string;
        /**
          * The number of milliseconds to delay after the active period of an animation sequence.
         */
        "endDelay"?: number;
        /**
          * Sets how the animation applies styles to its target before and after its execution.
         */
        "fill"?: FillMode;
        /**
          * The offset at which to start the animation, usually between 0 (start) and 1 (end).
         */
        "iterationStart"?: number;
        /**
          * The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.
         */
        "iterations"?: number;
        /**
          * The keyframes to use for the animation. If this is set, `name` will be ignored.
         */
        "keyframes"?: Keyframe[];
        /**
          * The name of the built-in animation to use. For custom animations, use the `keyframes` prop.
         */
        "name"?: string;
        /**
          * Emitted when the animation is canceled.
         */
        "onSlCancel"?: (event: SlAnimationCustomEvent<any>) => void;
        /**
          * Emitted when the animation finishes.
         */
        "onSlFinish"?: (event: SlAnimationCustomEvent<any>) => void;
        /**
          * Emitted when the animation starts or restarts.
         */
        "onSlStart"?: (event: SlAnimationCustomEvent<any>) => void;
        /**
          * Pauses the animation. The animation will resume when this prop is removed.
         */
        "pause"?: boolean;
        /**
          * Sets the animation's playback rate. The default is `1`, which plays the animation at a normal speed. Setting this to `2`, for example, will double the animation's speed. A negative value can be used to reverse the animation. This value can be changed without causing the animation to restart.
         */
        "playbackRate"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAuth {
        /**
          * The url of the auth api
         */
        "api"?: string;
        /**
          * The email to preset in the input
         */
        "email"?: string;
        /**
          * Emitted when user is sucessfully authenticated.
         */
        "onAuthenticate"?: (event: SlAuthCustomEvent<{ email: string; token: string; userId: string }>) => void;
        /**
          * Whether changing email should be prevented
         */
        "preventEmailChange"?: boolean;
        /**
          * The optional description for the sign in view.
         */
        "signInDescription"?: string;
        /**
          * The header for the sign in view.
         */
        "signInHeader"?: any;
        /**
          * The url of the terms
         */
        "terms"?: string;
        /**
          * Whether webauthn is enabled if supported by client.
         */
        "webauthn"?: boolean;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAuthProfile {
        /**
          * The url of the auth api
         */
        "api"?: string;
        /**
          * Emitted when the primary email changes.
         */
        "onPrimaryEmailChange"?: (event: SlAuthProfileCustomEvent<any>) => void;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlAvatar {
        /**
          * Alternative text for the image.
         */
        "alt"?: string;
        /**
          * The image source to use for the avatar.
         */
        "image"?: string;
        /**
          * Initials to use as a fallback when no image is available (1-2 characters max recommended).
         */
        "initials"?: string;
        /**
          * The shape of the avatar.
         */
        "shape"?: 'circle' | 'square' | 'rounded';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlBadge {
        /**
          * Set to true to draw a pill-style badge with rounded edges.
         */
        "pill"?: boolean;
        /**
          * Set to true to make the badge pulsate to draw attention.
         */
        "pulse"?: boolean;
        /**
          * The badge's type.
         */
        "type"?: 'primary' | 'success' | 'info' | 'warning' | 'danger';
    }
    /**
     * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.
     * @documentation https://shoelace.style/components/breadcrumb
     * @status stable
     * @since $.0
     * @dependency sl-icon
     * @csspart base - The component's base wrapper.
     */
    interface SlBreadcrumb {
        /**
          * The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by screen readers and other assistive devices to provide more context for users.
         */
        "label"?: string;
    }
    /**
     * @summary Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.
     * @status stable
     * @since $.0
     * @csspart base - The component's base wrapper.
     * @csspart label - The breadcrumb item's label.
     * @csspart prefix - The container that wraps the prefix.
     * @csspart suffix - The container that wraps the suffix.
     * @csspart separator - The container that wraps the separator.
     */
    interface SlBreadcrumbItem {
        /**
          * Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered internally. When unset, a button will be rendered instead.
         */
        "href"?: string;
        /**
          * Whether this is displayed as leaf or not.
         */
        "leaf"?: boolean;
        /**
          * The `rel` attribute to use on the link. Only used when `href` is set.
         */
        "rel"?: string;
        /**
          * Tells the browser where to open the link. Only used when `href` is set.
         */
        "target"?: '_blank' | '_parent' | '_self' | '_top';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlBubble {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlButton {
        /**
          * Set to true to draw the button with a caret for use with dropdowns, popovers, etc.
         */
        "caret"?: boolean;
        /**
          * When true, the button will be rendered in a 'pushed' state.
         */
        "checked"?: boolean;
        /**
          * Set to true to draw a circle button.
         */
        "circle"?: boolean;
        /**
          * Set to true to disable the button.
         */
        "disabled"?: boolean;
        /**
          * Tells the browser to download the linked file as this filename. Only used when `href` is set.
         */
        "download"?: string;
        /**
          * When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.
         */
        "href"?: string;
        /**
          * Set to true to draw the button in a loading state.
         */
        "loading"?: boolean;
        /**
          * An optional name for the button. Ignored when `href` is set.
         */
        "name"?: string;
        /**
          * Emitted when the button loses focus.
         */
        "onSlBlur"?: (event: SlButtonCustomEvent<any>) => void;
        /**
          * Emitted when the button gains focus.
         */
        "onSlFocus"?: (event: SlButtonCustomEvent<any>) => void;
        /**
          * Set to true to draw a pill-style button with rounded edges.
         */
        "pill"?: boolean;
        /**
          * The shape of the button.
         */
        "shape"?: 'block' | 'circle' | 'pill' | 'block-first' | 'block-middle' | 'block-last';
        /**
          * The button's size.
         */
        "size"?: 'small' | 'medium' | 'large';
        /**
          * Indicates if activating the button should submit the form. Ignored when `href` is set.
         */
        "submit"?: boolean;
        /**
          * Tells the browser where to open the link. Only used when `href` is set.
         */
        "target"?: '_blank' | '_parent' | '_self' | '_top';
        /**
          * The button's type.
         */
        "type"?: 'default' | 'primary' | 'danger' | 'text';
        /**
          * An optional value for the button. Ignored when `href` is set.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlButtonGroup {
        /**
          * A label to use for the button group's `aria-label` attribute.
         */
        "label"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlCalendar {
        /**
          * A date in the month to display.
         */
        "date"?: Date;
        /**
          * The date events to display in the calendar.
         */
        "events"?: DateEvent[];
        /**
          * Emitted when a drop event occurs on the calendar.
         */
        "onSlMove"?: (event: SlCalendarCustomEvent<any>) => void;
        /**
          * Emitted when an event is selected.
         */
        "onSlSelect"?: (event: SlCalendarCustomEvent<any>) => void;
        /**
          * Optional resource id
         */
        "resourceId"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlCalendarDate {
        /**
          * The date for the cell.
         */
        "date"?: Date;
        /**
          * Events to show in cell.
         */
        "events"?: DateEvent[];
        /**
          * Emited when the selected event changes.
         */
        "onValueChange"?: (event: SlCalendarDateCustomEvent<any>) => void;
        /**
          * The resource id for the cell.
         */
        "resourceId"?: string;
        /**
          * Whether to show date in cell.
         */
        "showBackgroundTitle"?: boolean;
        /**
          * Whether to show date in cell.
         */
        "showDate"?: boolean;
        /**
          * Whether to show week number in cell.
         */
        "showWeekNumber"?: boolean;
        /**
          * Whether to show date in cell.
         */
        "type"?: 'normal' | 'dimmed';
        /**
          * The id of the selected event.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlCard {
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlCell {
        /**
          * The allignment of the cell.
         */
        "align"?: 'left' | 'center' | 'right';
        /**
          * The property sets how overflowing inside an element is handled(normal/nowrap).
         */
        "nowrap"?: boolean;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlChart {
        /**
          * The chart data
         */
        "data"?: any;
        /**
          * The chart options
         */
        "options"?: any;
        /**
          * The chart type
         */
        "type"?: ChartType;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlCheckbox {
        /**
          * Set to true to draw the checkbox in a checked state.
         */
        "checked"?: boolean;
        /**
          * Set to true to disable the checkbox.
         */
        "disabled"?: boolean;
        /**
          * Set to true to draw the checkbox in an indeterminate state.
         */
        "indeterminate"?: boolean;
        /**
          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
         */
        "invalid"?: boolean;
        /**
          * The checkbox's name attribute.
         */
        "name"?: string;
        /**
          * Emitted when the control's checked state changes.
         */
        "onCheckedChange"?: (event: SlCheckboxCustomEvent<any>) => void;
        /**
          * Emitted when the control loses focus.
         */
        "onSlBlur"?: (event: SlCheckboxCustomEvent<any>) => void;
        /**
          * Emitted when the control gains focus.
         */
        "onSlFocus"?: (event: SlCheckboxCustomEvent<any>) => void;
        /**
          * Set to true to make the checkbox a required field.
         */
        "required"?: boolean;
        /**
          * The checkbox's size.
         */
        "size"?: 'small' | 'medium' | 'large';
        /**
          * The checkbox's value attribute.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlColumn {
        /**
          * The alignment of the column.
         */
        "align"?: 'left' | 'center' | 'right';
    }
    interface SlDateCell {
        /**
          * The color of the background. Defaults to none.
         */
        "backgroundColor"?: 'blue' | 'red' | 'yellow' | 'green' | 'purple' | 'gray' | 'indigo' | 'pink';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDatePicker {
        /**
          * Emitted when the control's value changes.
         */
        "onValueChange"?: (event: SlDatePickerCustomEvent<string>) => void;
        /**
          * value of this control specified as an ISO-formatted date, fx. 2021-12-31
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDetails {
        /**
          * Set to true to prevent the user from toggling the details.
         */
        "disabled"?: boolean;
        /**
          * Emitted after the details closes and all transitions are complete.
         */
        "onSlAfterHide"?: (event: SlDetailsCustomEvent<any>) => void;
        /**
          * Emitted after the details opens and all transitions are complete.
         */
        "onSlAfterShow"?: (event: SlDetailsCustomEvent<any>) => void;
        /**
          * Emitted when the details closes. Calling `event.preventDefault()` will prevent it from being closed.
         */
        "onSlHide"?: (event: SlDetailsCustomEvent<any>) => void;
        /**
          * Emitted when the details opens. Calling `event.preventDefault()` will prevent it from being opened.
         */
        "onSlShow"?: (event: SlDetailsCustomEvent<any>) => void;
        /**
          * Indicates whether or not the details is open. You can use this in lieu of the show/hide methods.
         */
        "open"?: boolean;
        /**
          * The summary to show in the details header. If you need to display HTML, use the `summary` slot instead.
         */
        "summary"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDialog {
        /**
          * Set style for header. If hidden it will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the dialog.
         */
        "headerStyle"?: 'dense' | 'normal' | 'discreet' | 'hidden';
        /**
          * The dialog's label as displayed in the header. You should always include a relevant label even when hiding the header, as it is required for proper accessibility.
         */
        "label"?: string;
        /**
          * Emitted after the dialog closes and all transitions are complete.
         */
        "onSlAfterHide"?: (event: SlDialogCustomEvent<any>) => void;
        /**
          * Emitted after the dialog opens and all transitions are complete.
         */
        "onSlAfterShow"?: (event: SlDialogCustomEvent<any>) => void;
        /**
          * Emitted when the dialog closes. Calling `event.preventDefault()` will prevent it from being closed.
         */
        "onSlHide"?: (event: SlDialogCustomEvent<any>) => void;
        /**
          * Emitted when the dialog opens and the panel gains focus. Calling `event.preventDefault()` will prevent focus and allow you to set it on a different element in the dialog, such as an input or button.
         */
        "onSlInitialFocus"?: (event: SlDialogCustomEvent<any>) => void;
        /**
          * Emitted when the overlay is clicked. Calling `event.preventDefault()` will prevent the dialog from closing.
         */
        "onSlOverlayDismiss"?: (event: SlDialogCustomEvent<any>) => void;
        /**
          * Emitted when the dialog opens. Calling `event.preventDefault()` will prevent it from being opened.
         */
        "onSlShow"?: (event: SlDialogCustomEvent<any>) => void;
        /**
          * Indicates whether or not the dialog is open. You can use this in lieu of the show/hide methods.
         */
        "open"?: boolean;
        /**
          * The vertical position of the dialog. The normal behavior is to center it, but in some cirumstances it may be better to align it to the top, especially if the dialog changes its size.
         */
        "position"?: 'center' | 'top';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDivider {
        /**
          * The direction of the divider
         */
        "direction"?: 'vertical' | 'horizontal';
        /**
          * Optional text to show in divider
         */
        "label"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDrawer {
        /**
          * By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of its parent element, set this prop and add `position: relative` to the parent.
         */
        "contained"?: boolean;
        /**
          * The drawer's label as displayed in the header. You should always include a relevant label even when using `no-header`, as it is required for proper accessibility.
         */
        "label"?: string;
        /**
          * Removes the header. This will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the drawer.
         */
        "noHeader"?: boolean;
        /**
          * Emitted after the drawer closes and all transitions are complete.
         */
        "onSlAfterHide"?: (event: SlDrawerCustomEvent<any>) => void;
        /**
          * Emitted after the drawer opens and all transitions are complete.
         */
        "onSlAfterShow"?: (event: SlDrawerCustomEvent<any>) => void;
        /**
          * Emitted when the drawer closes. Calling `event.preventDefault()` will prevent it from being closed.
         */
        "onSlHide"?: (event: SlDrawerCustomEvent<any>) => void;
        /**
          * Emitted when the drawer opens and the panel gains focus. Calling `event.preventDefault()` will prevent focus and allow you to set it on a different element in the drawer, such as an input or button.
         */
        "onSlInitialFocus"?: (event: SlDrawerCustomEvent<any>) => void;
        /**
          * Emitted when the overlay is clicked. Calling `event.preventDefault()` will prevent the drawer from closing.
         */
        "onSlOverlayDismiss"?: (event: SlDrawerCustomEvent<any>) => void;
        /**
          * Emitted when the drawer opens. Calling `event.preventDefault()` will prevent it from being opened.
         */
        "onSlShow"?: (event: SlDrawerCustomEvent<any>) => void;
        /**
          * Indicates whether or not the drawer is open. You can use this in lieu of the show/hide methods.
         */
        "open"?: boolean;
        /**
          * The direction from which the drawer will open.
         */
        "placement"?: 'top' | 'right' | 'bottom' | 'left';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlDropdown {
        /**
          * Determines whether the dropdown should hide when a menu item is selected.
         */
        "closeOnSelect"?: boolean;
        /**
          * The dropdown will close when the user interacts outside of this element (e.g. clicking).
         */
        "containingElement"?: HTMLElement;
        /**
          * The distance in pixels from which to offset the panel away from its trigger.
         */
        "distance"?: number;
        /**
          * Enable this option to prevent the panel from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
         */
        "hoist"?: boolean;
        /**
          * Emitted after the dropdown closes and all transitions are complete.
         */
        "onSlAfterHide"?: (event: SlDropdownCustomEvent<any>) => void;
        /**
          * Emitted after the dropdown opens and all transitions are complete.
         */
        "onSlAfterShow"?: (event: SlDropdownCustomEvent<any>) => void;
        /**
          * Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed.
         */
        "onSlHide"?: (event: SlDropdownCustomEvent<any>) => void;
        /**
          * Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened.
         */
        "onSlShow"?: (event: SlDropdownCustomEvent<any>) => void;
        /**
          * Indicates whether or not the dropdown is open. You can use this in lieu of the show/hide methods.
         */
        "open"?: boolean;
        /**
          * The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel inside of the viewport.
         */
        "placement"?: | 'top'
    | 'top-start'
    | 'top-end'
    | 'bottom'
    | 'bottom-start'
    | 'bottom-end'
    | 'right'
    | 'right-start'
    | 'right-end'
    | 'left'
    | 'left-start'
    | 'left-end';
        /**
          * The distance in pixels from which to offset the panel along its trigger.
         */
        "skidding"?: number;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlEmpty {
        /**
          * The empty headline
         */
        "header"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFieldrow {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFieldset {
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText"?: string;
        /**
          * The input's help text. Alternatively, you can use the help-text slot.
         */
        "helpText"?: string;
        /**
          * The input's label. Alternatively, you can use the label slot.
         */
        "label"?: string;
        /**
          * The input's size.
         */
        "size"?: 'small' | 'medium' | 'large';
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlFlex {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlForm {
        /**
          * Prevent the form from validating inputs before submitting.
         */
        "novalidate"?: boolean;
        /**
          * Emitted when the form is submitted. This event will not be emitted if any form control inside of it is in an invalid state, unless the form has the `novalidate` attribute. Note that there is never a need to prevent this event, since it doen't send a GET or POST request like native forms. To "prevent" submission, use a conditional around the XHR request you use to submit the form's data with.
         */
        "onSlSubmit"?: (event: SlFormCustomEvent<{ formData: FormData; formControls: HTMLElement[] }>) => void;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFormatBytes {
        /**
          * The locale to use when formatting the number.
         */
        "locale"?: string;
        /**
          * The unit to display.
         */
        "unit"?: 'bytes' | 'bits';
        /**
          * The number to format in bytes.
         */
        "value"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFormatDate {
        /**
          * The date/time to format. If not set, the current date and time will be used.
         */
        "date"?: Date | string;
        /**
          * The format for displaying the day.
         */
        "day"?: 'numeric' | '2-digit';
        /**
          * The format for displaying the era.
         */
        "era"?: 'narrow' | 'short' | 'long';
        /**
          * The format for displaying the hour.
         */
        "hour"?: 'numeric' | '2-digit';
        /**
          * When set, 24 hour time will always be used.
         */
        "hourFormat"?: 'auto' | '12' | '24';
        /**
          * The locale to use when formatting the date/time.
         */
        "locale"?: string;
        /**
          * The format for displaying the minute.
         */
        "minute"?: 'numeric' | '2-digit';
        /**
          * The format for displaying the month.
         */
        "month"?: 'numeric' | '2-digit' | 'narrow' | 'short' | 'long';
        /**
          * The format for displaying the second.
         */
        "second"?: 'numeric' | '2-digit';
        /**
          * The time zone to express the time in.
         */
        "timeZone"?: string;
        /**
          * The format for displaying the time.
         */
        "timeZoneName"?: 'short' | 'long';
        /**
          * The format for displaying the weekday.
         */
        "weekday"?: 'narrow' | 'short' | 'long';
        /**
          * The format for displaying the year.
         */
        "year"?: 'numeric' | '2-digit';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFormatNumber {
        /**
          * The currency to use when formatting. Must be an ISO 4217 currency code such as `USD` or `EUR`.
         */
        "currency"?: string;
        /**
          * How to display the currency.
         */
        "currencyDisplay"?: 'symbol' | 'narrowSymbol' | 'code' | 'name';
        /**
          * The locale to use when formatting the number.
         */
        "locale"?: string;
        /**
          * The maximum number of fraction digits to use. Possible values are 0 - 20.
         */
        "maximumFractionDigits"?: number;
        /**
          * The maximum number of significant digits to use,. Possible values are 1 - 21.
         */
        "maximumSignificantDigits"?: number;
        /**
          * The minimum number of fraction digits to use. Possible values are 0 - 20.
         */
        "minimumFractionDigits"?: number;
        /**
          * The minimum number of integer digits to use. Possible values are 1 - 21.
         */
        "minimumIntegerDigits"?: number;
        /**
          * The minimum number of significant digits to use. Possible values are 1 - 21.
         */
        "minimumSignificantDigits"?: number;
        /**
          * Turns off grouping separators.
         */
        "noGrouping"?: boolean;
        /**
          * The formatting style to use.
         */
        "type"?: 'currency' | 'decimal' | 'percent';
        /**
          * The number to format.
         */
        "value"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlFormatRrule {
        /**
          * The recurrence rule to format.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlGrid {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlIcon {
        /**
          * An alternative description to use for accessibility. If omitted, the name or src will be used to generate it.
         */
        "label"?: string;
        /**
          * The name of a registered custom icon library.
         */
        "library"?: string;
        /**
          * The name of the icon to draw.
         */
        "name"?: string;
        /**
          * Emitted when the icon failed to load.
         */
        "onSlError"?: (event: SlIconCustomEvent<{ status?: number }>) => void;
        /**
          * Emitted when the icon has loaded.
         */
        "onSlLoad"?: (event: SlIconCustomEvent<any>) => void;
        /**
          * An external URL of an SVG file.
         */
        "src"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlIconButton {
        /**
          * Set to true to disable the button.
         */
        "disabled"?: boolean;
        /**
          * A description that gets read by screen readers and other assistive devices. For optimal accessibility, you should always include a label that describes what the icon button does.
         */
        "label"?: string;
        /**
          * The name of a registered custom icon library.
         */
        "library"?: string;
        /**
          * The name of the icon to draw.
         */
        "name"?: string;
        /**
          * An external URL of an SVG file.
         */
        "src"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlIconLibrary {
        /**
          * A function that mutates the SVG element before it renders.
         */
        "mutator"?: IconLibraryMutator;
        /**
          * The name of the icon library.
         */
        "name"?: string;
        /**
          * A function that translates an icon name to a URL where the corresponding SVG file exists The URL can be local or a CORS-enabled endpoint.
         */
        "resolver"?: IconLibraryResolver;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlInclude {
        /**
          * Allows included scripts to be executed. You must ensure the content you're including is trusted, otherwise this option can lead to XSS vulnerabilities in your app!
         */
        "allowScripts"?: boolean;
        /**
          * The fetch mode to use.
         */
        "mode"?: 'cors' | 'no-cors' | 'same-origin';
        /**
          * Emitted when the included file fails to load due to an error.
         */
        "onSlError"?: (event: SlIncludeCustomEvent<{ status?: number }>) => void;
        /**
          * Emitted when the included file is loaded.
         */
        "onSlLoad"?: (event: SlIncludeCustomEvent<any>) => void;
        /**
          * The location of the HTML file to include.
         */
        "src"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlInput {
        /**
          * The input's horizontal align.
         */
        "align"?: 'left' | 'center' | 'right';
        /**
          * The input's autocaptialize attribute.
         */
        "autocapitalize"?: string;
        /**
          * The input's autocomplete attribute.
         */
        "autocomplete"?: string;
        /**
          * The input's autocorrect attribute.
         */
        "autocorrect"?: string;
        /**
          * The input's autofocus attribute.
         */
        "autofocus"?: boolean;
        /**
          * Set to true to add a clear button when the input is populated.
         */
        "clearable"?: boolean;
        /**
          * Set to true to disable the input.
         */
        "disabled"?: boolean;
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText"?: string;
        /**
          * The input's help text. Alternatively, you can use the help-text slot.
         */
        "helpText"?: string;
        /**
          * Enable this option to prevent input editor using dropdowns from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
         */
        "hoist"?: boolean;
        /**
          * The input's inputmode attribute.
         */
        "inputmode"?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
        /**
          * This will be true when the control is in an invalid state. Validity is determined by props such as `type`, `required`, `minlength`, `maxlength`, and `pattern` using the browser's constraint validation API.
         */
        "invalid"?: boolean;
        /**
          * The input's label. Alternatively, you can use the label slot.
         */
        "label"?: string;
        /**
          * The input's maximum value.
         */
        "max"?: number;
        /**
          * The maximum length of input that will be considered valid.
         */
        "maxlength"?: number;
        /**
          * The input's minimum value.
         */
        "min"?: number;
        /**
          * The minimum length of input that will be considered valid.
         */
        "minlength"?: number;
        /**
          * The input's name attribute.
         */
        "name"?: string;
        /**
          * Emitted when the control loses focus.
         */
        "onSlBlur"?: (event: SlInputCustomEvent<any>) => void;
        /**
          * Emitted when the clear button is activated.
         */
        "onSlClear"?: (event: SlInputCustomEvent<any>) => void;
        /**
          * Emitted when the control gains focus.
         */
        "onSlFocus"?: (event: SlInputCustomEvent<any>) => void;
        /**
          * Emitted when the control receives input.
         */
        "onSlInput"?: (event: SlInputCustomEvent<string | number>) => void;
        /**
          * Emitted when the control's value changes.
         */
        "onValueChange"?: (event: SlInputCustomEvent<any>) => void;
        /**
          * A pattern to validate input against.
         */
        "pattern"?: string;
        /**
          * Set to true to draw a pill-style input with rounded edges.
         */
        "pill"?: boolean;
        /**
          * The input's placeholder text.
         */
        "placeholder"?: string;
        /**
          * Set to true to make the input readonly.
         */
        "readonly"?: boolean;
        /**
          * Set to true to make the input a required field.
         */
        "required"?: boolean;
        /**
          * The input's size.
         */
        "size"?: 'small' | 'medium' | 'large';
        /**
          * Enables spell checking on the input.
         */
        "spellcheck"?: boolean;
        /**
          * The input's step attribute.
         */
        "step"?: number;
        /**
          * Set to true to add a password toggle button for password inputs.
         */
        "togglePassword"?: boolean;
        /**
          * The input's type.
         */
        "type"?: 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url' | 'date' | 'time';
        /**
          * The input's value attribute.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlLabel {
        /**
          * The label's size
         */
        "color"?: | 'blue'
    | 'green'
    | 'red'
    | 'yellow'
    | 'purple'
    | 'light'
    | 'dark'
    | 'medium'
    | 'very-light'
    | 'very-dark';
        /**
          * Whether the label is multiline.
         */
        "multiline"?: boolean;
        /**
          * The label's size
         */
        "size"?: 'x-small' | 'small' | 'medium' | 'large' | 'x-large';
        /**
          * The label's weight
         */
        "weight"?: 'light' | 'normal' | 'semibold' | 'bold';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlLayout {
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlList {
        /**
          * Set to 'full' to show lines between list items.
         */
        "lines"?: 'full' | 'none';
        /**
          * Emitted when the control loses focus.
         */
        "onSlBlur"?: (event: SlListCustomEvent<any>) => void;
        /**
          * Emitted when the control gains focus.
         */
        "onSlFocus"?: (event: SlListCustomEvent<any>) => void;
        /**
          * Emitted when a list item is selected.
         */
        "onValueChange"?: (event: SlListCustomEvent<string>) => void;
        /**
          * The value of the control..
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlListDivider {
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlListItem {
        /**
          * Whether this item is visually active or not.
         */
        "active"?: boolean;
        /**
          * Whether the items are vertically centered or not. By default they align to the top
         */
        "center"?: boolean;
        /**
          * A value that can be attached to the list item.
         */
        "value"?: any;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlMap {
        /**
          * The mapbox access token (Required)
         */
        "accessToken"?: string;
        /**
          * The latitude center
         */
        "lat"?: number;
        /**
          * The longitude center
         */
        "lng"?: number;
        /**
          * The map style.
         */
        "mapStyle"?: string;
        /**
          * Emitted when map is moved.
         */
        "onSlMove"?: (event: SlMapCustomEvent<any>) => void;
        /**
          * The default zoom
         */
        "zoom"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlMenu {
        /**
          * Emitted when a menu item is selected.
         */
        "onSlSelect"?: (event: SlMenuCustomEvent<{ item: HTMLSlMenuItemElement }>) => void;
    }
    /**
     * @since 1.0
     * @status deprecated
     */
    interface SlMenuDivider {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlMenuItem {
        /**
          * Set to true to draw the item in a checked state.
         */
        "checked"?: boolean;
        /**
          * Set to true to draw the menu item in a disabled state.
         */
        "disabled"?: boolean;
        /**
          * The menu items type.
         */
        "type"?: 'default' | 'primary' | 'danger';
        /**
          * A unique value to store in the menu item. This can be used as a way to identify menu items when selected.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlMenuLabel {
    }
    interface SlOtpInput {
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText"?: string;
        /**
          * Emitted when the value change.
         */
        "onValueChange"?: (event: SlOtpInputCustomEvent<any>) => void;
        /**
          * The value of the component.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlOtpView {
        /**
          * The email the display as recipient of the code.
         */
        "email"?: string;
        /**
          * Optional error text for show under the input.
         */
        "errorText"?: string;
        /**
          * Emitted on otp input
         */
        "onOtpInput"?: (event: SlOtpViewCustomEvent<any>) => void;
        /**
          * Emitted when the usere requests to have the otp send again.
         */
        "onResendPasscode"?: (event: SlOtpViewCustomEvent<any>) => void;
        /**
          * The default otp to use in the input
         */
        "otp"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlPageHeader {
        /**
          * The header text.
         */
        "header"?: string;
        /**
          * Whether the position of the header is sticky or not.
         */
        "sticky"?: boolean;
        /**
          * The type of page header.
         */
        "type"?: 'opaque' | 'frosted';
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlPagination {
        /**
          * Emitted when the page changes.
         */
        "onPageChange"?: (event: SlPaginationCustomEvent<any>) => void;
        /**
          * The current page.
         */
        "page"?: number;
        /**
          * The total pages available.
         */
        "totalPages"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlPopover {
        /**
          * The positioning anchor that defines the attachment point of the popover.
         */
        "anchorElement"?: HTMLElement;
        /**
          * A Boolean value that determines whether to show an arrow pointing at the anchorElement.
         */
        "arrow"?: boolean;
        /**
          * The distance in pixels from which to offset the popover away from its trigger.
         */
        "distance"?: number;
        /**
          * Emitted after the popover closes and all transitions are complete.
         */
        "onSlAfterHide"?: (event: SlPopoverCustomEvent<any>) => void;
        /**
          * Emitted after the popover opens and all transitions are complete.
         */
        "onSlAfterShow"?: (event: SlPopoverCustomEvent<any>) => void;
        /**
          * Emitted when the popover closes. Calling `event.preventDefault()` will prevent it from being closed.
         */
        "onSlHide"?: (event: SlPopoverCustomEvent<any>) => void;
        /**
          * Emitted when the popover opens. Calling `event.preventDefault()` will prevent it from being opened.
         */
        "onSlShow"?: (event: SlPopoverCustomEvent<any>) => void;
        /**
          * Indicates whether or not the popover is open. You can use this in lieu of the show/hide methods.
         */
        "open"?: boolean;
        /**
          * The preferred placement of the popover panel. Note that the actual placement may vary as needed to keep the panel inside of the viewport.
         */
        "placement"?: | 'top'
    | 'top-start'
    | 'top-end'
    | 'bottom'
    | 'bottom-start'
    | 'bottom-end'
    | 'right'
    | 'right-start'
    | 'right-end'
    | 'left'
    | 'left-start'
    | 'left-end';
        /**
          * The distance in pixels from which to offset the popover along its trigger.
         */
        "skidding"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlProgressBar {
        /**
          * When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.
         */
        "indeterminate"?: boolean;
        /**
          * The progress bar's percentage, 0 to 100.
         */
        "percentage"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlProgressRing {
        /**
          * The current progress percentage, 0 - 100.
         */
        "percentage"?: number;
        /**
          * The size of the progress ring in pixels.
         */
        "size"?: number;
        /**
          * The stroke width of the progress ring in pixels.
         */
        "strokeWidth"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRadio {
        /**
          * Set to true to draw the radio in a checked state.
         */
        "checked"?: boolean;
        /**
          * Set to true to disable the radio.
         */
        "disabled"?: boolean;
        /**
          * This will be true when the control is in an invalid state. Validity in range inputs is determined by the message provided by the `setCustomValidity` method.
         */
        "invalid"?: boolean;
        /**
          * The radio's name attribute.
         */
        "name"?: string;
        /**
          * Emitted when the control's checked state changes.
         */
        "onCheckedChange"?: (event: SlRadioCustomEvent<boolean>) => void;
        /**
          * Emitted when the control loses focus.
         */
        "onSlBlur"?: (event: SlRadioCustomEvent<any>) => void;
        /**
          * Emitted when the control gains focus.
         */
        "onSlFocus"?: (event: SlRadioCustomEvent<any>) => void;
        /**
          * Set to true to make the radio readonly.
         */
        "readonly"?: boolean;
        /**
          * The radio's size.
         */
        "size"?: 'small' | 'medium' | 'large';
        /**
          * The radio's value attribute.
         */
        "value"?: string;
    }
    /**
     * @since 1.8
     * @status experimental
     */
    interface SlRadioGroup {
        /**
          * Set to true to disable the component.
         */
        "disabled"?: boolean;
        /**
          * Emits any changes to the value of the component.
         */
        "onValueChange"?: (event: SlRadioGroupCustomEvent<string>) => void;
        /**
          * The value of this component.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRange {
        /**
          * Set to true to disable the input.
         */
        "disabled"?: boolean;
        /**
          * The range's help text. Alternatively, you can use the help-text slot.
         */
        "helpText"?: string;
        /**
          * This will be true when the control is in an invalid state. Validity in range inputs is determined by the message provided by the `setCustomValidity` method.
         */
        "invalid"?: boolean;
        /**
          * The range's label. Alternatively, you can use the label slot.
         */
        "label"?: string;
        /**
          * The input's max attribute.
         */
        "max"?: number;
        /**
          * The input's min attribute.
         */
        "min"?: number;
        /**
          * The input's name attribute.
         */
        "name"?: string;
        /**
          * Emitted when the control loses focus.
         */
        "onSlBlur"?: (event: SlRangeCustomEvent<any>) => void;
        /**
          * Emitted when the control's value changes.
         */
        "onSlChange"?: (event: SlRangeCustomEvent<any>) => void;
        /**
          * Emitted when the control gains focus.
         */
        "onSlFocus"?: (event: SlRangeCustomEvent<any>) => void;
        /**
          * The input's step attribute.
         */
        "step"?: number;
        /**
          * The preferred placedment of the tooltip.
         */
        "tooltip"?: 'top' | 'bottom' | 'none';
        /**
          * A function used to format the tooltip's value.
         */
        "tooltipFormatter"?: (value: number) => string;
        /**
          * The input's value attribute.
         */
        "value"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRating {
        /**
          * Disables the rating.
         */
        "disabled"?: boolean;
        /**
          * A function that returns the symbols to display. Accepts an option `value` parameter you can use to map a specific symbol to a value.
         */
        "getSymbol"?: (value?: number) => string;
        /**
          * The highest rating to show.
         */
        "max"?: number;
        /**
          * Emitted when the rating's value changes.
         */
        "onSlChange"?: (event: SlRatingCustomEvent<any>) => void;
        /**
          * The minimum increment value allowed by the control.
         */
        "precision"?: number;
        /**
          * Makes the rating readonly.
         */
        "readonly"?: boolean;
        /**
          * The current rating.
         */
        "value"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRelativeTime {
        /**
          * The date from which to calculate time from.
         */
        "date"?: Date | string;
        /**
          * The formatting style to use.
         */
        "format"?: 'long' | 'short' | 'narrow';
        /**
          * The locale to use when formatting the number.
         */
        "locale"?: string;
        /**
          * When `auto`, values such as "yesterday" and "tomorrow" will be shown when possible. When `always`, values such as "1 day ago" and "in 1 day" will be shown.
         */
        "numeric"?: 'always' | 'auto';
        /**
          * Keep the displayed value up to date as time passes.
         */
        "sync"?: boolean;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlResizeObserver {
        /**
          * Emitted when the element is resized.
         */
        "onSlResize"?: (event: SlResizeObserverCustomEvent<readonly ResizeObserverEntry[]>) => void;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlResponsiveEmbed {
        /**
          * The aspect ratio of the embedded media in the format of `width:height`, e.g. `16:9`, `4:3`, or `1:1`. Ratios not in this format will be ignored.
         */
        "aspectRatio"?: string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlRow {
        /**
          * The columns.
         */
        "columns"?: HTMLSlColumnElement[];
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlRrulePicker {
        /**
          * Whether the rrule-picker allows selection of specific rules that includes BYDAY, BYMONTH, BYWEEK etc.
         */
        "allowSpecific"?: boolean;
        /**
          * Emitted when the rrule is changed.
         */
        "onValueChange"?: (event: SlRrulePickerCustomEvent<any>) => void;
        /**
          * The value of the rrule picker.
         */
        "value"?: string;
    }
    interface SlScheduler {
        /**
          * The data source for the timeline. Enables the timeline to load resources and events when needed.
         */
        "dataSource"?: CalendarDataSource;
        /**
          * Emitted when changes to the selected resources occurs.
         */
        "onSlResourceSelect"?: (event: SlSchedulerCustomEvent<any>) => void;
        /**
          * The selected resources
         */
        "selectedResources"?: string[];
        /**
          * Whether to show controls for selecting resource
         */
        "showResourceSelector"?: boolean;
        /**
          * Whether to show controls for selecting view
         */
        "showViewSelector"?: boolean;
        /**
          * The start date of the current view in the scheduler.
         */
        "startDate"?: Date;
        /**
          * The view of the scheduler
         */
        "view"?: 'timeline' | 'calendar';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSection {
        /**
          * The description of the section
         */
        "description"?: string;
        /**
          * The header of the section
         */
        "header"?: string;
        /**
          * Defines the type of section layout
         */
        "type"?: 'two-column';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSelect {
        /**
          * Set to true to add a clear button when the select is populated.
         */
        "clearable"?: boolean;
        /**
          * Set the amount of time, in milliseconds, to wait to trigger the `search` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.
         */
        "debounce"?: number;
        /**
          * Set to true to disable the select control.
         */
        "disabled"?: boolean;
        /**
          * The select's error text. Alternatively, you can use the error-text slot.
         */
        "errorText"?: string;
        /**
          * The select's help text. Alternatively, you can use the help-text slot.
         */
        "helpText"?: string;
        /**
          * Enable this option to prevent the panel from being clipped when the component is placed inside a container with `overflow: auto|scroll`.
         */
        "hoist"?: boolean;
        /**
          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
         */
        "invalid"?: boolean;
        /**
          * The select's label. Alternatively, you can use the label slot.
         */
        "label"?: string;
        /**
          * The maximum number of tags to show when `multiple` is true. After the maximum, "+n" will be shown to indicate the number of additional items that are selected. Set to -1 to remove the limit.
         */
        "maxTagsVisible"?: number;
        /**
          * Set to true to enable multiselect.
         */
        "multiple"?: boolean;
        /**
          * The select's name.
         */
        "name"?: string;
        /**
          * Emitted when the control loses focus.
         */
        "onSlBlur"?: (event: SlSelectCustomEvent<any>) => void;
        /**
          * Emitted when the control gains focus.
         */
        "onSlFocus"?: (event: SlSelectCustomEvent<any>) => void;
        /**
          * Emitted when text is entered in a searchable select.
         */
        "onSlSearch"?: (event: SlSelectCustomEvent<any>) => void;
        /**
          * Emitted when the control's value changes.
         */
        "onValueChange"?: (event: SlSelectCustomEvent<string | string[]>) => void;
        /**
          * Set to true to draw a pill-style select with rounded edges.
         */
        "pill"?: boolean;
        /**
          * The select's placeholder text.
         */
        "placeholder"?: string;
        /**
          * The select's required attribute.
         */
        "required"?: boolean;
        /**
          * The label displayed in the input field when select is searchable. Can be used to set the display value of a searchbox before anyhing has been searched for.
         */
        "search"?: string;
        /**
          * Set to true to add a clear button when the select is populated.
         */
        "searchable"?: boolean;
        /**
          * The select's size.
         */
        "size"?: 'small' | 'medium' | 'large';
        /**
          * The value of the control. This will be a string or an array depending on `multiple`.
         */
        "value"?: string | Array<string>;
    }
    interface SlSidebar {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSkeleton {
        /**
          * Determines which effect the skeleton will use.
         */
        "effect"?: 'pulse' | 'sheen' | 'none';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSpinner {
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSplitLayout {
        /**
          * Sets the direction of the split layout.
         */
        "direction"?: 'vertical' | 'horizontal';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlStatistic {
        /**
          * The legend for the statistic
         */
        "legend"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlStep {
        /**
          * The active step.
         */
        "step"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlStepItem {
        /**
          * Whether the step is active or not. (Will be set by the Step component)
         */
        "active"?: boolean;
        /**
          * Header for the step item. (Will be set by the Step component.)
         */
        "header"?: string;
        /**
          * Label for the step item.
         */
        "label"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlSwitch {
        /**
          * Set to true to draw the switch in a checked state.
         */
        "checked"?: boolean;
        /**
          * Set to true to disable the switch.
         */
        "disabled"?: boolean;
        /**
          * This will be true when the control is in an invalid state. Validity is determined by the `required` prop.
         */
        "invalid"?: boolean;
        /**
          * The switch's name attribute.
         */
        "name"?: string;
        /**
          * Emitted when the control's checked state changes.
         */
        "onCheckedChange"?: (event: SlSwitchCustomEvent<any>) => void;
        /**
          * Emitted when the control loses focus.
         */
        "onSlBlur"?: (event: SlSwitchCustomEvent<any>) => void;
        /**
          * Emitted when the control gains focus.
         */
        "onSlFocus"?: (event: SlSwitchCustomEvent<any>) => void;
        /**
          * Set to true to make the switch a required field.
         */
        "required"?: boolean;
        /**
          * The switch's value attribute.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTab {
        /**
          * Set to true to draw the tab in an active state.
         */
        "active"?: boolean;
        /**
          * When true, the tab will be rendered with a close icon.
         */
        "closable"?: boolean;
        /**
          * Set to true to draw the tab in a disabled state.
         */
        "disabled"?: boolean;
        /**
          * Emitted when the tab is closable and the close button is activated.
         */
        "onSlClose"?: (event: SlTabCustomEvent<any>) => void;
        /**
          * The name of the tab panel the tab will control. The panel must be located in the same tab group.
         */
        "panel"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTabGroup {
        /**
          * Disables the scroll arrows that appear when tabs overflow.
         */
        "noScrollControls"?: boolean;
        /**
          * Emitted when a tab is hidden.
         */
        "onSlTabHide"?: (event: SlTabGroupCustomEvent<{ name: string }>) => void;
        /**
          * Emitted when a tab is shown.
         */
        "onSlTabShow"?: (event: SlTabGroupCustomEvent<{ name: string }>) => void;
        /**
          * Emitted when value changes
         */
        "onValueChange"?: (event: SlTabGroupCustomEvent<any>) => void;
        /**
          * The placement of the tabs.
         */
        "placement"?: 'top' | 'bottom' | 'left' | 'right';
        /**
          * Name of the selected tab
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTabPanel {
        /**
          * When true, the tab panel will be shown.
         */
        "active"?: boolean;
        /**
          * The tab panel's name.
         */
        "name"?: string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlTable {
        /**
          * Defines how the table can scroll.
         */
        "scrollBehaviour"?: 'none' | 'vertical' | 'horizontal' | 'both';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTag {
        /**
          * Set to true to make the tag clearable.
         */
        "clearable"?: boolean;
        /**
          * Name of icon to display in tag.
         */
        "icon"?: any;
        /**
          * Emitted when the clear button is activated.
         */
        "onSlClear"?: (event: SlTagCustomEvent<any>) => void;
        /**
          * Set to true to draw a pill-style tag with rounded edges.
         */
        "pill"?: boolean;
        /**
          * The tag's size.
         */
        "size"?: 'small' | 'medium' | 'large';
        /**
          * The tag's type.
         */
        "type"?: 'primary' | 'success' | 'info' | 'warning' | 'danger' | 'text';
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTextarea {
        /**
          * The textarea's autocaptialize attribute.
         */
        "autocapitalize"?: string;
        /**
          * The textarea's autocomplete attribute.
         */
        "autocomplete"?: string;
        /**
          * The textarea's autocorrect attribute.
         */
        "autocorrect"?: string;
        /**
          * The textarea's autofocus attribute.
         */
        "autofocus"?: boolean;
        /**
          * Set to true to disable the textarea.
         */
        "disabled"?: boolean;
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText"?: string;
        /**
          * The textarea's help text. Alternatively, you can use the help-text slot.
         */
        "helpText"?: string;
        /**
          * The textarea's inputmode attribute.
         */
        "inputmode"?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
        /**
          * This will be true when the control is in an invalid state. Validity is determined by props such as `required`, `minlength`, and `maxlength` using the browser's constraint validation API.
         */
        "invalid"?: boolean;
        /**
          * The textarea's label. Alternatively, you can use the label slot.
         */
        "label"?: string;
        /**
          * The maximum length of input that will be considered valid.
         */
        "maxlength"?: number;
        /**
          * The minimum length of input that will be considered valid.
         */
        "minlength"?: number;
        /**
          * The textarea's name attribute.
         */
        "name"?: string;
        /**
          * Emitted when the control loses focus.
         */
        "onSlBlur"?: (event: SlTextareaCustomEvent<any>) => void;
        /**
          * Emitted when the control gains focus.
         */
        "onSlFocus"?: (event: SlTextareaCustomEvent<any>) => void;
        /**
          * Emitted when the control receives input.
         */
        "onSlInput"?: (event: SlTextareaCustomEvent<any>) => void;
        /**
          * Emitted when the control's value changes.
         */
        "onValueChange"?: (event: SlTextareaCustomEvent<any>) => void;
        /**
          * The textarea's placeholder text.
         */
        "placeholder"?: string;
        /**
          * Set to true for a readonly textarea.
         */
        "readonly"?: boolean;
        /**
          * The textarea's required attribute.
         */
        "required"?: boolean;
        /**
          * Controls how the textarea can be resized.
         */
        "resize"?: 'none' | 'vertical' | 'auto';
        /**
          * The number of rows to display by default.
         */
        "rows"?: number;
        /**
          * The textarea's size.
         */
        "size"?: 'small' | 'medium' | 'large';
        /**
          * The textarea's spellcheck attribute.
         */
        "spellcheck"?: boolean;
        /**
          * The textarea's value attribute.
         */
        "value"?: string;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlTheme {
        /**
          * The name of the theme to use. The user is responsible for including the associated stylesheet(s). Supportive themes must adhere to theme guidelines by exposing a class that follows the `sl-theme-{name}` convention.
         */
        "name"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTimePeriod {
        /**
          * The input's error text. Alternatively, you can use the error-text slot.
         */
        "errorText"?: string;
        /**
          * The input's help text. Alternatively, you can use the help-text slot.
         */
        "helpText"?: string;
        /**
          * The input's label.
         */
        "label"?: string;
        /**
          * Emitted when the value changes.
         */
        "onValueChange"?: (event: SlTimePeriodCustomEvent<any>) => void;
        /**
          * The input's size.
         */
        "size"?: 'small' | 'medium' | 'large';
        /**
          * The input's value.
         */
        "value"?: Period;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTimeline {
        /**
          * The first date to display in the timeline.
         */
        "date"?: Date;
        /**
          * The date events to display in the timeline.
         */
        "events"?: DateEvent[];
        /**
          * Emitted when a drop event occurs on the timeline.
         */
        "onSlMove"?: (event: SlTimelineCustomEvent<any>) => void;
        /**
          * Emitted when an event is selected.
         */
        "onSlSelect"?: (event: SlTimelineCustomEvent<any>) => void;
        /**
          * The resources to display in the timeline.
         */
        "resources"?: Resource[];
        /**
          * Optional preselected id
         */
        "selectedId"?: string;
        /**
          * Number of weeks to display. Must be between 1 to 4.
         */
        "weeks"?: number;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlTooltip {
        /**
          * The tooltip's content. Alternatively, you can use the content slot.
         */
        "content"?: string;
        /**
          * Set to true to disable the tooltip so it won't show when triggered.
         */
        "disabled"?: boolean;
        /**
          * The distance in pixels from which to offset the tooltip away from its target.
         */
        "distance"?: number;
        /**
          * Emitted after the tooltip has hidden and all transitions are complete.
         */
        "onSlAfterHide"?: (event: SlTooltipCustomEvent<any>) => void;
        /**
          * Emitted after the tooltip has shown and all transitions are complete.
         */
        "onSlAfterShow"?: (event: SlTooltipCustomEvent<any>) => void;
        /**
          * Emitted when the tooltip begins to hide. Calling `event.preventDefault()` will prevent it from being hidden.
         */
        "onSlHide"?: (event: SlTooltipCustomEvent<any>) => void;
        /**
          * Emitted when the tooltip begins to show. Calling `event.preventDefault()` will prevent it from being shown.
         */
        "onSlShow"?: (event: SlTooltipCustomEvent<any>) => void;
        /**
          * Indicates whether or not the tooltip is open. You can use this in lieu of the show/hide methods.
         */
        "open"?: boolean;
        /**
          * The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip inside of the viewport.
         */
        "placement"?: | 'top'
    | 'top-start'
    | 'top-end'
    | 'right'
    | 'right-start'
    | 'right-end'
    | 'bottom'
    | 'bottom-start'
    | 'bottom-end'
    | 'left'
    | 'left-start'
    | 'left-end';
        /**
          * The distance in pixels from which to offset the tooltip along its target.
         */
        "skidding"?: number;
        /**
          * Controls how the tooltip is activated. Possible options include `click`, `hover`, `focus`, and `manual`. Multiple options can be passed by separating them with a space. When manual is used, the tooltip must be activated programmatically.
         */
        "trigger"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlUpload {
        /**
          * The comma seperated accept filter applied to the html file input (fx. image/*,.pdf).
         */
        "accept"?: string;
        /**
          * Additional description displayed under the link.
         */
        "description"?: string;
        /**
          * Whether single of multi selection is allowed.
         */
        "multiple"?: boolean;
        /**
          * Emitted when file is ready to upload.
         */
        "onUpload"?: (event: SlUploadCustomEvent<FileList>) => void;
    }
    /**
     * @since 1.0
     * @status experimental
     */
    interface SlVideo {
        /**
          * an image for preview before showing the video
         */
        "previewImage"?: string;
        /**
          * url for the video to show
         */
        "src"?: string;
    }
    /**
     * @since 1.0
     * @status stable
     */
    interface SlWell {
        /**
          * Whether padding should be added to the well or not.
         */
        "padding"?: boolean;
    }
    interface IntrinsicElements {
        "sl-address": SlAddress;
        "sl-alert": SlAlert;
        "sl-animation": SlAnimation;
        "sl-auth": SlAuth;
        "sl-auth-profile": SlAuthProfile;
        "sl-avatar": SlAvatar;
        "sl-badge": SlBadge;
        "sl-breadcrumb": SlBreadcrumb;
        "sl-breadcrumb-item": SlBreadcrumbItem;
        "sl-bubble": SlBubble;
        "sl-button": SlButton;
        "sl-button-group": SlButtonGroup;
        "sl-calendar": SlCalendar;
        "sl-calendar-date": SlCalendarDate;
        "sl-card": SlCard;
        "sl-cell": SlCell;
        "sl-chart": SlChart;
        "sl-checkbox": SlCheckbox;
        "sl-column": SlColumn;
        "sl-date-cell": SlDateCell;
        "sl-date-picker": SlDatePicker;
        "sl-details": SlDetails;
        "sl-dialog": SlDialog;
        "sl-divider": SlDivider;
        "sl-drawer": SlDrawer;
        "sl-dropdown": SlDropdown;
        "sl-empty": SlEmpty;
        "sl-fieldrow": SlFieldrow;
        "sl-fieldset": SlFieldset;
        "sl-flex": SlFlex;
        "sl-form": SlForm;
        "sl-format-bytes": SlFormatBytes;
        "sl-format-date": SlFormatDate;
        "sl-format-number": SlFormatNumber;
        "sl-format-rrule": SlFormatRrule;
        "sl-grid": SlGrid;
        "sl-icon": SlIcon;
        "sl-icon-button": SlIconButton;
        "sl-icon-library": SlIconLibrary;
        "sl-include": SlInclude;
        "sl-input": SlInput;
        "sl-label": SlLabel;
        "sl-layout": SlLayout;
        "sl-list": SlList;
        "sl-list-divider": SlListDivider;
        "sl-list-item": SlListItem;
        "sl-map": SlMap;
        "sl-menu": SlMenu;
        "sl-menu-divider": SlMenuDivider;
        "sl-menu-item": SlMenuItem;
        "sl-menu-label": SlMenuLabel;
        "sl-otp-input": SlOtpInput;
        "sl-otp-view": SlOtpView;
        "sl-page-header": SlPageHeader;
        "sl-pagination": SlPagination;
        "sl-popover": SlPopover;
        "sl-progress-bar": SlProgressBar;
        "sl-progress-ring": SlProgressRing;
        "sl-radio": SlRadio;
        "sl-radio-group": SlRadioGroup;
        "sl-range": SlRange;
        "sl-rating": SlRating;
        "sl-relative-time": SlRelativeTime;
        "sl-resize-observer": SlResizeObserver;
        "sl-responsive-embed": SlResponsiveEmbed;
        "sl-row": SlRow;
        "sl-rrule-picker": SlRrulePicker;
        "sl-scheduler": SlScheduler;
        "sl-section": SlSection;
        "sl-select": SlSelect;
        "sl-sidebar": SlSidebar;
        "sl-skeleton": SlSkeleton;
        "sl-spinner": SlSpinner;
        "sl-split-layout": SlSplitLayout;
        "sl-statistic": SlStatistic;
        "sl-step": SlStep;
        "sl-step-item": SlStepItem;
        "sl-switch": SlSwitch;
        "sl-tab": SlTab;
        "sl-tab-group": SlTabGroup;
        "sl-tab-panel": SlTabPanel;
        "sl-table": SlTable;
        "sl-tag": SlTag;
        "sl-textarea": SlTextarea;
        "sl-theme": SlTheme;
        "sl-time-period": SlTimePeriod;
        "sl-timeline": SlTimeline;
        "sl-tooltip": SlTooltip;
        "sl-upload": SlUpload;
        "sl-video": SlVideo;
        "sl-well": SlWell;
    }
}
export { LocalJSX as JSX };
declare module "@stencil/core" {
    export namespace JSX {
        interface IntrinsicElements {
            /**
             * @since 1.0
             * @status stable
             */
            "sl-address": LocalJSX.SlAddress & JSXBase.HTMLAttributes<HTMLSlAddressElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-alert": LocalJSX.SlAlert & JSXBase.HTMLAttributes<HTMLSlAlertElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-animation": LocalJSX.SlAnimation & JSXBase.HTMLAttributes<HTMLSlAnimationElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-auth": LocalJSX.SlAuth & JSXBase.HTMLAttributes<HTMLSlAuthElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-auth-profile": LocalJSX.SlAuthProfile & JSXBase.HTMLAttributes<HTMLSlAuthProfileElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-avatar": LocalJSX.SlAvatar & JSXBase.HTMLAttributes<HTMLSlAvatarElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-badge": LocalJSX.SlBadge & JSXBase.HTMLAttributes<HTMLSlBadgeElement>;
            /**
             * @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.
             * @documentation https://shoelace.style/components/breadcrumb
             * @status stable
             * @since $.0
             * @dependency sl-icon
             * @csspart base - The component's base wrapper.
             */
            "sl-breadcrumb": LocalJSX.SlBreadcrumb & JSXBase.HTMLAttributes<HTMLSlBreadcrumbElement>;
            /**
             * @summary Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.
             * @status stable
             * @since $.0
             * @csspart base - The component's base wrapper.
             * @csspart label - The breadcrumb item's label.
             * @csspart prefix - The container that wraps the prefix.
             * @csspart suffix - The container that wraps the suffix.
             * @csspart separator - The container that wraps the separator.
             */
            "sl-breadcrumb-item": LocalJSX.SlBreadcrumbItem & JSXBase.HTMLAttributes<HTMLSlBreadcrumbItemElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-bubble": LocalJSX.SlBubble & JSXBase.HTMLAttributes<HTMLSlBubbleElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-button": LocalJSX.SlButton & JSXBase.HTMLAttributes<HTMLSlButtonElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-button-group": LocalJSX.SlButtonGroup & JSXBase.HTMLAttributes<HTMLSlButtonGroupElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-calendar": LocalJSX.SlCalendar & JSXBase.HTMLAttributes<HTMLSlCalendarElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-calendar-date": LocalJSX.SlCalendarDate & JSXBase.HTMLAttributes<HTMLSlCalendarDateElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-card": LocalJSX.SlCard & JSXBase.HTMLAttributes<HTMLSlCardElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-cell": LocalJSX.SlCell & JSXBase.HTMLAttributes<HTMLSlCellElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-chart": LocalJSX.SlChart & JSXBase.HTMLAttributes<HTMLSlChartElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-checkbox": LocalJSX.SlCheckbox & JSXBase.HTMLAttributes<HTMLSlCheckboxElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-column": LocalJSX.SlColumn & JSXBase.HTMLAttributes<HTMLSlColumnElement>;
            "sl-date-cell": LocalJSX.SlDateCell & JSXBase.HTMLAttributes<HTMLSlDateCellElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-date-picker": LocalJSX.SlDatePicker & JSXBase.HTMLAttributes<HTMLSlDatePickerElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-details": LocalJSX.SlDetails & JSXBase.HTMLAttributes<HTMLSlDetailsElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-dialog": LocalJSX.SlDialog & JSXBase.HTMLAttributes<HTMLSlDialogElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-divider": LocalJSX.SlDivider & JSXBase.HTMLAttributes<HTMLSlDividerElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-drawer": LocalJSX.SlDrawer & JSXBase.HTMLAttributes<HTMLSlDrawerElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-dropdown": LocalJSX.SlDropdown & JSXBase.HTMLAttributes<HTMLSlDropdownElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-empty": LocalJSX.SlEmpty & JSXBase.HTMLAttributes<HTMLSlEmptyElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-fieldrow": LocalJSX.SlFieldrow & JSXBase.HTMLAttributes<HTMLSlFieldrowElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-fieldset": LocalJSX.SlFieldset & JSXBase.HTMLAttributes<HTMLSlFieldsetElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-flex": LocalJSX.SlFlex & JSXBase.HTMLAttributes<HTMLSlFlexElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-form": LocalJSX.SlForm & JSXBase.HTMLAttributes<HTMLSlFormElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-format-bytes": LocalJSX.SlFormatBytes & JSXBase.HTMLAttributes<HTMLSlFormatBytesElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-format-date": LocalJSX.SlFormatDate & JSXBase.HTMLAttributes<HTMLSlFormatDateElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-format-number": LocalJSX.SlFormatNumber & JSXBase.HTMLAttributes<HTMLSlFormatNumberElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-format-rrule": LocalJSX.SlFormatRrule & JSXBase.HTMLAttributes<HTMLSlFormatRruleElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-grid": LocalJSX.SlGrid & JSXBase.HTMLAttributes<HTMLSlGridElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-icon": LocalJSX.SlIcon & JSXBase.HTMLAttributes<HTMLSlIconElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-icon-button": LocalJSX.SlIconButton & JSXBase.HTMLAttributes<HTMLSlIconButtonElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-icon-library": LocalJSX.SlIconLibrary & JSXBase.HTMLAttributes<HTMLSlIconLibraryElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-include": LocalJSX.SlInclude & JSXBase.HTMLAttributes<HTMLSlIncludeElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-input": LocalJSX.SlInput & JSXBase.HTMLAttributes<HTMLSlInputElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-label": LocalJSX.SlLabel & JSXBase.HTMLAttributes<HTMLSlLabelElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-layout": LocalJSX.SlLayout & JSXBase.HTMLAttributes<HTMLSlLayoutElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-list": LocalJSX.SlList & JSXBase.HTMLAttributes<HTMLSlListElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-list-divider": LocalJSX.SlListDivider & JSXBase.HTMLAttributes<HTMLSlListDividerElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-list-item": LocalJSX.SlListItem & JSXBase.HTMLAttributes<HTMLSlListItemElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-map": LocalJSX.SlMap & JSXBase.HTMLAttributes<HTMLSlMapElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-menu": LocalJSX.SlMenu & JSXBase.HTMLAttributes<HTMLSlMenuElement>;
            /**
             * @since 1.0
             * @status deprecated
             */
            "sl-menu-divider": LocalJSX.SlMenuDivider & JSXBase.HTMLAttributes<HTMLSlMenuDividerElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-menu-item": LocalJSX.SlMenuItem & JSXBase.HTMLAttributes<HTMLSlMenuItemElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-menu-label": LocalJSX.SlMenuLabel & JSXBase.HTMLAttributes<HTMLSlMenuLabelElement>;
            "sl-otp-input": LocalJSX.SlOtpInput & JSXBase.HTMLAttributes<HTMLSlOtpInputElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-otp-view": LocalJSX.SlOtpView & JSXBase.HTMLAttributes<HTMLSlOtpViewElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-page-header": LocalJSX.SlPageHeader & JSXBase.HTMLAttributes<HTMLSlPageHeaderElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-pagination": LocalJSX.SlPagination & JSXBase.HTMLAttributes<HTMLSlPaginationElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-popover": LocalJSX.SlPopover & JSXBase.HTMLAttributes<HTMLSlPopoverElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-progress-bar": LocalJSX.SlProgressBar & JSXBase.HTMLAttributes<HTMLSlProgressBarElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-progress-ring": LocalJSX.SlProgressRing & JSXBase.HTMLAttributes<HTMLSlProgressRingElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-radio": LocalJSX.SlRadio & JSXBase.HTMLAttributes<HTMLSlRadioElement>;
            /**
             * @since 1.8
             * @status experimental
             */
            "sl-radio-group": LocalJSX.SlRadioGroup & JSXBase.HTMLAttributes<HTMLSlRadioGroupElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-range": LocalJSX.SlRange & JSXBase.HTMLAttributes<HTMLSlRangeElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-rating": LocalJSX.SlRating & JSXBase.HTMLAttributes<HTMLSlRatingElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-relative-time": LocalJSX.SlRelativeTime & JSXBase.HTMLAttributes<HTMLSlRelativeTimeElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-resize-observer": LocalJSX.SlResizeObserver & JSXBase.HTMLAttributes<HTMLSlResizeObserverElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-responsive-embed": LocalJSX.SlResponsiveEmbed & JSXBase.HTMLAttributes<HTMLSlResponsiveEmbedElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-row": LocalJSX.SlRow & JSXBase.HTMLAttributes<HTMLSlRowElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-rrule-picker": LocalJSX.SlRrulePicker & JSXBase.HTMLAttributes<HTMLSlRrulePickerElement>;
            "sl-scheduler": LocalJSX.SlScheduler & JSXBase.HTMLAttributes<HTMLSlSchedulerElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-section": LocalJSX.SlSection & JSXBase.HTMLAttributes<HTMLSlSectionElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-select": LocalJSX.SlSelect & JSXBase.HTMLAttributes<HTMLSlSelectElement>;
            "sl-sidebar": LocalJSX.SlSidebar & JSXBase.HTMLAttributes<HTMLSlSidebarElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-skeleton": LocalJSX.SlSkeleton & JSXBase.HTMLAttributes<HTMLSlSkeletonElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-spinner": LocalJSX.SlSpinner & JSXBase.HTMLAttributes<HTMLSlSpinnerElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-split-layout": LocalJSX.SlSplitLayout & JSXBase.HTMLAttributes<HTMLSlSplitLayoutElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-statistic": LocalJSX.SlStatistic & JSXBase.HTMLAttributes<HTMLSlStatisticElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-step": LocalJSX.SlStep & JSXBase.HTMLAttributes<HTMLSlStepElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-step-item": LocalJSX.SlStepItem & JSXBase.HTMLAttributes<HTMLSlStepItemElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-switch": LocalJSX.SlSwitch & JSXBase.HTMLAttributes<HTMLSlSwitchElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-tab": LocalJSX.SlTab & JSXBase.HTMLAttributes<HTMLSlTabElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-tab-group": LocalJSX.SlTabGroup & JSXBase.HTMLAttributes<HTMLSlTabGroupElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-tab-panel": LocalJSX.SlTabPanel & JSXBase.HTMLAttributes<HTMLSlTabPanelElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-table": LocalJSX.SlTable & JSXBase.HTMLAttributes<HTMLSlTableElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-tag": LocalJSX.SlTag & JSXBase.HTMLAttributes<HTMLSlTagElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-textarea": LocalJSX.SlTextarea & JSXBase.HTMLAttributes<HTMLSlTextareaElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-theme": LocalJSX.SlTheme & JSXBase.HTMLAttributes<HTMLSlThemeElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-time-period": LocalJSX.SlTimePeriod & JSXBase.HTMLAttributes<HTMLSlTimePeriodElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-timeline": LocalJSX.SlTimeline & JSXBase.HTMLAttributes<HTMLSlTimelineElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-tooltip": LocalJSX.SlTooltip & JSXBase.HTMLAttributes<HTMLSlTooltipElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-upload": LocalJSX.SlUpload & JSXBase.HTMLAttributes<HTMLSlUploadElement>;
            /**
             * @since 1.0
             * @status experimental
             */
            "sl-video": LocalJSX.SlVideo & JSXBase.HTMLAttributes<HTMLSlVideoElement>;
            /**
             * @since 1.0
             * @status stable
             */
            "sl-well": LocalJSX.SlWell & JSXBase.HTMLAttributes<HTMLSlWellElement>;
        }
    }
}