feat: 修改代码结构

packages/airo-ui/src/components/AiroButton.tsx

@@ -12,6 +12,7 @@ const buttonVariants = cva(
         default: 'bg-[#0F2C53] text-primary-foreground shadow hover:bg-[#225BA9]',
         primary: 'bg-[#225BA9] text-primary-foreground shadow hover:bg-[#0F2C53] ',
         danger: 'bg-[#FF4248] text-primary-foreground shadow hover:bg-[#E22C2E]',
+        dangerLink: 'text-[#E22C2E] ',
         destructive: 'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
         outline:
           'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',

packages/airo-ui/src/components/input.tsx

@@ -8,7 +8,7 @@ const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<'input'>>(
       <input
         type={type}
         className={cn(
-          'border-input file:text-foreground placeholder:text-muted-foreground focus-visible:ring-ring flex h-9 w-full rounded-md border bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+          'border-input file:text-foreground placeholder:text-muted-foreground focus-visible:ring-ring flex h-9 w-full rounded-md border bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
           className,
         )}
         ref={ref}

packages/airo-ui/src/custom-components/pro-list/column-filter.tsx

@@ -35,7 +35,7 @@ export function ColumnFilter<TData>({ table, params, filters }: ColumnFilterProp
           return (
             <Combobox
               key={param.key}
-              className='w-32'
+              className='w-24'
               placeholder={param.placeholder || 'Choose...'}
               value={filters[param.key] || ''}
               onChange={(value) => {
@@ -48,7 +48,7 @@ export function ColumnFilter<TData>({ table, params, filters }: ColumnFilterProp
         return (
           <Input
             key={param.key}
-            className='w-16 rounded-[20px] text-xs shadow-[inset_0_0_7.6px_0_#00000040] sm:w-64 sm:text-xl'
+            className='w-36 rounded-[20px] text-xs shadow-[inset_0_0_7.6px_0_#00000040] sm:w-64 sm:text-xl'
             placeholder={param.placeholder || 'Search...'}
             value={filters[param.key] || ''}
             onChange={(event) => updateFilter(param.key, event.target.value)}

packages/airo-ui/src/custom-components/pro-list/pro-list.tsx

@@ -134,13 +134,22 @@ export function ProList<TData, TValue extends Record<string, unknown>>({
   return (
     <div className='flex max-w-full flex-col gap-2 sm:gap-4'>
       <div className='flex flex-wrap-reverse items-center justify-between gap-4'>
-        <div>
+        <div className={'w-full'}>
           {params ? (
-            <ColumnFilter
-              table={table}
-              params={params}
-              filters={Object.fromEntries(columnFilters.map((item) => [item.id, item.value]))}
-            />
+            <div className='flex w-full justify-between'>
+              <ColumnFilter
+                table={table}
+                params={params}
+                filters={Object.fromEntries(columnFilters.map((item) => [item.id, item.value]))}
+              />
+              <Button
+                variant='outline'
+                className='h-8 w-8 rounded-full bg-[#D9D9D9] p-2 sm:hidden'
+                onClick={fetchData}
+              >
+                <RefreshCcw className='h-4 w-4 text-[#848484]' />
+              </Button>
+            </div>
           ) : (
             header?.title
           )}
@@ -150,7 +159,7 @@ export function ProList<TData, TValue extends Record<string, unknown>>({
             <>
               <Button
                 variant='outline'
-                className='h-8 w-8 rounded-full bg-[#D9D9D9] p-2'
+                className='hidden h-8 w-8 rounded-full bg-[#D9D9D9] p-2 sm:block'
                 onClick={fetchData}
               >
                 <RefreshCcw className='h-4 w-4 text-[#848484]' />