@riverty/web-components 6.2.0 → 6.3.0

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

@@ -1,317 +0,0 @@
-import { EventEmitter } from '../../stencil-public-runtime';
-import { ListboxPosition } from './exports';
-/**
- * A select allows the user to choose between a set of options.
- *
- * Overall behavior is based on native `<select>`
- *
- */
-export declare class Select {
-    host: HTMLRSelectElement;
-    /** Specifies the `id` of the `<form>` to which the element belongs */
-    form?: string;
-    /** Specifies if element must be ignored during validation of the form elements */
-    novalidate?: boolean;
-    /** Name of element (data) within a form */
-    name?: string;
-    /** Selected value */
-    value?: string;
-    /** The text on the label */
-    label: string;
-    /** Specifies if the component is internal */
-    internal?: boolean;
-    /** Text that is presented until an option has been selected */
-    placeholder?: string;
-    /**
-     * Optional hint, visually presented under the select,
-     * giving additional context to the user
-     */
-    hint?: string;
-    /** Prevent user interaction and apply disabled style */
-    disabled?: boolean;
-    /** Specifies that select value is required */
-    required?: boolean;
-    /** Text of an additional marker in the label */
-    fieldIndicator?: string;
-    /** Visual indication of valid state */
-    valid?: boolean;
-    /** Validity indicator, serving to change UI of the component */
-    invalid?: boolean;
-    /** Custom validation error message */
-    error?: string;
-    /** Define if select should render as a text item or a block */
-    fullWidth: boolean;
-    /** Define wether listbox appears on top or at the bottom of the select  */
-    listboxPosition: ListboxPosition;
-    /** Set custom message for `valueMissing` property of a ValidityState object (set by `required`) within Constrain Validation API */
-    valueMissingMessage?: string;
-    /** Set custom message for `customError` property of a ValidityState object indicating whether the element's custom validity message has been set to a non-empty string by calling the element's setCustomValidity() method. */
-    customErrorMessage?: string;
-    /** Defines if select is expanded */
-    expanded?: boolean;
-    /** Defines if select is in readonly state */
-    readonly?: boolean;
-    /**
-     * Enable combobox functionality to allow users to reduce the list of options by filtering.
-     */
-    combobox?: boolean;
-    /**
-     * Defines aria label for combobox toggle button
-     * @default "Toggle combobox"
-     */
-    toggleButtonAriaLabel?: string;
-    /**
-     * Defines the text that will be displayed if no results are found
-     * @default "No results found"
-     */
-    noResultsFound?: string;
-    /** Defines current state of listboxPosition */
-    listboxPositionState: string;
-    /** Custom validity state passed after validation */
-    validityState: string;
-    /** Custom validity message passed after validation */
-    validityMessage: string;
-    /** Is select expanded */
-    isExpanded: boolean;
-    /** Current state, reflecting if select is readonly */
-    isReadonly: boolean;
-    /** Save current value */
-    currentValue: string;
-    /** Value that must be displayed as selected option */
-    valueToDisplay: string;
-    isInitializing: boolean;
-    isResetting: boolean;
-    focusedOption: any;
-    isValueFocused: boolean;
-    isNoResultsFound: boolean;
-    /** Indicates if the user has interacted with the select (focused/clicked) */
-    touched: boolean;
-    /** Indicates if the value has been changed by user interaction */
-    dirty: boolean;
-    /** Emits event after each validation */
-    rValidate: EventEmitter<{
-        state: string;
-        message: string;
-    }>;
-    /** Emits `rChange` event when `<r-select>` value property changes */
-    rChange: EventEmitter<{
-        element: HTMLRSelectElement;
-        value: any;
-    }>;
-    /** Emits `rReset` event when `<r-select>` onReset event happens */
-    rReset: EventEmitter<{
-        element: HTMLRSelectElement;
-        value: any;
-    }>;
-    /** Sets the component into `readonly` state  */
-    setReadonly(): Promise<void>;
-    /** Clears readonly state from the component */
-    clearReadonly(): Promise<void>;
-    handleListboxPositionChange(): void;
-    handleExpandedChange(): void;
-    handleReadonlyChange(): void;
-    handleValueChange(value: string | null, oldValue: string | null): void;
-    /** Listen for custom event triggered by "onClick" event on `<r-select-option>` */
-    optionSelectAction(e: any): void;
-    tooltipFocusAction(): void;
-    onMouseup(e: any): void;
-    onKeyup(e: any): void;
-    /**
-     * Listen on window scroll
-     * and update tooltip position if needed
-     */
-    handleScrolling(): void;
-    /**
-     * Listen on window resizing
-     * and update tooltip position if needed
-     */
-    handleResizing(): void;
-    /**
-     * Set value of the select programmatically.
-     * Does NOT mark as dirty or emit change events.
-     * Use this for programmatic value updates.
-     */
-    setValue(value?: string): Promise<void>;
-    /**
-     * Internal method to set value from user interaction.
-     * Assumes dirty flag is already set by the caller.
-     * Will emit rChange if dirty flag is true.
-     */
-    private setValueFromUserInteraction;
-    /** Set value of the select */
-    getValue(): Promise<string>;
-    /** Reset select to its initial state */
-    reset(): Promise<void>;
-    /**
-     * Clears validation results.
-     */
-    resetValidation(): Promise<void>;
-    /**
-     * Returns whether the select has been touched (focused/clicked by user).
-     * @returns A boolean indicating whether the select has been touched.
-     */
-    isTouched(): Promise<boolean>;
-    /**
-     * Returns whether the select value has been changed by user interaction.
-     * @returns A boolean indicating whether the select is dirty.
-     */
-    isDirty(): Promise<boolean>;
-    /**
-     * Marks the select as untouched and pristine (not dirty).
-     */
-    markAsPristine(): Promise<void>;
-    /**
-     * Validates the textarea without triggering UI and returns a boolean indicating its validity.
-     * @returns A boolean indicating whether the textarea is valid.
-     */
-    checkValidity(): Promise<boolean>;
-    /** Check validity and reveal validation state and message */
-    reportValidity(): Promise<boolean>;
-    /** Set focus on the element */
-    setFocus(): Promise<void>;
-    /** Remove focus from the element */
-    setBlur(): Promise<void>;
-    /** Expand options listbox */
-    expand(): Promise<void>;
-    /** Collapse options listbox */
-    collapse(): Promise<void>;
-    /**
-     * Retrieves the currently focused option within this select component.
-     *
-     * The focused option is identified by the presence of the `data-focused="true"`
-     * attribute on an `r-select-option` element inside the component's host.
-     *
-     * @returns Promise resolving to the focused `HTMLRSelectOptionElement`, or `null`
-     * if no option is currently marked as focused.
-     */
-    getFocusedOption(): Promise<HTMLRSelectOptionElement>;
-    /**
-     * Sets focus to the option at the specified index.
-     *
-     * Retrieves the option element from the internal optionElements collection
-     * and delegates focusing logic to `setOptionFocus`.
-     *
-     * @param index - Zero-based index of the option to focus. If the index is out of bounds
-     * or the corresponding option element is unavailable, the method will no-op.
-     *
-     * @returns A promise that resolves with the result of `setOptionFocus`, typically indicating
-     * success or failure of applying focus (implementation dependent).
-     */
-    setFocusedOption(index: any): Promise<void>;
-    private clearOptionsFocus;
-    private setComboboxValueOnCollapse;
-    private get focusedOptions();
-    private toggle;
-    private handleSlotChange;
-    /**
-     * Initial attributes state
-     * */
-    private initial;
-    private messageContainer;
-    private get selectedElement();
-    private get initiallySelectedElement();
-    /** Identify wrapping form element */
-    private get parentFormEl();
-    /**
-     * Determine whether this element should be ignored
-     * during Constraint Validation API validation.
-     * */
-    private get isNoValidate();
-    private get optionElements();
-    private get optionElementsArray();
-    /** Ref element: input that provides value to Constraint Validation API */
-    private nativeElement?;
-    /** Ref element: block displaying the selected option value */
-    private valueElement?;
-    /** Ref element: block for combobox container element */
-    private comboboxContainerElement?;
-    /** Ref element: Listbox, containing options list */
-    private listboxElement?;
-    /** Ref element: visually hidden element to alert screen reader users that no results found */
-    private statusElement?;
-    /** Unique id */
-    private uniqueId;
-    private listboxWidthObserver?;
-    private getValidityStateData;
-    private validateFormElement;
-    private deselectOptions;
-    private get isBusy();
-    private _renderSelected;
-    private setOptionFocus;
-    private focusPrevOption;
-    private focusNextOption;
-    private typeaheadBuffer;
-    private typeaheadTimeout;
-    private lastTypeaheadIndex;
-    /**
-     * Return option elements whose label starts with the filter text (case-insensitive).
-     */
-    private filterOptions;
-    /**
-     * Return the index (within the provided array) of an option matching the filter.
-     * If the filter is multiple iterations of the same letter (e.g. 'aaa'), cycle through
-     * first-letter matches starting from startIndex.
-     * Returns -1 if no match.
-     */
-    private getIndexByLetter;
-    private handleTypeahead;
-    private contributeToFormData;
-    private onValueClick;
-    private keyboardEventHandlerFactory;
-    private onValueKeydown;
-    private onComboboxKeydown;
-    private onValueBlur;
-    private onValueFocus;
-    private filterOptionsListByComboboxValue;
-    private clearComboboxOptions;
-    private onComboboxChange;
-    private onComboboxInput;
-    private onSubmitForm;
-    private onResetForm;
-    private connectFormEventListeners;
-    private disconnectFormEventListeners;
-    private defineHostWidth;
-    private _renderNativeOption;
-    private notVisible;
-    /**
-     * Finds first element's parent with not visible overflow.
-     * @param element -- parent element
-     * @param initEl -- initial(child) element
-     */
-    private findOverflowParent;
-    private get ariaDescribedBy();
-    /**
-      * Parent with non visible overflow
-      */
-    get overflowedParent(): HTMLElement;
-    /**
-     * Available space at the top
-     */
-    get top(): number;
-    /**
-     * Available space at the bottom
-     */
-    get bottom(): number;
-    /**
-     * Set correct tooltip position.
-     * First it checks the available space for a defined position and then sets the new one based on the available space.
-     */
-    private defineListboxPositionState;
-    private initialize;
-    private initializeStyleObserver;
-    private get hasError();
-    private get hasValidationError();
-    private get hasMessage();
-    private get isInteractive();
-    private get hasLeadingSlot();
-    private get hasOptionIcon();
-    private get isLeadingSlotRendered();
-    private get isPlaceholder();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    componentWillLoad(): void;
-    componentDidLoad(): void;
-    private renderSelect;
-    private renderCombobox;
-    render(): any;
-}

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

@@ -1,113 +0,0 @@
-import { EventEmitter } from '../../stencil-public-runtime';
-import { IconName, IconPosition, IconSize } from '../icon/exports';
-/**
- * `<r-select-option>` represents a single choice inside `<r-select>`.
- *
- * Accessibility:
- * - Hosts `role="option"` and `aria-selected` / `aria-disabled`.
- * - Emits granular events consumed by the parent select for state + keyboard logic.
- *
- * Keyboard (handled by parent `<r-select>`):
- * - Arrow keys move focus between options.
- * - Enter/Space commit the focused option.
- * - Typeahead supported via characters typed while the listbox is open.
- *
- * Do not use directly outside `<r-select>`.
- */
-export declare class SelectOption {
-    host: HTMLRSelectOptionElement;
-    /**
-     * When true, the option is not focusable or selectable.
-     * @default false
-     */
-    disabled: boolean;
-    /**
-     * Marks the option as selected. Controlled by `<r-select>`; not user‑set in isolation.
-     * @default false
-     */
-    selected: boolean;
-    /**
-     * Value submitted with a form when this option is selected.
-     * If omitted or empty, it's auto-filled from text content / `label`.
-     */
-    value?: string;
-    /**
-     * Presentational label. Falls back to slotted text; finally to `value`.
-     * Use `label` if the rendered text differs from the submitted `value`.
-     */
-    label?: string;
-    /**
-     * Name of an icon from the design system icon set to render with the option.
-     * Mutually exclusive with a provided `<slot name="icon">`.
-     */
-    icon?: IconName;
-    /**
-     * Icon size (applied when `icon` provided).
-     * @default "m"
-     */
-    iconSize?: IconSize;
-    /**
-     * Icon color token / CSS color value (when `icon` provided).
-     * @default "var(--r-select-option--color)"
-     */
-    iconColor?: string;
-    /**
-     * Icon position relative to label content.
-     * @default "start"
-     */
-    iconPosition?: IconPosition;
-    /** Internal unique id assigned for accessibility / focus tracking. */
-    private uniqueId;
-    /**
-     * Fires when the option is activated via pointer (not disabled).
-     * Payload includes the element + its value (resolved).
-     */
-    optionClick: EventEmitter<{
-        element: HTMLRSelectOptionElement;
-        value: any;
-    }>;
-    isFocused: boolean;
-    isSelected: boolean;
-    /**
-     * Sets the component's focus state programmatically.
-     * @method
-     * @returns Promise that resolves once the focus state has been applied.
-     */
-    setFocus(): Promise<void>;
-    /**
-     * Removes the component's focus state programmatically.
-     * @method
-     * @returns Promise that resolves once the focus state has been removed.
-     */
-    setBlur(): Promise<void>;
-    /**
-     * Marks this option as selected.
-     *
-     * Sets the internal `isSelected` flag to `true`. Declared as `async` to allow for
-     * future asynchronous side effects or integration with async selection workflows,
-     * and may be safely awaited by callers.
-     *
-     * Idempotent: calling it multiple times will keep the option selected.
-     *
-     * @returns Promise that resolves once the selection state has been updated.
-     */
-    setSelected(): Promise<void>;
-    /**
-     * Clears the current selection state for this option by setting `isSelected` to `false`.
-     *
-     * Intended for use when programmatically resetting or updating the selection (e.g., on form reset
-     * or when enforcing single-selection logic in a parent component).
-     *
-     * Side effects:
-     * - Triggers any reactive updates or re-renders that depend on `isSelected`.
-     *
-     * @returns A promise that resolves after the selection state has been cleared.
-     */
-    clearSelected(): Promise<void>;
-    private handleClick;
-    private handleKeydown;
-    get hasIconSlot(): boolean;
-    get definedValue(): string;
-    componentWillLoad(): void;
-    render(): any;
-}

package/dist/types/components/skip-link/exports.d.ts

@@ -1,2 +0,0 @@
-export declare const skipLinkPositionArray: readonly ["left", "center"];
-export type SkipLinkPosition = typeof skipLinkPositionArray[number];

package/dist/types/components/skip-link/skip-link.d.ts

@@ -1,6 +0,0 @@
-import { SkipLinkPosition } from './exports';
-export declare class SkipLink {
-    /** Defines skip link position */
-    position: SkipLinkPosition;
-    render(): any;
-}

package/dist/types/components/stepper/stepper.d.ts

@@ -1,22 +0,0 @@
-export declare class Stepper {
-    host: HTMLRStepperElement;
-    /** Complete steps. Default value 0 */
-    completed: number;
-    /** _DEPRECATED_ (use `completed` instead) Completed steps. Default value 0 */
-    completeSteps: number;
-    /** Total number of steps. Used when no slot-based steps provided. */
-    total?: number;
-    /** Label for the stepper for screen reader users. */
-    label?: string;
-    /** Label for completed steps for screen reader users. */
-    completedStepsLabel?: string;
-    handleCompletedStepsLabelChange(): void;
-    onResize(): void;
-    private get hasSteps();
-    componentDidLoad(): void;
-    private handleSlotChange;
-    private setStepStatus;
-    private getTextElementWidth;
-    updateVisibilityOfStepText(): void;
-    render(): any;
-}

package/dist/types/components/stepper-item/stepper-item.d.ts

@@ -1,23 +0,0 @@
-import { IconName } from "../icon/exports";
-export declare class StepperItem {
-    host: HTMLRStepperItemElement;
-    /** Defines a property complete that determines whether the step is complete */
-    complete: boolean;
-    /** Defines a property active that determines whether the step is active */
-    active: boolean;
-    /** Defines an icon for the step. Optional. */
-    icon?: IconName;
-    /** Defines the step number. Optional. */
-    number?: number;
-    /** _DEPRECATED_ (use `number` instead) Index of the progress step */
-    stepNumber?: number;
-    /** Label for the step icon for screen reader users. */
-    label?: string;
-    /**
-     * Checks if the slot contains only visually-hidden elements (no visible text).
-     * Returns true if only visually-hidden elements are present.
-     */
-    private get hasOnlyVisuallyHiddenContent();
-    private get hasText();
-    render(): any;
-}

package/dist/types/components/tab/tab.d.ts

@@ -1,23 +0,0 @@
-import { EventEmitter } from '../../stencil-public-runtime';
-export declare class RTab {
-    host: HTMLRTabElement;
-    /** Indicates if `<r-tab>` is disabled */
-    disabled: boolean;
-    /** Indicates if `<r-tab>` is active */
-    active: boolean;
-    /** Id of the panel that `<r-tab>` controls */
-    panelId: string;
-    /** Emits `click` event on the `<r-tab>`  */
-    tabChange: EventEmitter<{
-        element: HTMLRTabElement;
-    }>;
-    /** Emits `keydown` event on the `<r-tab>` to notify tabs component to move focus */
-    moveTabFocus: EventEmitter<{
-        element: HTMLRTabElement;
-        keycode: string;
-    }>;
-    private handleClick;
-    private handleKeyup;
-    private handleKeydown;
-    render(): any;
-}

package/dist/types/components/tab-panel/tab-panel.d.ts

@@ -1,7 +0,0 @@
-export declare class RTabPanel {
-    /** Defines if the `panel` is hidden */
-    active: boolean;
-    /** Id of the 'tab' connected to this `panel` */
-    tabId?: string;
-    render(): any;
-}

package/dist/types/components/tabs/tabs.d.ts

@@ -1,49 +0,0 @@
-import { EventEmitter } from '../../stencil-public-runtime';
-export declare class RTabs {
-    host: HTMLRTabsElement;
-    /** Determines if the tabs should update the browser's URL and allow navigation via history changes */
-    navigation?: boolean;
-    activeTab: any;
-    /** Emits `rChange` event when active `<r-tab>` changes */
-    rChange: EventEmitter<{
-        element: HTMLRTabElement;
-    }>;
-    /** `<r-tab>` group of elements */
-    private get tabElements();
-    /** `<r-tab-panel>` group of elements */
-    private get panelElements();
-    /** Active tab element */
-    private get activeTabElement();
-    /** Check if active tab element exists */
-    private get hasActiveTabElement();
-    /** Check if active tab element is disabled */
-    private get isActiveTabElementDisabled();
-    private get isStructureCorrect();
-    private get isMissingPanel();
-    private get isDisabledPanel();
-    private _disableTabIfPanelMissing;
-    private get tabGroupsAmount();
-    private markGroupsWithIndex;
-    private _connectTabsAndPanelsById;
-    private _disableTabIfPanelDisabled;
-    private transliterateToKebabCase;
-    private get tabIdFromUrl();
-    private get tabsGroupFromUrl();
-    private get groupFromData();
-    private _getTabElFromUrl;
-    private _defineInitiallyActiveTab;
-    private _selectInitialTabAndPanel;
-    private _selectTab;
-    private handlePopState;
-    private handleHistory;
-    private _changeFocusTab;
-    private scrollTabIntoView;
-    /** Listen for "click" event on `<r-tab>` */
-    tabChangeAction(event: any): void;
-    componentWillLoad(): void;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    /** Listen for "moveTabFocus" event on `<r-tab>` */
-    moveTabFocusAction(e: any): void;
-    render(): any;
-}

package/dist/types/components/tabs-list/exports.d.ts

@@ -1,4 +0,0 @@
-export declare const TabListVariantArray: readonly ["expanded", "compact"];
-export declare const ActiveTabBorderArray: readonly ["standard", "branded"];
-export type TabListVariant = typeof TabListVariantArray[number];
-export type ActiveTabBorder = typeof ActiveTabBorderArray[number];

package/dist/types/components/tabs-list/tabs-list.d.ts

@@ -1,41 +0,0 @@
-import { ActiveTabBorder, TabListVariant } from './exports';
-export declare class RTabsList {
-    host: HTMLRTabsListElement;
-    /**
-     * Visual variant of the tab list
-     * @defaulr 'expanded'
-     * */
-    variant: TabListVariant;
-    /**
-     * Border style of the active tab
-     * @default 'standard'
-     * */
-    border: ActiveTabBorder;
-    /** Tooltip visibility for left scroll button */
-    scrollLeftTooltip: string;
-    /** Tooltip visibility for left right button */
-    scrollRightTooltip: string;
-    /** Indicates if the tab list is scrollable */
-    scrollable: boolean;
-    /** Indicates if the first tab is fully visible */
-    firstItemVisible: boolean;
-    /** Indicates if the last tab is fully visible */
-    lastItemVisible: boolean;
-    /** Listen for "click" event on `<r-tab>` */
-    tabChangeAction(event: any): void;
-    private containerRef?;
-    private resizeObserver?;
-    /** `<r-tab>` group of elements */
-    private get tabElements();
-    private initiatizeResizeObserver;
-    private updateScrollState;
-    private getVisibleTabOnLeft;
-    private getVisibleTabOnRight;
-    private scrollLeft;
-    private scrollRight;
-    private scrollToActiveTab;
-    private renderScrollButton;
-    componentDidLoad(): void;
-    disconnectedCallback(): void;
-    render(): any;
-}

package/dist/types/components/textarea/exports.d.ts

@@ -1,2 +0,0 @@
-export declare const textareaResizeArray: readonly ["none", "both", "horizontal", "vertical", "initial", "inherit"];
-export type TextareaResize = typeof textareaResizeArray[number];