@six-group/ui-library 0.0.0-insider.b13c699 → 0.0.0-insider.b2db78f

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

@@ -0,0 +1,141 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { Language } from '../../utils/error-messages';
+/**
+ * A date picker component that allows users to select dates via a calendar popup or direct input.
+ *
+ * @since 5.0
+ * @status experimental
+ *
+ * @slot label - The date's label. Alternatively, you can use the label prop.
+ * @slot help-text - Help text that describes the usage.
+ * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text property.
+ */
+export declare class SixDate {
+    private eventListeners;
+    private inputElement?;
+    private popoverHelper?;
+    private panel?;
+    private positioner?;
+    host: HTMLSixDateElement;
+    /**
+     * Current state of the date picker for day, month, or year selection.
+     * Independent of the currently selected date value.
+     */
+    pointerDate: import("./iso-date").PointerDate;
+    selectionMode: 'day' | 'month' | 'year';
+    /**
+     * The language used to render the weekdays and months.
+     */
+    language: Language;
+    /**
+     * If `true` the user can only select a date via the component in the popup but not directly edit the input field.
+     */
+    readonly: boolean;
+    /**
+     * If `true` the component is disabled.
+     */
+    disabled: boolean;
+    /**
+     * Callback to determine which dates in the picker should be selectable.
+     */
+    allowedDates: (date: string) => boolean;
+    /**
+     * The minimum allowed selectable date in ISO format (yyyy-MM-dd).
+     * Dates before this value will be disabled in the date picker.
+     * Example: '2024-01-01'
+     */
+    min?: string;
+    /**
+     * The maximum allowed selectable date in ISO format (yyyy-MM-dd).
+     * Dates after this value will be disabled in the date picker.
+     * Example: '2025-01-01'
+     */
+    max?: string;
+    /**
+     * The size of the date input field.
+     */
+    size: 'small' | 'medium' | 'large';
+    /** Set to true to show an asterisk beneath the label. */
+    required: boolean;
+    /**
+     * The placeholder defines what text to be shown on the input element
+     */
+    placeholder?: string;
+    /**
+     * The value of the form field in ISO 8601 date format (yyyy-MM-dd).
+     * Example: '2024-01-01'.
+     *
+     * When an invalid date is provided, it will be replaced with an empty string (''),
+     * matching the behavior of native HTML <input type="date">.
+     *
+     * The displayed format can be customized using the dateFormat property, but the underlying
+     * value will always be stored in ISO format.
+     */
+    value: string | '';
+    /** Defines the format pattern for displaying dates and how dates can be entered via keyboard.
+     *
+     * Defaults to "dd.MM.yyyy".
+     *
+     * Available patterns:
+     * - Year: "yyyy" (e.g., "2021")
+     * - Month: "MM" (e.g., "01" for January) or "M" (e.g., "1" for January)
+     * - Day: "dd" (e.g., "08" for the 8th) or "d" (e.g., "8" for the 8th)
+     *
+     * Examples:
+     * - "dd.MM.yyyy" -> "31.01.2024"
+     * - "yyyy-MM-dd" -> "2024-01-31"
+     * - "d.M.yyyy" -> "31.1.2024"
+     * */
+    dateFormat: string;
+    /** The label text. */
+    label: string;
+    /** The input's help text. Alternatively, you can use the help-text slot. */
+    helpText: string;
+    /** The error message shown, if `invalid` is set to true.  */
+    errorText: string | string[];
+    /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */
+    errorTextCount?: number;
+    /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */
+    invalid: boolean;
+    /**
+     * Set the amount of time, in milliseconds, to wait to trigger the `six-change` event after each keystroke.
+     */
+    debounce: number;
+    /** The input's name attribute. */
+    name: string;
+    /** Set to true to add a clear button when the input is populated. */
+    clearable: boolean;
+    valueChanged(): void;
+    /**
+     * Emitted when the control's value changes.
+     * Event detail contains the new date value in ISO format (yyyy-MM-dd) or an empty string if cleared.
+     */
+    sixChange: EventEmitter<string | ''>;
+    /**
+     * Emitted when the control loses focus or the date picker popup is closed.
+     * Does not contain event details.
+     */
+    sixBlur: EventEmitter;
+    /** Sets focus on the input. */
+    setFocus(options?: FocusOptions): Promise<void>;
+    private panelHideInProgress;
+    private updateValueAndPointerDate;
+    private getSixInputBaseElement;
+    private show;
+    private hide;
+    private initPopover;
+    private handlePreviousClick;
+    private handleNextClick;
+    private handleDocumentMouseDown;
+    private handleClearClick;
+    private handleDayClick;
+    private handleMonthClicked;
+    private handleYearClicked;
+    private handleInputChange;
+    private handleOnBlur;
+    private handleInputKeyDown;
+    connectedCallback(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    render(): any;
+}

package/dist/types/components/six-date/translations.d.ts

@@ -0,0 +1,37 @@
+import { Language } from '../../utils/error-messages';
+export declare const i18nDate: {
+    en: {
+        months: string[];
+        monthsShort: string[];
+        weekdaysMin: string[];
+        formatHelp: (pattern: string) => string;
+    };
+    de: {
+        months: string[];
+        monthsShort: string[];
+        weekdaysMin: string[];
+        formatHelp: (pattern: string) => string;
+    };
+    fr: {
+        months: string[];
+        monthsShort: string[];
+        weekdaysMin: string[];
+        formatHelp: (pattern: string) => string;
+    };
+    it: {
+        months: string[];
+        monthsShort: string[];
+        weekdaysMin: string[];
+        formatHelp: (pattern: string) => string;
+    };
+    es: {
+        months: string[];
+        monthsShort: string[];
+        weekdaysMin: string[];
+        formatHelp: (pattern: string) => string;
+    };
+};
+export declare function translateMonth(month: number, language: Language): string;
+export declare function translateMonthShort(month: number, language: Language): string;
+export declare function translateWeekday(day: number, language: Language): string;
+export declare function translateFormatHelp(language: Language, pattern: string): string;

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

@@ -34,7 +34,7 @@ export declare class SixDropdown {
     private scrollPanel?;
     private panelSlot?;
     private positioner?;
-    private popover?;
+    private popoverHelper?;
     private trigger?;
     private triggerSlot?;
     private resizeObserver;
@@ -135,13 +135,6 @@ export declare class SixDropdown {
     hide(): Promise<void>;
     private focusOnTrigger;
     private getMenu;
-    /**
-     * 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;
     private handleDocumentMouseDown;
     private handlePanelSelect;

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

@@ -1,146 +1,20 @@
-import { EventEmitter } from '../../stencil-public-runtime';
-import { EmptyPayload } from '../../utils/types';
-export interface SixHeaderAppSwitcherSelectPayload {
-    selectedLabel: string;
-    name: string;
-    item: HTMLSixMenuItemElement;
-}
-export interface SixHeaderProfileSelectPayload {
-    selectedLabel: string;
-    name: string;
-    item: HTMLSixMenuItemElement;
-}
-export interface SixHeaderSearchFieldToggle {
-    visible: boolean;
-}
-declare enum Section {
-    None = 0,
-    Search = 1,
-    AppSwitcher = 2,
-    Profile = 3
-}
 /**
  * @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 - <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
-     *
-     * @deprecated Use six-header `custom` property instead
-     */
-    hideHamburgerMenu: boolean;
-    /**
-     * Set the hamburger menu icon to open or closed state
+     * Set the header search input to be in an 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.
-     *
-     * If `custom` is `true`, focuses the first `six-input` found in the search slot.
+     * Focuses the first `six-input` found in the search slot.
      */
     openSearch: boolean;
-    /**
-     * 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
-     *
-     * @deprecated Use six-header `custom` property instead
-     */
-    setSearchOpenState(openState: boolean): Promise<void>;
-    /**
-     * 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.
-     *
-     * @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.
-     *
-     * @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.
-     *
-     * @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.
-     *
-     * @deprecated Use six-header `custom` property instead
-     */
-    sixHamburgerClick: EventEmitter<EmptyPayload>;
-    /**
-     * 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;
-    private slots?;
-    private mutationObserver?;
-    selectedApp?: string;
-    selectedSection?: Section;
-    private hasSlot;
-    private isSectionSelected;
-    private selectSection;
-    private toggleSearch;
-    private setupMenu;
-    private setupLogo;
-    private setupProfile;
-    private setupAppSwitcher;
-    private appNameClicked;
-    private computeSearchOpenState;
-    componentWillLoad(): void;
-    connectedCallback(): void;
-    private updateSelectedApp;
     disconnectedCallback(): void;
     render(): any;
 }
-export {};

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

@@ -1,8 +1,17 @@
 /**
  * @since 4.2.7
- * @status beta
+ * @status stable
  */
 export declare class SixHeaderDropdownItem {
+    /**
+     * Set to true to allow auto filtering for entries in the dropdown.
+     * With this flag the dropdown will automatically filter itsel.
+     * If you need to coordinate the shown elements yourself,
+     * e.g. because you need to call an endpoint use asyncFilter instead
+     */
+    filter: boolean;
+    /** The filter's placeholder text. */
+    filterPlaceholder: string;
     active: boolean;
     host: HTMLSixHeaderDropdownItemElement;
     private dropdownElement?;

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

@@ -1,6 +1,6 @@
 /**
  * @since 4.2.7
- * @status beta
+ * @status stable
  */
 export declare class SixHeaderItem {
     /**

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

@@ -1,11 +1,17 @@
 /**
  * @since 4.2.7
- * @status beta
+ * @status stable
  */
 export declare class SixHeaderMenuButton {
-    /**
-     * The icon of the menu button.
-     */
-    icon: string;
+    /** Set to true to draw the button with a caret for use with dropdowns, popovers, etc. */
+    caret: boolean;
+    /** Set to true to disable the button. */
+    disabled: boolean;
+    /** Set to true to draw the button in a loading state. */
+    loading: boolean;
+    /** Indicates if activating the button should submit the form. Ignored when `href` is set. */
+    submit: boolean;
+    /** Indicates if activating the button should reset the form. */
+    reset: boolean;
     render(): any;
 }

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

@@ -57,13 +57,6 @@ export declare class SixSelect {
      * 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. */
     disabled: boolean;
     /** The select's name. */

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

@@ -11,6 +11,8 @@ export declare class SixSidebarItem {
     selected: boolean;
     /** Set to true to draw the sidebar item in a disabled state. */
     disabled: boolean;
+    /** Icon of the item */
+    icon: string;
     /**
      * Provide if the item should be rendered as anchor tag.
      * Note, that the href is added automatically when using routerLink in Angular.

package/dist/types/components/six-sidebar-item-group/six-sidebar-item-group.d.ts

@@ -28,6 +28,8 @@ export declare class SixSidebarItemGroup {
     private handleSlotChange;
     private isSubgroup;
     private renderAsHref;
+    private handleDetailsShow;
+    private handleDetailsHide;
     private provideSlot;
     render(): any;
 }

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

@@ -14,7 +14,7 @@ import { EmptyPayload } from '../../utils/types';
 export declare class SixTooltip {
     private componentId;
     private isVisible;
-    private popover?;
+    private popoverHelper?;
     private tooltipPositioner?;
     private target?;
     private tooltip?;