From 129168dcce32c6b6e2f3d9b83f7d3197fa4abbeb Mon Sep 17 00:00:00 2001 From: Suraj Jha Date: Fri, 25 Jul 2025 23:32:58 +0545 Subject: [PATCH] add table and quote in general layout --- .../general/QuoteSlideLayout.tsx | 116 ++++++++++++++ .../general/TableInfoSlideLayout.tsx | 145 ++++++++++++++++++ 2 files changed, 261 insertions(+) create mode 100644 servers/nextjs/presentation-layouts/general/QuoteSlideLayout.tsx create mode 100644 servers/nextjs/presentation-layouts/general/TableInfoSlideLayout.tsx diff --git a/servers/nextjs/presentation-layouts/general/QuoteSlideLayout.tsx b/servers/nextjs/presentation-layouts/general/QuoteSlideLayout.tsx new file mode 100644 index 00000000..f40cc9d0 --- /dev/null +++ b/servers/nextjs/presentation-layouts/general/QuoteSlideLayout.tsx @@ -0,0 +1,116 @@ +import React from 'react' +import * as z from "zod"; +import { ImageSchema } from '@/presentation-layouts/defaultSchemes'; + +export const layoutId = 'quote-slide' +export const layoutName = 'Quote' +export const layoutDescription = 'A slide layout with a heading, inspirational quote, and background image with overlay for text visibility.' + +const quoteSlideSchema = z.object({ + heading: z.string().min(3).max(60).default('Words of Wisdom').meta({ + description: "Main heading of the slide", + }), + quote: z.string().min(10).max(200).default('Success is not final, failure is not fatal: it is the courage to continue that counts. The future belongs to those who believe in the beauty of their dreams.').meta({ + description: "The main quote text content", + }), + author: z.string().min(2).max(50).default('Winston Churchill').meta({ + description: "Author of the quote", + }), + backgroundImage: ImageSchema.default({ + __image_url__: 'https://images.unsplash.com/photo-1506905925346-21bda4d32df4?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2000&q=80', + __image_prompt__: 'Inspirational mountain landscape with dramatic sky and clouds' + }).meta({ + description: "Background image for the slide", + }) +}) + +export const Schema = quoteSlideSchema + +export type QuoteSlideData = z.infer + +interface QuoteSlideLayoutProps { + data?: Partial +} + +const QuoteSlideLayout: React.FC = ({ data: slideData }) => { + return ( + <> + {/* Import Google Fonts */} + + +
+ {/* Background Image */} +
+ + {/* Background Overlay */} +
+ + {/* Decorative Elements */} +
+
+
+ + {/* Main Content */} +
+
+ + {/* Heading */} +
+

+ {slideData?.heading || 'Words of Wisdom'} +

+ {/* Purple accent line */} +
+
+ + {/* Quote Section */} +
+ {/* Quote Icon */} +
+ + + +
+ + {/* Quote Text */} +
+ "{slideData?.quote || 'Success is not final, failure is not fatal: it is the courage to continue that counts. The future belongs to those who believe in the beauty of their dreams.'}" +
+ + {/* Author */} +
+
+ + {slideData?.author || 'Winston Churchill'} + +
+
+
+
+
+ + {/* Bottom Decorative Border */} +
+
+ + ) +} + +export default QuoteSlideLayout \ No newline at end of file diff --git a/servers/nextjs/presentation-layouts/general/TableInfoSlideLayout.tsx b/servers/nextjs/presentation-layouts/general/TableInfoSlideLayout.tsx new file mode 100644 index 00000000..693ae100 --- /dev/null +++ b/servers/nextjs/presentation-layouts/general/TableInfoSlideLayout.tsx @@ -0,0 +1,145 @@ +import React from 'react' +import * as z from "zod"; + +export const layoutId = 'table-info-slide' +export const layoutName = 'Table with Info' +export const layoutDescription = 'A slide layout with a title at the top, structured table in the middle, and descriptive text at the bottom.' + +const tableInfoSlideSchema = z.object({ + title: z.string().min(3).max(40).default('Market Comparison').meta({ + description: "Main title of the slide", + }), + tableData: z.object({ + headers: z.array(z.string().min(1).max(30)).min(2).max(5).meta({ + description: "Table column headers" + }), + rows: z.array(z.array(z.string().min(1).max(50))).min(2).max(6).meta({ + description: "Table rows data - each row should match the number of headers" + }) + }).default({ + headers: ['Company', 'Revenue', 'Growth', 'Market Share'], + rows: [ + ['Company A', '$2.5M', '15%', '25%'], + ['Company B', '$1.8M', '12%', '18%'], + ['Company C', '$3.2M', '20%', '32%'], + ['Our Company', '$1.2M', '35%', '12%'] + ] + }).meta({ + description: "Table structure with headers and rows" + }), + description: z.string().min(10).max(200).default('This comparison shows our competitive position in the market. While we currently have a smaller market share, our growth rate significantly exceeds competitors, indicating strong potential for future expansion.').meta({ + description: "Descriptive text that appears below the table", + }) +}) + +export const Schema = tableInfoSlideSchema + +export type TableInfoSlideData = z.infer + +interface TableInfoSlideLayoutProps { + data?: Partial +} + +const TableInfoSlideLayout: React.FC = ({ data: slideData }) => { + const tableHeaders = slideData?.tableData?.headers || ['Company', 'Revenue', 'Growth', 'Market Share'] + const tableRows = slideData?.tableData?.rows || [ + ['Company A', '$2.5M', '15%', '25%'], + ['Company B', '$1.8M', '12%', '18%'], + ['Company C', '$3.2M', '20%', '32%'], + ['Our Company', '$1.2M', '35%', '12%'] + ] + + return ( + <> + {/* Import Google Fonts */} + + +
+ {/* Decorative Wave Patterns */} +
+ + + + + +
+ +
+ + + + + +
+ + {/* Main Content */} +
+ + {/* Title Section */} +
+

+ {slideData?.title || 'Market Comparison'} +

+ {/* Purple accent line */} +
+
+ + {/* Table Section */} +
+
+
+ {/* Table Header */} +
+
+ {tableHeaders.map((header, index) => ( +
+ {header} +
+ ))} +
+
+ + {/* Table Body */} +
+ {tableRows.map((row, rowIndex) => ( +
+ {row.slice(0, tableHeaders.length).map((cell, cellIndex) => ( +
+ {cell} +
+ ))} +
+ ))} +
+
+
+ +
+ + {/* Description Section */} +
+
+

+ {slideData?.description || 'This comparison shows our competitive position in the market. While we currently have a smaller market share, our growth rate significantly exceeds competitors, indicating strong potential for future expansion.'} +

+
+
+
+
+ + ) +} + +export default TableInfoSlideLayout \ No newline at end of file