pdf-catalog-generator 1.1.0

package/.claude/settings.local.json

@@ -0,0 +1,7 @@
+{
+  "permissions": {
+    "allow": [
+      "Bash(npm run build:*)"
+    ]
+  }
+}

package/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2025 Mohit
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

package/README.md

@@ -0,0 +1,71 @@
+# PDF Catalog Generator
+
+Generate beautiful product catalog PDFs from Excel, CSV, or JSON data.
+
+## Installation
+
+```bash
+npm install pdf-catalog-generator
+```
+
+## Usage
+
+```typescript
+import { generateProductCatalog } from 'pdf-catalog-generator';
+
+// From JSON
+const pdfBuffer = await generateProductCatalog({
+  products: [
+    {
+      Title: 'Product 1',
+      Description: 'Description here',
+      Image: 'https://example.com/image.jpg',
+      Price: 99.99,
+      Rating: 4.5,
+      Link: 'https://example.com/product'
+    }
+  ],
+  companyLogo: 'https://example.com/logo.png', // or base64
+  companyName: 'Your Company',
+  template: 'template1' // template1, template2, or template3
+});
+
+// From Excel file
+import { parseExcelFile } from 'pdf-catalog-generator';
+
+const products = await parseExcelFile(fileBuffer);
+const pdfBuffer = await generateProductCatalog({
+  products,
+  companyLogo: logoBase64,
+  companyName: 'Your Company',
+  template: 'template2'
+});
+
+// From CSV file
+import { parseCSVFile } from 'pdf-catalog-generator';
+
+const products = await parseCSVFile(csvString);
+const pdfBuffer = await generateProductCatalog({
+  products,
+  companyLogo: logoUrl,
+  companyName: 'Your Company',
+  template: 'template3'
+});
+```
+
+## Product Data Format
+
+Each product should have:
+- `Title` (string): Product name
+- `Description` (string): Product description
+- `Image` (string): Image URL or base64
+- `Price` (number): Product price
+- `Rating` (number): Star rating
+- `Link` (string): Buy/product link
+
+## Templates
+
+- `template1`: Grid layout with 2 columns
+- `template2`: Full-width list layout
+- `template3`: Compact grid layout
+

package/dist/generator.d.ts

@@ -0,0 +1,7 @@
+import { CatalogConfig } from './types';
+/**
+ * Generate product catalog PDF
+ * @param config Configuration with products, company info, and template choice
+ * @returns Promise<Buffer> PDF as Buffer
+ */
+export declare function generateProductCatalog(config: CatalogConfig): Promise<Buffer>;

package/dist/generator.js

@@ -0,0 +1,130 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateProductCatalog = generateProductCatalog;
+const react_1 = __importDefault(require("react"));
+const renderer_1 = require("@react-pdf/renderer");
+const templates_1 = require("./templates");
+// Create styles
+const styles = renderer_1.StyleSheet.create({
+    page: {
+        flexDirection: 'column',
+        backgroundColor: '#FFFFFF',
+    },
+    header: {
+        height: '100vh',
+        display: 'flex',
+        flexDirection: 'row',
+        alignItems: 'center',
+        alignContent: 'center',
+        padding: 10,
+        marginBottom: 5,
+    },
+    logoSection: {
+        width: '80%',
+    },
+    storeNameSection: {},
+    logo: {
+        marginRight: 10,
+        objectFit: 'contain',
+    },
+    storeName: {
+        fontSize: 35,
+        flexGrow: 1,
+        transform: 'rotate(-90deg)',
+    },
+});
+// Register emoji support
+renderer_1.Font.registerEmojiSource({
+    format: 'png',
+    url: 'https://cdnjs.cloudflare.com/ajax/libs/twemoji/14.0.2/72x72/',
+});
+/**
+ * Normalize image source for react-pdf Image component
+ * Handles URLs, data URIs, and plain base64 strings
+ * @param imageSource Image source string (URL, data URI, or base64)
+ * @returns Normalized image source string
+ */
+function normalizeImageSource(imageSource) {
+    // If already a data URI, return as-is
+    if (imageSource.startsWith('data:')) {
+        return imageSource;
+    }
+    // If it's a URL, return as-is
+    if (imageSource.startsWith('http://') || imageSource.startsWith('https://')) {
+        return imageSource;
+    }
+    // Otherwise, assume it's a base64 string and convert to data URI
+    // Try to detect image type from common base64 patterns
+    let mimeType = 'image/png'; // default
+    // Check for common base64 image signatures
+    // PNG: starts with iVBORw0KGgo
+    // JPEG: starts with /9j/4AAQ
+    // GIF: starts with R0lGODlh
+    // WebP: starts with UklGR
+    const base64Start = imageSource.substring(0, 20).toLowerCase();
+    if (base64Start.includes('ivborw0kggo') || imageSource.startsWith('iVBORw0KGgo')) {
+        mimeType = 'image/png';
+    }
+    else if (base64Start.includes('/9j/4aaq') || imageSource.startsWith('/9j/4AAQ')) {
+        mimeType = 'image/jpeg';
+    }
+    else if (base64Start.includes('r0lgodlh') || imageSource.startsWith('R0lGODlh')) {
+        mimeType = 'image/gif';
+    }
+    else if (base64Start.includes('uklgr') || imageSource.startsWith('UklGR')) {
+        mimeType = 'image/webp';
+    }
+    return `data:${mimeType};base64,${imageSource}`;
+}
+/**
+ * Generate product catalog PDF
+ * @param config Configuration with products, company info, and template choice
+ * @returns Promise<Buffer> PDF as Buffer
+ */
+async function generateProductCatalog(config) {
+    const { products, companyLogo, companyName, template = 'template1', } = config;
+    // Select template component
+    let TemplateComponent;
+    switch (template) {
+        case 'template1':
+            TemplateComponent = templates_1.Template1;
+            break;
+        case 'template2':
+            TemplateComponent = templates_1.Template2;
+            break;
+        case 'template3':
+            TemplateComponent = templates_1.Template3;
+            break;
+        case 'template4':
+            TemplateComponent = templates_1.Template4;
+            break;
+        default:
+            TemplateComponent = templates_1.Template1;
+    }
+    // Template4 handles its own page layout with headers on each page
+    if (template === 'template4') {
+        const doc = (react_1.default.createElement(renderer_1.Document, null,
+            react_1.default.createElement(renderer_1.Page, { size: "A4", style: styles.page },
+                react_1.default.createElement(templates_1.Template4, { products: products, companyLogo: companyLogo ? normalizeImageSource(companyLogo) : undefined, companyName: companyName }))));
+        const blob = await (0, renderer_1.pdf)(doc).toBlob();
+        const arrayBuffer = await blob.arrayBuffer();
+        return Buffer.from(arrayBuffer);
+    }
+    // Create PDF document for other templates
+    const doc = (react_1.default.createElement(renderer_1.Document, null,
+        react_1.default.createElement(renderer_1.Page, { size: "A4", style: styles.page },
+            react_1.default.createElement(renderer_1.View, { style: styles.header },
+                companyLogo && (react_1.default.createElement(renderer_1.View, { style: styles.logoSection },
+                    react_1.default.createElement(renderer_1.Image, { style: styles.logo, src: normalizeImageSource(companyLogo) }))),
+                react_1.default.createElement(renderer_1.View, { style: styles.storeNameSection },
+                    react_1.default.createElement(renderer_1.Text, { style: styles.storeName }, companyName)),
+                react_1.default.createElement(renderer_1.View, { break: true })),
+            react_1.default.createElement(TemplateComponent, { products: products }))));
+    // Generate PDF and return as Buffer
+    const blob = await (0, renderer_1.pdf)(doc).toBlob();
+    const arrayBuffer = await blob.arrayBuffer();
+    return Buffer.from(arrayBuffer);
+}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { generateProductCatalog } from './generator';
+export { parseExcelFile, parseCSVFile, parseCSVBuffer, parseJSON, } from './parser';
+export { Template1, Template2, Template3, Template4 } from './templates';
+export type { ProductData, CatalogConfig, TemplateProps, TemplateType, } from './types';

package/dist/index.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Template4 = exports.Template3 = exports.Template2 = exports.Template1 = exports.parseJSON = exports.parseCSVBuffer = exports.parseCSVFile = exports.parseExcelFile = exports.generateProductCatalog = void 0;
+var generator_1 = require("./generator");
+Object.defineProperty(exports, "generateProductCatalog", { enumerable: true, get: function () { return generator_1.generateProductCatalog; } });
+var parser_1 = require("./parser");
+Object.defineProperty(exports, "parseExcelFile", { enumerable: true, get: function () { return parser_1.parseExcelFile; } });
+Object.defineProperty(exports, "parseCSVFile", { enumerable: true, get: function () { return parser_1.parseCSVFile; } });
+Object.defineProperty(exports, "parseCSVBuffer", { enumerable: true, get: function () { return parser_1.parseCSVBuffer; } });
+Object.defineProperty(exports, "parseJSON", { enumerable: true, get: function () { return parser_1.parseJSON; } });
+var templates_1 = require("./templates");
+Object.defineProperty(exports, "Template1", { enumerable: true, get: function () { return templates_1.Template1; } });
+Object.defineProperty(exports, "Template2", { enumerable: true, get: function () { return templates_1.Template2; } });
+Object.defineProperty(exports, "Template3", { enumerable: true, get: function () { return templates_1.Template3; } });
+Object.defineProperty(exports, "Template4", { enumerable: true, get: function () { return templates_1.Template4; } });

package/dist/parser.d.ts

@@ -0,0 +1,17 @@
+import { ProductData } from './types';
+/**
+ * Parse Excel file buffer to product data
+ */
+export declare function parseExcelFile(buffer: Buffer): ProductData[];
+/**
+ * Parse CSV string to product data
+ */
+export declare function parseCSVFile(csvString: string): ProductData[];
+/**
+ * Parse CSV buffer to product data
+ */
+export declare function parseCSVBuffer(buffer: Buffer): ProductData[];
+/**
+ * Validate and normalize product data from JSON
+ */
+export declare function parseJSON(data: any[]): ProductData[];

package/dist/parser.js

@@ -0,0 +1,93 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseExcelFile = parseExcelFile;
+exports.parseCSVFile = parseCSVFile;
+exports.parseCSVBuffer = parseCSVBuffer;
+exports.parseJSON = parseJSON;
+const XLSX = __importStar(require("xlsx"));
+/**
+ * Parse Excel file buffer to product data
+ */
+function parseExcelFile(buffer) {
+    const workbook = XLSX.read(buffer, {
+        type: 'buffer',
+        cellDates: true,
+    });
+    const sheetName = workbook.SheetNames[0];
+    const worksheet = workbook.Sheets[sheetName];
+    const data = XLSX.utils.sheet_to_json(worksheet);
+    return data;
+}
+/**
+ * Parse CSV string to product data
+ */
+function parseCSVFile(csvString) {
+    const workbook = XLSX.read(csvString, {
+        type: 'string',
+        cellDates: true,
+    });
+    const sheetName = workbook.SheetNames[0];
+    const worksheet = workbook.Sheets[sheetName];
+    const data = XLSX.utils.sheet_to_json(worksheet);
+    return data;
+}
+/**
+ * Parse CSV buffer to product data
+ */
+function parseCSVBuffer(buffer) {
+    return parseCSVFile(buffer.toString('utf-8'));
+}
+/**
+ * Validate and normalize product data from JSON
+ */
+function parseJSON(data) {
+    if (!Array.isArray(data)) {
+        throw new Error('JSON data must be an array of products');
+    }
+    return data.map((item, index) => {
+        if (!item.Title || !item.Link) {
+            throw new Error(`Product at index ${index} is missing required fields (Title, Link)`);
+        }
+        return {
+            Title: item.Title,
+            Description: item.Description || '',
+            Image: item.Image || '',
+            Price: item.Price || 0,
+            Rating: item.Rating || 0,
+            Link: item.Link,
+        };
+    });
+}

package/dist/templates/Template1.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TemplateProps } from '../types';
+declare const Template1: React.FC<TemplateProps>;
+export default Template1;

package/dist/templates/Template1.js

@@ -0,0 +1,86 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const renderer_1 = require("@react-pdf/renderer");
+const styles = renderer_1.StyleSheet.create({
+    productContainer: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        alignItems: 'flex-start',
+        justifyContent: 'space-between',
+        marginVertical: 50,
+        marginHorizontal: 20,
+    },
+    productSection: {
+        width: '48%',
+        padding: 10,
+        marginBottom: 10,
+        backgroundColor: '#f2f2f2',
+        borderRadius: 5,
+        height: 350,
+        display: 'flex',
+        flexDirection: 'column',
+        justifyContent: 'space-between',
+    },
+    image: {
+        width: '100%',
+        height: 200,
+        objectFit: 'contain',
+        marginBottom: 10,
+    },
+    productTitleBox: {
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+    },
+    productTitle: {
+        fontSize: 14,
+        fontWeight: 'bold',
+        marginBottom: 4,
+    },
+    productRate: {
+        fontWeight: 'bold',
+    },
+    productPrice: {
+        fontSize: 12,
+        color: '#2EB62C',
+        marginTop: 4,
+        marginBottom: 4,
+    },
+    productDescription: {
+        fontSize: 10,
+        color: '#555555',
+        minHeight: 65,
+        marginBottom: 10,
+        textAlign: 'justify',
+    },
+    buyButton: {
+        fontSize: 12,
+        padding: 8,
+        backgroundColor: 'white',
+        color: 'black',
+        textAlign: 'center',
+        borderRadius: 4,
+        borderWidth: 1,
+        borderColor: '#000000',
+        marginTop: 10,
+        textDecoration: 'none',
+    },
+});
+const Template1 = ({ products }) => {
+    return (react_1.default.createElement(renderer_1.View, { style: styles.productContainer }, products.map((product, index) => (react_1.default.createElement(renderer_1.View, { key: index, style: styles.productSection },
+        react_1.default.createElement(renderer_1.Image, { style: styles.image, src: product.Image ||
+                'https://cloud-flz4zi76g-hack-club-bot.vercel.app/0image_fallback.jpg' }),
+        react_1.default.createElement(renderer_1.View, { style: styles.productTitleBox },
+            react_1.default.createElement(renderer_1.Text, { style: styles.productTitle }, product.Title),
+            product.Rating && (react_1.default.createElement(renderer_1.Text, { style: styles.productRate },
+                "\u2B50 ",
+                product.Rating))),
+        react_1.default.createElement(renderer_1.Text, { style: styles.productDescription }, product.Description),
+        product.Link && typeof product.Link === 'string' && (react_1.default.createElement(renderer_1.Link, { src: product.Link, style: styles.buyButton },
+            react_1.default.createElement(renderer_1.Text, { style: styles.productPrice }, `Rs. ${product.Price}`),
+            react_1.default.createElement(renderer_1.Text, { style: { marginHorizontal: 5 } }, "Buy Now"))))))));
+};
+exports.default = Template1;

package/dist/templates/Template2.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TemplateProps } from '../types';
+declare const Template2: React.FC<TemplateProps>;
+export default Template2;

package/dist/templates/Template2.js

@@ -0,0 +1,104 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const renderer_1 = require("@react-pdf/renderer");
+const styles = renderer_1.StyleSheet.create({
+    productContainer: {
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        alignItems: 'flex-start',
+        justifyContent: 'space-between',
+        margin: 10,
+    },
+    productSection: {
+        width: '100%',
+        padding: 10,
+        marginBottom: 10,
+        backgroundColor: '#f2f2f2',
+        borderRadius: 5,
+        display: 'flex',
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+    },
+    productSectionText: {
+        width: '50%',
+        padding: 10,
+        backgroundColor: '#f2f2f2',
+        borderRadius: 5,
+        display: 'flex',
+        flexDirection: 'column',
+        justifyContent: 'space-between',
+    },
+    productSectionImage: {
+        width: '50%',
+        padding: 10,
+        borderRadius: 5,
+        display: 'flex',
+        flexDirection: 'column',
+        justifyContent: 'space-between',
+    },
+    image: {
+        height: 200,
+        objectFit: 'contain',
+        marginBottom: 10,
+        padding: 3,
+    },
+    productTitle: {
+        fontSize: 20,
+        fontWeight: 'bold',
+        marginBottom: 4,
+    },
+    productRate: {
+        position: 'absolute',
+        bottom: 10,
+        right: 10,
+    },
+    productPrice: {
+        fontSize: 16,
+        color: '#43B446',
+        marginTop: 4,
+        marginBottom: 4,
+        alignSelf: 'flex-end',
+    },
+    productDescription: {
+        fontSize: 10,
+        color: '#555555',
+        minHeight: 40,
+        marginBottom: 10,
+    },
+    buyButton: {
+        fontSize: 12,
+        padding: 8,
+        backgroundColor: '#ccf9ff',
+        color: 'black',
+        textAlign: 'center',
+        borderRadius: 4,
+        borderWidth: 1,
+        borderColor: '#000000',
+        marginTop: 10,
+        textDecoration: 'none',
+    },
+});
+const Template2 = ({ products }) => {
+    return (react_1.default.createElement(renderer_1.View, { style: styles.productContainer }, products.map((product, index) => (react_1.default.createElement(renderer_1.View, { key: index, style: styles.productSection },
+        react_1.default.createElement(renderer_1.View, { style: styles.productSectionImage },
+            react_1.default.createElement(renderer_1.Image, { style: styles.image, src: product.Image ||
+                    'https://cloud-flz4zi76g-hack-club-bot.vercel.app/0image_fallback.jpg' }),
+            product.Rating && (react_1.default.createElement(renderer_1.Text, { style: styles.productRate },
+                "\u2B50 ",
+                product.Rating))),
+        react_1.default.createElement(renderer_1.View, { style: styles.productSectionText },
+            react_1.default.createElement(renderer_1.View, { style: {
+                    display: 'flex',
+                    flexDirection: 'row',
+                    justifyContent: 'space-between',
+                } },
+                react_1.default.createElement(renderer_1.Text, { style: styles.productTitle }, product.Title),
+                react_1.default.createElement(renderer_1.Text, { style: styles.productPrice }, `Rs. ${product.Price}`)),
+            react_1.default.createElement(renderer_1.Text, { style: styles.productDescription }, product.Description),
+            product.Link && typeof product.Link === 'string' && (react_1.default.createElement(renderer_1.Link, { src: product.Link, style: styles.buyButton }, "Buy Now"))))))));
+};
+exports.default = Template2;

package/dist/templates/Template3.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TemplateProps } from '../types';
+declare const Template3: React.FC<TemplateProps>;
+export default Template3;

package/dist/templates/Template3.js

@@ -0,0 +1,85 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const renderer_1 = require("@react-pdf/renderer");
+const styles = renderer_1.StyleSheet.create({
+    productSection: {
+        width: '100%',
+        height: '100vh',
+        padding: 20,
+        marginBottom: 10,
+        backgroundColor: '#f2f2f2',
+        borderRadius: 5,
+        display: 'flex',
+        justifyContent: 'space-between',
+    },
+    image: {
+        width: '100%',
+        objectFit: 'contain',
+        marginBottom: 10,
+    },
+    productDetailsBox: {
+        backgroundColor: '#FDFD96',
+        width: '50%',
+        position: 'absolute',
+        bottom: 10,
+        right: 10,
+        textAlign: 'justify',
+        padding: 20,
+        borderRadius: 8,
+    },
+    productTitle: {
+        fontSize: 20,
+        fontWeight: 'bold',
+        marginBottom: 4,
+    },
+    productRate: {},
+    productPrice: {
+        fontSize: 16,
+        color: '#43B446',
+        marginTop: 4,
+        marginBottom: 4,
+        alignSelf: 'flex-end',
+    },
+    productDescription: {
+        fontSize: 10,
+        color: '#555555',
+        minHeight: 40,
+        marginBottom: 10,
+    },
+    buyButton: {
+        fontSize: 12,
+        padding: 8,
+        backgroundColor: '#ccf9ff',
+        color: 'black',
+        textAlign: 'center',
+        borderRadius: 4,
+        borderWidth: 1,
+        borderColor: '#000000',
+        marginTop: 10,
+        textDecoration: 'none',
+    },
+});
+const Template3 = ({ products }) => {
+    return (react_1.default.createElement(react_1.default.Fragment, null, products.map((product, index) => (react_1.default.createElement(renderer_1.View, { key: index, style: styles.productSection },
+        react_1.default.createElement(renderer_1.Image, { style: styles.image, src: product.Image ||
+                'https://cloud-flz4zi76g-hack-club-bot.vercel.app/0image_fallback.jpg' }),
+        react_1.default.createElement(renderer_1.View, { style: styles.productDetailsBox },
+            react_1.default.createElement(renderer_1.Text, { style: styles.productTitle }, product.Title),
+            react_1.default.createElement(renderer_1.View, { style: {
+                    display: 'flex',
+                    flexDirection: 'row',
+                    justifyContent: 'space-between',
+                } },
+                react_1.default.createElement(renderer_1.Text, { style: styles.productPrice }, `Rs. ${product.Price}`),
+                product.Rating && (react_1.default.createElement(renderer_1.Text, { style: styles.productRate },
+                    "\u2B50 ",
+                    product.Rating))),
+            react_1.default.createElement(renderer_1.Text, { style: styles.productDescription }, product.Description),
+            product.Link && typeof product.Link === 'string' && (react_1.default.createElement(renderer_1.Link, { src: product.Link, style: styles.buyButton }, "Buy Now"))),
+        react_1.default.createElement(renderer_1.View, { break: true }))))));
+};
+exports.default = Template3;

package/dist/templates/Template4.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { TemplateProps } from '../types';
+declare const Template4: React.FC<TemplateProps>;
+export default Template4;