@six-group/ui-library 0.0.0-insider.756155a → 0.0.0-insider.777a428

package/dist/types/components/six-alert/six-alert.d.ts

@@ -23,10 +23,11 @@ export declare class SixAlert {
     /** Set to true to make the alert closable. */
     closable: boolean;
     /** The type of alert. */
-    type: 'primary' | 'success' | 'info' | 'warning' | 'danger';
+    type: AlertType;
     /**
-     * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the
-     * alert before it closes (e.g. moves the mouse over it), the timer will restart.
+     * The length of time, in milliseconds, the alert will show before closing itself.
+     * If the user hovers over the toast alert, the timer will pause.
+     * On leaving the element with the mouse, the timer resets.
      */
     duration: number;
     handleOpenChange(): void;
@@ -48,11 +49,17 @@ export declare class SixAlert {
      * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when
      * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by
      * calling this method again. The returned promise will resolve after the alert is hidden.
+     * @param adjustPosition  If true, the top and right position of the toast stack is shifted according to the
+     *                        six-root header's height and the presence of a vertical scrollbar.
      */
-    toast(): Promise<void>;
+    toast(adjustPosition?: boolean): Promise<void>;
+    private pauseAutoHide;
+    private resetAutoHide;
+    private restartAutoHide;
     private handleCloseClick;
-    private handleMouseMove;
+    private handleMouseEnter;
+    private handleMouseLeave;
     private handleTransitionEnd;
-    private restartAutoHide;
     render(): any;
 }
+export type AlertType = 'primary' | 'success' | 'info' | 'warning' | 'danger';

package/dist/types/components/six-datepicker/six-datepicker.d.ts

@@ -41,7 +41,7 @@ export declare class SixDatepicker {
     /**
      * The language used to render the weekdays and months.
      */
-    locale: 'en' | 'de' | 'fr' | 'it';
+    locale: 'en' | 'de' | 'fr' | 'it' | 'es';
     /** Indicates whether or not the calendar dropdown is open on startup. You can use this in lieu of the show/hide methods. */
     open: boolean;
     /** Indicates whether or not the calendar should be shown as an inline (always open) component */

package/dist/types/components/six-dialog/six-dialog.d.ts

@@ -60,6 +60,7 @@ export declare class SixDialog {
     sixOverlayDismiss: EventEmitter<EmptyPayload>;
     connectedCallback(): void;
     componentWillLoad(): void;
+    componentDidLoad(): void;
     disconnectedCallback(): void;
     /** Shows the dialog */
     show(): Promise<void>;

package/dist/types/components/six-dropdown/six-dropdown.d.ts

@@ -20,6 +20,7 @@ export interface SixDropdownScrollPayload {
  * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
  *
  * @slot trigger - The dropdown's trigger, usually a `<six-button>` element.
+ * @slot dropdown-footer - The dropdown's footer area.
  * @slot - The dropdown's content.
  *
  * @part base - The component's base wrapper.
@@ -30,10 +31,13 @@ export declare class SixDropdown {
     private componentId;
     private isVisible;
     private panel?;
+    private scrollPanel?;
+    private panelSlot?;
     private positioner?;
     private popover?;
     private trigger?;
-    private hasBeenInitialized;
+    private triggerSlot?;
+    private resizeObserver;
     private filterInputElement?;
     host: HTMLSixDropdownElement;
     /** Indicates whether the dropdown is open. You can use this in lieu of the show/hide methods. */
@@ -73,7 +77,7 @@ export declare class SixDropdown {
     filterPlaceholder: string;
     /** By default the search field will be focused when opening a dropdown with filtering enabled. */
     autofocusFilter: boolean;
-    get hasFilterEnabled(): boolean;
+    get filterEnabled(): boolean;
     /** The debounce for the filter callbacks. */
     filterDebounce: number;
     /** The panel can be opend/closed by pressing the spacebar or the enter key. In some cases you might want to avoid this */
@@ -83,6 +87,13 @@ export declare class SixDropdown {
     /** Defines whether the menu list will be rendered virtually i.e. only the elements actually shown (and a couple around)
      *  are actually rendered in the DOM. If you use virtual scrolling pass the elements via prop instead of via slot. */
     virtualScroll: boolean;
+    /**
+     * Determines if the dropdown panel's width should match the width of the trigger element.
+     *
+     * If set to `true`, the panel will resize its width to align with the trigger's width.
+     * If `false` or omitted, the panel will maintain its default width.
+     */
+    matchTriggerWidth: boolean;
     get container(): HTMLElement;
     /** Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened. */
     sixShow: EventEmitter<EmptyPayload>;
@@ -99,21 +110,27 @@ export declare class SixDropdown {
     /** Emitted when the user scrolls inside dropdown panel.*/
     sixScroll: EventEmitter<SixDropdownScrollPayload>;
     private eventListeners;
-    filteredOptions: SixMenuItemData[];
+    renderedOptions: SixMenuItemData[];
     handleOpenChange(): void;
     handlePopoverOptionsChange(): void;
     handleOptionsChange(): void;
-    connectedCallback(): void;
+    private validateOptions;
+    componentWillLoad(): void;
     componentDidLoad(): void;
-    private initializePopover;
-    private setupFiltering;
+    connectedCallback(): void;
+    private init;
+    private applyFilter;
+    private resetFilter;
+    private emitFilterEvents;
+    private initPopover;
     private getMenuItems;
-    private handleFilterInputChange;
-    private handleFilteringForAttributeItems;
-    private handleFilteringForSlotItems;
     disconnectedCallback(): void;
     /** Shows the dropdown panel */
     show(): Promise<void>;
+    /**
+     * Set min width of dropdown panel to the width of the trigger element
+     */
+    private updatePanelPosition;
     /** Hides the dropdown panel */
     hide(): Promise<void>;
     private focusOnTrigger;
@@ -121,6 +138,8 @@ export declare class SixDropdown {
     /**
      * Instructs the dropdown menu to reposition. Useful when the position or size of the trigger changes when the menu
      * is activated.
+     *
+     * @deprecated: use the property `matchTriggerWidth` instead.
      */
     reposition(): Promise<void>;
     private handleDocumentKeyDown;

package/dist/types/components/six-header/six-header.d.ts

@@ -33,6 +33,8 @@ declare enum Section {
 export declare class SixHeader {
     /** Indicates if content should be shifted down when search field is visible. */
     shiftContent: boolean;
+    /** Set whether the hamburger menu should be visible or not */
+    hideHamburgerMenu: boolean;
     /** Set the hamburger menu icon to open or closed state */
     openHamburgerMenu: boolean;
     /** Set the header search to be in an open or closed state */
@@ -59,6 +61,7 @@ export declare class SixHeader {
     host: HTMLSixHeaderElement;
     private eventListeners;
     private slots?;
+    private mutationObserver?;
     selectedApp?: string;
     selectedSection?: Section;
     private hasSlot;
@@ -72,7 +75,8 @@ export declare class SixHeader {
     private appNameClicked;
     private computeSearchOpenState;
     componentWillLoad(): void;
-    private getSelectedApp;
+    connectedCallback(): void;
+    private updateSelectedApp;
     disconnectedCallback(): void;
     render(): any;
 }

package/dist/types/components/six-input/six-input.d.ts

@@ -69,6 +69,10 @@ export declare class SixInput {
     step?: number;
     /** A pattern to validate input against. */
     pattern?: string;
+    /**
+     * Internal: Styles the input for the dropdown filter search.
+     */
+    dropdownSearch: boolean;
     /** Set to true to show an asterisk beneath the label. */
     required: boolean;
     /** The input's autocaptialize attribute. */

package/dist/types/components/six-item-picker/six-item-picker.d.ts

@@ -99,5 +99,12 @@ export declare class SixItemPicker {
     private onMouseDownPrev;
     private onMouseUpPrev;
     private getFormattedValue;
+    private handleKeyPress;
+    private pageUp;
+    private pageDown;
+    private goToMin;
+    private goToMax;
+    private upButton;
+    private downButton;
     render(): any;
 }

package/dist/types/components/six-menu/six-menu.d.ts

@@ -46,6 +46,10 @@ export declare class SixMenu {
      * The lower the number the more sensitive the component reacts to scrolling changes.
      */
     scrollingDebounce: number;
+    /**
+     * Internal: Disables handling of key presses.
+     */
+    disableKeyboardHandling: boolean;
     /**
      * Used to calculate which items should be rendered in the DOM
      */

package/dist/types/components/six-menu-item/six-menu-item.d.ts

@@ -17,8 +17,13 @@
 export declare class SixMenuItem {
     private menuItem?;
     private defaultSlot?;
+    host: HTMLSixMenuItemElement;
     hasFocus: boolean;
-    /** Set to true to draw the item in a checked state. */
+    active: boolean;
+    /** Defines if the checked state is displayed as a checkbox or a check-icon */
+    checkType: 'checkbox' | 'check';
+    /** Internal: Draws the item in a checked state. CheckType needs to be set to 'checkbox' or 'check' to show the
+     * checked state */
     checked: boolean;
     /** A unique value to store in the menu item. This can be used as a way to identify menu items when selected. */
     value: string;
@@ -35,5 +40,6 @@ export declare class SixMenuItem {
     private handleFocus;
     private handleMouseEnter;
     private handleMouseLeave;
+    private handleCheckboxChange;
     render(): any;
 }

package/dist/types/components/six-root/six-root.d.ts

@@ -1,8 +1,4 @@
-import { EventEmitter } from '../../stencil-public-runtime';
 import { StageType } from '../six-stage-indicator/six-stage-indicator';
-export interface SixRootCollapsedPayload {
-    collapsed: boolean;
-}
 /**
  * @since 1.0
  * @status stable
@@ -15,20 +11,11 @@ export interface SixRootCollapsedPayload {
  */
 export declare class SixRoot {
     host: HTMLSixRootElement;
-    /** Breakpoint for smaller screens when the right sidebar is collapsed by default. */
-    breakpoint: number;
     /** Defines whether the content section should be padded */
     padded: boolean;
     /** Defines the stage of the application*/
     stage: StageType;
     /** Defines the version of the application*/
     version: string;
-    /** Emitted when display size is updated. */
-    collapsedEvent: EventEmitter<SixRootCollapsedPayload>;
-    collapse: boolean;
-    private resizeObserver;
-    handleCollapsed(collapsed: boolean): void;
-    componentWillLoad(): void;
-    disconnectedCallback(): void;
     render(): any;
 }

package/dist/types/components/six-select/six-select.d.ts

@@ -28,29 +28,40 @@ export interface SixSelectChangePayload {
  */
 export declare class SixSelect {
     private box?;
+    private menu?;
     private dropdown?;
-    private input?;
+    private displayValuesContainer?;
+    private overflowCount?;
+    private autocompleteInput?;
     private inputId;
     private labelId;
     private helpTextId;
     private errorTextId;
-    private menu?;
-    private resizeObserver?;
-    private touched;
     private eventListeners;
+    private activeItemIndex;
+    private resizeObserver;
     host: HTMLSixSelectElement;
     hasFocus: boolean;
     hasHelpTextSlot: boolean;
     hasLabelSlot: boolean;
     hasErrorTextSlot: boolean;
     isOpen: boolean;
-    displayLabel: string;
-    displayTags: HTMLSixTagElement[];
+    displayedValues: string[];
+    /** Menu items shown in the selection container.  */
+    selectionContainerItems: HTMLSixMenuItemElement[];
     /** Set to true to enable multiselect. */
     multiple: boolean;
+    /** Enables the select all button. */
+    selectAllButton: boolean;
+    /**
+     * Custom text for the "select all" button. Defaults to "Select all" and equivalents in supported languages.
+     */
+    selectAllText?: string;
     /**
      * The maximum number of tags to show when `multiple` is true. After the maximum, "+n" will be shown to indicate the
      * number of additional items that are selected. Set to -1 to remove the limit.
+     *
+     * @deprecated: This property is ignored. The component now displays as many items as possible and computes the "+n" dynamically.
      */
     maxTagsVisible: number;
     /** Set to true to disable the select control. */
@@ -62,7 +73,7 @@ export declare class SixSelect {
     /** The filter's placeholder text. */
     filterPlaceholder?: string;
     /** The debounce for the filter callbacks. */
-    filterDebounce: number;
+    filterDebounce?: number;
     /** The select's size. */
     size: 'small' | 'medium' | 'large';
     /**
@@ -125,26 +136,30 @@ export declare class SixSelect {
     disconnectedCallback(): void;
     /** Sets focus on the select. */
     setFocus(options?: FocusOptions): Promise<void>;
+    private init;
     private getItemLabel;
     private getItems;
-    private hasMenuItems;
+    private getVisibleItems;
+    private getSelectionContainerItems;
     private getValueAsArray;
     private handleBlur;
     private handleFocus;
     private handleClearClick;
     private clearValues;
-    private handleSelectAll;
     private handleKeyDown;
+    private selectAll;
     private handleLabelClick;
     private handleMenuSelect;
     private handleMenuShow;
     private handleMenuHide;
     private handleSlotChange;
-    private handleTagInteraction;
-    private resizeMenu;
+    /**
+     * Sets the checked state of menu items and renders the displayed values.
+     */
     private syncItemsFromValue;
-    private extractLabelForSelectedItem;
     private syncValueFromItems;
+    private updateDisplayedValues;
     render(): any;
     private hasSelection;
+    private hasDeselectedOptions;
 }

package/dist/types/components/six-spinner/six-spinner.d.ts

@@ -5,6 +5,7 @@
  * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
  *
  * @part base - The component's base wrapper.
+ * @part svg - The spinner icon
  */
 export declare class SixSpinner {
     /** Indicates if the spinner is shown as animated SIX logo or simple spinner. */