@ptengine/design-components 0.3.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +3 -1
  2. package/dist/index.cjs +14 -14
  3. package/dist/index.js +2309 -1938
  4. package/package.json +3 -3
  5. package/src/components/ui/calendar.tsx +33 -33
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ptengine/design-components",
3
- "version": "0.3.0",
3
+ "version": "0.4.0",
4
4
  "description": "PT-AI-Components — PTEngine 基于 shadcn/ui 的 React 组件库",
5
5
  "license": "UNLICENSED",
6
6
  "private": false,
@@ -88,11 +88,11 @@
88
88
  "class-variance-authority": "^0.7.1",
89
89
  "clsx": "^2.1.1",
90
90
  "cmdk": "^1.1.1",
91
- "date-fns": "^3.6.0",
91
+ "date-fns": "^4.1.0",
92
92
  "embla-carousel-react": "^8.6.0",
93
93
  "input-otp": "^1.4.2",
94
94
  "lucide-react": "^0.577.0",
95
- "react-day-picker": "^8.10.2",
95
+ "react-day-picker": "^10.0.1",
96
96
  "react-resizable-panels": "^2.1.9",
97
97
  "recharts": "^2.15.4",
98
98
  "sonner": "^2.0.7",
package/src/components/ui/calendar.tsx CHANGED
@@ -13,46 +13,46 @@ function Calendar({ className, classNames, showOutsideDays = true, ...props }: C
13
13
  showOutsideDays={showOutsideDays}
14
14
  className={cn('p-[12px]', className)}
15
15
  classNames={{
16
- months: 'flex flex-col sm:flex-row space-y-[16px] sm:space-x-[16px] sm:space-y-0',
17
- month: 'space-y-[16px]',
18
- caption: 'flex justify-center pt-[4px] relative items-center',
16
+ months: 'relative flex flex-col gap-[16px] sm:flex-row',
17
+ month: 'flex flex-col gap-[16px]',
18
+ month_caption: 'flex h-[28px] items-center justify-center',
19
19
  caption_label: 'text-[14px] leading-[20px] font-medium text-foreground',
20
- nav: 'space-x-[4px] flex items-center',
21
- nav_button: cn(buttonVariants({ variant: 'secondary' }), 'h-[24px] w-[24px] p-0'),
22
- nav_button_previous: 'absolute left-[4px]',
23
- nav_button_next: 'absolute right-[4px]',
24
- table: 'w-full border-collapse space-y-[4px]',
25
- head_row: 'flex',
26
- head_cell: 'w-[32px] rounded-[var(--pt-radius-md)] text-[12px] leading-[16px] font-normal text-muted-foreground',
27
- row: 'flex w-full mt-[8px]',
28
- cell: cn(
29
- 'relative p-0 text-center text-[14px] leading-[20px] focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent [&:has([aria-selected].day-range-end)]:rounded-r-[var(--pt-radius-md)]',
30
- props.mode === 'range'
31
- ? '[&:has(>.day-range-end)]:rounded-r-[var(--pt-radius-md)] [&:has(>.day-range-start)]:rounded-l-[var(--pt-radius-md)] first:[&:has([aria-selected])]:rounded-l-[var(--pt-radius-md)] last:[&:has([aria-selected])]:rounded-r-[var(--pt-radius-md)]'
32
- : '[&:has([aria-selected])]:rounded-[var(--pt-radius-md)]'
33
- ),
34
- day: cn(
20
+ nav: 'absolute inset-x-0 top-0 z-10 flex items-center justify-between',
21
+ button_previous: cn(buttonVariants({ variant: 'ghost' }), 'h-[28px] w-[28px] p-0'),
22
+ button_next: cn(buttonVariants({ variant: 'ghost' }), 'h-[28px] w-[28px] p-0'),
23
+ month_grid: 'w-full border-collapse',
24
+ weekdays: 'flex',
25
+ weekday:
26
+ 'w-[32px] rounded-[var(--pt-radius-md)] text-[12px] leading-[16px] font-normal text-muted-foreground',
27
+ week: 'mt-[8px] flex w-full',
28
+ day: 'relative p-0 text-center text-[14px] leading-[20px] focus-within:relative focus-within:z-20',
29
+ day_button: cn(
35
30
  buttonVariants({ variant: 'ghost' }),
36
31
  'h-[32px] w-[32px] p-0 font-normal aria-selected:opacity-100'
37
32
  ),
38
- day_range_start: 'day-range-start',
39
- day_range_end: 'day-range-end',
40
- day_selected:
41
- 'bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground',
42
- day_today: 'bg-accent text-accent-foreground',
43
- day_outside: 'day-outside text-muted-foreground',
44
- day_disabled: 'text-muted-foreground opacity-50',
45
- day_range_middle: 'aria-selected:bg-accent aria-selected:text-accent-foreground',
46
- day_hidden: 'invisible',
33
+ /* range 端点:黑底白字按钮;格子层同时铺 8% 底带并只圆外侧角,
34
+ 让中段底带连续延伸到端点下方不断开 */
35
+ range_start:
36
+ 'day-range-start bg-selected rounded-l-[var(--pt-radius-md)] [&>button]:bg-primary [&>button]:text-primary-foreground [&>button]:font-medium',
37
+ range_end:
38
+ 'day-range-end bg-selected rounded-r-[var(--pt-radius-md)] [&>button]:bg-primary [&>button]:text-primary-foreground [&>button]:font-medium',
39
+ /* 单选模式选中=黑底白字;range 模式交给 range_start/end/middle 三键,不在此重复设底 */
40
+ selected:
41
+ props.mode === 'range'
42
+ ? undefined
43
+ : '[&>button]:bg-primary [&>button]:text-primary-foreground [&>button]:font-medium',
44
+ today: '[&>button]:bg-selected',
45
+ outside: 'day-outside text-muted-foreground aria-selected:text-muted-foreground',
46
+ disabled: 'text-muted-foreground opacity-50',
47
+ range_middle: 'bg-selected [&>button]:bg-transparent [&>button]:font-normal',
48
+ hidden: 'invisible',
47
49
  ...classNames
48
50
  }}
49
51
  components={{
50
- IconLeft: ({ className, ...props }) => (
51
- <ChevronLeft className={cn('h-[16px] w-[16px]', className)} {...props} />
52
- ),
53
- IconRight: ({ className, ...props }) => (
54
- <ChevronRight className={cn('h-[16px] w-[16px]', className)} {...props} />
55
- )
52
+ Chevron: ({ orientation }) => {
53
+ const Icon = orientation === 'left' ? ChevronLeft : ChevronRight;
54
+ return <Icon className="h-[16px] w-[16px]" />;
55
+ }
56
56
  }}
57
57
  {...props}
58
58
  />