@jerry-fd/ui 0.4.9 → 0.5.1

package/index.d.ts

@@ -4,8 +4,8 @@ import React__default from 'react';
 import * as tailwind_variants from 'tailwind-variants';
 import { VariantProps } from 'tailwind-variants';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { Avatar as Avatar$1, Tabs as Tabs$1, Popover as Popover$1, Switch as Switch$1, DropdownMenu as DropdownMenu$2, Collapsible as Collapsible$1, Tooltip as Tooltip$1 } from 'radix-ui';
 import { Command as Command$1 } from 'cmdk';
+import { Tabs as Tabs$1, Popover as Popover$1, Switch as Switch$1, DropdownMenu as DropdownMenu$2, Collapsible as Collapsible$1, Tooltip as Tooltip$1, ScrollArea as ScrollArea$1, HoverCard as HoverCard$1 } from 'radix-ui';
 import { DialogProps } from 'vaul';
 import { B as ButtonSharedProps } from './button-DMIeJ1gB.js';
 export { a as Button, b as baseButtonStyle, c as buttonVariants } from './button-DMIeJ1gB.js';
@@ -79,6 +79,14 @@ declare const twMergeConfig: {
 declare const tv: tailwind_variants.TV;
 declare const cn: (...classes: ClassNameArray) => string;
 
+type Value = string | number;
+declare function findOption(options: OptionItem[], value: Value): OptionItem | undefined;
+declare function findOption(options: OptionItem[], value: Value[]): OptionItem[];
+declare function unique<T>(array: T[]): T[];
+declare function compact<T>(array: T[]): NonNullable<T>[];
+
+declare function mergeRefs<T = unknown>(refs: Array<React.Ref<T> | undefined | null>): React.RefCallback<T>;
+
 type IValue = string;
 interface IOptionItem {
     key?: React.Key;
@@ -91,13 +99,6 @@ type PolymorphicProps<T extends React.ElementType, Props = object> = {
     as?: T;
 } & Props & Omit<React.ComponentPropsWithoutRef<T>, keyof Props | 'as'>;
 
-declare function findOption(options: IOptionItem[], value: IValue): IOptionItem | undefined;
-declare function findOption(options: IOptionItem[], value: IValue[]): IOptionItem[];
-declare function unique<T>(array: T[]): T[];
-declare function compact<T>(array: T[]): NonNullable<T>[];
-
-declare function mergeRefs<T = unknown>(refs: Array<React.Ref<T> | undefined | null>): React.RefCallback<T>;
-
 declare const Card: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLDivElement> & VariantProps<tailwind_variants.TVReturnType<{
     variant: {
         default: string;
@@ -140,171 +141,574 @@ declare namespace card {
   export { card_Card as Card, card_CardContent as CardContent, card_CardDescription as CardDescription, card_CardExtra as CardExtra, card_CardFooter as CardFooter, card_CardHeader as CardHeader, card_CardHeading as CardHeading, card_CardIcon as CardIcon, card_CardTable as CardTable, card_CardTitle as CardTitle, card_CardToolbar as CardToolbar, Card as Root };
 }
 
-interface BadgeProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
-    asChild?: boolean;
-    dotClassName?: string;
-    disabled?: boolean;
-}
-interface BadgeButtonProps extends React$1.ButtonHTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeButtonVariants> {
-    asChild?: boolean;
-}
-type BadgeDotProps = React$1.HTMLAttributes<HTMLSpanElement>;
-declare const badgeVariants: tailwind_variants.TVReturnType<{
-    variant: {
-        primary: string;
-        secondary: string;
-        success: string;
-        warning: string;
-        info: string;
-        outline: string;
-        error: string;
+declare const AVATAR_ROOT_NAME = "AvatarRoot";
+declare const avatarVariants: tailwind_variants.TVReturnType<{
+    withRing: {
+        true: string;
     };
-    appearance: {
-        default: string;
-        light: string;
-        outline: string;
-        ghost: string;
+    size: {
+        '80': {
+            root: string;
+        };
+        '72': {
+            root: string;
+        };
+        '64': {
+            root: string;
+        };
+        '56': {
+            root: string;
+        };
+        '48': {
+            root: string;
+        };
+        '42': {
+            root: string;
+        };
+        '38': {
+            root: string;
+        };
+        '32': {
+            root: string;
+        };
+        '24': {
+            root: string;
+        };
+        '20': {
+            root: string;
+        };
     };
-    disabled: {
+    color: {
+        gray: {
+            root: string;
+        };
+        yellow: {
+            root: string;
+        };
+        blue: {
+            root: string;
+        };
+        sky: {
+            root: string;
+        };
+        purple: {
+            root: string;
+        };
+        red: {
+            root: string;
+        };
+        green: {
+            root: string;
+        };
+        teal: {
+            root: string;
+        };
+        violet: {
+            root: string;
+        };
+        pink: {
+            root: string;
+        };
+        orange: {
+            root: string;
+        };
+    };
+}, {
+    root: string[];
+    image: string;
+    indicator: string;
+}, undefined, {
+    withRing: {
         true: string;
     };
     size: {
-        large: string;
-        medium: string;
-        small: string;
-        xsmall: string;
+        '80': {
+            root: string;
+        };
+        '72': {
+            root: string;
+        };
+        '64': {
+            root: string;
+        };
+        '56': {
+            root: string;
+        };
+        '48': {
+            root: string;
+        };
+        '42': {
+            root: string;
+        };
+        '38': {
+            root: string;
+        };
+        '32': {
+            root: string;
+        };
+        '24': {
+            root: string;
+        };
+        '20': {
+            root: string;
+        };
     };
-    shape: {
-        default: string;
-        circle: string;
+    color: {
+        gray: {
+            root: string;
+        };
+        yellow: {
+            root: string;
+        };
+        blue: {
+            root: string;
+        };
+        sky: {
+            root: string;
+        };
+        purple: {
+            root: string;
+        };
+        red: {
+            root: string;
+        };
+        green: {
+            root: string;
+        };
+        teal: {
+            root: string;
+        };
+        violet: {
+            root: string;
+        };
+        pink: {
+            root: string;
+        };
+        orange: {
+            root: string;
+        };
     };
-}, undefined, string[], {
-    variant: {
-        primary: string;
-        secondary: string;
-        success: string;
-        warning: string;
-        info: string;
-        outline: string;
-        error: string;
+}, {
+    root: string[];
+    image: string;
+    indicator: string;
+}, tailwind_variants.TVReturnType<{
+    withRing: {
+        true: string;
     };
-    appearance: {
-        default: string;
-        light: string;
-        outline: string;
-        ghost: string;
+    size: {
+        '80': {
+            root: string;
+        };
+        '72': {
+            root: string;
+        };
+        '64': {
+            root: string;
+        };
+        '56': {
+            root: string;
+        };
+        '48': {
+            root: string;
+        };
+        '42': {
+            root: string;
+        };
+        '38': {
+            root: string;
+        };
+        '32': {
+            root: string;
+        };
+        '24': {
+            root: string;
+        };
+        '20': {
+            root: string;
+        };
     };
-    disabled: {
+    color: {
+        gray: {
+            root: string;
+        };
+        yellow: {
+            root: string;
+        };
+        blue: {
+            root: string;
+        };
+        sky: {
+            root: string;
+        };
+        purple: {
+            root: string;
+        };
+        red: {
+            root: string;
+        };
+        green: {
+            root: string;
+        };
+        teal: {
+            root: string;
+        };
+        violet: {
+            root: string;
+        };
+        pink: {
+            root: string;
+        };
+        orange: {
+            root: string;
+        };
+    };
+}, {
+    root: string[];
+    image: string;
+    indicator: string;
+}, undefined, unknown, unknown, undefined>>;
+declare const avatarRingVariants: tailwind_variants.TVReturnType<{
+    color: {
+        gray: string;
+        yellow: string;
+        blue: string;
+        sky: string;
+        purple: string;
+        red: string;
+        green: string;
+        teal: string;
+        violet: string;
+        pink: string;
+        orange: string;
+        white: string;
+        black: string;
+    };
+}, undefined, "ring-2 ring-offset-2", {
+    color: {
+        gray: string;
+        yellow: string;
+        blue: string;
+        sky: string;
+        purple: string;
+        red: string;
+        green: string;
+        teal: string;
+        violet: string;
+        pink: string;
+        orange: string;
+        white: string;
+        black: string;
+    };
+}, undefined, tailwind_variants.TVReturnType<{
+    color: {
+        gray: string;
+        yellow: string;
+        blue: string;
+        sky: string;
+        purple: string;
+        red: string;
+        green: string;
+        teal: string;
+        violet: string;
+        pink: string;
+        orange: string;
+        white: string;
+        black: string;
+    };
+}, undefined, "ring-2 ring-offset-2", unknown, unknown, undefined>>;
+type AvatarSharedProps = VariantProps<typeof avatarVariants>;
+type AvatarRingSharedProps = VariantProps<typeof avatarRingVariants>;
+declare const AvatarImage: React$1.ForwardRefExoticComponent<AvatarSharedProps & Omit<React$1.ImgHTMLAttributes<HTMLImageElement>, "color"> & {
+    asChild?: boolean;
+} & React$1.RefAttributes<HTMLImageElement>>;
+type AvatarRootProps = VariantProps<typeof avatarVariants> & React$1.HTMLAttributes<HTMLDivElement> & {
+    asChild?: boolean;
+    placeholderType?: 'user' | 'company';
+    ring?: boolean | AvatarRingSharedProps['color'];
+};
+declare const AvatarRoot: React$1.ForwardRefExoticComponent<VariantProps<tailwind_variants.TVReturnType<{
+    withRing: {
         true: string;
     };
     size: {
-        large: string;
-        medium: string;
-        small: string;
-        xsmall: string;
+        '80': {
+            root: string;
+        };
+        '72': {
+            root: string;
+        };
+        '64': {
+            root: string;
+        };
+        '56': {
+            root: string;
+        };
+        '48': {
+            root: string;
+        };
+        '42': {
+            root: string;
+        };
+        '38': {
+            root: string;
+        };
+        '32': {
+            root: string;
+        };
+        '24': {
+            root: string;
+        };
+        '20': {
+            root: string;
+        };
     };
-    shape: {
-        default: string;
-        circle: string;
+    color: {
+        gray: {
+            root: string;
+        };
+        yellow: {
+            root: string;
+        };
+        blue: {
+            root: string;
+        };
+        sky: {
+            root: string;
+        };
+        purple: {
+            root: string;
+        };
+        red: {
+            root: string;
+        };
+        green: {
+            root: string;
+        };
+        teal: {
+            root: string;
+        };
+        violet: {
+            root: string;
+        };
+        pink: {
+            root: string;
+        };
+        orange: {
+            root: string;
+        };
     };
-}, undefined, tailwind_variants.TVReturnType<{
-    variant: {
-        primary: string;
-        secondary: string;
-        success: string;
-        warning: string;
-        info: string;
-        outline: string;
-        error: string;
+}, {
+    root: string[];
+    image: string;
+    indicator: string;
+}, undefined, {
+    withRing: {
+        true: string;
+    };
+    size: {
+        '80': {
+            root: string;
+        };
+        '72': {
+            root: string;
+        };
+        '64': {
+            root: string;
+        };
+        '56': {
+            root: string;
+        };
+        '48': {
+            root: string;
+        };
+        '42': {
+            root: string;
+        };
+        '38': {
+            root: string;
+        };
+        '32': {
+            root: string;
+        };
+        '24': {
+            root: string;
+        };
+        '20': {
+            root: string;
+        };
     };
-    appearance: {
-        default: string;
-        light: string;
-        outline: string;
-        ghost: string;
+    color: {
+        gray: {
+            root: string;
+        };
+        yellow: {
+            root: string;
+        };
+        blue: {
+            root: string;
+        };
+        sky: {
+            root: string;
+        };
+        purple: {
+            root: string;
+        };
+        red: {
+            root: string;
+        };
+        green: {
+            root: string;
+        };
+        teal: {
+            root: string;
+        };
+        violet: {
+            root: string;
+        };
+        pink: {
+            root: string;
+        };
+        orange: {
+            root: string;
+        };
     };
-    disabled: {
+}, {
+    root: string[];
+    image: string;
+    indicator: string;
+}, tailwind_variants.TVReturnType<{
+    withRing: {
         true: string;
     };
     size: {
-        large: string;
-        medium: string;
-        small: string;
-        xsmall: string;
-    };
-    shape: {
-        default: string;
-        circle: string;
-    };
-}, undefined, string[], unknown, unknown, undefined>>;
-declare const badgeButtonVariants: tailwind_variants.TVReturnType<{
-    variant: {
-        default: string;
-    };
-}, undefined, "-me-2 inline-flex size-14 cursor-pointer items-center justify-center rounded-md p-0 leading-none opacity-60 transition-all hover:opacity-100 [&>svg]:size-14! [&>svg]:opacity-100!", {
-    variant: {
-        default: string;
+        '80': {
+            root: string;
+        };
+        '72': {
+            root: string;
+        };
+        '64': {
+            root: string;
+        };
+        '56': {
+            root: string;
+        };
+        '48': {
+            root: string;
+        };
+        '42': {
+            root: string;
+        };
+        '38': {
+            root: string;
+        };
+        '32': {
+            root: string;
+        };
+        '24': {
+            root: string;
+        };
+        '20': {
+            root: string;
+        };
     };
-}, undefined, tailwind_variants.TVReturnType<{
-    variant: {
-        default: string;
+    color: {
+        gray: {
+            root: string;
+        };
+        yellow: {
+            root: string;
+        };
+        blue: {
+            root: string;
+        };
+        sky: {
+            root: string;
+        };
+        purple: {
+            root: string;
+        };
+        red: {
+            root: string;
+        };
+        green: {
+            root: string;
+        };
+        teal: {
+            root: string;
+        };
+        violet: {
+            root: string;
+        };
+        pink: {
+            root: string;
+        };
+        orange: {
+            root: string;
+        };
     };
-}, undefined, "-me-2 inline-flex size-14 cursor-pointer items-center justify-center rounded-md p-0 leading-none opacity-60 transition-all hover:opacity-100 [&>svg]:size-14! [&>svg]:opacity-100!", unknown, unknown, undefined>>;
-declare function Badge({ className, variant, size, appearance, shape, asChild, disabled, ...props }: React$1.ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {
-    asChild?: boolean;
-}): react_jsx_runtime.JSX.Element;
-declare function BadgeButton({ className, variant, asChild, ...props }: React$1.ComponentProps<'button'> & VariantProps<typeof badgeButtonVariants> & {
+}, {
+    root: string[];
+    image: string;
+    indicator: string;
+}, undefined, unknown, unknown, undefined>>> & React$1.HTMLAttributes<HTMLDivElement> & {
     asChild?: boolean;
+    placeholderType?: "user" | "company";
+    ring?: boolean | AvatarRingSharedProps["color"];
+} & React$1.RefAttributes<HTMLDivElement>>;
+declare function AvatarIndicator({ size, color, className, position, withRing, ...rest }: AvatarSharedProps & React$1.HTMLAttributes<HTMLDivElement> & {
+    position?: 'top' | 'bottom';
+    withRing?: boolean;
 }): react_jsx_runtime.JSX.Element;
-declare function BadgeDot({ className, ...props }: React$1.ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
-
-declare const badge_Badge: typeof Badge;
-declare const badge_BadgeButton: typeof BadgeButton;
-type badge_BadgeButtonProps = BadgeButtonProps;
-declare const badge_BadgeDot: typeof BadgeDot;
-type badge_BadgeDotProps = BadgeDotProps;
-type badge_BadgeProps = BadgeProps;
-declare const badge_badgeVariants: typeof badgeVariants;
-declare namespace badge {
-  export { badge_Badge as Badge, badge_BadgeButton as BadgeButton, type badge_BadgeButtonProps as BadgeButtonProps, badge_BadgeDot as BadgeDot, type badge_BadgeDotProps as BadgeDotProps, type badge_BadgeProps as BadgeProps, Badge as Root, badge_badgeVariants as badgeVariants };
+declare namespace AvatarIndicator {
+    var displayName: string;
 }
-
 declare const avatarStatusVariants: tailwind_variants.TVReturnType<{
-    variant: {
+    status: {
         online: string;
         offline: string;
         busy: string;
         away: string;
     };
-}, undefined, "border-background flex size-2 items-center rounded-full border-2", {
-    variant: {
+}, undefined, "box-content size-12 rounded-full border-4 border-bg-white", {
+    status: {
         online: string;
         offline: string;
         busy: string;
         away: string;
     };
 }, undefined, tailwind_variants.TVReturnType<{
-    variant: {
+    status: {
         online: string;
         offline: string;
         busy: string;
         away: string;
     };
-}, undefined, "border-background flex size-2 items-center rounded-full border-2", unknown, unknown, undefined>>;
-declare function Avatar({ className, ...props }: React$1.ComponentProps<typeof Avatar$1.Root>): react_jsx_runtime.JSX.Element;
-declare function AvatarImage({ className, ...props }: React$1.ComponentProps<typeof Avatar$1.Image>): react_jsx_runtime.JSX.Element;
-declare function AvatarFallback({ className, ...props }: React$1.ComponentProps<typeof Avatar$1.Fallback>): react_jsx_runtime.JSX.Element;
-declare function AvatarIndicator({ className, ...props }: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
-declare function AvatarStatus({ className, variant, ...props }: React$1.HTMLAttributes<HTMLDivElement> & VariantProps<typeof avatarStatusVariants>): react_jsx_runtime.JSX.Element;
-
-declare const avatar_Avatar: typeof Avatar;
-declare const avatar_AvatarFallback: typeof AvatarFallback;
-declare const avatar_AvatarImage: typeof AvatarImage;
-declare const avatar_AvatarIndicator: typeof AvatarIndicator;
-declare const avatar_AvatarStatus: typeof AvatarStatus;
-declare const avatar_avatarStatusVariants: typeof avatarStatusVariants;
-declare namespace avatar {
-  export { avatar_Avatar as Avatar, avatar_AvatarFallback as AvatarFallback, avatar_AvatarImage as AvatarImage, avatar_AvatarIndicator as AvatarIndicator, avatar_AvatarStatus as AvatarStatus, Avatar as Root, avatar_avatarStatusVariants as avatarStatusVariants };
+}, undefined, "box-content size-12 rounded-full border-4 border-bg-white", unknown, unknown, undefined>>;
+declare function AvatarStatus({ status, className, ...rest }: VariantProps<typeof avatarStatusVariants> & React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
+declare namespace AvatarStatus {
+    var displayName: string;
+}
+declare const AvatarBrandLogo: React$1.ForwardRefExoticComponent<React$1.ImgHTMLAttributes<HTMLImageElement> & {
+    asChild?: boolean;
+} & React$1.RefAttributes<HTMLImageElement>>;
+declare function AvatarNotification({ className, ...rest }: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
+declare namespace AvatarNotification {
+    var displayName: string;
+}
+declare function AvatarBadge({ className, ...rest }: React$1.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
+declare namespace AvatarBadge {
+    var displayName: string;
+}
+
+declare const index_AVATAR_ROOT_NAME: typeof AVATAR_ROOT_NAME;
+type index_AvatarRootProps = AvatarRootProps;
+declare const index_avatarRingVariants: typeof avatarRingVariants;
+declare const index_avatarStatusVariants: typeof avatarStatusVariants;
+declare const index_avatarVariants: typeof avatarVariants;
+declare namespace index {
+  export { index_AVATAR_ROOT_NAME as AVATAR_ROOT_NAME, type index_AvatarRootProps as AvatarRootProps, AvatarBadge as Badge, AvatarBrandLogo as BrandLogo, AvatarImage as Image, AvatarIndicator as Indicator, AvatarNotification as Notification, AvatarRoot as Root, AvatarStatus as Status, index_avatarRingVariants as avatarRingVariants, index_avatarStatusVariants as avatarStatusVariants, index_avatarVariants as avatarVariants };
 }
 
 declare function Command({ className, ...props }: React__default.ComponentProps<typeof Command$1>): react_jsx_runtime.JSX.Element;
@@ -342,7 +746,6 @@ declare const tabsListVariants: tailwind_variants.TVReturnType<{
         large: string;
         medium: string;
         small: string;
-        xsmall: string;
     };
 }, undefined, "flex w-fit shrink-0 items-center", {
     variant: {
@@ -358,7 +761,6 @@ declare const tabsListVariants: tailwind_variants.TVReturnType<{
         large: string;
         medium: string;
         small: string;
-        xsmall: string;
     };
 }, undefined, tailwind_variants.TVReturnType<{
     variant: {
@@ -374,7 +776,6 @@ declare const tabsListVariants: tailwind_variants.TVReturnType<{
         large: string;
         medium: string;
         small: string;
-        xsmall: string;
     };
 }, undefined, "flex w-fit shrink-0 items-center", unknown, unknown, undefined>>;
 declare const tabsContentVariants: tailwind_variants.TVReturnType<{
@@ -487,7 +888,7 @@ declare const popoverVariants: tailwind_variants.TVReturnType<{
     header: string;
     close: string;
 }, undefined, unknown, unknown, undefined>>;
-type PopoverPresetProps = VariantProps<typeof popoverVariants> & React__default.ComponentProps<typeof PopoverContent> & {
+type PopoverPresetProps = VariantProps<typeof popoverVariants> & Omit<React__default.ComponentProps<typeof PopoverContent>, 'content' | 'title'> & {
     title?: React__default.ReactNode;
     content?: React__default.ReactNode;
     contentClassName?: string;
@@ -579,7 +980,6 @@ interface BaseMenuItem {
 interface RadioMenuItem extends BaseMenuItem {
     groupType: 'radio';
     value?: IValue;
-    defaultValue?: IValue;
     options: IOptionItem[];
     items?: never;
     onValueChange?: SetValue<IValue>;
@@ -587,7 +987,6 @@ interface RadioMenuItem extends BaseMenuItem {
 interface CheckboxMenuItem extends BaseMenuItem {
     groupType: 'checkbox';
     value?: IValue[];
-    defaultValue?: IValue[];
     options: IOptionItem[];
     items?: never;
     onValueChange?: SetValue<IValue[]>;
@@ -613,6 +1012,7 @@ interface MenuPropBase {
     items?: DropdownMenuItemProps[];
     disabled?: boolean;
     className?: string;
+    arrow?: boolean;
     renderItem?: (item: DropdownMenuItemProps, index: number, onAction: MenuPropBase['onAction']) => React__default.ReactNode;
     onAction?: (item: DropdownMenuItemProps, event: React__default.MouseEvent<HTMLDivElement>) => void;
 }
@@ -797,12 +1197,102 @@ type OwnProps = {
 };
 declare function Spinner({ stroke, className }: OwnProps): react_jsx_runtime.JSX.Element;
 
-type Variant = 'slate' | 'red' | 'orange' | 'amber' | 'yellow' | 'lime' | 'green' | 'emerald' | 'teal' | 'cyan' | 'sky' | 'blue' | 'indigo' | 'violet' | 'purple' | 'fuchsia' | 'pink' | 'rose';
-type ColorPanelProps = React__default.ComponentProps<'div'> & {
+declare const colorPanelVariants: tailwind_variants.TVReturnType<{
+    variant: {
+        filled: string;
+        lighter: string;
+        outline: string;
+    };
+    ring: {
+        true: string;
+    };
+    color: {
+        neutral: string;
+        slate: string;
+        red: string;
+        orange: string;
+        amber: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+    };
+}, undefined, "flex shrink-0 items-center justify-center rounded-2xl ring-1 ring-transparent ring-inset", {
+    variant: {
+        filled: string;
+        lighter: string;
+        outline: string;
+    };
+    ring: {
+        true: string;
+    };
+    color: {
+        neutral: string;
+        slate: string;
+        red: string;
+        orange: string;
+        amber: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+    };
+}, undefined, tailwind_variants.TVReturnType<{
+    variant: {
+        filled: string;
+        lighter: string;
+        outline: string;
+    };
+    ring: {
+        true: string;
+    };
+    color: {
+        neutral: string;
+        slate: string;
+        red: string;
+        orange: string;
+        amber: string;
+        yellow: string;
+        lime: string;
+        green: string;
+        emerald: string;
+        teal: string;
+        cyan: string;
+        sky: string;
+        blue: string;
+        indigo: string;
+        violet: string;
+        purple: string;
+        fuchsia: string;
+        pink: string;
+        rose: string;
+    };
+}, undefined, "flex shrink-0 items-center justify-center rounded-2xl ring-1 ring-transparent ring-inset", unknown, unknown, undefined>>;
+type SharedProps = VariantProps<typeof colorPanelVariants>;
+type ColorPanelProps = React__default.ComponentProps<'div'> & SharedProps & {
     asChild?: boolean;
-    variant?: Variant;
 };
-declare function ColorPanel({ asChild, children, className, variant, ...props }: ColorPanelProps): react_jsx_runtime.JSX.Element;
+declare function ColorPanel({ asChild, children, className, color, variant, ring, ...props }: ColorPanelProps): react_jsx_runtime.JSX.Element;
 
 declare function Collapsible({ ...props }: React__default.ComponentProps<typeof Collapsible$1.Root>): react_jsx_runtime.JSX.Element;
 declare function CollapsibleTrigger({ ...props }: React__default.ComponentProps<typeof Collapsible$1.CollapsibleTrigger>): react_jsx_runtime.JSX.Element;
@@ -904,4 +1394,202 @@ declare const Tooltip: React__default.FC<TooltipProps & {
     content: React__default.ReactNode;
 }>;
 
-export { avatar as Avatar, badge as Badge, ButtonSharedProps, card as Card, Collapsible, CollapsibleContent, CollapsibleTrigger, ColorPanel, command as Command, CopyableText, type CopyableTextProps, type DebouncedFunction, Drawer, type DrawerProps, DropdownMenu, type DropdownMenuItemProps, type DropdownMenuProps, type DropdownMenuVariants, type MenuPropBase, PopConfirm, type PopConfirmProps, popover as Popover, PopoverPreset, type PopoverPresetProps, type Scheduler, Skeleton, Spinner, Switch, tabs as Tabs, type ThrottledFunction, Tooltip, TooltipArrow, TooltipProvider, TooltipRoot, TooltipTrigger, UIProvider, type UseDrawerOptions, cn, compact, debounce, dropdownMenuStyles, findOption, formatCurrency, formatIntegerCompact, formatNumber, getFirstLetters, mergeRefs, throttle, tooltipVariants, tv, twMergeConfig, unique, useDrawer };
+type BadgeSharedProps = VariantProps<typeof badgeVariants>;
+interface BadgeRootProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, 'color'>, BadgeSharedProps {
+    asChild?: boolean;
+}
+declare const badgeVariants: tailwind_variants.TVReturnType<{
+    size: {
+        medium: {
+            root: string;
+            icon: string;
+            dot: string;
+        };
+        small: {
+            root: string;
+            icon: string;
+            dot: string;
+        };
+        xsmall: {
+            root: string;
+            icon: string;
+            dot: string;
+        };
+    };
+    variant: {
+        filled: {
+            root: string;
+        };
+        outline: {
+            root: string;
+        };
+        lighter: string;
+        ghost: string;
+    };
+    color: {
+        primary: string;
+        info: string;
+        success: string;
+        warning: string;
+        error: string;
+        neutral: string;
+    };
+    shape: {
+        default: string;
+        circle: {
+            root: string;
+        };
+    };
+    disabled: {
+        true: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    icon: string;
+    dot: string[];
+}, undefined, {
+    size: {
+        medium: {
+            root: string;
+            icon: string;
+            dot: string;
+        };
+        small: {
+            root: string;
+            icon: string;
+            dot: string;
+        };
+        xsmall: {
+            root: string;
+            icon: string;
+            dot: string;
+        };
+    };
+    variant: {
+        filled: {
+            root: string;
+        };
+        outline: {
+            root: string;
+        };
+        lighter: string;
+        ghost: string;
+    };
+    color: {
+        primary: string;
+        info: string;
+        success: string;
+        warning: string;
+        error: string;
+        neutral: string;
+    };
+    shape: {
+        default: string;
+        circle: {
+            root: string;
+        };
+    };
+    disabled: {
+        true: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    icon: string;
+    dot: string[];
+}, tailwind_variants.TVReturnType<{
+    size: {
+        medium: {
+            root: string;
+            icon: string;
+            dot: string;
+        };
+        small: {
+            root: string;
+            icon: string;
+            dot: string;
+        };
+        xsmall: {
+            root: string;
+            icon: string;
+            dot: string;
+        };
+    };
+    variant: {
+        filled: {
+            root: string;
+        };
+        outline: {
+            root: string;
+        };
+        lighter: string;
+        ghost: string;
+    };
+    color: {
+        primary: string;
+        info: string;
+        success: string;
+        warning: string;
+        error: string;
+        neutral: string;
+    };
+    shape: {
+        default: string;
+        circle: {
+            root: string;
+        };
+    };
+    disabled: {
+        true: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    icon: string;
+    dot: string[];
+}, undefined, unknown, unknown, undefined>>;
+declare function BadgeIcon<T extends React$1.ElementType>({ className, size, variant, color, as, ...rest }: PolymorphicComponentProps<T, BadgeSharedProps>): react_jsx_runtime.JSX.Element;
+declare namespace BadgeIcon {
+    var displayName: string;
+}
+type BadgeProps = BadgeRootProps & {
+    icon?: React$1.ComponentProps<typeof BadgeIcon>['as'];
+    dot?: boolean;
+};
+declare function Badge({ icon, dot, children, asChild, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
+
+declare function ScrollArea({ className, scrollBarClassName, children, ...props }: React$1.ComponentProps<typeof ScrollArea$1.Root> & {
+    scrollBarClassName?: string;
+}): react_jsx_runtime.JSX.Element;
+
+interface SwapProps {
+    swap: boolean;
+    on: React__default.ReactNode;
+    off: React__default.ReactNode;
+    className?: string;
+}
+declare function Swap({ swap, on, off, className }: SwapProps): react_jsx_runtime.JSX.Element;
+
+interface StateSwitcherProps {
+    state: string;
+    states: Record<string, React__default.ReactNode>;
+    className?: string;
+    asDiv?: boolean;
+    initial?: boolean;
+    style?: React__default.CSSProperties;
+}
+declare function StateSwitcher({ initial, state, states, asDiv, className, style, ...rest }: StateSwitcherProps): react_jsx_runtime.JSX.Element;
+
+type HoverCardProps = React$1.ComponentProps<typeof HoverCard$1.Root> & Omit<React$1.ComponentProps<typeof HoverCard$1.Content>, 'content'> & {
+    asChild?: boolean;
+    arrow?: boolean;
+    className?: string;
+    content?: React$1.ReactNode;
+};
+declare function HoverCard({ open, defaultOpen, openDelay, closeDelay, asChild, arrow, content, children: trigger, onOpenChange, ...contentProps }: HoverCardProps): react_jsx_runtime.JSX.Element;
+
+export { index as Avatar, Badge, type BadgeProps, ButtonSharedProps, card as Card, Collapsible, CollapsibleContent, CollapsibleTrigger, ColorPanel, command as Command, CopyableText, type CopyableTextProps, type DebouncedFunction, Drawer, type DrawerProps, DropdownMenu, type DropdownMenuItemProps, type DropdownMenuProps, type DropdownMenuVariants, HoverCard, type MenuPropBase, PopConfirm, type PopConfirmProps, popover as Popover, PopoverPreset, type PopoverPresetProps, type Scheduler, ScrollArea, Skeleton, Spinner, StateSwitcher, Swap, Switch, tabs as Tabs, type ThrottledFunction, Tooltip, TooltipArrow, TooltipProvider, TooltipRoot, TooltipTrigger, UIProvider, type UseDrawerOptions, cn, compact, debounce, dropdownMenuStyles, findOption, formatCurrency, formatIntegerCompact, formatNumber, getFirstLetters, mergeRefs, throttle, tooltipVariants, tv, twMergeConfig, unique, useDrawer };