Sfoglia il codice sorgente

♻️ refactor(input): enhance input component type definition and value handling

- 导出InputProps类型,显式定义value属性支持的类型
- 处理null值情况,将null转换为undefined传递给原生input元素

🌐 i18n(pagination): 国际化分页组件文本

- 将"Previous"翻译为"上一页"
- 将"Next"翻译为"下一页"
- 将"More pages"翻译为"更多"
yourname 7 mesi fa
parent
commit
adb22a7705

+ 4 - 1
src/client/components/ui/input.tsx

@@ -2,11 +2,14 @@ import * as React from "react"
 
 
 import { cn } from "@/client/lib/utils"
 import { cn } from "@/client/lib/utils"
 
 
-function Input({ className, type, ...props }: React.ComponentProps<"input">) {
+export type InputProps = Omit<React.ComponentProps<"input">, 'value'> & { value?: string | number | readonly string[] | null }
+
+function Input({ className, type, value, ...props }: InputProps) {
   return (
   return (
     <input
     <input
       type={type}
       type={type}
       data-slot="input"
       data-slot="input"
+      value={value === null ? undefined : value}
       className={cn(
       className={cn(
         "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
         "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",

+ 3 - 3
src/client/components/ui/pagination.tsx

@@ -77,7 +77,7 @@ function PaginationPrevious({
       {...props}
       {...props}
     >
     >
       <ChevronLeftIcon />
       <ChevronLeftIcon />
-      <span className="hidden sm:block">Previous</span>
+      <span className="hidden sm:block">上一页</span>
     </PaginationLink>
     </PaginationLink>
   )
   )
 }
 }
@@ -93,7 +93,7 @@ function PaginationNext({
       className={cn("gap-1 px-2.5 sm:pr-2.5", className)}
       className={cn("gap-1 px-2.5 sm:pr-2.5", className)}
       {...props}
       {...props}
     >
     >
-      <span className="hidden sm:block">Next</span>
+      <span className="hidden sm:block">下一页</span>
       <ChevronRightIcon />
       <ChevronRightIcon />
     </PaginationLink>
     </PaginationLink>
   )
   )
@@ -111,7 +111,7 @@ function PaginationEllipsis({
       {...props}
       {...props}
     >
     >
       <MoreHorizontalIcon className="size-4" />
       <MoreHorizontalIcon className="size-4" />
-      <span className="sr-only">More pages</span>
+      <span className="sr-only">更多</span>
     </span>
     </span>
   )
   )
 }
 }