@clasing/ui 0.1.106 → 0.1.108

package/dist/index.d.ts

@@ -10,6 +10,7 @@ import { Placement } from '@floating-ui/react';
 import { ReactNode } from 'react';
 import { RefAttributes } from 'react';
 import { SetStateAction } from 'react';
+import { SVGAttributes } from 'react';
 import * as TablerIcons from '@tabler/icons-react';
 import { VariantProps } from 'class-variance-authority';
 
@@ -29,17 +30,17 @@ export declare const Badge: ForwardRefExoticComponent<IBadgeProps & RefAttribute
 
 declare const badgeStyles: (props?: ({
     utility?: "error" | "info" | "success" | "warning" | null | undefined;
-    intent?: "neutral" | "brand" | "brand-subtle" | "brand-bolder" | "blue" | "blue-subtle" | "blue-bolder" | "yellow" | "yellow-subtle" | "yellow-bolder" | "violet-subtle" | "violet" | "violet-bolder" | null | undefined;
+    intent?: "neutral" | "primary" | "yellow" | "blue" | "violet" | null | undefined;
     size?: "xs" | "sm" | "md" | "lg" | null | undefined;
     weight?: "light" | "regular" | "semibold" | "bold" | null | undefined;
-    rounded?: "rectangle" | "full" | null | undefined;
+    rounded?: "sm" | "full" | null | undefined;
 } & ClassProp) | undefined) => string;
 
 export declare const Button: ForwardRefExoticComponent<IButtonProps & RefAttributes<HTMLButtonElement>>;
 
 export declare const buttonActiveStyles: (props?: ({
-    intent?: "outline" | "primary-red" | "primary-blue" | "secondary" | "ghost" | "destructive" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
+    intent?: "outline" | "primary" | "secondary" | "inverse" | "ghost" | "destructive" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
     rounded?: "sm" | "full" | null | undefined;
     weight?: "light" | "regular" | "semibold" | "bold" | null | undefined;
 } & ClassProp) | undefined) => string;
@@ -47,20 +48,20 @@ export declare const buttonActiveStyles: (props?: ({
 export declare const ButtonIcon: default_2.ForwardRefExoticComponent<IButtonIconProps & default_2.RefAttributes<HTMLButtonElement>>;
 
 export declare const buttonIconActiveStyles: (props?: ({
-    intent?: "outline" | "primary-red" | "primary-blue" | "secondary" | "ghost" | "destructive" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
+    intent?: "primary" | "destructive" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
     rounded?: "sm" | "full" | null | undefined;
 } & ClassProp) | undefined) => string;
 
 export declare const buttonIconLoadingStyles: (props?: ({
-    intent?: "outline" | "primary-red" | "primary-blue" | "secondary" | "ghost" | "destructive" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
+    intent?: "primary" | "destructive" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
     rounded?: "sm" | "full" | null | undefined;
 } & ClassProp) | undefined) => string;
 
 export declare const buttonIconStyles: (props?: ({
-    intent?: "outline" | "primary-red" | "primary-blue" | "secondary" | "ghost" | "destructive" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
+    intent?: "primary" | "destructive" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
     rounded?: "sm" | "full" | null | undefined;
 } & ClassProp) | undefined) => string;
 
@@ -69,19 +70,20 @@ export declare const ButtonLink: ForwardRefExoticComponent<IButtonLinkProps & Re
 export declare const buttonLinkStyles: (props?: ({
     intent?: "primary" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
+    rounded?: "sm" | "full" | null | undefined;
     weight?: "light" | "regular" | "semibold" | "bold" | null | undefined;
 } & ClassProp) | undefined) => string;
 
 export declare const buttonLoadingStyles: (props?: ({
-    intent?: "outline" | "primary-red" | "primary-blue" | "secondary" | "ghost" | "destructive" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
+    intent?: "outline" | "primary" | "secondary" | "inverse" | "ghost" | "destructive" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
     rounded?: "sm" | "full" | null | undefined;
     weight?: "light" | "regular" | "semibold" | "bold" | null | undefined;
 } & ClassProp) | undefined) => string;
 
 export declare const buttonStyles: (props?: ({
-    intent?: "outline" | "primary-red" | "primary-blue" | "secondary" | "ghost" | "destructive" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
+    intent?: "outline" | "primary" | "secondary" | "inverse" | "ghost" | "destructive" | null | undefined;
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
     rounded?: "sm" | "full" | null | undefined;
     weight?: "light" | "regular" | "semibold" | "bold" | null | undefined;
 } & ClassProp) | undefined) => string;
@@ -105,7 +107,7 @@ declare interface CheckboxProps extends React.InputHTMLAttributes<HTMLInputEleme
     touched?: boolean;
 }
 
-export declare const Chip: ForwardRefExoticComponent<IChipProps & RefAttributes<HTMLButtonElement>>;
+export declare const Chip: default_2.ForwardRefExoticComponent<IChipProps & default_2.RefAttributes<HTMLDivElement | HTMLButtonElement>>;
 
 export declare const chipStyles: (props?: ({
     intent?: "error" | "selected" | "unselected" | null | undefined;
@@ -142,6 +144,7 @@ export declare const Divider: ForwardRefExoticComponent<IDividerProps & RefAttri
 declare type DropdownOption<T extends string | number | readonly string[] | undefined> = {
     label: string;
     value: T;
+    component?: React.ReactNode;
 };
 
 export declare const DropdownSelect: ForwardRefExoticComponent<DropdownSelectProps<any> & RefAttributes<HTMLDivElement>>;
@@ -152,6 +155,8 @@ declare interface DropdownSelectProps<T extends string | number | readonly strin
     disabled?: boolean;
     error?: string;
     touched?: boolean;
+    triggerSize?: 'sm' | 'md' | 'lg';
+    rounded?: 'sm' | 'full';
     iconName?: TablerIconName;
     placement?: PopoverPlacement;
     placeholder?: string;
@@ -168,6 +173,7 @@ declare interface DropdownSelectProps<T extends string | number | readonly strin
     onSearch?: (query: string) => void;
     noOptionsMessage?: string;
     disableSearchWhileLoading?: boolean;
+    dropdownClassName?: string;
 }
 
 declare interface IAlertProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertStyles> {
@@ -180,11 +186,11 @@ declare interface IAlertProps extends React.HTMLAttributes<HTMLDivElement>, Vari
 declare interface IBadgeProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof badgeStyles> {
     iconLeft?: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
     iconRight?: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
     iconOnly?: boolean;
 }
@@ -192,22 +198,21 @@ declare interface IBadgeProps extends React.HTMLAttributes<HTMLSpanElement>, Var
 declare interface IButtonIconProps extends Omit<default_2.ButtonHTMLAttributes<HTMLButtonElement>, 'children'>, VariantProps<typeof buttonIconStyles> {
     iconName: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
     iconText?: string;
     isLoading?: boolean;
     isActive?: boolean;
-    notification?: boolean;
 }
 
 declare interface IButtonLinkProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonLinkStyles> {
     iconLeft?: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
     iconRight?: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
     iconTextLeft?: string;
     iconTextRight?: string;
@@ -217,11 +222,11 @@ declare interface IButtonLinkProps extends React.ButtonHTMLAttributes<HTMLButton
 declare interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonStyles> {
     iconLeft?: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
     iconRight?: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
     iconTextLeft?: string;
     iconTextRight?: string;
@@ -246,16 +251,20 @@ declare interface ICalendarProps {
 declare interface ICardProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardStyles> {
 }
 
-declare interface IChipProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof chipStyles> {
+declare interface IChipProps extends VariantProps<typeof chipStyles> {
     iconLeft?: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
     iconRight?: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
     notification?: boolean;
+    onClick?: () => void;
+    disabled?: boolean;
+    className?: string;
+    children?: default_2.ReactNode;
 }
 
 export declare const IconComponent: ForwardRefExoticComponent<IIconComponentProps & RefAttributes<SVGSVGElement>>;
@@ -267,6 +276,8 @@ declare interface IDatepickerProps extends React.InputHTMLAttributes<HTMLInputEl
     touched?: boolean;
     value?: string;
     locale?: 'enGB' | 'enUS' | 'es';
+    triggerSize?: 'sm' | 'md' | 'lg';
+    rounded?: 'sm' | 'full';
     placement?: PopoverPlacement;
     placeholder?: string;
     disabledDates?: string | string[] | Date | Date[] | undefined;
@@ -285,6 +296,8 @@ declare interface IDateRangePickerProps extends React.InputHTMLAttributes<HTMLIn
     helperText?: string;
     error?: string;
     touched?: boolean;
+    triggerSize?: 'sm' | 'md' | 'lg';
+    rounded?: 'sm' | 'full';
     startDate: string;
     endDate: string;
     calendarDropdowns?: boolean;
@@ -301,13 +314,11 @@ declare interface IDividerProps extends HTMLAttributes<HTMLSpanElement> {
     orientation?: 'horizontal' | 'vertical';
 }
 
-declare interface IIconComponentProps {
+declare interface IIconComponentProps extends SVGAttributes<SVGElement> {
     iconName?: TablerIconName;
     iconText?: string;
-    stroke?: number;
     size?: number;
     color?: string;
-    className?: string;
     onClick?: () => void;
 }
 
@@ -331,7 +342,7 @@ declare interface IInteractiveCardProps extends React.HTMLAttributes<HTMLDivElem
 
 export declare const Input: ForwardRefExoticComponent<InputProps & RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;
 
-declare interface InputProps extends React.InputHTMLAttributes<HTMLInputElement | HTMLTextAreaElement> {
+declare interface InputProps extends React.InputHTMLAttributes<HTMLInputElement | HTMLTextAreaElement>, VariantProps<typeof inputStyles> {
     label?: string;
     helperText?: string;
     error?: string;
@@ -339,10 +350,16 @@ declare interface InputProps extends React.InputHTMLAttributes<HTMLInputElement
     type?: 'text' | 'textarea' | 'password' | 'email' | 'number' | 'tel' | 'url' | 'color';
     iconName?: {
         name: TablerIconName;
-        stroke?: number;
+        stroke?: string;
     } | TablerIconName;
 }
 
+declare const inputStyles: (props?: ({
+    inputSize?: "sm" | "md" | "lg" | null | undefined;
+    rounded?: "sm" | "full" | null | undefined;
+    defaultVariants?: "rounded" | "inputSize" | null | undefined;
+} & ClassProp) | undefined) => string;
+
 export declare const InteractiveCard: ForwardRefExoticComponent<IInteractiveCardProps & RefAttributes<HTMLDivElement>>;
 
 declare const interactiveCardStyles: (props?: ({
@@ -360,7 +377,7 @@ declare interface IPopoverProps {
     className?: string;
     onMouseDown?: (e: default_2.MouseEvent) => void;
     onMouseUp?: (e: default_2.MouseEvent) => void;
-    popoverWidth?: 'as-trigger' | 'auto';
+    popoverWidth?: 'as-trigger' | 'min-as-trigger' | 'auto';
     disabled?: boolean;
 }
 
@@ -419,7 +436,7 @@ declare interface ModalProps {
     setIsOpen?: default_2.Dispatch<default_2.SetStateAction<boolean>>;
     canClose?: boolean;
     intent?: 'card' | 'sheet' | 'wizard' | 'fullscreen';
-    overlay?: 'blur' | 'opacity';
+    overlay?: 'blur-sm' | 'opacity';
     closeButtonAriaLabel?: string;
     closeOnClickOutside?: boolean;
 }
@@ -447,7 +464,7 @@ declare type PositionProps = 'top-left' | 'top' | 'top-right' | 'bottom-left' |
 export declare const ProgressBar: ({ progress, className, intent, size, rounded, ...props }: IProgressBarProps) => JSX.Element;
 
 declare const progressBarStyles: (props?: ({
-    intent?: "brand" | "blue" | "yellow" | "green" | null | undefined;
+    intent?: "error" | "success" | "warning" | "primary" | "yellow" | "blue" | "violet" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
     rounded?: "sm" | "full" | null | undefined;
 } & ClassProp) | undefined) => string;