@six-group/ui-library 0.0.0-insider.77a508a → 0.0.0-insider.79a0d1c

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

@@ -1,9 +1,10 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { Language } from '../../utils/error-messages';
-import { IsoDate } from './iso-date';
 /**
+ * A date picker component that allows users to select dates via a calendar popup or direct input.
+ *
  * @since 5.0
- * @status experimental
+ * @status beta
  *
  * @slot label - The date's label. Alternatively, you can use the label prop.
  * @slot help-text - Help text that describes the usage.
@@ -27,7 +28,7 @@ export declare class SixDate {
      */
     language: Language;
     /**
-     * If `true` the user can only select a date via the component in the popup, but not directly edit the input field.
+     * If `true` the user can only select a date via the component in the popup but not directly edit the input field.
      */
     readonly: boolean;
     /**
@@ -37,16 +38,22 @@ export declare class SixDate {
     /**
      * Callback to determine which dates in the picker should be selectable.
      */
-    allowedDates: (date: IsoDate) => boolean;
+    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 minimum date allowed. Value must be an iso-date 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'
      */
-    min?: IsoDate;
+    max?: string;
     /**
-     * The maximum date allowed.Value must be an iso-date string.
+     * The size of the date input field.
      */
-    max?: IsoDate;
-    /** Dates size. */
     size: 'small' | 'medium' | 'large';
     /** Set to true to show an asterisk beneath the label. */
     required: boolean;
@@ -55,9 +62,36 @@ export declare class SixDate {
      */
     placeholder?: string;
     /**
-     * The value of the form field, which accepts a date object.
+     * 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: IsoDate | '';
+    value: string | '';
+    /** Defines the format pattern for displaying dates and how dates can be entered via keyboard.
+     *
+     * The parser accepts flexible input that doesn't strictly match the format pattern.
+     * Input with missing leading zeros or incomplete years will be automatically normalized.
+     * For example, with the pattern "dd.MM.yyyy": "1.1.2025" becomes "01.01.2025" and
+     * "1.1.225" becomes "01.01.0225".
+     *
+     * 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. */
@@ -68,26 +102,20 @@ export declare class SixDate {
     errorTextCount?: number;
     /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */
     invalid: boolean;
-    /** Define the dateFormat. Defaults to "dd.MM.yyyy".
-     *
-     * Available patterns:
-     * - Year: "yyyy" (e.g., "2021")
-     * - Month: "MM" (e.g., "01" for January, "12" for December)
-     * - Day: "dd" (e.g., "08" for the 8th day of the month)
-     * */
-    dateFormat: string;
-    /**
-     * Set the amount of time, in milliseconds, to wait to trigger the `dateChange` 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. */
-    sixChange: EventEmitter<IsoDate | ''>;
-    /** Emitted when the control loses focus. */
+    /**
+     * 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>;
@@ -100,13 +128,14 @@ export declare class SixDate {
     private handlePreviousClick;
     private handleNextClick;
     private handleDocumentMouseDown;
-    private handleClearClick;
     private handleDayClick;
     private handleMonthClicked;
     private handleYearClicked;
     private handleInputChange;
-    private handleOnBlur;
+    private handleInputBlur;
+    private handleInputClearClick;
     private handleInputKeyDown;
+    private updateInputElementValue;
     connectedCallback(): void;
     componentDidLoad(): void;
     disconnectedCallback(): void;

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

@@ -19,7 +19,7 @@ declare enum SelectionMode {
 }
 /**
  * @since 1.0
- * @status stable
+ * @status deprecated. Use six-date instead.
  *
  * @slot - Used to define a footer for the date picker.
  * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.

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

@@ -1,5 +1,8 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { EmptyPayload } from '../../utils/types';
+export interface SixDialogRequestClose {
+    source: 'close-button' | 'keyboard' | 'overlay';
+}
 /**
  * @since 1.0
  * @status stable
@@ -56,8 +59,12 @@ export declare class SixDialog {
      * allow you to set it on a different element in the dialog, such as an input or button.
      */
     sixInitialFocus: EventEmitter<EmptyPayload>;
-    /** Emitted when the overlay is clicked. Calling `event.preventDefault()` will prevent the dialog from closing. */
-    sixOverlayDismiss: EventEmitter<EmptyPayload>;
+    /**
+     * Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or
+     * pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing
+     * the drawer will result in destructive behavior such as data loss.
+     */
+    sixRequestClose: EventEmitter<SixDialogRequestClose>;
     connectedCallback(): void;
     componentWillLoad(): void;
     componentDidLoad(): void;
@@ -69,6 +76,7 @@ export declare class SixDialog {
     private handleCloseClick;
     private handleKeyDown;
     private handleOverlayClick;
+    private preventClose;
     private handleSlotChange;
     private handleTransitionEnd;
     render(): any;

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

@@ -1,5 +1,8 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { EmptyPayload } from '../../utils/types';
+export interface SixDrawerRequestClose {
+    source: 'close-button' | 'keyboard' | 'overlay';
+}
 /**
  * @since 1.0
  * @status stable
@@ -62,8 +65,12 @@ export declare class SixDrawer {
      * allow you to set it on a different element in the drawer, such as an input or button.
      */
     sixInitialFocus: EventEmitter<EmptyPayload>;
-    /** Emitted when the overlay is clicked. Calling `event.preventDefault()` will prevent the drawer from closing. */
-    sixOverlayDismiss: EventEmitter<EmptyPayload>;
+    /**
+     * Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or
+     * pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing
+     * the drawer will result in destructive behavior such as data loss.
+     */
+    sixRequestClose: EventEmitter<SixDrawerRequestClose>;
     connectedCallback(): void;
     componentWillLoad(): void;
     disconnectedCallback(): void;
@@ -74,6 +81,7 @@ export declare class SixDrawer {
     private handleCloseClick;
     private handleKeyDown;
     private handleOverlayClick;
+    private preventClose;
     private handleSlotChange;
     private handleTransitionEnd;
     private resetTransitionVariables;

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

@@ -1,13 +1,10 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-interface ISingleFile {
-    file: File;
-}
-interface IMultipleFiles {
+export interface SixFileUploadSuccessPayload {
     files: FileList;
 }
-export type SixFileUploadSuccessPayload = ISingleFile | IMultipleFiles;
 export interface SixFileUploadFailurePayload {
     reason: string;
+    code: 'ONLY_ONE_FILE_ALLOWED' | 'ONE_OR_MORE_FILES_HAVE_INVALID_MIME_TYPE' | 'INVALID_MIME_TYPE' | 'ONE_OR_MULTIPLE_FILES_TOO_BIG' | 'FILE_TOO_BIG';
 }
 /**
  * @since 2.0.0
@@ -56,4 +53,3 @@ export declare class SixFileUpload {
     private renderLabel;
     render(): any;
 }
-export {};

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

@@ -1,3 +1,4 @@
+import { IconLibrary } from '../../utils/icon';
 /**
  * @since 1.0
  * @status stable
@@ -9,5 +10,21 @@ export declare class SixIcon {
     size: 'inherit' | 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge';
     /** If set to true the default material outlined icons are not used. */
     filled: boolean;
+    /**
+     * Icon library to use when no `library` prop is provided.
+     * By default, all `<six-icon>` instances fall back to the globally configured
+     * default library (via `setDefaultIconLibrary()` / `getDefaultIconLibrary()`),
+     * which is `"material-icons"` unless changed at runtime.
+     *
+     * This allows teams to switch the default across an entire project without
+     * having to set the `library` prop on every `<six-icon>` instance.
+     */
+    /**
+     * Icon library for this instance. Overrides the global default.
+     * - "material-icons"  → Material Icons
+     * - "material-symbols"  → Material Symbols
+     */
+    library?: IconLibrary;
+    private isSymbols;
     render(): any;
 }

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

@@ -10,7 +10,5 @@ export declare class SixPicto {
      * Defines the size of the icon.
      */
     size: 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge' | '4xl';
-    svgContent: string | null;
-    componentWillLoad(): Promise<void>;
     render(): any;
 }

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

@@ -0,0 +1,52 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { EmptyPayload } from '../../utils/types';
+export declare class SixRating {
+    el: HTMLSixRatingElement;
+    /** The rating's name attribute. */
+    name: string;
+    /** The rating's value attribute. */
+    value: number;
+    /** Set to true to disable the rating. */
+    disabled: boolean;
+    /** Set to true to show an asterisk beneath the label. */
+    required: boolean;
+    /** The label text. */
+    label: 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;
+    /** Maximum number of stars. Default is 5 */
+    max: number;
+    /** Size of the stars */
+    size: 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge';
+    /** If its readonly */
+    readonly: boolean;
+    /** The rating's help text. Alternatively, you can use the help-text slot. */
+    helpText: string;
+    /** Emitted when the control loses focus. */
+    sixBlur: EventEmitter<number>;
+    /** Emitted when the control's checked state changes. */
+    sixChange: EventEmitter<number>;
+    /** Emitted when the control gains focus. */
+    sixFocus: EventEmitter<EmptyPayload>;
+    hasFocus: boolean;
+    hasLabelSlot: boolean;
+    hasErrorSlot: boolean;
+    hoveredValue: number;
+    private static id;
+    private ratingId;
+    private labelId;
+    private errorTextId;
+    handleValueChange(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private handleSlotChange;
+    private handleBlur;
+    private handleFocus;
+    private handleKeyDown;
+    private renderStars;
+    render(): any;
+}

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

@@ -130,6 +130,7 @@ export declare class SixSelect {
     /** Sets focus on the select. */
     setFocus(options?: FocusOptions): Promise<void>;
     private getItemLabel;
+    private getSlottedItem;
     private getItems;
     private getVisibleItems;
     private getSelectionContainerItems;

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;
 }