myshell-react-lib 0.1.4 → 0.1.6

package/src/components/button/button.styles.ts

@@ -1,258 +0,0 @@
-import { cva } from 'class-variance-authority';
-
-// 基础样式常量
-const BASE_BUTTON =
-  'relative shrink-0 inline-flex items-center justify-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:secondary-none focus-visible:shadow-none focus-visible:ring-2 focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-30 disabled:shadow-none [&>span>svg]:text-inherit [&>span>span>svg]:text-inherit';
-
-// 尺寸相关常量
-const SIZE_CLASSES = {
-  lg: {
-    base: 'h-11',
-    withPadding: 'h-11 min-w-11 px-6',
-    text: 'text-base',
-    iconSize: 'w-5 h-5',
-  },
-  md: {
-    base: 'h-9',
-    withPadding: 'h-9 min-w-9 px-4 text-sm',
-    text: 'text-sm',
-    iconSize: 'w-4.5 h-4.5',
-  },
-  sm: {
-    base: 'h-7',
-    withPadding: 'h-7 min-w-7 px-3 text-sm',
-    text: 'text-xs',
-    iconSize: 'w-4 h-4',
-  },
-};
-
-// 颜色主题
-const COLOR_THEMES = {
-  default: {
-    primary:
-      'bg-cc-Button-Primary-bg-default text-cc-Button-Primary-fg-default hover:bg-cc-Button-Primary-bg-hover active:bg-cc-Button-Primary-bg-active disabled:bg-cc-Button-Primary-bg-disabled',
-    secondary:
-      'border-cc-Button-Secondary-border-default text-cc-Button-Secondary-fg-default bg-cc-Button-Secondary-bg-default hover:bg-cc-Button-Secondary-bg-hover active:bg-cc-Button-Secondary-bg-active disabled:text-cc-Button-Secondary-fg-alt  disabled:border-cc-Button-Secondary-border-disabled',
-    tertiary:
-      'border border-cc-Button-Tertiary-border-default text-cc-Button-Tertiary-fg-default  bg-cc-Button-Tertiary-bg-default hover:bg-cc-Button-Tertiary-bg-hover hover:border-cc-Button-Tertiary-border-alt focus:shadow-button-tertiary-shadow active:bg-cc-Button-Tertiary-bg-active disabled:text-cc-Button-Tertiary-fg-alt ',
-    link: 'rounded-none font-normal underline-offset-4 hover:underline active:underline text-cc-Link-Button-Primary-fg-default hover:text-cc-Link-Button-Primary-fg-hover active:text-cc-Link-Button-Primary-fg-active disabled:text-cc-Link-Button-Primary-fg-disabled',
-    plain:
-      'text-cc-Button-Plain-fg-default hover:bg-cc-Button-Plain-bg-hover focus:shadow-cc-Focus-Rings-Brand-default active:bg-cc-Button-Plain-bg-active disabled:text-cc-Button-Plain-fg-alt ',
-  },
-  brand: {
-    primary:
-      'text-cc-Button-Brand-fg-default bg-cc-Button-Brand-bg-default hover:bg-cc-Button-Brand-bg-hover active:bg-cc-Button-Brand-bg-active disabled:bg-cc-Button-Brand-bg-disabled shadow-none hover:shadow-button-brand focus:shadow-cc-Focus-Rings-Brand-default',
-    plain:
-      'text-cc-Button-Plain-Brand-fg-default bg-cc-Button-Plain-Brand-bg-default hover:bg-cc-Button-Plain-Brand-bg-hover active:bg-cc-Button-Plain-Brand-bg-active disabled:text-cc-Button-Plain-Brand-fg-alt',
-  },
-  error: {
-    primary:
-      'text-cc-Button-Error-Primary-fg-default bg-cc-Button-Error-Primary-bg-default hover:bg-cc-Button-Error-Primary-bg-hover active:bg-cc-Button-Error-Primary-bg-active disabled:bg-cc-Button-Error-Primary-bg-disabled shadow-none',
-
-    secondary:
-      'border-cc-Button-Error-Secondary-border-default text-cc-Button-Error-Secondary-fg-default bg-cc-Button-Error-Secondary-bg-default hover:bg-cc-Button-Error-Secondary-bg-hover active:bg-cc-Button-Error-Secondary-bg-active disabled:text-cc-Button-Error-Secondary-fg-alt disabled:border-cc-Button-Error-Secondary-border-disabled',
-  },
-  chat: {
-    primary:
-      'shadow-none text-Colors-Text-Subtle bg-Colors-Background-Normal-Secondary-Default border border-Colors-Border-Default hover:bg-Colors-Background-Neutral-Primary-Hover active:bg-surface-accent-gray-subtler active:shadow-button-pressed disabled:bg-Colors-Background-Normal-Secondary-Default disabled:text-Colors-Text-Disabled disabled:opacity-100',
-  },
-};
-
-// 变体基础样式
-const VARIANT_BASE = {
-  primary: '',
-  secondary: 'border shadow-none',
-  tertiary: '',
-  static:
-    'text-cc-Button-Static-fg-default border-cc-Button-Static-border-default bg-cc-Button-Static-bg-default hover:bg-cc-Button-Static-bg-hover active:bg-cc-Button-Static-bg-active disabled:bg-cc-Button-Static-bg-disabled disabled:text-cc-Button-Static-fg-alt',
-  link: '',
-  plain: '',
-  opacity:
-    'text-Colors-Text-Static-White bg-Colors-Beta-White-30 border border-Colors-Beta-White-12 shadow-none hover:bg-Colors-Beta-White-40 focus:shadow-cc-Focus-Rings-Brand-default active:bg-Colors-Beta-White-50 disabled:bg-Colors-Beta-White-60 disabled:text-Colors-Beta-White-80',
-  solid:
-    'shadow-none text-Colors-Text-Subtle bg-cc-Button-Solid-bg-default border border-cc-Button-Solid-border-default hover:bg-cc-Button-Solid-bg-hover hover:border-cc-Button-Solid-border-alt active:bg-cc-Button-Solid-bg-active disabled:text-cc-Button-Solid-fg-alt',
-};
-
-// 特殊布局变体
-const SPECIAL_LAYOUTS = {
-  link: 'h-fit w-fit min-w-auto px-0.5 py-0.5',
-  plain: 'h-fit w-fit min-w-auto px-0.5 py-0.5',
-};
-
-// 主按钮样式
-export const buttonVariants = cva(BASE_BUTTON, {
-  variants: {
-    variant: VARIANT_BASE,
-    color: {
-      default: '',
-      brand: '',
-      error: '',
-      gray: '',
-      chat: '',
-    },
-    size: {
-      lg: 'h-11',
-      md: 'h-9',
-      sm: 'h-7',
-    },
-  },
-  compoundVariants: [
-    // 尺寸相关变体
-    { variant: 'primary', size: 'lg', className: SIZE_CLASSES.lg.withPadding },
-    { variant: 'primary', size: 'md', className: SIZE_CLASSES.md.withPadding },
-    { variant: 'primary', size: 'sm', className: SIZE_CLASSES.sm.withPadding },
-    {
-      variant: 'secondary',
-      size: 'lg',
-      className: SIZE_CLASSES.lg.withPadding,
-    },
-    {
-      variant: 'secondary',
-      size: 'md',
-      className: SIZE_CLASSES.md.withPadding,
-    },
-    {
-      variant: 'secondary',
-      size: 'sm',
-      className: SIZE_CLASSES.sm.withPadding,
-    },
-    { variant: 'tertiary', size: 'lg', className: SIZE_CLASSES.lg.withPadding },
-    { variant: 'tertiary', size: 'md', className: SIZE_CLASSES.md.withPadding },
-    { variant: 'tertiary', size: 'sm', className: SIZE_CLASSES.sm.withPadding },
-    { variant: 'static', size: 'lg', className: SIZE_CLASSES.lg.withPadding },
-    { variant: 'static', size: 'md', className: SIZE_CLASSES.md.withPadding },
-    { variant: 'static', size: 'sm', className: SIZE_CLASSES.sm.withPadding },
-
-    // 颜色主题变体
-    {
-      variant: 'primary',
-      color: 'default',
-      className: COLOR_THEMES.default.primary,
-    },
-    {
-      variant: 'primary',
-      color: 'brand',
-      className: COLOR_THEMES.brand.primary,
-    },
-    {
-      variant: 'primary',
-      color: 'error',
-      className: COLOR_THEMES.error.primary,
-    },
-    { variant: 'primary', color: 'chat', className: COLOR_THEMES.chat.primary },
-    {
-      variant: 'tertiary',
-      color: 'default',
-      className: COLOR_THEMES.default.tertiary,
-    },
-    {
-      variant: 'secondary',
-      color: 'default',
-      className: COLOR_THEMES.default.secondary,
-    },
-    {
-      variant: 'secondary',
-      color: 'error',
-      className: COLOR_THEMES.error.secondary,
-    },
-
-    // 特殊布局变体
-    { variant: 'link', className: SPECIAL_LAYOUTS.link },
-    { variant: 'plain', className: SPECIAL_LAYOUTS.plain },
-
-    // Link变体的颜色
-    { variant: 'link', color: 'default', className: COLOR_THEMES.default.link },
-
-    // Plain变体的颜色
-    {
-      variant: 'plain',
-      color: 'default',
-      className: COLOR_THEMES.default.plain,
-    },
-    { variant: 'plain', color: 'brand', className: COLOR_THEMES.brand.plain },
-
-    // Link尺寸
-    {
-      variant: 'link',
-      size: 'lg',
-      className: 'h-fit w-fit px-0.5 py-0.5 text-base',
-    },
-    {
-      variant: 'link',
-      size: 'md',
-      className: 'h-fit w-fit px-0.5 py-0.5 text-sm',
-    },
-    {
-      variant: 'link',
-      size: 'sm',
-      className: 'h-fit w-fit px-0.5 py-0.5 text-xs',
-    },
-
-    // Plain尺寸
-    {
-      variant: 'plain',
-      size: 'lg',
-      className: 'h-fit w-fit px-0.5 py-0.5 text-base',
-    },
-    {
-      variant: 'plain',
-      size: 'md',
-      className: 'h-fit w-fit px-0.5 py-0.5 text-sm',
-    },
-    {
-      variant: 'plain',
-      size: 'sm',
-      className: 'h-fit w-fit px-0.5 py-0.5 text-xs',
-    },
-  ],
-  defaultVariants: {
-    variant: 'primary',
-    color: 'default',
-    size: 'lg',
-  },
-});
-
-// 图标样式
-export const iconVariants = cva(
-  'relative shrink-0 text-inherit inline-flex items-center justify-center whitespace-nowrap transition-colors ring-offset-cc-Focus-Rings-Brand-default',
-  {
-    variants: {
-      variant: {
-        primary: '',
-        secondary: '',
-        tertiary: '',
-        link: 'font-normal',
-        plain: 'font-medium',
-        static: '',
-        solid: '',
-        opacity: '',
-      },
-      size: {
-        lg: 'text-base w-5 h-5',
-        md: 'text-sm w-4.5 h-4.5',
-        sm: 'text-sm w-4 h-4',
-      },
-    },
-    compoundVariants: [
-      {
-        variant: 'plain',
-        size: 'lg',
-        className: 'text-base w-4.5 h-4.5',
-      },
-      {
-        variant: 'plain',
-        size: 'md',
-        className: 'text-sm w-4 h-4',
-      },
-      {
-        variant: 'plain',
-        size: 'sm',
-        className: 'text-sm',
-      },
-    ],
-    defaultVariants: {
-      variant: 'primary',
-      size: 'lg',
-    },
-  }
-);

package/src/components/button/button.tsx

@@ -1,215 +0,0 @@
-/* eslint-disable react/require-default-props */
-import { Slot } from '@radix-ui/react-slot';
-import { type VariantProps } from 'class-variance-authority';
-import { Loader2 } from 'lucide-react';
-import * as React from 'react';
-
-import { getAssetsUrl } from '../../common/utils/common-helper';
-import { cn } from '@/lib/utils';
-
-import { Icon } from '../icon';
-import { Image } from '../image';
-import { Separator } from '../separator';
-import { Text } from '../typography';
-import { buttonVariants, iconVariants } from './button.styles';
-
-export interface ButtonProps
-  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-    VariantProps<typeof buttonVariants> {
-  asChild?: boolean;
-  loading?: boolean;
-  icon?: React.ElementType;
-  iconDirection?: 'left' | 'right';
-  color?: 'default' | 'brand' | 'error' | 'chat';
-  noStyle?: boolean;
-  iconClassName?: string;
-  iconOutBox?: boolean;
-  isBlock?: boolean;
-  asset?: 'energy' | 'coin';
-  assetNumber?: number;
-}
-
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-  (
-    {
-      className = '',
-      iconClassName,
-      variant = 'primary',
-      color = 'default',
-      icon,
-      iconDirection = 'left',
-      size,
-      asChild = false,
-      loading = false,
-      noStyle = false,
-      iconOutBox = false,
-      isBlock = false,
-      disabled,
-      children,
-      autoFocus,
-      asset,
-      assetNumber = 0,
-      ...props
-    },
-    ref
-  ) => {
-    const Comp = asChild ? Slot : 'button';
-    const disable = disabled || loading;
-
-    return (
-      <Comp
-        className={
-          noStyle
-            ? className
-            : cn(
-                buttonVariants({ variant, color, size, className }),
-                disable && '!pointer-events-auto cursor-not-allowed',
-                isBlock && 'w-full'
-              )
-        }
-        ref={ref}
-        disabled={disable}
-        autoFocus={autoFocus}
-        {...props}
-      >
-        {loading && (
-          <span className="absolute left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 items-center justify-center">
-            <Loader2
-              className={cn(
-                iconVariants({ variant, size }),
-                'animate-spin',
-                size === 'lg'
-                  ? 'h-6 w-6'
-                  : size === 'md'
-                  ? 'h-5 w-5'
-                  : 'h-4.5 w-4.5'
-              )}
-            />
-          </span>
-        )}
-        {!asset &&
-          icon &&
-          iconOutBox &&
-          iconDirection === 'left' &&
-          renderIcon(icon, 'left', {
-            loading,
-            noStyle,
-            iconClassName,
-            variant,
-            color,
-            size,
-          })}
-        <span
-          className={cn(
-            'inline-flex w-full items-center justify-center',
-            loading ? 'opacity-0' : 'opacity-100',
-            variant === 'plain' && 'font-medium'
-          )}
-        >
-          {!asset &&
-            icon &&
-            !iconOutBox &&
-            iconDirection === 'left' &&
-            renderIcon(icon, 'left', {
-              loading,
-              noStyle,
-              iconClassName,
-              variant,
-              color,
-              size,
-            })}
-          {children}
-          {asset ? (
-            <>
-              <Separator
-                orientation="vertical"
-                className={cn(
-                  'mx-1.5 h-3',
-                  variant === 'primary'
-                    ? 'border-Colors-Alpha-White-20'
-                    : 'border-Colors-Beta-Black-20'
-                )}
-              />
-              <Image
-                src={
-                  asset === 'energy'
-                    ? getAssetsUrl(
-                        'image/bot/tag/20231214/1719340128612116720.png'
-                      )
-                    : getAssetsUrl('image/web3/20250331/shell_coin_icon_v2.png')
-                }
-                alt={asset}
-                width={16}
-                height={16}
-                className="flex-shrink-0"
-              />
-              <Text size="xs" className={cn('ml-0.5 text-inherit')}>
-                {assetNumber}
-              </Text>
-            </>
-          ) : null}
-          {!asset &&
-            icon &&
-            !iconOutBox &&
-            iconDirection === 'right' &&
-            renderIcon(icon, 'right', {
-              loading,
-              noStyle,
-              iconClassName,
-              variant,
-              color,
-              size,
-            })}
-        </span>
-        {!asset &&
-          icon &&
-          iconOutBox &&
-          iconDirection === 'right' &&
-          renderIcon(icon, 'right', {
-            loading,
-            noStyle,
-            iconClassName,
-            variant,
-            color,
-            size,
-          })}
-      </Comp>
-    );
-  }
-);
-const renderIcon = (
-  icon: React.ElementType,
-  direction: 'left' | 'right',
-  {
-    loading,
-    noStyle,
-    iconClassName,
-    variant = 'primary',
-    color = 'brand',
-    size = 'lg',
-  }: ButtonProps
-) => (
-  <Icon
-    component={icon}
-    className={
-      noStyle
-        ? iconClassName
-        : cn(
-            iconVariants({ variant, size }),
-            variant === 'plain' || variant === 'link'
-              ? direction === 'left'
-                ? 'mr-0.5'
-                : 'ml-0.5'
-              : direction === 'left'
-              ? 'mr-1.5'
-              : 'ml-1.5',
-
-            iconClassName,
-            loading ? 'opacity-0' : 'opacity-100'
-          )
-    }
-  />
-);
-Button.displayName = 'Button';
-
-export { Button, buttonVariants };

package/src/components/button/icon-button.styles.ts

@@ -1,101 +0,0 @@
-import { cva } from 'class-variance-authority';
-
-export const iconButtonVariants = cva(
-  'shrink-0 inline-flex items-center justify-center whitespace-nowrap rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:shadow-none focus-visible:ring-2 focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-30 disabled:shadow-none',
-  {
-    variants: {
-      variant: {
-        primary: '',
-        secondary: 'border shadow-none',
-        tertiary: 'border shadow-none',
-        plain: '',
-        opacity:
-          'text-Colors-Text-Static-White bg-Colors-Beta-White-30 border border-Colors-Beta-White-12 shadow-none hover:bg-Colors-Beta-White-40 focus:shadow-cc-Focus-Rings-Brand-default active:bg-Colors-Beta-White-50 disabled:bg-Colors-Beta-White-60 disabled:text-Colors-Beta-White-80',
-        solid:
-          'shadow-none text-Colors-Text-Subtle bg-cc-Button-Solid-bg-default border border-cc-Button-Solid-border-default hover:bg-cc-Button-Solid-bg-hover hover:border-cc-Button-Solid-border-alt active:bg-cc-Button-Solid-bg-active disabled:text-cc-Button-Solid-fg-alt',
-      },
-      color: {
-        default: '',
-        brand: '',
-        error: '',
-        gray: '',
-      },
-      size: {
-        xs: 'h-5 w-5 text-xs',
-        sm: 'h-7 w-7 text-sm',
-        md: 'h-9 w-9 text-sm',
-        lg: 'h-11 w-11',
-      },
-    },
-    compoundVariants: [
-      {
-        variant: 'primary',
-        color: 'brand',
-        className:
-          'text-cc-Icon-Button-Brand-fg-default bg-cc-Icon-Button-Brand-bg-default hover:bg-cc-Icon-Button-Brand-bg-hover active:bg-cc-Icon-Button-Brand-bg-active disabled:bg-cc-Icon-Button-Brand-bg-disabled disabled:text-cc-Icon-Button-Brand-fg-alt',
-      },
-      {
-        variant: 'primary',
-        color: 'error',
-        className:
-          'text-cc-Button-Error-Primary-fg-default bg-cc-Button-Error-Primary-bg-default hover:bg-cc-Button-Error-Primary-bg-hover active:bg-cc-Button-Error-Primary-bg-active disabled:bg-cc-Button-Error-Primary-bg-disabled',
-      },
-      {
-        variant: 'secondary',
-        color: 'default',
-        className:
-          'border-cc-Button-Secondary-border-default text-cc-Button-Secondary-fg-default bg-cc-Button-Secondary-bg-default hover:bg-cc-Button-Secondary-bg-hover active:bg-cc-Button-Secondary-bg-active disabled:text-cc-Button-Secondary-fg-alt  disabled:border-cc-Button-Secondary-border-disabled',
-      },
-      {
-        variant: 'tertiary',
-        color: 'default',
-        className:
-          'border-cc-Button-Tertiary-border-default text-cc-Button-Tertiary-fg-default  bg-cc-Button-Tertiary-bg-default hover:bg-cc-Button-Tertiary-bg-hover hover:border-cc-Button-Tertiary-border-alt focus:shadow-button-tertiary-shadow active:bg-cc-Button-Tertiary-bg-active disabled:text-cc-Button-Tertiary-fg-alt',
-      },
-      {
-        variant: 'secondary',
-        color: 'error',
-        className:
-          'border-cc-Button-Error-Secondary-border-default text-cc-Button-Error-Secondary-fg-default bg-cc-Button-Error-Secondary-bg-default hover:bg-cc-Button-Error-Secondary-bg-hover active:bg-cc-Button-Error-Secondary-bg-active disabled:text-cc-Button-Error-Secondary-fg-alt disabled:border-cc-Button-Error-Secondary-border-disabled',
-      },
-      {
-        variant: 'secondary',
-        color: 'gray',
-        className:
-          'text-Colors-Foreground-Subtle hover:bg-surface-hovered active:shadow-button-pressed',
-      },
-      {
-        variant: 'plain',
-        color: 'default',
-        className:
-          'text-cc-Button-Plain-fg-default hover:bg-cc-Button-Plain-bg-hover focus:shadow-cc-Focus-Rings-Brand-default active:bg-cc-Button-Plain-bg-active disabled:text-cc-Button-Plain-fg-alt',
-      },
-      {
-        variant: 'plain',
-        color: 'gray',
-        className:
-          'text-cc-Icon-Button-Plain-Gray-fg-default bg-cc-Button-Plain-Brand-bg-default hover:bg-cc-Button-Plain-Brand-bg-hover active:bg-cc-Button-Plain-Brand-bg-active disabled:text-cc-Button-Plain-Gray-fg-alt',
-      },
-      {
-        variant: 'plain',
-        color: 'error',
-        className:
-          'text-cc-Button-Error-Secondary-fg-default bg-cc-Button-Plain-bg-default hover:bg-cc-Button-Error-Secondary-bg-hover active:bg-cc-Button-Error-Secondary-bg-active disabled:text-cc-Button-Plain-fg-default',
-      },
-    ],
-    defaultVariants: {
-      variant: 'primary',
-      color: 'default',
-      size: 'lg',
-    },
-  }
-);
-
-export type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg';
-
-export const iconSizeVariants: Record<IconButtonSize, string> = {
-  xs: 'w-3 h-3',
-  sm: 'w-4.5 h-4.5',
-  md: 'w-5.5 h-5.5',
-  lg: 'w-6 h-6',
-};

package/src/components/button/icon-button.tsx

@@ -1,100 +0,0 @@
-/* eslint-disable react/no-unstable-nested-components */
-/* eslint-disable react/display-name */
-
-'use client';
-
-import { Slot } from '@radix-ui/react-slot';
-import { type VariantProps } from 'class-variance-authority';
-import { Loader2, LucideIcon } from 'lucide-react';
-import * as React from 'react';
-import { ClassNameValue } from 'tailwind-merge';
-import { useMedia } from 'react-use';
-
-import { Icon, type IconComponent } from '../icon';
-import { cn } from '@/lib/utils';
-import { Tooltip } from '../tooltip';
-import {
-  iconButtonVariants,
-  iconSizeVariants,
-  IconButtonSize,
-} from './icon-button.styles';
-
-export type HeroIcon = React.ForwardRefExoticComponent<
-  React.PropsWithoutRef<React.SVGProps<SVGSVGElement>> & {
-    title?: string;
-    titleId?: string;
-  } & React.RefAttributes<SVGSVGElement>
->;
-
-export interface IconButtonProps
-  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-    VariantProps<typeof iconButtonVariants> {
-  asChild?: boolean;
-  loading?: boolean;
-  disabled?: boolean;
-  color?: 'default' | 'brand' | 'error' | 'gray';
-  icon?: HeroIcon | LucideIcon | IconComponent | React.ElementType;
-  hoverText?: string;
-  hoverSide?: 'top' | 'right' | 'bottom' | 'left';
-  iconClassName?: ClassNameValue;
-  size?: IconButtonSize;
-}
-
-const IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(
-  (
-    {
-      iconClassName,
-      className,
-      variant,
-      size = 'lg',
-      color,
-      asChild = false,
-      loading = false,
-      children,
-      icon: IconEle,
-      disabled,
-      hoverText,
-      hoverSide,
-      ...passProps
-    },
-    ref
-  ) => {
-    const isMobile = useMedia('(max-width: 768px)');
-    const Comp = asChild ? Slot : 'button';
-    const iconCls = cn(iconSizeVariants[size], iconClassName);
-    const disable = disabled || loading;
-
-    return (
-      <Tooltip
-        sideOffset={4}
-        size="md"
-        description={hoverText}
-        side={hoverSide}
-        disabled={isMobile}
-      >
-        <Comp
-          className={cn(
-            iconButtonVariants({ variant, size, color }),
-            disable && 'cursor-not-allowed !pointer-events-auto',
-            className
-          )}
-          ref={ref}
-          disabled={disable}
-          {...passProps}
-        >
-          {loading ? (
-            <Loader2 className={cn('animate-spin', iconCls)} />
-          ) : IconEle ? (
-            <IconEle className={iconCls} />
-          ) : React.isValidElement(children) ? (
-            React.cloneElement(children, {
-              className: cn(iconCls, children.props.className),
-            } as React.ButtonHTMLAttributes<HTMLButtonElement>)
-          ) : null}
-        </Comp>
-      </Tooltip>
-    );
-  }
-);
-
-export { IconButton, iconButtonVariants };

package/src/components/button/index.tsx

@@ -1,3 +0,0 @@
-export * from './button';
-export * from './link-button';
-export * from './icon-button';