@stihl-design-system/components
Version:
Welcome to the STIHL Design System react component library.
81 lines (80 loc) • 3.21 kB
TypeScript
import { DSLanguage } from '../../utils';
import { InputFileProps } from './InputFile';
export type InputFileLanguage = DSLanguage;
export type InputFileTranslations = {
/** Instructions for the drag-and-drop area. */
dragAndDropInstructions: string;
/** Feedback message when file exceeds maximum size. */
feedbackFileSize: string;
/** Feedback message when file type is not allowed. */
feedbackFileType: string;
/**
* Label for the button to remove a file from selected files.
*
* Placeholder: `{fileName}` = the name of the file.
*/
fileListRemoveSelectionButtonLabel: string;
/**
* Label for the button to cancel an ongoing upload.
*
* Placeholder: `{fileName}` = the name of the file.
*/
fileListCancelUploadButtonLabel: string;
/**
* Label for the button to delete a file.
*
* Placeholder: `{fileName}` = the name of the file.
*/
fileListDeleteFileButtonLabel: string;
/**
* Announced when a file upload is in an indeterminate state.
*
* Placeholder: `{fileName}` = the name of the file.
*/
fileListIndeterminate: string;
/**
* Alt text for a file preview image.
*
* Placeholder: `{fileName}` = the name of the file.
*/
fileListPreviewAltText: string;
/** Hint text announced when files are selected. */
filesSelectedHint: string;
/** Word "required" used in form field announcements. */
required: string;
/** Label for the upload status section. */
uploadStatus: string;
/** Text shown while a file is uploading. */
uploading: string;
/** Text shown when upload is complete. */
success: string;
/** Text for the retry upload action. */
retry: string;
/** Label for the popover toggle button. */
togglePopover: string;
};
export declare const DS_INPUT_FILE_TRANSLATIONS_EN: InputFileTranslations;
export declare const DS_INPUT_FILE_TRANSLATIONS_DE: InputFileTranslations;
export declare const DS_INPUT_FILE_TRANSLATIONS: Record<string, InputFileTranslations>;
/**
* @param file the File you just got from input.files[0]
* @param acceptAttr the literal string from your <input accept="…">
* @returns true if the file would have been allowed by the browser’s picker UI
*/
export declare const fileMatchesAccept: (file: File, acceptAttr: string) => boolean;
type ValidationProps = Pick<InputFileProps, 'id' | 'label' | 'inputFileButtonProps' | 'hideLabel' | 'popoverContent'>;
/**
* Validates the required props for the `DSInputFile` component.
*
* Ensures that:
* - A unique `id` is provided.
* - A `label` is provided for accessibility (a11y) reasons.
* - If `inputFileButtonProps` is provided, it must include a `label` for accessibility.
*
* Throws descriptive errors if any of the conditions are not met.
*
* @param {ValidationProps} params -The subset of DSInputFile properties to validate. This includes
* properties related to the prefix, suffix, icons and action button of the input.
*/
export declare const validateInputFileProps: ({ id, label, inputFileButtonProps, hideLabel, popoverContent, }: ValidationProps) => void;
export {};