@promakeai/cli 0.0.6 → 0.1.0
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/index.js +2 -2
- package/dist/registry/about-page.json +4 -2
- package/dist/registry/about-section.json +2 -2
- package/dist/registry/announcement-bar.json +43 -0
- package/dist/registry/auth-core.json +43 -0
- package/dist/registry/auth.json +1 -1
- package/dist/registry/blog-list-page.json +3 -2
- package/dist/registry/blog-section.json +1 -1
- package/dist/registry/cart-page.json +3 -3
- package/dist/registry/case-study-page.json +48 -0
- package/dist/registry/checkout-page.json +6 -5
- package/dist/registry/coming-soon-page-minimal.json +45 -0
- package/dist/registry/coming-soon-page.json +47 -0
- package/dist/registry/contact-info-grid.json +1 -1
- package/dist/registry/contact-page-centered.json +2 -2
- package/dist/registry/contact-page-map-overlay.json +4 -3
- package/dist/registry/contact-page-map-split.json +4 -3
- package/dist/registry/contact-page-split.json +3 -3
- package/dist/registry/contact-page.json +5 -3
- package/dist/registry/cookie-consent.json +43 -0
- package/dist/registry/cookies-page.json +3 -1
- package/dist/registry/cta-section.json +1 -1
- package/dist/registry/db.json +1 -1
- package/dist/registry/docs/about-page.md +5 -0
- package/dist/registry/docs/announcement-bar.md +38 -0
- package/dist/registry/docs/auth-core.md +64 -0
- package/dist/registry/docs/blog-list-page.md +1 -0
- package/dist/registry/docs/case-study-page.md +39 -0
- package/dist/registry/docs/checkout-page.md +2 -1
- package/dist/registry/docs/coming-soon-page-minimal.md +32 -0
- package/dist/registry/docs/coming-soon-page.md +37 -0
- package/dist/registry/docs/contact-page-map-overlay.md +2 -2
- package/dist/registry/docs/contact-page-map-split.md +2 -2
- package/dist/registry/docs/contact-page.md +5 -0
- package/dist/registry/docs/cookie-consent.md +37 -0
- package/dist/registry/docs/cookies-page.md +5 -0
- package/dist/registry/docs/ecommerce-core.md +4 -3
- package/dist/registry/docs/forgot-password-page-split.md +45 -0
- package/dist/registry/docs/forgot-password-page.md +14 -5
- package/dist/registry/docs/header-ecommerce.md +1 -0
- package/dist/registry/docs/hero-carousel.md +37 -0
- package/dist/registry/docs/landing-page-app.md +43 -0
- package/dist/registry/docs/landing-page-saas.md +41 -0
- package/dist/registry/docs/login-page-split.md +13 -4
- package/dist/registry/docs/login-page.md +17 -4
- package/dist/registry/docs/logo-cloud.md +33 -0
- package/dist/registry/docs/masonry-grid.md +37 -0
- package/dist/registry/docs/my-orders-page.md +44 -0
- package/dist/registry/docs/order-confirmation-page.md +41 -0
- package/dist/registry/docs/portfolio-page.md +38 -0
- package/dist/registry/docs/pricing-page.md +38 -0
- package/dist/registry/docs/privacy-page.md +5 -0
- package/dist/registry/docs/product-quick-view.md +37 -0
- package/dist/registry/docs/reading-progress.md +31 -0
- package/dist/registry/docs/register-page-split.md +45 -0
- package/dist/registry/docs/register-page.md +14 -7
- package/dist/registry/docs/reset-password-page-split.md +45 -0
- package/dist/registry/docs/reset-password-page.md +36 -0
- package/dist/registry/docs/share-buttons.md +37 -0
- package/dist/registry/docs/team-page.md +38 -0
- package/dist/registry/docs/terms-page.md +5 -0
- package/dist/registry/docs/timeline-section.md +37 -0
- package/dist/registry/docs/video-hero.md +41 -0
- package/dist/registry/ecommerce-core.json +17 -1
- package/dist/registry/empty-page.json +1 -1
- package/dist/registry/faq-categorized.json +1 -1
- package/dist/registry/faq-simple.json +1 -1
- package/dist/registry/favorites-ecommerce-block.json +1 -1
- package/dist/registry/feature-section.json +2 -2
- package/dist/registry/footer.json +1 -1
- package/dist/registry/forgot-password-page-split.json +50 -0
- package/dist/registry/forgot-password-page.json +9 -7
- package/dist/registry/header-ecommerce.json +3 -2
- package/dist/registry/header-mega.json +1 -1
- package/dist/registry/hero-carousel.json +45 -0
- package/dist/registry/hero-cta.json +2 -2
- package/dist/registry/hero-gradient.json +1 -1
- package/dist/registry/hero.json +1 -1
- package/dist/registry/index.json +22 -2
- package/dist/registry/landing-page-app.json +47 -0
- package/dist/registry/landing-page-saas.json +47 -0
- package/dist/registry/login-page-split.json +11 -7
- package/dist/registry/login-page.json +4 -4
- package/dist/registry/logo-cloud.json +41 -0
- package/dist/registry/masonry-grid.json +43 -0
- package/dist/registry/my-orders-page.json +52 -0
- package/dist/registry/order-confirmation-page.json +49 -0
- package/dist/registry/portfolio-page.json +45 -0
- package/dist/registry/pricing-page.json +47 -0
- package/dist/registry/pricing-section.json +1 -1
- package/dist/registry/privacy-page.json +3 -1
- package/dist/registry/product-detail-block.json +1 -1
- package/dist/registry/product-quick-view.json +46 -0
- package/dist/registry/products-page.json +3 -3
- package/dist/registry/reading-progress.json +43 -0
- package/dist/registry/register-page-split.json +50 -0
- package/dist/registry/register-page.json +9 -7
- package/dist/registry/reset-password-page-split.json +50 -0
- package/dist/registry/reset-password-page.json +39 -0
- package/dist/registry/share-buttons.json +46 -0
- package/dist/registry/team-page.json +47 -0
- package/dist/registry/terms-page.json +3 -1
- package/dist/registry/testimonials-carousel.json +1 -1
- package/dist/registry/testimonials-grid.json +1 -1
- package/dist/registry/timeline-section.json +43 -0
- package/dist/registry/video-hero.json +42 -0
- package/package.json +1 -1
- package/template/index.html +5 -5
- package/template/src/App.tsx +4 -0
- package/template/src/components/GoogleAnalytics.tsx +34 -0
- package/template/src/components/Layout.tsx +1 -1
- package/template/src/components/ScriptInjector.tsx +62 -0
- package/template/src/constants/constants.json +8 -2
- package/template/src/pages/Index.tsx +5 -1
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
# Coming Soon Page (Minimal)
|
|
2
|
+
|
|
3
|
+
Minimalist coming soon page with large typography, days countdown, and simple email input. Clean design with focus on the launch date number.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/coming-soon-page-minimal/index.ts` | index |
|
|
10
|
+
| `$modules$/coming-soon-page-minimal/coming-soon-page-minimal.tsx` | page |
|
|
11
|
+
| `$modules$/coming-soon-page-minimal/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/coming-soon-page-minimal/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `ComingSoonPageMinimal`, `default`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { ComingSoonPageMinimal, default } from '@/modules/coming-soon-page-minimal';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import { ComingSoonPageMinimal } from '@/modules/coming-soon-page-minimal';
|
|
26
|
+
|
|
27
|
+
<Route path="/coming-soon" element={<ComingSoonPageMinimal />} />
|
|
28
|
+
|
|
29
|
+
• Large countdown number display
|
|
30
|
+
• Minimal email signup
|
|
31
|
+
• Customizable launch date
|
|
32
|
+
```
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
# Coming Soon Page
|
|
2
|
+
|
|
3
|
+
Full-featured coming soon page with countdown timer, email signup form, social links, and gradient background. Includes FadeIn and ScaleUp animations. Perfect for product launches and pre-release marketing.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/coming-soon-page/index.ts` | index |
|
|
10
|
+
| `$modules$/coming-soon-page/coming-soon-page.tsx` | page |
|
|
11
|
+
| `$modules$/coming-soon-page/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/coming-soon-page/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `ComingSoonPage`, `default`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { ComingSoonPage, default } from '@/modules/coming-soon-page';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import { ComingSoonPage } from '@/modules/coming-soon-page';
|
|
26
|
+
|
|
27
|
+
<Route path="/coming-soon" element={<ComingSoonPage />} />
|
|
28
|
+
|
|
29
|
+
• Customizable launch date via launchDate prop
|
|
30
|
+
• Email signup with success state
|
|
31
|
+
• Social links (Twitter, Instagram, GitHub, LinkedIn)
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
## Dependencies
|
|
35
|
+
|
|
36
|
+
This component requires:
|
|
37
|
+
- `animations`
|
|
@@ -13,10 +13,10 @@ Stunning full-screen Google Map background with glassmorphism contact form and i
|
|
|
13
13
|
|
|
14
14
|
## Exports
|
|
15
15
|
|
|
16
|
-
**Components/Functions:** `ContactPageMapOverlay`
|
|
16
|
+
**Components/Functions:** `ContactPageMapOverlay`, `default`
|
|
17
17
|
|
|
18
18
|
```typescript
|
|
19
|
-
import { ContactPageMapOverlay } from '@/modules/contact-page-map-overlay';
|
|
19
|
+
import { ContactPageMapOverlay, default } from '@/modules/contact-page-map-overlay';
|
|
20
20
|
```
|
|
21
21
|
|
|
22
22
|
## Usage
|
|
@@ -13,10 +13,10 @@ Modern 50/50 split layout contact page with contact form on the left and full-he
|
|
|
13
13
|
|
|
14
14
|
## Exports
|
|
15
15
|
|
|
16
|
-
**Components/Functions:** `ContactPageMapSplit`
|
|
16
|
+
**Components/Functions:** `ContactPageMapSplit`, `default`
|
|
17
17
|
|
|
18
18
|
```typescript
|
|
19
|
-
import { ContactPageMapSplit } from '@/modules/contact-page-map-split';
|
|
19
|
+
import { ContactPageMapSplit, default } from '@/modules/contact-page-map-split';
|
|
20
20
|
```
|
|
21
21
|
|
|
22
22
|
## Usage
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
# Cookie Consent Banner
|
|
2
|
+
|
|
3
|
+
GDPR-compliant cookie consent banner with Accept, Decline, and Customize buttons. Features slide-up animation, localStorage persistence, and customizable links to privacy/cookie policy pages.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/cookie-consent/index.ts` | index |
|
|
10
|
+
| `$modules$/cookie-consent/cookie-consent.tsx` | component |
|
|
11
|
+
| `$modules$/cookie-consent/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/cookie-consent/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `CookieConsent`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { CookieConsent } from '@/modules/cookie-consent';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import { CookieConsent } from '@/modules/cookie-consent';
|
|
26
|
+
|
|
27
|
+
// Add to your App or Layout component
|
|
28
|
+
<CookieConsent
|
|
29
|
+
onAccept={() => console.log('Accepted')}
|
|
30
|
+
onDecline={() => console.log('Declined')}
|
|
31
|
+
onCustomize={() => openPreferencesModal()}
|
|
32
|
+
/>
|
|
33
|
+
|
|
34
|
+
• Auto-hides after user decision
|
|
35
|
+
• localStorage persistence
|
|
36
|
+
• Customizable policy URLs
|
|
37
|
+
```
|
|
@@ -13,17 +13,18 @@ Complete e-commerce state management with Zustand. Includes useCartStore for sho
|
|
|
13
13
|
| `$modules$/ecommerce-core/useProducts.ts` | hook |
|
|
14
14
|
| `$modules$/ecommerce-core/useSearch.ts` | hook |
|
|
15
15
|
| `$modules$/ecommerce-core/format-price.ts` | lib |
|
|
16
|
+
| `$modules$/ecommerce-core/payment-config.ts` | lib |
|
|
16
17
|
| `$modules$/ecommerce-core/lang/en.json` | lang |
|
|
17
18
|
| `$modules$/ecommerce-core/lang/tr.json` | lang |
|
|
18
19
|
|
|
19
20
|
## Exports
|
|
20
21
|
|
|
21
|
-
**Types:** `Address`, `CartContextType`, `CartItem`, `CartState`, `Category`, `FavoritesContextType`, `Order`, `OrderItem`, `Product`, `ProductCategory`, `ProductVariant`, `User`
|
|
22
|
+
**Types:** `Address`, `CartContextType`, `CartItem`, `CartState`, `Category`, `FavoritesContextType`, `OnlinePaymentProvider`, `Order`, `OrderItem`, `PaymentMethod`, `PaymentMethodConfig`, `Product`, `ProductCategory`, `ProductVariant`, `User`
|
|
22
23
|
|
|
23
|
-
**Components/Functions:** `formatPrice`, `useCart`, `useCartStore`, `useCategories`, `useFavorites`, `useFavoritesStore`, `useFeaturedProducts`, `useProductBySlug`, `useProducts`, `useSearch`
|
|
24
|
+
**Components/Functions:** `ONLINE_PROVIDER_CONFIGS`, `PAYMENT_METHOD_CONFIGS`, `formatPrice`, `getAvailablePaymentMethods`, `getFilteredPaymentMethodConfigs`, `getOnlinePaymentProviders`, `isOnlineProviderAvailable`, `isPaymentMethodAvailable`, `useCart`, `useCartStore`, `useCategories`, `useFavorites`, `useFavoritesStore`, `useFeaturedProducts`, `useProductBySlug`, `useProducts`, `useSearch`
|
|
24
25
|
|
|
25
26
|
```typescript
|
|
26
|
-
import {
|
|
27
|
+
import { ONLINE_PROVIDER_CONFIGS, PAYMENT_METHOD_CONFIGS, formatPrice, ... } from '@/modules/ecommerce-core';
|
|
27
28
|
```
|
|
28
29
|
|
|
29
30
|
## Usage
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
# Forgot Password Page Split
|
|
2
|
+
|
|
3
|
+
Split-screen password recovery page with form on the left and full-height image on the right. Features email form with success state after submission. Uses customerClient for API calls.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/forgot-password-page-split/index.ts` | index |
|
|
10
|
+
| `$modules$/forgot-password-page-split/forgot-password-page-split.tsx` | page |
|
|
11
|
+
| `$modules$/forgot-password-page-split/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/forgot-password-page-split/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `ForgotPasswordPageSplit`, `default`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { ForgotPasswordPageSplit, default } from '@/modules/forgot-password-page-split';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import ForgotPasswordPageSplit from '@/modules/forgot-password-page-split';
|
|
26
|
+
|
|
27
|
+
<ForgotPasswordPageSplit
|
|
28
|
+
image="/images/forgot-bg.jpg"
|
|
29
|
+
/>
|
|
30
|
+
|
|
31
|
+
• Installed at: src/modules/forgot-password-page-split/
|
|
32
|
+
• Customize text: src/modules/forgot-password-page-split/lang/*.json
|
|
33
|
+
• API Integration:
|
|
34
|
+
- customerClient.auth.forgotPassword() for sending reset email
|
|
35
|
+
- Shows success state after email sent
|
|
36
|
+
• Add to your router as a page component
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
## Dependencies
|
|
40
|
+
|
|
41
|
+
This component requires:
|
|
42
|
+
- `button`
|
|
43
|
+
- `input`
|
|
44
|
+
- `auth-core`
|
|
45
|
+
- `api`
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Forgot Password Page
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Centered card password recovery page with Layout wrapper. Two-step flow: request reset code then enter code with new password. Uses useAuth hook from auth-core for API calls.
|
|
4
4
|
|
|
5
5
|
## Files
|
|
6
6
|
|
|
@@ -24,9 +24,16 @@ import { ForgotPasswordPage, default } from '@/modules/forgot-password-page';
|
|
|
24
24
|
```
|
|
25
25
|
import ForgotPasswordPage from '@/modules/forgot-password-page';
|
|
26
26
|
|
|
27
|
-
<ForgotPasswordPage
|
|
28
|
-
|
|
29
|
-
|
|
27
|
+
<ForgotPasswordPage />
|
|
28
|
+
|
|
29
|
+
• Installed at: src/modules/forgot-password-page/
|
|
30
|
+
• Customize text: src/modules/forgot-password-page/lang/*.json
|
|
31
|
+
• Uses useAuth() hook from auth-core:
|
|
32
|
+
const { forgotPassword, resetPassword } = useAuth();
|
|
33
|
+
await forgotPassword(username);
|
|
34
|
+
await resetPassword(username, code, newPassword);
|
|
35
|
+
• Two-step flow: request code -> enter code with new password
|
|
36
|
+
• Add to your router as a page component
|
|
30
37
|
```
|
|
31
38
|
|
|
32
39
|
## Dependencies
|
|
@@ -34,4 +41,6 @@ import ForgotPasswordPage from '@/modules/forgot-password-page';
|
|
|
34
41
|
This component requires:
|
|
35
42
|
- `button`
|
|
36
43
|
- `input`
|
|
37
|
-
- `
|
|
44
|
+
- `card`
|
|
45
|
+
- `auth-core`
|
|
46
|
+
- `api`
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
# Hero Carousel
|
|
2
|
+
|
|
3
|
+
Full-width hero carousel with auto-play and touch support. Features navigation dots, arrows, and configurable interval.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/hero-carousel/hero-carousel.tsx` | component |
|
|
10
|
+
| `$modules$/hero-carousel/index.ts` | index |
|
|
11
|
+
| `$modules$/hero-carousel/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/hero-carousel/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `HeroCarousel`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { HeroCarousel } from '@/modules/hero-carousel';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import { HeroCarousel } from '@/modules/hero-carousel';
|
|
26
|
+
|
|
27
|
+
<HeroCarousel />
|
|
28
|
+
|
|
29
|
+
• Installed at: src/modules/hero-carousel/
|
|
30
|
+
• Customize content: lang/en/hero-carousel.json
|
|
31
|
+
• Props: slides[], autoPlay, interval, showDots, showArrows, pauseOnHover
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
## Dependencies
|
|
35
|
+
|
|
36
|
+
This component requires:
|
|
37
|
+
- `button`
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
# Mobile App Landing Page
|
|
2
|
+
|
|
3
|
+
Mobile app promotion landing page with phone mockup hero, App Store/Play Store download buttons, 4 feature cards, screenshot carousel, user reviews, and download CTA. Includes floating notification elements and FadeIn/ScaleUp animations.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/landing-page-app/index.ts` | index |
|
|
10
|
+
| `$modules$/landing-page-app/landing-page-app.tsx` | page |
|
|
11
|
+
| `$modules$/landing-page-app/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/landing-page-app/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `LandingPageApp`, `default`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { LandingPageApp, default } from '@/modules/landing-page-app';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import { LandingPageApp } from '@/modules/landing-page-app';
|
|
26
|
+
|
|
27
|
+
<Route path="/app" element={<LandingPageApp
|
|
28
|
+
appStoreUrl="https://apps.apple.com/..."
|
|
29
|
+
playStoreUrl="https://play.google.com/..."
|
|
30
|
+
/>} />
|
|
31
|
+
|
|
32
|
+
• Phone mockup with floating elements
|
|
33
|
+
• App Store & Play Store buttons
|
|
34
|
+
• 4 feature cards
|
|
35
|
+
• Screenshot carousel
|
|
36
|
+
• 3 user reviews
|
|
37
|
+
• Download CTA section
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
## Dependencies
|
|
41
|
+
|
|
42
|
+
This component requires:
|
|
43
|
+
- `animations`
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
# SaaS Landing Page
|
|
2
|
+
|
|
3
|
+
Complete SaaS product landing page with hero section, product screenshot, stats, 6 feature cards, testimonials with ratings, pricing preview with 3 tiers, and full-width CTA. Fully animated with FadeIn, StaggerContainer, and ScaleUp.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/landing-page-saas/index.ts` | index |
|
|
10
|
+
| `$modules$/landing-page-saas/landing-page-saas.tsx` | page |
|
|
11
|
+
| `$modules$/landing-page-saas/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/landing-page-saas/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `LandingPageSaas`, `default`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { LandingPageSaas, default } from '@/modules/landing-page-saas';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import { LandingPageSaas } from '@/modules/landing-page-saas';
|
|
26
|
+
|
|
27
|
+
<Route path="/" element={<LandingPageSaas />} />
|
|
28
|
+
|
|
29
|
+
• Hero with badge, headline, CTA buttons
|
|
30
|
+
• Product screenshot mockup
|
|
31
|
+
• Stats bar (users, uptime, tasks, rating)
|
|
32
|
+
• 6 feature cards with icons
|
|
33
|
+
• 3 testimonial cards
|
|
34
|
+
• 3-tier pricing preview
|
|
35
|
+
• Full-width CTA section
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
## Dependencies
|
|
39
|
+
|
|
40
|
+
This component requires:
|
|
41
|
+
- `animations`
|
|
@@ -1,22 +1,22 @@
|
|
|
1
1
|
# Login Page Split
|
|
2
2
|
|
|
3
|
-
Split-screen login page with form on the left and full-height image on the right. Features email/password fields,
|
|
3
|
+
Split-screen login page with form on the left and full-height image on the right. Features email/password fields, remember me checkbox, sign up and forgot password links. Uses customerClient for API and useAuthStore for state management.
|
|
4
4
|
|
|
5
5
|
## Files
|
|
6
6
|
|
|
7
7
|
| Target | Type |
|
|
8
8
|
|--------|------|
|
|
9
9
|
| `$modules$/login-page-split/index.ts` | index |
|
|
10
|
-
| `$modules$/login-page-split/login-page-split.tsx` |
|
|
10
|
+
| `$modules$/login-page-split/login-page-split.tsx` | page |
|
|
11
11
|
| `$modules$/login-page-split/lang/en.json` | lang |
|
|
12
12
|
| `$modules$/login-page-split/lang/tr.json` | lang |
|
|
13
13
|
|
|
14
14
|
## Exports
|
|
15
15
|
|
|
16
|
-
**Components/Functions:** `LoginPageSplit`
|
|
16
|
+
**Components/Functions:** `LoginPageSplit`, `default`
|
|
17
17
|
|
|
18
18
|
```typescript
|
|
19
|
-
import { LoginPageSplit } from '@/modules/login-page-split';
|
|
19
|
+
import { LoginPageSplit, default } from '@/modules/login-page-split';
|
|
20
20
|
```
|
|
21
21
|
|
|
22
22
|
## Usage
|
|
@@ -30,6 +30,12 @@ import LoginPageSplit from '@/modules/login-page-split';
|
|
|
30
30
|
|
|
31
31
|
• Installed at: src/modules/login-page-split/
|
|
32
32
|
• Customize text: src/modules/login-page-split/lang/*.json
|
|
33
|
+
• API Integration:
|
|
34
|
+
- customerClient.auth.login() for authentication
|
|
35
|
+
- useAuthStore for state management
|
|
36
|
+
- Automatically sets token after login
|
|
37
|
+
• Supports remember me (7 days vs default)
|
|
38
|
+
• Redirects to previous page after login
|
|
33
39
|
• Add to your router as a page component
|
|
34
40
|
```
|
|
35
41
|
|
|
@@ -38,3 +44,6 @@ import LoginPageSplit from '@/modules/login-page-split';
|
|
|
38
44
|
This component requires:
|
|
39
45
|
- `input`
|
|
40
46
|
- `button`
|
|
47
|
+
- `checkbox`
|
|
48
|
+
- `auth-core`
|
|
49
|
+
- `api`
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Login Page
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Presentational login page with email/password form, social OAuth buttons (Google, Microsoft), forgot password link, and create account link. Centered card layout with responsive design. Requires parent to handle authentication via callbacks.
|
|
4
4
|
|
|
5
5
|
## Files
|
|
6
6
|
|
|
@@ -24,11 +24,24 @@ import { LoginPage, default } from '@/modules/login-page';
|
|
|
24
24
|
```
|
|
25
25
|
import LoginPage from '@/modules/login-page';
|
|
26
26
|
|
|
27
|
+
// Presentational component - handle auth in parent
|
|
27
28
|
<LoginPage
|
|
28
|
-
onSubmit={(email, password) =>
|
|
29
|
-
|
|
30
|
-
|
|
29
|
+
onSubmit={(email, password) => {
|
|
30
|
+
// Handle login API call here
|
|
31
|
+
}}
|
|
32
|
+
onGoogleLogin={() => {
|
|
33
|
+
// Handle Google OAuth
|
|
34
|
+
}}
|
|
35
|
+
onMicrosoftLogin={() => {
|
|
36
|
+
// Handle Microsoft OAuth
|
|
37
|
+
}}
|
|
31
38
|
/>
|
|
39
|
+
|
|
40
|
+
• Installed at: src/modules/login-page/
|
|
41
|
+
• Customize text: src/modules/login-page/lang/*.json
|
|
42
|
+
• This is a presentational component - no built-in API calls
|
|
43
|
+
• Parent must handle authentication via callbacks
|
|
44
|
+
• For built-in API integration, use login-page-split instead
|
|
32
45
|
```
|
|
33
46
|
|
|
34
47
|
## Dependencies
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
# Logo Cloud
|
|
2
|
+
|
|
3
|
+
Partner/client logo marquee with infinite scroll animation. Displays logos in a smooth horizontal scroll with gradient fade edges, grayscale hover effect, and pause on hover.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/logo-cloud/logo-cloud.tsx` | component |
|
|
10
|
+
| `$modules$/logo-cloud/index.ts` | index |
|
|
11
|
+
| `$modules$/logo-cloud/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/logo-cloud/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `LogoCloud`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { LogoCloud } from '@/modules/logo-cloud';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import { LogoCloud } from '@/modules/logo-cloud';
|
|
26
|
+
|
|
27
|
+
<LogoCloud />
|
|
28
|
+
<LogoCloud speed="normal" />
|
|
29
|
+
<LogoCloud animate={false} />
|
|
30
|
+
|
|
31
|
+
• Installed at: src/modules/logo-cloud/
|
|
32
|
+
• Props: logos[], title, grayscale, animate, speed (slow|normal|fast), pauseOnHover
|
|
33
|
+
```
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
# Masonry Grid
|
|
2
|
+
|
|
3
|
+
Pinterest-style masonry grid for images with responsive columns, hover zoom effect, and lightbox modal. Supports tall, wide, and normal image spans. Uses motion/react for smooth animations.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/masonry-grid/index.ts` | index |
|
|
10
|
+
| `$modules$/masonry-grid/masonry-grid.tsx` | block |
|
|
11
|
+
| `$modules$/masonry-grid/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/masonry-grid/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `MasonryGrid`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { MasonryGrid } from '@/modules/masonry-grid';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import { MasonryGrid } from '@/modules/masonry-grid';
|
|
26
|
+
|
|
27
|
+
const images = [
|
|
28
|
+
{ id: '1', src: '/img1.jpg', alt: 'Image 1', span: 'tall' },
|
|
29
|
+
{ id: '2', src: '/img2.jpg', alt: 'Image 2', span: 'normal' },
|
|
30
|
+
];
|
|
31
|
+
|
|
32
|
+
<MasonryGrid items={images} columns={3} />
|
|
33
|
+
|
|
34
|
+
• Spans: tall, wide, normal
|
|
35
|
+
• Columns: 2, 3, or 4
|
|
36
|
+
• Click to open lightbox
|
|
37
|
+
```
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
# My Orders Page
|
|
2
|
+
|
|
3
|
+
User orders listing page with order cards showing status, date, total, and items. Requires authentication and fetches orders from API. Features loading skeleton and empty state.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/my-orders-page/index.ts` | index |
|
|
10
|
+
| `$modules$/my-orders-page/my-orders-page.tsx` | page |
|
|
11
|
+
| `$modules$/my-orders-page/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/my-orders-page/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `MyOrdersPage`, `default`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { MyOrdersPage, default } from '@/modules/my-orders-page';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import MyOrdersPage from '@/modules/my-orders-page';
|
|
26
|
+
|
|
27
|
+
<MyOrdersPage />
|
|
28
|
+
|
|
29
|
+
• Installed at: src/modules/my-orders-page/
|
|
30
|
+
• Customize text: src/modules/my-orders-page/lang/*.json
|
|
31
|
+
• Uses customerClient.orders.getMyOrders() for API
|
|
32
|
+
• Requires user to be authenticated
|
|
33
|
+
• Add to your router as a page component
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
## Dependencies
|
|
37
|
+
|
|
38
|
+
This component requires:
|
|
39
|
+
- `button`
|
|
40
|
+
- `badge`
|
|
41
|
+
- `skeleton`
|
|
42
|
+
- `auth-core`
|
|
43
|
+
- `api`
|
|
44
|
+
- `ecommerce-core`
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
# Order Confirmation Page
|
|
2
|
+
|
|
3
|
+
Post-checkout order confirmation page. Displays order summary, payment status for Stripe payments, and order details. Reads pending checkout from localStorage and clears cart on success.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/order-confirmation-page/index.ts` | index |
|
|
10
|
+
| `$modules$/order-confirmation-page/order-confirmation-page.tsx` | page |
|
|
11
|
+
| `$modules$/order-confirmation-page/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/order-confirmation-page/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `OrderConfirmationPage`, `default`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { OrderConfirmationPage, default } from '@/modules/order-confirmation-page';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import OrderConfirmationPage from '@/modules/order-confirmation-page';
|
|
26
|
+
|
|
27
|
+
<OrderConfirmationPage />
|
|
28
|
+
|
|
29
|
+
• Installed at: src/modules/order-confirmation-page/
|
|
30
|
+
• Customize text: src/modules/order-confirmation-page/lang/*.json
|
|
31
|
+
• Reads 'pending_checkout' from localStorage
|
|
32
|
+
• Checks payment status for Stripe payments
|
|
33
|
+
• Add to your router as a page component
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
## Dependencies
|
|
37
|
+
|
|
38
|
+
This component requires:
|
|
39
|
+
- `button`
|
|
40
|
+
- `api`
|
|
41
|
+
- `ecommerce-core`
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
# Portfolio Page
|
|
2
|
+
|
|
3
|
+
Filterable portfolio grid with project cards. Features category filtering, hover overlays, and smooth animations.
|
|
4
|
+
|
|
5
|
+
## Files
|
|
6
|
+
|
|
7
|
+
| Target | Type |
|
|
8
|
+
|--------|------|
|
|
9
|
+
| `$modules$/portfolio-page/portfolio-page.tsx` | component |
|
|
10
|
+
| `$modules$/portfolio-page/index.ts` | index |
|
|
11
|
+
| `$modules$/portfolio-page/lang/en.json` | lang |
|
|
12
|
+
| `$modules$/portfolio-page/lang/tr.json` | lang |
|
|
13
|
+
|
|
14
|
+
## Exports
|
|
15
|
+
|
|
16
|
+
**Components/Functions:** `PortfolioPage`, `default`
|
|
17
|
+
|
|
18
|
+
```typescript
|
|
19
|
+
import { PortfolioPage, default } from '@/modules/portfolio-page';
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
## Usage
|
|
23
|
+
|
|
24
|
+
```
|
|
25
|
+
import { PortfolioPage } from '@/modules/portfolio-page';
|
|
26
|
+
|
|
27
|
+
<PortfolioPage />
|
|
28
|
+
|
|
29
|
+
• Installed at: src/modules/portfolio-page/
|
|
30
|
+
• Customize content: lang/en/portfolio-page.json
|
|
31
|
+
• Props: items[], categories[], title, subtitle
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
## Dependencies
|
|
35
|
+
|
|
36
|
+
This component requires:
|
|
37
|
+
- `button`
|
|
38
|
+
- `animations`
|