@six-group/ui-library 0.0.0-insider.d005298 → 0.0.0-insider.d7f75e8

package/dist/types/components/six-file-upload/six-file-upload.d.ts

@@ -13,11 +13,13 @@ export interface SixFileUploadFailurePayload {
  * @since 2.0.0
  * @status experimental
  *
+ * @slot error-text - Error text that is shown when the status is set to invalid. Alternatively, you can use the error-text prop.
  */
 export declare class SixFileUpload {
     readonly host: HTMLSixFileUploadElement;
     private fileInput?;
     isOver: boolean;
+    hasError: boolean;
     /** Set to true if file control should be small. */
     readonly compact: boolean;
     /** Label of the drop area. */
@@ -30,6 +32,12 @@ export declare class SixFileUpload {
     readonly multiple = false;
     /** Allowed max file size in bytes. */
     readonly maxFileSize?: number;
+    /** Set to true to draw the control in a loading state. */
+    uploading: boolean;
+    /** The error message shown, if `invalid` is set to true.  */
+    errorText: string | string[];
+    /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */
+    invalid: boolean;
     /** Triggers when a file is added. */
     success: EventEmitter<SixFileUploadSuccessPayload>;
     /** Triggers when an uploaded file doesn't match MIME type or max file size. */
@@ -37,8 +45,10 @@ export declare class SixFileUpload {
     dragenterHandler(): void;
     dragoverHandler(): void;
     dragleaveHandler(): void;
-    dropHandler({ dataTransfer }: DragEvent): void;
+    dropHandler(): void;
+    private handleSlotChange;
     private handleFiles;
+    componentWillLoad(): void;
     componentDidLoad(): void;
     disconnectedCallback(): void;
     private preventDefaults;

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

@@ -22,41 +22,104 @@ declare enum Section {
 /**
  * @since 1.0
  * @status stable
- *
  * @slot - Used to define a custom component that is included in the header.
  * @slot search-field - Used to define the search field component in the header.
- * @slot notifications - Used to define the notification component in the header.
- * @slot app-switcher-menu - Used to define the application switcher menu in the header.
- * @slot profile-menu - Used to define the profile menu in the header.
- * @slot profile-avatar - Used to define the avator in the header.
+ * @slot notifications - <span style="color:red">[Deprecated]</span>, use six-header `custom` property instead. Used to define the notification component in the header.
+ * @slot app-switcher-menu - <span style="color:red">[Deprecated]</span>, use six-header `custom` property instead. Used to define the application switcher menu in the header.
+ * @slot profile-menu -  <span style="color:red">[Deprecated]</span>, use six-header `custom` property instead. Used to define the profile menu in the header.
+ * @slot profile-avatar - <span style="color:red">[Deprecated]</span>, use six-header `custom` property instead. Used to define the avator in the header.
  */
 export declare class SixHeader {
+    /**
+     * Set `custom` to `true` for complete control over the header content. When enabled, all other properties and slots
+     * are ignored.
+     *
+     * Use `six-header-item`, `six-header-dropdown-item` and `six-header-menu-button` to structure the content.
+     *
+     * @since 4.2.7
+     * @status beta
+     */
+    custom: boolean;
     /** Indicates if content should be shifted down when search field is visible. */
     shiftContent: boolean;
-    /** Set whether the hamburger menu should be visible or not */
+    /**
+     * Set whether the hamburger menu should be visible or not
+     *
+     * @deprecated Use six-header `custom` property instead
+     */
     hideHamburgerMenu: boolean;
-    /** Set the hamburger menu icon to open or closed state */
+    /**
+     * Set the hamburger menu icon to open or closed state
+     *
+     * @deprecated Use six-header `custom` property instead
+     */
     openHamburgerMenu: boolean;
-    /** Set the header search to be in an open or closed state */
+    /**
+     * Set the header search to be in an open or closed state.
+     *
+     * If `custom` is `true`, focuses the first `six-input` found in the search slot.
+     */
     openSearch: boolean;
-    /** Set whether the logo should be clickable */
+    /**
+     * Set whether the logo should be clickable
+     *
+     * @deprecated Use six-header `custom` property with `six-logo` instead
+     */
     clickableLogo: boolean;
+    /**
+     * The displayed logo. Either six or bme. Defaults to six.
+     *
+     * @deprecated Use six-header `custom` property with `six-logo` instead
+     */
+    logo: 'six' | 'bme';
     handleOpenSearchChange(): void;
-    /** Sets open state for search */
+    /**
+     * Sets open state for search
+     *
+     * @deprecated Use six-header `custom` property instead
+     */
     setSearchOpenState(openState: boolean): Promise<void>;
-    /** Get open state for search */
+    /**
+     * Get open state for search
+     *
+     * @deprecated Use six-header `custom` property instead
+     */
     getIsSearchOpen(): Promise<boolean>;
-    /** Emitted when the name of the selected app is clicked. */
+    /**
+     * Emitted when the name of the selected app is clicked.
+     *
+     * @deprecated Use six-header `custom` property with `six-header-dropdown-item` and `six-header-menu-button` instead
+     */
     sixAppNameClicked: EventEmitter<EmptyPayload>;
-    /** Emitted when a menu item is in the app switcher menu is selected. */
+    /**
+     * Emitted when a menu item is in the app switcher menu is selected.
+     *
+     * @deprecated Use six-header `custom` property with `six-header-dropdown-item` and `six-header-menu-button` instead
+     */
     sixAppSwitcherSelect: EventEmitter<SixHeaderAppSwitcherSelectPayload>;
-    /** Emitted when a menu item is in the profile menu is selected. */
+    /**
+     * Emitted when a menu item is in the profile menu is selected.
+     *
+     * @deprecated Use six-header `custom` property with `six-header-dropdown-item` and `six-avatar` instead
+     */
     sixProfileSelect: EventEmitter<SixHeaderProfileSelectPayload>;
-    /** Emitted when the hamburger menu is clicked. */
+    /**
+     * Emitted when the hamburger menu is clicked.
+     *
+     * @deprecated Use six-header `custom` property instead
+     */
     sixHamburgerClick: EventEmitter<EmptyPayload>;
-    /** Emitted when the header logo is clicked. */
-    sixLogoClick: EventEmitter<EmptyPayload>;
-    /** Emitted when search field is toggled. */
+    /**
+     * Emitted when the header logo is clicked.
+     *
+     * @deprecated Use six-header `custom` property instead
+     */
+    logoClick: EventEmitter<EmptyPayload>;
+    /**
+     * Emitted when search field is toggled.
+     *
+     * @deprecated Use six-header `custom` property instead
+     */
     sixSearchFieldToggle: EventEmitter<SixHeaderSearchFieldToggle>;
     host: HTMLSixHeaderElement;
     private eventListeners;

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

@@ -0,0 +1,13 @@
+/**
+ * @since 4.2.7
+ * @status beta
+ */
+export declare class SixHeaderDropdownItem {
+    active: boolean;
+    host: HTMLSixHeaderDropdownItemElement;
+    private dropdownElement?;
+    connectedCallback(): void;
+    componentDidLoad(): void;
+    render(): any;
+    private updateDropdownDistance;
+}

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

@@ -0,0 +1,15 @@
+/**
+ * @since 4.2.7
+ * @status beta
+ */
+export declare class SixHeaderItem {
+    /**
+     * Indicates whether the item is styled as active.
+     * When set to `true`, a border is displayed below the trigger element.
+     *
+     * Use <code>six-header-dropdown-item</code> to automatically set the active
+     * state for dropdowns.
+     */
+    active: boolean;
+    render(): any;
+}

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

@@ -0,0 +1,11 @@
+/**
+ * @since 4.2.7
+ * @status beta
+ */
+export declare class SixHeaderMenuButton {
+    /**
+     * The icon of the menu button.
+     */
+    icon: string;
+    render(): any;
+}

package/dist/types/components/six-icon-button/six-icon-button.d.ts

@@ -21,6 +21,12 @@ export declare class SixIconButton {
     disabled: boolean;
     /** HTML symbol code or entity. */
     html?: string;
+    /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */
+    href?: string;
+    /** Tells the browser where to open the link. Only used when `href` is set. */
+    target?: '_blank' | '_parent' | '_self' | '_top';
+    /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */
+    download?: string;
     componentDidLoad(): void;
     disconnectedCallback(): void;
     render(): any;

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

@@ -1,5 +1,11 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { EmptyPayload } from '../../utils/types';
+export type SelectionRangeDirection = 'forward' | 'backward' | 'none';
+export type SelectionRange = {
+    selectionStart: number | undefined;
+    selectionEnd: number | undefined;
+    selectionDirection: SelectionRangeDirection | undefined;
+};
 /**
  * @since 1.0
  * @status stable
@@ -123,7 +129,9 @@ export declare class SixInput {
     /** Selects all the text in the input. */
     select(): Promise<void | undefined>;
     /** Sets the start and end positions of the text selection (0-based). */
-    setSelectionRange(selectionStart: number, selectionEnd: number, selectionDirection?: 'forward' | 'backward' | 'none'): Promise<void | undefined>;
+    setSelectionRange(selectionStart: number, selectionEnd: number, selectionDirection?: SelectionRangeDirection): Promise<void | undefined>;
+    /** Returns the start and end positions of the text selection */
+    getSelectionRange(): Promise<SelectionRange>;
     /** Replaces a range of text with a new string. */
     setRangeText(replacement: string, start: number, end: number, selectMode?: 'select' | 'start' | 'end' | 'preserve'): Promise<void>;
     private handleChange;

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

@@ -0,0 +1,9 @@
+/**
+ * @since 4.2.7
+ * @status beta
+ */
+export declare class SixLogo {
+    /** The brand of the logo. Either six or bme. Defaults to six. */
+    brand: 'six' | 'bme';
+    render(): any;
+}

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

@@ -54,7 +54,7 @@ export declare class SixMenu {
      * Used to calculate which items should be rendered in the DOM
      */
     private scrollingIndex;
-    sixMenuItemHeight: number;
+    private sixMenuItemHeight;
     connectedCallback(): void;
     componentWillLoad(): void;
     private handleScrolling;

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

@@ -69,6 +69,8 @@ export declare class SixRange {
     componentWillLoad(): void;
     componentDidLoad(): void;
     disconnectedCallback(): void;
+    componentDidUpdate(): void;
+    private getMinMax;
     /** Sets focus on the input. */
     setFocus(options?: FocusOptions): Promise<void>;
     /** Removes focus from the input. */

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

@@ -136,12 +136,10 @@ export declare class SixSelect {
     disconnectedCallback(): void;
     /** Sets focus on the select. */
     setFocus(options?: FocusOptions): Promise<void>;
-    private init;
     private getItemLabel;
     private getItems;
     private getVisibleItems;
     private getSelectionContainerItems;
-    private getValueAsArray;
     private handleBlur;
     private handleFocus;
     private handleClearClick;

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

@@ -3,5 +3,7 @@ export interface MenuItem {
 }
 export declare function getValue(value: unknown, multiple: boolean, menuItems: MenuItem[]): string | string[];
 export declare function isValidValue(value: unknown, multiple: boolean, menuItems: MenuItem[]): boolean;
+export declare function convertToValidValue(value: unknown, multiple: boolean): string | string[];
+export declare function convertToValidArrayValue(value: unknown): string[];
 export declare function valueEquals(a: string | string[], b: string | string[]): boolean;
 export declare function isValueEmpty(value: string | string[]): boolean;

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

@@ -5,12 +5,32 @@
  * 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
+ * @part svg - The spinner icon.
  */
 export declare class SixSpinner {
-    /** Indicates if the spinner is shown as animated SIX logo or simple spinner. */
-    six: boolean;
+    /** Indicates if the spinner is shown as animated SIX or BME logo or a simple spinner. */
+    logo?: 'six' | 'bme';
+    /**
+     * **@deprecated** Use `logo="six"` instead.
+     *
+     * If set to true, the spinner displays the SIX logo.
+     */
+    six?: boolean;
+    /**
+     * Renders a container with a given SVG content.
+     */
+    private renderWrapper;
+    /**
+     * Renders the SIX logo spinner.
+     */
     private renderSIXLogo;
-    private renderSimple;
+    /**
+     * Renders the BME logo spinner.
+     */
+    private renderBMELogo;
+    /**
+     * Renders a simple spinner.
+     */
+    private renderSimpleSpinner;
     render(): any;
 }

package/dist/types/components/six-tab-group/six-tab-group.d.ts

@@ -30,7 +30,8 @@ export declare class SixTabGroup {
     private tabGroup?;
     private tabs?;
     host: HTMLSixTabGroupElement;
-    hasScrollControls: boolean;
+    hasLeftControl: boolean;
+    hasRightControl: boolean;
     /** The placement of the tabs. */
     placement: 'top' | 'bottom' | 'left' | 'right';
     /** Disables the scroll arrows that appear when tabs overflow. */
@@ -51,6 +52,8 @@ export declare class SixTabGroup {
     private handleKeyDown;
     private handleScrollLeft;
     private handleScrollRight;
+    private calculateRightControlVisibility;
+    private calculateLeftControlVisibility;
     private updateScrollControls;
     private setActiveTab;
     private setAriaLabels;