@stihl-design-system/components/components/Input/Input.utils.d.ts

Welcome to the STIHL Design System react component library.

import { InputProps } from './Input';
export declare const MAX_PREFIX_LENGTH = 8;
export declare const MAX_SUFFIX_LENGTH = 5;
export declare const INPUT_SIZE: readonly ["medium", "small"];
export type InputSize = (typeof INPUT_SIZE)[number];
export declare const SUPPORTED_INPUT_TYPES: readonly ["color", "date", "datetime-local", "email", "month", "number", "range", "tel", "text", "time", "url"];
export type SupportedInputTypes = (typeof SUPPORTED_INPUT_TYPES)[number];
export declare const UNSUPPORTED_INPUT_TYPES: readonly ["week", "file", "hidden", "button", "checkbox", "password", "radio", "search", "reset", "submit", "image", "datetime"];
export type UnSupportedInputTypes = (typeof UNSUPPORTED_INPUT_TYPES)[number];
type ValidationProps = Pick<InputProps, 'hideLabel' | 'id' | 'label' | 'prefix' | 'popoverContent' | 'suffix' | 'leadingIconName' | 'leadingIconSource' | 'actionButtonProps'>;
/**
 * Validates the given properties of the DSInput component for common configuration errors.
 * This function is intended to be used in development mode to provide developers with
 * warnings about potential misuse of the component.
 *
 * @param validationProps - The subset of DSInput properties to validate. This includes
 *                          properties related to the prefix, suffix, icons and action button of the input.
 */
export declare const validateInputProps: ({ hideLabel, id, label, prefix, popoverContent, suffix, leadingIconName, leadingIconSource, actionButtonProps, }: ValidationProps) => void;
/**
 * Validates the input type for the DSInput component and provides warnings for certain unsupported types.
 *
 * @param {SupportedInputTypes} type - The input type to validate.
 * @throws {Error} Throws an error if the input type is not supported by the DSInput component.
 */
export declare const validateType: (type: SupportedInputTypes | UnSupportedInputTypes, autoComplete?: string | undefined) => void;
/**
 * Checks if the current browser supports the 'showPicker' attribute for date/time input fields
 * and is a compatible browser (Chrome, Chromium, Chrome on iOS, or Microsoft Edge).
 *
 * @returns {boolean} Returns `true` if 'showPicker' is supported in the current browser; otherwise, `false`.
 */
export declare const hasShowPickerSupport: () => boolean;
/**
 * Determines whether to show a custom calendar or time indicator based on browser support and specified flags.
 *
 * @param {boolean} isCalendar - Indicates whether to show the calendar.
 * @param {boolean} isTime - Indicates whether to show the time indicator.
 * @returns {boolean} Returns `true` if the browser supports the 'showPicker' attribute and
 *                   either 'isCalendar' or 'isTime' is `true`, otherwise returns `false`.
 */
export declare const showCustomCalendarOrTimeIndicator: (isCalendar: boolean, isTime: boolean) => boolean;
/**
 * Checks if the given input type is related to date or calendar input.
 *
 * @param {SupportedInputTypes} type - The input type to check.
 * @returns {boolean} Returns `true` if the input type is related to date or calendar input;
 *                   otherwise, returns `false`.
 */
export declare const isCalendarInput: (type: SupportedInputTypes) => boolean;
/**
 * Checks if the given input type is related to time input.
 *
 * @param {SupportedInputTypes} type - The input type to check.
 * @returns {boolean} Returns `true` if the input type is 'time';
 *                   otherwise, returns `false`.
 */
export declare const isTimeInput: (type: SupportedInputTypes) => boolean;
export {};