@nextworks/blocks-sections 0.1.0-alpha.11 → 0.1.0-alpha.14
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/dist-types/components/About.d.ts +93 -0
- package/dist-types/components/About.d.ts.map +1 -0
- package/dist-types/components/CTA.d.ts +118 -0
- package/dist-types/components/CTA.d.ts.map +1 -0
- package/dist-types/components/Contact.d.ts +111 -0
- package/dist-types/components/Contact.d.ts.map +1 -0
- package/dist-types/components/FAQ.d.ts +89 -0
- package/dist-types/components/FAQ.d.ts.map +1 -0
- package/dist-types/components/Features.d.ts +111 -0
- package/dist-types/components/Features.d.ts.map +1 -0
- package/dist-types/components/Footer.d.ts +120 -0
- package/dist-types/components/Footer.d.ts.map +1 -0
- package/dist-types/components/HeroMotion.d.ts +107 -0
- package/dist-types/components/HeroMotion.d.ts.map +1 -0
- package/dist-types/components/HeroOverlay.d.ts +116 -0
- package/dist-types/components/HeroOverlay.d.ts.map +1 -0
- package/dist-types/components/HeroSplit.d.ts +98 -0
- package/dist-types/components/HeroSplit.d.ts.map +1 -0
- package/dist-types/components/Navbar.d.ts +112 -0
- package/dist-types/components/Navbar.d.ts.map +1 -0
- package/dist-types/components/Newsletter.d.ts +59 -0
- package/dist-types/components/Newsletter.d.ts.map +1 -0
- package/dist-types/components/PortfolioSimple.d.ts +137 -0
- package/dist-types/components/PortfolioSimple.d.ts.map +1 -0
- package/dist-types/components/Pricing.d.ts +96 -0
- package/dist-types/components/Pricing.d.ts.map +1 -0
- package/dist-types/components/ProcessTimeline.d.ts +121 -0
- package/dist-types/components/ProcessTimeline.d.ts.map +1 -0
- package/dist-types/components/ServicesGrid.d.ts +64 -0
- package/dist-types/components/ServicesGrid.d.ts.map +1 -0
- package/dist-types/components/Team.d.ts +115 -0
- package/dist-types/components/Team.d.ts.map +1 -0
- package/dist-types/components/Testimonials.d.ts +81 -0
- package/dist-types/components/Testimonials.d.ts.map +1 -0
- package/dist-types/components/TrustBadges.d.ts +80 -0
- package/dist-types/components/TrustBadges.d.ts.map +1 -0
- package/dist-types/components/index.d.ts +21 -0
- package/dist-types/components/index.d.ts.map +1 -0
- package/dist-types/index.d.ts +2 -0
- package/dist-types/index.d.ts.map +1 -0
- package/package.json +6 -4
- package/dist/components/About.js +0 -129
- package/dist/components/CTA.js +0 -58
- package/dist/components/Contact.js +0 -82
- package/dist/components/FAQ.js +0 -78
- package/dist/components/Features.js +0 -109
- package/dist/components/Footer.js +0 -101
- package/dist/components/HeroMotion.js +0 -55
- package/dist/components/HeroOverlay.js +0 -111
- package/dist/components/HeroSplit.js +0 -100
- package/dist/components/Navbar.js +0 -80
- package/dist/components/Newsletter.js +0 -34
- package/dist/components/PortfolioSimple.js +0 -180
- package/dist/components/Pricing.js +0 -91
- package/dist/components/ProcessTimeline.js +0 -88
- package/dist/components/ServicesGrid.js +0 -72
- package/dist/components/Team.js +0 -107
- package/dist/components/Testimonials.js +0 -46
- package/dist/components/TrustBadges.js +0 -46
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { Transition } from "motion";
|
|
3
|
+
/**
|
|
4
|
+
* Props for the HeroMotion component.
|
|
5
|
+
*
|
|
6
|
+
* @remarks
|
|
7
|
+
* - Styling: exposes slot-style className overrides merged via cn().
|
|
8
|
+
* - Motion: controlled by enableMotion and motionOptions; respects
|
|
9
|
+
* prefers-reduced-motion by allowing disabling transforms.
|
|
10
|
+
* - Accessibility: rendered as a semantic <section> with aria-label.
|
|
11
|
+
* - CTA: primary/secondary CTA can be links (href provided) or buttons.
|
|
12
|
+
*/
|
|
13
|
+
export interface HeroMotionProps {
|
|
14
|
+
/** Optional id to attach to the section root */
|
|
15
|
+
id?: string;
|
|
16
|
+
/** ARIA label for the section. @defaultValue "Hero section" */
|
|
17
|
+
ariaLabel?: string;
|
|
18
|
+
/** Optional top-level class to override the root */
|
|
19
|
+
className?: string;
|
|
20
|
+
/** Primary heading text. Ignored when headingNode is provided. */
|
|
21
|
+
heading?: string;
|
|
22
|
+
/** Custom heading node; use for advanced layouts or styling. */
|
|
23
|
+
headingNode?: React.ReactNode;
|
|
24
|
+
/** Inline highlight node rendered next to heading text. */
|
|
25
|
+
highlight?: React.ReactNode;
|
|
26
|
+
/** Optional description paragraph/node */
|
|
27
|
+
description?: React.ReactNode;
|
|
28
|
+
/** Primary call to action config or null to hide */
|
|
29
|
+
primaryCta?: {
|
|
30
|
+
label: string;
|
|
31
|
+
href?: string;
|
|
32
|
+
} | null;
|
|
33
|
+
/** Secondary call to action config or null to hide */
|
|
34
|
+
secondaryCta?: {
|
|
35
|
+
label: string;
|
|
36
|
+
href?: string;
|
|
37
|
+
} | null;
|
|
38
|
+
/** Slot-style overrides */
|
|
39
|
+
section?: {
|
|
40
|
+
className?: string;
|
|
41
|
+
};
|
|
42
|
+
container?: {
|
|
43
|
+
className?: string;
|
|
44
|
+
};
|
|
45
|
+
content?: {
|
|
46
|
+
className?: string;
|
|
47
|
+
};
|
|
48
|
+
headingText?: {
|
|
49
|
+
className?: string;
|
|
50
|
+
};
|
|
51
|
+
highlightText?: {
|
|
52
|
+
className?: string;
|
|
53
|
+
};
|
|
54
|
+
descriptionText?: {
|
|
55
|
+
className?: string;
|
|
56
|
+
};
|
|
57
|
+
actions?: {
|
|
58
|
+
className?: string;
|
|
59
|
+
};
|
|
60
|
+
primaryButtonStyle?: {
|
|
61
|
+
unstyled?: boolean;
|
|
62
|
+
style?: React.CSSProperties;
|
|
63
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
64
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
65
|
+
className?: string;
|
|
66
|
+
};
|
|
67
|
+
secondaryButtonStyle?: {
|
|
68
|
+
unstyled?: boolean;
|
|
69
|
+
style?: React.CSSProperties;
|
|
70
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
71
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
72
|
+
className?: string;
|
|
73
|
+
};
|
|
74
|
+
/** Optional background node (e.g., SVGs, gradients, images) */
|
|
75
|
+
backgroundNode?: React.ReactNode;
|
|
76
|
+
/** When false, disables entrance animations */
|
|
77
|
+
enableMotion?: boolean;
|
|
78
|
+
/** Motion configuration for entrance sequences */
|
|
79
|
+
motionOptions?: {
|
|
80
|
+
viewport?: {
|
|
81
|
+
once?: boolean;
|
|
82
|
+
amount?: number;
|
|
83
|
+
};
|
|
84
|
+
headingDelay?: number;
|
|
85
|
+
descriptionDelay?: number;
|
|
86
|
+
actionsDelay?: number;
|
|
87
|
+
transition: Transition;
|
|
88
|
+
};
|
|
89
|
+
}
|
|
90
|
+
/**
|
|
91
|
+
* Motion-first hero with heading/highlight, optional description and CTAs.
|
|
92
|
+
*
|
|
93
|
+
* @remarks
|
|
94
|
+
* - Styling: slot-style className overrides are merged after defaults via cn().
|
|
95
|
+
* - Motion: enableMotion toggles entrance transitions; motionOptions controls
|
|
96
|
+
* delays and viewport.
|
|
97
|
+
* - Accessibility: semantic <section> with aria-label.
|
|
98
|
+
*
|
|
99
|
+
* @example
|
|
100
|
+
* <HeroMotion
|
|
101
|
+
* heading="Supercharge growth with"
|
|
102
|
+
* highlight="AI-powered insights"
|
|
103
|
+
* primaryCta={{ label: 'Get Started', href: '#contact' }}
|
|
104
|
+
* />
|
|
105
|
+
*/
|
|
106
|
+
export declare function HeroMotion({ id, ariaLabel, className, heading, headingNode, highlight, description, primaryCta, secondaryCta, section, container, content, headingText, highlightText, descriptionText, actions, primaryButtonStyle, secondaryButtonStyle, enableMotion, motionOptions, backgroundNode, }: HeroMotionProps): React.JSX.Element;
|
|
107
|
+
//# sourceMappingURL=HeroMotion.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HeroMotion.d.ts","sourceRoot":"","sources":["../../src/components/HeroMotion.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Props for the HeroOverlay component.
|
|
4
|
+
*
|
|
5
|
+
* @remarks
|
|
6
|
+
* - Prefer the structured image prop (image) over deprecated flat props.
|
|
7
|
+
* - Slot-style className overrides are merged after defaults via cn().
|
|
8
|
+
* - Motion controls affect CTA hover transitions.
|
|
9
|
+
*
|
|
10
|
+
* @public
|
|
11
|
+
*/
|
|
12
|
+
export interface HeroOverlayProps {
|
|
13
|
+
id?: string;
|
|
14
|
+
className?: string;
|
|
15
|
+
image?: {
|
|
16
|
+
src?: string;
|
|
17
|
+
alt?: string;
|
|
18
|
+
className?: string;
|
|
19
|
+
objectFit?: React.CSSProperties["objectFit"];
|
|
20
|
+
objectPosition?: React.CSSProperties["objectPosition"];
|
|
21
|
+
};
|
|
22
|
+
/** @deprecated Use image.src instead */
|
|
23
|
+
imageSrc?: string;
|
|
24
|
+
/** @deprecated Use image.alt instead */
|
|
25
|
+
imageAlt?: string;
|
|
26
|
+
/** @deprecated Use image.objectFit instead */
|
|
27
|
+
imageObjectFit?: React.CSSProperties["objectFit"];
|
|
28
|
+
/** @deprecated Use image.objectPosition instead */
|
|
29
|
+
imageObjectPosition?: React.CSSProperties["objectPosition"];
|
|
30
|
+
heading?: string | {
|
|
31
|
+
text?: string;
|
|
32
|
+
className?: string;
|
|
33
|
+
};
|
|
34
|
+
subheading?: string | {
|
|
35
|
+
text?: string;
|
|
36
|
+
className?: string;
|
|
37
|
+
};
|
|
38
|
+
overlayRGBA?: string;
|
|
39
|
+
overlayDarkRGBA?: string;
|
|
40
|
+
section?: {
|
|
41
|
+
className?: string;
|
|
42
|
+
};
|
|
43
|
+
container?: {
|
|
44
|
+
className?: string;
|
|
45
|
+
};
|
|
46
|
+
imageContainer?: {
|
|
47
|
+
className?: string;
|
|
48
|
+
};
|
|
49
|
+
overlay?: {
|
|
50
|
+
className?: string;
|
|
51
|
+
};
|
|
52
|
+
content?: {
|
|
53
|
+
className?: string;
|
|
54
|
+
};
|
|
55
|
+
textContainer?: {
|
|
56
|
+
className?: string;
|
|
57
|
+
};
|
|
58
|
+
/** @deprecated Use heading.className */
|
|
59
|
+
headingStyle?: {
|
|
60
|
+
className?: string;
|
|
61
|
+
};
|
|
62
|
+
/** @deprecated Use subheading.className */
|
|
63
|
+
subheadingStyle?: {
|
|
64
|
+
className?: string;
|
|
65
|
+
};
|
|
66
|
+
ctaContainer?: {
|
|
67
|
+
className?: string;
|
|
68
|
+
};
|
|
69
|
+
cta1?: {
|
|
70
|
+
label?: string;
|
|
71
|
+
href?: string;
|
|
72
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
73
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
74
|
+
className?: string;
|
|
75
|
+
unstyled?: boolean;
|
|
76
|
+
style?: React.CSSProperties;
|
|
77
|
+
};
|
|
78
|
+
cta2?: {
|
|
79
|
+
label?: string;
|
|
80
|
+
href?: string;
|
|
81
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
82
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
83
|
+
className?: string;
|
|
84
|
+
unstyled?: boolean;
|
|
85
|
+
style?: React.CSSProperties;
|
|
86
|
+
};
|
|
87
|
+
/** @deprecated Use cta1.label instead */
|
|
88
|
+
ctaBtn1Label?: string;
|
|
89
|
+
/** @deprecated Use cta1.href instead */
|
|
90
|
+
ctaBtn1Href?: string;
|
|
91
|
+
/** @deprecated Use cta2.label instead */
|
|
92
|
+
ctaBtn2Label?: string;
|
|
93
|
+
/** @deprecated Use cta2.href instead */
|
|
94
|
+
ctaBtn2Href?: string;
|
|
95
|
+
ariaLabel?: string;
|
|
96
|
+
enableMotion?: boolean;
|
|
97
|
+
}
|
|
98
|
+
/**
|
|
99
|
+
* Full-bleed image hero with color overlay, heading/subheading, and up to two CTAs.
|
|
100
|
+
*
|
|
101
|
+
* @remarks
|
|
102
|
+
* - Styling: slot-style overrides for container, imageContainer, overlay, content, textContainer.
|
|
103
|
+
* - Motion: enableMotion applies hover-lift transitions to CTA buttons only.
|
|
104
|
+
* - Accessibility: uses semantic <section> with aria-label; background image is
|
|
105
|
+
* decorative with overlay and text content provided separately.
|
|
106
|
+
*
|
|
107
|
+
* @example
|
|
108
|
+
* <HeroOverlay
|
|
109
|
+
* image={{ src: "/hero.png", alt: "" }}
|
|
110
|
+
* heading="Welcome"
|
|
111
|
+
* subheading="Build faster with our blocks"
|
|
112
|
+
* cta1={{ label: "Get Started", href: "#getstarted" }}
|
|
113
|
+
* />
|
|
114
|
+
*/
|
|
115
|
+
export declare function HeroOverlay({ id, className, imageSrc, imageAlt, imageObjectFit, imageObjectPosition, image, heading, subheading, overlayRGBA, overlayDarkRGBA, ctaBtn1Label, ctaBtn1Href, ctaBtn2Label, ctaBtn2Href, container, section, imageContainer, overlay, content, textContainer, headingStyle, subheadingStyle, ctaContainer, cta1, cta2, ariaLabel, enableMotion, }: HeroOverlayProps): React.JSX.Element;
|
|
116
|
+
//# sourceMappingURL=HeroOverlay.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HeroOverlay.d.ts","sourceRoot":"","sources":["../../src/components/HeroOverlay.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Props for the HeroSplit component.
|
|
4
|
+
*
|
|
5
|
+
* @remarks
|
|
6
|
+
* - Layout: split hero with text and image. imageLayout controls whether the
|
|
7
|
+
* image is full-bleed or padded.
|
|
8
|
+
* - Styling: slot-style className overrides are merged via cn(). Heading and
|
|
9
|
+
* subheading accept either a string or a { text, className } object.
|
|
10
|
+
* - Motion: enableMotion toggles button hover lift transitions.
|
|
11
|
+
* - Accessibility: uses a semantic <section> with aria-label.
|
|
12
|
+
*/
|
|
13
|
+
interface HeroSplitProps {
|
|
14
|
+
/** Optional id to attach to the root section element */
|
|
15
|
+
id?: string;
|
|
16
|
+
/** Optional top-level class to override the root */
|
|
17
|
+
className?: string;
|
|
18
|
+
/** Section slot override */
|
|
19
|
+
section?: {
|
|
20
|
+
className?: string;
|
|
21
|
+
};
|
|
22
|
+
/** Heading string or object with text and className */
|
|
23
|
+
heading?: string | {
|
|
24
|
+
text?: string;
|
|
25
|
+
className?: string;
|
|
26
|
+
};
|
|
27
|
+
/** Subheading string or object with text and className */
|
|
28
|
+
subheading?: string | {
|
|
29
|
+
text?: string;
|
|
30
|
+
className?: string;
|
|
31
|
+
};
|
|
32
|
+
/** Primary CTA configuration */
|
|
33
|
+
cta1?: {
|
|
34
|
+
label?: string;
|
|
35
|
+
href?: string;
|
|
36
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
37
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
38
|
+
className?: string;
|
|
39
|
+
/** When true, renders the Button in unstyled mode to avoid token bleed from variants */
|
|
40
|
+
unstyled?: boolean;
|
|
41
|
+
/** Optional inline style forwarded to Button */
|
|
42
|
+
style?: React.CSSProperties;
|
|
43
|
+
};
|
|
44
|
+
/** Secondary CTA configuration */
|
|
45
|
+
cta2?: {
|
|
46
|
+
label?: string;
|
|
47
|
+
href?: string;
|
|
48
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
49
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
50
|
+
className?: string;
|
|
51
|
+
/** When true, renders the Button in unstyled mode to avoid token bleed from variants */
|
|
52
|
+
unstyled?: boolean;
|
|
53
|
+
/** Optional inline style forwarded to Button */
|
|
54
|
+
style?: React.CSSProperties;
|
|
55
|
+
};
|
|
56
|
+
/** Image configuration */
|
|
57
|
+
image?: {
|
|
58
|
+
src?: string;
|
|
59
|
+
alt?: string;
|
|
60
|
+
className?: string;
|
|
61
|
+
};
|
|
62
|
+
/** Image container slot */
|
|
63
|
+
imageContainer?: {
|
|
64
|
+
className?: string;
|
|
65
|
+
};
|
|
66
|
+
/** Text container slot */
|
|
67
|
+
textContainer?: {
|
|
68
|
+
className?: string;
|
|
69
|
+
};
|
|
70
|
+
/** Buttons container slot */
|
|
71
|
+
buttonsContainer?: {
|
|
72
|
+
className?: string;
|
|
73
|
+
};
|
|
74
|
+
/** Text alignment at large breakpoints. @defaultValue "center" */
|
|
75
|
+
textAlign?: "left" | "center" | "right";
|
|
76
|
+
/** Fallback node shown when no image.src is provided */
|
|
77
|
+
fallback?: React.ReactNode;
|
|
78
|
+
/** ARIA label for the section. @defaultValue "Hero section" */
|
|
79
|
+
ariaLabel?: string;
|
|
80
|
+
/** When false, removes button hover lifts, keeps layout static */
|
|
81
|
+
enableMotion?: boolean;
|
|
82
|
+
/** "padded" keeps default gutters. "full-bleed" allows the image to touch page edges. @defaultValue "full-bleed" */
|
|
83
|
+
imageLayout?: "padded" | "full-bleed";
|
|
84
|
+
}
|
|
85
|
+
/**
|
|
86
|
+
* Split hero with text on one side and an image on the other.
|
|
87
|
+
*
|
|
88
|
+
* @remarks
|
|
89
|
+
* - Text props accept string or object forms to easily override classes.
|
|
90
|
+
* - Full-bleed layout absolutely positions the image on larger screens.
|
|
91
|
+
* - Motion only affects the subtle hover lift on CTA buttons.
|
|
92
|
+
*
|
|
93
|
+
* @example
|
|
94
|
+
* <HeroSplit heading="Build faster" subheading="Launch confidently" />
|
|
95
|
+
*/
|
|
96
|
+
export declare function HeroSplit({ id, className, heading, subheading, section, cta1, cta2, image, imageContainer, textContainer, buttonsContainer, textAlign, fallback, ariaLabel, enableMotion, imageLayout, }: HeroSplitProps): React.JSX.Element;
|
|
97
|
+
export {};
|
|
98
|
+
//# sourceMappingURL=HeroSplit.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HeroSplit.d.ts","sourceRoot":"","sources":["../../src/components/HeroSplit.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { type ThemeToggleProps } from "@nextworks/blocks-core";
|
|
3
|
+
/**
|
|
4
|
+
* Props for the Navbar component.
|
|
5
|
+
*
|
|
6
|
+
* @remarks
|
|
7
|
+
* Slot-style className overrides are available for structural parts. The mobile
|
|
8
|
+
* menu locks body scroll when open and restores it on close/unmount.
|
|
9
|
+
*
|
|
10
|
+
* @public
|
|
11
|
+
*/
|
|
12
|
+
export interface NavbarProps {
|
|
13
|
+
/** Optional id to attach to the root nav element */
|
|
14
|
+
id?: string;
|
|
15
|
+
/** The height of the navbar as a Tailwind class. Example: "h-16" or "h-[13vh]" */
|
|
16
|
+
navHeight?: string;
|
|
17
|
+
/**
|
|
18
|
+
* The text displayed as the brand/logo.
|
|
19
|
+
* @defaultValue "Brand Name"
|
|
20
|
+
*/
|
|
21
|
+
brand?: string;
|
|
22
|
+
/** Optional custom brand node (e.g., logo). Rendered left of brand text */
|
|
23
|
+
brandNode?: React.ReactNode;
|
|
24
|
+
/** Navigation links array. Each item has a label and href */
|
|
25
|
+
menuItems?: {
|
|
26
|
+
label: string;
|
|
27
|
+
href: string;
|
|
28
|
+
}[];
|
|
29
|
+
/**
|
|
30
|
+
* Call to action button config or null to hide it.
|
|
31
|
+
* Example: { label: "Get Started", href: "#contact" }
|
|
32
|
+
*/
|
|
33
|
+
ctaButton?: {
|
|
34
|
+
label: string;
|
|
35
|
+
href: string;
|
|
36
|
+
} | null;
|
|
37
|
+
/**
|
|
38
|
+
* Whether to display the color mode toggle.
|
|
39
|
+
* @defaultValue true
|
|
40
|
+
*/
|
|
41
|
+
showColorModeToggle?: boolean;
|
|
42
|
+
/**
|
|
43
|
+
* Whether navbar should stick to top when scrolling.
|
|
44
|
+
* @defaultValue true
|
|
45
|
+
*/
|
|
46
|
+
sticky?: boolean;
|
|
47
|
+
/** Optional top-level class to override the nav root */
|
|
48
|
+
className?: string;
|
|
49
|
+
/** Styling configuration objects */
|
|
50
|
+
nav?: {
|
|
51
|
+
className?: string;
|
|
52
|
+
};
|
|
53
|
+
brandText?: {
|
|
54
|
+
className?: string;
|
|
55
|
+
};
|
|
56
|
+
links?: {
|
|
57
|
+
className?: string;
|
|
58
|
+
};
|
|
59
|
+
ctaButtonStyle?: {
|
|
60
|
+
unstyled?: boolean;
|
|
61
|
+
style?: React.CSSProperties;
|
|
62
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
63
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
64
|
+
className?: string;
|
|
65
|
+
};
|
|
66
|
+
mobileMenu?: {
|
|
67
|
+
className?: string;
|
|
68
|
+
};
|
|
69
|
+
container?: {
|
|
70
|
+
className?: string;
|
|
71
|
+
};
|
|
72
|
+
brandWrapper?: {
|
|
73
|
+
className?: string;
|
|
74
|
+
};
|
|
75
|
+
desktopMenu?: {
|
|
76
|
+
className?: string;
|
|
77
|
+
};
|
|
78
|
+
toggleButton?: {
|
|
79
|
+
className?: string;
|
|
80
|
+
};
|
|
81
|
+
colorModeWrapper?: {
|
|
82
|
+
className?: string;
|
|
83
|
+
};
|
|
84
|
+
ctaButtonWrapper?: {
|
|
85
|
+
className?: string;
|
|
86
|
+
};
|
|
87
|
+
mobileMenuInner?: {
|
|
88
|
+
className?: string;
|
|
89
|
+
};
|
|
90
|
+
/** Additional class overrides for mobile menu link hover/background, etc. */
|
|
91
|
+
mobileLinks?: {
|
|
92
|
+
className?: string;
|
|
93
|
+
};
|
|
94
|
+
/** Props forwarded to ThemeToggle so templates can fully style it */
|
|
95
|
+
themeToggle?: ThemeToggleProps;
|
|
96
|
+
/** ARIA label for the navbar. */
|
|
97
|
+
ariaLabel?: string;
|
|
98
|
+
}
|
|
99
|
+
/**
|
|
100
|
+
* Responsive navbar with brand, menu links, color mode toggle, and optional CTA.
|
|
101
|
+
*
|
|
102
|
+
* @remarks
|
|
103
|
+
* - Sticky behavior is enabled by default (sticky top-0 z-50).
|
|
104
|
+
* - Mobile menu toggles with a button and traps body scroll while open.
|
|
105
|
+
* - Accessibility: Focus rings are applied to interactive elements; aria
|
|
106
|
+
* attributes are set on the toggle button for state.
|
|
107
|
+
*
|
|
108
|
+
* @example
|
|
109
|
+
* <Navbar brand="Acme" />
|
|
110
|
+
*/
|
|
111
|
+
export declare function Navbar({ id, navHeight, brand, brandNode, menuItems, ctaButton, showColorModeToggle, sticky, className, nav, brandText, links, ctaButtonStyle, mobileMenu, container, brandWrapper, desktopMenu, toggleButton, colorModeWrapper, ctaButtonWrapper, mobileMenuInner, mobileLinks, themeToggle, ariaLabel, }: NavbarProps): React.JSX.Element;
|
|
112
|
+
//# sourceMappingURL=Navbar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Navbar.d.ts","sourceRoot":"","sources":["../../src/components/Navbar.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAG3D,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAI5E;;;;;;;;GAQG;AACH,MAAM,WAAW,WAAW;IAC1B,oDAAoD;IACpD,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,kFAAkF;IAClF,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2EAA2E;IAC3E,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,6DAA6D;IAC7D,SAAS,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAE9C;;;OAGG;IACH,SAAS,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAEnD;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,oCAAoC;IACpC,GAAG,CAAC,EAAE;QACJ,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IAEF,SAAS,CAAC,EAAE;QACV,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,KAAK,CAAC,EAAE;QACN,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,cAAc,CAAC,EAAE;QACf,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAC5B,OAAO,CAAC,EACJ,SAAS,GACT,aAAa,GACb,SAAS,GACT,WAAW,GACX,OAAO,GACP,MAAM,CAAC;QACX,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;QACxC,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,UAAU,CAAC,EAAE;QACX,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IAGF,SAAS,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACnC,YAAY,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtC,WAAW,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,YAAY,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtC,gBAAgB,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,gBAAgB,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,eAAe,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACzC,6EAA6E;IAC7E,WAAW,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAErC,qEAAqE;IACrE,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAE/B,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAUD;;;;;;;;;;;GAWG;AACH,wBAAgB,MAAM,CAAC,EACrB,EAAE,EACF,SAAkB,EAClB,KAAoB,EACpB,SAAS,EACT,SAA4B,EAC5B,SAAsD,EACtD,mBAA0B,EAC1B,MAAa,EACb,SAAS,EACT,GAEC,EACD,SAEC,EACD,KAGC,EACD,cAKC,EACD,UAEC,EAGD,SAA6B,EAC7B,YAAgC,EAChC,WAEC,EACD,YAGC,EACD,gBAAwC,EACxC,gBAAwC,EACxC,eAA2D,EAC3D,WAA8C,EAE9C,WAAgB,EAEhB,SAA6B,GAC9B,EAAE,WAAW,qBAgLb"}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Props for a compact newsletter/signup block.
|
|
4
|
+
*
|
|
5
|
+
* - Slot-style API (section, container, header, heading, subheading, form, formRow, input, button)
|
|
6
|
+
* - Merges consumer classes with sensible defaults via cn(...)
|
|
7
|
+
* - Uses CSS vars in defaults so token/theming overrides don't break
|
|
8
|
+
*/
|
|
9
|
+
export interface NewsletterProps {
|
|
10
|
+
id?: string;
|
|
11
|
+
className?: string;
|
|
12
|
+
headingText?: string;
|
|
13
|
+
subheadingText?: string;
|
|
14
|
+
/** Called after successful submit (form event will be passed) */
|
|
15
|
+
onSubmit?: (e: React.FormEvent<HTMLFormElement>, email: string) => void;
|
|
16
|
+
/** Slot-style overrides */
|
|
17
|
+
section?: {
|
|
18
|
+
className?: string;
|
|
19
|
+
};
|
|
20
|
+
container?: {
|
|
21
|
+
className?: string;
|
|
22
|
+
};
|
|
23
|
+
header?: {
|
|
24
|
+
className?: string;
|
|
25
|
+
};
|
|
26
|
+
heading?: {
|
|
27
|
+
className?: string;
|
|
28
|
+
};
|
|
29
|
+
subheading?: {
|
|
30
|
+
className?: string;
|
|
31
|
+
};
|
|
32
|
+
form?: {
|
|
33
|
+
className?: string;
|
|
34
|
+
};
|
|
35
|
+
formRow?: {
|
|
36
|
+
className?: string;
|
|
37
|
+
};
|
|
38
|
+
input?: {
|
|
39
|
+
className?: string;
|
|
40
|
+
};
|
|
41
|
+
button?: {
|
|
42
|
+
className?: string;
|
|
43
|
+
variant?: any;
|
|
44
|
+
size?: any;
|
|
45
|
+
unstyled?: boolean;
|
|
46
|
+
};
|
|
47
|
+
enableMotion?: boolean;
|
|
48
|
+
ariaLabel?: string;
|
|
49
|
+
}
|
|
50
|
+
/**
|
|
51
|
+
* Compact newsletter/signup block.
|
|
52
|
+
*
|
|
53
|
+
* Usage:
|
|
54
|
+
* <Newsletter section={{ className: "bg-gradient-to-r ..." }} />
|
|
55
|
+
*
|
|
56
|
+
* Slots exposed: section, container, header, heading, subheading, form, formRow, input, button
|
|
57
|
+
*/
|
|
58
|
+
export declare function Newsletter({ id, className, headingText, subheadingText, onSubmit, section, container, header, heading, subheading, form, formRow, input, button, enableMotion, ariaLabel, }: NewsletterProps): React.JSX.Element;
|
|
59
|
+
//# sourceMappingURL=Newsletter.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Newsletter.d.ts","sourceRoot":"","sources":["../../src/components/Newsletter.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B;;;;;;GAMG;AACH,MAAM,WAAW,eAAe;IAC9B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,eAAe,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAExE,2BAA2B;IAC3B,OAAO,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjC,SAAS,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACnC,MAAM,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAChC,OAAO,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjC,UAAU,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACpC,IAAI,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9B,OAAO,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjC,KAAK,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC/B,MAAM,CAAC,EAAE;QACP,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,OAAO,CAAC,EAAE,GAAG,CAAC;QACd,IAAI,CAAC,EAAE,GAAG,CAAC;QACX,QAAQ,CAAC,EAAE,OAAO,CAAC;KACpB,CAAC;IAEF,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAkBD;;;;;;;GAOG;AACH,wBAAgB,UAAU,CAAC,EACzB,EAAE,EACF,SAAS,EACT,WAAgC,EAChC,cAAiE,EACjE,QAAQ,EACR,OAAO,EACP,SAAS,EACT,MAAM,EACN,OAAO,EACP,UAAU,EACV,IAAI,EACJ,OAAO,EACP,KAAK,EACL,MAAM,EACN,YAAmB,EACnB,SAAuC,GACxC,EAAE,eAAe,qBAgEjB"}
|
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface PortfolioProject {
|
|
3
|
+
id: number;
|
|
4
|
+
title: string;
|
|
5
|
+
category: string;
|
|
6
|
+
industry: string;
|
|
7
|
+
result: string;
|
|
8
|
+
description: string;
|
|
9
|
+
image?: string;
|
|
10
|
+
tags: string[];
|
|
11
|
+
color: string;
|
|
12
|
+
url?: string;
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* Props for the PortfolioSimple section component.
|
|
16
|
+
*
|
|
17
|
+
* @remarks
|
|
18
|
+
* - Styling: slot-style className overrides are merged after defaults via cn().
|
|
19
|
+
* - Motion: entrance animations respect enableMotion; prefers-reduced-motion is supported.
|
|
20
|
+
*
|
|
21
|
+
* @public
|
|
22
|
+
*/
|
|
23
|
+
interface PortfolioSimpleProps {
|
|
24
|
+
/** Optional id on root section */
|
|
25
|
+
id?: string;
|
|
26
|
+
/** Root className merged into section slot */
|
|
27
|
+
className?: string;
|
|
28
|
+
projects?: PortfolioProject[];
|
|
29
|
+
/**
|
|
30
|
+
* List of filter labels. Filtering matches project.category exactly.
|
|
31
|
+
* The first item is selected by default; a value of "All Projects" disables filtering.
|
|
32
|
+
*/
|
|
33
|
+
filters?: string[];
|
|
34
|
+
/** When false, disables entrance animations and hover transitions. */
|
|
35
|
+
enableMotion?: boolean;
|
|
36
|
+
sectionTitle?: string;
|
|
37
|
+
sectionSubtitle?: string;
|
|
38
|
+
ctaTitle?: string;
|
|
39
|
+
ctaDescription?: string;
|
|
40
|
+
/** Label for the first call-to-action button */
|
|
41
|
+
cta1Label?: string;
|
|
42
|
+
/** URL or anchor target for the first CTA button */
|
|
43
|
+
cta1Href?: string;
|
|
44
|
+
/** Label for the second call-to-action button */
|
|
45
|
+
cta2Label?: string;
|
|
46
|
+
/** URL or anchor target for the second CTA button */
|
|
47
|
+
cta2Href?: string;
|
|
48
|
+
/** Styling configuration objects */
|
|
49
|
+
section?: {
|
|
50
|
+
className?: string;
|
|
51
|
+
};
|
|
52
|
+
container?: {
|
|
53
|
+
className?: string;
|
|
54
|
+
};
|
|
55
|
+
header?: {
|
|
56
|
+
className?: string;
|
|
57
|
+
};
|
|
58
|
+
title?: {
|
|
59
|
+
className?: string;
|
|
60
|
+
};
|
|
61
|
+
subtitle?: {
|
|
62
|
+
className?: string;
|
|
63
|
+
};
|
|
64
|
+
filterContainer?: {
|
|
65
|
+
className?: string;
|
|
66
|
+
};
|
|
67
|
+
filterButton?: {
|
|
68
|
+
className?: string;
|
|
69
|
+
};
|
|
70
|
+
activeFilterButton?: {
|
|
71
|
+
className?: string;
|
|
72
|
+
};
|
|
73
|
+
grid?: {
|
|
74
|
+
className?: string;
|
|
75
|
+
};
|
|
76
|
+
projectCard?: {
|
|
77
|
+
className?: string;
|
|
78
|
+
};
|
|
79
|
+
imageContainer?: {
|
|
80
|
+
className?: string;
|
|
81
|
+
};
|
|
82
|
+
projectInfo?: {
|
|
83
|
+
className?: string;
|
|
84
|
+
};
|
|
85
|
+
projectTitle?: {
|
|
86
|
+
className?: string;
|
|
87
|
+
};
|
|
88
|
+
projectDescription?: {
|
|
89
|
+
className?: string;
|
|
90
|
+
};
|
|
91
|
+
tagsContainer?: {
|
|
92
|
+
className?: string;
|
|
93
|
+
};
|
|
94
|
+
tagStyle?: {
|
|
95
|
+
className?: string;
|
|
96
|
+
};
|
|
97
|
+
result?: {
|
|
98
|
+
className?: string;
|
|
99
|
+
};
|
|
100
|
+
ctaSection?: {
|
|
101
|
+
className?: string;
|
|
102
|
+
};
|
|
103
|
+
ctaTitleStyle?: {
|
|
104
|
+
className?: string;
|
|
105
|
+
};
|
|
106
|
+
ctaDescriptionStyle?: {
|
|
107
|
+
className?: string;
|
|
108
|
+
};
|
|
109
|
+
ctaButtons?: {
|
|
110
|
+
className?: string;
|
|
111
|
+
};
|
|
112
|
+
cta1Button?: {
|
|
113
|
+
className?: string;
|
|
114
|
+
};
|
|
115
|
+
cta2Button?: {
|
|
116
|
+
className?: string;
|
|
117
|
+
};
|
|
118
|
+
/** Called when a project image or card is clicked. */
|
|
119
|
+
onProjectClick?: (project: PortfolioProject) => void;
|
|
120
|
+
onPrimaryCtaClick?: () => void;
|
|
121
|
+
onSecondaryCtaClick?: () => void;
|
|
122
|
+
/** ARIA label for the portfolio section */
|
|
123
|
+
ariaLabel?: string;
|
|
124
|
+
}
|
|
125
|
+
/**
|
|
126
|
+
* Responsive portfolio/gallery grid with simple category filtering and CTA block.
|
|
127
|
+
*
|
|
128
|
+
* @remarks
|
|
129
|
+
* - Filtering uses exact category match; include "All Projects" to disable filtering.
|
|
130
|
+
* - Accessibility: Renders a semantic <section> with aria-label; ensure images have informative titles or alt text.
|
|
131
|
+
*
|
|
132
|
+
* @example
|
|
133
|
+
* <PortfolioSimple sectionTitle="Our Work" />
|
|
134
|
+
*/
|
|
135
|
+
export declare function PortfolioSimple({ id, className, projects, filters, enableMotion, sectionTitle, sectionSubtitle, ctaTitle, ctaDescription, cta1Label, cta1Href, cta2Label, cta2Href, section, container, header, title, subtitle, filterContainer, filterButton, activeFilterButton, grid, projectCard, imageContainer, projectInfo, projectTitle, projectDescription, tagsContainer, tagStyle, result, ctaSection, ctaTitleStyle, ctaDescriptionStyle, ctaButtons, cta1Button, cta2Button, onProjectClick, onPrimaryCtaClick, onSecondaryCtaClick, ariaLabel, }: PortfolioSimpleProps): React.JSX.Element;
|
|
136
|
+
export {};
|
|
137
|
+
//# sourceMappingURL=PortfolioSimple.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PortfolioSimple.d.ts","sourceRoot":"","sources":["../../src/components/PortfolioSimple.tsx"],"names":[],"mappings":"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"}
|