@six-group/ui-library 0.0.0-insider.012ddb2

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

@@ -0,0 +1,45 @@
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
+ *
+ * @slot - The menu item's label.
+ * @slot prefix - Used to prepend an icon or similar element to the menu item.
+ * @slot suffix - Used to append an icon or similar element to the menu item.
+ *
+ * @part base - The component's base wrapper.
+ * @part checked-icon - The container that wraps the checked icon.
+ * @part prefix - The prefix container.
+ * @part label - The menu item label.
+ * @part suffix - The suffix container.
+ */
+export declare class SixMenuItem {
+    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

@@ -0,0 +1,13 @@
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
+ *
+ * @slot - The menu label's content.
+ *
+ * @part base - The component's base wrapper.
+ */
+export declare class SixMenuLabel {
+    render(): any;
+}

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

@@ -0,0 +1,14 @@
+/**
+ * @since 1.1
+ * @status stable
+ *
+ * @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;
+}

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

@@ -0,0 +1,19 @@
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
+ *
+ * @slot - A label to show inside the indicator.
+ *
+ * @part base - The component's base wrapper.
+ * @part indicator - The progress bar indicator.
+ * @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;
+}

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

@@ -0,0 +1,24 @@
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
+ *
+ * @slot - A label to show inside the ring.
+ *
+ * @part base - The component's base wrapper.
+ * @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;
+}

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

@@ -0,0 +1,55 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { EmptyPayload } from '../../utils/types';
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
+ *
+ * @slot - The radio's label.
+ *
+ * @part base - The component's base wrapper.
+ * @part control - The radio control.
+ * @part checked-icon - The container the wraps the checked icon.
+ * @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;
+}

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

@@ -0,0 +1,93 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { EmptyPayload } from '../../utils/types';
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
+ *
+ * @slot label - The input's label. Alternatively, you can use the label prop.
+ * @slot help-text - Help text that describes how to use the input. Alternatively, you can use the help-text prop.
+ * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.
+ *
+ * @part base - The component's base wrapper.
+ * @part input - The native range input.
+ * @part tooltip - The range tooltip.
+ */
+export declare class SixRange {
+    private inputId;
+    private labelId;
+    private helpTextId;
+    private errorTextId;
+    private eventListeners;
+    private resizeObserver?;
+    private output?;
+    private nativeInput?;
+    host: HTMLSixRangeElement;
+    hasFocus: boolean;
+    hasHelpTextSlot: boolean;
+    hasErrorTextSlot: boolean;
+    hasLabelSlot: boolean;
+    hasTooltip: boolean;
+    /** The input's name attribute. */
+    name: string;
+    /** The input's value attribute. */
+    value: number;
+    /** Set to true to show an asterisk beneath the label. */
+    required: boolean;
+    /** The range's help text. Alternatively, you can use the help-text slot. */
+    helpText: string;
+    /** Set to true to disable the input. */
+    disabled: 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;
+    /** The input's min attribute. */
+    min: number;
+    /** The input's max attribute. */
+    max: number;
+    /** The input's step attribute. */
+    step: number;
+    /** The preferred placedment of the tooltip. */
+    tooltip: 'top' | 'bottom' | 'none';
+    /** A function used to format the tooltip's value. */
+    tooltipFormatter: (value: number) => string;
+    /** Emitted when the control's value changes. */
+    sixChange: EventEmitter<EmptyPayload>;
+    /** Emitted when the control loses focus. */
+    sixBlur: EventEmitter<EmptyPayload>;
+    /** Emitted when the control gains focus. */
+    sixFocus: EventEmitter<EmptyPayload>;
+    handleLabelChange(): void;
+    handleValueChange(): void;
+    connectedCallback(): void;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    /** Sets focus on the input. */
+    setFocus(options?: FocusOptions): Promise<void>;
+    /** Removes focus from the input. */
+    removeFocus(): Promise<void>;
+    private handleInput;
+    private handleBlur;
+    private handleFocus;
+    private handleSlotChange;
+    private handleTouchStart;
+    private syncTooltip;
+    private isFirefox;
+    private update;
+    /**
+     * from https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#value
+     */
+    private getDefaultValue;
+    /**
+     * For Firefox this functionality is not needed because it is supported by standard CSS.
+     */
+    private calculateColorRunnableTrack;
+    render(): any;
+}

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

@@ -0,0 +1,21 @@
+import { StageType } from '../six-stage-indicator/six-stage-indicator';
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * @slot header - Used to define the header component.
+ * @slot main - Used to define the components in the main area.
+ * @slot left-sidebar - Used to define the sidebar on the left side.
+ * @slot right-sidebar - Used to define the sidebar on the right side.
+ * @slot footer - Used to define the footer component.
+ */
+export declare class SixRoot {
+    host: HTMLSixRootElement;
+    /** 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;
+    render(): any;
+}

package/dist/types/components/six-search-field/six-search-field.d.ts

@@ -0,0 +1,31 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export interface SixSearchFieldChangePayload {
+    value: string;
+}
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * @slot - Used to define the results below the search component.
+ */
+export declare class SixSearchField {
+    /** The input's placeholder text. */
+    placeholder?: string;
+    /** Debounce time in milliseconds, default is 300 ms */
+    debounce: number;
+    /** Set to true to disable the input. */
+    disabled: boolean;
+    /** The input's value attribute. */
+    value: string;
+    /** Set to true to add a clear button when the input is populated. */
+    clearable: boolean;
+    /** Emitted when a search is triggered */
+    searchFieldChange: EventEmitter<SixSearchFieldChangePayload>;
+    private inputElement?;
+    private eventListeners;
+    private handleInputChange;
+    handleValueChange(): void;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    render(): any;
+}

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

@@ -0,0 +1,165 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { EmptyPayload } from '../../utils/types';
+import { SixMenuItemData } from '../six-menu/six-menu';
+export interface SixSelectChangePayload {
+    value: string | string[];
+    isSelected: boolean;
+}
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * Forked from https://github.com/shoelace-style/shoelace version v2.0.0-beta27.
+ *
+ * @slot - The select's options in the form of menu items.
+ * @slot label - The select's label. Alternatively, you can use the label prop.
+ * @slot help-text - Help text that describes how to use the select.
+ * @slot error-text - Error text that is shown for validation errors. Alternatively, you can use the error-text prop.
+ *
+ * @part base - The component's base wrapper.
+ * @part clear-button - The input's clear button, exported from six-input.
+ * @part form-control - The form control that wraps the label, input, and help text.
+ * @part help-text - The select's help text.
+ * @part icon - The select's icon.
+ * @part label - The select's label.
+ * @part menu - The select menu, a six-menu element.
+ * @part tag - The multiselect option, a six-tag element.
+ * @part tags - The container in which multiselect options are rendered.
+ */
+export declare class SixSelect {
+    private box?;
+    private menu?;
+    private dropdown?;
+    private displayValuesContainer?;
+    private overflowCount?;
+    private autocompleteInput?;
+    private inputId;
+    private labelId;
+    private helpTextId;
+    private errorTextId;
+    private eventListeners;
+    private activeItemIndex;
+    private resizeObserver;
+    host: HTMLSixSelectElement;
+    hasFocus: boolean;
+    hasHelpTextSlot: boolean;
+    hasLabelSlot: boolean;
+    hasErrorTextSlot: boolean;
+    isOpen: boolean;
+    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. */
+    disabled: boolean;
+    /** The select's name. */
+    name: string;
+    /** The select's placeholder text. */
+    placeholder: string;
+    /** The filter's placeholder text. */
+    filterPlaceholder?: string;
+    /** The debounce for the filter callbacks. */
+    filterDebounce?: number;
+    /** The select's size. */
+    size: 'small' | 'medium' | 'large';
+    /**
+     * Enable this option to prevent the panel from being clipped when the component is placed inside a container with
+     * `overflow: auto|scroll`.
+     */
+    hoist: boolean;
+    /** The value of the control. This will be a string or an array depending on `multiple`. */
+    value: string | string[];
+    /** Set to true to draw a pill-style select with rounded edges. */
+    pill: boolean;
+    /** The select's help text. Alternatively, you can use the help-text slot. */
+    helpText: string;
+    /** Set to true to show an asterisk beneath the label. */
+    required: boolean;
+    /** Set to true to add a clear button when the select is populated. */
+    clearable: 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;
+    /** Set to render as line */
+    line: boolean;
+    /** Set to true to allow filtering for entries in the dropdown */
+    filter: boolean;
+    /**
+     * Set to true to allow async filtering.
+     * When you enter something in the search field the component will only emit an event but not filter any elements itself.
+     * You can then simply listen to the 'six-async-filter-fired' event to manage the shown menu-items yourself
+     */
+    asyncFilter: boolean;
+    /**
+     * Set to true to turn the six-select into an autocomplete.
+     */
+    autocomplete: boolean;
+    /** The debounce for when the input changes for autocompletes should be emitted */
+    inputDebounce: number;
+    /** Set the options to be shown in the dropdown (alternative to setting the elements via html) */
+    options: SixMenuItemData[] | null;
+    /** 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;
+    handleDisabledChange(): void;
+    handleLabelChange(): void;
+    handleMultipleChange(): void;
+    handleValueChange(): Promise<void>;
+    /** Emitted when the control's value changes. */
+    sixChange: EventEmitter<SixSelectChangePayload>;
+    /** Emitted when the control gains focus. */
+    sixFocus: EventEmitter<EmptyPayload>;
+    /** Emitted when the control loses focus. */
+    sixBlur: EventEmitter<EmptyPayload>;
+    connectedCallback(): void;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    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;
+    private clearValues;
+    private handleKeyDown;
+    private selectAll;
+    private handleLabelClick;
+    private handleMenuSelect;
+    private handleMenuShow;
+    private handleMenuHide;
+    private handleSlotChange;
+    /**
+     * Sets the checked state of menu items and renders the displayed values.
+     */
+    private syncItemsFromValue;
+    private syncValueFromItems;
+    private updateDisplayedValues;
+    render(): any;
+    private hasSelection;
+    private hasDeselectedOptions;
+}

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

@@ -0,0 +1,7 @@
+export interface MenuItem {
+    value: string;
+}
+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 valueEquals(a: string | string[], b: string | string[]): boolean;
+export declare function isValueEmpty(value: string | string[]): boolean;

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

@@ -0,0 +1,55 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { EmptyPayload } from '../../utils/types';
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * @slot - Used to define the nested side bar [group] items.
+ */
+export declare class SixSidebar {
+    private willShow;
+    private willHide;
+    private sidebar?;
+    isVisible: boolean;
+    /** Sidebar position */
+    position: 'left' | 'right';
+    /** Indicates whether the sidebar is open. You can use this in lieu of the show/hide methods. */
+    open: boolean;
+    /** Sidebar width */
+    width: string;
+    /** Define whether sidebar is toggled meaning only one menu can be open at the same time*/
+    toggled: boolean;
+    /** Emitted when the sidebar opens. Calling `event.preventDefault()` will prevent it from being opened. */
+    sixShow: EventEmitter<EmptyPayload>;
+    /** Emitted after the sidebar opens and all transitions are complete. */
+    sixAfterShow: EventEmitter<EmptyPayload>;
+    /** Emitted when the sidebar closes. Calling `event.preventDefault()` will prevent it from being closed. */
+    sixHide: EventEmitter<EmptyPayload>;
+    /** Emitted after the sidebar closes and all transitions are complete. */
+    sixAfterHide: EventEmitter<EmptyPayload>;
+    /**
+     * Emitted when the sidebar opens and the panel gains focus. Calling `event.preventDefault()` will prevent focus and
+     * allow you to set it on a different element in the sidebar, such as an input or button.
+     */
+    sixInitialFocus: EventEmitter<EmptyPayload>;
+    handleOpenChange(): void;
+    private handleTransitionEnd;
+    componentWillLoad(): void;
+    componentDidRender(): void;
+    disconnectedCallback(): void;
+    private closeSiblingDetailsOnShow;
+    private setupTogglableMenuItems;
+    private markAllMenuItemsAsSelectableEmpty;
+    /** Toggles whether the sidebar should be shown or hidden */
+    toggle(): Promise<void>;
+    /** Shows the sidebar */
+    show(): Promise<void>;
+    /** Hides the sidebar */
+    hide(): Promise<void>;
+    /** Allows to select a menu item programmatically by index */
+    selectItemByIndex(index: number): Promise<void>;
+    /** Allows to select a menu item programmatically by name */
+    selectItemByName(value: string): Promise<void>;
+    private resetTransitionVariables;
+    render(): any;
+}

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

@@ -0,0 +1,20 @@
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * @slot - Used to define the nested displayed text of the item.
+ */
+export declare class SixSidebarItem {
+    /** A unique value to store in the sidebar item. This can be used as a way to identify sidebar items when selected. */
+    value: string;
+    /** Set to true to draw the item in a selected state. */
+    selected: boolean;
+    /** Set to true to draw the sidebar item in a disabled state. */
+    disabled: boolean;
+    /**
+     * Provide if the item should be rendered as anchor tag.
+     * Note, that the href is added automatically when using routerLink in Angular.
+     */
+    href: string | undefined;
+    render(): any;
+}

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

@@ -0,0 +1,33 @@
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * @slot - Used to define the nested sidebar [group] items.
+ */
+export declare class SixSidebarItemGroup {
+    readonly host: HTMLSixSidebarItemGroupElement;
+    hasItems: boolean;
+    /** Title of item group */
+    name: string;
+    /** Icon of the group */
+    icon: string;
+    /** A unique value to store in the sidebar item of the group label. This can be used as a way to identify sidebar items when selected. */
+    value: string;
+    /** Indicates whether the sidebar is shown */
+    open: boolean;
+    /** Custom summary icon name. */
+    summaryIcon?: string;
+    summaryIconHasContent: boolean;
+    /**
+     * Provide if the item should be rendered as anchor tag.
+     * Note, that the href is added automatically when using routerLink in Angular.
+     */
+    href: string | undefined;
+    connectedCallback(): void;
+    componentWillLoad(): void;
+    private handleSlotChange;
+    private isSubgroup;
+    private renderAsHref;
+    private provideSlot;
+    render(): any;
+}

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

@@ -0,0 +1,16 @@
+/**
+ * @since 1.0
+ * @status stable
+ *
+ * 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. */
+    six: boolean;
+    private renderSIXLogo;
+    private renderSimple;
+    render(): any;
+}

package/dist/types/components/six-stage-indicator/six-stage-indicator.d.ts

@@ -0,0 +1,6 @@
+export type StageType = 'DEV' | 'ITU' | 'ETU' | 'ACCEPTANCE' | 'PROD' | null;
+export declare class SixStageIndicator {
+    /** The indicators value attribute */
+    stage: StageType;
+    render(): any;
+}