@hilum/ui 3.2.8 → 3.2.10

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hilum/ui",
3
- "version": "3.2.8",
3
+ "version": "3.2.10",
4
4
  "private": false,
5
5
  "description": "Hilum UI — design system primitives (Button, Input, Dialog, Combobox, …) + tokens + fonts + icons",
6
6
  "license": "MIT",
@@ -19,20 +19,20 @@ function Calendar({ className, classNames, showOutsideDays = true, ...props }: C
19
19
  caption_label: "body font-semibold text-foreground",
20
20
  nav: "flex items-center justify-between absolute inset-x-0 top-1",
21
21
  button_previous: cn(
22
- "absolute left-0 flex size-10 items-center justify-center rounded-md",
22
+ "absolute left-0 flex h-9 w-9 items-center justify-center rounded-md",
23
23
  "text-muted-foreground hover:bg-muted hover:text-muted-foreground transition-colors",
24
24
  ),
25
25
  button_next: cn(
26
- "absolute right-0 flex size-10 items-center justify-center rounded-md",
26
+ "absolute right-0 flex h-9 w-9 items-center justify-center rounded-md",
27
27
  "text-muted-foreground hover:bg-muted hover:text-muted-foreground transition-colors",
28
28
  ),
29
29
  month_grid: "w-full border-collapse mt-1",
30
30
  weekdays: "flex",
31
- weekday: "flex size-10 items-center justify-center label text-muted-foreground font-normal",
31
+ weekday: "flex h-9 w-9 items-center justify-center label text-muted-foreground font-normal",
32
32
  week: "flex w-full mt-1",
33
33
  day: "relative p-0 text-center",
34
34
  day_button: cn(
35
- "flex size-10 items-center justify-center rounded-full body font-normal",
35
+ "flex h-9 w-9 items-center justify-center rounded-full body font-normal",
36
36
  "text-foreground hover:bg-muted transition-colors",
37
37
  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-primary/30",
38
38
  ),
@@ -167,7 +167,7 @@ function CarouselPrevious({
167
167
  variant={variant}
168
168
  size={size}
169
169
  className={cn(
170
- "absolute size-10 rounded-full",
170
+ "absolute h-9 w-9 rounded-full",
171
171
  orientation === "vertical"
172
172
  ? "-top-12 left-1/2 -translate-x-1/2 rotate-90"
173
173
  : "-left-12 top-1/2 -translate-y-1/2",
@@ -196,7 +196,7 @@ function CarouselNext({
196
196
  variant={variant}
197
197
  size={size}
198
198
  className={cn(
199
- "absolute size-10 rounded-full",
199
+ "absolute h-9 w-9 rounded-full",
200
200
  orientation === "vertical"
201
201
  ? "-bottom-12 left-1/2 -translate-x-1/2 rotate-90"
202
202
  : "-right-12 top-1/2 -translate-y-1/2",
@@ -45,7 +45,7 @@ function ColorPicker({
45
45
  disabled={disabled}
46
46
  aria-label={ariaLabel}
47
47
  className={cn(
48
- "inline-flex size-10 items-center justify-center rounded-md border border-border bg-card",
48
+ "inline-flex size-9 items-center justify-center rounded-md border border-border bg-card",
49
49
  "transition-colors hover:border-border",
50
50
  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-primary/20 focus-visible:border-brand-primary",
51
51
  "disabled:cursor-not-allowed disabled:opacity-50",
@@ -54,7 +54,7 @@ function ColorPicker({
54
54
  >
55
55
  <span
56
56
  aria-hidden
57
- className="h-5 w-5 rounded-sm border border-black/5"
57
+ className="size-4 rounded-sm border border-black/5"
58
58
  style={{ backgroundColor: value }}
59
59
  />
60
60
  </button>
@@ -67,7 +67,7 @@ function ColorPicker({
67
67
  setHex(e.target.value);
68
68
  onChange(e.target.value);
69
69
  }}
70
- className="h-10 w-full cursor-pointer rounded-md border border-border bg-card p-0.5"
70
+ className="h-9 w-full cursor-pointer rounded-md border border-border bg-card p-0.5"
71
71
  />
72
72
  <div className="mt-2 flex items-center gap-2">
73
73
  <span className="caption text-muted-foreground">Hex</span>
@@ -79,7 +79,7 @@ function ColorPicker({
79
79
  onKeyDown={(e) => {
80
80
  if (e.key === "Enter") commit((e.target as HTMLInputElement).value);
81
81
  }}
82
- className="h-10 flex-1 rounded-md border border-border bg-card px-2 caption text-foreground focus:outline-none focus:border-brand-primary"
82
+ className="h-9 flex-1 rounded-md border border-border bg-card px-2 caption text-foreground focus:outline-none focus:border-brand-primary"
83
83
  />
84
84
  </div>
85
85
  {presets && presets.length > 0 && (
@@ -90,7 +90,7 @@ function ColorPicker({
90
90
  type="button"
91
91
  onClick={() => onChange(p)}
92
92
  aria-label={p}
93
- className="size-10 rounded-md border border-black/10 transition-transform hover:scale-105 active:scale-[0.96] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-primary/30"
93
+ className="size-9 rounded-md border border-black/10 transition-transform hover:scale-105 active:scale-[0.96] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-primary/30"
94
94
  style={{ backgroundColor: p }}
95
95
  />
96
96
  ))}
@@ -29,7 +29,7 @@ function CirclesSteps({ steps, className }: { steps: Step[]; className?: string
29
29
  <li key={step.id ?? i} className={cn("relative", !isLast && "flex-1")}>
30
30
  {/* Connector line */}
31
31
  {!isLast && (
32
- <div className="absolute left-10 right-0 top-5 h-0.5" aria-hidden="true">
32
+ <div className="absolute left-9 right-0 top-[18px] h-0.5" aria-hidden="true">
33
33
  <div
34
34
  className={cn(
35
35
  "h-full",
@@ -47,7 +47,7 @@ function CirclesSteps({ steps, className }: { steps: Step[]; className?: string
47
47
  {/* Circle */}
48
48
  <span
49
49
  className={cn(
50
- "relative z-10 flex size-10 items-center justify-center rounded-full transition-colors",
50
+ "relative z-10 flex h-9 w-9 items-center justify-center rounded-full transition-colors",
51
51
  step.status === "complete" &&
52
52
  "bg-brand-primary group-hover:bg-brand-primary/80",
53
53
  step.status === "current" && "border-2 border-brand-primary bg-card",
@@ -104,7 +104,7 @@ function BulletsSteps({ steps, className }: { steps: Step[]; className?: string
104
104
  <a
105
105
  href={step.href ?? "#"}
106
106
  onClick={!step.href ? (e) => e.preventDefault() : undefined}
107
- className="relative flex size-10 items-center justify-center"
107
+ className="relative flex h-9 w-9 items-center justify-center"
108
108
  >
109
109
  {step.status === "complete" ? (
110
110
  <span