@komensal/ui 0.1.0 → 0.2.0

package/dist/index.d.ts

@@ -0,0 +1,420 @@
+import * as React from 'react';
+import React__default, { ReactNode, JSX } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { DialogProps } from '@radix-ui/react-dialog';
+import * as react_hook_form from 'react-hook-form';
+import { FieldValues, FieldPath, ControllerProps, Control, Path, FieldError, Noop } from 'react-hook-form';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { OTPInput } from 'input-otp';
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import * as SelectPrimitive from '@radix-ui/react-select';
+import { ClassValue } from 'clsx';
+
+interface AlertProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: AlertVariant;
+}
+type AlertVariant = 'error' | 'info' | 'success' | 'warning';
+declare const Alert: ({ children, className, variant, ...props }: AlertProps) => React.JSX.Element;
+
+interface AuthHeaderProps {
+    children?: ReactNode;
+    logoAlt: string;
+    mobileClassName?: string;
+}
+declare const AuthHeader: ({ children, logoAlt, mobileClassName }: AuthHeaderProps) => React.JSX.Element;
+
+declare const buttonVariants: (props?: ({
+    hoverStyle?: "none" | "highlight" | "shine" | null | undefined;
+    size?: "lg" | "sm" | "default" | "icon" | null | undefined;
+    variant?: "link" | "primary" | "destructive" | "ghost" | "invisible" | "outline" | "tertiary" | "underline" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+    childrenClassName?: string;
+    hoverStyle?: 'highlight' | 'none' | 'shine';
+    icon?: React.ReactNode;
+    iconLeft?: React.ReactNode;
+    iconRight?: React.ReactNode;
+    isLoading?: boolean;
+    sideTooltip?: 'bottom' | 'left' | 'right' | 'top';
+    tooltip?: string;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
+declare const Command: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & {
+    label?: string;
+    shouldFilter?: boolean;
+    filter?: (value: string, search: string, keywords?: string[]) => number;
+    defaultValue?: string;
+    value?: string;
+    onValueChange?: (value: string) => void;
+    loop?: boolean;
+    disablePointerSelection?: boolean;
+    vimBindings?: boolean;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+type CommandDialogProps = DialogProps;
+declare const CommandDialog: ({ children, ...props }: CommandDialogProps) => React.JSX.Element;
+declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof React.InputHTMLAttributes<HTMLInputElement>> & {
+    ref?: React.Ref<HTMLInputElement>;
+} & {
+    asChild?: boolean;
+}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "type" | "onChange" | "value"> & {
+    value?: string;
+    onValueChange?: (search: string) => void;
+} & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+declare const CommandList: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & {
+    label?: string;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandEmpty: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandGroup: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild">, "heading" | "value"> & {
+    heading?: React.ReactNode;
+    value?: string;
+    forceMount?: boolean;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandSeparator: React.ForwardRefExoticComponent<Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & {
+    alwaysRender?: boolean;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
+    children?: React.ReactNode;
+} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+} & {
+    asChild?: boolean;
+}, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild">, "onSelect" | "disabled" | "value"> & {
+    disabled?: boolean;
+    onSelect?: (value: string) => void;
+    value?: string;
+    keywords?: string[];
+    forceMount?: boolean;
+} & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const CommandShortcut: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): React.JSX.Element;
+    displayName: string;
+};
+
+declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: React.FC<DialogPrimitive.DialogPortalProps>;
+declare const DialogClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    isAbsolute?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+interface DialogContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> {
+    container?: HTMLElement | null;
+    isAbsolute?: boolean;
+    isCloseIcon?: boolean;
+    overlayClassName?: string;
+}
+declare const DialogContent: React.ForwardRefExoticComponent<DialogContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const DialogHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    displayName: string;
+};
+declare const DialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
+    displayName: string;
+};
+declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const DialogDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+
+declare const Form: <TFieldValues extends FieldValues, TContext = any, TTransformedValues = TFieldValues>({ children, watch, getValues, getFieldState, setError, clearErrors, setValue, setValues, trigger, formState, resetField, reset, handleSubmit, unregister, control, register, setFocus, subscribe, }: react_hook_form.FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
+declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>) => React.JSX.Element;
+declare const useFormField: () => {
+    invalid: boolean;
+    isDirty: boolean;
+    isTouched: boolean;
+    isValidating: boolean;
+    error?: react_hook_form.FieldError;
+    formDescriptionId: string;
+    formItemId: string;
+    formMessageId: string;
+    id: string;
+    name: string;
+};
+declare const FormItem: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const FormLabel: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & React.RefAttributes<HTMLLabelElement>>;
+declare const FormControl: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLElement> & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+declare const FormDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const FormMessage: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+
+interface InputFieldProps<T extends FieldValues = FieldValues> {
+    control: Control<T>;
+    disabled?: boolean;
+    inputClassName?: string;
+    isClearable?: boolean;
+    label?: string;
+    labelClassName?: string;
+    mainClassName?: string;
+    name: Path<T>;
+    onClear?: () => void;
+    placeholder?: string;
+    type?: string;
+    visualRequired?: boolean;
+}
+declare const InputField: <T extends FieldValues = FieldValues>({ control, disabled, inputClassName, isClearable, label, labelClassName, mainClassName, name, onClear, placeholder, type, visualRequired }: InputFieldProps<T>) => React.JSX.Element;
+
+interface LabelFieldProps {
+    label?: string;
+    labelClassName?: string;
+    name: string;
+    visualRequired?: boolean;
+}
+declare const LabelField: ({ label, labelClassName, name, visualRequired }: LabelFieldProps) => React.JSX.Element;
+
+interface GoogleMapPickerProps {
+    centerOn?: google.maps.LatLngLiteral;
+    disabled?: boolean;
+    hasError?: boolean;
+    locationQuery?: string;
+    locationZoom?: number;
+    onChange: (address: string) => void;
+    placeholder?: string;
+    value: string;
+}
+declare const GoogleMapPicker: (props: GoogleMapPickerProps) => React.JSX.Element;
+
+type MapPickerFieldProps<T extends FieldValues> = Omit<GoogleMapPickerProps, 'hasError' | 'onChange' | 'value'> & {
+    control: Control<T>;
+    label?: string;
+    labelClassName?: string;
+    mainClassName?: string;
+    name: Path<T>;
+    visualRequired?: boolean;
+};
+declare const MapPickerField: <T extends FieldValues>({ control, label, labelClassName, mainClassName, name, visualRequired, ...pickerProps }: MapPickerFieldProps<T>) => React.JSX.Element;
+
+interface OtpInputFormFieldProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> {
+    autoFocus?: boolean;
+    className?: string;
+    containerClassName?: string;
+    control: Control<TFieldValues>;
+    disabled?: boolean;
+    label?: string;
+    labelClassName?: string;
+    name: TName;
+    otpLength?: number;
+}
+declare function OTPField<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ autoFocus, className, containerClassName, control, disabled, label, labelClassName, name, otpLength }: OtpInputFormFieldProps<TFieldValues, TName>): React__default.JSX.Element;
+
+interface Options {
+    label: string;
+    value: number | string;
+}
+interface SelectFieldProps<T extends FieldValues = FieldValues> {
+    ableDeleteOption?: boolean;
+    className?: string;
+    control: Control<T>;
+    disabled?: boolean;
+    label?: string;
+    labelClassName?: string;
+    mainClassName?: string;
+    name: Path<T>;
+    onChange?: (...event: unknown[]) => void;
+    options: Options[] | undefined;
+    placeholder?: string;
+    search?: boolean;
+    visualRequired?: boolean;
+}
+declare const SelectField: <T extends FieldValues = FieldValues>({ ableDeleteOption, className, control, disabled, label, labelClassName, mainClassName, name, options, placeholder, search, visualRequired }: SelectFieldProps<T>) => React.JSX.Element;
+
+type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
+declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+
+declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & VariantProps<(props?: class_variance_authority_types.ClassProp | undefined) => string> & React.RefAttributes<HTMLLabelElement>>;
+
+interface LoadingProps {
+    className?: string;
+    isSpinner?: boolean;
+}
+declare function Loading({ className, isSpinner }: Readonly<LoadingProps>): React.JSX.Element;
+
+declare function InputOTP({ className, containerClassName, ...props }: React__default.ComponentProps<typeof OTPInput> & {
+    containerClassName?: string;
+}): React__default.JSX.Element;
+declare function InputOTPGroup({ className, ...props }: React__default.ComponentProps<'div'>): React__default.JSX.Element;
+declare function InputOTPSlot({ className, index, ...props }: React__default.ComponentProps<'div'> & {
+    index: number;
+}): React__default.JSX.Element;
+
+interface PasswordRule {
+    key: string;
+    label: string;
+    test: (value: string) => boolean;
+}
+interface PasswordRulesConfig {
+    hasNumber?: boolean;
+    hasSpecialChar?: boolean;
+    hasUpperAndLower?: boolean;
+    minLength?: false | number;
+}
+
+interface PasswordChecklistProps {
+    className?: string;
+    rules: PasswordRule[];
+    value: string;
+}
+declare const PasswordChecklist: ({ className, rules, value }: PasswordChecklistProps) => React__default.JSX.Element | null;
+
+declare const Popover: React.FC<PopoverPrimitive.PopoverProps>;
+declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const PopoverAnchor: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & React.RefAttributes<HTMLDivElement>>;
+declare const PopoverContent: React.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+declare const Select: React.FC<SelectPrimitive.SelectProps>;
+declare const SelectGroup: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
+declare const SelectTrigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SelectScrollUpButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollUpButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectScrollDownButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollDownButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectLabel: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+interface SelectInputProps<Label extends string, Value extends string> {
+    ableDeleteOption?: boolean;
+    className?: string;
+    disabled?: boolean;
+    error?: FieldError;
+    items?: null | Record<Label | Value, number | string>[];
+    labelKey?: string;
+    leftIcon?: JSX.Element;
+    loading?: boolean;
+    onBlur?: Noop;
+    onChange?: (...event: unknown[]) => void;
+    onValueChangeCallBack?: (item: {
+        label: string;
+        value: string;
+    }) => void;
+    placeholder?: string;
+    placeholderClassName?: string;
+    search?: boolean;
+    timeField?: boolean;
+    value?: string;
+    valueKey?: string;
+}
+declare const SelectInput: <Label extends string, Value extends string>(props: SelectInputProps<Label, Value>) => JSX.Element;
+
+declare const sizes: {
+    lg: string;
+    md: string;
+    sm: string;
+    xl: string;
+    xs: string;
+};
+declare const variants: {
+    light: string;
+    primary: string;
+    secondary: string;
+};
+interface SpinnerProps {
+    className?: string;
+    size?: keyof typeof sizes;
+    variant?: keyof typeof variants;
+}
+declare const Spinner: ({ className, size, variant }: SpinnerProps) => React.JSX.Element;
+
+interface StepHeaderProps {
+    subtitle?: ReactNode;
+    subtitleClassName?: string;
+    title: string;
+}
+declare const StepHeader: ({ subtitle, subtitleClassName, title }: StepHeaderProps) => React.JSX.Element;
+
+interface StepperStep {
+    label: string;
+}
+interface StepperProps {
+    activeIndex: number;
+    className?: string;
+    intermediate?: boolean;
+    steps: StepperStep[];
+}
+declare const Stepper: ({ activeIndex, className, intermediate, steps }: StepperProps) => React.JSX.Element;
+
+interface ToastOptions {
+    duration?: number;
+    position?: ToastPosition;
+    subtitle?: string;
+    title: string;
+}
+type ToastPosition = 'bottom' | 'bottom-left' | 'bottom-right' | 'center' | 'middle-bottom' | 'middle-top' | 'top' | 'top-left' | 'top-right';
+type ToastType = 'error' | 'info' | 'success' | 'wait' | 'warning';
+
+interface ToastProps {
+    duration?: number;
+    id: string;
+    onClose: (id: string) => void;
+    subtitle?: string;
+    title: string;
+    type: ToastType;
+}
+declare function Toast({ duration, id, onClose, subtitle, title, type }: ToastProps): React.JSX.Element;
+
+declare function ToastProvider(): React.JSX.Element;
+
+interface TooltipProps {
+    children: React.ReactNode;
+    childrenClassName?: string;
+    className?: string;
+    message: string;
+    sideTooltip?: 'bottom' | 'left' | 'right' | 'top';
+}
+declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
+
+interface WrapperProps {
+    children: ReactNode;
+    className?: string;
+}
+declare const Wrapper: ({ children, className }: WrapperProps) => React.JSX.Element;
+
+declare function cn(...inputs: ClassValue[]): string;
+
+declare const inputBase: string;
+declare const inputPlaceholder: string;
+declare const inputDisabled: string;
+declare const inputFocus: string;
+
+type ToastEmitter = ((type: ToastType, options: ToastOptions) => void) | null;
+declare const toast: {
+    error(options: string | ToastOptions): void;
+    info(options: string | ToastOptions): void;
+    success(options: string | ToastOptions): void;
+    wait(options: string | ToastOptions): void;
+    warning(options: string | ToastOptions): void;
+};
+declare function registerToastEmitter(fn: ToastEmitter): void;
+
+export { Alert, AuthHeader, Button, type ButtonProps, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, GoogleMapPicker, type GoogleMapPickerProps, Input, InputField, InputOTP, InputOTPGroup, InputOTPSlot, type InputProps, Label, LabelField, Loading, MapPickerField, OTPField, type Options, PasswordChecklist, type PasswordRule, type PasswordRulesConfig, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Select, SelectContent, SelectField, SelectGroup, SelectInput, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Spinner, type SpinnerProps, StepHeader, Stepper, type StepperStep, Toast, type ToastOptions, type ToastPosition, ToastProvider, type ToastType, Tooltip, Wrapper, type WrapperProps, buttonVariants, cn, inputBase, inputDisabled, inputFocus, inputPlaceholder, registerToastEmitter, toast, useFormField };