@sentio/ui-core 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,397 @@
+import * as react from 'react';
+import react__default, { FC, PropsWithChildren, SVGProps, ReactNode, MutableRefObject, ReactElement, CSSProperties } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { LoaderHeightWidthProps } from 'react-spinners/helpers/props';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+export { cx as classNames } from 'class-variance-authority';
+import { Strategy, Placement as Placement$1 } from '@floating-ui/react';
+import { OffsetOptions, Placement } from '@floating-ui/core';
+import { UseFormRegisterReturn, FieldError } from 'react-hook-form';
+export { LuSquareX as CloseSquareO, LuEye as EyeO, LuSquareMinus as MinusSquareO, LuSquarePlus as PlusSquareO } from 'react-icons/lu';
+import { ColumnDef, ColumnResizeMode, Row, Cell, TableState } from '@tanstack/react-table';
+import BigDecimal from '@sentio/bigdecimal';
+
+interface Props$c {
+    hint?: React.ReactNode;
+    loading?: boolean;
+    className?: string;
+    iconClassName?: string;
+    width?: LoaderHeightWidthProps['width'];
+    gray?: boolean;
+}
+declare function _BarLoading({ hint, loading, className, iconClassName, width, gray }: Props$c): react_jsx_runtime.JSX.Element | null;
+declare const BarLoading: react.MemoExoticComponent<typeof _BarLoading>;
+
+interface Props$b {
+    loading?: boolean;
+    children?: react__default.ReactNode;
+    className?: string;
+    size?: number;
+    showMask?: boolean;
+    maskOpacity?: number;
+}
+declare const SpinLoading: (args: Props$b) => react_jsx_runtime.JSX.Element;
+
+declare const CopyIcon: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
+declare const CopySuccessIcon: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
+interface Props$a {
+    text?: string | Function;
+    size?: number;
+    ml?: number;
+    mr?: number;
+    hover?: boolean;
+    placement?: 'left' | 'right';
+    className?: string;
+}
+declare const CopyButton: FC<PropsWithChildren<Props$a>>;
+
+declare const buttonClass: (props?: ({
+    role?: "link" | "text" | "dashed" | "primary" | "secondary" | "tertiary" | "tertiarytext" | "custom" | null | undefined;
+    status?: "default" | "danger" | null | undefined;
+    size?: "default" | "sm" | "md" | "lg" | null | undefined;
+    disabled?: boolean | null | undefined;
+    position?: "end" | "middle" | "begin" | "full" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ButtonProps extends VariantProps<typeof buttonClass> {
+    className?: string;
+    onClick?: (evt: React.MouseEvent) => void;
+    children?: ReactNode;
+    type?: 'submit' | 'button' | 'reset';
+    processing?: boolean;
+    disabledHint?: React.ReactNode;
+    disabledHintPortal?: boolean;
+    ref?: MutableRefObject<any>;
+    icon?: React.ReactElement;
+    title?: string;
+    value?: string;
+    id?: string;
+}
+declare const NewButton: react.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & react.RefAttributes<unknown>>;
+
+interface Props$9 {
+    title?: string | ReactElement;
+    titleBorder?: boolean;
+    footerBorder?: boolean;
+    children: ReactElement;
+    open: boolean;
+    onClose: () => void;
+    cancelText?: string;
+    cancelProps?: ButtonProps;
+    onCancel?: () => void;
+    okText?: string;
+    okProps?: ButtonProps;
+    onOk?: () => void;
+    buttonsClassName?: string;
+    extraButtons?: ReactElement | ReactElement[];
+    panelClassName?: string;
+    initialFocus?: React.MutableRefObject<HTMLElement | null> | undefined;
+    errorMessages?: string;
+    footer?: ReactElement;
+    zIndex?: number;
+    mask?: 'normal' | 'light';
+}
+declare function _BaseDialog({ title, open, onClose, onCancel, cancelText, cancelProps, onOk, okText, okProps, children, buttonsClassName, panelClassName, titleBorder, footerBorder, initialFocus, extraButtons, errorMessages, footer, zIndex, mask }: Props$9): react_jsx_runtime.JSX.Element;
+declare const BaseDialog: react.MemoExoticComponent<typeof _BaseDialog>;
+
+interface Props$8 {
+    text?: string | react__default.ReactNode;
+    className?: string;
+    buttonClassName?: string;
+    activeButtonClassName?: string;
+    icon?: react__default.ReactNode;
+    children?: react__default.ReactNode;
+    strategy?: Strategy;
+    hideArrow?: boolean;
+    offsetOptions?: OffsetOptions;
+    placementOption?: Placement;
+    maxWidth?: string;
+    usePortal?: boolean;
+    enableFadeAnimation?: boolean;
+    animationDuration?: number;
+}
+declare const PopoverTooltip: ({ icon, text, className, buttonClassName, activeButtonClassName, children, strategy: propStrategy, hideArrow, offsetOptions, placementOption, maxWidth, usePortal, enableFadeAnimation, animationDuration }: Props$8) => react_jsx_runtime.JSX.Element;
+
+interface Props$7 {
+    defaultOpen?: boolean;
+    children: ReactNode;
+    title: string | ReactNode | ((open: boolean) => ReactNode);
+    titleClassName?: string;
+    containerClassName?: string;
+    iconClassName?: string;
+    className?: string;
+}
+declare function DisclosurePanel({ title, children, defaultOpen, className, containerClassName, iconClassName, titleClassName }: Props$7): react_jsx_runtime.JSX.Element;
+
+interface CollapseProps {
+    title: ReactNode | string;
+    children: React.ReactNode;
+    className?: string;
+    titleClassName?: string;
+    defaultOpen?: boolean;
+    iconClassName?: string;
+}
+declare const Collapse: ({ title, children, className, titleClassName, defaultOpen, iconClassName }: CollapseProps) => react_jsx_runtime.JSX.Element;
+
+type InputProps = UseFormRegisterReturn & {
+    error?: FieldError;
+    errorClassName?: string;
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+    value?: string;
+    placeholder?: string;
+} & React.InputHTMLAttributes<HTMLInputElement>;
+declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
+
+interface Props$6<T> {
+    value?: T;
+    onChange?: (v: T) => void;
+    label?: string;
+    labelClassName?: string;
+    containerClassName?: string;
+    options: {
+        name: string;
+        value: T;
+    }[];
+    vertical?: boolean;
+}
+declare function RadioSelect<T>({ value, onChange, label, labelClassName, options, vertical, containerClassName }: Props$6<T>): react_jsx_runtime.JSX.Element;
+
+interface Props$5 {
+    checked?: boolean;
+    onChange?: (checked: boolean) => void;
+    srText?: string;
+    size: 'lg' | 'default' | 'sm';
+    disabled?: boolean;
+    label?: string;
+}
+declare function Switch({ checked, onChange: _onChange, srText, size, disabled, label }: Props$5): react_jsx_runtime.JSX.Element;
+
+type labelProps = {
+    selected?: boolean;
+    active?: boolean;
+};
+interface IOption<T> {
+    label: ReactNode | ((props: labelProps) => ReactNode);
+    value: T;
+    disabled?: boolean;
+    title?: string;
+}
+interface SelectProps<T> {
+    options: IOption<T>[];
+    value: T;
+    onChange: (value: T) => void;
+    className?: string;
+    buttonClassName?: string;
+    optionsClassName?: string;
+    placeholder?: string;
+    size?: 'sm' | 'md';
+    renderOption?: (option: IOption<T>, state: labelProps) => ReactElement;
+    noOptionsMessage?: ReactElement;
+    error?: FieldError;
+    disabled?: boolean;
+    fetchMore?: () => void;
+    isFetchingMore?: boolean;
+    scrollBottomThreshold?: number;
+    groupedOptions?: boolean;
+    groupedOrder?: {
+        key: string;
+        label: string;
+    }[];
+    unmountOptions?: boolean;
+    direction?: 'up' | 'down';
+    asLayer?: boolean;
+}
+declare function Select<T>({ className, buttonClassName, optionsClassName, options, value, onChange, placeholder, size, renderOption, noOptionsMessage, error, disabled, fetchMore, isFetchingMore, scrollBottomThreshold, groupedOptions, groupedOrder, unmountOptions, direction, asLayer }: SelectProps<T>): react_jsx_runtime.JSX.Element;
+
+type FieldDataNode<T, ChildFieldName extends string = 'children'> = T & Partial<Record<ChildFieldName, FieldDataNode<T, ChildFieldName>[]>>;
+type DataNode = FieldDataNode<{
+    key: KeyType;
+    title?: React.ReactNode | ((data: DataNode) => React.ReactNode);
+    depth?: number;
+    raw?: any;
+}>;
+type KeyType = string | number;
+declare const SUFFIX_NODE_KEY = "selectedKey_after";
+declare const ROOT_KEY = "root";
+interface Props$4 {
+    data?: DataNode[];
+    defaultExpandAll?: boolean;
+    virtual?: boolean;
+    rowHeight?: number | ((index: number, isSelected?: boolean) => number);
+    height?: CSSProperties['height'];
+    onClick?: (item: DataNode) => void;
+    suffixNode?: ReactNode;
+    expandDepth?: number;
+    contentClassName?: string;
+    expandIcon?: React.ReactNode;
+    collapseIcon?: React.ReactNode;
+    scrollToKey?: KeyType;
+    scrollIntoView?: boolean;
+    isRootKey?: (v: KeyType) => boolean;
+}
+declare const FlatTree: (props: Props$4) => react_jsx_runtime.JSX.Element;
+
+interface LinkifyTextProps {
+    text: any;
+    className?: string;
+    isHighlightNumbers?: boolean;
+}
+declare const LinkifyText: react.NamedExoticComponent<LinkifyTextProps>;
+
+interface EmptyProps {
+    src?: string;
+    title?: react__default.ReactNode;
+}
+declare const Empty: (props: EmptyProps) => react_jsx_runtime.JSX.Element;
+
+declare enum StatusRole {
+    Success = "success",
+    Warning = "warning",
+    Error = "error",
+    Disabled = "disabled",
+    Info = "info"
+}
+interface Props$3 {
+    status: string | ReactNode;
+    className?: string;
+    colorClasses?: string;
+    roundClasses?: string;
+    bubble?: boolean;
+    role?: string | StatusRole;
+}
+declare function StatusBadge({ status, className, colorClasses: _colorClasses, roundClasses, bubble, role }: Props$3): react_jsx_runtime.JSX.Element;
+
+interface HeaderToolsToggleButtonProps {
+    isOpen: boolean;
+    onClick: () => void;
+    className?: string;
+}
+declare const HeaderToolsToggleButton: ({ isOpen, onClick, className }: HeaderToolsToggleButtonProps) => react_jsx_runtime.JSX.Element;
+interface HeaderToolsContentProps {
+    isOpen: boolean;
+    children: ReactNode;
+    className?: string;
+}
+declare const HeaderToolsContent: ({ isOpen, children, className }: HeaderToolsContentProps) => react_jsx_runtime.JSX.Element | null;
+
+interface Props$2 {
+    data: any;
+    columns: ColumnDef<any>[];
+    columnResizeMode: ColumnResizeMode;
+    onClick?: (row: Row<any>, cell: Cell<any, any>) => void;
+    height?: CSSProperties['height'];
+    onFetchMore?: () => void;
+    hasMore?: boolean;
+    isFetching?: boolean;
+    state?: Partial<TableState>;
+    onStateChange?: (state: TableState) => void;
+    allowSort?: boolean;
+    manualSorting?: boolean;
+    allowResizeColumn?: boolean;
+    allowEditColumn?: boolean;
+    onColumnRename?: (data: ColumnDef<any>) => void;
+    onColumnRemove?: (data: ColumnDef<any>) => void;
+    minSize?: number;
+    minWidth?: number;
+    rowClassNameFn?: (row: Row<any>) => string;
+    enableVirtualization?: boolean;
+    estimatedRowHeight?: number;
+    overscan?: number;
+}
+declare const ResizeTable: react.MemoExoticComponent<react.ForwardRefExoticComponent<Props$2 & react.RefAttributes<HTMLDivElement>>>;
+
+declare const MoveLeftIcon: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
+declare const MoveRightIcon: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
+declare const RenameIcon: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
+declare const DeleteIcon: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
+
+interface IMenuItem {
+    key: string;
+    label: ReactNode;
+    icon?: ReactNode;
+    status?: string;
+    disabled?: boolean;
+    disabledHint?: ReactNode;
+    items?: IMenuItem[][];
+    data?: any;
+}
+type OnSelectMenuItem = (key: string, event: React.MouseEvent, data?: any) => void;
+
+interface Props$1 {
+    items: IMenuItem[][];
+    groupLabels?: string[];
+    buttonIcon: ReactNode | ((menuOpen: boolean) => ReactNode);
+    buttonClassName?: string;
+    itemsClassName?: string;
+    itemLabelClassName?: string;
+    onSelect?: OnSelectMenuItem;
+    ariaLabel?: string;
+    header?: ReactNode;
+    footer?: ReactNode;
+    renderItem?: (data: IMenuItem) => React.ReactNode;
+    placement?: Placement$1;
+    offset?: any;
+    portal?: boolean;
+    width?: CSSProperties['width'];
+    selectedKey?: IMenuItem['key'];
+    onOpenCallback?: () => void;
+}
+declare function PopupMenuButton({ buttonIcon, items, groupLabels, onSelect, ariaLabel, header, footer, buttonClassName, itemsClassName, itemLabelClassName, renderItem, placement, offset, portal, width, selectedKey, onOpenCallback }: Props$1): react_jsx_runtime.JSX.Element;
+
+declare const COLOR_MAP: Record<string, {
+    active: string;
+    default: string;
+    disabled: string;
+}>;
+declare const MenuContext: react.Context<{
+    selectedKey?: string;
+}>;
+type Props = IMenuItem & {
+    items: IMenuItem[][];
+    onSelect?: OnSelectMenuItem;
+    active: boolean;
+    name: string;
+    placement?: Placement$1;
+    buttonClass?: string;
+};
+interface ItemProps {
+    item: IMenuItem;
+    onSelect?: OnSelectMenuItem;
+    labelClassName?: string;
+}
+declare const MenuItem: ({ item, onSelect, labelClassName }: ItemProps) => react_jsx_runtime.JSX.Element;
+declare const SubMenuButton: (props: Props) => react_jsx_runtime.JSX.Element;
+
+declare const BD: typeof BigDecimal;
+declare function parseHex(hex?: string): bigint;
+declare function getNumberWithDecimal(hex?: string | bigint, decimal?: number, asNumber?: boolean): string | number | null;
+
+/**
+ * React Hook for detecting mobile devices
+ * @param breakpoint Breakpoint width, default 768px
+ * @returns boolean Whether it's a mobile device
+ */
+declare function useMobile(breakpoint?: number, defaultValue?: boolean): boolean;
+
+declare function useBoolean(defaultValue?: boolean): {
+    value: boolean;
+    setValue: react.Dispatch<react.SetStateAction<boolean>>;
+    setTrue: () => void;
+    setFalse: () => void;
+    toggle: () => void;
+};
+
+declare const SvgFolderContext: react.Context<string>;
+declare const useDetectExtenstion: () => boolean;
+declare const DarkModeContext: react.Context<boolean>;
+declare const useDarkMode: () => boolean;
+
+declare const NavSizeContext: react.Context<{
+    small: boolean;
+    showLabel: boolean;
+    setSmall: (small: boolean) => void;
+    setShowLabel: (showLabel: boolean) => void;
+}>;
+
+export { BD, BarLoading, BaseDialog, NewButton as Button, COLOR_MAP, Collapse, CopyButton, CopyIcon, CopySuccessIcon, DarkModeContext, type DataNode, DeleteIcon, DisclosurePanel, Empty, FlatTree, HeaderToolsContent, HeaderToolsToggleButton, type IMenuItem, Input, LinkifyText, MenuContext, MenuItem, MoveLeftIcon, MoveRightIcon, NavSizeContext, type OnSelectMenuItem, PopoverTooltip, PopupMenuButton, ROOT_KEY, RadioSelect, RenameIcon, ResizeTable, SUFFIX_NODE_KEY, Select, type SelectProps, SpinLoading, StatusBadge, StatusRole, SubMenuButton, SvgFolderContext, Switch, getNumberWithDecimal, parseHex, useBoolean, useDarkMode, useDetectExtenstion, useMobile };