react-speakeazii 1.0.2 → 1.0.4

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.
Files changed (15) hide show
  1. package/README.md +172 -0
  2. package/dist/components/Blogs.d.ts +45 -0
  3. package/dist/components/ContactForm.d.ts +7 -2
  4. package/dist/components/Products.d.ts +39 -0
  5. package/dist/components/Services.d.ts +36 -0
  6. package/dist/components/Testimonials.d.ts +33 -0
  7. package/dist/components/index.d.ts +7 -0
  8. package/dist/index.d.ts +4 -3
  9. package/dist/index.esm.js +1 -1
  10. package/dist/index.esm.js.map +1 -1
  11. package/dist/index.js +1 -1
  12. package/dist/index.js.map +1 -1
  13. package/dist/styles.css +1 -0
  14. package/dist/utils/helperfunctions.d.ts +3 -0
  15. package/package.json +18 -5
package/README.md CHANGED
@@ -66,6 +66,28 @@ async function fetchReviews() {
66
66
  }
67
67
  ```
68
68
 
69
+ #### Get Products
70
+
71
+ ```js
72
+ import { getProducts } from "react-speakeazii";
73
+
74
+ async function fetchReviews() {
75
+ const products = await getReviews("YOUR_API_KEY");
76
+ console.log(products);
77
+ }
78
+ ```
79
+
80
+ #### Get Services
81
+
82
+ ```js
83
+ import { getServices } from "react-speakeazii";
84
+
85
+ async function fetchReviews() {
86
+ const services = await getReviews("YOUR_API_KEY");
87
+ console.log(services);
88
+ }
89
+ ```
90
+
69
91
  #### Send Message
70
92
 
71
93
  ```js
@@ -91,6 +113,156 @@ async function contact() {
91
113
  | ------ | ------ | -------- | ------------------------------- |
92
114
  | apikey | string | ✅ | Your API key for authentication |
93
115
 
116
+ ### `ContactForm`
117
+
118
+ | Prop | Type | Required | Description |
119
+ | -------------------- | ----------------------------------------------- | -------- | --------------------------------- |
120
+ | `apiKey` | `string` | ✅ | Your API key for authentication |
121
+ | `showName` | `boolean` | ❌ | Toggle name field visibility |
122
+ | `showPhone` | `boolean` | ❌ | Toggle phone field visibility |
123
+ | `showSubject` | `boolean` | ❌ | Toggle subject field visibility |
124
+ | `nameLabel` | `string` | ❌ | Label for name field |
125
+ | `emailLabel` | `string` | ❌ | Label for email field |
126
+ | `phoneLabel` | `string` | ❌ | Label for phone field |
127
+ | `subjectLabel` | `string` | ❌ | Label for subject field |
128
+ | `messageLabel` | `string` | ❌ | Label for message field |
129
+ | `namePlaceholder` | `string` | ❌ | Placeholder for name input |
130
+ | `emailPlaceholder` | `string` | ❌ | Placeholder for email input |
131
+ | `phonePlaceholder` | `string` | ❌ | Placeholder for phone input |
132
+ | `subjectPlaceholder` | `string` | ❌ | Placeholder for subject input |
133
+ | `messagePlaceholder` | `string` | ❌ | Placeholder for message textarea |
134
+ | `sectionTitle` | `string` | ❌ | Form title text |
135
+ | `sectionSubtitle` | `string` | ❌ | Form subtitle text |
136
+ | `sectionDescription` | `string` | ❌ | Form description text |
137
+ | `submitButtonText` | `string` | ❌ | Submit button text |
138
+ | `loadingText` | `string` | ❌ | Text shown while submitting |
139
+ | `successMessage` | `string` | ❌ | Message displayed on success |
140
+ | `errorMessage` | `string` | ❌ | Message displayed on error |
141
+ | `onSubmit` | `(formData: FormData) => void \| Promise<void>` | ❌ | Custom submit handler |
142
+ | `onSuccess` | `(response?: any) => void` | ❌ | Callback on successful submission |
143
+ | `onError` | `(error: any) => void` | ❌ | Callback on submission error |
144
+ | `className` | `string` | ❌ | Root wrapper CSS class |
145
+ | `containerClassName` | `string` | ❌ | Container wrapper CSS class |
146
+ | `formClassName` | `string` | ❌ | Form element CSS class |
147
+ | `inputClassName` | `string` | ❌ | Input fields CSS class |
148
+ | `textareaClassName` | `string` | ❌ | Textarea CSS class |
149
+ | `buttonClassName` | `string` | ❌ | Submit button CSS class |
150
+ | `labelClassName` | `string` | ❌ | Label CSS class |
151
+ | `customValidation` | `(formData: FormData) => string \| null` | ❌ | Custom validation function |
152
+ | `showSuccessMessage` | `boolean` | ❌ | Toggle success message display |
153
+ | `showErrorMessage` | `boolean` | ❌ | Toggle error message display |
154
+
155
+ ### `Blogs`
156
+
157
+ | Prop | Type | Required | Description |
158
+ | ----------------------- | -------------------------------------------------------- | -------- | --------------------------------------- |
159
+ | `apiKey` | `string` | ✅ | Your API key for authentication |
160
+ | `showHeader` | `boolean` | ❌ | Toggle the header section visibility |
161
+ | `headerTitle` | `string` | ❌ | Header title text |
162
+ | `headerSubtitle` | `string` | ❌ | Header subtitle text |
163
+ | `headerBadgeText` | `string` | ❌ | Text displayed inside the header badge |
164
+ | `showHeaderBadge` | `boolean` | ❌ | Toggle header badge visibility |
165
+ | `columns` | `{ mobile?: number; tablet?: number; desktop?: number }` | ❌ | Number of grid columns per breakpoint |
166
+ | `showImage` | `boolean` | ❌ | Toggle project card image |
167
+ | `imageHeight` | `string` | ❌ | Height of the card image (e.g. `200px`) |
168
+ | `showDate` | `boolean` | ❌ | Toggle project date display |
169
+ | `showKeywords` | `boolean` | ❌ | Toggle keywords display |
170
+ | `maxKeywordsDisplay` | `number` | ❌ | Maximum number of keywords shown |
171
+ | `maxDescriptionLines` | `number` | ❌ | Max description lines before truncation |
172
+ | `contentCharacterLimit` | `number` | ❌ | Character limit for card content |
173
+ | `modalTitle` | `string` | ❌ | Title shown in the project modal |
174
+ | `showModalImage` | `boolean` | ❌ | Toggle modal image display |
175
+ | `modalSections` | `Array<keyof ResearchProject>` | ❌ | Sections to display in modal |
176
+ | `containerClassName` | `string` | ❌ | Wrapper container CSS class |
177
+ | `headerClassName` | `string` | ❌ | Header wrapper CSS class |
178
+ | `gridClassName` | `string` | ❌ | Grid layout CSS class |
179
+ | `cardClassName` | `string` | ❌ | Individual card CSS class |
180
+ | `modalClassName` | `string` | ❌ | Modal wrapper CSS class |
181
+ | `badgeClassName` | `string` | ❌ | Header badge CSS class |
182
+ | `onProjectClick` | `(project: ResearchProject) => void` | ❌ | Fired when a project card is clicked |
183
+ | `onError` | `(error: Error) => void` | ❌ | Error callback |
184
+ | `onSuccess` | `(blog: ResearchProject[]) => void` | ❌ | Fired when projects load successfully |
185
+ | `customCardRenderer` | `(project: ResearchProject) => React.ReactNode` | ❌ | Custom project card renderer |
186
+ | `customModalRenderer` | `(project: ResearchProject) => React.ReactNode` | ❌ | Custom modal renderer |
187
+
188
+ ### `Products`
189
+
190
+ | Prop | Type | Required | Description |
191
+ | --------------------- | -------------------------------------------------------- | -------- | ---------------------------------- |
192
+ | `apiKey` | `string` | ✅ | Your API key for authentication |
193
+ | `showHeader` | `boolean` | ❌ | Show or hide the header section |
194
+ | `headerTitle` | `string` | ❌ | Header title text |
195
+ | `headerSubtitle` | `string` | ❌ | Header subtitle text |
196
+ | `headerBadgeText` | `string` | ❌ | Text displayed in the header badge |
197
+ | `showHeaderBadge` | `boolean` | ❌ | Toggle header badge visibility |
198
+ | `columns` | `{ mobile?: number; tablet?: number; desktop?: number }` | ❌ | Grid column count per breakpoint |
199
+ | `showImage` | `boolean` | ❌ | Toggle image display on cards |
200
+ | `imageHeight` | `string` | ❌ | Height of the card image |
201
+ | `showDate` | `boolean` | ❌ | Toggle project date display |
202
+ | `maxDescriptionLines` | `number` | ❌ | Maximum description lines shown |
203
+ | `showKeywords` | `boolean` | ❌ | Toggle keyword display |
204
+ | `maxKeywordsDisplay` | `number` | ❌ | Maximum keywords displayed |
205
+ | `containerClassName` | `string` | ❌ | Container wrapper CSS class |
206
+ | `headerClassName` | `string` | ❌ | Header container CSS class |
207
+ | `gridClassName` | `string` | ❌ | Grid layout CSS class |
208
+ | `cardClassName` | `string` | ❌ | Individual card CSS class |
209
+ | `badgeClassName` | `string` | ❌ | Header badge CSS class |
210
+ | `onError` | `(error: Error) => void` | ❌ | Callback fired on error |
211
+ | `onSuccess` | `(blog: ResearchProject[]) => void` | ❌ | Callback fired on successful fetch |
212
+ | `customCardRenderer` | `(project: ResearchProject) => React.ReactNode` | ❌ | Custom card renderer |
213
+ | `customModalRenderer` | `(project: ResearchProject) => React.ReactNode` | ❌ | Custom modal renderer |
214
+
215
+ ### `Services`
216
+
217
+ | Prop | Type | Required | Description |
218
+ | --------------------- | -------------------------------------------------------- | -------- | ---------------------------------- |
219
+ | `apiKey` | `string` | ✅ | Your API key for authentication |
220
+ | `showHeader` | `boolean` | ❌ | Show or hide the header section |
221
+ | `headerTitle` | `string` | ❌ | Header title text |
222
+ | `headerSubtitle` | `string` | ❌ | Header subtitle text |
223
+ | `headerBadgeText` | `string` | ❌ | Text displayed in the header badge |
224
+ | `showHeaderBadge` | `boolean` | ❌ | Toggle header badge visibility |
225
+ | `columns` | `{ mobile?: number; tablet?: number; desktop?: number }` | ❌ | Grid column count per breakpoint |
226
+ | `showImage` | `boolean` | ❌ | Toggle image display on cards |
227
+ | `imageHeight` | `string` | ❌ | Height of the card image |
228
+ | `showDate` | `boolean` | ❌ | Toggle project date display |
229
+ | `maxDescriptionLines` | `number` | ❌ | Maximum description lines shown |
230
+ | `containerClassName` | `string` | ❌ | Container wrapper CSS class |
231
+ | `headerClassName` | `string` | ❌ | Header container CSS class |
232
+ | `gridClassName` | `string` | ❌ | Grid layout CSS class |
233
+ | `cardClassName` | `string` | ❌ | Individual card CSS class |
234
+ | `badgeClassName` | `string` | ❌ | Header badge CSS class |
235
+ | `onError` | `(error: Error) => void` | ❌ | Callback fired on error |
236
+ | `onSuccess` | `(blog: ResearchProject[]) => void` | ❌ | Callback fired on successful fetch |
237
+ | `customCardRenderer` | `(project: ResearchProject) => React.ReactNode` | ❌ | Custom card renderer |
238
+ | `customModalRenderer` | `(project: ResearchProject) => React.ReactNode` | ❌ | Custom modal renderer |
239
+
240
+ ### `Testimonials`
241
+
242
+ | Prop | Type | Required | Description |
243
+ | -------------------- | --------------------------------------- | -------- | ------------------------------------ |
244
+ | `apiKey` | `string` | ✅ | Your API key for authentication |
245
+ | `rows` | `number` | ❌ | Number of testimonial rows displayed |
246
+ | `marqueeSpeed` | `number` | ❌ | Scrolling speed of the marquee |
247
+ | `pauseOnHover` | `boolean` | ❌ | Pause animation when hovered |
248
+ | `gradientOverlay` | `boolean` | ❌ | Enable gradient overlay effect |
249
+ | `cardClassName` | `string` | ❌ | CSS class for testimonial cards |
250
+ | `containerClassName` | `string` | ❌ | CSS class for the container |
251
+ | `cardWidth` | `string` | ❌ | Width of each testimonial card |
252
+ | `gap` | `string` | ❌ | Gap between testimonial cards |
253
+ | `showRating` | `boolean` | ❌ | Show star rating |
254
+ | `maxContentLines` | `number` | ❌ | Maximum lines of testimonial content |
255
+ | `avatarSize` | `string` | ❌ | Size of the avatar image |
256
+ | `direction` | `"left" \| "right" \| "alternate"` | ❌ | Scroll direction of testimonials |
257
+ | `containerStyle` | `CSSProperties` | ❌ | Inline styles for the container |
258
+ | `cardStyle` | `CSSProperties` | ❌ | Inline styles for cards |
259
+ | `starColor` | `string` | ❌ | Color of rating stars |
260
+ | `showStarFill` | `boolean` | ❌ | Fill stars instead of outline |
261
+ | `loadingComponent` | `React.ReactNode` | ❌ | Custom loading state component |
262
+ | `errorComponent` | `React.ReactNode` | ❌ | Custom error state component |
263
+ | `onError` | `(error: Error) => void` | ❌ | Callback fired on error |
264
+ | `onSuccess` | `(testimonials: Testimonial[]) => void` | ❌ | Callback fired on successful fetch |
265
+
94
266
  ---
95
267
 
96
268
  ## License
package/dist/components/Blogs.d.ts ADDED
@@ -0,0 +1,45 @@
1
+ import React from "react";
2
+ export interface ResearchProject {
3
+ title: string;
4
+ summary: string;
5
+ content?: string;
6
+ image_url: string;
7
+ created_at: string;
8
+ tags: string;
9
+ }
10
+ export interface ResearchListProps {
11
+ apiKey: string;
12
+ showHeader?: boolean;
13
+ headerTitle?: string;
14
+ headerSubtitle?: string;
15
+ headerBadgeText?: string;
16
+ showHeaderBadge?: boolean;
17
+ columns?: {
18
+ mobile?: number;
19
+ tablet?: number;
20
+ desktop?: number;
21
+ };
22
+ showImage?: boolean;
23
+ imageHeight?: string;
24
+ showDate?: boolean;
25
+ showKeywords?: boolean;
26
+ maxKeywordsDisplay?: number;
27
+ maxDescriptionLines?: number;
28
+ contentCharacterLimit?: number;
29
+ modalTitle?: string;
30
+ showModalImage?: boolean;
31
+ modalSections?: Array<keyof ResearchProject>;
32
+ containerClassName?: string;
33
+ headerClassName?: string;
34
+ gridClassName?: string;
35
+ cardClassName?: string;
36
+ modalClassName?: string;
37
+ badgeClassName?: string;
38
+ onProjectClick?: (project: ResearchProject) => void;
39
+ onError?: (error: Error) => void;
40
+ onSuccess?: (blog: ResearchProject[]) => void;
41
+ customCardRenderer?: (project: ResearchProject) => React.ReactNode;
42
+ customModalRenderer?: (project: ResearchProject) => React.ReactNode;
43
+ }
44
+ export declare const Blogs: React.FC<ResearchListProps>;
45
+ export default Blogs;
package/dist/components/ContactForm.d.ts CHANGED
@@ -7,6 +7,7 @@ export interface FormData {
7
7
  message: string;
8
8
  }
9
9
  export interface ContactFormProps {
10
+ apiKey: string;
10
11
  showName?: boolean;
11
12
  showPhone?: boolean;
12
13
  showSubject?: boolean;
@@ -25,8 +26,10 @@ export interface ContactFormProps {
25
26
  sectionDescription?: string;
26
27
  submitButtonText?: string;
27
28
  loadingText?: string;
28
- onSubmit: (formData: FormData) => Promise<void> | void;
29
- onSuccess?: () => void;
29
+ successMessage?: string;
30
+ errorMessage?: string;
31
+ onSubmit?: (formData: FormData) => Promise<void> | void;
32
+ onSuccess?: (response?: any) => void;
30
33
  onError?: (error: any) => void;
31
34
  className?: string;
32
35
  containerClassName?: string;
@@ -36,6 +39,8 @@ export interface ContactFormProps {
36
39
  buttonClassName?: string;
37
40
  labelClassName?: string;
38
41
  customValidation?: (formData: FormData) => string | null;
42
+ showSuccessMessage?: boolean;
43
+ showErrorMessage?: boolean;
39
44
  }
40
45
  export declare const ContactForm: React.FC<ContactFormProps>;
41
46
  export default ContactForm;
package/dist/components/Products.d.ts ADDED
@@ -0,0 +1,39 @@
1
+ import React from "react";
2
+ export interface ResearchProject {
3
+ title: string;
4
+ content: string;
5
+ price?: string;
6
+ image_url: string;
7
+ created_at: string;
8
+ tags: string;
9
+ }
10
+ export interface ResearchListProps {
11
+ apiKey: string;
12
+ showHeader?: boolean;
13
+ headerTitle?: string;
14
+ headerSubtitle?: string;
15
+ headerBadgeText?: string;
16
+ showHeaderBadge?: boolean;
17
+ columns?: {
18
+ mobile?: number;
19
+ tablet?: number;
20
+ desktop?: number;
21
+ };
22
+ showImage?: boolean;
23
+ imageHeight?: string;
24
+ showDate?: boolean;
25
+ maxDescriptionLines?: number;
26
+ showKeywords?: boolean;
27
+ maxKeywordsDisplay?: number;
28
+ containerClassName?: string;
29
+ headerClassName?: string;
30
+ gridClassName?: string;
31
+ cardClassName?: string;
32
+ badgeClassName?: string;
33
+ onError?: (error: Error) => void;
34
+ onSuccess?: (blog: ResearchProject[]) => void;
35
+ customCardRenderer?: (project: ResearchProject) => React.ReactNode;
36
+ customModalRenderer?: (project: ResearchProject) => React.ReactNode;
37
+ }
38
+ export declare const Products: React.FC<ResearchListProps>;
39
+ export default Products;
package/dist/components/Services.d.ts ADDED
@@ -0,0 +1,36 @@
1
+ import React from "react";
2
+ export interface ResearchProject {
3
+ title: string;
4
+ description: string;
5
+ price?: string;
6
+ image_url: string;
7
+ created_at: string;
8
+ }
9
+ export interface ResearchListProps {
10
+ apiKey: string;
11
+ showHeader?: boolean;
12
+ headerTitle?: string;
13
+ headerSubtitle?: string;
14
+ headerBadgeText?: string;
15
+ showHeaderBadge?: boolean;
16
+ columns?: {
17
+ mobile?: number;
18
+ tablet?: number;
19
+ desktop?: number;
20
+ };
21
+ showImage?: boolean;
22
+ imageHeight?: string;
23
+ showDate?: boolean;
24
+ maxDescriptionLines?: number;
25
+ containerClassName?: string;
26
+ headerClassName?: string;
27
+ gridClassName?: string;
28
+ cardClassName?: string;
29
+ badgeClassName?: string;
30
+ onError?: (error: Error) => void;
31
+ onSuccess?: (blog: ResearchProject[]) => void;
32
+ customCardRenderer?: (project: ResearchProject) => React.ReactNode;
33
+ customModalRenderer?: (project: ResearchProject) => React.ReactNode;
34
+ }
35
+ export declare const Services: React.FC<ResearchListProps>;
36
+ export default Services;
package/dist/components/Testimonials.d.ts ADDED
@@ -0,0 +1,33 @@
1
+ import React, { CSSProperties } from "react";
2
+ export interface Testimonial {
3
+ name?: string;
4
+ email?: string;
5
+ comment?: string;
6
+ image_url?: string;
7
+ rating?: string;
8
+ }
9
+ export interface TestimonialsProps {
10
+ apiKey: string;
11
+ rows?: number;
12
+ marqueeSpeed?: number;
13
+ pauseOnHover?: boolean;
14
+ gradientOverlay?: boolean;
15
+ cardClassName?: string;
16
+ containerClassName?: string;
17
+ cardWidth?: string;
18
+ gap?: string;
19
+ showRating?: boolean;
20
+ maxContentLines?: number;
21
+ avatarSize?: string;
22
+ direction?: "left" | "right" | "alternate";
23
+ containerStyle?: CSSProperties;
24
+ cardStyle?: CSSProperties;
25
+ starColor?: string;
26
+ showStarFill?: boolean;
27
+ loadingComponent?: React.ReactNode;
28
+ errorComponent?: React.ReactNode;
29
+ onError?: (error: Error) => void;
30
+ onSuccess?: (testimonials: Testimonial[]) => void;
31
+ }
32
+ declare const Testimonials: React.FC<TestimonialsProps>;
33
+ export default Testimonials;
package/dist/components/index.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ import Blogs from "./Blogs";
2
+ import ContactForm from "./ContactForm";
3
+ import Products from "./Products";
4
+ import Services from "./Services";
5
+ import Testimonials from "./Testimonials";
6
+ import VisitorTracker from "./VisitTracker";
7
+ export { ContactForm, Blogs, Products, Services, Testimonials, VisitorTracker };
package/dist/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
- import VisitorTracker from "./components/VisitTracker";
2
- import { getBlogs, getReviews, sendMessage } from "./utils/helperfunctions";
3
- export { VisitorTracker, getReviews, sendMessage, getBlogs };
1
+ import { Blogs, ContactForm, Products, Services, Testimonials, VisitorTracker } from "./components";
2
+ import { getBlogs, getProducts, getReviews, getServices, sendMessage } from "./utils/helperfunctions";
3
+ import "react-speakeazii/dist/styles.css";
4
+ export { VisitorTracker, Testimonials, Services, Products, ContactForm, Blogs, getReviews, sendMessage, getBlogs, getServices, getProducts, };