/* 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 { IAppMenuItem } from "./components/modus-wc-app-menu/modus-wc-app-menu";
import { AppName, AutocompleteTypes, DaisySize, Density, IAutocompleteItem, IAutocompleteNoResults, IFileDropzoneFeedback, IInputFeedbackProp, LogoName, ModusSize, Orientation, PopoverPlacement, SelectionMode, TextFieldTypes, TypographyHierarchy, TypographySize, TypographyWeight, WeekStartDay } from "./components/types";
import { IAvatarImageLoadError } from "./components/modus-wc-avatar/modus-wc-avatar";
import { IBottomSheetHeader, TBottomSheetDisplayMode } from "./components/modus-wc-bottom-sheet/modus-wc-bottom-sheet";
import { IBreadcrumb } from "./components/modus-wc-breadcrumbs/modus-wc-breadcrumbs";
import { ICollapseOptions } from "./components/modus-wc-collapse/modus-wc-collapse";
import { IInputFeedbackLevel } from "./components/modus-wc-input-feedback/modus-wc-input-feedback";
import { LoaderColor, LoaderVariant } from "./components/modus-wc-loader/modus-wc-loader";
import { INavbarTextOverrides, INavbarUserCard, INavbarVisibility } from "./components/modus-wc-navbar/modus-wc-navbar";
import { IAriaLabelValues, IPageChange } from "./components/modus-wc-pagination/modus-wc-pagination";
import { IProfileMenuProps, ISubMenu } from "./components/modus-wc-profile-menu/modus-wc-profile-menu";
import { IRatingChange, ModusWcRatingVariant } from "./components/modus-wc-rating/modus-wc-rating";
import { ISelectOption } from "./components/modus-wc-select/modus-wc-select";
import { IStepperItem } from "./components/modus-wc-stepper/modus-wc-stepper";
import { IPaginationChangeEventDetail, ITableColumn } from "./components/modus-wc-table/modus-wc-table";
import { SortingState } from "@tanstack/table-core";
import { ITab } from "./components/modus-wc-tabs/modus-wc-tabs";
import { IThemeConfig } from "./providers/theme/theme.types";
import { ToastPosition } from "./components/modus-wc-toast/modus-wc-toast";
export { IAppMenuItem } from "./components/modus-wc-app-menu/modus-wc-app-menu";
export { AppName, AutocompleteTypes, DaisySize, Density, IAutocompleteItem, IAutocompleteNoResults, IFileDropzoneFeedback, IInputFeedbackProp, LogoName, ModusSize, Orientation, PopoverPlacement, SelectionMode, TextFieldTypes, TypographyHierarchy, TypographySize, TypographyWeight, WeekStartDay } from "./components/types";
export { IAvatarImageLoadError } from "./components/modus-wc-avatar/modus-wc-avatar";
export { IBottomSheetHeader, TBottomSheetDisplayMode } from "./components/modus-wc-bottom-sheet/modus-wc-bottom-sheet";
export { IBreadcrumb } from "./components/modus-wc-breadcrumbs/modus-wc-breadcrumbs";
export { ICollapseOptions } from "./components/modus-wc-collapse/modus-wc-collapse";
export { IInputFeedbackLevel } from "./components/modus-wc-input-feedback/modus-wc-input-feedback";
export { LoaderColor, LoaderVariant } from "./components/modus-wc-loader/modus-wc-loader";
export { INavbarTextOverrides, INavbarUserCard, INavbarVisibility } from "./components/modus-wc-navbar/modus-wc-navbar";
export { IAriaLabelValues, IPageChange } from "./components/modus-wc-pagination/modus-wc-pagination";
export { IProfileMenuProps, ISubMenu } from "./components/modus-wc-profile-menu/modus-wc-profile-menu";
export { IRatingChange, ModusWcRatingVariant } from "./components/modus-wc-rating/modus-wc-rating";
export { ISelectOption } from "./components/modus-wc-select/modus-wc-select";
export { IStepperItem } from "./components/modus-wc-stepper/modus-wc-stepper";
export { IPaginationChangeEventDetail, ITableColumn } from "./components/modus-wc-table/modus-wc-table";
export { SortingState } from "@tanstack/table-core";
export { ITab } from "./components/modus-wc-tabs/modus-wc-tabs";
export { IThemeConfig } from "./providers/theme/theme.types";
export { ToastPosition } from "./components/modus-wc-toast/modus-wc-toast";
export namespace Components {
    /**
     * A customizable accordion component used for showing and hiding related groups of content.
     * The component supports a `<slot>` called 'content' for injecting `<modus-wc-collapse>` elements. See [Collapse](/docs/components-collapse--docs) docs for additional info.
     */
    interface ModusWcAccordion {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
    }
    /**
     * A customizable alert component used to inform the user about important events.
     * The component supports `<slot>` elements for injecting custom content and buttons.
     */
    interface ModusWcAlert {
        /**
          * The description of the alert.
         */
        "alertDescription"?: string;
        /**
          * The title of the alert.
         */
        "alertTitle": string;
        /**
          * Custom CSS class to apply to the outer div element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Time taken to dismiss the alert in milliseconds
         */
        "delay"?: number;
        /**
          * Whether to disable the icon
          * @default false
         */
        "disableIcon"?: boolean;
        /**
          * Whether the alert has a dismiss button
          * @default false
         */
        "dismissible"?: boolean;
        /**
          * The Modus icon to render.
         */
        "icon"?: string;
        /**
          * The variant of the alert.
          * @default 'info'
         */
        "variant"?: 'error' | 'info' | 'neutral' | 'success' | 'warning';
    }
    interface ModusWcAppMenu {
        /**
          * The apps to display in the menu.
          * @default []
         */
        "apps"?: IAppMenuItem[];
        /**
          * custom class to apply to the menu
          * @default ''
         */
        "customClass"?: string;
        /**
          * The layout of the menu.
          * @default 'list'
         */
        "layout"?: 'list' | 'grid';
    }
    /**
     * A customizable autocomplete component used to create searchable text inputs.
     * The component supports a `<slot>` for injecting custom content.
     */
    interface ModusWcAutocomplete {
        /**
          * Hint for form autofill feature.
         */
        "autoComplete"?: AutocompleteTypes;
        /**
          * Indicates that the autocomplete should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Clear the input value and reset items
         */
        "clearInput": () => Promise<void>;
        /**
          * Programmatically close the menu
         */
        "closeMenu": () => Promise<void>;
        /**
          * Custom blur handler - if provided, overrides default blur behavior
         */
        "customBlur"?: (event: FocusEvent) => void;
        /**
          * Custom CSS class to apply to host element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Custom input change handler - if provided, overrides default search filtering
         */
        "customInputChange"?: (value: string) => void;
        /**
          * Custom item selection handler - if provided, overrides default selection logic
         */
        "customItemSelect"?: (item: IAutocompleteItem) => void;
        /**
          * Custom key down handler - if provided, overrides default keyboard navigation
         */
        "customKeyDown"?: (event: KeyboardEvent) => void;
        /**
          * The debounce timeout in milliseconds. Set to 0 to disable debouncing.
          * @default 300
         */
        "debounceMs"?: number;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback state for the input field.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * Programmatically set focus to input
         */
        "focusInput": () => Promise<void>;
        /**
          * Show the clear button within the input field.
          * @default false
         */
        "includeClear"?: boolean;
        /**
          * Show the search icon within the input field.
          * @default false
         */
        "includeSearch"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The items to display in the menu. Creating a new array of items will ensure proper component re-render.
          * @default []
         */
        "items"?: IAutocompleteItem[];
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Whether the menu should remain open after an item is selected.
          * @default false
         */
        "leaveMenuOpen"?: boolean;
        /**
          * Maximum number of chips to display. When exceeded, shows expand/collapse button. Set to -1 to disable limit.
          * @default -1
         */
        "maxChips"?: number;
        /**
          * The minimum number of characters required to render the menu.
          * @default 0
         */
        "minChars": number;
        /**
          * Minimum width for the text input in pixels. When chips would make input smaller, container height increases instead.
          * @default 10
         */
        "minInputWidth"?: number;
        /**
          * Whether the input allows multiple items to be selected.
          * @default false
         */
        "multiSelect"?: boolean;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * The content to display when no results are found.
          * @default {     ariaLabel: 'No results found',     label: 'No results found',     subLabel: 'Check spelling or try a different keyword',   }
         */
        "noResults"?: IAutocompleteNoResults;
        /**
          * Programmatically open the menu
         */
        "openMenu": () => Promise<void>;
        /**
          * Text that appears in the form control when it has no value set.
          * @default ''
         */
        "placeholder"?: string;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * Programmatically select an item
         */
        "selectItem": (item: IAutocompleteItem | null) => Promise<void>;
        /**
          * Whether to show the menu whenever the input has focus, regardless of input value.
          * @default false
         */
        "showMenuOnFocus"?: boolean;
        /**
          * A spinner that appears when set to true
          * @default false
         */
        "showSpinner"?: boolean;
        /**
          * The size of the autocomplete (input and menu).
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * Programmatically toggle the menu open/closed
         */
        "toggleMenu": () => Promise<void>;
        /**
          * The value of the control.
          * @default ''
         */
        "value": string;
    }
    /**
     * A customizable avatar component used to create avatars with different images or user initials.
     * When no image is provided, the component can display initials (up to 3 characters) from the initials prop.
     * The component will extract the first letter of each word in the initials string.
     */
    interface ModusWcAvatar {
        /**
          * The image alt attribute for accessibility.
         */
        "alt": string;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The location of the image.
          * @default ''
         */
        "imgSrc": string;
        /**
          * The initials to display when no image is provided.
          * @default ''
         */
        "initials"?: string;
        /**
          * The shape of the avatar.
          * @default 'circle'
         */
        "shape"?: 'circle' | 'square';
        /**
          * The size of the avatar.
          * @default 'md'
         */
        "size"?: DaisySize | 'xl';
    }
    /**
     * A customizable badge component used to create badges with different sizes, types, and colors.
     * The component supports a `<slot>` for injecting content within the badge.
     */
    interface ModusWcBadge {
        /**
          * The color variant of the badge.
          * @default 'primary'
         */
        "color": | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'high-contrast'
    | 'success'
    | 'warning'
    | 'danger';
        /**
          * Custom CSS class to apply to the span element.
          * @default ''
         */
        "customClass": string;
        /**
          * The size of the badge.
          * @default 'md'
         */
        "size": ModusSize;
        /**
          * The variant of the badge.
          * @default 'filled'
         */
        "variant": 'counter' | 'filled' | 'outlined' | 'text';
    }
    interface ModusWcBottomSheet {
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Resting display mode: 'minimized', 'default', or 'expanded'. Drag/keyboard interactions do not overwrite this prop.
          * @default 'default'
         */
        "displayMode"?: TBottomSheetDisplayMode;
        /**
          * Fraction (0-1) of the sheet height it must be dragged, in either direction, before it steps one level.
          * @default 0.4
         */
        "dragStepThreshold"?: number;
        /**
          * Configuration for the built-in header layout. Do not set this prop if you intend to use the 'header' slot.
         */
        "header"?: IBottomSheetHeader;
        /**
          * Controls whether the bottom sheet is visible.
          * @default false
         */
        "visible"?: boolean;
    }
    /**
     * A customizable breadcrumbs component used to help users navigate through a website.
     */
    interface ModusWcBreadcrumbs {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The breadcrumbs to render.
          * @default []
         */
        "items": IBreadcrumb[];
        /**
          * The size of the breadcrumbs.
          * @default 'md'
         */
        "size"?: ModusSize;
    }
    /**
     * A customizable button component used to create buttons with different sizes, variants, and types.
     * The component supports a `<slot>` for injecting content within the button, similar to a native HTML button.
     */
    interface ModusWcButton {
        /**
          * The color variant of the button.
          * @default 'primary'
         */
        "color": | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'warning'
    | 'danger'
    | 'neutral';
        /**
          * Custom CSS class to apply to the button element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * If true, the button will be disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * If true, the button will take the full width of its container.
          * @default false
         */
        "fullWidth"?: boolean;
        /**
          * If true, the button will be in a pressed state (for toggle buttons).
          * @default false
         */
        "pressed"?: boolean;
        /**
          * The shape of the button.
          * @default 'rectangle'
         */
        "shape": 'circle' | 'ellipse' | 'rectangle' | 'square';
        /**
          * The size of the button.
          * @default 'md'
         */
        "size": DaisySize | 'xl';
        /**
          * The type of the button.
          * @default 'button'
         */
        "type": 'button' | 'submit' | 'reset';
        /**
          * The variant of the button.
          * @default 'filled'
         */
        "variant": 'borderless' | 'filled' | 'outlined';
    }
    /**
     * A customizable buttongroup component that groups multiple Modus buttons together.
     * The component supports a `<slot>` for injecting content within the buttongroup.
     */
    interface ModusWcButtonGroup {
        /**
          * Color to apply to all buttons within the button group
         */
        "color"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'warning'
    | 'danger'
    | 'neutral';
        /**
          * Disables all buttons within the button group
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Orientation of the button group: horizontal or vertical
          * @default 'horizontal'
         */
        "orientation"?: Orientation;
        /**
          * Selection type for button group
          * @default 'default'
         */
        "selectionType"?: 'default' | 'single' | 'multiple';
        /**
          * Style variant to apply to all buttons within the button group
          * @default 'outlined'
         */
        "variant": 'borderless' | 'filled' | 'outlined';
    }
    /**
     * A customizable card component used to group and display content in a way that is easily readable.
     * This component supports multiple `<slot>` elements including 'header' for images or custom content, 'title', 'subtitle', a default slot for main content, 'actions' for buttons or interactive elements, and 'footer'.
     */
    interface ModusWcCard {
        /**
          * Makes any \<figure> in the 'header' slot cover the background
          * @default false
         */
        "backgroundFigure"?: boolean;
        /**
          * Adds a hard border to the card
          * @default false
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply
          * @default ''
         */
        "customClass"?: string;
        /**
          * Determines how the card is laid out
          * @default 'vertical'
         */
        "layout"?: 'vertical' | 'horizontal';
        /**
          * Determines the interior padding size
          * @default 'compact'
         */
        "padding"?: 'compact' | 'comfortable';
    }
    /**
     * A customizable checkbox component
     */
    interface ModusWcCheckbox {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the checkbox.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * The indeterminate state of the checkbox.
          * @default false
         */
        "indeterminate": boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
          * @default ''
         */
        "name"?: string;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the checkbox.
          * @default false
         */
        "value": boolean;
    }
    /**
     * A customizable chip component used to display information in a compact area
     * The component supports a `<slot>` for injecting custom content such as avatar and icons.
     */
    interface ModusWcChip {
        /**
          * Active state of chip.
          * @default false
         */
        "active"?: boolean;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the chip is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Whether the chip has an error.
          * @default false
         */
        "hasError"?: boolean;
        /**
          * The label to display in the chip.
          * @default ''
         */
        "label"?: string;
        /**
          * Whether the chip height can grow and its content can wrap across multiple lines.
          * @default false
         */
        "multiline"?: boolean;
        /**
          * The shape of the chip: 'rectangle' (default) or 'circle'.
          * @default 'rectangle'
         */
        "shape"?: 'rectangle' | 'circle';
        /**
          * Whether to show the close icon on right side of the chip.
          * @default false
         */
        "showRemove"?: boolean;
        /**
          * The size of the chip.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The variant of the chip.
          * @default 'filled'
         */
        "variant"?: 'filled' | 'outline';
    }
    /**
     * A customizable collapse component used for showing and hiding content.
     * The component supports a 'header' and 'content' `<slot>` for injecting custom HTML.
     */
    interface ModusWcCollapse {
        /**
          * When true, renders a border-bottom on the collapse component.
          * @default false
         */
        "bordered"?: boolean;
        /**
          * Controls chevron placement.
          * @default 'right'
         */
        "chevronPosition"?: 'left' | 'right';
        /**
          * A unique identifier used to set the id attributes of various elements.
         */
        "collapseId"?: string;
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Controls whether the collapse is expanded or not.
          * @default false
         */
        "expanded"?: boolean;
        /**
          * Configuration options for rendering the pre-laid out collapse component. Do not set this prop if you intend to use the 'header' slot.
         */
        "options"?: ICollapseOptions;
    }
    /**
     * A customizable date picker component used to create date inputs.
     * Adheres to WCAG 2.2 standards.
     */
    interface ModusWcDate {
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the input.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The date format for display and input.
         */
        "format"?: | 'yyyy-mm-dd'
    | 'dd-mm-yyyy'
    | 'mm-dd-yyyy'
    | 'yyyy/mm/dd'
    | 'dd/mm/yyyy'
    | 'mm/dd/yyyy'
    | 'MMM DD, YYYY';
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Maximum date value. Must match the `format` prop pattern (or the locale-derived format when unset) or ISO 8601 (`YYYY-MM-DD`).
         */
        "max"?: string;
        /**
          * Minimum date value. Must match the `format` prop pattern (or the locale-derived format when unset) or ISO 8601 (`YYYY-MM-DD`).
         */
        "min"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required or must be checked for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * Displays ISO 8601 week numbers in the calendar. Week numbers are calculated with Monday as the first day of the week.
          * @default false
         */
        "showWeekNumbers"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the control.
          * @default ''
         */
        "value": string;
        /**
          * The first day of the week for the calendar display
          * @default 'sunday'
         */
        "weekStartDay"?: WeekStartDay;
    }
    /**
     * A customizable divider component used to separate content horizontally or vertically
     */
    interface ModusWcDivider {
        /**
          * The color of the divider line.
          * @default 'tertiary'
         */
        "color"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'high-contrast'
    | 'success'
    | 'warning'
    | 'danger';
        /**
          * The content to display in the divider.
          * @default ''
         */
        "content"?: string;
        /**
          * Custom CSS class to apply to the divider element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The orientation of the divider. This is in reference to how content will be rendered around the divider.
          * @default 'vertical'
         */
        "orientation"?: Orientation;
        /**
          * The position of the divider.
          * @default 'center'
         */
        "position"?: 'center' | 'end' | 'start';
        /**
          * Whether the divider is responsive or not.
          * @default true
         */
        "responsive"?: boolean;
    }
    /**
     * A customizable dropdown menu component used to render a button and toggleable menu.
     * The component supports a 'button' and 'menu' `<slot>` for injecting custom HTML content.
     */
    interface ModusWcDropdownMenu {
        /**
          * The aria-label for the dropdown button.
         */
        "buttonAriaLabel"?: string;
        /**
          * The color variant of the button.
          * @default 'primary'
         */
        "buttonColor"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'warning'
    | 'danger';
        /**
          * The shape of the button.
          * @default 'rectangle'
         */
        "buttonShape"?: 'circle' | 'ellipse' | 'rectangle' | 'square';
        /**
          * The size of the button.
          * @default 'md'
         */
        "buttonSize"?: DaisySize | 'xl';
        /**
          * The variant of the button.
          * @default 'filled'
         */
        "buttonVariant"?: 'borderless' | 'filled' | 'outlined';
        /**
          * Custom CSS class to apply to the host element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * If true, the button will be disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Indicates that the menu should have a border.
          * @default true
         */
        "menuBordered"?: boolean;
        /**
          * Distance between the button and menu in pixels.
          * @default 10
         */
        "menuOffset"?: number;
        /**
          * The placement of the menu relative to the button.
          * @default 'bottom-start'
         */
        "menuPlacement"?: PopoverPlacement;
        /**
          * The size of the menu.
          * @default 'md'
         */
        "menuSize"?: ModusSize;
        /**
          * The positioning strategy for the menu. Use 'fixed' when the dropdown is inside a clipping ancestor (e.g. overflow:hidden) so the menu escapes to the viewport coordinate space.
          * @default 'absolute'
         */
        "menuStrategy"?: 'absolute' | 'fixed';
        /**
          * Indicates that the menu is visible.
          * @default false
         */
        "menuVisible": boolean;
    }
    /**
     * File dropzone component that allows users to drag and drop files for upload.
     * The component supports a `<slot>` called 'dropzone' for adding custom content such as progress indicators or additional instructions within the dropzone area.
     */
    interface ModusWcFileDropzone {
        /**
          * Accepted file types (e.g. '.jpg,.png' or 'image/*')
         */
        "acceptFileTypes"?: string;
        /**
          * Custom CSS class to apply to the file dropzone element
          * @default ''
         */
        "customClass"?: string;
        /**
          * Disable the file input
         */
        "disabled"?: boolean;
        /**
          * External feedback to display info, success, or error state with optional custom icon and message
         */
        "feedback"?: IFileDropzoneFeedback;
        /**
          * Custom instructions shown when files are dragged over the dropzone
         */
        "fileDraggedOverInstructions"?: string;
        /**
          * Include state icon for default, validation, upload, and feedback states
          * @default true
         */
        "includeStateIcon"?: boolean;
        /**
          * Custom instructions shown as the default dropzone message
         */
        "instructions"?: string;
        /**
          * Custom error message displayed when an invalid file type is selected
         */
        "invalidFileTypeMessage"?: string;
        /**
          * Maximum number of files allowed, will show error if exceeded
         */
        "maxFileCount"?: number;
        /**
          * Maximum allowed length of filename, will show error if exceeded
         */
        "maxFileNameLength"?: number;
        /**
          * Maximum total file size in bytes allowed, will show error if exceeded
         */
        "maxTotalFileSizeBytes"?: number;
        /**
          * Allow multiple file selection
         */
        "multiple"?: boolean;
        /**
          * Reset the dropzone to its initial state, clearing all error and success states
         */
        "reset": () => Promise<void>;
        /**
          * Success message displayed when files are uploaded successfully
         */
        "successMessage"?: string;
    }
    /**
     * A draggable handle component for resizing adjacent elements
     */
    interface ModusWcHandle {
        /**
          * The color of the button.
          * @default 'tertiary'
         */
        "buttonColor"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'warning'
    | 'danger';
        /**
          * The size of the button.
          * @default 'md'
         */
        "buttonSize"?: DaisySize | 'xl';
        /**
          * The variant of the button.
          * @default 'filled'
         */
        "buttonVariant"?: 'borderless' | 'filled' | 'outlined';
        /**
          * Custom CSS class to apply to the handle element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The initial split percentage for the left/top panel (1-100). The right/bottom panel gets the remaining percentage.
          * @default 50
         */
        "defaultSplit"?: number;
        /**
          * The density/spacing of the handle container (compact: 8px, comfortable: 12px, relaxed: 16px).
          * @default 'comfortable'
         */
        "density"?: 'compact' | 'comfortable' | 'relaxed';
        /**
          * The left target element to resize (CSS selector or HTMLElement)
         */
        "leftTarget"?: string | HTMLElement;
        /**
          * The orientation of the handle.
          * @default 'horizontal'
         */
        "orientation"?: Orientation;
        /**
          * The right target element to resize (CSS selector or HTMLElement)
         */
        "rightTarget"?: string | HTMLElement;
        /**
          * The size of the handle.
          * @default 'default'
         */
        "size"?: 'default' | 'lg' | 'xl' | '2xl';
        /**
          * The type of handle to display.
          * @default 'bar'
         */
        "type"?: 'bar' | 'button';
    }
    /**
     * A customizable icon component used to render Modus icons.
     * <b>This component requires Modus icons to be installed in the host application. See [Modus Icon Usage](/docs/documentation-modus-icon-usage--docs) for steps.</b>
     */
    interface ModusWcIcon {
        /**
          * Custom CSS class to apply to the i element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Indicates that the icon is decorative. When true, sets aria-hidden to hide the icon from screen readers.
          * @default true
         */
        "decorative"?: boolean;
        /**
          * The icon name, should match the CSS class in the icon font.
         */
        "name": string;
        /**
          * The icon size, can be "sm", "md", "lg" (a custom size can be specified in CSS). This adjusts the font size for the icon.
          * @default 'md'
         */
        "size"?: DaisySize;
        /**
          * The icon variant, can be "outlined" or "solid".
         */
        "variant"?: 'outlined' | 'solid';
    }
    /**
     * A customizable feedback component used to provide additional context related to form input interactions.
     * <b>To use a custom icon, this component requires Modus icons to be installed in the host application. See [Modus Icon Usage](/docs/documentation-modus-icon-usage--docs) for steps.</b>
     */
    interface ModusWcInputFeedback {
        /**
          * Custom CSS class to apply to the outer div element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The Modus icon to use instead of the pre-defined icons.
          * @default ''
         */
        "icon"?: string;
        /**
          * The level informs which icon and color that will be rendered.
         */
        "level": IInputFeedbackLevel;
        /**
          * The message.
          * @default ''
         */
        "message"?: string;
        /**
          * The size of the feedback component.
          * @default 'md'
         */
        "size"?: ModusSize;
    }
    /**
     * A customizable input label component.
     * The component supports a `<slot>` for injecting additional custom content inside the label, such as icons or formatted text.
     */
    interface ModusWcInputLabel {
        /**
          * Additional classes for custom styling.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The `for` attribute of the label, matching the `id` of the associated input.
         */
        "forId"?: string;
        /**
          * The text to display within the label.
         */
        "labelText"?: string;
        /**
          * Whether the label indicates a required field.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the label.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The text rendered beneath the label.
         */
        "subLabelText"?: string;
    }
    /**
     * A customizable link component used to navigate to URLs.
     */
    interface ModusWcLink {
        /**
          * The color of the link.
          * @default 'primary'
         */
        "color": | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'inherit'
    | 'success'
    | 'info'
    | 'warning'
    | 'danger';
        /**
          * Custom CSS class to apply to the link element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The URL to navigate to when the link is activated.
         */
        "href"?: string;
        /**
          * The relationship attribute for the link.
         */
        "rel"?: string;
        /**
          * The browsing context for the link.
         */
        "target"?: string;
        /**
          * The underline behavior of the link.
          * @default 'always'
         */
        "underline": 'always' | 'hover' | 'none';
    }
    /**
     * A customizable loader component used to indicate the loading of content
     */
    interface ModusWcLoader {
        /**
          * The color of the loader.
          * @default 'primary'
         */
        "color": LoaderColor;
        /**
          * Custom CSS class to apply to the loader element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The size of the loader.
          * @default 'md'
         */
        "size": DaisySize;
        /**
          * The variant of the loader.
          * @default 'spinner'
         */
        "variant": LoaderVariant;
    }
    /**
     * A component for displaying Trimble product logos with support for both fixed and scalable sizing.
     * Provides consistent branding across applications with various product logo options.
     * Logo colors automatically adapt to the active Modus theme via CSS variables.
     */
    interface ModusWcLogo {
        /**
          * The alt text for accessibility. If not provided, defaults to the logo name.
         */
        "alt"?: string;
        /**
          * Custom CSS class to apply to the logo container.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Show emblem version (icon only) instead of full logo
          * @default false
         */
        "emblem"?: boolean;
        /**
          * The name of the logo to display. Accepts values like 'trimble', 'viewpoint_field_view', etc.
         */
        "name": LogoName;
    }
    /**
     * A customizable menu component used to display a list of li elements vertically or horizontally.
     * The component supports a `<slot>` for injecting custom li elements inside the ul element.
     */
    interface ModusWcMenu {
        /**
          * Indicates that the menu should have a border.
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the ul element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Indicates that this menu is a submenu (dropdown).
         */
        "isSubMenu"?: boolean;
        /**
          * The orientation of the menu.
          * @default 'vertical'
         */
        "orientation"?: Orientation;
        /**
          * The selection mode of the menu.
          * @default 'single'
         */
        "selectionMode"?: SelectionMode;
        /**
          * The size of the menu.
          * @default 'md'
         */
        "size"?: ModusSize;
    }
    /**
     * A customizable menu item component used to display the item portion of a menu.
     * This component supports a 'start-icon' `<slot>` that allows for custom icons to be placed at the beginning of the item.
     */
    interface ModusWcMenuItem {
        "bordered"?: boolean;
        /**
          * If true, renders a checkbox at the start of the menu item.
         */
        "checkbox"?: boolean;
        /**
          * Public method to collapse the submenu if it's expanded
         */
        "collapseSubmenu": () => Promise<void>;
        /**
          * Custom CSS class to apply to the li element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the menu item.
         */
        "disabled"?: boolean;
        /**
          * The focused state of the menu item.
         */
        "focused"?: boolean;
        /**
          * Whether this menu item has a collapsible submenu. When true, the item will show a caret and handle toggle behavior.
         */
        "hasSubmenu"?: boolean;
        /**
          * The text rendered in the menu item.
          * @default ''
         */
        "label": string;
        /**
          * The selected state of the menu item.
         */
        "selected"?: boolean;
        /**
          * The size of the menu item.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The text rendered beneath the label.
         */
        "subLabel"?: string;
        /**
          * The tooltip text to display when hovering over the menu item.
         */
        "tooltipContent"?: string;
        /**
          * The position of the tooltip relative to the menu item.
          * @default 'auto'
         */
        "tooltipPosition"?: 'auto' | 'top' | 'right' | 'bottom' | 'left';
        /**
          * The unique identifying value of the menu item.
          * @default ''
         */
        "value": string;
    }
    /**
     * A customizable modal component used to display content in a dialog.
     * This component supports 'header', 'content', and 'footer' `<slot>` elements for inserting custom HTML.
     */
    interface ModusWcModal {
        /**
          * The modal's backdrop. Specify 'static' for a backdrop that doesn't close the modal when clicked outside the modal content.
          * @default 'default'
         */
        "backdrop"?: 'default' | 'static';
        /**
          * Custom CSS class to apply
          * @default ''
         */
        "customClass"?: string;
        /**
          * Specifies whether the modal should be displayed full-screen
          * @default false
         */
        "fullscreen"?: boolean;
        /**
          * The ID of the inner dialog element
         */
        "modalId": string;
        /**
          * Specifies the position of the modal
          * @default 'center'
         */
        "position"?: 'bottom' | 'center' | 'top';
        /**
          * Specifies whether to show the close icon button at the top right of modal
          * @default true
         */
        "showClose"?: boolean;
        /**
          * Specifies whether to show the fullscreen toggle icon button
          * @default false
         */
        "showFullscreenToggle"?: boolean;
    }
    /**
     * A customizable navbar component used for top level navigation of all Trimble applications.
     */
    interface ModusWcNavbar {
        /**
          * The open state of the apps menu.
          * @default false
         */
        "appsMenuOpen"?: boolean;
        /**
          * Applies condensed layout and styling.
          * @default false
         */
        "condensed"?: boolean;
        /**
          * The open state of the condensed menu.
          * @default false
         */
        "condensedMenuOpen"?: boolean;
        /**
          * Custom CSS class to apply to the host element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The name of the logo to display. Supports any valid 'logo-name' from the 'modus-wc-logo' component. Defaults to 'trimble'.
          * @default 'trimble'
         */
        "logoName"?: LogoName;
        /**
          * The open state of the main menu.
          * @default false
         */
        "mainMenuOpen"?: boolean;
        /**
          * The open state of the notifications menu.
          * @default false
         */
        "notificationsMenuOpen"?: boolean;
        /**
          * Debounce time in milliseconds for search input changes. Default is 300ms.
          * @default 300
         */
        "searchDebounceMs"?: number;
        /**
          * The open state of the search input.
          * @default false
         */
        "searchInputOpen"?: boolean;
        /**
          * Text replacements for the navbar.
         */
        "textOverrides"?: INavbarTextOverrides;
        /**
          * User information used to render the user card.
         */
        "userCard": INavbarUserCard;
        /**
          * The open state of the user menu.
          * @default false
         */
        "userMenuOpen"?: boolean;
        /**
          * The visibility of individual navbar buttons. Default is user profile visible, others hidden.
          * @default {     ai: false,     apps: false,     help: false,     logo: true,     mainMenu: false,     notifications: false,     search: false,     searchInput: false,     user: true,   }
         */
        "visibility"?: INavbarVisibility;
    }
    /**
     * A customizable input component used to create number inputs with types
     */
    interface ModusWcNumberInput {
        /**
          * Hint for form autofill feature.
         */
        "autoComplete"?: 'on' | 'off';
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * The currency symbol to display.
          * @default ''
         */
        "currencySymbol"?: string;
        /**
          * Custom CSS class to apply to the input.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * The input's maximum value.
         */
        "max"?: number;
        /**
          * The input's minimum value.
         */
        "min"?: number;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Text that appears in the form control when it has no value set.
          * @default ''
         */
        "placeholder"?: string;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The granularity that the value adheres to.
         */
        "step"?: number;
        /**
          * Type of form control.
          * @default 'number'
         */
        "type"?: 'number' | 'range';
        /**
          * The value of the control.
          * @default ''
         */
        "value": string;
    }
    /**
     * Pagination component to navigate through pages of content
     */
    interface ModusWcPagination {
        /**
          * Aria label values for pagination buttons
         */
        "ariaLabelValues"?: IAriaLabelValues;
        /**
          * Total number of pages
          * @default 1
         */
        "count": number;
        /**
          * Custom CSS class to apply
          * @default ''
         */
        "customClass"?: string;
        /**
          * The next page button text. If not set, an icon control will be used.
         */
        "nextButtonText"?: string;
        /**
          * The current page number
          * @default 1
         */
        "page": number;
        /**
          * The previous page button text. If not set, an icon control will be used.
         */
        "prevButtonText"?: string;
        /**
          * Size of the pagination buttons
          * @default 'md'
         */
        "size": ModusSize;
    }
    /**
     * A customizable panel component used to organize content in a structured layout.
     * This component provides 'header', 'body', and 'footer' `<slot>` elements for inserting custom HTML.
     */
    interface ModusWcPanel {
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Enable floating mode with elevated shadow.
          * @default false
         */
        "floating"?: boolean;
        /**
          * Height of the panel in pixels.
          * @default '700px'
         */
        "height"?: string;
        /**
          * Width of the panel in pixels.
          * @default '350px'
         */
        "width"?: string;
    }
    interface ModusWcProfileMenu {
        /**
          * Configuration for the first menu including title and items
         */
        "menuOne"?: ISubMenu;
        /**
          * Configuration for the second menu including title and items
         */
        "menuTwo"?: ISubMenu;
        /**
          * Profile menu properties containing user information
         */
        "profileProps": IProfileMenuProps;
    }
    /**
     * A customizable progress component used to show the progress of a task or show the passing of time.
     * The radial variant supports slotting in custom HTML to be displayed within the progress circle.
     */
    interface ModusWcProgress {
        /**
          * Custom CSS class to apply to the progress element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The indeterminate state of the progress component.
          * @default false
         */
        "indeterminate": boolean;
        /**
          * A text label to render within the progress bar
         */
        "label"?: string;
        /**
          * The progress component's maximum value.
          * @default 100
         */
        "max"?: number;
        /**
          * The value of the progress component.
          * @default 0
         */
        "value": number;
        /**
          * The variant of the progress component.
          * @default 'default'
         */
        "variant"?: 'default' | 'radial';
    }
    /**
     * A customizable radio button component.
     */
    interface ModusWcRadio {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the radio.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
          * @default ''
         */
        "name"?: string;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the radio.
          * @default false
         */
        "value": boolean;
    }
    /**
     * A rating component that allows users to choose a rating from predefined options
     */
    interface ModusWcRating {
        /**
          * Whether to allow half-ratings. Only applies to star and heart variants.
          * @default false
         */
        "allowHalf"?: boolean;
        /**
          * The number of rating items to display
          * @default 5
         */
        "count": number;
        /**
          * Custom CSS class to apply
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the rating component is disabled
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Function to provide aria-label text for a given rating-item index
          * @default (ratingValue) =>     `Rating item ${ratingValue}`
         */
        "getAriaLabelText"?: (ratingValue: number) => string;
        /**
          * The size of the rating component
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The current value of the rating
          * @default 0
         */
        "value": number;
        /**
          * The variant of the rating scale
          * @default 'smiley'
         */
        "variant": ModusWcRatingVariant;
    }
    /**
     * A customizable select component used to pick a value from a list of options
     */
    interface ModusWcSelect {
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * The options to display in the select dropdown.
          * @default []
         */
        "options": ISelectOption[];
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the control.
          * @default ''
         */
        "value": string;
    }
    /**
     * A customizable side navigation component for organizing primary navigation and content areas in an application.
     * The component supports a `<slot>` for injecting custom content inside the side navigation panel.
     */
    interface ModusWcSideNavigation {
        /**
          * Whether the side navigation should collapse when clicking outside of it.
          * @default true
         */
        "collapseOnClickOutside": boolean;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the side navigation is expanded.
          * @default false
         */
        "expanded": boolean;
        /**
          * Maximum width of the side navigation panel in an expanded state.
          * @default '256px'
         */
        "maxWidth": string;
        /**
          * Mode to make side navigation either overlay or push the content for the selector specified in targetContent
          * @default 'overlay'
         */
        "mode": 'overlay' | 'push';
        /**
          * (optional) Specify the selector for the page's content for which paddings and margins will be set by side navigation based on the mode.
          * @default ''
         */
        "targetContent": string;
    }
    /**
     * A customizable skeleton component used to create skeletons of various sizes and shapes
     */
    interface ModusWcSkeleton {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The height of the skeleton.
          * @default 'var(--modus-wc-line-height-md)'
         */
        "height": string;
        /**
          * The shape of the skeleton.
          * @default 'rectangle'
         */
        "shape"?: 'circle' | 'rectangle';
        /**
          * The width of the skeleton.
          * @default '100%'
         */
        "width": string;
    }
    /**
     * A customizable slider component
     */
    interface ModusWcSlider {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the slider.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * The maximum slider value.
         */
        "max"?: number;
        /**
          * The minimum slider value.
         */
        "min"?: number;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
          * @default ''
         */
        "name"?: string;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The increment of the slider.
         */
        "step"?: number;
        /**
          * The value of the slider.
          * @default 0
         */
        "value": number;
    }
    /**
     * Used to show a list of steps in a process.
     */
    interface ModusWcStepper {
        /**
          * Custom CSS class to apply to the steps element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * If true, steps will be rendered as buttons and emit `stepClick` when activated.
          * @default false
         */
        "interactive"?: boolean;
        /**
          * The orientation of the steps.
         */
        "orientation"?: Orientation;
        /**
          * The steps to display.
          * @default []
         */
        "steps": IStepperItem[];
    }
    /**
     * A customizable switch component
     */
    interface ModusWcSwitch {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the switch.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * The indeterminate state of the switch.
          * @default false
         */
        "indeterminate": boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
          * @default ''
         */
        "name"?: string;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize | 'xs';
        /**
          * The value of the switch.
          * @default false
         */
        "value": boolean;
    }
    interface ModusWcTable {
        /**
          * Accessibility caption for the table (visually hidden but available to screen readers).
         */
        "caption"?: string;
        /**
          * An array of column definitions.
         */
        "columns": ITableColumn[];
        /**
          * The current page number in pagination (1-based index).
          * @default 1
         */
        "currentPage": number;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * An array of data objects.
         */
        "data": Record<string, unknown>[];
        /**
          * The density of the table, used to save space or increase readability.
          * @default 'comfortable'
         */
        "density"?: Density;
        /**
          * Enable cell editing. Either a boolean (all rows) or a predicate per row.
          * @default false
         */
        "editable"?: boolean | ((row: Record<string, unknown>) => boolean);
        /**
          * Enable hover effect on table rows.
          * @default true
         */
        "hover"?: boolean;
        /**
          * Per-row predicate function controlling row selection eligibility.
         */
        "isRowSelectable"?: (row: Record<string, unknown>) => boolean;
        /**
          * Available options for the number of rows per page.
          * @default [5, 10, 15]
         */
        "pageSizeOptions": number[];
        /**
          * Enable pagination for the table.
          * @default false
         */
        "paginated"?: boolean;
        /**
          * Row selection mode: 'none' for no selection, 'single' for single row, 'multi' for multiple rows.
          * @default 'none'
         */
        "selectable"?: 'none' | 'single' | 'multi';
        /**
          * Array of selected row IDs. Used for controlled selection state.
         */
        "selectedRowIds"?: string[];
        /**
          * Show/hide the page size selector in pagination.
          * @default true
         */
        "showPageSizeSelector"?: boolean;
        /**
          * Enable sorting functionality for sortable columns.
          * @default true
         */
        "sortable"?: boolean;
        /**
          * Zebra striped tables differentiate rows by styling them in an alternating fashion.
          * @default false
         */
        "zebra"?: boolean;
    }
    /**
     * A customizable tabs component used to create groups of tabs.
     * The component supports a `<slot>` for injecting custom tab content.
     */
    interface ModusWcTabs {
        /**
          * The current active tab
          * @default 0
         */
        "activeTabIndex": number;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The size of the tabs.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * Additional styling for the tabs.
          * @default 'bordered'
         */
        "tabStyle"?: 'boxed' | 'bordered' | 'lifted' | 'none';
        /**
          * The tabs to display.
          * @default []
         */
        "tabs": ITab[];
    }
    /**
     * A customizable input component used to create text inputs with types.
     * The component supports a `<slot>` for injecting additional custom content inside the input, such as icons or formatted text.
     */
    interface ModusWcTextInput {
        /**
          * Controls automatic capitalization in inputted text.
         */
        "autoCapitalize"?: | 'off'
    | 'none'
    | 'on'
    | 'sentences'
    | 'words'
    | 'characters';
        /**
          * Hint for form autofill feature.
         */
        "autoComplete"?: AutocompleteTypes;
        /**
          * Controls automatic correction in inputted text. Support by browser varies.
         */
        "autoCorrect"?: 'on' | 'off';
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Aria label for the clear icon button.
          * @default 'Clear text'
         */
        "clearAriaLabel"?: string;
        /**
          * Custom CSS class to apply to the input.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * A hint to the browser for which enter key to display.
         */
        "enterkeyhint"?: | 'enter'
    | 'done'
    | 'go'
    | 'next'
    | 'previous'
    | 'search'
    | 'send';
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * Show the clear button within the input field.
          * @default false
         */
        "includeClear"?: boolean;
        /**
          * Show the search icon within the input field.
          * @default false
         */
        "includeSearch"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Maximum length (number of characters) of value.
         */
        "maxLength"?: number;
        /**
          * Minimum length (number of characters) of value.
         */
        "minLength"?: number;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Pattern the value must match to be valid
         */
        "pattern"?: string;
        /**
          * Text that appears in the form control when it has no value set.
          * @default ''
         */
        "placeholder"?: string;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * Type of form control.
          * @default 'text'
         */
        "type"?: TextFieldTypes;
        /**
          * The value of the control.
          * @default ''
         */
        "value": string;
    }
    /**
     * A customizable textarea component.
     */
    interface ModusWcTextarea {
        /**
          * Controls automatic correction in inputted text. Support by browser varies.
         */
        "autoCorrect"?: 'on' | 'off';
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the textarea (supports DaisyUI).
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the textarea.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * A hint to the browser for which enter key to display.
         */
        "enterkeyhint"?: | 'enter'
    | 'done'
    | 'go'
    | 'next'
    | 'previous'
    | 'search'
    | 'send';
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * The maximum number of characters allowed in the textarea.
         */
        "maxLength"?: number;
        /**
          * The minimum number of characters required in the textarea.
         */
        "minLength"?: number;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * The placeholder text for the textarea.
          * @default ''
         */
        "placeholder"?: string;
        /**
          * The readonly state of the textarea.
          * @default false
         */
        "readonly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The number of visible text lines for the textarea.
         */
        "rows"?: number;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the textarea.
          * @default ''
         */
        "value": string;
    }
    interface ModusWcThemeProvider {
        "initialTheme"?: Partial<IThemeConfig>;
    }
    /**
     * A theme switcher component used to toggle the application theme and/or mode.
     * Allows consumers to set the initial theme (Modus Classic, Modus Modern, etc.) and end-users to toggle modes (Light, Dark).
     */
    interface ModusWcThemeSwitcher {
        /**
          * Custom CSS class to apply to the theme switcher element.
          * @default ''
         */
        "customClass"?: string;
    }
    /**
     * A customizable input component used to create time inputs.
     */
    interface ModusWcTimeInput {
        /**
          * Hint for form autofill feature.
         */
        "autoComplete"?: 'on' | 'off';
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the input.
          * @default ''
         */
        "customClass"?: string;
        /**
          * ID of a `<datalist>` element that contains pre-defined time options. The value must be the ID of a `<datalist>` element in the same document.
         */
        "datalistId"?: string;
        /**
          * The options to display in the time input dropdown. Options must be in `HH:mm` or `HH:mm:ss` format.
          * @default []
         */
        "datalistOptions": string[];
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Maximum value. Format: `HH:mm`, `HH:mm:ss`.
         */
        "max"?: string;
        /**
          * Minimum value. Format: `HH:mm`, `HH:mm:ss.`
         */
        "min"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * Displays the time input format as `HH:mm:ss` if `true`. Internally sets the `step` to 1 second. If a `step` value is provided, it will override this attribute.
          * @default false
         */
        "showSeconds"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * Specifies the granularity that the `value` must adhere to. Value of step given in seconds. Default value is 60 seconds. Overrides the `seconds` attribute if both are provided.
         */
        "step"?: number;
        /**
          * The value of the time input. Always in 24-hour format that includes leading zeros: `HH:mm` or `HH:mm:ss`, regardless of input format which is likely to be selected based on user's locale (or by the user agent). If time includes seconds the format is always `HH:mm:ss`.
          * @default ''
         */
        "value": string;
    }
    /**
     * A customizable toast component used to stack elements, positioned on the corner of a page.
     * The component supports a `<slot>` for injecting additional custom content inside the toast.
     */
    interface ModusWcToast {
        /**
          * Additional classes for custom styling.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Time taken to dismiss the toast in milliseconds
         */
        "delay"?: number;
        /**
          * The position of the toast in the parent container.
          * @default 'top-end'
         */
        "position"?: ToastPosition;
    }
    /**
     * A customizable toolbar component used to organize content across the entire page.
     * This component provides 'start', 'center', and 'end' `<slot>` elements for inserting custom HTML.
     */
    interface ModusWcToolbar {
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
    }
    /**
     * A customizable tooltip component used to create tooltips with different content.
     * The tooltip can be dismissed by pressing the Escape key when hovering over it.
     * When forceOpen is enabled, the tooltip will remain open and can only be closed by setting forceOpen to false.
     * Use the contentElement prop to supply rich HTML content to the tooltip such as multiline text.
     * For plain dynamic text, prefer the content prop instead. When contentElement is set, it takes precedence over the content prop.
     */
    interface ModusWcTooltip {
        /**
          * The text content of the tooltip. When contentElement is also set, contentElement takes precedence.
          * @default ''
         */
        "content": string;
        /**
          * An optional rich HTML element to render as the tooltip body. When set, this takes precedence over the `content` string prop. The element is deep-cloned into the tooltip container.
         */
        "contentElement"?: HTMLElement;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Disables displaying the tooltip on hover
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Use this attribute to force the tooltip to remain open.
         */
        "forceOpen"?: boolean;
        /**
          * The position that the tooltip will render in relation to the element.
          * @default 'auto'
         */
        "position"?: 'auto' | 'top' | 'right' | 'bottom' | 'left';
        /**
          * The ID of the tooltip element, useful for setting the "aria-describedby" attribute of related elements.
         */
        "tooltipId"?: string;
    }
    /**
     * A customizable tree item component used to display the item portion of a tree menu.
     * This component supports `start` and `end` slots for custom content at the beginning and end of the item.
     */
    interface ModusWcTreeItem {
        /**
          * When true, prevents the built-in inline submenu toggle on click. The item will only emit `itemSelect` so the consumer can handle the expansion externally (e.g. show a flyout panel). Only has an effect when `hasSubmenu` is also true.
         */
        "blockExpand"?: boolean;
        "bordered"?: boolean;
        /**
          * If true, renders a checkbox at the start of the tree item.
         */
        "checkbox"?: boolean;
        /**
          * Public method to collapse the submenu if it's expanded
         */
        "collapseSubmenu": () => Promise<void>;
        /**
          * Custom CSS class to apply to the li element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the tree item.
         */
        "disabled"?: boolean;
        /**
          * The focused state of the tree item.
         */
        "focused"?: boolean;
        /**
          * Whether this tree item has a collapsible submenu. When true, the item will show a caret and handle toggle behavior.
         */
        "hasSubmenu"?: boolean;
        /**
          * The text rendered in the tree item.
          * @default ''
         */
        "label": string;
        /**
          * The selected state of the tree item.
         */
        "selected"?: boolean;
        /**
          * The size of the tree item.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The text rendered beneath the label.
         */
        "subLabel"?: string;
        /**
          * The tooltip text to display when hovering over the tree item.
         */
        "tooltipContent"?: string;
        /**
          * The position of the tooltip relative to the tree item.
          * @default 'auto'
         */
        "tooltipPosition"?: 'auto' | 'top' | 'right' | 'bottom' | 'left';
        /**
          * The unique identifying value of the tree item.
          * @default ''
         */
        "value": string;
    }
    /**
     * A customizable tree menu component used to display a list of modus-wc-tree-item elements vertically or horizontally.
     * The component supports a `<slot>` for injecting custom modus-wc-tree-item elements inside the ul element.
     */
    interface ModusWcTreeMenu {
        /**
          * Indicates that the tree menu should have a border.
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the ul element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Indicates that this tree menu is a submenu (dropdown).
         */
        "isSubMenu"?: boolean;
        /**
          * The orientation of the tree menu.
          * @default 'vertical'
         */
        "orientation"?: Orientation;
        /**
          * The selection mode of the tree menu.
          * @default 'single'
         */
        "selectionMode"?: SelectionMode;
        /**
          * The size of the tree menu.
          * @default 'md'
         */
        "size"?: ModusSize;
    }
    /**
     * A customizable typography component used to render text with different sizes, hierarchy, and weights.
     * Note:
     * - When using heading elements (h1-h6), the default heading CSS styling can be accessed without modifying
     * the default size (size="md") and weight (weight="normal") properties. Default styling can be overridden by
     * providing your own custom values for the size or weight properties from the available options.
     * - If both slot content and `label` are provided, only the slot content will be rendered
     * - Use the `label` prop when you need to dynamically update the text.
     */
    interface ModusWcTypography {
        /**
          * Custom CSS class to apply to the typography element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The hierarchy of the typography component.
          * @default 'p'
         */
        "hierarchy": TypographyHierarchy;
        /**
          * The text label to display.
         */
        "label": string;
        /**
          * The size of the font.
          * @default 'md'
         */
        "size"?: TypographySize;
        /**
          * The weight of the text.
          * @default 'normal'
         */
        "weight"?: TypographyWeight;
    }
    interface ModusWcUtilityPanel {
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The panel is expanded or closed
          * @default false
         */
        "expanded": boolean;
        /**
          * Determines if the panel pushes content or displays an overlay.
          * @default false
         */
        "pushContent": boolean;
        /**
          * Target element reference to push content when panel opens
         */
        "targetElement"?: HTMLElement;
    }
}
export interface ModusWcAccordionCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcAccordionElement;
}
export interface ModusWcAlertCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcAlertElement;
}
export interface ModusWcAppMenuCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcAppMenuElement;
}
export interface ModusWcAutocompleteCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcAutocompleteElement;
}
export interface ModusWcAvatarCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcAvatarElement;
}
export interface ModusWcBottomSheetCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcBottomSheetElement;
}
export interface ModusWcBreadcrumbsCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcBreadcrumbsElement;
}
export interface ModusWcButtonCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcButtonElement;
}
export interface ModusWcButtonGroupCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcButtonGroupElement;
}
export interface ModusWcCheckboxCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcCheckboxElement;
}
export interface ModusWcChipCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcChipElement;
}
export interface ModusWcCollapseCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcCollapseElement;
}
export interface ModusWcDateCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcDateElement;
}
export interface ModusWcDropdownMenuCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcDropdownMenuElement;
}
export interface ModusWcFileDropzoneCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcFileDropzoneElement;
}
export interface ModusWcMenuCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcMenuElement;
}
export interface ModusWcMenuItemCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcMenuItemElement;
}
export interface ModusWcNavbarCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcNavbarElement;
}
export interface ModusWcNumberInputCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcNumberInputElement;
}
export interface ModusWcPaginationCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcPaginationElement;
}
export interface ModusWcProfileMenuCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcProfileMenuElement;
}
export interface ModusWcRadioCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcRadioElement;
}
export interface ModusWcRatingCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcRatingElement;
}
export interface ModusWcSelectCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcSelectElement;
}
export interface ModusWcSideNavigationCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcSideNavigationElement;
}
export interface ModusWcSliderCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcSliderElement;
}
export interface ModusWcStepperCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcStepperElement;
}
export interface ModusWcSwitchCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcSwitchElement;
}
export interface ModusWcTableCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcTableElement;
}
export interface ModusWcTabsCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcTabsElement;
}
export interface ModusWcTextInputCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcTextInputElement;
}
export interface ModusWcTextareaCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcTextareaElement;
}
export interface ModusWcThemeSwitcherCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcThemeSwitcherElement;
}
export interface ModusWcTimeInputCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcTimeInputElement;
}
export interface ModusWcTooltipCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcTooltipElement;
}
export interface ModusWcTreeItemCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcTreeItemElement;
}
export interface ModusWcTreeMenuCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcTreeMenuElement;
}
export interface ModusWcUtilityPanelCustomEvent<T> extends CustomEvent<T> {
    detail: T;
    target: HTMLModusWcUtilityPanelElement;
}
declare global {
    interface HTMLModusWcAccordionElementEventMap {
        "expandedChange": {
    expanded: boolean;
    index: number;
  };
    }
    /**
     * A customizable accordion component used for showing and hiding related groups of content.
     * The component supports a `<slot>` called 'content' for injecting `<modus-wc-collapse>` elements. See [Collapse](/docs/components-collapse--docs) docs for additional info.
     */
    interface HTMLModusWcAccordionElement extends Components.ModusWcAccordion, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcAccordionElementEventMap>(type: K, listener: (this: HTMLModusWcAccordionElement, ev: ModusWcAccordionCustomEvent<HTMLModusWcAccordionElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcAccordionElementEventMap>(type: K, listener: (this: HTMLModusWcAccordionElement, ev: ModusWcAccordionCustomEvent<HTMLModusWcAccordionElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcAccordionElement: {
        prototype: HTMLModusWcAccordionElement;
        new (): HTMLModusWcAccordionElement;
    };
    interface HTMLModusWcAlertElementEventMap {
        "dismissClick": any;
    }
    /**
     * A customizable alert component used to inform the user about important events.
     * The component supports `<slot>` elements for injecting custom content and buttons.
     */
    interface HTMLModusWcAlertElement extends Components.ModusWcAlert, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcAlertElementEventMap>(type: K, listener: (this: HTMLModusWcAlertElement, ev: ModusWcAlertCustomEvent<HTMLModusWcAlertElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcAlertElementEventMap>(type: K, listener: (this: HTMLModusWcAlertElement, ev: ModusWcAlertCustomEvent<HTMLModusWcAlertElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcAlertElement: {
        prototype: HTMLModusWcAlertElement;
        new (): HTMLModusWcAlertElement;
    };
    interface HTMLModusWcAppMenuElementEventMap {
        "layoutChange": {
    layout: 'list' | 'grid';
  };
        "itemsOrderChange": IAppMenuItem[];
        "itemClick": { appName: AppName };
    }
    interface HTMLModusWcAppMenuElement extends Components.ModusWcAppMenu, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcAppMenuElementEventMap>(type: K, listener: (this: HTMLModusWcAppMenuElement, ev: ModusWcAppMenuCustomEvent<HTMLModusWcAppMenuElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcAppMenuElementEventMap>(type: K, listener: (this: HTMLModusWcAppMenuElement, ev: ModusWcAppMenuCustomEvent<HTMLModusWcAppMenuElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcAppMenuElement: {
        prototype: HTMLModusWcAppMenuElement;
        new (): HTMLModusWcAppMenuElement;
    };
    interface HTMLModusWcAutocompleteElementEventMap {
        "chipRemove": IAutocompleteItem;
        "chipsExpansionChange": { expanded: boolean };
        "clearClick": void;
        "inputBlur": FocusEvent;
        "inputChange": Event;
        "inputFocus": FocusEvent;
        "itemSelect": IAutocompleteItem;
    }
    /**
     * A customizable autocomplete component used to create searchable text inputs.
     * The component supports a `<slot>` for injecting custom content.
     */
    interface HTMLModusWcAutocompleteElement extends Components.ModusWcAutocomplete, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcAutocompleteElementEventMap>(type: K, listener: (this: HTMLModusWcAutocompleteElement, ev: ModusWcAutocompleteCustomEvent<HTMLModusWcAutocompleteElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcAutocompleteElementEventMap>(type: K, listener: (this: HTMLModusWcAutocompleteElement, ev: ModusWcAutocompleteCustomEvent<HTMLModusWcAutocompleteElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcAutocompleteElement: {
        prototype: HTMLModusWcAutocompleteElement;
        new (): HTMLModusWcAutocompleteElement;
    };
    interface HTMLModusWcAvatarElementEventMap {
        "imageLoadError": IAvatarImageLoadError;
    }
    /**
     * A customizable avatar component used to create avatars with different images or user initials.
     * When no image is provided, the component can display initials (up to 3 characters) from the initials prop.
     * The component will extract the first letter of each word in the initials string.
     */
    interface HTMLModusWcAvatarElement extends Components.ModusWcAvatar, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcAvatarElementEventMap>(type: K, listener: (this: HTMLModusWcAvatarElement, ev: ModusWcAvatarCustomEvent<HTMLModusWcAvatarElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcAvatarElementEventMap>(type: K, listener: (this: HTMLModusWcAvatarElement, ev: ModusWcAvatarCustomEvent<HTMLModusWcAvatarElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcAvatarElement: {
        prototype: HTMLModusWcAvatarElement;
        new (): HTMLModusWcAvatarElement;
    };
    /**
     * A customizable badge component used to create badges with different sizes, types, and colors.
     * The component supports a `<slot>` for injecting content within the badge.
     */
    interface HTMLModusWcBadgeElement extends Components.ModusWcBadge, HTMLStencilElement {
    }
    var HTMLModusWcBadgeElement: {
        prototype: HTMLModusWcBadgeElement;
        new (): HTMLModusWcBadgeElement;
    };
    interface HTMLModusWcBottomSheetElementEventMap {
        "sheetVisibilityChange": { visible: boolean };
        "displayModeChange": {
    displayMode: TBottomSheetDisplayMode;
  };
        "headerBackClick": void;
        "headerCloseClick": void;
    }
    interface HTMLModusWcBottomSheetElement extends Components.ModusWcBottomSheet, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcBottomSheetElementEventMap>(type: K, listener: (this: HTMLModusWcBottomSheetElement, ev: ModusWcBottomSheetCustomEvent<HTMLModusWcBottomSheetElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcBottomSheetElementEventMap>(type: K, listener: (this: HTMLModusWcBottomSheetElement, ev: ModusWcBottomSheetCustomEvent<HTMLModusWcBottomSheetElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcBottomSheetElement: {
        prototype: HTMLModusWcBottomSheetElement;
        new (): HTMLModusWcBottomSheetElement;
    };
    interface HTMLModusWcBreadcrumbsElementEventMap {
        "breadcrumbClick": IBreadcrumb;
    }
    /**
     * A customizable breadcrumbs component used to help users navigate through a website.
     */
    interface HTMLModusWcBreadcrumbsElement extends Components.ModusWcBreadcrumbs, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcBreadcrumbsElementEventMap>(type: K, listener: (this: HTMLModusWcBreadcrumbsElement, ev: ModusWcBreadcrumbsCustomEvent<HTMLModusWcBreadcrumbsElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcBreadcrumbsElementEventMap>(type: K, listener: (this: HTMLModusWcBreadcrumbsElement, ev: ModusWcBreadcrumbsCustomEvent<HTMLModusWcBreadcrumbsElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcBreadcrumbsElement: {
        prototype: HTMLModusWcBreadcrumbsElement;
        new (): HTMLModusWcBreadcrumbsElement;
    };
    interface HTMLModusWcButtonElementEventMap {
        "buttonClick": MouseEvent | KeyboardEvent;
    }
    /**
     * A customizable button component used to create buttons with different sizes, variants, and types.
     * The component supports a `<slot>` for injecting content within the button, similar to a native HTML button.
     */
    interface HTMLModusWcButtonElement extends Components.ModusWcButton, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcButtonElementEventMap>(type: K, listener: (this: HTMLModusWcButtonElement, ev: ModusWcButtonCustomEvent<HTMLModusWcButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcButtonElementEventMap>(type: K, listener: (this: HTMLModusWcButtonElement, ev: ModusWcButtonCustomEvent<HTMLModusWcButtonElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcButtonElement: {
        prototype: HTMLModusWcButtonElement;
        new (): HTMLModusWcButtonElement;
    };
    interface HTMLModusWcButtonGroupElementEventMap {
        "buttonGroupClick": {
    button: HTMLElement;
    isSelected: boolean;
  };
        "buttonSelectionChange": {
    selectedButtons: HTMLElement[];
  };
    }
    /**
     * A customizable buttongroup component that groups multiple Modus buttons together.
     * The component supports a `<slot>` for injecting content within the buttongroup.
     */
    interface HTMLModusWcButtonGroupElement extends Components.ModusWcButtonGroup, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcButtonGroupElementEventMap>(type: K, listener: (this: HTMLModusWcButtonGroupElement, ev: ModusWcButtonGroupCustomEvent<HTMLModusWcButtonGroupElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcButtonGroupElementEventMap>(type: K, listener: (this: HTMLModusWcButtonGroupElement, ev: ModusWcButtonGroupCustomEvent<HTMLModusWcButtonGroupElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcButtonGroupElement: {
        prototype: HTMLModusWcButtonGroupElement;
        new (): HTMLModusWcButtonGroupElement;
    };
    /**
     * A customizable card component used to group and display content in a way that is easily readable.
     * This component supports multiple `<slot>` elements including 'header' for images or custom content, 'title', 'subtitle', a default slot for main content, 'actions' for buttons or interactive elements, and 'footer'.
     */
    interface HTMLModusWcCardElement extends Components.ModusWcCard, HTMLStencilElement {
    }
    var HTMLModusWcCardElement: {
        prototype: HTMLModusWcCardElement;
        new (): HTMLModusWcCardElement;
    };
    interface HTMLModusWcCheckboxElementEventMap {
        "inputBlur": FocusEvent;
        "inputChange": InputEvent;
        "inputFocus": FocusEvent;
    }
    /**
     * A customizable checkbox component
     */
    interface HTMLModusWcCheckboxElement extends Components.ModusWcCheckbox, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcCheckboxElementEventMap>(type: K, listener: (this: HTMLModusWcCheckboxElement, ev: ModusWcCheckboxCustomEvent<HTMLModusWcCheckboxElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcCheckboxElementEventMap>(type: K, listener: (this: HTMLModusWcCheckboxElement, ev: ModusWcCheckboxCustomEvent<HTMLModusWcCheckboxElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcCheckboxElement: {
        prototype: HTMLModusWcCheckboxElement;
        new (): HTMLModusWcCheckboxElement;
    };
    interface HTMLModusWcChipElementEventMap {
        "chipClick": MouseEvent | KeyboardEvent;
        "chipRemove": MouseEvent | KeyboardEvent;
    }
    /**
     * A customizable chip component used to display information in a compact area
     * The component supports a `<slot>` for injecting custom content such as avatar and icons.
     */
    interface HTMLModusWcChipElement extends Components.ModusWcChip, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcChipElementEventMap>(type: K, listener: (this: HTMLModusWcChipElement, ev: ModusWcChipCustomEvent<HTMLModusWcChipElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcChipElementEventMap>(type: K, listener: (this: HTMLModusWcChipElement, ev: ModusWcChipCustomEvent<HTMLModusWcChipElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcChipElement: {
        prototype: HTMLModusWcChipElement;
        new (): HTMLModusWcChipElement;
    };
    interface HTMLModusWcCollapseElementEventMap {
        "expandedChange": { expanded: boolean };
    }
    /**
     * A customizable collapse component used for showing and hiding content.
     * The component supports a 'header' and 'content' `<slot>` for injecting custom HTML.
     */
    interface HTMLModusWcCollapseElement extends Components.ModusWcCollapse, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcCollapseElementEventMap>(type: K, listener: (this: HTMLModusWcCollapseElement, ev: ModusWcCollapseCustomEvent<HTMLModusWcCollapseElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcCollapseElementEventMap>(type: K, listener: (this: HTMLModusWcCollapseElement, ev: ModusWcCollapseCustomEvent<HTMLModusWcCollapseElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcCollapseElement: {
        prototype: HTMLModusWcCollapseElement;
        new (): HTMLModusWcCollapseElement;
    };
    interface HTMLModusWcDateElementEventMap {
        "inputBlur": FocusEvent;
        "inputChange": InputEvent;
        "inputFocus": FocusEvent;
        "calendarMonthChange": number;
        "calendarYearChange": number;
    }
    /**
     * A customizable date picker component used to create date inputs.
     * Adheres to WCAG 2.2 standards.
     */
    interface HTMLModusWcDateElement extends Components.ModusWcDate, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcDateElementEventMap>(type: K, listener: (this: HTMLModusWcDateElement, ev: ModusWcDateCustomEvent<HTMLModusWcDateElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcDateElementEventMap>(type: K, listener: (this: HTMLModusWcDateElement, ev: ModusWcDateCustomEvent<HTMLModusWcDateElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcDateElement: {
        prototype: HTMLModusWcDateElement;
        new (): HTMLModusWcDateElement;
    };
    /**
     * A customizable divider component used to separate content horizontally or vertically
     */
    interface HTMLModusWcDividerElement extends Components.ModusWcDivider, HTMLStencilElement {
    }
    var HTMLModusWcDividerElement: {
        prototype: HTMLModusWcDividerElement;
        new (): HTMLModusWcDividerElement;
    };
    interface HTMLModusWcDropdownMenuElementEventMap {
        "menuVisibilityChange": { isVisible: boolean };
    }
    /**
     * A customizable dropdown menu component used to render a button and toggleable menu.
     * The component supports a 'button' and 'menu' `<slot>` for injecting custom HTML content.
     */
    interface HTMLModusWcDropdownMenuElement extends Components.ModusWcDropdownMenu, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcDropdownMenuElementEventMap>(type: K, listener: (this: HTMLModusWcDropdownMenuElement, ev: ModusWcDropdownMenuCustomEvent<HTMLModusWcDropdownMenuElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcDropdownMenuElementEventMap>(type: K, listener: (this: HTMLModusWcDropdownMenuElement, ev: ModusWcDropdownMenuCustomEvent<HTMLModusWcDropdownMenuElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcDropdownMenuElement: {
        prototype: HTMLModusWcDropdownMenuElement;
        new (): HTMLModusWcDropdownMenuElement;
    };
    interface HTMLModusWcFileDropzoneElementEventMap {
        "fileSelect": FileList;
    }
    /**
     * File dropzone component that allows users to drag and drop files for upload.
     * The component supports a `<slot>` called 'dropzone' for adding custom content such as progress indicators or additional instructions within the dropzone area.
     */
    interface HTMLModusWcFileDropzoneElement extends Components.ModusWcFileDropzone, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcFileDropzoneElementEventMap>(type: K, listener: (this: HTMLModusWcFileDropzoneElement, ev: ModusWcFileDropzoneCustomEvent<HTMLModusWcFileDropzoneElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcFileDropzoneElementEventMap>(type: K, listener: (this: HTMLModusWcFileDropzoneElement, ev: ModusWcFileDropzoneCustomEvent<HTMLModusWcFileDropzoneElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcFileDropzoneElement: {
        prototype: HTMLModusWcFileDropzoneElement;
        new (): HTMLModusWcFileDropzoneElement;
    };
    /**
     * A draggable handle component for resizing adjacent elements
     */
    interface HTMLModusWcHandleElement extends Components.ModusWcHandle, HTMLStencilElement {
    }
    var HTMLModusWcHandleElement: {
        prototype: HTMLModusWcHandleElement;
        new (): HTMLModusWcHandleElement;
    };
    /**
     * A customizable icon component used to render Modus icons.
     * <b>This component requires Modus icons to be installed in the host application. See [Modus Icon Usage](/docs/documentation-modus-icon-usage--docs) for steps.</b>
     */
    interface HTMLModusWcIconElement extends Components.ModusWcIcon, HTMLStencilElement {
    }
    var HTMLModusWcIconElement: {
        prototype: HTMLModusWcIconElement;
        new (): HTMLModusWcIconElement;
    };
    /**
     * A customizable feedback component used to provide additional context related to form input interactions.
     * <b>To use a custom icon, this component requires Modus icons to be installed in the host application. See [Modus Icon Usage](/docs/documentation-modus-icon-usage--docs) for steps.</b>
     */
    interface HTMLModusWcInputFeedbackElement extends Components.ModusWcInputFeedback, HTMLStencilElement {
    }
    var HTMLModusWcInputFeedbackElement: {
        prototype: HTMLModusWcInputFeedbackElement;
        new (): HTMLModusWcInputFeedbackElement;
    };
    /**
     * A customizable input label component.
     * The component supports a `<slot>` for injecting additional custom content inside the label, such as icons or formatted text.
     */
    interface HTMLModusWcInputLabelElement extends Components.ModusWcInputLabel, HTMLStencilElement {
    }
    var HTMLModusWcInputLabelElement: {
        prototype: HTMLModusWcInputLabelElement;
        new (): HTMLModusWcInputLabelElement;
    };
    /**
     * A customizable link component used to navigate to URLs.
     */
    interface HTMLModusWcLinkElement extends Components.ModusWcLink, HTMLStencilElement {
    }
    var HTMLModusWcLinkElement: {
        prototype: HTMLModusWcLinkElement;
        new (): HTMLModusWcLinkElement;
    };
    /**
     * A customizable loader component used to indicate the loading of content
     */
    interface HTMLModusWcLoaderElement extends Components.ModusWcLoader, HTMLStencilElement {
    }
    var HTMLModusWcLoaderElement: {
        prototype: HTMLModusWcLoaderElement;
        new (): HTMLModusWcLoaderElement;
    };
    /**
     * A component for displaying Trimble product logos with support for both fixed and scalable sizing.
     * Provides consistent branding across applications with various product logo options.
     * Logo colors automatically adapt to the active Modus theme via CSS variables.
     */
    interface HTMLModusWcLogoElement extends Components.ModusWcLogo, HTMLStencilElement {
    }
    var HTMLModusWcLogoElement: {
        prototype: HTMLModusWcLogoElement;
        new (): HTMLModusWcLogoElement;
    };
    interface HTMLModusWcMenuElementEventMap {
        "menuFocusout": FocusEvent;
        "menuSelectionChange": {
    selectedItems: HTMLElement[];
  };
    }
    /**
     * A customizable menu component used to display a list of li elements vertically or horizontally.
     * The component supports a `<slot>` for injecting custom li elements inside the ul element.
     */
    interface HTMLModusWcMenuElement extends Components.ModusWcMenu, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcMenuElementEventMap>(type: K, listener: (this: HTMLModusWcMenuElement, ev: ModusWcMenuCustomEvent<HTMLModusWcMenuElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcMenuElementEventMap>(type: K, listener: (this: HTMLModusWcMenuElement, ev: ModusWcMenuCustomEvent<HTMLModusWcMenuElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcMenuElement: {
        prototype: HTMLModusWcMenuElement;
        new (): HTMLModusWcMenuElement;
    };
    interface HTMLModusWcMenuItemElementEventMap {
        "itemSelect": {
    value: string;
    selected?: boolean;
  };
    }
    /**
     * A customizable menu item component used to display the item portion of a menu.
     * This component supports a 'start-icon' `<slot>` that allows for custom icons to be placed at the beginning of the item.
     */
    interface HTMLModusWcMenuItemElement extends Components.ModusWcMenuItem, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcMenuItemElementEventMap>(type: K, listener: (this: HTMLModusWcMenuItemElement, ev: ModusWcMenuItemCustomEvent<HTMLModusWcMenuItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcMenuItemElementEventMap>(type: K, listener: (this: HTMLModusWcMenuItemElement, ev: ModusWcMenuItemCustomEvent<HTMLModusWcMenuItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcMenuItemElement: {
        prototype: HTMLModusWcMenuItemElement;
        new (): HTMLModusWcMenuItemElement;
    };
    /**
     * A customizable modal component used to display content in a dialog.
     * This component supports 'header', 'content', and 'footer' `<slot>` elements for inserting custom HTML.
     */
    interface HTMLModusWcModalElement extends Components.ModusWcModal, HTMLStencilElement {
    }
    var HTMLModusWcModalElement: {
        prototype: HTMLModusWcModalElement;
        new (): HTMLModusWcModalElement;
    };
    interface HTMLModusWcNavbarElementEventMap {
        "aiClick": MouseEvent | KeyboardEvent;
        "appsClick": MouseEvent | KeyboardEvent;
        "appsMenuOpenChange": boolean;
        "condensedMenuOpenChange": boolean;
        "helpClick": MouseEvent | KeyboardEvent;
        "mainMenuOpenChange": boolean;
        "myTrimbleClick": MouseEvent | KeyboardEvent;
        "notificationsClick": MouseEvent | KeyboardEvent;
        "notificationsMenuOpenChange": boolean;
        "searchChange": { value: string };
        "searchClick": MouseEvent | KeyboardEvent;
        "searchInputOpenChange": boolean;
        "signOutClick": MouseEvent | KeyboardEvent;
        "trimbleLogoClick": MouseEvent | KeyboardEvent;
        "userMenuOpenChange": boolean;
    }
    /**
     * A customizable navbar component used for top level navigation of all Trimble applications.
     */
    interface HTMLModusWcNavbarElement extends Components.ModusWcNavbar, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcNavbarElementEventMap>(type: K, listener: (this: HTMLModusWcNavbarElement, ev: ModusWcNavbarCustomEvent<HTMLModusWcNavbarElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcNavbarElementEventMap>(type: K, listener: (this: HTMLModusWcNavbarElement, ev: ModusWcNavbarCustomEvent<HTMLModusWcNavbarElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcNavbarElement: {
        prototype: HTMLModusWcNavbarElement;
        new (): HTMLModusWcNavbarElement;
    };
    interface HTMLModusWcNumberInputElementEventMap {
        "inputBlur": FocusEvent;
        "inputChange": InputEvent;
        "inputFocus": FocusEvent;
    }
    /**
     * A customizable input component used to create number inputs with types
     */
    interface HTMLModusWcNumberInputElement extends Components.ModusWcNumberInput, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcNumberInputElementEventMap>(type: K, listener: (this: HTMLModusWcNumberInputElement, ev: ModusWcNumberInputCustomEvent<HTMLModusWcNumberInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcNumberInputElementEventMap>(type: K, listener: (this: HTMLModusWcNumberInputElement, ev: ModusWcNumberInputCustomEvent<HTMLModusWcNumberInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcNumberInputElement: {
        prototype: HTMLModusWcNumberInputElement;
        new (): HTMLModusWcNumberInputElement;
    };
    interface HTMLModusWcPaginationElementEventMap {
        "pageChange": IPageChange;
    }
    /**
     * Pagination component to navigate through pages of content
     */
    interface HTMLModusWcPaginationElement extends Components.ModusWcPagination, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcPaginationElementEventMap>(type: K, listener: (this: HTMLModusWcPaginationElement, ev: ModusWcPaginationCustomEvent<HTMLModusWcPaginationElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcPaginationElementEventMap>(type: K, listener: (this: HTMLModusWcPaginationElement, ev: ModusWcPaginationCustomEvent<HTMLModusWcPaginationElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcPaginationElement: {
        prototype: HTMLModusWcPaginationElement;
        new (): HTMLModusWcPaginationElement;
    };
    /**
     * A customizable panel component used to organize content in a structured layout.
     * This component provides 'header', 'body', and 'footer' `<slot>` elements for inserting custom HTML.
     */
    interface HTMLModusWcPanelElement extends Components.ModusWcPanel, HTMLStencilElement {
    }
    var HTMLModusWcPanelElement: {
        prototype: HTMLModusWcPanelElement;
        new (): HTMLModusWcPanelElement;
    };
    interface HTMLModusWcProfileMenuElementEventMap {
        "signOutClick": void;
        "menuItemClick": string;
    }
    interface HTMLModusWcProfileMenuElement extends Components.ModusWcProfileMenu, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcProfileMenuElementEventMap>(type: K, listener: (this: HTMLModusWcProfileMenuElement, ev: ModusWcProfileMenuCustomEvent<HTMLModusWcProfileMenuElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcProfileMenuElementEventMap>(type: K, listener: (this: HTMLModusWcProfileMenuElement, ev: ModusWcProfileMenuCustomEvent<HTMLModusWcProfileMenuElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcProfileMenuElement: {
        prototype: HTMLModusWcProfileMenuElement;
        new (): HTMLModusWcProfileMenuElement;
    };
    /**
     * A customizable progress component used to show the progress of a task or show the passing of time.
     * The radial variant supports slotting in custom HTML to be displayed within the progress circle.
     */
    interface HTMLModusWcProgressElement extends Components.ModusWcProgress, HTMLStencilElement {
    }
    var HTMLModusWcProgressElement: {
        prototype: HTMLModusWcProgressElement;
        new (): HTMLModusWcProgressElement;
    };
    interface HTMLModusWcRadioElementEventMap {
        "inputBlur": FocusEvent;
        "inputChange": InputEvent;
        "inputFocus": FocusEvent;
    }
    /**
     * A customizable radio button component.
     */
    interface HTMLModusWcRadioElement extends Components.ModusWcRadio, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcRadioElementEventMap>(type: K, listener: (this: HTMLModusWcRadioElement, ev: ModusWcRadioCustomEvent<HTMLModusWcRadioElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcRadioElementEventMap>(type: K, listener: (this: HTMLModusWcRadioElement, ev: ModusWcRadioCustomEvent<HTMLModusWcRadioElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcRadioElement: {
        prototype: HTMLModusWcRadioElement;
        new (): HTMLModusWcRadioElement;
    };
    interface HTMLModusWcRatingElementEventMap {
        "ratingChange": IRatingChange;
    }
    /**
     * A rating component that allows users to choose a rating from predefined options
     */
    interface HTMLModusWcRatingElement extends Components.ModusWcRating, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcRatingElementEventMap>(type: K, listener: (this: HTMLModusWcRatingElement, ev: ModusWcRatingCustomEvent<HTMLModusWcRatingElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcRatingElementEventMap>(type: K, listener: (this: HTMLModusWcRatingElement, ev: ModusWcRatingCustomEvent<HTMLModusWcRatingElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcRatingElement: {
        prototype: HTMLModusWcRatingElement;
        new (): HTMLModusWcRatingElement;
    };
    interface HTMLModusWcSelectElementEventMap {
        "inputBlur": FocusEvent;
        "inputChange": InputEvent;
        "inputFocus": FocusEvent;
    }
    /**
     * A customizable select component used to pick a value from a list of options
     */
    interface HTMLModusWcSelectElement extends Components.ModusWcSelect, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcSelectElementEventMap>(type: K, listener: (this: HTMLModusWcSelectElement, ev: ModusWcSelectCustomEvent<HTMLModusWcSelectElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcSelectElementEventMap>(type: K, listener: (this: HTMLModusWcSelectElement, ev: ModusWcSelectCustomEvent<HTMLModusWcSelectElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcSelectElement: {
        prototype: HTMLModusWcSelectElement;
        new (): HTMLModusWcSelectElement;
    };
    interface HTMLModusWcSideNavigationElementEventMap {
        "expandedChange": boolean;
    }
    /**
     * A customizable side navigation component for organizing primary navigation and content areas in an application.
     * The component supports a `<slot>` for injecting custom content inside the side navigation panel.
     */
    interface HTMLModusWcSideNavigationElement extends Components.ModusWcSideNavigation, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcSideNavigationElementEventMap>(type: K, listener: (this: HTMLModusWcSideNavigationElement, ev: ModusWcSideNavigationCustomEvent<HTMLModusWcSideNavigationElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcSideNavigationElementEventMap>(type: K, listener: (this: HTMLModusWcSideNavigationElement, ev: ModusWcSideNavigationCustomEvent<HTMLModusWcSideNavigationElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcSideNavigationElement: {
        prototype: HTMLModusWcSideNavigationElement;
        new (): HTMLModusWcSideNavigationElement;
    };
    /**
     * A customizable skeleton component used to create skeletons of various sizes and shapes
     */
    interface HTMLModusWcSkeletonElement extends Components.ModusWcSkeleton, HTMLStencilElement {
    }
    var HTMLModusWcSkeletonElement: {
        prototype: HTMLModusWcSkeletonElement;
        new (): HTMLModusWcSkeletonElement;
    };
    interface HTMLModusWcSliderElementEventMap {
        "inputBlur": FocusEvent;
        "inputChange": InputEvent;
        "inputFocus": FocusEvent;
    }
    /**
     * A customizable slider component
     */
    interface HTMLModusWcSliderElement extends Components.ModusWcSlider, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcSliderElementEventMap>(type: K, listener: (this: HTMLModusWcSliderElement, ev: ModusWcSliderCustomEvent<HTMLModusWcSliderElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcSliderElementEventMap>(type: K, listener: (this: HTMLModusWcSliderElement, ev: ModusWcSliderCustomEvent<HTMLModusWcSliderElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcSliderElement: {
        prototype: HTMLModusWcSliderElement;
        new (): HTMLModusWcSliderElement;
    };
    interface HTMLModusWcStepperElementEventMap {
        "stepClick": { index: number };
    }
    /**
     * Used to show a list of steps in a process.
     */
    interface HTMLModusWcStepperElement extends Components.ModusWcStepper, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcStepperElementEventMap>(type: K, listener: (this: HTMLModusWcStepperElement, ev: ModusWcStepperCustomEvent<HTMLModusWcStepperElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcStepperElementEventMap>(type: K, listener: (this: HTMLModusWcStepperElement, ev: ModusWcStepperCustomEvent<HTMLModusWcStepperElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcStepperElement: {
        prototype: HTMLModusWcStepperElement;
        new (): HTMLModusWcStepperElement;
    };
    interface HTMLModusWcSwitchElementEventMap {
        "inputBlur": FocusEvent;
        "inputChange": InputEvent;
        "inputFocus": FocusEvent;
    }
    /**
     * A customizable switch component
     */
    interface HTMLModusWcSwitchElement extends Components.ModusWcSwitch, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcSwitchElementEventMap>(type: K, listener: (this: HTMLModusWcSwitchElement, ev: ModusWcSwitchCustomEvent<HTMLModusWcSwitchElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcSwitchElementEventMap>(type: K, listener: (this: HTMLModusWcSwitchElement, ev: ModusWcSwitchCustomEvent<HTMLModusWcSwitchElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcSwitchElement: {
        prototype: HTMLModusWcSwitchElement;
        new (): HTMLModusWcSwitchElement;
    };
    interface HTMLModusWcTableElementEventMap {
        "cellEditStart": {
    rowIndex: number;
    colId: string;
  };
        "cellEditCommit": {
    rowIndex: number;
    colId: string;
    newValue: unknown;
    updatedRow: Record<string, unknown>;
  };
        "rowClick": {
    row: Record<string, unknown>;
    index: number;
  };
        "sortChange": SortingState;
        "paginationChange": IPaginationChangeEventDetail;
        "rowSelectionChange": {
    selectedRows: Record<string, unknown>[];
    selectedRowIds: string[];
  };
    }
    interface HTMLModusWcTableElement extends Components.ModusWcTable, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcTableElementEventMap>(type: K, listener: (this: HTMLModusWcTableElement, ev: ModusWcTableCustomEvent<HTMLModusWcTableElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcTableElementEventMap>(type: K, listener: (this: HTMLModusWcTableElement, ev: ModusWcTableCustomEvent<HTMLModusWcTableElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcTableElement: {
        prototype: HTMLModusWcTableElement;
        new (): HTMLModusWcTableElement;
    };
    interface HTMLModusWcTabsElementEventMap {
        "tabChange": {
    previousTab: number;
    newTab: number;
  };
    }
    /**
     * A customizable tabs component used to create groups of tabs.
     * The component supports a `<slot>` for injecting custom tab content.
     */
    interface HTMLModusWcTabsElement extends Components.ModusWcTabs, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcTabsElementEventMap>(type: K, listener: (this: HTMLModusWcTabsElement, ev: ModusWcTabsCustomEvent<HTMLModusWcTabsElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcTabsElementEventMap>(type: K, listener: (this: HTMLModusWcTabsElement, ev: ModusWcTabsCustomEvent<HTMLModusWcTabsElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcTabsElement: {
        prototype: HTMLModusWcTabsElement;
        new (): HTMLModusWcTabsElement;
    };
    interface HTMLModusWcTextInputElementEventMap {
        "clearClick": void;
        "inputBlur": FocusEvent;
        "inputChange": InputEvent;
        "inputFocus": FocusEvent;
    }
    /**
     * A customizable input component used to create text inputs with types.
     * The component supports a `<slot>` for injecting additional custom content inside the input, such as icons or formatted text.
     */
    interface HTMLModusWcTextInputElement extends Components.ModusWcTextInput, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcTextInputElementEventMap>(type: K, listener: (this: HTMLModusWcTextInputElement, ev: ModusWcTextInputCustomEvent<HTMLModusWcTextInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcTextInputElementEventMap>(type: K, listener: (this: HTMLModusWcTextInputElement, ev: ModusWcTextInputCustomEvent<HTMLModusWcTextInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcTextInputElement: {
        prototype: HTMLModusWcTextInputElement;
        new (): HTMLModusWcTextInputElement;
    };
    interface HTMLModusWcTextareaElementEventMap {
        "inputBlur": FocusEvent;
        "inputChange": InputEvent;
        "inputFocus": FocusEvent;
    }
    /**
     * A customizable textarea component.
     */
    interface HTMLModusWcTextareaElement extends Components.ModusWcTextarea, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcTextareaElementEventMap>(type: K, listener: (this: HTMLModusWcTextareaElement, ev: ModusWcTextareaCustomEvent<HTMLModusWcTextareaElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcTextareaElementEventMap>(type: K, listener: (this: HTMLModusWcTextareaElement, ev: ModusWcTextareaCustomEvent<HTMLModusWcTextareaElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcTextareaElement: {
        prototype: HTMLModusWcTextareaElement;
        new (): HTMLModusWcTextareaElement;
    };
    interface HTMLModusWcThemeProviderElement extends Components.ModusWcThemeProvider, HTMLStencilElement {
    }
    var HTMLModusWcThemeProviderElement: {
        prototype: HTMLModusWcThemeProviderElement;
        new (): HTMLModusWcThemeProviderElement;
    };
    interface HTMLModusWcThemeSwitcherElementEventMap {
        "themeChange": IThemeConfig;
    }
    /**
     * A theme switcher component used to toggle the application theme and/or mode.
     * Allows consumers to set the initial theme (Modus Classic, Modus Modern, etc.) and end-users to toggle modes (Light, Dark).
     */
    interface HTMLModusWcThemeSwitcherElement extends Components.ModusWcThemeSwitcher, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcThemeSwitcherElementEventMap>(type: K, listener: (this: HTMLModusWcThemeSwitcherElement, ev: ModusWcThemeSwitcherCustomEvent<HTMLModusWcThemeSwitcherElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcThemeSwitcherElementEventMap>(type: K, listener: (this: HTMLModusWcThemeSwitcherElement, ev: ModusWcThemeSwitcherCustomEvent<HTMLModusWcThemeSwitcherElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcThemeSwitcherElement: {
        prototype: HTMLModusWcThemeSwitcherElement;
        new (): HTMLModusWcThemeSwitcherElement;
    };
    interface HTMLModusWcTimeInputElementEventMap {
        "inputBlur": FocusEvent;
        "inputChange": Event;
        "inputFocus": FocusEvent;
    }
    /**
     * A customizable input component used to create time inputs.
     */
    interface HTMLModusWcTimeInputElement extends Components.ModusWcTimeInput, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcTimeInputElementEventMap>(type: K, listener: (this: HTMLModusWcTimeInputElement, ev: ModusWcTimeInputCustomEvent<HTMLModusWcTimeInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcTimeInputElementEventMap>(type: K, listener: (this: HTMLModusWcTimeInputElement, ev: ModusWcTimeInputCustomEvent<HTMLModusWcTimeInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcTimeInputElement: {
        prototype: HTMLModusWcTimeInputElement;
        new (): HTMLModusWcTimeInputElement;
    };
    /**
     * A customizable toast component used to stack elements, positioned on the corner of a page.
     * The component supports a `<slot>` for injecting additional custom content inside the toast.
     */
    interface HTMLModusWcToastElement extends Components.ModusWcToast, HTMLStencilElement {
    }
    var HTMLModusWcToastElement: {
        prototype: HTMLModusWcToastElement;
        new (): HTMLModusWcToastElement;
    };
    /**
     * A customizable toolbar component used to organize content across the entire page.
     * This component provides 'start', 'center', and 'end' `<slot>` elements for inserting custom HTML.
     */
    interface HTMLModusWcToolbarElement extends Components.ModusWcToolbar, HTMLStencilElement {
    }
    var HTMLModusWcToolbarElement: {
        prototype: HTMLModusWcToolbarElement;
        new (): HTMLModusWcToolbarElement;
    };
    interface HTMLModusWcTooltipElementEventMap {
        "dismissEscape": any;
    }
    /**
     * A customizable tooltip component used to create tooltips with different content.
     * The tooltip can be dismissed by pressing the Escape key when hovering over it.
     * When forceOpen is enabled, the tooltip will remain open and can only be closed by setting forceOpen to false.
     * Use the contentElement prop to supply rich HTML content to the tooltip such as multiline text.
     * For plain dynamic text, prefer the content prop instead. When contentElement is set, it takes precedence over the content prop.
     */
    interface HTMLModusWcTooltipElement extends Components.ModusWcTooltip, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcTooltipElementEventMap>(type: K, listener: (this: HTMLModusWcTooltipElement, ev: ModusWcTooltipCustomEvent<HTMLModusWcTooltipElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcTooltipElementEventMap>(type: K, listener: (this: HTMLModusWcTooltipElement, ev: ModusWcTooltipCustomEvent<HTMLModusWcTooltipElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcTooltipElement: {
        prototype: HTMLModusWcTooltipElement;
        new (): HTMLModusWcTooltipElement;
    };
    interface HTMLModusWcTreeItemElementEventMap {
        "itemSelect": {
    value: string;
    selected?: boolean;
  };
    }
    /**
     * A customizable tree item component used to display the item portion of a tree menu.
     * This component supports `start` and `end` slots for custom content at the beginning and end of the item.
     */
    interface HTMLModusWcTreeItemElement extends Components.ModusWcTreeItem, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcTreeItemElementEventMap>(type: K, listener: (this: HTMLModusWcTreeItemElement, ev: ModusWcTreeItemCustomEvent<HTMLModusWcTreeItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcTreeItemElementEventMap>(type: K, listener: (this: HTMLModusWcTreeItemElement, ev: ModusWcTreeItemCustomEvent<HTMLModusWcTreeItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcTreeItemElement: {
        prototype: HTMLModusWcTreeItemElement;
        new (): HTMLModusWcTreeItemElement;
    };
    interface HTMLModusWcTreeMenuElementEventMap {
        "menuFocusout": FocusEvent;
        "menuSelectionChange": {
    selectedItems: HTMLElement[];
  };
    }
    /**
     * A customizable tree menu component used to display a list of modus-wc-tree-item elements vertically or horizontally.
     * The component supports a `<slot>` for injecting custom modus-wc-tree-item elements inside the ul element.
     */
    interface HTMLModusWcTreeMenuElement extends Components.ModusWcTreeMenu, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcTreeMenuElementEventMap>(type: K, listener: (this: HTMLModusWcTreeMenuElement, ev: ModusWcTreeMenuCustomEvent<HTMLModusWcTreeMenuElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcTreeMenuElementEventMap>(type: K, listener: (this: HTMLModusWcTreeMenuElement, ev: ModusWcTreeMenuCustomEvent<HTMLModusWcTreeMenuElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcTreeMenuElement: {
        prototype: HTMLModusWcTreeMenuElement;
        new (): HTMLModusWcTreeMenuElement;
    };
    /**
     * A customizable typography component used to render text with different sizes, hierarchy, and weights.
     * Note:
     * - When using heading elements (h1-h6), the default heading CSS styling can be accessed without modifying
     * the default size (size="md") and weight (weight="normal") properties. Default styling can be overridden by
     * providing your own custom values for the size or weight properties from the available options.
     * - If both slot content and `label` are provided, only the slot content will be rendered
     * - Use the `label` prop when you need to dynamically update the text.
     */
    interface HTMLModusWcTypographyElement extends Components.ModusWcTypography, HTMLStencilElement {
    }
    var HTMLModusWcTypographyElement: {
        prototype: HTMLModusWcTypographyElement;
        new (): HTMLModusWcTypographyElement;
    };
    interface HTMLModusWcUtilityPanelElementEventMap {
        "panelOpened": void;
        "panelClosed": void;
    }
    interface HTMLModusWcUtilityPanelElement extends Components.ModusWcUtilityPanel, HTMLStencilElement {
        addEventListener<K extends keyof HTMLModusWcUtilityPanelElementEventMap>(type: K, listener: (this: HTMLModusWcUtilityPanelElement, ev: ModusWcUtilityPanelCustomEvent<HTMLModusWcUtilityPanelElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
        removeEventListener<K extends keyof HTMLModusWcUtilityPanelElementEventMap>(type: K, listener: (this: HTMLModusWcUtilityPanelElement, ev: ModusWcUtilityPanelCustomEvent<HTMLModusWcUtilityPanelElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
    }
    var HTMLModusWcUtilityPanelElement: {
        prototype: HTMLModusWcUtilityPanelElement;
        new (): HTMLModusWcUtilityPanelElement;
    };
    interface HTMLElementTagNameMap {
        "modus-wc-accordion": HTMLModusWcAccordionElement;
        "modus-wc-alert": HTMLModusWcAlertElement;
        "modus-wc-app-menu": HTMLModusWcAppMenuElement;
        "modus-wc-autocomplete": HTMLModusWcAutocompleteElement;
        "modus-wc-avatar": HTMLModusWcAvatarElement;
        "modus-wc-badge": HTMLModusWcBadgeElement;
        "modus-wc-bottom-sheet": HTMLModusWcBottomSheetElement;
        "modus-wc-breadcrumbs": HTMLModusWcBreadcrumbsElement;
        "modus-wc-button": HTMLModusWcButtonElement;
        "modus-wc-button-group": HTMLModusWcButtonGroupElement;
        "modus-wc-card": HTMLModusWcCardElement;
        "modus-wc-checkbox": HTMLModusWcCheckboxElement;
        "modus-wc-chip": HTMLModusWcChipElement;
        "modus-wc-collapse": HTMLModusWcCollapseElement;
        "modus-wc-date": HTMLModusWcDateElement;
        "modus-wc-divider": HTMLModusWcDividerElement;
        "modus-wc-dropdown-menu": HTMLModusWcDropdownMenuElement;
        "modus-wc-file-dropzone": HTMLModusWcFileDropzoneElement;
        "modus-wc-handle": HTMLModusWcHandleElement;
        "modus-wc-icon": HTMLModusWcIconElement;
        "modus-wc-input-feedback": HTMLModusWcInputFeedbackElement;
        "modus-wc-input-label": HTMLModusWcInputLabelElement;
        "modus-wc-link": HTMLModusWcLinkElement;
        "modus-wc-loader": HTMLModusWcLoaderElement;
        "modus-wc-logo": HTMLModusWcLogoElement;
        "modus-wc-menu": HTMLModusWcMenuElement;
        "modus-wc-menu-item": HTMLModusWcMenuItemElement;
        "modus-wc-modal": HTMLModusWcModalElement;
        "modus-wc-navbar": HTMLModusWcNavbarElement;
        "modus-wc-number-input": HTMLModusWcNumberInputElement;
        "modus-wc-pagination": HTMLModusWcPaginationElement;
        "modus-wc-panel": HTMLModusWcPanelElement;
        "modus-wc-profile-menu": HTMLModusWcProfileMenuElement;
        "modus-wc-progress": HTMLModusWcProgressElement;
        "modus-wc-radio": HTMLModusWcRadioElement;
        "modus-wc-rating": HTMLModusWcRatingElement;
        "modus-wc-select": HTMLModusWcSelectElement;
        "modus-wc-side-navigation": HTMLModusWcSideNavigationElement;
        "modus-wc-skeleton": HTMLModusWcSkeletonElement;
        "modus-wc-slider": HTMLModusWcSliderElement;
        "modus-wc-stepper": HTMLModusWcStepperElement;
        "modus-wc-switch": HTMLModusWcSwitchElement;
        "modus-wc-table": HTMLModusWcTableElement;
        "modus-wc-tabs": HTMLModusWcTabsElement;
        "modus-wc-text-input": HTMLModusWcTextInputElement;
        "modus-wc-textarea": HTMLModusWcTextareaElement;
        "modus-wc-theme-provider": HTMLModusWcThemeProviderElement;
        "modus-wc-theme-switcher": HTMLModusWcThemeSwitcherElement;
        "modus-wc-time-input": HTMLModusWcTimeInputElement;
        "modus-wc-toast": HTMLModusWcToastElement;
        "modus-wc-toolbar": HTMLModusWcToolbarElement;
        "modus-wc-tooltip": HTMLModusWcTooltipElement;
        "modus-wc-tree-item": HTMLModusWcTreeItemElement;
        "modus-wc-tree-menu": HTMLModusWcTreeMenuElement;
        "modus-wc-typography": HTMLModusWcTypographyElement;
        "modus-wc-utility-panel": HTMLModusWcUtilityPanelElement;
    }
}
declare namespace LocalJSX {
    /**
     * A customizable accordion component used for showing and hiding related groups of content.
     * The component supports a `<slot>` called 'content' for injecting `<modus-wc-collapse>` elements. See [Collapse](/docs/components-collapse--docs) docs for additional info.
     */
    interface ModusWcAccordion {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * When a collapse expanded state is changed, this event outputs the relevant index and state
         */
        "onExpandedChange"?: (event: ModusWcAccordionCustomEvent<{
    expanded: boolean;
    index: number;
  }>) => void;
    }
    /**
     * A customizable alert component used to inform the user about important events.
     * The component supports `<slot>` elements for injecting custom content and buttons.
     */
    interface ModusWcAlert {
        /**
          * The description of the alert.
         */
        "alertDescription"?: string;
        /**
          * The title of the alert.
         */
        "alertTitle": string;
        /**
          * Custom CSS class to apply to the outer div element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Time taken to dismiss the alert in milliseconds
         */
        "delay"?: number;
        /**
          * Whether to disable the icon
          * @default false
         */
        "disableIcon"?: boolean;
        /**
          * Whether the alert has a dismiss button
          * @default false
         */
        "dismissible"?: boolean;
        /**
          * The Modus icon to render.
         */
        "icon"?: string;
        /**
          * An event that fires when the alert is dismissed
         */
        "onDismissClick"?: (event: ModusWcAlertCustomEvent<any>) => void;
        /**
          * The variant of the alert.
          * @default 'info'
         */
        "variant"?: 'error' | 'info' | 'neutral' | 'success' | 'warning';
    }
    interface ModusWcAppMenu {
        /**
          * The apps to display in the menu.
          * @default []
         */
        "apps"?: IAppMenuItem[];
        /**
          * custom class to apply to the menu
          * @default ''
         */
        "customClass"?: string;
        /**
          * The layout of the menu.
          * @default 'list'
         */
        "layout"?: 'list' | 'grid';
        /**
          * Emitted when an item is clicked
         */
        "onItemClick"?: (event: ModusWcAppMenuCustomEvent<{ appName: AppName }>) => void;
        /**
          * Emitted when reordering is confirmed via "Done" and the order differs from when edit started
         */
        "onItemsOrderChange"?: (event: ModusWcAppMenuCustomEvent<IAppMenuItem[]>) => void;
        /**
          * Emit event when the layout changes
         */
        "onLayoutChange"?: (event: ModusWcAppMenuCustomEvent<{
    layout: 'list' | 'grid';
  }>) => void;
    }
    /**
     * A customizable autocomplete component used to create searchable text inputs.
     * The component supports a `<slot>` for injecting custom content.
     */
    interface ModusWcAutocomplete {
        /**
          * Hint for form autofill feature.
         */
        "autoComplete"?: AutocompleteTypes;
        /**
          * Indicates that the autocomplete should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Custom blur handler - if provided, overrides default blur behavior
         */
        "customBlur"?: (event: FocusEvent) => void;
        /**
          * Custom CSS class to apply to host element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Custom input change handler - if provided, overrides default search filtering
         */
        "customInputChange"?: (value: string) => void;
        /**
          * Custom item selection handler - if provided, overrides default selection logic
         */
        "customItemSelect"?: (item: IAutocompleteItem) => void;
        /**
          * Custom key down handler - if provided, overrides default keyboard navigation
         */
        "customKeyDown"?: (event: KeyboardEvent) => void;
        /**
          * The debounce timeout in milliseconds. Set to 0 to disable debouncing.
          * @default 300
         */
        "debounceMs"?: number;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback state for the input field.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * Show the clear button within the input field.
          * @default false
         */
        "includeClear"?: boolean;
        /**
          * Show the search icon within the input field.
          * @default false
         */
        "includeSearch"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The items to display in the menu. Creating a new array of items will ensure proper component re-render.
          * @default []
         */
        "items"?: IAutocompleteItem[];
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Whether the menu should remain open after an item is selected.
          * @default false
         */
        "leaveMenuOpen"?: boolean;
        /**
          * Maximum number of chips to display. When exceeded, shows expand/collapse button. Set to -1 to disable limit.
          * @default -1
         */
        "maxChips"?: number;
        /**
          * The minimum number of characters required to render the menu.
          * @default 0
         */
        "minChars"?: number;
        /**
          * Minimum width for the text input in pixels. When chips would make input smaller, container height increases instead.
          * @default 10
         */
        "minInputWidth"?: number;
        /**
          * Whether the input allows multiple items to be selected.
          * @default false
         */
        "multiSelect"?: boolean;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * The content to display when no results are found.
          * @default {     ariaLabel: 'No results found',     label: 'No results found',     subLabel: 'Check spelling or try a different keyword',   }
         */
        "noResults"?: IAutocompleteNoResults;
        /**
          * Event emitted when a selected item chip is removed.
         */
        "onChipRemove"?: (event: ModusWcAutocompleteCustomEvent<IAutocompleteItem>) => void;
        /**
          * Event emitted when chips expansion state changes.
         */
        "onChipsExpansionChange"?: (event: ModusWcAutocompleteCustomEvent<{ expanded: boolean }>) => void;
        /**
          * Event emitted when the clear button is clicked.
         */
        "onClearClick"?: (event: ModusWcAutocompleteCustomEvent<void>) => void;
        /**
          * Event emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcAutocompleteCustomEvent<FocusEvent>) => void;
        /**
          * Event emitted when the input value changes. This event is debounced based on the debounceMs prop.
         */
        "onInputChange"?: (event: ModusWcAutocompleteCustomEvent<Event>) => void;
        /**
          * Event emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcAutocompleteCustomEvent<FocusEvent>) => void;
        /**
          * Event emitted when a menu item is selected.
         */
        "onItemSelect"?: (event: ModusWcAutocompleteCustomEvent<IAutocompleteItem>) => void;
        /**
          * Text that appears in the form control when it has no value set.
          * @default ''
         */
        "placeholder"?: string;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * Whether to show the menu whenever the input has focus, regardless of input value.
          * @default false
         */
        "showMenuOnFocus"?: boolean;
        /**
          * A spinner that appears when set to true
          * @default false
         */
        "showSpinner"?: boolean;
        /**
          * The size of the autocomplete (input and menu).
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the control.
          * @default ''
         */
        "value"?: string;
    }
    /**
     * A customizable avatar component used to create avatars with different images or user initials.
     * When no image is provided, the component can display initials (up to 3 characters) from the initials prop.
     * The component will extract the first letter of each word in the initials string.
     */
    interface ModusWcAvatar {
        /**
          * The image alt attribute for accessibility.
         */
        "alt": string;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The location of the image.
          * @default ''
         */
        "imgSrc"?: string;
        /**
          * The initials to display when no image is provided.
          * @default ''
         */
        "initials"?: string;
        /**
          * Event emitted when the avatar image fails to load.
         */
        "onImageLoadError"?: (event: ModusWcAvatarCustomEvent<IAvatarImageLoadError>) => void;
        /**
          * The shape of the avatar.
          * @default 'circle'
         */
        "shape"?: 'circle' | 'square';
        /**
          * The size of the avatar.
          * @default 'md'
         */
        "size"?: DaisySize | 'xl';
    }
    /**
     * A customizable badge component used to create badges with different sizes, types, and colors.
     * The component supports a `<slot>` for injecting content within the badge.
     */
    interface ModusWcBadge {
        /**
          * The color variant of the badge.
          * @default 'primary'
         */
        "color"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'high-contrast'
    | 'success'
    | 'warning'
    | 'danger';
        /**
          * Custom CSS class to apply to the span element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The size of the badge.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The variant of the badge.
          * @default 'filled'
         */
        "variant"?: 'counter' | 'filled' | 'outlined' | 'text';
    }
    interface ModusWcBottomSheet {
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Resting display mode: 'minimized', 'default', or 'expanded'. Drag/keyboard interactions do not overwrite this prop.
          * @default 'default'
         */
        "displayMode"?: TBottomSheetDisplayMode;
        /**
          * Fraction (0-1) of the sheet height it must be dragged, in either direction, before it steps one level.
          * @default 0.4
         */
        "dragStepThreshold"?: number;
        /**
          * Configuration for the built-in header layout. Do not set this prop if you intend to use the 'header' slot.
         */
        "header"?: IBottomSheetHeader;
        /**
          * Event emitted when the display mode changes, whether from a drag/keyboard interaction or from setting the `displayMode` prop. The new mode is in `detail.displayMode`.
         */
        "onDisplayModeChange"?: (event: ModusWcBottomSheetCustomEvent<{
    displayMode: TBottomSheetDisplayMode;
  }>) => void;
        /**
          * Event emitted when the header back button is clicked. Does not change sheet state.
         */
        "onHeaderBackClick"?: (event: ModusWcBottomSheetCustomEvent<void>) => void;
        /**
          * Event emitted when the header dismiss button is clicked. The sheet is also closed automatically (`visible` is set to `false`).
         */
        "onHeaderCloseClick"?: (event: ModusWcBottomSheetCustomEvent<void>) => void;
        /**
          * Event emitted when the visibility of the bottom sheet changes.
         */
        "onSheetVisibilityChange"?: (event: ModusWcBottomSheetCustomEvent<{ visible: boolean }>) => void;
        /**
          * Controls whether the bottom sheet is visible.
          * @default false
         */
        "visible"?: boolean;
    }
    /**
     * A customizable breadcrumbs component used to help users navigate through a website.
     */
    interface ModusWcBreadcrumbs {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The breadcrumbs to render.
          * @default []
         */
        "items"?: IBreadcrumb[];
        /**
          * Event emitted when a breadcrumb is clicked.
         */
        "onBreadcrumbClick"?: (event: ModusWcBreadcrumbsCustomEvent<IBreadcrumb>) => void;
        /**
          * The size of the breadcrumbs.
          * @default 'md'
         */
        "size"?: ModusSize;
    }
    /**
     * A customizable button component used to create buttons with different sizes, variants, and types.
     * The component supports a `<slot>` for injecting content within the button, similar to a native HTML button.
     */
    interface ModusWcButton {
        /**
          * The color variant of the button.
          * @default 'primary'
         */
        "color"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'warning'
    | 'danger'
    | 'neutral';
        /**
          * Custom CSS class to apply to the button element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * If true, the button will be disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * If true, the button will take the full width of its container.
          * @default false
         */
        "fullWidth"?: boolean;
        /**
          * Event emitted when the button is clicked or activated via keyboard.
         */
        "onButtonClick"?: (event: ModusWcButtonCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * If true, the button will be in a pressed state (for toggle buttons).
          * @default false
         */
        "pressed"?: boolean;
        /**
          * The shape of the button.
          * @default 'rectangle'
         */
        "shape"?: 'circle' | 'ellipse' | 'rectangle' | 'square';
        /**
          * The size of the button.
          * @default 'md'
         */
        "size"?: DaisySize | 'xl';
        /**
          * The type of the button.
          * @default 'button'
         */
        "type"?: 'button' | 'submit' | 'reset';
        /**
          * The variant of the button.
          * @default 'filled'
         */
        "variant"?: 'borderless' | 'filled' | 'outlined';
    }
    /**
     * A customizable buttongroup component that groups multiple Modus buttons together.
     * The component supports a `<slot>` for injecting content within the buttongroup.
     */
    interface ModusWcButtonGroup {
        /**
          * Color to apply to all buttons within the button group
         */
        "color"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'warning'
    | 'danger'
    | 'neutral';
        /**
          * Disables all buttons within the button group
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Event emitted when any button in the group is clicked
         */
        "onButtonGroupClick"?: (event: ModusWcButtonGroupCustomEvent<{
    button: HTMLElement;
    isSelected: boolean;
  }>) => void;
        /**
          * Event emitted when button selection changes
         */
        "onButtonSelectionChange"?: (event: ModusWcButtonGroupCustomEvent<{
    selectedButtons: HTMLElement[];
  }>) => void;
        /**
          * Orientation of the button group: horizontal or vertical
          * @default 'horizontal'
         */
        "orientation"?: Orientation;
        /**
          * Selection type for button group
          * @default 'default'
         */
        "selectionType"?: 'default' | 'single' | 'multiple';
        /**
          * Style variant to apply to all buttons within the button group
          * @default 'outlined'
         */
        "variant"?: 'borderless' | 'filled' | 'outlined';
    }
    /**
     * A customizable card component used to group and display content in a way that is easily readable.
     * This component supports multiple `<slot>` elements including 'header' for images or custom content, 'title', 'subtitle', a default slot for main content, 'actions' for buttons or interactive elements, and 'footer'.
     */
    interface ModusWcCard {
        /**
          * Makes any \<figure> in the 'header' slot cover the background
          * @default false
         */
        "backgroundFigure"?: boolean;
        /**
          * Adds a hard border to the card
          * @default false
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply
          * @default ''
         */
        "customClass"?: string;
        /**
          * Determines how the card is laid out
          * @default 'vertical'
         */
        "layout"?: 'vertical' | 'horizontal';
        /**
          * Determines the interior padding size
          * @default 'compact'
         */
        "padding"?: 'compact' | 'comfortable';
    }
    /**
     * A customizable checkbox component
     */
    interface ModusWcCheckbox {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the checkbox.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * The indeterminate state of the checkbox.
          * @default false
         */
        "indeterminate"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
          * @default ''
         */
        "name"?: string;
        /**
          * Emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcCheckboxCustomEvent<FocusEvent>) => void;
        /**
          * Emitted when the input value changes.
         */
        "onInputChange"?: (event: ModusWcCheckboxCustomEvent<InputEvent>) => void;
        /**
          * Emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcCheckboxCustomEvent<FocusEvent>) => void;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the checkbox.
          * @default false
         */
        "value"?: boolean;
    }
    /**
     * A customizable chip component used to display information in a compact area
     * The component supports a `<slot>` for injecting custom content such as avatar and icons.
     */
    interface ModusWcChip {
        /**
          * Active state of chip.
          * @default false
         */
        "active"?: boolean;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the chip is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Whether the chip has an error.
          * @default false
         */
        "hasError"?: boolean;
        /**
          * The label to display in the chip.
          * @default ''
         */
        "label"?: string;
        /**
          * Whether the chip height can grow and its content can wrap across multiple lines.
          * @default false
         */
        "multiline"?: boolean;
        /**
          * Event emitted when the chip is clicked or activated via keyboard.
         */
        "onChipClick"?: (event: ModusWcChipCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * Event emitted when the close chip icon button is clicked.
         */
        "onChipRemove"?: (event: ModusWcChipCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * The shape of the chip: 'rectangle' (default) or 'circle'.
          * @default 'rectangle'
         */
        "shape"?: 'rectangle' | 'circle';
        /**
          * Whether to show the close icon on right side of the chip.
          * @default false
         */
        "showRemove"?: boolean;
        /**
          * The size of the chip.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The variant of the chip.
          * @default 'filled'
         */
        "variant"?: 'filled' | 'outline';
    }
    /**
     * A customizable collapse component used for showing and hiding content.
     * The component supports a 'header' and 'content' `<slot>` for injecting custom HTML.
     */
    interface ModusWcCollapse {
        /**
          * When true, renders a border-bottom on the collapse component.
          * @default false
         */
        "bordered"?: boolean;
        /**
          * Controls chevron placement.
          * @default 'right'
         */
        "chevronPosition"?: 'left' | 'right';
        /**
          * A unique identifier used to set the id attributes of various elements.
         */
        "collapseId"?: string;
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Controls whether the collapse is expanded or not.
          * @default false
         */
        "expanded"?: boolean;
        /**
          * Event emitted when the expanded prop is internally changed.
         */
        "onExpandedChange"?: (event: ModusWcCollapseCustomEvent<{ expanded: boolean }>) => void;
        /**
          * Configuration options for rendering the pre-laid out collapse component. Do not set this prop if you intend to use the 'header' slot.
         */
        "options"?: ICollapseOptions;
    }
    /**
     * A customizable date picker component used to create date inputs.
     * Adheres to WCAG 2.2 standards.
     */
    interface ModusWcDate {
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the input.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The date format for display and input.
         */
        "format"?: | 'yyyy-mm-dd'
    | 'dd-mm-yyyy'
    | 'mm-dd-yyyy'
    | 'yyyy/mm/dd'
    | 'dd/mm/yyyy'
    | 'mm/dd/yyyy'
    | 'MMM DD, YYYY';
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Maximum date value. Must match the `format` prop pattern (or the locale-derived format when unset) or ISO 8601 (`YYYY-MM-DD`).
         */
        "max"?: string;
        /**
          * Minimum date value. Must match the `format` prop pattern (or the locale-derived format when unset) or ISO 8601 (`YYYY-MM-DD`).
         */
        "min"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Event emitted when the calendar month selection changes.
         */
        "onCalendarMonthChange"?: (event: ModusWcDateCustomEvent<number>) => void;
        /**
          * Event emitted when the calendar year selection changes.
         */
        "onCalendarYearChange"?: (event: ModusWcDateCustomEvent<number>) => void;
        /**
          * Event emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcDateCustomEvent<FocusEvent>) => void;
        /**
          * Event emitted when the input value changes. `target.value` is always ISO 8601 (YYYY-MM-DD), or empty string when incomplete or invalid.
         */
        "onInputChange"?: (event: ModusWcDateCustomEvent<InputEvent>) => void;
        /**
          * Event emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcDateCustomEvent<FocusEvent>) => void;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required or must be checked for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * Displays ISO 8601 week numbers in the calendar. Week numbers are calculated with Monday as the first day of the week.
          * @default false
         */
        "showWeekNumbers"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the control.
          * @default ''
         */
        "value"?: string;
        /**
          * The first day of the week for the calendar display
          * @default 'sunday'
         */
        "weekStartDay"?: WeekStartDay;
    }
    /**
     * A customizable divider component used to separate content horizontally or vertically
     */
    interface ModusWcDivider {
        /**
          * The color of the divider line.
          * @default 'tertiary'
         */
        "color"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'high-contrast'
    | 'success'
    | 'warning'
    | 'danger';
        /**
          * The content to display in the divider.
          * @default ''
         */
        "content"?: string;
        /**
          * Custom CSS class to apply to the divider element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The orientation of the divider. This is in reference to how content will be rendered around the divider.
          * @default 'vertical'
         */
        "orientation"?: Orientation;
        /**
          * The position of the divider.
          * @default 'center'
         */
        "position"?: 'center' | 'end' | 'start';
        /**
          * Whether the divider is responsive or not.
          * @default true
         */
        "responsive"?: boolean;
    }
    /**
     * A customizable dropdown menu component used to render a button and toggleable menu.
     * The component supports a 'button' and 'menu' `<slot>` for injecting custom HTML content.
     */
    interface ModusWcDropdownMenu {
        /**
          * The aria-label for the dropdown button.
         */
        "buttonAriaLabel"?: string;
        /**
          * The color variant of the button.
          * @default 'primary'
         */
        "buttonColor"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'warning'
    | 'danger';
        /**
          * The shape of the button.
          * @default 'rectangle'
         */
        "buttonShape"?: 'circle' | 'ellipse' | 'rectangle' | 'square';
        /**
          * The size of the button.
          * @default 'md'
         */
        "buttonSize"?: DaisySize | 'xl';
        /**
          * The variant of the button.
          * @default 'filled'
         */
        "buttonVariant"?: 'borderless' | 'filled' | 'outlined';
        /**
          * Custom CSS class to apply to the host element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * If true, the button will be disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Indicates that the menu should have a border.
          * @default true
         */
        "menuBordered"?: boolean;
        /**
          * Distance between the button and menu in pixels.
          * @default 10
         */
        "menuOffset"?: number;
        /**
          * The placement of the menu relative to the button.
          * @default 'bottom-start'
         */
        "menuPlacement"?: PopoverPlacement;
        /**
          * The size of the menu.
          * @default 'md'
         */
        "menuSize"?: ModusSize;
        /**
          * The positioning strategy for the menu. Use 'fixed' when the dropdown is inside a clipping ancestor (e.g. overflow:hidden) so the menu escapes to the viewport coordinate space.
          * @default 'absolute'
         */
        "menuStrategy"?: 'absolute' | 'fixed';
        /**
          * Indicates that the menu is visible.
          * @default false
         */
        "menuVisible"?: boolean;
        /**
          * Event emitted when the menuVisible prop changes.
         */
        "onMenuVisibilityChange"?: (event: ModusWcDropdownMenuCustomEvent<{ isVisible: boolean }>) => void;
    }
    /**
     * File dropzone component that allows users to drag and drop files for upload.
     * The component supports a `<slot>` called 'dropzone' for adding custom content such as progress indicators or additional instructions within the dropzone area.
     */
    interface ModusWcFileDropzone {
        /**
          * Accepted file types (e.g. '.jpg,.png' or 'image/*')
         */
        "acceptFileTypes"?: string;
        /**
          * Custom CSS class to apply to the file dropzone element
          * @default ''
         */
        "customClass"?: string;
        /**
          * Disable the file input
         */
        "disabled"?: boolean;
        /**
          * External feedback to display info, success, or error state with optional custom icon and message
         */
        "feedback"?: IFileDropzoneFeedback;
        /**
          * Custom instructions shown when files are dragged over the dropzone
         */
        "fileDraggedOverInstructions"?: string;
        /**
          * Include state icon for default, validation, upload, and feedback states
          * @default true
         */
        "includeStateIcon"?: boolean;
        /**
          * Custom instructions shown as the default dropzone message
         */
        "instructions"?: string;
        /**
          * Custom error message displayed when an invalid file type is selected
         */
        "invalidFileTypeMessage"?: string;
        /**
          * Maximum number of files allowed, will show error if exceeded
         */
        "maxFileCount"?: number;
        /**
          * Maximum allowed length of filename, will show error if exceeded
         */
        "maxFileNameLength"?: number;
        /**
          * Maximum total file size in bytes allowed, will show error if exceeded
         */
        "maxTotalFileSizeBytes"?: number;
        /**
          * Allow multiple file selection
         */
        "multiple"?: boolean;
        /**
          * Event emitted when files are selected
         */
        "onFileSelect"?: (event: ModusWcFileDropzoneCustomEvent<FileList>) => void;
        /**
          * Success message displayed when files are uploaded successfully
         */
        "successMessage"?: string;
    }
    /**
     * A draggable handle component for resizing adjacent elements
     */
    interface ModusWcHandle {
        /**
          * The color of the button.
          * @default 'tertiary'
         */
        "buttonColor"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'warning'
    | 'danger';
        /**
          * The size of the button.
          * @default 'md'
         */
        "buttonSize"?: DaisySize | 'xl';
        /**
          * The variant of the button.
          * @default 'filled'
         */
        "buttonVariant"?: 'borderless' | 'filled' | 'outlined';
        /**
          * Custom CSS class to apply to the handle element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The initial split percentage for the left/top panel (1-100). The right/bottom panel gets the remaining percentage.
          * @default 50
         */
        "defaultSplit"?: number;
        /**
          * The density/spacing of the handle container (compact: 8px, comfortable: 12px, relaxed: 16px).
          * @default 'comfortable'
         */
        "density"?: 'compact' | 'comfortable' | 'relaxed';
        /**
          * The left target element to resize (CSS selector or HTMLElement)
         */
        "leftTarget"?: string | HTMLElement;
        /**
          * The orientation of the handle.
          * @default 'horizontal'
         */
        "orientation"?: Orientation;
        /**
          * The right target element to resize (CSS selector or HTMLElement)
         */
        "rightTarget"?: string | HTMLElement;
        /**
          * The size of the handle.
          * @default 'default'
         */
        "size"?: 'default' | 'lg' | 'xl' | '2xl';
        /**
          * The type of handle to display.
          * @default 'bar'
         */
        "type"?: 'bar' | 'button';
    }
    /**
     * A customizable icon component used to render Modus icons.
     * <b>This component requires Modus icons to be installed in the host application. See [Modus Icon Usage](/docs/documentation-modus-icon-usage--docs) for steps.</b>
     */
    interface ModusWcIcon {
        /**
          * Custom CSS class to apply to the i element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Indicates that the icon is decorative. When true, sets aria-hidden to hide the icon from screen readers.
          * @default true
         */
        "decorative"?: boolean;
        /**
          * The icon name, should match the CSS class in the icon font.
         */
        "name": string;
        /**
          * The icon size, can be "sm", "md", "lg" (a custom size can be specified in CSS). This adjusts the font size for the icon.
          * @default 'md'
         */
        "size"?: DaisySize;
        /**
          * The icon variant, can be "outlined" or "solid".
         */
        "variant"?: 'outlined' | 'solid';
    }
    /**
     * A customizable feedback component used to provide additional context related to form input interactions.
     * <b>To use a custom icon, this component requires Modus icons to be installed in the host application. See [Modus Icon Usage](/docs/documentation-modus-icon-usage--docs) for steps.</b>
     */
    interface ModusWcInputFeedback {
        /**
          * Custom CSS class to apply to the outer div element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The Modus icon to use instead of the pre-defined icons.
          * @default ''
         */
        "icon"?: string;
        /**
          * The level informs which icon and color that will be rendered.
         */
        "level": IInputFeedbackLevel;
        /**
          * The message.
          * @default ''
         */
        "message"?: string;
        /**
          * The size of the feedback component.
          * @default 'md'
         */
        "size"?: ModusSize;
    }
    /**
     * A customizable input label component.
     * The component supports a `<slot>` for injecting additional custom content inside the label, such as icons or formatted text.
     */
    interface ModusWcInputLabel {
        /**
          * Additional classes for custom styling.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The `for` attribute of the label, matching the `id` of the associated input.
         */
        "forId"?: string;
        /**
          * The text to display within the label.
         */
        "labelText"?: string;
        /**
          * Whether the label indicates a required field.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the label.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The text rendered beneath the label.
         */
        "subLabelText"?: string;
    }
    /**
     * A customizable link component used to navigate to URLs.
     */
    interface ModusWcLink {
        /**
          * The color of the link.
          * @default 'primary'
         */
        "color"?: | 'primary'
    | 'secondary'
    | 'tertiary'
    | 'inherit'
    | 'success'
    | 'info'
    | 'warning'
    | 'danger';
        /**
          * Custom CSS class to apply to the link element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The URL to navigate to when the link is activated.
         */
        "href"?: string;
        /**
          * The relationship attribute for the link.
         */
        "rel"?: string;
        /**
          * The browsing context for the link.
         */
        "target"?: string;
        /**
          * The underline behavior of the link.
          * @default 'always'
         */
        "underline"?: 'always' | 'hover' | 'none';
    }
    /**
     * A customizable loader component used to indicate the loading of content
     */
    interface ModusWcLoader {
        /**
          * The color of the loader.
          * @default 'primary'
         */
        "color"?: LoaderColor;
        /**
          * Custom CSS class to apply to the loader element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The size of the loader.
          * @default 'md'
         */
        "size"?: DaisySize;
        /**
          * The variant of the loader.
          * @default 'spinner'
         */
        "variant"?: LoaderVariant;
    }
    /**
     * A component for displaying Trimble product logos with support for both fixed and scalable sizing.
     * Provides consistent branding across applications with various product logo options.
     * Logo colors automatically adapt to the active Modus theme via CSS variables.
     */
    interface ModusWcLogo {
        /**
          * The alt text for accessibility. If not provided, defaults to the logo name.
         */
        "alt"?: string;
        /**
          * Custom CSS class to apply to the logo container.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Show emblem version (icon only) instead of full logo
          * @default false
         */
        "emblem"?: boolean;
        /**
          * The name of the logo to display. Accepts values like 'trimble', 'viewpoint_field_view', etc.
         */
        "name": LogoName;
    }
    /**
     * A customizable menu component used to display a list of li elements vertically or horizontally.
     * The component supports a `<slot>` for injecting custom li elements inside the ul element.
     */
    interface ModusWcMenu {
        /**
          * Indicates that the menu should have a border.
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the ul element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Indicates that this menu is a submenu (dropdown).
         */
        "isSubMenu"?: boolean;
        /**
          * Event emitted when the menu loses focus.
         */
        "onMenuFocusout"?: (event: ModusWcMenuCustomEvent<FocusEvent>) => void;
        /**
          * Event emitted when the selection changes in multiple selection mode. Emits the array of currently selected menu item elements.
         */
        "onMenuSelectionChange"?: (event: ModusWcMenuCustomEvent<{
    selectedItems: HTMLElement[];
  }>) => void;
        /**
          * The orientation of the menu.
          * @default 'vertical'
         */
        "orientation"?: Orientation;
        /**
          * The selection mode of the menu.
          * @default 'single'
         */
        "selectionMode"?: SelectionMode;
        /**
          * The size of the menu.
          * @default 'md'
         */
        "size"?: ModusSize;
    }
    /**
     * A customizable menu item component used to display the item portion of a menu.
     * This component supports a 'start-icon' `<slot>` that allows for custom icons to be placed at the beginning of the item.
     */
    interface ModusWcMenuItem {
        "bordered"?: boolean;
        /**
          * If true, renders a checkbox at the start of the menu item.
         */
        "checkbox"?: boolean;
        /**
          * Custom CSS class to apply to the li element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the menu item.
         */
        "disabled"?: boolean;
        /**
          * The focused state of the menu item.
         */
        "focused"?: boolean;
        /**
          * Whether this menu item has a collapsible submenu. When true, the item will show a caret and handle toggle behavior.
         */
        "hasSubmenu"?: boolean;
        /**
          * The text rendered in the menu item.
          * @default ''
         */
        "label"?: string;
        /**
          * Event emitted when a menu item is selected.
         */
        "onItemSelect"?: (event: ModusWcMenuItemCustomEvent<{
    value: string;
    selected?: boolean;
  }>) => void;
        /**
          * The selected state of the menu item.
         */
        "selected"?: boolean;
        /**
          * The size of the menu item.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The text rendered beneath the label.
         */
        "subLabel"?: string;
        /**
          * The tooltip text to display when hovering over the menu item.
         */
        "tooltipContent"?: string;
        /**
          * The position of the tooltip relative to the menu item.
          * @default 'auto'
         */
        "tooltipPosition"?: 'auto' | 'top' | 'right' | 'bottom' | 'left';
        /**
          * The unique identifying value of the menu item.
          * @default ''
         */
        "value"?: string;
    }
    /**
     * A customizable modal component used to display content in a dialog.
     * This component supports 'header', 'content', and 'footer' `<slot>` elements for inserting custom HTML.
     */
    interface ModusWcModal {
        /**
          * The modal's backdrop. Specify 'static' for a backdrop that doesn't close the modal when clicked outside the modal content.
          * @default 'default'
         */
        "backdrop"?: 'default' | 'static';
        /**
          * Custom CSS class to apply
          * @default ''
         */
        "customClass"?: string;
        /**
          * Specifies whether the modal should be displayed full-screen
          * @default false
         */
        "fullscreen"?: boolean;
        /**
          * The ID of the inner dialog element
         */
        "modalId": string;
        /**
          * Specifies the position of the modal
          * @default 'center'
         */
        "position"?: 'bottom' | 'center' | 'top';
        /**
          * Specifies whether to show the close icon button at the top right of modal
          * @default true
         */
        "showClose"?: boolean;
        /**
          * Specifies whether to show the fullscreen toggle icon button
          * @default false
         */
        "showFullscreenToggle"?: boolean;
    }
    /**
     * A customizable navbar component used for top level navigation of all Trimble applications.
     */
    interface ModusWcNavbar {
        /**
          * The open state of the apps menu.
          * @default false
         */
        "appsMenuOpen"?: boolean;
        /**
          * Applies condensed layout and styling.
          * @default false
         */
        "condensed"?: boolean;
        /**
          * The open state of the condensed menu.
          * @default false
         */
        "condensedMenuOpen"?: boolean;
        /**
          * Custom CSS class to apply to the host element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The name of the logo to display. Supports any valid 'logo-name' from the 'modus-wc-logo' component. Defaults to 'trimble'.
          * @default 'trimble'
         */
        "logoName"?: LogoName;
        /**
          * The open state of the main menu.
          * @default false
         */
        "mainMenuOpen"?: boolean;
        /**
          * The open state of the notifications menu.
          * @default false
         */
        "notificationsMenuOpen"?: boolean;
        /**
          * Event emitted when the AI button is clicked or activated via keyboard.
         */
        "onAiClick"?: (event: ModusWcNavbarCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * Event emitted when the apps button is clicked or activated via keyboard.
         */
        "onAppsClick"?: (event: ModusWcNavbarCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * Event emitted when the apps menu open state changes.
         */
        "onAppsMenuOpenChange"?: (event: ModusWcNavbarCustomEvent<boolean>) => void;
        /**
          * Event emitted when the condensed menu open state changes.
         */
        "onCondensedMenuOpenChange"?: (event: ModusWcNavbarCustomEvent<boolean>) => void;
        /**
          * Event emitted when the help button is clicked or activated via keyboard.
         */
        "onHelpClick"?: (event: ModusWcNavbarCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * Event emitted when the main menu open state changes.
         */
        "onMainMenuOpenChange"?: (event: ModusWcNavbarCustomEvent<boolean>) => void;
        /**
          * Event emitted when the user profile Access MyTrimble button is clicked or activated via keyboard.
         */
        "onMyTrimbleClick"?: (event: ModusWcNavbarCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * Event emitted when the notifications button is clicked or activated via keyboard.
         */
        "onNotificationsClick"?: (event: ModusWcNavbarCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * Event emitted when the notifications menu open state changes.
         */
        "onNotificationsMenuOpenChange"?: (event: ModusWcNavbarCustomEvent<boolean>) => void;
        /**
          * Event emitted when the search input value is changed.
         */
        "onSearchChange"?: (event: ModusWcNavbarCustomEvent<{ value: string }>) => void;
        /**
          * Event emitted when the search button is clicked or activated via keyboard.
         */
        "onSearchClick"?: (event: ModusWcNavbarCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * Event emitted when the search input open state changes.
         */
        "onSearchInputOpenChange"?: (event: ModusWcNavbarCustomEvent<boolean>) => void;
        /**
          * Event emitted when the user profile sign out button is clicked or activated via keyboard.
         */
        "onSignOutClick"?: (event: ModusWcNavbarCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * Event emitted when the logo button is clicked or activated via keyboard,regardless of the `logoName` prop value.
         */
        "onTrimbleLogoClick"?: (event: ModusWcNavbarCustomEvent<MouseEvent | KeyboardEvent>) => void;
        /**
          * Event emitted when the user menu open state changes.
         */
        "onUserMenuOpenChange"?: (event: ModusWcNavbarCustomEvent<boolean>) => void;
        /**
          * Debounce time in milliseconds for search input changes. Default is 300ms.
          * @default 300
         */
        "searchDebounceMs"?: number;
        /**
          * The open state of the search input.
          * @default false
         */
        "searchInputOpen"?: boolean;
        /**
          * Text replacements for the navbar.
         */
        "textOverrides"?: INavbarTextOverrides;
        /**
          * User information used to render the user card.
         */
        "userCard": INavbarUserCard;
        /**
          * The open state of the user menu.
          * @default false
         */
        "userMenuOpen"?: boolean;
        /**
          * The visibility of individual navbar buttons. Default is user profile visible, others hidden.
          * @default {     ai: false,     apps: false,     help: false,     logo: true,     mainMenu: false,     notifications: false,     search: false,     searchInput: false,     user: true,   }
         */
        "visibility"?: INavbarVisibility;
    }
    /**
     * A customizable input component used to create number inputs with types
     */
    interface ModusWcNumberInput {
        /**
          * Hint for form autofill feature.
         */
        "autoComplete"?: 'on' | 'off';
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * The currency symbol to display.
          * @default ''
         */
        "currencySymbol"?: string;
        /**
          * Custom CSS class to apply to the input.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * The input's maximum value.
         */
        "max"?: number;
        /**
          * The input's minimum value.
         */
        "min"?: number;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Event emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcNumberInputCustomEvent<FocusEvent>) => void;
        /**
          * Event emitted when the input value changes.
         */
        "onInputChange"?: (event: ModusWcNumberInputCustomEvent<InputEvent>) => void;
        /**
          * Event emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcNumberInputCustomEvent<FocusEvent>) => void;
        /**
          * Text that appears in the form control when it has no value set.
          * @default ''
         */
        "placeholder"?: string;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The granularity that the value adheres to.
         */
        "step"?: number;
        /**
          * Type of form control.
          * @default 'number'
         */
        "type"?: 'number' | 'range';
        /**
          * The value of the control.
          * @default ''
         */
        "value"?: string;
    }
    /**
     * Pagination component to navigate through pages of content
     */
    interface ModusWcPagination {
        /**
          * Aria label values for pagination buttons
         */
        "ariaLabelValues"?: IAriaLabelValues;
        /**
          * Total number of pages
          * @default 1
         */
        "count"?: number;
        /**
          * Custom CSS class to apply
          * @default ''
         */
        "customClass"?: string;
        /**
          * The next page button text. If not set, an icon control will be used.
         */
        "nextButtonText"?: string;
        /**
          * Event emitted when page changes
         */
        "onPageChange"?: (event: ModusWcPaginationCustomEvent<IPageChange>) => void;
        /**
          * The current page number
          * @default 1
         */
        "page"?: number;
        /**
          * The previous page button text. If not set, an icon control will be used.
         */
        "prevButtonText"?: string;
        /**
          * Size of the pagination buttons
          * @default 'md'
         */
        "size"?: ModusSize;
    }
    /**
     * A customizable panel component used to organize content in a structured layout.
     * This component provides 'header', 'body', and 'footer' `<slot>` elements for inserting custom HTML.
     */
    interface ModusWcPanel {
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Enable floating mode with elevated shadow.
          * @default false
         */
        "floating"?: boolean;
        /**
          * Height of the panel in pixels.
          * @default '700px'
         */
        "height"?: string;
        /**
          * Width of the panel in pixels.
          * @default '350px'
         */
        "width"?: string;
    }
    interface ModusWcProfileMenu {
        /**
          * Configuration for the first menu including title and items
         */
        "menuOne"?: ISubMenu;
        /**
          * Configuration for the second menu including title and items
         */
        "menuTwo"?: ISubMenu;
        /**
          * Emitted when any menu item is clicked, passing back the item value or label
         */
        "onMenuItemClick"?: (event: ModusWcProfileMenuCustomEvent<string>) => void;
        /**
          * Emitted when the Sign Out menu item is clicked
         */
        "onSignOutClick"?: (event: ModusWcProfileMenuCustomEvent<void>) => void;
        /**
          * Profile menu properties containing user information
         */
        "profileProps": IProfileMenuProps;
    }
    /**
     * A customizable progress component used to show the progress of a task or show the passing of time.
     * The radial variant supports slotting in custom HTML to be displayed within the progress circle.
     */
    interface ModusWcProgress {
        /**
          * Custom CSS class to apply to the progress element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The indeterminate state of the progress component.
          * @default false
         */
        "indeterminate"?: boolean;
        /**
          * A text label to render within the progress bar
         */
        "label"?: string;
        /**
          * The progress component's maximum value.
          * @default 100
         */
        "max"?: number;
        /**
          * The value of the progress component.
          * @default 0
         */
        "value"?: number;
        /**
          * The variant of the progress component.
          * @default 'default'
         */
        "variant"?: 'default' | 'radial';
    }
    /**
     * A customizable radio button component.
     */
    interface ModusWcRadio {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the radio.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
          * @default ''
         */
        "name"?: string;
        /**
          * Emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcRadioCustomEvent<FocusEvent>) => void;
        /**
          * Emitted when the input value changes.
         */
        "onInputChange"?: (event: ModusWcRadioCustomEvent<InputEvent>) => void;
        /**
          * Emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcRadioCustomEvent<FocusEvent>) => void;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the radio.
          * @default false
         */
        "value"?: boolean;
    }
    /**
     * A rating component that allows users to choose a rating from predefined options
     */
    interface ModusWcRating {
        /**
          * Whether to allow half-ratings. Only applies to star and heart variants.
          * @default false
         */
        "allowHalf"?: boolean;
        /**
          * The number of rating items to display
          * @default 5
         */
        "count"?: number;
        /**
          * Custom CSS class to apply
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the rating component is disabled
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Function to provide aria-label text for a given rating-item index
          * @default (ratingValue) =>     `Rating item ${ratingValue}`
         */
        "getAriaLabelText"?: (ratingValue: number) => string;
        /**
          * Event emitted when the rating changes
         */
        "onRatingChange"?: (event: ModusWcRatingCustomEvent<IRatingChange>) => void;
        /**
          * The size of the rating component
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The current value of the rating
          * @default 0
         */
        "value"?: number;
        /**
          * The variant of the rating scale
          * @default 'smiley'
         */
        "variant"?: ModusWcRatingVariant;
    }
    /**
     * A customizable select component used to pick a value from a list of options
     */
    interface ModusWcSelect {
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Event emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcSelectCustomEvent<FocusEvent>) => void;
        /**
          * Event emitted when the input value changes.
         */
        "onInputChange"?: (event: ModusWcSelectCustomEvent<InputEvent>) => void;
        /**
          * Event emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcSelectCustomEvent<FocusEvent>) => void;
        /**
          * The options to display in the select dropdown.
          * @default []
         */
        "options"?: ISelectOption[];
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the control.
          * @default ''
         */
        "value"?: string;
    }
    /**
     * A customizable side navigation component for organizing primary navigation and content areas in an application.
     * The component supports a `<slot>` for injecting custom content inside the side navigation panel.
     */
    interface ModusWcSideNavigation {
        /**
          * Whether the side navigation should collapse when clicking outside of it.
          * @default true
         */
        "collapseOnClickOutside"?: boolean;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the side navigation is expanded.
          * @default false
         */
        "expanded"?: boolean;
        /**
          * Maximum width of the side navigation panel in an expanded state.
          * @default '256px'
         */
        "maxWidth"?: string;
        /**
          * Mode to make side navigation either overlay or push the content for the selector specified in targetContent
          * @default 'overlay'
         */
        "mode"?: 'overlay' | 'push';
        /**
          * Event emitted when the expanded state changes (expanded/collapsed).
         */
        "onExpandedChange"?: (event: ModusWcSideNavigationCustomEvent<boolean>) => void;
        /**
          * (optional) Specify the selector for the page's content for which paddings and margins will be set by side navigation based on the mode.
          * @default ''
         */
        "targetContent"?: string;
    }
    /**
     * A customizable skeleton component used to create skeletons of various sizes and shapes
     */
    interface ModusWcSkeleton {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The height of the skeleton.
          * @default 'var(--modus-wc-line-height-md)'
         */
        "height"?: string;
        /**
          * The shape of the skeleton.
          * @default 'rectangle'
         */
        "shape"?: 'circle' | 'rectangle';
        /**
          * The width of the skeleton.
          * @default '100%'
         */
        "width"?: string;
    }
    /**
     * A customizable slider component
     */
    interface ModusWcSlider {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the slider.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * The maximum slider value.
         */
        "max"?: number;
        /**
          * The minimum slider value.
         */
        "min"?: number;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
          * @default ''
         */
        "name"?: string;
        /**
          * Emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcSliderCustomEvent<FocusEvent>) => void;
        /**
          * Emitted when the input value changes.
         */
        "onInputChange"?: (event: ModusWcSliderCustomEvent<InputEvent>) => void;
        /**
          * Emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcSliderCustomEvent<FocusEvent>) => void;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The increment of the slider.
         */
        "step"?: number;
        /**
          * The value of the slider.
          * @default 0
         */
        "value"?: number;
    }
    /**
     * Used to show a list of steps in a process.
     */
    interface ModusWcStepper {
        /**
          * Custom CSS class to apply to the steps element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * If true, steps will be rendered as buttons and emit `stepClick` when activated.
          * @default false
         */
        "interactive"?: boolean;
        /**
          * Emitted with the 0-based step index when a step is activated and `interactive` is true.
         */
        "onStepClick"?: (event: ModusWcStepperCustomEvent<{ index: number }>) => void;
        /**
          * The orientation of the steps.
         */
        "orientation"?: Orientation;
        /**
          * The steps to display.
          * @default []
         */
        "steps"?: IStepperItem[];
    }
    /**
     * A customizable switch component
     */
    interface ModusWcSwitch {
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the switch.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * The indeterminate state of the switch.
          * @default false
         */
        "indeterminate"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
          * @default ''
         */
        "name"?: string;
        /**
          * Emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcSwitchCustomEvent<FocusEvent>) => void;
        /**
          * Emitted when the input value changes.
         */
        "onInputChange"?: (event: ModusWcSwitchCustomEvent<InputEvent>) => void;
        /**
          * Emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcSwitchCustomEvent<FocusEvent>) => void;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize | 'xs';
        /**
          * The value of the switch.
          * @default false
         */
        "value"?: boolean;
    }
    interface ModusWcTable {
        /**
          * Accessibility caption for the table (visually hidden but available to screen readers).
         */
        "caption"?: string;
        /**
          * An array of column definitions.
         */
        "columns": ITableColumn[];
        /**
          * The current page number in pagination (1-based index).
          * @default 1
         */
        "currentPage"?: number;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * An array of data objects.
         */
        "data": Record<string, unknown>[];
        /**
          * The density of the table, used to save space or increase readability.
          * @default 'comfortable'
         */
        "density"?: Density;
        /**
          * Enable cell editing. Either a boolean (all rows) or a predicate per row.
          * @default false
         */
        "editable"?: boolean | ((row: Record<string, unknown>) => boolean);
        /**
          * Enable hover effect on table rows.
          * @default true
         */
        "hover"?: boolean;
        /**
          * Per-row predicate function controlling row selection eligibility.
         */
        "isRowSelectable"?: (row: Record<string, unknown>) => boolean;
        /**
          * Emits when cell editing is committed with the new value.
         */
        "onCellEditCommit"?: (event: ModusWcTableCustomEvent<{
    rowIndex: number;
    colId: string;
    newValue: unknown;
    updatedRow: Record<string, unknown>;
  }>) => void;
        /**
          * Emits when cell editing starts.
         */
        "onCellEditStart"?: (event: ModusWcTableCustomEvent<{
    rowIndex: number;
    colId: string;
  }>) => void;
        /**
          * Emits when pagination changes with the new pagination state.
         */
        "onPaginationChange"?: (event: ModusWcTableCustomEvent<IPaginationChangeEventDetail>) => void;
        /**
          * Emits when a row is clicked.
         */
        "onRowClick"?: (event: ModusWcTableCustomEvent<{
    row: Record<string, unknown>;
    index: number;
  }>) => void;
        /**
          * Emits when row selection changes with the selected rows and their IDs.
         */
        "onRowSelectionChange"?: (event: ModusWcTableCustomEvent<{
    selectedRows: Record<string, unknown>[];
    selectedRowIds: string[];
  }>) => void;
        /**
          * Emits when sorting changes with the new sorting state.
         */
        "onSortChange"?: (event: ModusWcTableCustomEvent<SortingState>) => void;
        /**
          * Available options for the number of rows per page.
          * @default [5, 10, 15]
         */
        "pageSizeOptions"?: number[];
        /**
          * Enable pagination for the table.
          * @default false
         */
        "paginated"?: boolean;
        /**
          * Row selection mode: 'none' for no selection, 'single' for single row, 'multi' for multiple rows.
          * @default 'none'
         */
        "selectable"?: 'none' | 'single' | 'multi';
        /**
          * Array of selected row IDs. Used for controlled selection state.
         */
        "selectedRowIds"?: string[];
        /**
          * Show/hide the page size selector in pagination.
          * @default true
         */
        "showPageSizeSelector"?: boolean;
        /**
          * Enable sorting functionality for sortable columns.
          * @default true
         */
        "sortable"?: boolean;
        /**
          * Zebra striped tables differentiate rows by styling them in an alternating fashion.
          * @default false
         */
        "zebra"?: boolean;
    }
    /**
     * A customizable tabs component used to create groups of tabs.
     * The component supports a `<slot>` for injecting custom tab content.
     */
    interface ModusWcTabs {
        /**
          * The current active tab
          * @default 0
         */
        "activeTabIndex"?: number;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * When a tab is switched to, this event outputs the relevant indices
         */
        "onTabChange"?: (event: ModusWcTabsCustomEvent<{
    previousTab: number;
    newTab: number;
  }>) => void;
        /**
          * The size of the tabs.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * Additional styling for the tabs.
          * @default 'bordered'
         */
        "tabStyle"?: 'boxed' | 'bordered' | 'lifted' | 'none';
        /**
          * The tabs to display.
          * @default []
         */
        "tabs"?: ITab[];
    }
    /**
     * A customizable input component used to create text inputs with types.
     * The component supports a `<slot>` for injecting additional custom content inside the input, such as icons or formatted text.
     */
    interface ModusWcTextInput {
        /**
          * Controls automatic capitalization in inputted text.
         */
        "autoCapitalize"?: | 'off'
    | 'none'
    | 'on'
    | 'sentences'
    | 'words'
    | 'characters';
        /**
          * Hint for form autofill feature.
         */
        "autoComplete"?: AutocompleteTypes;
        /**
          * Controls automatic correction in inputted text. Support by browser varies.
         */
        "autoCorrect"?: 'on' | 'off';
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Aria label for the clear icon button.
          * @default 'Clear text'
         */
        "clearAriaLabel"?: string;
        /**
          * Custom CSS class to apply to the input.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * A hint to the browser for which enter key to display.
         */
        "enterkeyhint"?: | 'enter'
    | 'done'
    | 'go'
    | 'next'
    | 'previous'
    | 'search'
    | 'send';
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * Show the clear button within the input field.
          * @default false
         */
        "includeClear"?: boolean;
        /**
          * Show the search icon within the input field.
          * @default false
         */
        "includeSearch"?: boolean;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Maximum length (number of characters) of value.
         */
        "maxLength"?: number;
        /**
          * Minimum length (number of characters) of value.
         */
        "minLength"?: number;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Event emitted when the clear button is clicked.
         */
        "onClearClick"?: (event: ModusWcTextInputCustomEvent<void>) => void;
        /**
          * Event emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcTextInputCustomEvent<FocusEvent>) => void;
        /**
          * Event emitted when the input value changes.
         */
        "onInputChange"?: (event: ModusWcTextInputCustomEvent<InputEvent>) => void;
        /**
          * Event emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcTextInputCustomEvent<FocusEvent>) => void;
        /**
          * Pattern the value must match to be valid
         */
        "pattern"?: string;
        /**
          * Text that appears in the form control when it has no value set.
          * @default ''
         */
        "placeholder"?: string;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * Type of form control.
          * @default 'text'
         */
        "type"?: TextFieldTypes;
        /**
          * The value of the control.
          * @default ''
         */
        "value"?: string;
    }
    /**
     * A customizable textarea component.
     */
    interface ModusWcTextarea {
        /**
          * Controls automatic correction in inputted text. Support by browser varies.
         */
        "autoCorrect"?: 'on' | 'off';
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the textarea (supports DaisyUI).
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the textarea.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * A hint to the browser for which enter key to display.
         */
        "enterkeyhint"?: | 'enter'
    | 'done'
    | 'go'
    | 'next'
    | 'previous'
    | 'search'
    | 'send';
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * The tabindex of the input.
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * The maximum number of characters allowed in the textarea.
         */
        "maxLength"?: number;
        /**
          * The minimum number of characters required in the textarea.
         */
        "minLength"?: number;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcTextareaCustomEvent<FocusEvent>) => void;
        /**
          * Emitted when the input value changes.
         */
        "onInputChange"?: (event: ModusWcTextareaCustomEvent<InputEvent>) => void;
        /**
          * Emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcTextareaCustomEvent<FocusEvent>) => void;
        /**
          * The placeholder text for the textarea.
          * @default ''
         */
        "placeholder"?: string;
        /**
          * The readonly state of the textarea.
          * @default false
         */
        "readonly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * The number of visible text lines for the textarea.
         */
        "rows"?: number;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The value of the textarea.
          * @default ''
         */
        "value"?: string;
    }
    interface ModusWcThemeProvider {
        "initialTheme"?: Partial<IThemeConfig>;
    }
    /**
     * A theme switcher component used to toggle the application theme and/or mode.
     * Allows consumers to set the initial theme (Modus Classic, Modus Modern, etc.) and end-users to toggle modes (Light, Dark).
     */
    interface ModusWcThemeSwitcher {
        /**
          * Custom CSS class to apply to the theme switcher element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * An event that fires when the theme is changed.
         */
        "onThemeChange"?: (event: ModusWcThemeSwitcherCustomEvent<IThemeConfig>) => void;
    }
    /**
     * A customizable input component used to create time inputs.
     */
    interface ModusWcTimeInput {
        /**
          * Hint for form autofill feature.
         */
        "autoComplete"?: 'on' | 'off';
        /**
          * Indicates that the input should have a border.
          * @default true
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the input.
          * @default ''
         */
        "customClass"?: string;
        /**
          * ID of a `<datalist>` element that contains pre-defined time options. The value must be the ID of a `<datalist>` element in the same document.
         */
        "datalistId"?: string;
        /**
          * The options to display in the time input dropdown. Options must be in `HH:mm` or `HH:mm:ss` format.
          * @default []
         */
        "datalistOptions"?: string[];
        /**
          * Whether the form control is disabled.
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Feedback to render below the input.
         */
        "feedback"?: IInputFeedbackProp;
        /**
          * The ID of the input element.
         */
        "inputId"?: string;
        /**
          * Determine the control's relative ordering for sequential focus navigation (typically with the Tab key).
         */
        "inputTabIndex"?: number;
        /**
          * The text to display within the label.
         */
        "label"?: string;
        /**
          * Maximum value. Format: `HH:mm`, `HH:mm:ss`.
         */
        "max"?: string;
        /**
          * Minimum value. Format: `HH:mm`, `HH:mm:ss.`
         */
        "min"?: string;
        /**
          * Name of the form control. Submitted with the form as part of a name/value pair.
         */
        "name"?: string;
        /**
          * Event emitted when the input loses focus.
         */
        "onInputBlur"?: (event: ModusWcTimeInputCustomEvent<FocusEvent>) => void;
        /**
          * Event emitted when the input value changes.
         */
        "onInputChange"?: (event: ModusWcTimeInputCustomEvent<Event>) => void;
        /**
          * Event emitted when the input gains focus.
         */
        "onInputFocus"?: (event: ModusWcTimeInputCustomEvent<FocusEvent>) => void;
        /**
          * Whether the value is editable.
          * @default false
         */
        "readOnly"?: boolean;
        /**
          * A value is required for the form to be submittable.
          * @default false
         */
        "required"?: boolean;
        /**
          * Displays the time input format as `HH:mm:ss` if `true`. Internally sets the `step` to 1 second. If a `step` value is provided, it will override this attribute.
          * @default false
         */
        "showSeconds"?: boolean;
        /**
          * The size of the input.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * Specifies the granularity that the `value` must adhere to. Value of step given in seconds. Default value is 60 seconds. Overrides the `seconds` attribute if both are provided.
         */
        "step"?: number;
        /**
          * The value of the time input. Always in 24-hour format that includes leading zeros: `HH:mm` or `HH:mm:ss`, regardless of input format which is likely to be selected based on user's locale (or by the user agent). If time includes seconds the format is always `HH:mm:ss`.
          * @default ''
         */
        "value"?: string;
    }
    /**
     * A customizable toast component used to stack elements, positioned on the corner of a page.
     * The component supports a `<slot>` for injecting additional custom content inside the toast.
     */
    interface ModusWcToast {
        /**
          * Additional classes for custom styling.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Time taken to dismiss the toast in milliseconds
         */
        "delay"?: number;
        /**
          * The position of the toast in the parent container.
          * @default 'top-end'
         */
        "position"?: ToastPosition;
    }
    /**
     * A customizable toolbar component used to organize content across the entire page.
     * This component provides 'start', 'center', and 'end' `<slot>` elements for inserting custom HTML.
     */
    interface ModusWcToolbar {
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
    }
    /**
     * A customizable tooltip component used to create tooltips with different content.
     * The tooltip can be dismissed by pressing the Escape key when hovering over it.
     * When forceOpen is enabled, the tooltip will remain open and can only be closed by setting forceOpen to false.
     * Use the contentElement prop to supply rich HTML content to the tooltip such as multiline text.
     * For plain dynamic text, prefer the content prop instead. When contentElement is set, it takes precedence over the content prop.
     */
    interface ModusWcTooltip {
        /**
          * The text content of the tooltip. When contentElement is also set, contentElement takes precedence.
          * @default ''
         */
        "content"?: string;
        /**
          * An optional rich HTML element to render as the tooltip body. When set, this takes precedence over the `content` string prop. The element is deep-cloned into the tooltip container.
         */
        "contentElement"?: HTMLElement;
        /**
          * Custom CSS class to apply to the inner div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Disables displaying the tooltip on hover
          * @default false
         */
        "disabled"?: boolean;
        /**
          * Use this attribute to force the tooltip to remain open.
         */
        "forceOpen"?: boolean;
        /**
          * An event that fires when the tooltip is dismissed via Escape key
         */
        "onDismissEscape"?: (event: ModusWcTooltipCustomEvent<any>) => void;
        /**
          * The position that the tooltip will render in relation to the element.
          * @default 'auto'
         */
        "position"?: 'auto' | 'top' | 'right' | 'bottom' | 'left';
        /**
          * The ID of the tooltip element, useful for setting the "aria-describedby" attribute of related elements.
         */
        "tooltipId"?: string;
    }
    /**
     * A customizable tree item component used to display the item portion of a tree menu.
     * This component supports `start` and `end` slots for custom content at the beginning and end of the item.
     */
    interface ModusWcTreeItem {
        /**
          * When true, prevents the built-in inline submenu toggle on click. The item will only emit `itemSelect` so the consumer can handle the expansion externally (e.g. show a flyout panel). Only has an effect when `hasSubmenu` is also true.
         */
        "blockExpand"?: boolean;
        "bordered"?: boolean;
        /**
          * If true, renders a checkbox at the start of the tree item.
         */
        "checkbox"?: boolean;
        /**
          * Custom CSS class to apply to the li element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The disabled state of the tree item.
         */
        "disabled"?: boolean;
        /**
          * The focused state of the tree item.
         */
        "focused"?: boolean;
        /**
          * Whether this tree item has a collapsible submenu. When true, the item will show a caret and handle toggle behavior.
         */
        "hasSubmenu"?: boolean;
        /**
          * The text rendered in the tree item.
          * @default ''
         */
        "label"?: string;
        /**
          * Event emitted when a tree item is selected.
         */
        "onItemSelect"?: (event: ModusWcTreeItemCustomEvent<{
    value: string;
    selected?: boolean;
  }>) => void;
        /**
          * The selected state of the tree item.
         */
        "selected"?: boolean;
        /**
          * The size of the tree item.
          * @default 'md'
         */
        "size"?: ModusSize;
        /**
          * The text rendered beneath the label.
         */
        "subLabel"?: string;
        /**
          * The tooltip text to display when hovering over the tree item.
         */
        "tooltipContent"?: string;
        /**
          * The position of the tooltip relative to the tree item.
          * @default 'auto'
         */
        "tooltipPosition"?: 'auto' | 'top' | 'right' | 'bottom' | 'left';
        /**
          * The unique identifying value of the tree item.
          * @default ''
         */
        "value"?: string;
    }
    /**
     * A customizable tree menu component used to display a list of modus-wc-tree-item elements vertically or horizontally.
     * The component supports a `<slot>` for injecting custom modus-wc-tree-item elements inside the ul element.
     */
    interface ModusWcTreeMenu {
        /**
          * Indicates that the tree menu should have a border.
         */
        "bordered"?: boolean;
        /**
          * Custom CSS class to apply to the ul element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * Indicates that this tree menu is a submenu (dropdown).
         */
        "isSubMenu"?: boolean;
        /**
          * Event emitted when the tree menu loses focus.
         */
        "onMenuFocusout"?: (event: ModusWcTreeMenuCustomEvent<FocusEvent>) => void;
        /**
          * Event emitted when the selection changes in multiple selection mode. Emits the array of currently selected tree item elements.
         */
        "onMenuSelectionChange"?: (event: ModusWcTreeMenuCustomEvent<{
    selectedItems: HTMLElement[];
  }>) => void;
        /**
          * The orientation of the tree menu.
          * @default 'vertical'
         */
        "orientation"?: Orientation;
        /**
          * The selection mode of the tree menu.
          * @default 'single'
         */
        "selectionMode"?: SelectionMode;
        /**
          * The size of the tree menu.
          * @default 'md'
         */
        "size"?: ModusSize;
    }
    /**
     * A customizable typography component used to render text with different sizes, hierarchy, and weights.
     * Note:
     * - When using heading elements (h1-h6), the default heading CSS styling can be accessed without modifying
     * the default size (size="md") and weight (weight="normal") properties. Default styling can be overridden by
     * providing your own custom values for the size or weight properties from the available options.
     * - If both slot content and `label` are provided, only the slot content will be rendered
     * - Use the `label` prop when you need to dynamically update the text.
     */
    interface ModusWcTypography {
        /**
          * Custom CSS class to apply to the typography element.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The hierarchy of the typography component.
          * @default 'p'
         */
        "hierarchy"?: TypographyHierarchy;
        /**
          * The text label to display.
         */
        "label": string;
        /**
          * The size of the font.
          * @default 'md'
         */
        "size"?: TypographySize;
        /**
          * The weight of the text.
          * @default 'normal'
         */
        "weight"?: TypographyWeight;
    }
    interface ModusWcUtilityPanel {
        /**
          * Custom CSS class to apply to the outer div.
          * @default ''
         */
        "customClass"?: string;
        /**
          * The panel is expanded or closed
          * @default false
         */
        "expanded"?: boolean;
        /**
          * An event that fires when the panel is closed.
         */
        "onPanelClosed"?: (event: ModusWcUtilityPanelCustomEvent<void>) => void;
        /**
          * An event that fires when the panel is opened.
         */
        "onPanelOpened"?: (event: ModusWcUtilityPanelCustomEvent<void>) => void;
        /**
          * Determines if the panel pushes content or displays an overlay.
          * @default false
         */
        "pushContent"?: boolean;
        /**
          * Target element reference to push content when panel opens
         */
        "targetElement"?: HTMLElement;
    }
    interface IntrinsicElements {
        "modus-wc-accordion": ModusWcAccordion;
        "modus-wc-alert": ModusWcAlert;
        "modus-wc-app-menu": ModusWcAppMenu;
        "modus-wc-autocomplete": ModusWcAutocomplete;
        "modus-wc-avatar": ModusWcAvatar;
        "modus-wc-badge": ModusWcBadge;
        "modus-wc-bottom-sheet": ModusWcBottomSheet;
        "modus-wc-breadcrumbs": ModusWcBreadcrumbs;
        "modus-wc-button": ModusWcButton;
        "modus-wc-button-group": ModusWcButtonGroup;
        "modus-wc-card": ModusWcCard;
        "modus-wc-checkbox": ModusWcCheckbox;
        "modus-wc-chip": ModusWcChip;
        "modus-wc-collapse": ModusWcCollapse;
        "modus-wc-date": ModusWcDate;
        "modus-wc-divider": ModusWcDivider;
        "modus-wc-dropdown-menu": ModusWcDropdownMenu;
        "modus-wc-file-dropzone": ModusWcFileDropzone;
        "modus-wc-handle": ModusWcHandle;
        "modus-wc-icon": ModusWcIcon;
        "modus-wc-input-feedback": ModusWcInputFeedback;
        "modus-wc-input-label": ModusWcInputLabel;
        "modus-wc-link": ModusWcLink;
        "modus-wc-loader": ModusWcLoader;
        "modus-wc-logo": ModusWcLogo;
        "modus-wc-menu": ModusWcMenu;
        "modus-wc-menu-item": ModusWcMenuItem;
        "modus-wc-modal": ModusWcModal;
        "modus-wc-navbar": ModusWcNavbar;
        "modus-wc-number-input": ModusWcNumberInput;
        "modus-wc-pagination": ModusWcPagination;
        "modus-wc-panel": ModusWcPanel;
        "modus-wc-profile-menu": ModusWcProfileMenu;
        "modus-wc-progress": ModusWcProgress;
        "modus-wc-radio": ModusWcRadio;
        "modus-wc-rating": ModusWcRating;
        "modus-wc-select": ModusWcSelect;
        "modus-wc-side-navigation": ModusWcSideNavigation;
        "modus-wc-skeleton": ModusWcSkeleton;
        "modus-wc-slider": ModusWcSlider;
        "modus-wc-stepper": ModusWcStepper;
        "modus-wc-switch": ModusWcSwitch;
        "modus-wc-table": ModusWcTable;
        "modus-wc-tabs": ModusWcTabs;
        "modus-wc-text-input": ModusWcTextInput;
        "modus-wc-textarea": ModusWcTextarea;
        "modus-wc-theme-provider": ModusWcThemeProvider;
        "modus-wc-theme-switcher": ModusWcThemeSwitcher;
        "modus-wc-time-input": ModusWcTimeInput;
        "modus-wc-toast": ModusWcToast;
        "modus-wc-toolbar": ModusWcToolbar;
        "modus-wc-tooltip": ModusWcTooltip;
        "modus-wc-tree-item": ModusWcTreeItem;
        "modus-wc-tree-menu": ModusWcTreeMenu;
        "modus-wc-typography": ModusWcTypography;
        "modus-wc-utility-panel": ModusWcUtilityPanel;
    }
}
export { LocalJSX as JSX };
declare module "@stencil/core" {
    export namespace JSX {
        interface IntrinsicElements {
            /**
             * A customizable accordion component used for showing and hiding related groups of content.
             * The component supports a `<slot>` called 'content' for injecting `<modus-wc-collapse>` elements. See [Collapse](/docs/components-collapse--docs) docs for additional info.
             */
            "modus-wc-accordion": LocalJSX.ModusWcAccordion & JSXBase.HTMLAttributes<HTMLModusWcAccordionElement>;
            /**
             * A customizable alert component used to inform the user about important events.
             * The component supports `<slot>` elements for injecting custom content and buttons.
             */
            "modus-wc-alert": LocalJSX.ModusWcAlert & JSXBase.HTMLAttributes<HTMLModusWcAlertElement>;
            "modus-wc-app-menu": LocalJSX.ModusWcAppMenu & JSXBase.HTMLAttributes<HTMLModusWcAppMenuElement>;
            /**
             * A customizable autocomplete component used to create searchable text inputs.
             * The component supports a `<slot>` for injecting custom content.
             */
            "modus-wc-autocomplete": LocalJSX.ModusWcAutocomplete & JSXBase.HTMLAttributes<HTMLModusWcAutocompleteElement>;
            /**
             * A customizable avatar component used to create avatars with different images or user initials.
             * When no image is provided, the component can display initials (up to 3 characters) from the initials prop.
             * The component will extract the first letter of each word in the initials string.
             */
            "modus-wc-avatar": LocalJSX.ModusWcAvatar & JSXBase.HTMLAttributes<HTMLModusWcAvatarElement>;
            /**
             * A customizable badge component used to create badges with different sizes, types, and colors.
             * The component supports a `<slot>` for injecting content within the badge.
             */
            "modus-wc-badge": LocalJSX.ModusWcBadge & JSXBase.HTMLAttributes<HTMLModusWcBadgeElement>;
            "modus-wc-bottom-sheet": LocalJSX.ModusWcBottomSheet & JSXBase.HTMLAttributes<HTMLModusWcBottomSheetElement>;
            /**
             * A customizable breadcrumbs component used to help users navigate through a website.
             */
            "modus-wc-breadcrumbs": LocalJSX.ModusWcBreadcrumbs & JSXBase.HTMLAttributes<HTMLModusWcBreadcrumbsElement>;
            /**
             * A customizable button component used to create buttons with different sizes, variants, and types.
             * The component supports a `<slot>` for injecting content within the button, similar to a native HTML button.
             */
            "modus-wc-button": LocalJSX.ModusWcButton & JSXBase.HTMLAttributes<HTMLModusWcButtonElement>;
            /**
             * A customizable buttongroup component that groups multiple Modus buttons together.
             * The component supports a `<slot>` for injecting content within the buttongroup.
             */
            "modus-wc-button-group": LocalJSX.ModusWcButtonGroup & JSXBase.HTMLAttributes<HTMLModusWcButtonGroupElement>;
            /**
             * A customizable card component used to group and display content in a way that is easily readable.
             * This component supports multiple `<slot>` elements including 'header' for images or custom content, 'title', 'subtitle', a default slot for main content, 'actions' for buttons or interactive elements, and 'footer'.
             */
            "modus-wc-card": LocalJSX.ModusWcCard & JSXBase.HTMLAttributes<HTMLModusWcCardElement>;
            /**
             * A customizable checkbox component
             */
            "modus-wc-checkbox": LocalJSX.ModusWcCheckbox & JSXBase.HTMLAttributes<HTMLModusWcCheckboxElement>;
            /**
             * A customizable chip component used to display information in a compact area
             * The component supports a `<slot>` for injecting custom content such as avatar and icons.
             */
            "modus-wc-chip": LocalJSX.ModusWcChip & JSXBase.HTMLAttributes<HTMLModusWcChipElement>;
            /**
             * A customizable collapse component used for showing and hiding content.
             * The component supports a 'header' and 'content' `<slot>` for injecting custom HTML.
             */
            "modus-wc-collapse": LocalJSX.ModusWcCollapse & JSXBase.HTMLAttributes<HTMLModusWcCollapseElement>;
            /**
             * A customizable date picker component used to create date inputs.
             * Adheres to WCAG 2.2 standards.
             */
            "modus-wc-date": LocalJSX.ModusWcDate & JSXBase.HTMLAttributes<HTMLModusWcDateElement>;
            /**
             * A customizable divider component used to separate content horizontally or vertically
             */
            "modus-wc-divider": LocalJSX.ModusWcDivider & JSXBase.HTMLAttributes<HTMLModusWcDividerElement>;
            /**
             * A customizable dropdown menu component used to render a button and toggleable menu.
             * The component supports a 'button' and 'menu' `<slot>` for injecting custom HTML content.
             */
            "modus-wc-dropdown-menu": LocalJSX.ModusWcDropdownMenu & JSXBase.HTMLAttributes<HTMLModusWcDropdownMenuElement>;
            /**
             * File dropzone component that allows users to drag and drop files for upload.
             * The component supports a `<slot>` called 'dropzone' for adding custom content such as progress indicators or additional instructions within the dropzone area.
             */
            "modus-wc-file-dropzone": LocalJSX.ModusWcFileDropzone & JSXBase.HTMLAttributes<HTMLModusWcFileDropzoneElement>;
            /**
             * A draggable handle component for resizing adjacent elements
             */
            "modus-wc-handle": LocalJSX.ModusWcHandle & JSXBase.HTMLAttributes<HTMLModusWcHandleElement>;
            /**
             * A customizable icon component used to render Modus icons.
             * <b>This component requires Modus icons to be installed in the host application. See [Modus Icon Usage](/docs/documentation-modus-icon-usage--docs) for steps.</b>
             */
            "modus-wc-icon": LocalJSX.ModusWcIcon & JSXBase.HTMLAttributes<HTMLModusWcIconElement>;
            /**
             * A customizable feedback component used to provide additional context related to form input interactions.
             * <b>To use a custom icon, this component requires Modus icons to be installed in the host application. See [Modus Icon Usage](/docs/documentation-modus-icon-usage--docs) for steps.</b>
             */
            "modus-wc-input-feedback": LocalJSX.ModusWcInputFeedback & JSXBase.HTMLAttributes<HTMLModusWcInputFeedbackElement>;
            /**
             * A customizable input label component.
             * The component supports a `<slot>` for injecting additional custom content inside the label, such as icons or formatted text.
             */
            "modus-wc-input-label": LocalJSX.ModusWcInputLabel & JSXBase.HTMLAttributes<HTMLModusWcInputLabelElement>;
            /**
             * A customizable link component used to navigate to URLs.
             */
            "modus-wc-link": LocalJSX.ModusWcLink & JSXBase.HTMLAttributes<HTMLModusWcLinkElement>;
            /**
             * A customizable loader component used to indicate the loading of content
             */
            "modus-wc-loader": LocalJSX.ModusWcLoader & JSXBase.HTMLAttributes<HTMLModusWcLoaderElement>;
            /**
             * A component for displaying Trimble product logos with support for both fixed and scalable sizing.
             * Provides consistent branding across applications with various product logo options.
             * Logo colors automatically adapt to the active Modus theme via CSS variables.
             */
            "modus-wc-logo": LocalJSX.ModusWcLogo & JSXBase.HTMLAttributes<HTMLModusWcLogoElement>;
            /**
             * A customizable menu component used to display a list of li elements vertically or horizontally.
             * The component supports a `<slot>` for injecting custom li elements inside the ul element.
             */
            "modus-wc-menu": LocalJSX.ModusWcMenu & JSXBase.HTMLAttributes<HTMLModusWcMenuElement>;
            /**
             * A customizable menu item component used to display the item portion of a menu.
             * This component supports a 'start-icon' `<slot>` that allows for custom icons to be placed at the beginning of the item.
             */
            "modus-wc-menu-item": LocalJSX.ModusWcMenuItem & JSXBase.HTMLAttributes<HTMLModusWcMenuItemElement>;
            /**
             * A customizable modal component used to display content in a dialog.
             * This component supports 'header', 'content', and 'footer' `<slot>` elements for inserting custom HTML.
             */
            "modus-wc-modal": LocalJSX.ModusWcModal & JSXBase.HTMLAttributes<HTMLModusWcModalElement>;
            /**
             * A customizable navbar component used for top level navigation of all Trimble applications.
             */
            "modus-wc-navbar": LocalJSX.ModusWcNavbar & JSXBase.HTMLAttributes<HTMLModusWcNavbarElement>;
            /**
             * A customizable input component used to create number inputs with types
             */
            "modus-wc-number-input": LocalJSX.ModusWcNumberInput & JSXBase.HTMLAttributes<HTMLModusWcNumberInputElement>;
            /**
             * Pagination component to navigate through pages of content
             */
            "modus-wc-pagination": LocalJSX.ModusWcPagination & JSXBase.HTMLAttributes<HTMLModusWcPaginationElement>;
            /**
             * A customizable panel component used to organize content in a structured layout.
             * This component provides 'header', 'body', and 'footer' `<slot>` elements for inserting custom HTML.
             */
            "modus-wc-panel": LocalJSX.ModusWcPanel & JSXBase.HTMLAttributes<HTMLModusWcPanelElement>;
            "modus-wc-profile-menu": LocalJSX.ModusWcProfileMenu & JSXBase.HTMLAttributes<HTMLModusWcProfileMenuElement>;
            /**
             * A customizable progress component used to show the progress of a task or show the passing of time.
             * The radial variant supports slotting in custom HTML to be displayed within the progress circle.
             */
            "modus-wc-progress": LocalJSX.ModusWcProgress & JSXBase.HTMLAttributes<HTMLModusWcProgressElement>;
            /**
             * A customizable radio button component.
             */
            "modus-wc-radio": LocalJSX.ModusWcRadio & JSXBase.HTMLAttributes<HTMLModusWcRadioElement>;
            /**
             * A rating component that allows users to choose a rating from predefined options
             */
            "modus-wc-rating": LocalJSX.ModusWcRating & JSXBase.HTMLAttributes<HTMLModusWcRatingElement>;
            /**
             * A customizable select component used to pick a value from a list of options
             */
            "modus-wc-select": LocalJSX.ModusWcSelect & JSXBase.HTMLAttributes<HTMLModusWcSelectElement>;
            /**
             * A customizable side navigation component for organizing primary navigation and content areas in an application.
             * The component supports a `<slot>` for injecting custom content inside the side navigation panel.
             */
            "modus-wc-side-navigation": LocalJSX.ModusWcSideNavigation & JSXBase.HTMLAttributes<HTMLModusWcSideNavigationElement>;
            /**
             * A customizable skeleton component used to create skeletons of various sizes and shapes
             */
            "modus-wc-skeleton": LocalJSX.ModusWcSkeleton & JSXBase.HTMLAttributes<HTMLModusWcSkeletonElement>;
            /**
             * A customizable slider component
             */
            "modus-wc-slider": LocalJSX.ModusWcSlider & JSXBase.HTMLAttributes<HTMLModusWcSliderElement>;
            /**
             * Used to show a list of steps in a process.
             */
            "modus-wc-stepper": LocalJSX.ModusWcStepper & JSXBase.HTMLAttributes<HTMLModusWcStepperElement>;
            /**
             * A customizable switch component
             */
            "modus-wc-switch": LocalJSX.ModusWcSwitch & JSXBase.HTMLAttributes<HTMLModusWcSwitchElement>;
            "modus-wc-table": LocalJSX.ModusWcTable & JSXBase.HTMLAttributes<HTMLModusWcTableElement>;
            /**
             * A customizable tabs component used to create groups of tabs.
             * The component supports a `<slot>` for injecting custom tab content.
             */
            "modus-wc-tabs": LocalJSX.ModusWcTabs & JSXBase.HTMLAttributes<HTMLModusWcTabsElement>;
            /**
             * A customizable input component used to create text inputs with types.
             * The component supports a `<slot>` for injecting additional custom content inside the input, such as icons or formatted text.
             */
            "modus-wc-text-input": LocalJSX.ModusWcTextInput & JSXBase.HTMLAttributes<HTMLModusWcTextInputElement>;
            /**
             * A customizable textarea component.
             */
            "modus-wc-textarea": LocalJSX.ModusWcTextarea & JSXBase.HTMLAttributes<HTMLModusWcTextareaElement>;
            "modus-wc-theme-provider": LocalJSX.ModusWcThemeProvider & JSXBase.HTMLAttributes<HTMLModusWcThemeProviderElement>;
            /**
             * A theme switcher component used to toggle the application theme and/or mode.
             * Allows consumers to set the initial theme (Modus Classic, Modus Modern, etc.) and end-users to toggle modes (Light, Dark).
             */
            "modus-wc-theme-switcher": LocalJSX.ModusWcThemeSwitcher & JSXBase.HTMLAttributes<HTMLModusWcThemeSwitcherElement>;
            /**
             * A customizable input component used to create time inputs.
             */
            "modus-wc-time-input": LocalJSX.ModusWcTimeInput & JSXBase.HTMLAttributes<HTMLModusWcTimeInputElement>;
            /**
             * A customizable toast component used to stack elements, positioned on the corner of a page.
             * The component supports a `<slot>` for injecting additional custom content inside the toast.
             */
            "modus-wc-toast": LocalJSX.ModusWcToast & JSXBase.HTMLAttributes<HTMLModusWcToastElement>;
            /**
             * A customizable toolbar component used to organize content across the entire page.
             * This component provides 'start', 'center', and 'end' `<slot>` elements for inserting custom HTML.
             */
            "modus-wc-toolbar": LocalJSX.ModusWcToolbar & JSXBase.HTMLAttributes<HTMLModusWcToolbarElement>;
            /**
             * A customizable tooltip component used to create tooltips with different content.
             * The tooltip can be dismissed by pressing the Escape key when hovering over it.
             * When forceOpen is enabled, the tooltip will remain open and can only be closed by setting forceOpen to false.
             * Use the contentElement prop to supply rich HTML content to the tooltip such as multiline text.
             * For plain dynamic text, prefer the content prop instead. When contentElement is set, it takes precedence over the content prop.
             */
            "modus-wc-tooltip": LocalJSX.ModusWcTooltip & JSXBase.HTMLAttributes<HTMLModusWcTooltipElement>;
            /**
             * A customizable tree item component used to display the item portion of a tree menu.
             * This component supports `start` and `end` slots for custom content at the beginning and end of the item.
             */
            "modus-wc-tree-item": LocalJSX.ModusWcTreeItem & JSXBase.HTMLAttributes<HTMLModusWcTreeItemElement>;
            /**
             * A customizable tree menu component used to display a list of modus-wc-tree-item elements vertically or horizontally.
             * The component supports a `<slot>` for injecting custom modus-wc-tree-item elements inside the ul element.
             */
            "modus-wc-tree-menu": LocalJSX.ModusWcTreeMenu & JSXBase.HTMLAttributes<HTMLModusWcTreeMenuElement>;
            /**
             * A customizable typography component used to render text with different sizes, hierarchy, and weights.
             * Note:
             * - When using heading elements (h1-h6), the default heading CSS styling can be accessed without modifying
             * the default size (size="md") and weight (weight="normal") properties. Default styling can be overridden by
             * providing your own custom values for the size or weight properties from the available options.
             * - If both slot content and `label` are provided, only the slot content will be rendered
             * - Use the `label` prop when you need to dynamically update the text.
             */
            "modus-wc-typography": LocalJSX.ModusWcTypography & JSXBase.HTMLAttributes<HTMLModusWcTypographyElement>;
            "modus-wc-utility-panel": LocalJSX.ModusWcUtilityPanel & JSXBase.HTMLAttributes<HTMLModusWcUtilityPanelElement>;
        }
    }
}