@banzamel/mineralui 0.1.0 → 0.2.1

package/dist/index.d.ts

@@ -1,11 +1,83 @@
 import { ChangeEvent } from 'react';
 import { CSSProperties } from 'react';
+import { Dispatch } from 'react';
 import { FocusEvent as FocusEvent_2 } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { KeyboardEvent as KeyboardEvent_2 } from 'react';
 import { ReactNode } from 'react';
+import { ReactPortal } from 'react';
 import { RefAttributes } from 'react';
+import { RefObject } from 'react';
+import { SetStateAction } from 'react';
+
+export declare function addMonths(date: Date, count: number): Date;
+
+export declare function addYears(date: Date, count: number): Date;
+
+export declare function adjustCursorAfterFormat(oldValue: string, newValue: string, oldCursor: number): number;
+
+export declare function Autocomplete<T = string>({ options, value, onChange, getOptionLabel, getOptionValue, filterOptions, multiple, freeSolo, debounceMs, onInputChange, loading, loadingText, noOptionsText, placeholder, disabled, name, id, variant, size, fullWidth, label, helperText, errorText, error, required, clearable, maxHeight, renderOption, renderTags, className, style, }: AutocompleteProps<T>): JSX_2.Element;
+
+export declare interface AutocompleteProps<T = string> {
+    options: T[];
+    value?: T | T[];
+    onChange?: (value: T | T[]) => void;
+    getOptionLabel?: (option: T) => string;
+    getOptionValue?: (option: T) => string;
+    filterOptions?: (options: T[], inputValue: string) => T[];
+    multiple?: boolean;
+    freeSolo?: boolean;
+    debounceMs?: number;
+    onInputChange?: (value: string) => void;
+    loading?: boolean;
+    loadingText?: string;
+    noOptionsText?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    name?: string;
+    id?: string;
+    variant?: AutocompleteVariant;
+    size?: MineralSize;
+    color?: MineralColor;
+    fullWidth?: boolean;
+    label?: string;
+    helperText?: string;
+    errorText?: string;
+    error?: boolean;
+    required?: boolean;
+    clearable?: boolean;
+    maxHeight?: number;
+    renderOption?: (option: T, isActive: boolean) => ReactNode;
+    renderTags?: (selected: T[], onRemove: (index: number) => void) => ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare type AutocompleteVariant = 'outlined' | 'filled' | 'underlined';
+
+export declare function capitalizeWords(value: string): string;
+
+export declare const Checkbox: ForwardRefExoticComponent<CheckboxProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface CheckboxProps {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    indeterminate?: boolean;
+    name?: string;
+    id?: string;
+    value?: string;
+    disabled?: boolean;
+    size?: MineralSize;
+    color?: MineralColor;
+    label?: ReactNode;
+    labelPosition?: 'right' | 'left';
+    error?: boolean;
+    errorText?: string;
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    className?: string;
+    style?: CSSProperties;
+}
 
 /**
  * Łączy klasy CSS, odfiltrowując falsy wartości.
@@ -13,8 +85,194 @@ import { RefAttributes } from 'react';
  */
 export declare function cn(...classes: (string | undefined | null | false)[]): string;
 
+export declare function composeValidators(...validators: ValidatorFn[]): ValidatorFn;
+
+export declare interface CurrencyFormatOptions {
+    decimalSeparator?: '.' | ',';
+    thousandSeparator?: ' ' | '.' | ',' | '';
+    precision?: number;
+}
+
+export declare function DatePicker({ value, defaultValue, onChange, format, locale, min, max, disabledDates, placeholder, disabled, readOnly, name, id, variant, size, label, helperText, errorText, error, required, clearable, inline, showTodayButton, firstDayOfWeek, fullWidth, className, style, }: DatePickerProps): JSX_2.Element;
+
+export declare interface DatePickerProps {
+    value?: Date | string;
+    defaultValue?: Date | string;
+    onChange?: (date: Date | null) => void;
+    format?: string;
+    locale?: 'pl' | 'en';
+    min?: Date | string;
+    max?: Date | string;
+    disabledDates?: Date[] | ((date: Date) => boolean);
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    name?: string;
+    id?: string;
+    variant?: DatePickerVariant;
+    size?: MineralSize;
+    label?: string;
+    helperText?: string;
+    errorText?: string;
+    error?: boolean;
+    required?: boolean;
+    clearable?: boolean;
+    inline?: boolean;
+    showTodayButton?: boolean;
+    firstDayOfWeek?: 0 | 1;
+    fullWidth?: boolean;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare type DatePickerVariant = 'outlined' | 'filled' | 'underlined';
+
+export declare function daysInMonth(year: number, month: number): number;
+
+export declare interface FieldRegistration {
+    name: string;
+    validate?: ValidatorFn[];
+    required?: boolean;
+}
+
+export declare function firstDayOfMonth(year: number, month: number): number;
+
+export declare function Form({ initialValues, onSubmit, onChange, validationMode, children, className, style, noValidate, }: FormProps): JSX_2.Element;
+
+export declare function formatCurrency(value: string, options?: CurrencyFormatOptions): string;
+
+export declare function formatDate(date: Date, format?: string): string;
+
+export declare function formatIBAN(value: string): string;
+
+export declare function formatNIP(value: string): string;
+
+export declare function formatPhone(value: string, options?: PhoneFormatOptions): string;
+
+export declare function formatTime(hours: number, minutes: number, seconds?: number, showSeconds?: boolean): string;
+
+export declare interface FormContextValue {
+    values: Record<string, unknown>;
+    errors: Record<string, string>;
+    touched: Record<string, boolean>;
+    registerField: (reg: FieldRegistration) => void;
+    unregisterField: (name: string) => void;
+    setFieldValue: (name: string, value: unknown) => void;
+    setFieldError: (name: string, error: string) => void;
+    setFieldTouched: (name: string, touched: boolean) => void;
+    validateField: (name: string) => ValidationResult;
+    validateAll: () => boolean;
+    resetForm: () => void;
+    isSubmitting: boolean;
+}
+
+export declare interface FormFieldProps {
+    name: string;
+    validate?: ValidatorFn[];
+    required?: boolean;
+    children: ReactNode;
+}
+
+export declare interface FormHelpers {
+    setSubmitting: (isSubmitting: boolean) => void;
+    resetForm: () => void;
+    setFieldError: (name: string, error: string) => void;
+}
+
+export declare interface FormProps {
+    initialValues?: Record<string, unknown>;
+    onSubmit?: (values: Record<string, unknown>, helpers: FormHelpers) => void | Promise<void>;
+    onChange?: (values: Record<string, unknown>) => void;
+    validationMode?: 'onSubmit' | 'onBlur' | 'onChange';
+    children: ReactNode | ((ctx: FormContextValue) => ReactNode);
+    className?: string;
+    style?: CSSProperties;
+    noValidate?: boolean;
+}
+
+export declare function getDayNames(locale?: 'pl' | 'en'): string[];
+
+export declare function getMonthNames(locale?: 'pl' | 'en'): string[];
+
 export declare const Input: ForwardRefExoticComponent<InputProps & RefAttributes<HTMLInputElement>>;
 
+export declare const InputCurrency: ForwardRefExoticComponent<InputCurrencyProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputCurrencyProps extends Omit<InputProps, 'type'> {
+    currency?: string;
+    currencySymbol?: string;
+    currencyPosition?: 'start' | 'end';
+    decimalSeparator?: '.' | ',';
+    thousandSeparator?: ' ' | '.' | ',' | '';
+    precision?: number;
+    min?: number;
+    max?: number;
+    allowNegative?: boolean;
+    onValueChange?: (value: number | null) => void;
+}
+
+export declare const InputEmail: ForwardRefExoticComponent<InputEmailProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputEmailProps extends Omit<InputProps, 'type'> {
+    validateOnBlur?: boolean;
+    validateOnChange?: boolean;
+    showValidIcon?: boolean;
+    onValidationChange?: (result: ValidationResult) => void;
+}
+
+export declare const InputIBAN: ForwardRefExoticComponent<InputIBANProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputIBANProps extends Omit<InputProps, 'type'> {
+    countryCode?: string;
+    formatOnChange?: boolean;
+    validateOnBlur?: boolean;
+    showValidIcon?: boolean;
+    onValidationChange?: (result: ValidationResult) => void;
+    onValueChange?: (rawValue: string, formattedValue: string) => void;
+}
+
+export declare const InputName: ForwardRefExoticComponent<InputNameProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputNameProps extends Omit<InputProps, 'type'> {
+    autoCapitalize?: boolean;
+    allowNumbers?: boolean;
+    allowSpecialChars?: boolean;
+    minWords?: number;
+    validateOnBlur?: boolean;
+    onValidationChange?: (result: ValidationResult) => void;
+}
+
+export declare const InputNumber: ForwardRefExoticComponent<InputNumberProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputNumberProps extends Omit<InputProps, 'type'> {
+    min?: number;
+    max?: number;
+    step?: number;
+    showStepper?: boolean;
+    precision?: number;
+    allowNegative?: boolean;
+    onValueChange?: (value: number | null) => void;
+}
+
+export declare const InputPassword: ForwardRefExoticComponent<InputPasswordProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputPasswordProps extends Omit<InputProps, 'type' | 'endIcon'> {
+    showToggle?: boolean;
+    showStrength?: boolean;
+    onStrengthChange?: (strength: PasswordStrength) => void;
+}
+
+export declare const InputPhone: ForwardRefExoticComponent<InputPhoneProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputPhoneProps extends Omit<InputProps, 'type'> {
+    countryCode?: string;
+    showCountryCode?: boolean;
+    formatOnChange?: boolean;
+    validateOnBlur?: boolean;
+    onValidationChange?: (result: ValidationResult) => void;
+    onValueChange?: (rawValue: string, formattedValue: string) => void;
+}
+
 export declare interface InputProps {
     type?: 'text' | 'password' | 'email' | 'number' | 'tel' | 'url' | 'search' | 'date' | 'datetime-local' | 'time';
     value?: string | number;
@@ -27,6 +285,7 @@ export declare interface InputProps {
     required?: boolean;
     autoFocus?: boolean;
     autoComplete?: string;
+    inputMode?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
     variant?: InputVariant;
     size?: MineralSize;
     color?: MineralColor;
@@ -54,8 +313,30 @@ export declare interface InputProps {
     labelClassName?: string;
 }
 
+export declare const InputSearch: ForwardRefExoticComponent<InputSearchProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputSearchProps extends Omit<InputProps, 'type' | 'startIcon'> {
+    debounceMs?: number;
+    onSearch?: (value: string) => void;
+}
+
+export declare const InputTaxId: ForwardRefExoticComponent<InputTaxIdProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface InputTaxIdProps extends Omit<InputProps, 'type'> {
+    taxIdType: TaxIdType;
+    formatOnChange?: boolean;
+    validateOnBlur?: boolean;
+    showValidIcon?: boolean;
+    onValidationChange?: (result: ValidationResult) => void;
+    onValueChange?: (rawValue: string) => void;
+}
+
 export declare type InputVariant = 'outlined' | 'filled' | 'underlined';
 
+export declare function isDateInRange(date: Date, min?: Date | null, max?: Date | null): boolean;
+
+export declare function isSameDay(a: Date, b: Date): boolean;
+
 export declare type MineralColor = 'primary' | 'success' | 'error' | 'warning' | 'info';
 
 export declare type MineralSize = 'sm' | 'md' | 'lg';
@@ -90,6 +371,288 @@ declare interface MineralThemeProviderProps {
     children: ReactNode;
 }
 
+export declare function parseCurrencyToNumber(formatted: string, thousandSeparator?: string, decimalSeparator?: string): number | null;
+
+export declare function parseDate(value: string, format?: string): Date | null;
+
+export declare function parseTime(value: string): {
+    hours: number;
+    minutes: number;
+    seconds: number;
+} | null;
+
+export declare type PasswordStrength = 'weak' | 'fair' | 'good' | 'strong';
+
+export declare interface PhoneFormatOptions {
+    countryCode?: string;
+    groupPattern?: number[];
+}
+
+export declare function Popover({ open, anchorRef, onClose, placement, matchWidth, offset, children, className, style, }: PopoverProps): JSX_2.Element | null;
+
+export declare type PopoverPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end';
+
+export declare interface PopoverProps {
+    open: boolean;
+    anchorRef: RefObject<HTMLElement | null>;
+    onClose: () => void;
+    placement?: PopoverPlacement;
+    matchWidth?: boolean;
+    offset?: number;
+    children: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare function Portal({ children, container }: PortalProps): ReactPortal | null;
+
+export declare interface PortalProps {
+    children: ReactNode;
+    container?: HTMLElement;
+}
+
+export declare const Radio: ForwardRefExoticComponent<RadioProps & RefAttributes<HTMLInputElement>>;
+
+export declare function RadioGroup({ name, value, defaultValue, onChange, direction, children, disabled, size, color, error, errorText, label, className, style, }: RadioGroupProps): JSX_2.Element;
+
+export declare interface RadioGroupProps {
+    name: string;
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    direction?: 'horizontal' | 'vertical';
+    children: ReactNode;
+    disabled?: boolean;
+    size?: MineralSize;
+    color?: MineralColor;
+    error?: boolean;
+    errorText?: string;
+    label?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare interface RadioProps {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    name?: string;
+    id?: string;
+    value?: string;
+    disabled?: boolean;
+    size?: MineralSize;
+    color?: MineralColor;
+    label?: ReactNode;
+    labelPosition?: 'right' | 'left';
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare function Select({ options, value, defaultValue, onChange, multiple, searchable, placeholder, disabled, name, id, variant, size, color, fullWidth, label, helperText, errorText, error, required, loading, clearable, maxHeight, noOptionsText, renderOption, renderValue, className, style, }: SelectProps): JSX_2.Element;
+
+export declare interface SelectOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+    group?: string;
+}
+
+export declare interface SelectProps {
+    options: SelectOption[];
+    value?: string | string[];
+    defaultValue?: string | string[];
+    onChange?: (value: string | string[]) => void;
+    multiple?: boolean;
+    searchable?: boolean;
+    placeholder?: string;
+    disabled?: boolean;
+    name?: string;
+    id?: string;
+    variant?: SelectVariant;
+    size?: MineralSize;
+    color?: MineralColor;
+    fullWidth?: boolean;
+    label?: string;
+    helperText?: string;
+    errorText?: string;
+    error?: boolean;
+    required?: boolean;
+    loading?: boolean;
+    clearable?: boolean;
+    maxHeight?: number;
+    noOptionsText?: string;
+    renderOption?: (option: SelectOption, isActive: boolean, isSelected: boolean) => ReactNode;
+    renderValue?: (selected: SelectOption | SelectOption[]) => ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare type SelectVariant = 'outlined' | 'filled' | 'underlined';
+
+export declare function stripNonAlphanumeric(value: string): string;
+
+export declare function stripNonDigits(value: string): string;
+
+export declare function stripTime(date: Date): Date;
+
+export declare type TaxIdType = 'NIP' | 'PESEL' | 'REGON';
+
+export declare const Textarea: ForwardRefExoticComponent<TextareaProps & RefAttributes<HTMLTextAreaElement>>;
+
+export declare interface TextareaProps {
+    value?: string;
+    defaultValue?: string;
+    name?: string;
+    id?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    required?: boolean;
+    autoFocus?: boolean;
+    rows?: number;
+    autoResize?: boolean;
+    minRows?: number;
+    maxRows?: number;
+    variant?: TextareaVariant;
+    size?: MineralSize;
+    color?: MineralColor;
+    fullWidth?: boolean;
+    label?: string;
+    helperText?: string;
+    errorText?: string;
+    error?: boolean;
+    success?: boolean;
+    maxLength?: number;
+    showCharCount?: boolean;
+    loading?: boolean;
+    onChange?: (e: ChangeEvent<HTMLTextAreaElement>) => void;
+    onFocus?: (e: FocusEvent_2<HTMLTextAreaElement>) => void;
+    onBlur?: (e: FocusEvent_2<HTMLTextAreaElement>) => void;
+    className?: string;
+    style?: CSSProperties;
+    textareaClassName?: string;
+    labelClassName?: string;
+}
+
+export declare type TextareaVariant = 'outlined' | 'filled' | 'underlined';
+
+export declare function TimePicker({ value, defaultValue, onChange, format, showSeconds, minuteStep, min, max, placeholder, disabled, readOnly, name, id, variant, size, label, helperText, errorText, error, required, clearable, fullWidth, className, style, }: TimePickerProps): JSX_2.Element;
+
+export declare interface TimePickerProps {
+    value?: string;
+    defaultValue?: string;
+    onChange?: (time: string) => void;
+    format?: '24h' | '12h';
+    showSeconds?: boolean;
+    minuteStep?: number;
+    min?: string;
+    max?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    name?: string;
+    id?: string;
+    variant?: TimePickerVariant;
+    size?: MineralSize;
+    label?: string;
+    helperText?: string;
+    errorText?: string;
+    error?: boolean;
+    required?: boolean;
+    clearable?: boolean;
+    fullWidth?: boolean;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare type TimePickerVariant = 'outlined' | 'filled' | 'underlined';
+
+export declare const Toggle: ForwardRefExoticComponent<ToggleProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface ToggleProps {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    name?: string;
+    id?: string;
+    disabled?: boolean;
+    size?: MineralSize;
+    color?: MineralColor;
+    label?: ReactNode;
+    labelPosition?: 'right' | 'left';
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    className?: string;
+    style?: CSSProperties;
+}
+
+export declare function unformatIBAN(value: string): string;
+
+export declare function useClickOutside(ref: RefObject<HTMLElement | null>, handler: () => void): void;
+
+export declare function useDebounce<T>(value: T, delay: number): T;
+
+export declare function useDebouncedCallback<T extends (...args: any[]) => void>(callback: T, delay: number): T;
+
+export declare function useFormContext(): FormContextValue | null;
+
+export declare function useFormField(name: string, options?: UseFormFieldOptions): UseFormFieldReturn;
+
+export declare interface UseFormFieldOptions {
+    validate?: ValidatorFn[];
+    required?: boolean;
+}
+
+export declare interface UseFormFieldReturn {
+    value: unknown;
+    error: string | undefined;
+    touched: boolean;
+    onChange: (value: unknown) => void;
+    onBlur: () => void;
+}
+
+export declare function useKeyboardNav({ itemCount, onSelect, onClose, isOpen, loop, }: UseKeyboardNavOptions): {
+    activeIndex: number;
+    setActiveIndex: Dispatch<SetStateAction<number>>;
+    resetIndex: () => void;
+    onKeyDown: (e: KeyboardEvent_2) => void;
+};
+
+export declare interface UseKeyboardNavOptions {
+    itemCount: number;
+    onSelect: (index: number) => void;
+    onClose: () => void;
+    isOpen: boolean;
+    loop?: boolean;
+}
+
 export declare function useTheme(): MineralTheme;
 
+export declare function validateEmail(value: string): ValidationResult;
+
+export declare function validateIBAN(value: string): ValidationResult;
+
+export declare function validateMaxLength(max: number): ValidatorFn;
+
+export declare function validateMinLength(min: number): ValidatorFn;
+
+export declare function validateNIP(value: string): ValidationResult;
+
+export declare function validatePattern(pattern: RegExp, message?: string): ValidatorFn;
+
+export declare function validatePESEL(value: string): ValidationResult;
+
+export declare function validatePhone(value: string, countryCode?: string): ValidationResult;
+
+export declare function validateRange(min?: number, max?: number): ValidatorFn;
+
+export declare function validateREGON(value: string): ValidationResult;
+
+export declare function validateRequired(value: string): ValidationResult;
+
+export declare interface ValidationResult {
+    valid: boolean;
+    error?: string;
+}
+
+export declare type ValidatorFn = (value: string) => ValidationResult;
+
 export { }