@noxedgebyvp/noxui/dist/index.d.ts

NoxUI is a comprehensive, enterprise-ready React UI component library designed for efficiency, scalability, and seamless user experiences. Built with performance and customization in mind, NoxUI offers a rich set of pre-designed components that follow mod

import React, { ReactNode } from 'react';
import * as react_jsx_runtime from 'react/jsx-runtime';

interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type'> {
    type?: 'primary' | 'default' | 'dashed' | 'link' | 'text' | 'button' | 'reset' | 'submit';
    size?: 'small' | 'medium' | 'large';
    danger?: boolean;
    loading?: boolean;
    block?: boolean;
    icon?: React.ReactNode;
    onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
    label?: string;
    backgroundColor?: string;
    borderRadius?: string;
    disabled?: boolean;
    theme?: "light" | "dark";
    variant?: "primary" | "secondary" | "danger" | "info" | "warning" | "dark" | "neon";
    className?: string;
}
declare const Button: React.FC<ButtonProps>;

type PositionType = "bottom-left" | "bottom-right" | "top-left" | "top-right";
interface NotificationProps {
    type: "success" | "info" | "warning" | "error";
    message: string;
    onClose: () => void;
    animation?: "fade" | "pop" | "slide";
}
interface NotificationProps {
    type: "success" | "info" | "warning" | "error";
    message: string;
    duration: number;
    animation?: "fade" | "pop" | "slide";
}
interface UseNotificationReturn {
    NotificationComponent: JSX.Element;
    triggerNotification: (notificationProps: NotificationProps) => void;
}

declare const Notification: React.FC<NotificationProps>;

declare const useNotification: (position?: PositionType) => UseNotificationReturn;

interface RowProps {
    gutter?: number;
    className?: string;
    children: ReactNode;
}
declare const Row: React.FC<RowProps>;

interface ColProps {
    span: number;
    className?: string;
    children: React.ReactNode;
    gutter?: number;
}
declare const Col: React.FC<ColProps>;

interface InputProps {
    type?: "text" | "password" | "email";
    label?: string;
    placeholder?: string;
    value?: string;
    onChange?: (value: string) => void;
    disabled?: boolean;
    error?: string;
    className?: string;
}
declare const Input: React.FC<InputProps>;

interface Option {
    label: string;
    value: string;
    disabled?: boolean;
}
interface OptionGroup {
    label: string;
    options: Option[];
}
interface SelectProps {
    label?: string;
    value?: string | string[];
    defaultValue?: string | string[];
    onChange?: (value: string | string[]) => void;
    options: (Option | OptionGroup)[];
    placeholder?: string;
    disabled?: boolean;
    className?: string;
    multiple?: boolean;
    allowClear?: boolean;
    showSearch?: boolean;
    style?: React.CSSProperties;
    dropdownStyle?: React.CSSProperties;
    dropdownClassName?: string;
    notFoundContent?: React.ReactNode;
    mode?: 'multiple' | 'tags';
    maxTagCount?: number;
    maxTagTextLength?: number;
    maxTagPlaceholder?: (omittedValues: string[]) => React.ReactNode;
    loading?: boolean;
    size?: 'large' | 'middle' | 'small';
    bordered?: boolean;
    suffixIcon?: React.ReactNode;
    clearIcon?: React.ReactNode;
    removeIcon?: React.ReactNode;
    menuItemSelectedIcon?: React.ReactNode;
    getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
    onDropdownVisibleChange?: (open: boolean) => void;
    onSearch?: (value: string) => void;
    onSelect?: (value: string, option: Option) => void;
    onDeselect?: (value: string, option: Option) => void;
    onClear?: () => void;
    onBlur?: () => void;
    onFocus?: () => void;
}
declare const Select: React.FC<SelectProps>;

interface CheckboxProps {
    label?: React.ReactNode;
    checked?: boolean;
    defaultChecked?: boolean;
    indeterminate?: boolean;
    disabled?: boolean;
    className?: string;
    style?: React.CSSProperties;
    onChange?: (e: {
        target: {
            checked: boolean;
        };
    }) => void;
    onClick?: (e: React.MouseEvent<HTMLLabelElement>) => void;
    onMouseEnter?: (e: React.MouseEvent<HTMLLabelElement>) => void;
    onMouseLeave?: (e: React.MouseEvent<HTMLLabelElement>) => void;
    value?: any;
    name?: string;
    id?: string;
    autoFocus?: boolean;
    type?: 'checkbox' | 'radio';
    size?: 'default' | 'small' | 'large';
}
declare const Checkbox: React.FC<CheckboxProps>;

interface RadioOption {
    label: string;
    value: string;
    disabled?: boolean;
}
interface RadioProps {
    label?: string;
    name?: string;
    value: string;
    onChange: (value: string) => void;
    options?: RadioOption[];
    disabled?: boolean;
    direction?: "vertical" | "horizontal";
    className?: string;
}
declare const Radio: React.FC<RadioProps>;

interface DateInputProps {
    label?: string;
    value: string;
    onChange: (value: string) => void;
    disabled?: boolean;
    className?: string;
}
declare const DateInput: React.FC<DateInputProps>;

interface TableColumn<T> {
    title: string;
    key: keyof T;
    render?: (value: any, record: T) => React.ReactNode;
}
interface TableProps<T> {
    columns: TableColumn<T>[];
    dataSource: T[];
    className?: string;
    rowSelection?: {
        selectedRowKeys: string[];
        onChange: (selectedRowKeys: string[], selectedRows: T[]) => void;
    };
    pagination?: {
        current: number;
        pageSize: number;
        total: number;
        onChange: (page: number, pageSize: number) => void;
        pageSizeOptions?: number[];
    };
    infiniteScroll?: {
        loading?: boolean;
        hasMore: boolean;
        onLoadMore: () => void;
        loadingIndicator?: React.ReactNode;
    };
    height?: string | number;
}
declare function Table<T extends Record<string, any>>({ columns, dataSource, className, rowSelection, pagination, infiniteScroll, height, }: TableProps<T>): react_jsx_runtime.JSX.Element;

interface FormProps {
    initialValues?: Record<string, any>;
    layout?: 'horizontal' | 'vertical' | 'inline';
    onFinish?: (values: Record<string, any>) => void;
    onFinishFailed?: (errors: Record<string, string>) => void;
    children: React.ReactNode;
    className?: string;
    validationRules?: Record<string, ValidationRule[]>;
}
interface ValidationRule {
    required?: boolean;
    message?: string;
    pattern?: RegExp;
    validator?: (value: any) => Promise<void> | void;
    min?: number;
    max?: number;
    type?: 'string' | 'number' | 'boolean' | 'date' | 'email';
}
declare const Form: React.FC<FormProps>;
interface FormItemProps {
    label?: string;
    name: string;
    children: React.ReactNode;
    required?: boolean;
    className?: string;
}
declare const FormItem: React.FC<FormItemProps>;

interface TextareaProps {
    label?: string;
    placeholder?: string;
    value: string;
    onChange: (value: string) => void;
    disabled?: boolean;
    error?: string;
    className?: string;
    rows?: number;
    maxLength?: number;
    showCount?: boolean;
    autoSize?: boolean | {
        minRows?: number;
        maxRows?: number;
    };
}
declare const Textarea: React.FC<TextareaProps>;

interface IconProps {
    name: string;
    className?: string;
    style?: React.CSSProperties;
    onClick?: () => void;
}
declare const Icon: React.FC<IconProps>;

interface TagProps {
    color?: string;
    closable?: boolean;
    onClose?: (e: React.MouseEvent<HTMLElement>) => void;
    children?: React.ReactNode;
    className?: string;
    style?: React.CSSProperties;
}
declare const Tag: React.FC<TagProps>;

export { Button, Checkbox, Col, DateInput, Form, FormItem, Icon, Input, Notification, Radio, Row, Select, Table, Tag, Textarea as TextArea, useNotification };
export type { CheckboxProps, ColProps, DateInputProps, FormItemProps, FormProps, IconProps, InputProps, Option, OptionGroup, RadioOption, RadioProps, RowProps, SelectProps, TableColumn, TableProps, TagProps, TextareaProps, ValidationRule };