@nextworks/blocks-sections 0.1.0-alpha.8 → 0.2.0-alpha.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.
- package/README.md +16 -11
- package/dist/components/Features.d.ts +4 -2
- package/dist/components/Features.d.ts.map +1 -1
- package/dist/components/Features.jsx +2 -2
- package/dist/components/HeroMotion.d.ts +4 -2
- package/dist/components/HeroMotion.d.ts.map +1 -1
- 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 +113 -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 +109 -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 +8 -6
- 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
package/README.md
CHANGED
|
@@ -8,14 +8,22 @@ Examples include:
|
|
|
8
8
|
- FAQ, Contact, Newsletter
|
|
9
9
|
- Portfolio, Services, Team, Trust badges
|
|
10
10
|
|
|
11
|
-
##
|
|
11
|
+
## Recommended: install via the nextworks CLI
|
|
12
|
+
|
|
13
|
+
Most developers should install Blocks via the **nextworks** CLI (copy-in / shadcn-style) rather than consuming this package directly.
|
|
14
|
+
|
|
15
|
+
```bash
|
|
16
|
+
npx nextworks@latest add blocks --sections --templates
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
- npm (CLI): https://www.npmjs.com/package/nextworks
|
|
20
|
+
|
|
21
|
+
## Direct installation (advanced)
|
|
22
|
+
|
|
23
|
+
If you want to consume the compiled sections as a package:
|
|
12
24
|
|
|
13
25
|
```bash
|
|
14
26
|
npm install @nextworks/blocks-sections @nextworks/blocks-core
|
|
15
|
-
# or
|
|
16
|
-
pnpm add @nextworks/blocks-sections @nextworks/blocks-core
|
|
17
|
-
# or
|
|
18
|
-
yarn add @nextworks/blocks-sections @nextworks/blocks-core
|
|
19
27
|
```
|
|
20
28
|
|
|
21
29
|
## Usage
|
|
@@ -35,10 +43,7 @@ export default function Page() {
|
|
|
35
43
|
}
|
|
36
44
|
```
|
|
37
45
|
|
|
38
|
-
These components assume you have
|
|
39
|
-
|
|
40
|
-
For a copy-based workflow (files under `components/` and `app/` in your own app), use the CLI:
|
|
46
|
+
These components assume you have Tailwind + React + Next.js configured and that your app is wrapped with the appropriate provider(s).
|
|
41
47
|
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
```
|
|
48
|
+
- If you installed via the `nextworks` CLI, this is handled for you (the CLI patches your router entrypoint to wrap with the kit-local `AppProviders`).
|
|
49
|
+
- If you consume packages directly, you’ll need to wrap your app with the relevant providers from `@nextworks/blocks-core` in your router entrypoint (App Router `app/layout.tsx` or Pages Router `pages/_app.tsx`).
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import
|
|
2
|
+
import { motion } from "motion/react";
|
|
3
3
|
/**
|
|
4
4
|
* Data used to render a FeatureCard within the Features grid.
|
|
5
5
|
* @public
|
|
@@ -20,6 +20,7 @@ export interface FeatureCardData {
|
|
|
20
20
|
*
|
|
21
21
|
* @public
|
|
22
22
|
*/
|
|
23
|
+
type MotionTransition = React.ComponentProps<typeof motion.div>["transition"];
|
|
23
24
|
export interface FeaturesProps {
|
|
24
25
|
/**
|
|
25
26
|
* Optional id to attach to the root section element.
|
|
@@ -86,7 +87,7 @@ export interface FeaturesProps {
|
|
|
86
87
|
once?: boolean;
|
|
87
88
|
amount?: number;
|
|
88
89
|
};
|
|
89
|
-
transition?:
|
|
90
|
+
transition?: MotionTransition;
|
|
90
91
|
};
|
|
91
92
|
/** ARIA label for the features section */
|
|
92
93
|
ariaLabel?: string;
|
|
@@ -108,4 +109,5 @@ export interface FeaturesProps {
|
|
|
108
109
|
* />
|
|
109
110
|
*/
|
|
110
111
|
export declare function Features({ id, sectionHeading, sectionSubheading, featuresData, className, section, container, header, heading, subheading, grid, cardWrapper, card, image, cardHeading, cardSubheading, enableMotion, motionConfig, ariaLabel, }: FeaturesProps): React.JSX.Element;
|
|
112
|
+
export {};
|
|
111
113
|
//# sourceMappingURL=Features.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Features.d.ts","sourceRoot":"","sources":["../../src/components/Features.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Features.d.ts","sourceRoot":"","sources":["../../src/components/Features.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAItC;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;GASG;AACH,KAAK,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC,YAAY,CAAC,CAAC;AAE9E,MAAM,WAAW,aAAa;IAC5B;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,gCAAgC;IAChC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,uDAAuD;IACvD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B,yCAAyC;IACzC,YAAY,CAAC,EAAE,eAAe,EAAE,CAAC;IAEjC,4DAA4D;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,4CAA4C;IAC5C,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,+DAA+D;IAC/D,WAAW,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,8CAA8C;IAC9C,IAAI,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9B,KAAK,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC/B,WAAW,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,cAAc,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAExC,sEAAsE;IACtE,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,iDAAiD;IACjD,YAAY,CAAC,EAAE;QACb,OAAO,CAAC,EAAE;YAAE,OAAO,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC;QAC3C,WAAW,CAAC,EAAE;YAAE,OAAO,CAAC,EAAE,MAAM,CAAC;YAAC,CAAC,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC;QAC/C,QAAQ,CAAC,EAAE;YAAE,IAAI,CAAC,EAAE,OAAO,CAAC;YAAC,MAAM,CAAC,EAAE,MAAM,CAAA;SAAE,CAAC;QAC/C,UAAU,CAAC,EAAE,gBAAgB,CAAC;KAC/B,CAAC;IAEF,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAiCD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,QAAQ,CAAC,EACvB,EAAe,EACf,cAA+B,EAC/B,iBAA0E,EAC1E,YAAkC,EAElC,SAAS,EAET,OAAgE,EAChE,SAAmE,EACnE,MAAoD,EACpD,OAGC,EACD,UAGC,EACD,IAGC,EACD,WAEC,EACD,IAGC,EACD,KAGC,EACD,WAGC,EACD,cAEC,EAED,YAAmB,EACnB,YAWC,EACD,SAA8B,GAC/B,EAAE,aAAa,qBAwFf"}
|
|
@@ -95,10 +95,10 @@ export function Features({ id = "features", sectionHeading = "Key Features", sec
|
|
|
95
95
|
},
|
|
96
96
|
};
|
|
97
97
|
// Ensure we always spread a defined object into transition
|
|
98
|
-
const baseTransition = (
|
|
98
|
+
const baseTransition = (_a = mConfig.transition) !== null && _a !== void 0 ? _a : {
|
|
99
99
|
type: "tween",
|
|
100
100
|
duration: 0,
|
|
101
|
-
}
|
|
101
|
+
};
|
|
102
102
|
const noMotionCard = "transition-none hover:!translate-y-0 hover:shadow-none motion-reduce:transition-none motion-reduce:transform-none";
|
|
103
103
|
const noMotionImage = "transition-none hover:!scale-100 transform-none motion-reduce:transform-none group-hover:!scale-100";
|
|
104
104
|
return (<motion.div key={index} initial={mConfig.initial} whileInView={mConfig.whileInView} viewport={mConfig.viewport} transition={Object.assign(Object.assign({}, baseTransition), {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import
|
|
2
|
+
import { motion } from "motion/react";
|
|
3
3
|
/**
|
|
4
4
|
* Props for the HeroMotion component.
|
|
5
5
|
*
|
|
@@ -10,6 +10,7 @@ import type { Transition } from "motion";
|
|
|
10
10
|
* - Accessibility: rendered as a semantic <section> with aria-label.
|
|
11
11
|
* - CTA: primary/secondary CTA can be links (href provided) or buttons.
|
|
12
12
|
*/
|
|
13
|
+
type MotionTransition = React.ComponentProps<typeof motion.div>["transition"];
|
|
13
14
|
export interface HeroMotionProps {
|
|
14
15
|
/** Optional id to attach to the section root */
|
|
15
16
|
id?: string;
|
|
@@ -84,7 +85,7 @@ export interface HeroMotionProps {
|
|
|
84
85
|
headingDelay?: number;
|
|
85
86
|
descriptionDelay?: number;
|
|
86
87
|
actionsDelay?: number;
|
|
87
|
-
transition:
|
|
88
|
+
transition: MotionTransition;
|
|
88
89
|
};
|
|
89
90
|
}
|
|
90
91
|
/**
|
|
@@ -104,4 +105,5 @@ export interface HeroMotionProps {
|
|
|
104
105
|
* />
|
|
105
106
|
*/
|
|
106
107
|
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;
|
|
108
|
+
export {};
|
|
107
109
|
//# sourceMappingURL=HeroMotion.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HeroMotion.d.ts","sourceRoot":"","sources":["../../src/components/HeroMotion.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"HeroMotion.d.ts","sourceRoot":"","sources":["../../src/components/HeroMotion.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Data used to render a single statistic in the About section.
|
|
4
|
+
*
|
|
5
|
+
* @remarks
|
|
6
|
+
* Typical examples include counts like projects completed or years of
|
|
7
|
+
* experience. The suffix lets you append symbols such as "+", "%", or "/7".
|
|
8
|
+
*
|
|
9
|
+
* @public
|
|
10
|
+
*/
|
|
11
|
+
export interface AboutStatData {
|
|
12
|
+
/** The main numeric/text value (e.g., "50") */
|
|
13
|
+
value?: string;
|
|
14
|
+
/** Short label describing the stat (e.g., "Successful Projects") */
|
|
15
|
+
label?: string;
|
|
16
|
+
/** Optional suffix appended to the value (e.g., "+") */
|
|
17
|
+
suffix?: string;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Props for the About section component.
|
|
21
|
+
*
|
|
22
|
+
* @remarks
|
|
23
|
+
* - Styling: exposes slot-style className overrides (section, container,
|
|
24
|
+
* inner, contentContainer, contentStack, subheading, heading, content,
|
|
25
|
+
* statsSection, statsGrid, statItem, statNumber, statLabel). Consumer
|
|
26
|
+
* classes are merged after defaults via cn().
|
|
27
|
+
* - Layout: text alignment can be set via aboutTextAlign.
|
|
28
|
+
* - Motion: animateStats enables a count-up animation for numeric stats on first viewport visibility.
|
|
29
|
+
* - Accessibility: rendered as a semantic <section> with aria-label.
|
|
30
|
+
*/
|
|
31
|
+
interface AboutProps {
|
|
32
|
+
/** Main heading text displayed in the section header. @defaultValue "Your Success Is Our Mission" */
|
|
33
|
+
aboutHeadingText?: string;
|
|
34
|
+
/** Optional subheading text displayed above the heading. */
|
|
35
|
+
aboutSubheadingText?: string;
|
|
36
|
+
/** Primary paragraph/content body. @defaultValue a short marketing blurb */
|
|
37
|
+
aboutContentText?: string;
|
|
38
|
+
/** Optional list of statistics to render below the content. @defaultValue defaultStatsData */
|
|
39
|
+
aboutStats?: AboutStatData[];
|
|
40
|
+
/** Optional top-level class to override the section root */
|
|
41
|
+
className?: string;
|
|
42
|
+
/** Slot-style overrides */
|
|
43
|
+
section?: {
|
|
44
|
+
className?: string;
|
|
45
|
+
};
|
|
46
|
+
container?: {
|
|
47
|
+
className?: string;
|
|
48
|
+
};
|
|
49
|
+
inner?: {
|
|
50
|
+
className?: string;
|
|
51
|
+
};
|
|
52
|
+
contentContainer?: {
|
|
53
|
+
className?: string;
|
|
54
|
+
};
|
|
55
|
+
contentStack?: {
|
|
56
|
+
className?: string;
|
|
57
|
+
};
|
|
58
|
+
subheading?: {
|
|
59
|
+
className?: string;
|
|
60
|
+
};
|
|
61
|
+
heading?: {
|
|
62
|
+
className?: string;
|
|
63
|
+
};
|
|
64
|
+
content?: {
|
|
65
|
+
className?: string;
|
|
66
|
+
};
|
|
67
|
+
statsSection?: {
|
|
68
|
+
className?: string;
|
|
69
|
+
};
|
|
70
|
+
statsGrid?: {
|
|
71
|
+
className?: string;
|
|
72
|
+
};
|
|
73
|
+
statItem?: {
|
|
74
|
+
className?: string;
|
|
75
|
+
};
|
|
76
|
+
statNumber?: {
|
|
77
|
+
className?: string;
|
|
78
|
+
};
|
|
79
|
+
statLabel?: {
|
|
80
|
+
className?: string;
|
|
81
|
+
};
|
|
82
|
+
/** Controls text alignment at various breakpoints. @defaultValue "center" */
|
|
83
|
+
aboutTextAlign?: "left" | "center" | "right";
|
|
84
|
+
/** Whether to render the stats block at the bottom. @defaultValue true */
|
|
85
|
+
showStats?: boolean;
|
|
86
|
+
/** Enable count-up animation for numeric stats when they enter the viewport. @defaultValue false */
|
|
87
|
+
animateStats?: boolean;
|
|
88
|
+
/** ARIA label for the section. @defaultValue "About section" */
|
|
89
|
+
ariaLabel?: string;
|
|
90
|
+
}
|
|
91
|
+
export declare function About({ aboutHeadingText, aboutSubheadingText, aboutContentText, aboutStats, className, section, container, inner, contentContainer, contentStack, subheading, heading, content, statsSection, statsGrid, statItem, statNumber, statLabel, aboutTextAlign, showStats, animateStats, ariaLabel, }: AboutProps): React.JSX.Element;
|
|
92
|
+
export {};
|
|
93
|
+
//# sourceMappingURL=About.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"About.d.ts","sourceRoot":"","sources":["../../src/components/About.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B;;;;;;;;GAQG;AACH,MAAM,WAAW,aAAa;IAC5B,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oEAAoE;IACpE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wDAAwD;IACxD,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;;;;GAWG;AACH,UAAU,UAAU;IAClB,qGAAqG;IACrG,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,4DAA4D;IAC5D,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,4EAA4E;IAC5E,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,8FAA8F;IAC9F,UAAU,CAAC,EAAE,aAAa,EAAE,CAAC;IAE7B,4DAA4D;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,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,KAAK,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC/B,gBAAgB,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1C,YAAY,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtC,UAAU,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACpC,OAAO,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjC,OAAO,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjC,YAAY,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtC,SAAS,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACnC,QAAQ,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAClC,UAAU,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACpC,SAAS,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAEnC,6EAA6E;IAC7E,cAAc,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC7C,0EAA0E;IAC1E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oGAAoG;IACpG,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,gEAAgE;IAChE,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA6FD,wBAAgB,KAAK,CAAC,EACpB,gBAAgD,EAChD,mBAAmB,EACnB,gBAAyJ,EACzJ,UAA6B,EAC7B,SAAS,EACT,OAAyD,EACzD,SAAmD,EACnD,KAA6C,EAC7C,gBAAqD,EACrD,YAAmD,EACnD,UAGC,EACD,OAEC,EACD,OAGC,EACD,YAGC,EACD,SAEC,EACD,QAA4D,EAC5D,UAEC,EACD,SAGC,EACD,cAAyB,EACzB,SAAgB,EAChB,YAAoB,EACpB,SAA2B,GAC5B,EAAE,UAAU,qBAoFZ"}
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Props for the CTA section component.
|
|
4
|
+
*
|
|
5
|
+
* @remarks
|
|
6
|
+
* Uses a slot-style API for Tailwind className overrides. Each slot's
|
|
7
|
+
* className is merged with component defaults via cn().
|
|
8
|
+
*
|
|
9
|
+
* Prefer customizing spacing via headingText.className and other slot
|
|
10
|
+
* classNames rather than legacy spacing props.
|
|
11
|
+
*
|
|
12
|
+
* @public
|
|
13
|
+
*/
|
|
14
|
+
interface CTAProps {
|
|
15
|
+
/**
|
|
16
|
+
* Optional id for the section.
|
|
17
|
+
* @defaultValue "cta"
|
|
18
|
+
*/
|
|
19
|
+
id?: string;
|
|
20
|
+
/** Optional top-level class to override the section root */
|
|
21
|
+
className?: string;
|
|
22
|
+
/** Styling configuration objects (slot-style pattern like Navbar) */
|
|
23
|
+
section?: {
|
|
24
|
+
className?: string;
|
|
25
|
+
};
|
|
26
|
+
container?: {
|
|
27
|
+
className?: string;
|
|
28
|
+
};
|
|
29
|
+
contentWrapper?: {
|
|
30
|
+
className?: string;
|
|
31
|
+
};
|
|
32
|
+
headingText?: {
|
|
33
|
+
text?: string;
|
|
34
|
+
className?: string;
|
|
35
|
+
};
|
|
36
|
+
subheadingText?: {
|
|
37
|
+
text?: string;
|
|
38
|
+
className?: string;
|
|
39
|
+
};
|
|
40
|
+
descriptionText?: {
|
|
41
|
+
text?: string;
|
|
42
|
+
className?: string;
|
|
43
|
+
};
|
|
44
|
+
actionsWrapper?: {
|
|
45
|
+
className?: string;
|
|
46
|
+
};
|
|
47
|
+
/**
|
|
48
|
+
* Primary CTA config or null to hide it (mirrors Navbar ctaButton pattern)
|
|
49
|
+
* Example: { label: "Get Started", href: "#contact" }
|
|
50
|
+
*/
|
|
51
|
+
ctaButton?: {
|
|
52
|
+
label: string;
|
|
53
|
+
href: string;
|
|
54
|
+
} | null;
|
|
55
|
+
/** Primary CTA button styles */
|
|
56
|
+
ctaButtonStyle?: {
|
|
57
|
+
unstyled?: boolean;
|
|
58
|
+
style?: React.CSSProperties;
|
|
59
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
60
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
61
|
+
className?: string;
|
|
62
|
+
};
|
|
63
|
+
/** Optional wrapper slot for the primary CTA */
|
|
64
|
+
ctaButtonWrapper?: {
|
|
65
|
+
className?: string;
|
|
66
|
+
};
|
|
67
|
+
/** Optional secondary action */
|
|
68
|
+
secondaryButton?: {
|
|
69
|
+
label: string;
|
|
70
|
+
href: string;
|
|
71
|
+
} | null;
|
|
72
|
+
/** Secondary CTA button styles */
|
|
73
|
+
secondaryButtonStyle?: {
|
|
74
|
+
unstyled?: boolean;
|
|
75
|
+
style?: React.CSSProperties;
|
|
76
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
77
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
78
|
+
className?: string;
|
|
79
|
+
};
|
|
80
|
+
/** Optional wrapper slot for the secondary CTA */
|
|
81
|
+
secondaryButtonWrapper?: {
|
|
82
|
+
className?: string;
|
|
83
|
+
};
|
|
84
|
+
/**
|
|
85
|
+
* Legacy spacing hook applied to the heading.
|
|
86
|
+
* @deprecated Prefer margin utilities via headingText.className
|
|
87
|
+
*/
|
|
88
|
+
spacing?: {
|
|
89
|
+
topMargin?: string;
|
|
90
|
+
};
|
|
91
|
+
/** Accessibility */
|
|
92
|
+
ariaLabel?: string;
|
|
93
|
+
role?: string;
|
|
94
|
+
}
|
|
95
|
+
/**
|
|
96
|
+
* Call-to-Action section with a heading, optional subheading/description,
|
|
97
|
+
* and up to two actions (primary and secondary).
|
|
98
|
+
*
|
|
99
|
+
* @remarks
|
|
100
|
+
* - Styling: exposes slot-style className overrides (section, container,
|
|
101
|
+
* contentWrapper, headingText, subheadingText, descriptionText, actionsWrapper,
|
|
102
|
+
* ctaButtonStyle, secondaryButtonStyle). Consumer classes are merged after
|
|
103
|
+
* defaults via cn().
|
|
104
|
+
* - Accessibility: rendered as a semantic <section> with aria-label. The role
|
|
105
|
+
* defaults to "region" but can be customized with the role prop.
|
|
106
|
+
* - Motion: subtle hover lift effects on buttons are included by default.
|
|
107
|
+
*
|
|
108
|
+
* @example
|
|
109
|
+
* <CTA
|
|
110
|
+
* headingText={{ text: "Join The Launch Today!" }}
|
|
111
|
+
* descriptionText={{ text: "Start your free trial in minutes." }}
|
|
112
|
+
* ctaButton={{ label: "Sign Up", href: "#contact" }}
|
|
113
|
+
* secondaryButton={{ label: "Learn More", href: "#features" }}
|
|
114
|
+
* />
|
|
115
|
+
*/
|
|
116
|
+
export declare function CTA({ id, className, section, container, contentWrapper, headingText, subheadingText, descriptionText, actionsWrapper, ctaButton, ctaButtonStyle, ctaButtonWrapper, secondaryButton, secondaryButtonStyle, secondaryButtonWrapper, spacing, ariaLabel, role, }: CTAProps): React.JSX.Element;
|
|
117
|
+
export {};
|
|
118
|
+
//# sourceMappingURL=CTA.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CTA.d.ts","sourceRoot":"","sources":["../../src/components/CTA.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
type FieldType = "text" | "email" | "tel" | "textarea";
|
|
3
|
+
/**
|
|
4
|
+
* Configuration for a single form field in the Contact section.
|
|
5
|
+
* @public
|
|
6
|
+
*/
|
|
7
|
+
export interface ContactField {
|
|
8
|
+
/** Unique id/name for the field. Used for htmlFor and form submission. */
|
|
9
|
+
id: string;
|
|
10
|
+
/** Visible label text for the field */
|
|
11
|
+
label: string;
|
|
12
|
+
/** Placeholder text rendered inside the input */
|
|
13
|
+
placeholder?: string;
|
|
14
|
+
/** Whether the field is required for form submission */
|
|
15
|
+
required?: boolean;
|
|
16
|
+
/** Type of field to render (text, email, tel, textarea). */
|
|
17
|
+
type?: FieldType;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Props for the Contact section component.
|
|
21
|
+
*
|
|
22
|
+
* @remarks
|
|
23
|
+
* - Styling: exposes slot-style className overrides (section, container,
|
|
24
|
+
* headerWrapper, headerText, subheaderText, form, fieldsWrapper, field,
|
|
25
|
+
* label, input, textarea, submitButtonWrapper, submitButtonStyle). Consumer
|
|
26
|
+
* classes are merged after defaults via cn().
|
|
27
|
+
* - Behavior: onSubmit is called with the form event after default
|
|
28
|
+
* prevention. Provide your own handler to integrate with APIs.
|
|
29
|
+
* - Motion: controlled by enableMotion; when false, removes button hover lift.
|
|
30
|
+
* - Accessibility: rendered as a semantic <section> with aria-label.
|
|
31
|
+
*/
|
|
32
|
+
export interface ContactProps {
|
|
33
|
+
/** Array of fields to render in the form. @defaultValue defaultFormData */
|
|
34
|
+
fields?: ContactField[];
|
|
35
|
+
/** Heading text above the form. @defaultValue "Ready to Grow Your Business?" */
|
|
36
|
+
contactHeaderText?: string;
|
|
37
|
+
/** Subheading under the header. @defaultValue "Schedule a free consultation with our experts." */
|
|
38
|
+
contactSubHeaderText?: string;
|
|
39
|
+
/** Optional id to attach to the root section element. @defaultValue "contact" */
|
|
40
|
+
id?: string;
|
|
41
|
+
/** Optional top-level class to override the section root */
|
|
42
|
+
className?: string;
|
|
43
|
+
/** Styling configuration objects (slots) */
|
|
44
|
+
section?: {
|
|
45
|
+
className?: string;
|
|
46
|
+
};
|
|
47
|
+
container?: {
|
|
48
|
+
className?: string;
|
|
49
|
+
};
|
|
50
|
+
headerWrapper?: {
|
|
51
|
+
className?: string;
|
|
52
|
+
};
|
|
53
|
+
headerText?: {
|
|
54
|
+
className?: string;
|
|
55
|
+
};
|
|
56
|
+
subheaderText?: {
|
|
57
|
+
className?: string;
|
|
58
|
+
};
|
|
59
|
+
form?: {
|
|
60
|
+
className?: string;
|
|
61
|
+
};
|
|
62
|
+
fieldsWrapper?: {
|
|
63
|
+
className?: string;
|
|
64
|
+
};
|
|
65
|
+
field?: {
|
|
66
|
+
className?: string;
|
|
67
|
+
};
|
|
68
|
+
label?: {
|
|
69
|
+
className?: string;
|
|
70
|
+
};
|
|
71
|
+
input?: {
|
|
72
|
+
className?: string;
|
|
73
|
+
};
|
|
74
|
+
textarea?: {
|
|
75
|
+
className?: string;
|
|
76
|
+
};
|
|
77
|
+
submitButtonWrapper?: {
|
|
78
|
+
className?: string;
|
|
79
|
+
};
|
|
80
|
+
submitButtonStyle?: {
|
|
81
|
+
unstyled?: boolean;
|
|
82
|
+
style?: React.CSSProperties;
|
|
83
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
84
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
85
|
+
className?: string;
|
|
86
|
+
};
|
|
87
|
+
/** Text for the submit button. @defaultValue "Schedule Free Consultation" */
|
|
88
|
+
submitButtonText?: string;
|
|
89
|
+
/** Callback fired on submit; default prevented. */
|
|
90
|
+
onSubmit?: (e: React.FormEvent<HTMLFormElement>) => void;
|
|
91
|
+
/** ARIA label for the section. @defaultValue "Contact section" */
|
|
92
|
+
ariaLabel?: string;
|
|
93
|
+
/** When false, removes hover lift/transition on the submit button */
|
|
94
|
+
enableMotion?: boolean;
|
|
95
|
+
}
|
|
96
|
+
/**
|
|
97
|
+
* Contact section with a configurable form and submit action.
|
|
98
|
+
*
|
|
99
|
+
* @remarks
|
|
100
|
+
* - Styling: slot-style className overrides are merged via cn().
|
|
101
|
+
* - Behavior: onSubmit is invoked with the form event after calling
|
|
102
|
+
* preventDefault().
|
|
103
|
+
* - Motion: enableMotion toggles the button hover lift/transition.
|
|
104
|
+
* - Accessibility: Uses a semantic <section> with aria-label.
|
|
105
|
+
*
|
|
106
|
+
* @example
|
|
107
|
+
* <Contact onSubmit={(e) => { // send to your API }} />
|
|
108
|
+
*/
|
|
109
|
+
export declare function Contact({ fields, contactHeaderText, contactSubHeaderText, id, className, section, container, headerWrapper, headerText, subheaderText, form, fieldsWrapper, field, label, input, textarea, submitButtonWrapper, submitButtonStyle, submitButtonText, onSubmit, ariaLabel, enableMotion, }: ContactProps): React.JSX.Element;
|
|
110
|
+
export {};
|
|
111
|
+
//# sourceMappingURL=Contact.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Contact.d.ts","sourceRoot":"","sources":["../../src/components/Contact.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Represents a single FAQ item.
|
|
4
|
+
* @public
|
|
5
|
+
*/
|
|
6
|
+
export interface FAQS {
|
|
7
|
+
/** The question text */
|
|
8
|
+
question?: string;
|
|
9
|
+
/** The answer text */
|
|
10
|
+
answer?: string;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Props for the FAQ section component.
|
|
14
|
+
*
|
|
15
|
+
* @remarks
|
|
16
|
+
* - Styling: exposes slot-style className overrides; consumer classes are
|
|
17
|
+
* merged after defaults via cn().
|
|
18
|
+
* - Behavior: supports single or multiple open items; default open indices
|
|
19
|
+
* are respected. Controlled internally with a Set.
|
|
20
|
+
* - Motion: when enableMotion is false, collapse/expand transitions are
|
|
21
|
+
* removed for a hard-cut.
|
|
22
|
+
* - Accessibility: each item uses button+region with aria-controls and
|
|
23
|
+
* aria-expanded. Section uses aria-label.
|
|
24
|
+
*/
|
|
25
|
+
export interface FAQProps {
|
|
26
|
+
/** Header text displayed at the top of the FAQ section. @defaultValue "Frequently Asked Questions" */
|
|
27
|
+
faqSectionHeaderText?: string;
|
|
28
|
+
/** Array of question/answer items. @defaultValue defaultFaqData */
|
|
29
|
+
faqData?: FAQS[];
|
|
30
|
+
/** Optional id for the section root. @defaultValue "faq" */
|
|
31
|
+
sectionId?: string;
|
|
32
|
+
/** Optional top-level class override */
|
|
33
|
+
className?: string;
|
|
34
|
+
/** When false, only one item can be open at a time. @defaultValue true */
|
|
35
|
+
allowMultipleOpen?: boolean;
|
|
36
|
+
/** Indices of items that should be open by default. @defaultValue [] */
|
|
37
|
+
defaultOpenIndices?: number[];
|
|
38
|
+
/** Optional icons for open/closed states */
|
|
39
|
+
openIcon?: React.ReactNode;
|
|
40
|
+
closedIcon?: React.ReactNode;
|
|
41
|
+
/** ARIA label for the FAQ section. @defaultValue "Frequently asked questions section" */
|
|
42
|
+
ariaLabel?: string;
|
|
43
|
+
/** Slot-style overrides */
|
|
44
|
+
section?: {
|
|
45
|
+
className?: string;
|
|
46
|
+
};
|
|
47
|
+
container?: {
|
|
48
|
+
className?: string;
|
|
49
|
+
};
|
|
50
|
+
heading?: {
|
|
51
|
+
className?: string;
|
|
52
|
+
};
|
|
53
|
+
grid?: {
|
|
54
|
+
className?: string;
|
|
55
|
+
};
|
|
56
|
+
item?: {
|
|
57
|
+
className?: string;
|
|
58
|
+
};
|
|
59
|
+
questionButton?: {
|
|
60
|
+
className?: string;
|
|
61
|
+
};
|
|
62
|
+
questionText?: {
|
|
63
|
+
className?: string;
|
|
64
|
+
};
|
|
65
|
+
chevronIcon?: {
|
|
66
|
+
className?: string;
|
|
67
|
+
};
|
|
68
|
+
answer?: {
|
|
69
|
+
className?: string;
|
|
70
|
+
};
|
|
71
|
+
answerText?: {
|
|
72
|
+
className?: string;
|
|
73
|
+
};
|
|
74
|
+
/** When false, removes transition on collapse/expand for a hard-cut */
|
|
75
|
+
enableMotion?: boolean;
|
|
76
|
+
}
|
|
77
|
+
/**
|
|
78
|
+
* Expandable FAQ section with accessible toggles and optional icons.
|
|
79
|
+
*
|
|
80
|
+
* @remarks
|
|
81
|
+
* - Supports multiple or single open item behavior via allowMultipleOpen.
|
|
82
|
+
* - Uses button with aria-expanded and a region with aria-labelledby.
|
|
83
|
+
* - Motion can be disabled via enableMotion for reduced animation.
|
|
84
|
+
*
|
|
85
|
+
* @example
|
|
86
|
+
* <FAQ faqData={[{ question: 'What is X?', answer: 'Y' }]} />
|
|
87
|
+
*/
|
|
88
|
+
export declare function FAQ({ faqSectionHeaderText, faqData, sectionId, className, allowMultipleOpen, defaultOpenIndices, openIcon, closedIcon, ariaLabel, section, container, heading, grid, item, questionButton, questionText, chevronIcon, answer, answerText, enableMotion, }: FAQProps): React.JSX.Element;
|
|
89
|
+
//# sourceMappingURL=FAQ.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FAQ.d.ts","sourceRoot":"","sources":["../../src/components/FAQ.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAKjD;;;GAGG;AACH,MAAM,WAAW,IAAI;IACnB,wBAAwB;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sBAAsB;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,QAAQ;IACvB,sGAAsG;IACtG,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,mEAAmE;IACnE,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC;IACjB,4DAA4D;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wCAAwC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,wEAAwE;IACxE,kBAAkB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC9B,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,yFAAyF;IACzF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,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,OAAO,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjC,IAAI,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9B,IAAI,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9B,cAAc,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACxC,YAAY,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtC,WAAW,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,MAAM,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAChC,UAAU,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACpC,uEAAuE;IACvE,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAkCD;;;;;;;;;;GAUG;AACH,wBAAgB,GAAG,CAAC,EAClB,oBAAmD,EACnD,OAAwB,EACxB,SAAiB,EACjB,SAAS,EACT,iBAAwB,EACxB,kBAAuB,EACvB,QAAQ,EACR,UAAU,EACV,SAAgD,EAChD,OAA8D,EAC9D,SAA8C,EAC9C,OAEC,EACD,IAAsE,EACtE,IAA4B,EAC5B,cAGC,EACD,YAAgC,EAChC,WAAgE,EAChE,MAGC,EACD,UAA6C,EAC7C,YAAmB,GACpB,EAAE,QAAQ,qBAyFV"}
|