@timmbr/ui 1.13.1 → 1.13.2

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.
@@ -83,7 +83,7 @@ const Checkbox = React.forwardRef(
83
83
  children: label
84
84
  }
85
85
  ),
86
- description && /* @__PURE__ */ jsx("p", { className: "text-body-3 text-muted leading-normal mt-0.5", children: description })
86
+ description && /* @__PURE__ */ jsx("p", { className: "text-body-3 text-muted-foreground leading-normal mt-0.5", children: description })
87
87
  ] })
88
88
  ] }),
89
89
  errorMessage && /* @__PURE__ */ jsx("p", { className: "text-body-3 text-destructive font-medium pl-7", children: errorMessage })
@@ -45,7 +45,7 @@ const DialogContent = React.forwardRef(({ className, children, motion, ...props
45
45
  DialogPrimitive.Close,
46
46
  {
47
47
  "data-slot": "dialog-close",
48
- className: "absolute right-3 top-3 z-20 flex items-center justify-center min-w-[44px] min-h-[44px] rounded-sm text-muted hover:text-foreground opacity-70 hover:opacity-100 transition-opacity focus:outline-none focus-visible:ring-2 focus-visible:ring-primary cursor-pointer",
48
+ className: "absolute right-3 top-3 z-20 flex items-center justify-center min-w-[44px] min-h-[44px] rounded-sm text-muted-foreground hover:text-foreground opacity-70 hover:opacity-100 transition-opacity focus:outline-none focus-visible:ring-2 focus-visible:ring-primary cursor-pointer",
49
49
  children: [
50
50
  /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }),
51
51
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
@@ -53,7 +53,7 @@ const DrawerContent = React.forwardRef(({ className, children, side = "right", s
53
53
  DialogPrimitive.Close,
54
54
  {
55
55
  "data-slot": "drawer-close",
56
- className: "absolute right-3 top-3 flex items-center justify-center min-w-[44px] min-h-[44px] rounded-sm text-muted hover:text-foreground opacity-70 hover:opacity-100 transition-opacity focus:outline-none focus-visible:ring-2 focus-visible:ring-primary cursor-pointer",
56
+ className: "absolute right-3 top-3 flex items-center justify-center min-w-[44px] min-h-[44px] rounded-sm text-muted-foreground hover:text-foreground opacity-70 hover:opacity-100 transition-opacity focus:outline-none focus-visible:ring-2 focus-visible:ring-primary cursor-pointer",
57
57
  children: [
58
58
  /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }),
59
59
  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
@@ -40,7 +40,7 @@ const FormField = React.forwardRef(
40
40
  id: `${id}-desc`,
41
41
  className: cn(
42
42
  "text-body-3 mt-1 flex items-center gap-1.5",
43
- isError ? "text-destructive font-medium" : "text-muted"
43
+ isError ? "text-destructive font-medium" : "text-muted-foreground"
44
44
  ),
45
45
  children: [
46
46
  isError ? /* @__PURE__ */ jsx(AlertCircle, { className: "w-3.5 h-3.5 shrink-0", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Info, { className: "w-3.5 h-3.5 shrink-0", "aria-hidden": "true" }),
@@ -203,13 +203,13 @@ const ImageUpload = React.forwardRef(
203
203
  (label || maxFiles || minFiles) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 select-none", children: [
204
204
  label && /* @__PURE__ */ jsxs("label", { className: "text-body-3 font-semibold text-foreground tracking-wide flex items-center gap-1.5", children: [
205
205
  /* @__PURE__ */ jsx("span", { children: label }),
206
- minFiles && minFiles > 0 && /* @__PURE__ */ jsxs("span", { className: "text-caption-lg text-muted font-normal", children: [
206
+ minFiles && minFiles > 0 && /* @__PURE__ */ jsxs("span", { className: "text-caption-lg text-muted-foreground font-normal", children: [
207
207
  "(Min ",
208
208
  minFiles,
209
209
  ")"
210
210
  ] })
211
211
  ] }),
212
- multiple && /* @__PURE__ */ jsxs("span", { className: "text-caption-lg font-medium text-muted", children: [
212
+ multiple && /* @__PURE__ */ jsxs("span", { className: "text-caption-lg font-medium text-muted-foreground", children: [
213
213
  items.length,
214
214
  maxFiles ? ` / ${maxFiles}` : "",
215
215
  " uploaded"
@@ -284,7 +284,7 @@ const ImageUpload = React.forwardRef(
284
284
  onDragLeave: handleDragLeave,
285
285
  onDrop: handleDrop
286
286
  }
287
- ) : /* @__PURE__ */ jsxs("div", { className: "w-full rounded-xl border border-dashed border-grey-300 dark:border-grey-700 bg-grey-50/50 dark:bg-grey-900/30 p-3 text-center text-body-3 text-muted", children: [
287
+ ) : /* @__PURE__ */ jsxs("div", { className: "w-full rounded-xl border border-dashed border-grey-300 dark:border-grey-700 bg-grey-50/50 dark:bg-grey-900/30 p-3 text-center text-body-3 text-muted-foreground", children: [
288
288
  "Maximum upload limit reached (",
289
289
  maxFiles,
290
290
  "/",
@@ -335,7 +335,7 @@ const ImageUpload = React.forwardRef(
335
335
  {
336
336
  className: cn(
337
337
  "text-body-3 mt-1 flex items-center gap-1.5 leading-normal",
338
- isError ? "text-destructive font-medium" : minFilesWarning ? "text-warning dark:text-warning font-medium" : "text-muted"
338
+ isError ? "text-destructive font-medium" : minFilesWarning ? "text-warning dark:text-warning font-medium" : "text-muted-foreground"
339
339
  ),
340
340
  children: [
341
341
  (isError || minFilesWarning) && /* @__PURE__ */ jsx(AlertCircle, { className: "size-3.5 shrink-0", "aria-hidden": "true" }),
@@ -73,7 +73,7 @@ const ImageUploadDropzone = ({
73
73
  " ",
74
74
  "or drag & drop"
75
75
  ] }),
76
- /* @__PURE__ */ jsxs("span", { className: "text-caption-lg text-muted", children: [
76
+ /* @__PURE__ */ jsxs("span", { className: "text-caption-lg text-muted-foreground", children: [
77
77
  mediaType === "video" ? `MP4, WEBM, MOV (Max ${maxMb}MB)` : mediaType === "all" ? `Images & Videos (Max ${maxMb}MB each)` : `PNG, JPG, WEBP (Max ${maxMb}MB each)`,
78
78
  maxFiles && ` • Up to ${maxFiles} items`
79
79
  ] })
@@ -82,7 +82,7 @@ const ImageUploadDropzone = ({
82
82
  /* @__PURE__ */ jsx("div", { className: "size-8 rounded-lg bg-grey-50 dark:bg-grey-800 border border-grey-200 dark:border-grey-700 shadow-xs flex items-center justify-center text-primary", children: isDragging ? /* @__PURE__ */ jsx(UploadCloudIcon, { className: "size-4 text-primary animate-bounce" }) : /* @__PURE__ */ jsx(ImageIcon, { className: "size-4 text-primary" }) }),
83
83
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
84
84
  /* @__PURE__ */ jsx("span", { className: "text-body-3 font-semibold text-primary underline", children: "Upload" }),
85
- /* @__PURE__ */ jsxs("span", { className: "text-caption text-muted", children: [
85
+ /* @__PURE__ */ jsxs("span", { className: "text-caption text-muted-foreground", children: [
86
86
  "Max ",
87
87
  maxMb,
88
88
  "MB"
@@ -95,7 +95,7 @@ const ImageUploadDropzone = ({
95
95
  /* @__PURE__ */ jsx("span", { className: "text-primary underline font-semibold", children: "Click to upload" }),
96
96
  " or drag and drop"
97
97
  ] }),
98
- /* @__PURE__ */ jsx("span", { className: "text-caption-lg text-muted", children: mediaType === "video" ? `MP4, WEBM, MOV (Max ${maxMb}MB)` : mediaType === "all" ? `PNG, JPG, WEBP, MP4 (Max ${maxMb}MB)` : `PNG, JPG, or WEBP (Max ${maxMb}MB)` })
98
+ /* @__PURE__ */ jsx("span", { className: "text-caption-lg text-muted-foreground", children: mediaType === "video" ? `MP4, WEBM, MOV (Max ${maxMb}MB)` : mediaType === "all" ? `PNG, JPG, WEBP, MP4 (Max ${maxMb}MB)` : `PNG, JPG, or WEBP (Max ${maxMb}MB)` })
99
99
  ] })
100
100
  ] })
101
101
  }
@@ -58,7 +58,7 @@ const ImageUploadModal = ({
58
58
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
59
59
  /* @__PURE__ */ jsx("span", { className: "text-body-3 font-semibold text-foreground tracking-wide truncate max-w-xs sm:max-w-md", children: activeItem.name || `Media Item #${activeIndex + 1}` }),
60
60
  activeIndex === 0 && /* @__PURE__ */ jsx("span", { className: "bg-success/10 text-success dark:text-success border border-success/20 text-caption font-semibold px-2 py-0.5 rounded-full", children: "Cover" }),
61
- /* @__PURE__ */ jsxs("span", { className: "text-caption-lg text-muted", children: [
61
+ /* @__PURE__ */ jsxs("span", { className: "text-caption-lg text-muted-foreground", children: [
62
62
  "(",
63
63
  activeIndex + 1,
64
64
  " of ",
@@ -151,7 +151,7 @@ const Input = React.forwardRef(
151
151
  type: "button",
152
152
  tabIndex: -1,
153
153
  onClick: handleClear,
154
- className: "flex items-center justify-center ml-1.5 p-1 rounded-sm text-muted hover:text-foreground hover:bg-grey-100 dark:hover:bg-grey-800 transition-colors cursor-pointer active:scale-95",
154
+ className: "flex items-center justify-center ml-1.5 p-1 rounded-sm text-muted-foreground hover:text-foreground hover:bg-grey-100 dark:hover:bg-grey-800 transition-colors cursor-pointer active:scale-95",
155
155
  "aria-label": "Clear input",
156
156
  children: /* @__PURE__ */ jsx(X, { className: "w-3.5 h-3.5" })
157
157
  }
@@ -162,12 +162,12 @@ const Input = React.forwardRef(
162
162
  type: "button",
163
163
  tabIndex: -1,
164
164
  onClick: () => setShowPassword((prev) => !prev),
165
- className: "flex items-center justify-center ml-1.5 p-1 rounded-sm text-muted hover:text-foreground hover:bg-grey-100 dark:hover:bg-grey-800 transition-colors cursor-pointer active:scale-95",
165
+ className: "flex items-center justify-center ml-1.5 p-1 rounded-sm text-muted-foreground hover:text-foreground hover:bg-grey-100 dark:hover:bg-grey-800 transition-colors cursor-pointer active:scale-95",
166
166
  "aria-label": showPassword ? "Hide password" : "Show password",
167
167
  children: showPassword ? /* @__PURE__ */ jsx(EyeOff, { className: "w-4 h-4" }) : /* @__PURE__ */ jsx(Eye, { className: "w-4 h-4" })
168
168
  }
169
169
  ),
170
- rightAdornment && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center ml-2 text-muted shrink-0", children: rightAdornment })
170
+ rightAdornment && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center ml-2 text-muted-foreground shrink-0", children: rightAdornment })
171
171
  ]
172
172
  }
173
173
  ),
@@ -111,7 +111,7 @@ const RadioGroup = React.forwardRef(
111
111
  {
112
112
  className: cn(
113
113
  "text-body-3 mt-1 flex items-center gap-1.5",
114
- isError ? "text-destructive font-medium" : "text-muted"
114
+ isError ? "text-destructive font-medium" : "text-muted-foreground"
115
115
  ),
116
116
  children: [
117
117
  isError ? /* @__PURE__ */ jsx(AlertCircle, { className: "w-3.5 h-3.5 shrink-0", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Info, { className: "w-3.5 h-3.5 shrink-0", "aria-hidden": "true" }),
@@ -79,7 +79,7 @@ const Select = React.forwardRef(
79
79
  ),
80
80
  children: [
81
81
  /* @__PURE__ */ jsx(SelectPrimitive.Value, { placeholder }),
82
- /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 shrink-0 text-muted opacity-60 transition-transform duration-200" }) })
82
+ /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 shrink-0 text-muted-foreground opacity-60 transition-transform duration-200" }) })
83
83
  ]
84
84
  }
85
85
  ),
@@ -115,7 +115,7 @@ const Select = React.forwardRef(
115
115
  {
116
116
  className: cn(
117
117
  "text-body-3 mt-1 flex items-center gap-1.5",
118
- isError ? "text-destructive font-medium" : "text-muted"
118
+ isError ? "text-destructive font-medium" : "text-muted-foreground"
119
119
  ),
120
120
  children: [
121
121
  isError ? /* @__PURE__ */ jsx(AlertCircle, { className: "w-3.5 h-3.5 shrink-0", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Info, { className: "w-3.5 h-3.5 shrink-0", "aria-hidden": "true" }),
@@ -74,7 +74,7 @@ const Switch = React.forwardRef(
74
74
  children: label
75
75
  }
76
76
  ),
77
- description && /* @__PURE__ */ jsx("p", { className: "text-body-3 text-muted leading-normal mt-0.5", children: description })
77
+ description && /* @__PURE__ */ jsx("p", { className: "text-body-3 text-muted-foreground leading-normal mt-0.5", children: description })
78
78
  ] }),
79
79
  /* @__PURE__ */ jsx("div", { className: "shrink-0 pt-0.5", children: switchElement })
80
80
  ]
@@ -146,7 +146,7 @@ const Textarea = React.forwardRef(
146
146
  id: `${id}-desc`,
147
147
  className: cn(
148
148
  "text-body-3 mt-1 flex items-center gap-1.5 flex-1",
149
- isError ? "text-destructive font-medium" : "text-muted"
149
+ isError ? "text-destructive font-medium" : "text-muted-foreground"
150
150
  ),
151
151
  children: [
152
152
  isError ? /* @__PURE__ */ jsx(AlertCircle, { className: "w-3.5 h-3.5 shrink-0", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Info, { className: "w-3.5 h-3.5 shrink-0", "aria-hidden": "true" }),
@@ -154,7 +154,7 @@ const Textarea = React.forwardRef(
154
154
  ]
155
155
  }
156
156
  ) : /* @__PURE__ */ jsx("span", {}),
157
- showCount && maxLength && /* @__PURE__ */ jsxs("span", { className: "text-caption-lg tabular-nums text-muted shrink-0 select-none", children: [
157
+ showCount && maxLength && /* @__PURE__ */ jsxs("span", { className: "text-caption-lg tabular-nums text-muted-foreground shrink-0 select-none", children: [
158
158
  currentValue.length,
159
159
  "/",
160
160
  maxLength
@@ -90,7 +90,7 @@ const ToastClose = React.forwardRef(({ className, ...props }, ref) => /* @__PURE
90
90
  ref,
91
91
  "data-slot": "toast-close",
92
92
  className: cn(
93
- "absolute right-1 top-1 flex items-center justify-center min-w-[44px] min-h-[44px] rounded-sm text-muted hover:text-foreground opacity-70 hover:opacity-100 transition-opacity focus:outline-none focus-visible:ring-2 focus-visible:ring-ring cursor-pointer",
93
+ "absolute right-1 top-1 flex items-center justify-center min-w-[44px] min-h-[44px] rounded-sm text-muted-foreground hover:text-foreground opacity-70 hover:opacity-100 transition-opacity focus:outline-none focus-visible:ring-2 focus-visible:ring-ring cursor-pointer",
94
94
  className
95
95
  ),
96
96
  "toast-close": "",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@timmbr/ui",
3
- "version": "1.13.1",
3
+ "version": "1.13.2",
4
4
  "description": "High-performance, Next.js App Router-compatible UI design system components for Timmbr",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -43,9 +43,9 @@
43
43
  "class-variance-authority": "^0.7.1",
44
44
  "input-otp": "^1.5.0",
45
45
  "@timmbr/hooks": "1.2.0",
46
- "@timmbr/theme": "1.3.0",
47
- "@timmbr/motion": "1.2.5",
48
46
  "@timmbr/icons": "1.6.0",
47
+ "@timmbr/motion": "1.2.5",
48
+ "@timmbr/theme": "1.3.0",
49
49
  "@timmbr/utils": "1.6.0"
50
50
  },
51
51
  "peerDependencies": {