@six-group/ui-library 4.0.3 → 4.1.0

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

@@ -12,92 +12,99 @@ export type SixItemPickerChangePayload = number | string | boolean | TimePeriod;
  *
  */
 export declare class SixItemPicker {
-  private readonly eventListeners;
-  host: HTMLSixItemPickerElement;
-  /** The item picker's value attribute. */
-  value: number | string;
-  /** The type of items you want to rotate through. */
-  type: ItemPickerType;
-  /** The minimum value allowed to pick. */
-  min?: number | string;
-  /** The maximum value allowed to pick. */
-  max?: number | string;
-  /** Define whether the picker should to a roundtrip i.e. start at max when reaching min and vice versa. */
-  roundtrip: boolean;
-  /** Defines how many steps should be taken when navigating */
-  step: number;
-  /** Defines a custom list of items you can iterate through */
-  items?: string[];
-  /** Defines whether the items should be padded */
-  padded: boolean;
-  /** Defines the length of the padded area */
-  paddingLength: number;
-  /** Defines the character used for padding */
-  paddingChar: string;
-  /** Defines whether the padding should be before or after the value. You can either use 'before' or 'after'. By default,
-   * before is selected */
-  paddingDirection: ItemPickerPaddingDirection;
-  /**
-   * Set the amount of time, in milliseconds, to wait to trigger faster switching between items.
-   */
-  timeout: number;
-  /**
-   * Set the amount of time, in milliseconds, to wait between switching to next item when mouse button is held pressed.
-   */
-  interval: number;
-  /**
-   * Emitted when the item picker's value changes
-   */
-  sixChange: EventEmitter<SixItemPickerChangePayload>;
-  /**
-   * Emitted when the item picker's value changes, but debounced
-   */
-  sixChangeDebounced: EventEmitter<SixItemPickerChangePayload>;
-  /**
-   * Set the amount of time, in milliseconds, to wait to trigger the `six-item-picker-change-debounced` event.
-   * If you want your change debounce event to not trigger when keeping the nav button pressed before, make sure debounce
-   * is a bit bigger than timeout, otherwise keeping the button pressed will trigger the event twice: once you click
-   * (and keep pressed) and once you release
-   */
-  debounce: number;
-  handleValueChange(): void;
-  protected debounceChanged(): void;
-  handleSetChange(): void;
-  _items: string[];
-  _itemIndexes: Record<string, number>;
-  private _timeoutNext;
-  private _intervalNext;
-  private _timeoutPrev;
-  private _intervalPrev;
-  componentWillLoad(): void;
-  componentDidLoad(): void;
-  disconnectedCallback(): void;
-  private handleSixItemPickerChangeDebounced;
-  private setup;
-  private setupNumberItems;
-  private setUpStringItems;
-  private getLastStringItem;
-  private getStringItems;
-  private getItemIndexes;
-  private previousItem;
-  private previousNumber;
-  private previousStringItem;
-  private nextItem;
-  private nextNumber;
-  private getStringItemIndex;
-  private nextStringItem;
-  private getNextItemByOperation;
-  private changeValue;
-  private isNumber;
-  private isInvalidNumber;
-  private isNextDisabled;
-  private isNextNumberDisabled;
-  private isPrevDisabled;
-  private isPreviousNumberDisabled;
-  private onMouseDownNext;
-  private onMouseUpNext;
-  private onMouseDownPrev;
-  private onMouseUpPrev;
-  private getFormattedValue;
-  render(): any;
+    private readonly eventListeners;
+    host: HTMLSixItemPickerElement;
+    /** The item picker's value attribute. */
+    value: number | string;
+    /** The type of items you want to rotate through. */
+    type: ItemPickerType;
+    /** The minimum value allowed to pick. */
+    min?: number | string;
+    /** The maximum value allowed to pick. */
+    max?: number | string;
+    /** Define whether the picker should to a roundtrip i.e. start at max when reaching min and vice versa. */
+    roundtrip: boolean;
+    /** Defines how many steps should be taken when navigating */
+    step: number;
+    /** Defines a custom list of items you can iterate through */
+    items?: string[];
+    /** Defines whether the items should be padded */
+    padded: boolean;
+    /** Defines the length of the padded area */
+    paddingLength: number;
+    /** Defines the character used for padding */
+    paddingChar: string;
+    /** Defines whether the padding should be before or after the value. You can either use 'before' or 'after'. By default,
+     * before is selected */
+    paddingDirection: ItemPickerPaddingDirection;
+    /**
+     * Set the amount of time, in milliseconds, to wait to trigger faster switching between items.
+     */
+    timeout: number;
+    /**
+     * Set the amount of time, in milliseconds, to wait between switching to next item when mouse button is held pressed.
+     */
+    interval: number;
+    /**
+     * Emitted when the item picker's value changes
+     */
+    sixChange: EventEmitter<SixItemPickerChangePayload>;
+    /**
+     * Emitted when the item picker's value changes, but debounced
+     */
+    sixChangeDebounced: EventEmitter<SixItemPickerChangePayload>;
+    /**
+     * Set the amount of time, in milliseconds, to wait to trigger the `six-item-picker-change-debounced` event.
+     * If you want your change debounce event to not trigger when keeping the nav button pressed before, make sure debounce
+     * is a bit bigger than timeout, otherwise keeping the button pressed will trigger the event twice: once you click
+     * (and keep pressed) and once you release
+     */
+    debounce: number;
+    handleValueChange(): void;
+    protected debounceChanged(): void;
+    handleSetChange(): void;
+    _items: string[];
+    _itemIndexes: Record<string, number>;
+    private _timeoutNext;
+    private _intervalNext;
+    private _timeoutPrev;
+    private _intervalPrev;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    private handleSixItemPickerChangeDebounced;
+    private setup;
+    private setupNumberItems;
+    private setUpStringItems;
+    private getLastStringItem;
+    private getStringItems;
+    private getItemIndexes;
+    private previousItem;
+    private previousNumber;
+    private previousStringItem;
+    private nextItem;
+    private nextNumber;
+    private getStringItemIndex;
+    private nextStringItem;
+    private getNextItemByOperation;
+    private changeValue;
+    private isNumber;
+    private isInvalidNumber;
+    private isNextDisabled;
+    private isNextNumberDisabled;
+    private isPrevDisabled;
+    private isPreviousNumberDisabled;
+    private onMouseDownNext;
+    private onMouseUpNext;
+    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-item-picker/types.d.ts

@@ -1,11 +1,11 @@
 export declare enum ItemPickerType {
-  NUMBER = "number",
-  LETTER = "letter",
-  CAPITAL_LETTER = "capital-letter",
-  LOWER_LETTER = "lower-letter",
-  CUSTOM = "custom"
+    NUMBER = "number",
+    LETTER = "letter",
+    CAPITAL_LETTER = "capital-letter",
+    LOWER_LETTER = "lower-letter",
+    CUSTOM = "custom"
 }
 export declare enum ItemPickerPaddingDirection {
-  BEFORE = "before",
-  AFTER = "after"
+    BEFORE = "before",
+    AFTER = "after"
 }

package/dist/types/components/six-language-switcher/six-language-switcher.d.ts

@@ -4,22 +4,22 @@ import { EventEmitter } from '../../stencil-public-runtime';
  * @status experimental
  **/
 export interface SixLanguageSwitcherInput {
-  key: string;
-  value: string;
+    key: string;
+    value: string;
 }
 export type SixLanguageSwitcherChangePayload = string;
 export declare class SixLanguageSwitcher {
-  /** The language which should be shown as selected */
-  selected?: string;
-  /** The languages which should be selectable options. */
-  languages: string[] | SixLanguageSwitcherInput[];
-  handleChangesLanguages(newValue: string[]): void;
-  /**
-   * Emitted when the language switchers value changes
-   */
-  sixChange: EventEmitter<SixLanguageSwitcherChangePayload>;
-  componentWillLoad(): void;
-  private updateSelectedLanguage;
-  private handleLanguageSwitching;
-  render(): any;
+    /** The language which should be shown as selected */
+    selected?: string;
+    /** The languages which should be selectable options. */
+    languages: string[] | SixLanguageSwitcherInput[];
+    handleChangesLanguages(newValue: string[]): void;
+    /**
+     * Emitted when the language switchers value changes
+     */
+    sixChange: EventEmitter<SixLanguageSwitcherChangePayload>;
+    componentWillLoad(): void;
+    private updateSelectedLanguage;
+    private handleLanguageSwitching;
+    render(): any;
 }

package/dist/types/components/six-layout-grid/six-layout-grid.d.ts

@@ -5,10 +5,10 @@
  * @slot - The grid's content
  */
 export declare class SixLayoutGrid {
-  host: HTMLSixLayoutGridElement;
-  /** Set the number of grid columns */
-  columns?: number;
-  handleColumnsChange(): void;
-  componentWillLoad(): void;
-  render(): any;
+    host: HTMLSixLayoutGridElement;
+    /** Set the number of grid columns */
+    columns?: number;
+    handleColumnsChange(): void;
+    componentWillLoad(): void;
+    render(): any;
 }

package/dist/types/components/six-main-container/six-main-container.d.ts

@@ -9,8 +9,8 @@
  * @part right-margin - The component's right margin area.
  */
 export declare class SixMainContainer {
-  host: HTMLSixMainContainerElement;
-  /** Set to false to remove top and bottom padding.  */
-  padded: boolean;
-  render(): any;
+    host: HTMLSixMainContainerElement;
+    /** Set to false to remove top and bottom padding.  */
+    padded: boolean;
+    render(): any;
 }

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

@@ -1,11 +1,11 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 export interface SixMenuItemData {
-  label: string;
-  value: string;
+    label: string;
+    value: string;
 }
 export interface SixMenuItemSelectedPayload {
-  name: string;
-  item: HTMLSixMenuItemElement;
+    name: string;
+    item: HTMLSixMenuItemElement;
 }
 /**
  * @since 1.0
@@ -18,63 +18,67 @@ export interface SixMenuItemSelectedPayload {
  * @part base - The component's base wrapper.
  */
 export declare class SixMenu {
-  private readonly eventListeners;
-  private menu?;
-  private menuWrapper?;
-  private typeToSelectString;
-  private typeToSelectTimeout?;
-  host: HTMLSixMenuElement;
-  /** Emitted when a menu item is selected. */
-  sixMenuItemSelected: EventEmitter<SixMenuItemSelectedPayload>;
-  /** Set to true to remove the box-shadow */
-  removeBoxShadow: boolean;
-  /** Set the options to be shown in the dropdown */
-  items: SixMenuItemData[] | null;
-  /** Defines how many items should be shown. If the number of items is larger than this property a scrollbar will be shown */
-  itemsShown?: number;
-  /** 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;
-  /**
-   * Used for virtual scrolling
-   * Define how many items should be rendered in the DOM when using virtual scrolling
-   */
-  itemSize: number;
-  /**
-   * Used for virtual scrolling
-   * Define the debounce for listening on scrolling changes in milliseconds.
-   * The lower the number the more sensitive the component reacts to scrolling changes.
-   */
-  scrollingDebounce: number;
-  /**
-   * Used to calculate which items should be rendered in the DOM
-   */
-  private scrollingIndex;
-  sixMenuItemHeight: number;
-  connectedCallback(): void;
-  componentWillLoad(): void;
-  private handleScrolling;
-  componentDidLoad(): void;
-  disconnectedCallback(): void;
-  /**
-   * Initiates type-to-select logic, which automatically selects an option based on what the user is currently typing.
-   * The key passed will be appended to the internal query and the selection will be updated. After a brief period, the
-   * internal query is cleared automatically. This method is intended to be used with the keydown event. Useful for
-   * enabling type-to-select when the menu doesn't have focus.
-   */
-  typeToSelect(key: string): Promise<void>;
-  private getItemsShown;
-  private setupForVirtualScrollingAfterRendering;
-  private getItems;
-  private getActiveItemIndex;
-  private getActiveItem;
-  private extractItemsFromDOM;
-  private setActiveItem;
-  private handleClick;
-  private handleKeyDown;
-  private getMenuWrapperStyle;
-  private getMenuContainerStyle;
-  private getScrollbarGhostStyle;
-  private renderItems;
-  render(): any;
+    private readonly eventListeners;
+    private menu?;
+    private menuWrapper?;
+    private typeToSelectString;
+    private typeToSelectTimeout?;
+    host: HTMLSixMenuElement;
+    /** Emitted when a menu item is selected. */
+    sixMenuItemSelected: EventEmitter<SixMenuItemSelectedPayload>;
+    /** Set to true to remove the box-shadow */
+    removeBoxShadow: boolean;
+    /** Set the options to be shown in the dropdown */
+    items: SixMenuItemData[] | null;
+    /** Defines how many items should be shown. If the number of items is larger than this property a scrollbar will be shown */
+    itemsShown?: number;
+    /** 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;
+    /**
+     * Used for virtual scrolling
+     * Define how many items should be rendered in the DOM when using virtual scrolling
+     */
+    itemSize: number;
+    /**
+     * Used for virtual scrolling
+     * Define the debounce for listening on scrolling changes in milliseconds.
+     * 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
+     */
+    private scrollingIndex;
+    sixMenuItemHeight: number;
+    connectedCallback(): void;
+    componentWillLoad(): void;
+    private handleScrolling;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    /**
+     * Initiates type-to-select logic, which automatically selects an option based on what the user is currently typing.
+     * The key passed will be appended to the internal query and the selection will be updated. After a brief period, the
+     * internal query is cleared automatically. This method is intended to be used with the keydown event. Useful for
+     * enabling type-to-select when the menu doesn't have focus.
+     */
+    typeToSelect(key: string): Promise<void>;
+    private getItemsShown;
+    private setupForVirtualScrollingAfterRendering;
+    private getItems;
+    private getActiveItemIndex;
+    private getActiveItem;
+    private extractItemsFromDOM;
+    private setActiveItem;
+    private handleClick;
+    private handleKeyDown;
+    private getMenuWrapperStyle;
+    private getMenuContainerStyle;
+    private getScrollbarGhostStyle;
+    private renderItems;
+    render(): any;
 }

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

@@ -7,5 +7,5 @@
  * @part base - The component's base wrapper.
  */
 export declare class SixMenuDivider {
-  render(): any;
+    render(): any;
 }

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

@@ -15,25 +15,31 @@
  * @part suffix - The suffix container.
  */
 export declare class SixMenuItem {
-  private menuItem?;
-  private defaultSlot?;
-  hasFocus: boolean;
-  /** Set to true to draw the item in a 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;
-  /** Set to true to draw the menu item in a disabled state. */
-  disabled: boolean;
-  connectedCallback(): void;
-  /** Sets focus on the button. */
-  setFocus(options?: FocusOptions): Promise<void>;
-  /** Removes focus from the button. */
-  removeFocus(): Promise<void>;
-  /** Returns a text label based on the contents of the menu item's default slot. */
-  getTextLabel(): Promise<string>;
-  private handleBlur;
-  private handleFocus;
-  private handleMouseEnter;
-  private handleMouseLeave;
-  render(): any;
+    private menuItem?;
+    private defaultSlot?;
+    host: HTMLSixMenuItemElement;
+    hasFocus: boolean;
+    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;
+    /** Set to true to draw the menu item in a disabled state. */
+    disabled: boolean;
+    connectedCallback(): void;
+    /** Sets focus on the button. */
+    setFocus(options?: FocusOptions): Promise<void>;
+    /** Removes focus from the button. */
+    removeFocus(): Promise<void>;
+    /** Returns a text label based on the contents of the menu item's default slot. */
+    getTextLabel(): Promise<string>;
+    private handleBlur;
+    private handleFocus;
+    private handleMouseEnter;
+    private handleMouseLeave;
+    private handleCheckboxChange;
+    render(): any;
 }

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

@@ -9,5 +9,5 @@
  * @part base - The component's base wrapper.
  */
 export declare class SixMenuLabel {
-  render(): any;
+    render(): any;
 }

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

@@ -5,10 +5,10 @@
  * @part icon - The component's icon wrapper.
  */
 export declare class SixPicto {
-  host: HTMLSixPictoElement;
-  /**
-   * Defines the size of the icon.
-   */
-  size: 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge' | '4xl';
-  render(): any;
+    host: HTMLSixPictoElement;
+    /**
+     * Defines the size of the icon.
+     */
+    size: 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge' | '4xl';
+    render(): any;
 }

package/dist/types/components/six-progress-bar/six-progress-bar.d.ts

@@ -11,9 +11,9 @@
  * @part label - The progress bar label.
  */
 export declare class SixProgressBar {
-  /** The progress bar's percentage, 0 to 100. */
-  percentage: number;
-  /** When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state. */
-  indeterminate: boolean;
-  render(): any;
+    /** The progress bar's percentage, 0 to 100. */
+    percentage: number;
+    /** When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state. */
+    indeterminate: boolean;
+    render(): any;
 }

package/dist/types/components/six-progress-ring/six-progress-ring.d.ts

@@ -10,15 +10,15 @@
  * @part label - The progress ring label.
  */
 export declare class SixProgressRing {
-  private indicator?;
-  /** The size of the progress ring in pixels. */
-  size: number;
-  /** The stroke width of the progress ring in pixels. */
-  strokeWidth: number;
-  /** The current progress percentage, 0 - 100. */
-  percentage: number;
-  handlePercentageChange(): void;
-  componentDidLoad(): void;
-  private updateProgress;
-  render(): any;
+    private indicator?;
+    /** The size of the progress ring in pixels. */
+    size: number;
+    /** The stroke width of the progress ring in pixels. */
+    strokeWidth: number;
+    /** The current progress percentage, 0 - 100. */
+    percentage: number;
+    handlePercentageChange(): void;
+    componentDidLoad(): void;
+    private updateProgress;
+    render(): any;
 }

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

@@ -14,42 +14,42 @@ import { EmptyPayload } from '../../utils/types';
  * @part label - The radio label.
  */
 export declare class SixRadio {
-  private inputId;
-  private labelId;
-  private nativeInput?;
-  private eventListeners;
-  host: HTMLSixRadioElement;
-  hasFocus: boolean;
-  /** The radio's name attribute. */
-  name: string;
-  /** The radio's value attribute. */
-  value: string;
-  /** Set to true to disable the radio. */
-  disabled: boolean;
-  /** Set to true to draw the radio in a checked state. */
-  checked: boolean;
-  /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */
-  invalid: boolean;
-  handleCheckedChange(): void;
-  handleNameChange(name: string): void;
-  /** Emitted when the control loses focus. */
-  sixBlur: EventEmitter<EmptyPayload>;
-  /** Emitted when the control's checked state changes. */
-  sixChange: EventEmitter<EmptyPayload>;
-  /** Emitted when the control gains focus. */
-  sixFocus: EventEmitter<EmptyPayload>;
-  connectedCallback(): void;
-  disconnectedCallback(): void;
-  /** Sets focus on the radio. */
-  setFocus(options?: FocusOptions): Promise<void>;
-  /** Removes focus from the radio. */
-  removeFocus(): Promise<void>;
-  private getAllRadios;
-  private getSiblingRadios;
-  private handleClick;
-  private handleBlur;
-  private handleFocus;
-  private handleKeyDown;
-  private handleMouseDown;
-  render(): any;
+    private inputId;
+    private labelId;
+    private nativeInput?;
+    private eventListeners;
+    host: HTMLSixRadioElement;
+    hasFocus: boolean;
+    /** The radio's name attribute. */
+    name: string;
+    /** The radio's value attribute. */
+    value: string;
+    /** Set to true to disable the radio. */
+    disabled: boolean;
+    /** Set to true to draw the radio in a checked state. */
+    checked: boolean;
+    /** If this property is set to true and an error message is provided by `errorText`, the error message is displayed.  */
+    invalid: boolean;
+    handleCheckedChange(): void;
+    handleNameChange(name: string): void;
+    /** Emitted when the control loses focus. */
+    sixBlur: EventEmitter<EmptyPayload>;
+    /** Emitted when the control's checked state changes. */
+    sixChange: EventEmitter<EmptyPayload>;
+    /** Emitted when the control gains focus. */
+    sixFocus: EventEmitter<EmptyPayload>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /** Sets focus on the radio. */
+    setFocus(options?: FocusOptions): Promise<void>;
+    /** Removes focus from the radio. */
+    removeFocus(): Promise<void>;
+    private getAllRadios;
+    private getSiblingRadios;
+    private handleClick;
+    private handleBlur;
+    private handleFocus;
+    private handleKeyDown;
+    private handleMouseDown;
+    render(): any;
 }