nextworks 0.2.0-alpha.2 → 0.2.0-alpha.20
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/README.md +280 -228
- package/dist/cli_manifests/blocks_manifest.json +193 -194
- package/dist/commands/blocks.d.ts +3 -0
- package/dist/commands/blocks.d.ts.map +1 -1
- package/dist/commands/blocks.js +128 -19
- package/dist/commands/blocks.js.map +1 -1
- package/dist/commands/doctor.d.ts +136 -0
- package/dist/commands/doctor.d.ts.map +1 -0
- package/dist/commands/doctor.js +696 -0
- package/dist/commands/doctor.js.map +1 -0
- package/dist/commands/remove-blocks.d.ts +4 -1
- package/dist/commands/remove-blocks.d.ts.map +1 -1
- package/dist/commands/remove-blocks.js +24 -6
- package/dist/commands/remove-blocks.js.map +1 -1
- package/dist/index.js +125 -4
- package/dist/index.js.map +1 -1
- package/dist/kits/blocks/.nextworks/docs/BLOCKS_QUICKSTART.md +104 -194
- package/dist/kits/blocks/.nextworks/docs/BLOCKS_README.md +115 -75
- package/dist/kits/blocks/.nextworks/docs/THEME_GUIDE.md +269 -251
- package/dist/kits/blocks/app/templates/digitalagency/PresetThemeVars.tsx +80 -80
- package/dist/kits/blocks/app/templates/digitalagency/README.md +42 -36
- package/dist/kits/blocks/app/templates/digitalagency/components/About.tsx +71 -99
- package/dist/kits/blocks/app/templates/digitalagency/components/CTA.tsx +40 -74
- package/dist/kits/blocks/app/templates/digitalagency/components/Contact.tsx +123 -227
- package/dist/kits/blocks/app/templates/digitalagency/components/Footer.tsx +89 -89
- package/dist/kits/blocks/app/templates/digitalagency/components/Hero.tsx +83 -90
- package/dist/kits/blocks/app/templates/digitalagency/components/Navbar.tsx +121 -168
- package/dist/kits/blocks/app/templates/digitalagency/components/NetworkPattern.tsx +288 -297
- package/dist/kits/blocks/app/templates/digitalagency/components/Portfolio.tsx +157 -157
- package/dist/kits/blocks/app/templates/digitalagency/components/Pricing.tsx +114 -114
- package/dist/kits/blocks/app/templates/digitalagency/components/Process.tsx +59 -59
- package/dist/kits/blocks/app/templates/digitalagency/components/Services.tsx +55 -55
- package/dist/kits/blocks/app/templates/digitalagency/components/Team.tsx +28 -28
- package/dist/kits/blocks/app/templates/digitalagency/components/Testimonials.tsx +65 -65
- package/dist/kits/blocks/app/templates/digitalagency/page.tsx +38 -38
- package/dist/kits/blocks/app/templates/gallery/PresetThemeVars.tsx +130 -85
- package/dist/kits/blocks/app/templates/gallery/page.tsx +357 -303
- package/dist/kits/blocks/app/templates/productlaunch/PresetThemeVars.tsx +75 -74
- package/dist/kits/blocks/app/templates/productlaunch/README.md +62 -55
- package/dist/kits/blocks/app/templates/productlaunch/components/About.tsx +84 -178
- package/dist/kits/blocks/app/templates/productlaunch/components/CTA.tsx +50 -93
- package/dist/kits/blocks/app/templates/productlaunch/components/Contact.tsx +231 -231
- package/dist/kits/blocks/app/templates/productlaunch/components/FAQ.tsx +86 -93
- package/dist/kits/blocks/app/templates/productlaunch/components/Features.tsx +83 -84
- package/dist/kits/blocks/app/templates/productlaunch/components/Footer.tsx +132 -132
- package/dist/kits/blocks/app/templates/productlaunch/components/Hero.tsx +88 -89
- package/dist/kits/blocks/app/templates/productlaunch/components/Navbar.tsx +116 -162
- package/dist/kits/blocks/app/templates/productlaunch/components/Pricing.tsx +106 -106
- package/dist/kits/blocks/app/templates/productlaunch/components/ProcessTimeline.tsx +110 -110
- package/dist/kits/blocks/app/templates/productlaunch/components/ServicesGrid.tsx +68 -68
- package/dist/kits/blocks/app/templates/productlaunch/components/Team.tsx +104 -104
- package/dist/kits/blocks/app/templates/productlaunch/components/Testimonials.tsx +90 -89
- package/dist/kits/blocks/app/templates/productlaunch/components/TrustBadges.tsx +76 -76
- package/dist/kits/blocks/app/templates/productlaunch/page.tsx +43 -43
- package/dist/kits/blocks/app/templates/saasdashboard/PresetThemeVars.tsx +80 -80
- package/dist/kits/blocks/app/templates/saasdashboard/README.md +44 -38
- package/dist/kits/blocks/app/templates/saasdashboard/components/Contact.tsx +129 -176
- package/dist/kits/blocks/app/templates/saasdashboard/components/Dashboard.tsx +293 -293
- package/dist/kits/blocks/app/templates/saasdashboard/components/FAQ.tsx +55 -55
- package/dist/kits/blocks/app/templates/saasdashboard/components/Features.tsx +90 -91
- package/dist/kits/blocks/app/templates/saasdashboard/components/Footer.tsx +77 -77
- package/dist/kits/blocks/app/templates/saasdashboard/components/Hero.tsx +104 -105
- package/dist/kits/blocks/app/templates/saasdashboard/components/Hero_mask.tsx +126 -127
- package/dist/kits/blocks/app/templates/saasdashboard/components/Navbar.tsx +117 -159
- package/dist/kits/blocks/app/templates/saasdashboard/components/Pricing.tsx +90 -90
- package/dist/kits/blocks/app/templates/saasdashboard/components/SmoothScroll.tsx +96 -97
- package/dist/kits/blocks/app/templates/saasdashboard/components/Testimonials.tsx +72 -72
- package/dist/kits/blocks/app/templates/saasdashboard/components/TrustBadges.tsx +53 -53
- package/dist/kits/blocks/app/templates/saasdashboard/page.tsx +39 -39
- package/dist/kits/blocks/components/enhanced-theme-provider.tsx +195 -183
- package/dist/kits/blocks/components/providers/BlocksAppProviders.tsx +27 -27
- package/dist/kits/blocks/components/sections/About.tsx +291 -291
- package/dist/kits/blocks/components/sections/CTA.tsx +257 -258
- package/dist/kits/blocks/components/sections/CommandShowcase.tsx +517 -0
- package/dist/kits/blocks/components/sections/Contact.tsx +267 -267
- package/dist/kits/blocks/components/sections/FAQ.tsx +214 -225
- package/dist/kits/blocks/components/sections/FeaturedProjectShowcase.tsx +687 -0
- package/dist/kits/blocks/components/sections/Features.tsx +268 -270
- package/dist/kits/blocks/components/sections/Footer.tsx +302 -302
- package/dist/kits/blocks/components/sections/HeroMotion.tsx +308 -308
- package/dist/kits/blocks/components/sections/HeroOverlay.tsx +358 -358
- package/dist/kits/blocks/components/sections/HeroProductDemo.tsx +246 -0
- package/dist/kits/blocks/components/sections/HeroSplit.tsx +352 -352
- package/dist/kits/blocks/components/sections/HeroWithVideo.tsx +495 -0
- package/dist/kits/blocks/components/sections/Navbar.tsx +352 -353
- package/dist/kits/blocks/components/sections/PortfolioSimple.tsx +549 -550
- package/dist/kits/blocks/components/sections/Pricing.tsx +264 -264
- package/dist/kits/blocks/components/sections/ProcessTimeline.tsx +325 -325
- package/dist/kits/blocks/components/sections/ProjectDeepDive.tsx +805 -0
- package/dist/kits/blocks/components/sections/SelectedWorkRail.tsx +485 -0
- package/dist/kits/blocks/components/sections/ServicesGrid.tsx +210 -210
- package/dist/kits/blocks/components/sections/Team.tsx +309 -309
- package/dist/kits/blocks/components/sections/Testimonials.tsx +158 -158
- package/dist/kits/blocks/components/sections/TrustBadges.tsx +162 -162
- package/dist/kits/blocks/components/sections/product-demo/ApprovalInboxPanel.tsx +128 -0
- package/dist/kits/blocks/components/sections/product-demo/DemoStage.tsx +519 -0
- package/dist/kits/blocks/components/sections/product-demo/DemoWindow.tsx +140 -0
- package/dist/kits/blocks/components/sections/product-demo/KnowledgePanel.tsx +130 -0
- package/dist/kits/blocks/components/sections/product-demo/RunConsolePanel.tsx +430 -0
- package/dist/kits/blocks/components/sections/product-demo/TaskListPanel.tsx +302 -0
- package/dist/kits/blocks/components/sections/product-demo/WorkflowStudioPanel.tsx +744 -0
- package/dist/kits/blocks/components/sections/product-demo/types.ts +262 -0
- package/dist/kits/blocks/components/theme-provider.tsx +1 -34
- package/dist/kits/blocks/components/ui/alert-dialog.tsx +134 -134
- package/dist/kits/blocks/components/ui/brand-node.tsx +121 -121
- package/dist/kits/blocks/components/ui/button.tsx +122 -122
- package/dist/kits/blocks/components/ui/card.tsx +95 -95
- package/dist/kits/blocks/components/ui/checkbox.tsx +30 -30
- package/dist/kits/blocks/components/ui/cta-button.tsx +125 -125
- package/dist/kits/blocks/components/ui/dropdown-menu.tsx +201 -201
- package/dist/kits/blocks/components/ui/feature-card.tsx +91 -91
- package/dist/kits/blocks/components/ui/input.tsx +27 -27
- package/dist/kits/blocks/components/ui/label.tsx +29 -29
- package/dist/kits/blocks/components/ui/pricing-card.tsx +120 -120
- package/dist/kits/blocks/components/ui/select.tsx +25 -25
- package/dist/kits/blocks/components/ui/skeleton.tsx +13 -13
- package/dist/kits/blocks/components/ui/table.tsx +98 -98
- package/dist/kits/blocks/components/ui/testimonial-card.tsx +108 -108
- package/dist/kits/blocks/components/ui/textarea.tsx +26 -26
- package/dist/kits/blocks/components/ui/theme-selector.tsx +243 -247
- package/dist/kits/blocks/components/ui/theme-toggle.tsx +74 -74
- package/dist/kits/blocks/components/ui/toaster.tsx +7 -7
- package/dist/kits/blocks/lib/themes.ts +400 -400
- package/dist/kits/blocks/lib/utils.ts +6 -9
- package/dist/kits/blocks/package-deps.json +40 -28
- package/dist/kits/blocks/tsconfig.json +11 -0
- package/dist/kits/blocks/tsconfig.tsbuildinfo +1 -0
- package/dist/utils/file-operations.d.ts +3 -1
- package/dist/utils/file-operations.d.ts.map +1 -1
- package/dist/utils/file-operations.js +84 -12
- package/dist/utils/file-operations.js.map +1 -1
- package/dist/utils/installation-tracker.d.ts +2 -2
- package/dist/utils/installation-tracker.d.ts.map +1 -1
- package/dist/utils/installation-tracker.js +11 -11
- package/dist/utils/installation-tracker.js.map +1 -1
- package/dist/utils/package-manager.d.ts +6 -0
- package/dist/utils/package-manager.d.ts.map +1 -0
- package/dist/utils/package-manager.js +58 -0
- package/dist/utils/package-manager.js.map +1 -0
- package/dist/utils/yarn-pnp.d.ts +6 -0
- package/dist/utils/yarn-pnp.d.ts.map +1 -0
- package/dist/utils/yarn-pnp.js +39 -0
- package/dist/utils/yarn-pnp.js.map +1 -0
- package/package.json +5 -2
- package/dist/kits/blocks/notes/THEME_GUIDE.md +0 -29
|
@@ -1,108 +1,108 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
import React from "react";
|
|
4
|
-
import { cn } from "@/lib/utils";
|
|
5
|
-
|
|
6
|
-
export interface TestimonialCardProps {
|
|
7
|
-
/** Optional id for root card */
|
|
8
|
-
id?: string;
|
|
9
|
-
/** Optional root className merged with card.className */
|
|
10
|
-
className?: string;
|
|
11
|
-
|
|
12
|
-
/** Legacy props (kept for backward compatibility) */
|
|
13
|
-
testimonialText?: string;
|
|
14
|
-
testimonialAuthor?: string;
|
|
15
|
-
testimonialAuthorInitials?: string;
|
|
16
|
-
|
|
17
|
-
/** New props to align with upgraded sections */
|
|
18
|
-
quote?: string;
|
|
19
|
-
name?: string;
|
|
20
|
-
role?: string;
|
|
21
|
-
|
|
22
|
-
/** Styling configuration objects */
|
|
23
|
-
card?: {
|
|
24
|
-
className?: string;
|
|
25
|
-
};
|
|
26
|
-
content?: {
|
|
27
|
-
className?: string;
|
|
28
|
-
};
|
|
29
|
-
text?: {
|
|
30
|
-
className?: string;
|
|
31
|
-
};
|
|
32
|
-
author?: {
|
|
33
|
-
className?: string;
|
|
34
|
-
};
|
|
35
|
-
avatar?: {
|
|
36
|
-
className?: string;
|
|
37
|
-
};
|
|
38
|
-
avatarText?: {
|
|
39
|
-
className?: string;
|
|
40
|
-
};
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
function getInitials(from?: string) {
|
|
44
|
-
if (!from) return undefined;
|
|
45
|
-
const parts = from.trim().split(/\s+/);
|
|
46
|
-
const first = parts[0]?.[0] || "";
|
|
47
|
-
const last = parts.length > 1 ? parts[parts.length - 1]?.[0] || "" : "";
|
|
48
|
-
const res = `${first}${last}`.toUpperCase();
|
|
49
|
-
return res || undefined;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
export function TestimonialCard({
|
|
53
|
-
id,
|
|
54
|
-
className,
|
|
55
|
-
// legacy defaults
|
|
56
|
-
testimonialText = "Lorem ipsum dolor sit amet! Consectetur adipiscing elit.",
|
|
57
|
-
testimonialAuthor = " - Cillum Dolore",
|
|
58
|
-
testimonialAuthorInitials = "JD",
|
|
59
|
-
// new props (no defaults, we derive below)
|
|
60
|
-
quote,
|
|
61
|
-
name,
|
|
62
|
-
role,
|
|
63
|
-
card = {
|
|
64
|
-
className:
|
|
65
|
-
"bg-card text-card-foreground p-6 rounded-lg border border-border shadow-md transition-transform duration-200 hover:-translate-y-1 bg-[var(--card-bg)] text-[var(--card-fg)] border-[var(--card-border)] shadow-[var(--card-shadow)]",
|
|
66
|
-
},
|
|
67
|
-
content = {
|
|
68
|
-
className: "flex flex-col space-y-4",
|
|
69
|
-
},
|
|
70
|
-
text = {
|
|
71
|
-
className:
|
|
72
|
-
"text-muted-foreground text-base leading-relaxed italic text-[var(--card-fg)]",
|
|
73
|
-
},
|
|
74
|
-
author = {
|
|
75
|
-
className:
|
|
76
|
-
"text-muted-foreground text-sm font-medium text-[var(--card-muted-fg)]",
|
|
77
|
-
},
|
|
78
|
-
avatar = {
|
|
79
|
-
className:
|
|
80
|
-
"w-12 h-12 bg-primary text-primary-foreground rounded-full flex items-center justify-center text-lg font-bold bg-[var(--badge-bg)] text-[var(--badge-fg)] border-[var(--badge-border)]",
|
|
81
|
-
},
|
|
82
|
-
avatarText = {
|
|
83
|
-
className: "text-white font-bold",
|
|
84
|
-
},
|
|
85
|
-
}: TestimonialCardProps) {
|
|
86
|
-
const displayText = quote ?? testimonialText;
|
|
87
|
-
const computedAuthor =
|
|
88
|
-
testimonialAuthor ??
|
|
89
|
-
(name ? ` - ${name}${role ? `, ${role}` : ""}` : " - Cillum Dolore");
|
|
90
|
-
const initials = testimonialAuthorInitials ?? getInitials(name) ?? "JD";
|
|
91
|
-
|
|
92
|
-
return (
|
|
93
|
-
<div id={id} className={cn(card.className, className)}>
|
|
94
|
-
<div className={content.className}>
|
|
95
|
-
{/* Avatar */}
|
|
96
|
-
<div className={avatar.className}>
|
|
97
|
-
<span className={avatarText.className}>{initials}</span>
|
|
98
|
-
</div>
|
|
99
|
-
|
|
100
|
-
{/* Testimonial Text */}
|
|
101
|
-
<p className={text.className}>“{displayText}”</p>
|
|
102
|
-
|
|
103
|
-
{/* Author */}
|
|
104
|
-
<p className={author.className}>{computedAuthor}</p>
|
|
105
|
-
</div>
|
|
106
|
-
</div>
|
|
107
|
-
);
|
|
108
|
-
}
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { cn } from "@/lib/utils";
|
|
5
|
+
|
|
6
|
+
export interface TestimonialCardProps {
|
|
7
|
+
/** Optional id for root card */
|
|
8
|
+
id?: string;
|
|
9
|
+
/** Optional root className merged with card.className */
|
|
10
|
+
className?: string;
|
|
11
|
+
|
|
12
|
+
/** Legacy props (kept for backward compatibility) */
|
|
13
|
+
testimonialText?: string;
|
|
14
|
+
testimonialAuthor?: string;
|
|
15
|
+
testimonialAuthorInitials?: string;
|
|
16
|
+
|
|
17
|
+
/** New props to align with upgraded sections */
|
|
18
|
+
quote?: string;
|
|
19
|
+
name?: string;
|
|
20
|
+
role?: string;
|
|
21
|
+
|
|
22
|
+
/** Styling configuration objects */
|
|
23
|
+
card?: {
|
|
24
|
+
className?: string;
|
|
25
|
+
};
|
|
26
|
+
content?: {
|
|
27
|
+
className?: string;
|
|
28
|
+
};
|
|
29
|
+
text?: {
|
|
30
|
+
className?: string;
|
|
31
|
+
};
|
|
32
|
+
author?: {
|
|
33
|
+
className?: string;
|
|
34
|
+
};
|
|
35
|
+
avatar?: {
|
|
36
|
+
className?: string;
|
|
37
|
+
};
|
|
38
|
+
avatarText?: {
|
|
39
|
+
className?: string;
|
|
40
|
+
};
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
function getInitials(from?: string) {
|
|
44
|
+
if (!from) return undefined;
|
|
45
|
+
const parts = from.trim().split(/\s+/);
|
|
46
|
+
const first = parts[0]?.[0] || "";
|
|
47
|
+
const last = parts.length > 1 ? parts[parts.length - 1]?.[0] || "" : "";
|
|
48
|
+
const res = `${first}${last}`.toUpperCase();
|
|
49
|
+
return res || undefined;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
export function TestimonialCard({
|
|
53
|
+
id,
|
|
54
|
+
className,
|
|
55
|
+
// legacy defaults
|
|
56
|
+
testimonialText = "Lorem ipsum dolor sit amet! Consectetur adipiscing elit.",
|
|
57
|
+
testimonialAuthor = " - Cillum Dolore",
|
|
58
|
+
testimonialAuthorInitials = "JD",
|
|
59
|
+
// new props (no defaults, we derive below)
|
|
60
|
+
quote,
|
|
61
|
+
name,
|
|
62
|
+
role,
|
|
63
|
+
card = {
|
|
64
|
+
className:
|
|
65
|
+
"bg-card text-card-foreground p-6 rounded-lg border border-border shadow-md transition-transform duration-200 hover:-translate-y-1 bg-[var(--card-bg)] text-[var(--card-fg)] border-[var(--card-border)] shadow-[var(--card-shadow)]",
|
|
66
|
+
},
|
|
67
|
+
content = {
|
|
68
|
+
className: "flex flex-col space-y-4",
|
|
69
|
+
},
|
|
70
|
+
text = {
|
|
71
|
+
className:
|
|
72
|
+
"text-muted-foreground text-base leading-relaxed italic text-[var(--card-fg)]",
|
|
73
|
+
},
|
|
74
|
+
author = {
|
|
75
|
+
className:
|
|
76
|
+
"text-muted-foreground text-sm font-medium text-[var(--card-muted-fg)]",
|
|
77
|
+
},
|
|
78
|
+
avatar = {
|
|
79
|
+
className:
|
|
80
|
+
"w-12 h-12 bg-primary text-primary-foreground rounded-full flex items-center justify-center text-lg font-bold bg-[var(--badge-bg)] text-[var(--badge-fg)] border-[var(--badge-border)]",
|
|
81
|
+
},
|
|
82
|
+
avatarText = {
|
|
83
|
+
className: "text-white font-bold",
|
|
84
|
+
},
|
|
85
|
+
}: TestimonialCardProps) {
|
|
86
|
+
const displayText = quote ?? testimonialText;
|
|
87
|
+
const computedAuthor =
|
|
88
|
+
testimonialAuthor ??
|
|
89
|
+
(name ? ` - ${name}${role ? `, ${role}` : ""}` : " - Cillum Dolore");
|
|
90
|
+
const initials = testimonialAuthorInitials ?? getInitials(name) ?? "JD";
|
|
91
|
+
|
|
92
|
+
return (
|
|
93
|
+
<div id={id} className={cn(card.className, className)}>
|
|
94
|
+
<div className={content.className}>
|
|
95
|
+
{/* Avatar */}
|
|
96
|
+
<div className={avatar.className}>
|
|
97
|
+
<span className={avatarText.className}>{initials}</span>
|
|
98
|
+
</div>
|
|
99
|
+
|
|
100
|
+
{/* Testimonial Text */}
|
|
101
|
+
<p className={text.className}>“{displayText}”</p>
|
|
102
|
+
|
|
103
|
+
{/* Author */}
|
|
104
|
+
<p className={author.className}>{computedAuthor}</p>
|
|
105
|
+
</div>
|
|
106
|
+
</div>
|
|
107
|
+
);
|
|
108
|
+
}
|
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
|
|
3
|
-
import { cn } from "@/lib/utils";
|
|
4
|
-
|
|
5
|
-
export type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
|
|
6
|
-
|
|
7
|
-
const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
|
|
8
|
-
({ className, ...props }, ref) => {
|
|
9
|
-
return (
|
|
10
|
-
<textarea
|
|
11
|
-
className={cn(
|
|
12
|
-
// Base structural + token fallbacks
|
|
13
|
-
"border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive/30 dark:aria-invalid:focus-visible:ring-destructive/40 flex min-h-[80px] w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
|
|
14
|
-
// CSS variable hooks (preset-first). When vars are unset, tokens above apply.
|
|
15
|
-
"border-[var(--input-border)] bg-[var(--input-bg)] text-[var(--input-fg)] placeholder:text-[var(--input-placeholder)] focus-visible:ring-[var(--input-focus-ring)] focus-visible:ring-offset-[var(--input-ring-offset)]",
|
|
16
|
-
className,
|
|
17
|
-
)}
|
|
18
|
-
ref={ref}
|
|
19
|
-
{...props}
|
|
20
|
-
/>
|
|
21
|
-
);
|
|
22
|
-
},
|
|
23
|
-
);
|
|
24
|
-
Textarea.displayName = "Textarea";
|
|
25
|
-
|
|
26
|
-
export { Textarea };
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
|
|
3
|
+
import { cn } from "@/lib/utils";
|
|
4
|
+
|
|
5
|
+
export type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
|
|
6
|
+
|
|
7
|
+
const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
|
|
8
|
+
({ className, ...props }, ref) => {
|
|
9
|
+
return (
|
|
10
|
+
<textarea
|
|
11
|
+
className={cn(
|
|
12
|
+
// Base structural + token fallbacks
|
|
13
|
+
"border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring aria-invalid:border-destructive aria-invalid:focus-visible:ring-destructive/30 dark:aria-invalid:focus-visible:ring-destructive/40 flex min-h-[80px] w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
|
|
14
|
+
// CSS variable hooks (preset-first). When vars are unset, tokens above apply.
|
|
15
|
+
"border-[var(--input-border)] bg-[var(--input-bg)] text-[var(--input-fg)] placeholder:text-[var(--input-placeholder)] focus-visible:ring-[var(--input-focus-ring)] focus-visible:ring-offset-[var(--input-ring-offset)]",
|
|
16
|
+
className,
|
|
17
|
+
)}
|
|
18
|
+
ref={ref}
|
|
19
|
+
{...props}
|
|
20
|
+
/>
|
|
21
|
+
);
|
|
22
|
+
},
|
|
23
|
+
);
|
|
24
|
+
Textarea.displayName = "Textarea";
|
|
25
|
+
|
|
26
|
+
export { Textarea };
|