@cars4ever/public-ui 0.0.80

package/dist/index.d.ts

@@ -0,0 +1,516 @@
+import { InputHTMLAttributes, MutableRefObject, FocusEventHandler, TextareaHTMLAttributes, ReactNode, ReactElement, ComponentType, HTMLAttributes, ButtonHTMLAttributes, AnchorHTMLAttributes } from 'react';
+import { IIconProps, IMediaUtilsProviderProps } from '@cars4ever/media-utils';
+export { CloudinaryService, ICloudinaryConfig, IIconProps, IImageNormalizationInfo, IImagePlaceholderProps, IImageSkeletonProps, IOptimizedImageProps, ImageCrop, ImagePlaceholder, ImageSkeleton, OptimizedImage } from '@cars4ever/media-utils';
+import { ReactMaskProps } from 'react-imask';
+import { FactoryOpts, FactoryArg } from 'imask';
+import { TextareaAutosizeProps } from 'react-textarea-autosize';
+import { Validate, FieldValues, UseFormProps } from 'react-hook-form';
+import { SliderProps } from 'rc-slider';
+import { OptionProps } from 'react-select';
+
+declare enum Locale {
+    DK = "dk",
+    SE = "se"
+}
+
+declare enum DeviceType {
+    Mobile = "mobile",
+    Tablet = "tablet",
+    Desktop = "desktop"
+}
+
+interface IDeviceTypeContext {
+    deviceType: DeviceType;
+    isMobile: boolean;
+    isTablet: boolean;
+    isDesktop: boolean;
+}
+declare const useDeviceType: () => IDeviceTypeContext;
+
+type DeepPartial<T> = {
+    [P in keyof T]?: T[P] extends Array<infer U> ? Array<DeepPartial<U>> : T[P] extends ReadonlyArray<infer U> ? ReadonlyArray<DeepPartial<U>> : T[P] extends {} ? DeepPartial<T[P]> : T[P];
+};
+
+interface IUseConfigurationOptions {
+    type?: 'decimal' | 'integer' | 'text' | 'date' | 'color' | 'datetime-local' | 'email' | 'tel' | 'time';
+    mask?: FactoryOpts['mask'];
+    customMaskConfig?: FactoryOpts;
+    allowNegative?: boolean;
+    toUpperCase?: boolean;
+    toLowerCase?: boolean;
+}
+
+type TOmittedBaseProps = 'defaultValue' | 'max' | 'min' | 'pattern' | 'onChange' | 'onBlur' | 'onFocus';
+type TInputBaseProps = Omit<InputHTMLAttributes<HTMLInputElement | HTMLTextAreaElement>, TOmittedBaseProps>;
+type TMaskInputOverrideProps = Omit<ReactMaskProps<HTMLInputElement | HTMLTextAreaElement>, 'unmask' | 'inputRef' | TOmittedBaseProps> & TInputBaseProps & {
+    unmask?: boolean;
+    type?: string;
+    inputRef?: MutableRefObject<HTMLInputElement | HTMLTextAreaElement | null>;
+};
+interface IBaseInputProps extends IUseConfigurationOptions, IValidationTargetProps<string | number | null>, Omit<TMaskInputOverrideProps, 'type' | 'value'> {
+    onChange?: (value: string) => void;
+    onFocus?: FocusEventHandler;
+    onBlur?: FocusEventHandler;
+}
+
+interface IMultilineInputProps extends Omit<IBaseInputProps, keyof IUseConfigurationOptions | 'unmask'>, Omit<TextareaAutosizeProps, keyof TextareaHTMLAttributes<HTMLTextAreaElement>> {
+    rows?: number;
+}
+
+type TInputElement$1 = HTMLInputElement | HTMLTextAreaElement;
+type TInputInstance = TInputElement$1 | null;
+type TInnerRef = MutableRefObject<TInputInstance> | ((instance: TInputInstance) => void);
+type IInputProps$1<Multiline extends boolean = false> = {
+    isMultiline?: Multiline;
+    innerRef?: TInnerRef;
+} & (Multiline extends true ? Omit<IMultilineInputProps, 'onBlur'> : Omit<IBaseInputProps, 'onBlur'>);
+
+interface IUseComputedLabelProps {
+    label?: string;
+    required?: boolean;
+}
+
+type TInputElement = HTMLInputElement | HTMLTextAreaElement;
+interface IUseInputProps {
+    value?: string | number | null;
+    defaultValue?: string | number | null;
+    isLoading?: boolean;
+    isDisabled?: boolean;
+    inputRef?: MutableRefObject<TInputElement | null>;
+    onChange?: (value: string | null) => void;
+    onBlur?: (value: string | null) => void;
+    onFocus?: FocusEventHandler;
+}
+
+type TInputVariant = 'standard' | 'outlined';
+type IInputProps<Multiline extends boolean = false> = IValidationTargetProps<string | number> & IInputProps$1<Multiline> & Partial<Pick<IUseInputProps, 'isLoading' | 'onChange' | 'onBlur' | 'onFocus'>> & IUseComputedLabelProps & {
+    startAdornment?: ReactNode;
+    endAdornment?: ReactNode;
+    shrinkLabel?: boolean;
+    helperText?: ReactNode;
+    variant?: TInputVariant;
+};
+declare const Input: <Multiline extends boolean = false>({ isMultiline, error, label, value, defaultValue, helperText, shrinkLabel, isDisabled, startAdornment, endAdornment, onChange, onFocus, onBlur, required, className, innerRef, isLoading, variant, ...rest }: IInputProps<Multiline>) => ReactElement;
+
+interface ICheckBoxProps extends IValidationTargetProps<boolean>, Omit<InputHTMLAttributes<HTMLElement>, 'label' | 'onChange' | 'value' | 'disabled' | 'defaultValue' | 'defaultChecked'> {
+    label?: ReactNode;
+    isDisabled?: boolean;
+    isIndeterminate?: boolean;
+    helperText?: ReactNode;
+    onChange?: (checked: boolean) => void;
+}
+declare const CheckBox: ({ error, className, label, onChange, isDisabled, isIndeterminate, innerRef, value, defaultValue, helperText, ...rest }: ICheckBoxProps) => ReactElement;
+
+interface IRadioGroupProps extends IValidationTargetProps<IOption['value']>, Omit<InputHTMLAttributes<HTMLInputElement>, 'disabled' | 'defaultValue' | 'value' | 'onChange'> {
+    onChange?: (selected: string) => void;
+    options: IOption[];
+    helperText?: ReactNode;
+}
+declare const RadioGroup: ({ options, className, defaultValue, value, onChange, helperText, error, ...rest }: IRadioGroupProps) => ReactElement;
+
+interface IRadioInputProps extends IValidationTargetProps<string>, Omit<InputHTMLAttributes<HTMLInputElement>, 'disabled' | 'defaultValue' | 'value' | 'onChange'> {
+    label?: ReactNode;
+    isDisabled?: boolean;
+    isChecked?: boolean;
+    onChange?: (value: string) => void;
+}
+declare const RadioInput: ({ name, label, value, isChecked, onChange, isDisabled, className, innerRef, ...rest }: IRadioInputProps) => ReactElement;
+
+type TSliderType = 'slider' | 'range';
+type TValue<Type extends TSliderType> = Type extends 'range' ? number[] : number;
+type ISliderProps<Type extends TSliderType = TSliderType, Value = TValue<Type>> = Omit<SliderProps, 'value' | 'disabled' | 'min' | 'max'> & IValidationTargetProps<Value> & {
+    type?: Type;
+    value?: Value;
+    min: number;
+    max: number;
+    onChange?: (value: Value) => void;
+    hideDots?: boolean;
+};
+declare const Slider: <Type extends TSliderType, Value = TValue<Type>>({ className, type, value, defaultValue, isDisabled, hideDots, dotStyle, min, max, onChange, ...rest }: ISliderProps<Type, Value>) => ReactElement;
+
+declare const sizes$1: {
+    small: string;
+    medium: string;
+    large: string;
+};
+type IOptionProps$1<OptionType extends ISelectorOption> = {
+    Icon?: ComponentType<IIconProps>;
+    isSelected?: boolean;
+    onClick?: (value: OptionType['value']) => void;
+    size?: keyof typeof sizes$1;
+    className?: string;
+} & OptionType;
+declare const Option$1: <OptionType extends ISelectorOption>({ label, value, size, className, isSelected, Icon, onClick }: IOptionProps$1<OptionType>) => ReactElement;
+
+declare const layouts: {
+    row: string;
+    column: string;
+    twoColumns: string;
+    fourColumns: string;
+};
+interface ISelectorProps<OptionType extends ISelectorOption> extends IValidationTargetProps<OptionType['value'] | null> {
+    className?: string;
+    options: OptionType[];
+    onChange?: (value: OptionType['value'] | null) => void;
+    Option?: ComponentType<IOptionProps$1<OptionType>>;
+    size?: IOptionProps$1<OptionType>['size'];
+    layout?: keyof typeof layouts;
+}
+declare const Selector: <OptionType extends ISelectorOption>({ value, options, onChange, className, layout, size, Option }: ISelectorProps<OptionType>) => ReactElement;
+
+interface IBaseSelectOptionsProps<OptionType extends IOption> {
+    options: OptionType[];
+}
+
+interface IBaseSelectProps<OptionType extends IOption> extends IBaseSelectOptionsProps<OptionType>, IValidationTargetProps<OptionType['value'] | null>, Partial<Pick<IInputProps, 'className' | 'isLoading' | 'isDisabled' | 'onFocus' | 'variant'>> {
+    label: string;
+    groupBy?: (option: OptionType) => string;
+    onChange?: (value: OptionType['value'] | null) => void;
+    onBlur?: (value: OptionType['value'] | null) => void;
+}
+
+interface IOptionProps<OptionType extends IOption> extends Omit<OptionProps<OptionType, false>, 'data'> {
+    data: OptionType;
+}
+declare const Option: <OptionType extends IOption>({ className, innerRef, isSelected, isFocused, innerProps, children }: IOptionProps<OptionType>) => ReactElement;
+
+type TBaseProps<OptionType extends IOption> = IValidationTargetProps<OptionType['value'] | null> & IBaseSelectProps<OptionType>;
+interface ICustomSelectProps<OptionType extends IOption> extends TBaseProps<OptionType> {
+    filterOption?: ((option: OptionType, rawInput: string) => boolean) | null;
+    Option?: ComponentType<IOptionProps<OptionType>>;
+}
+
+type ISelectProps<OptionType extends IOption, Searchable extends boolean = false> = {
+    isSearchable?: Searchable;
+} & (Searchable extends true ? ICustomSelectProps<OptionType> : IBaseSelectProps<OptionType>);
+declare const Select: <OptionType extends IOption, Searchable extends boolean = false>({ isSearchable, ...rest }: ISelectProps<OptionType, Searchable>) => ReactElement;
+
+interface IGlobalConfigOverrides {
+    Input?: Partial<Pick<IInputProps, 'variant'>>;
+}
+
+interface IGlobalConfig {
+    locale: Locale;
+    overrides?: IGlobalConfigOverrides;
+}
+
+interface INumberFormat {
+    thousandsSeparator: string;
+    radix: string;
+}
+
+interface IDateTimeFormat {
+    date: string;
+    time: string;
+}
+
+interface IValidationTargetProps<Value> {
+    error?: string;
+    name?: string;
+    value?: Value;
+    defaultValue?: Value;
+    isDisabled?: boolean;
+    innerRef?: MutableRefObject<HTMLInputElement | HTMLTextAreaElement | null>;
+}
+
+interface IOption {
+    label: string;
+    value: string | number;
+}
+
+interface ISelectorOption extends Omit<IOption, 'label'> {
+    label: ReactNode;
+    Icon?: ComponentType<IIconProps>;
+}
+
+interface IThemeProviderProps {
+    theme?: string;
+    children: ReactNode;
+}
+
+declare const useGlobalConfig: () => IGlobalConfig;
+
+interface IGlobalConfigProps extends IThemeProviderProps, IMediaUtilsProviderProps, DeepPartial<IGlobalConfig> {
+}
+declare const GlobalConfig: ({ theme, children, cloudinaryConfig, ...config }: IGlobalConfigProps) => ReactElement;
+
+declare const sizes: {
+    small: number;
+    medium: number;
+};
+interface IPlaceholderProviderProps {
+    showPlaceholder?: boolean;
+    children?: ReactNode;
+    size?: keyof typeof sizes;
+    className?: string;
+}
+declare const PlaceholderProvider: ({ className, showPlaceholder, size, children }: IPlaceholderProviderProps) => ReactElement;
+
+declare const variants$3: {
+    h1: string;
+    subtitle1: string;
+    subtitle2: string;
+    subtitle3: string;
+    subtitle4: string;
+    subtitle5: string;
+    body1: string;
+    body2: string;
+    body3: string;
+    caption1: string;
+    caption2: string;
+    overline1: string;
+    overline2: string;
+};
+declare const headings: {
+    h1: string;
+    h2: string;
+    h3: string;
+    h4: string;
+    h5: string;
+    h6: string;
+};
+type TComponentProps = HTMLAttributes<HTMLElement>;
+type THeading = keyof typeof headings;
+interface ITypographyProps extends TComponentProps {
+    className?: string;
+    variant: keyof typeof variants$3;
+    component?: THeading | 'div' | 'span';
+}
+declare const Typography: ({ className, component, variant, ...rest }: ITypographyProps) => ReactElement;
+
+interface IValueContainerProps {
+    className?: string;
+    children: ReactNode;
+}
+declare const ValueContainer: ({ children, className }: IValueContainerProps) => ReactElement;
+
+interface IHelperTextProps {
+    text: ReactNode;
+    className?: string;
+}
+declare const HelperText: ({ className, text }: IHelperTextProps) => ReactElement;
+
+declare const variants$2: {
+    contained: string;
+    outlined: string;
+    light: string;
+    text: string;
+};
+declare const sizeButton: {
+    small: string;
+    medium: string;
+};
+type TSize$1 = keyof typeof sizeButton;
+interface IButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'disabled'> {
+    variant?: keyof typeof variants$2;
+    size?: TSize$1;
+    Icon?: ComponentType<IIconProps>;
+    isLoading?: boolean;
+    isDisabled?: boolean;
+    contentClassName?: string;
+    innerRef?: MutableRefObject<HTMLButtonElement | null>;
+}
+declare const Button: ({ className, variant, size, isLoading, Icon, children, innerRef, contentClassName, isDisabled, type, ...rest }: IButtonProps) => ReactElement;
+
+declare const buttonSize: {
+    large: string;
+    standard: undefined;
+};
+type TSize = keyof typeof buttonSize;
+declare const variants$1: {
+    contained: string;
+    outlined: string;
+    light: string;
+};
+interface IButtonTagProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'disabled'> {
+    variant?: keyof typeof variants$1;
+    Icon?: ComponentType<IIconProps>;
+    isLoading?: boolean;
+    isDisabled?: boolean;
+    contentClassName?: string;
+    innerRef?: MutableRefObject<HTMLButtonElement | null>;
+    EndIcon?: ComponentType<IIconProps>;
+    size?: TSize;
+}
+declare const ButtonTag: ({ className, variant, isLoading, Icon, children, innerRef, contentClassName, isDisabled, size, EndIcon, ...rest }: IButtonTagProps) => ReactElement;
+
+declare const sizeVariants: Record<'small' | 'medium' | 'large' | 'extraLarge', ITypographyProps['variant']>;
+interface ILinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    EndIcon?: ComponentType<IIconProps>;
+    Icon?: ComponentType<IIconProps>;
+    size?: keyof typeof sizeVariants;
+    variant?: 'simple' | 'underlined';
+    color?: 'primary' | 'default';
+    isDisabled?: boolean;
+}
+declare const Link: ({ size, className, color, variant, children, Icon, EndIcon, isDisabled, ...rest }: ILinkProps) => ReactElement;
+
+interface IBackLinkProps {
+    label: ReactNode;
+    className?: string;
+    onClick: () => void;
+}
+declare const BackLink: ({ className, label, ...rest }: IBackLinkProps) => ReactElement;
+
+interface IFormFieldProps<P extends IValidationTargetProps<Value>, Value> {
+    Target: ComponentType<P>;
+    name: string;
+    validate?: Validate<Value, FieldValues> | Record<string, Validate<Value, FieldValues>>;
+}
+declare const FormField: <P extends IValidationTargetProps<Value>, Value>({ validate, Target, name, isDisabled: isFieldDisabled, defaultValue, ...rest }: IFormFieldProps<P, Value> & P) => ReactElement;
+
+interface IFormProviderProps<Form extends FieldValues> extends UseFormProps<Form> {
+    isDisabled?: boolean;
+    children: ReactNode;
+    className?: string;
+    onSubmit: (form: Form) => void;
+}
+declare const FormProvider: <Form extends FieldValues>({ className, isDisabled, children, onSubmit, ...options }: IFormProviderProps<Form>) => ReactElement;
+
+declare const useDateTimeFormat: () => IDateTimeFormat;
+
+declare const useFormattedDate: (value?: string) => string;
+
+declare const useFormattedDateTime: (value?: string) => string;
+
+declare const useFormattedTime: (value?: string) => string;
+
+declare const useNumberFormat: () => INumberFormat;
+
+type TFormatNumberByLocaleValue = number | null;
+declare const formatNumberByLocale: (value?: TFormatNumberByLocaleValue, options?: Intl.NumberFormatOptions, locale?: Locale) => string;
+
+declare const useFormattedNumber: (value?: TFormatNumberByLocaleValue, options?: Intl.NumberFormatOptions) => string;
+
+declare const useMaskedValue: (value: string, mask: FactoryArg) => string;
+
+declare const severities: {
+    info: string;
+    warning: string;
+    success: string;
+};
+interface IAlertProps {
+    severity: keyof typeof severities;
+    className?: string;
+    children: ReactNode;
+}
+declare const Alert: ({ severity, className, children }: IAlertProps) => ReactElement;
+
+declare const variants: {
+    accent: string;
+    advert: string;
+};
+type TVariant = keyof typeof variants;
+declare const curves: {
+    left: string;
+    right: string;
+};
+type TCurve = keyof typeof curves;
+interface ILabelProps {
+    className?: string;
+    curve?: TCurve;
+    variant?: TVariant;
+    children: ReactNode;
+}
+declare const Label: ({ className, curve, variant, children }: ILabelProps) => ReactElement;
+
+interface ISectionProps {
+    className?: string;
+    title: string;
+    children: ReactNode;
+    noContentOffset?: boolean;
+}
+declare const Section: ({ className, title, noContentOffset, children }: ISectionProps) => ReactElement;
+
+interface IActionButtonProps {
+    label: ReactNode;
+    onClick: () => void;
+}
+interface ISelectionBoxProps {
+    label?: ReactNode;
+    description: ReactNode;
+    className?: string;
+    actionButtonProps?: IActionButtonProps;
+}
+declare const SelectionBox: ({ label, description, actionButtonProps, className }: ISelectionBoxProps) => ReactElement;
+
+interface IInfoTableRow {
+    title: ReactNode;
+    value: ReactNode;
+}
+interface IInfoTableProps {
+    rows: IInfoTableRow[];
+    className?: string;
+}
+declare const InfoTable: ({ rows, className }: IInfoTableProps) => ReactElement;
+
+declare const arrayToMap: <T = any>(array: T[], key: keyof T) => Record<string, T>;
+
+declare class LocaleService {
+    private _locale;
+    get locale(): Locale;
+    set locale(locale: Locale);
+}
+declare const _default: LocaleService;
+
+declare const formatDate: (value?: string) => string;
+
+declare const formatDateByLocale: (value?: string, locale?: Locale) => string;
+
+declare const formatDateTime: (value?: string) => string;
+
+declare const formatDateTimeByLocale: (value?: string, locale?: Locale) => string;
+
+declare const formatTime: (value?: string) => string;
+
+declare const formatTimeByLocale: (value?: string, locale?: Locale) => string;
+
+declare const formatNumber: (value?: TFormatNumberByLocaleValue, options?: Intl.NumberFormatOptions) => string;
+
+declare const maskValue: (value: string | null, mask: FactoryArg) => string;
+
+declare const Arrow: (props: IIconProps) => ReactElement;
+
+declare const CaretDown: (props: IIconProps) => ReactElement;
+
+declare const Done: (props: IIconProps) => ReactElement;
+
+declare const EmptyBox: (props: IIconProps) => ReactElement;
+
+declare const Info: (props: IIconProps) => ReactElement;
+
+declare const Exclamation: (props: IIconProps) => ReactElement;
+
+declare const Play: (props: IIconProps) => ReactElement;
+
+declare const Subtract: (props: IIconProps) => ReactElement;
+
+declare const AlfaRomeo: (props: IIconProps) => ReactElement;
+
+declare const Citroen$1: (props: IIconProps) => ReactElement;
+
+declare const Ds: (props: IIconProps) => ReactElement;
+
+declare const Fiat: (props: IIconProps) => ReactElement;
+
+declare const FiatProfessional: (props: IIconProps) => ReactElement;
+
+declare const Jeep: (props: IIconProps) => ReactElement;
+
+declare const Citroen: (props: IIconProps) => ReactElement;
+
+declare const Opel: (props: IIconProps) => ReactElement;
+
+declare const Peugeot: (props: IIconProps) => ReactElement;
+
+declare const PeugeotInverted: (props: IIconProps) => ReactElement;
+
+declare const Hongqi: (props: IIconProps) => ReactElement;
+
+declare const Voyah: (props: IIconProps) => ReactElement;
+
+declare const Navor: (props: IIconProps) => ReactElement;
+
+declare const Leapmotor: (props: IIconProps) => ReactElement;
+
+export { Alert, AlfaRomeo, Arrow, BackLink, Button, ButtonTag, CaretDown, CheckBox, Citroen$1 as Citroen, type DeepPartial, DeviceType, Done, Ds, EmptyBox, Exclamation, Fiat, FiatProfessional, FormField, FormProvider, GlobalConfig, HelperText, Hongqi, type IActionButtonProps, type IAlertProps, type IBackLinkProps, type IButtonProps, type IButtonTagProps, type ICheckBoxProps, type IDateTimeFormat, type IFormFieldProps, type IFormProviderProps, type IGlobalConfig, type IGlobalConfigOverrides, type IGlobalConfigProps, type IHelperTextProps, type IInfoTableProps, type IInfoTableRow, type IInputProps, type ILabelProps, type ILinkProps, type INumberFormat, type IOption, type IPlaceholderProviderProps, type IRadioGroupProps, type IRadioInputProps, type ISectionProps, type IOptionProps as ISelectOptionProps, type ISelectProps, type ISelectionBoxProps, type ISelectorOption, type IOptionProps$1 as ISelectorOptionProps, type ISelectorProps, type ISliderProps, type ITypographyProps, type IValidationTargetProps, type IValueContainerProps, Info, InfoTable, Input, Jeep, Label, Leapmotor, Link, Locale, _default as LocaleService, Citroen as Mitsubishi, Navor, Opel, Peugeot, PeugeotInverted, PlaceholderProvider, Play, RadioGroup, RadioInput, Section, Select, Option as SelectOption, SelectionBox, Selector, Option$1 as SelectorOption, Slider, Subtract, type TInputVariant, Typography, ValueContainer, Voyah, arrayToMap, formatDate, formatDateByLocale, formatDateTime, formatDateTimeByLocale, formatNumber, formatNumberByLocale, formatTime, formatTimeByLocale, maskValue, useDateTimeFormat, useDeviceType, useFormattedDate, useFormattedDateTime, useFormattedNumber, useFormattedTime, useGlobalConfig, useMaskedValue, useNumberFormat };