diff --git a/electron/servers/nextjs/app/(presentation-generator)/(dashboard)/Components/MarketOpportunitySlide.tsx b/electron/servers/nextjs/app/(presentation-generator)/(dashboard)/Components/MarketOpportunitySlide.tsx new file mode 100644 index 00000000..55028a94 --- /dev/null +++ b/electron/servers/nextjs/app/(presentation-generator)/(dashboard)/Components/MarketOpportunitySlide.tsx @@ -0,0 +1,133 @@ +import * as z from "zod"; + +export const slideLayoutId = "product-overview-market-opportunity-slide"; +export const slideLayoutName = "Product Overview Market Opportunity Slide"; +export const slideLayoutDescription = + "A market opportunity slide with title and intro text on the left, four bullet lines extending toward the right, and concentric value circles as the visual focal point."; + +const BulletSchema = z.object({ + text: z.string().min(12).max(46).meta({ + description: "Bullet text shown on the left side of a line.", + }), +}); + +export const Schema = z.object({ + title: z.string().min(8).max(22).default("Market Opportunity").meta({ + description: "Main heading shown at the top-left.", + }), + subtitle: z.string().min(40).max(110).default( + "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt." + ).meta({ + description: "Supporting text under the main heading.", + }), + bullets: z + .array(BulletSchema) + .min(4) + .max(4) + .default([ + { text: "Ut enim ad minim veniam, quis" }, + { text: "Ut enim ad minim veniam, quis" }, + { text: "Ut enim ad minim veniam, quis" }, + { text: "Ut enim ad minim veniam, quis" }, + ]) + .meta({ + description: "Four bullet-line entries shown on the left.", + }), + values: z + .array(z.string().min(2).max(6)) + .min(4) + .max(4) + .default(["$33", "$20", "$120", "$200"]) + .meta({ + description: "Four values shown from outer to inner circles.", + }), +}); + +export type SchemaType = z.infer; + + +const COLORS = [ + "var(--graph-0,#5f7f79)", + "var(--graph-1,#1f5a4f)", + "var(--graph-2,#0d4f43)", + "var(--graph-3,#06463d)", +]; + +const MarketOpportunitySlide = ({ data }: { data: Partial }) => { + const { title, subtitle, bullets, values } = data; + + return ( +
+
+

+ {title} +

+

+ {subtitle} +

+
+ +
+ {bullets?.map((bullet, index) => ( +
+ +

+ {bullet.text} +

+ + +
+ ))} +
+ +
+ {values?.map((value, index) => ( +
+

+ {value} +

+
+ ))} +
+
+ ); +}; + +export default MarketOpportunitySlide; diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide01RoadmapCover.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide01RoadmapCover.tsx index 4eefd0ee..7c0ff024 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide01RoadmapCover.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide01RoadmapCover.tsx @@ -32,16 +32,29 @@ export type SchemaType = z.infer; const CodeSlide01RoadmapCover = ({ data }: { data: Partial }) => { return ( -
+
-

{data.companyName}

-

+

{data.companyName}

+

{data.title}

-

{data.subtitle}

+

{data.subtitle}

-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide02CodeExplanationSplit.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide02CodeExplanationSplit.tsx index 7edb0a22..eda51568 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide02CodeExplanationSplit.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide02CodeExplanationSplit.tsx @@ -64,15 +64,36 @@ const CodeSlide02CodeExplanationSplit = ({ }) => { return ( -
+
-

{data.title}

+

{data.title}

-
-

{data.codeSnippet?.fileName}

-
+          
+

+ {data.codeSnippet?.fileName} +

+
 
               
                 {data.codeSnippet?.content}
@@ -81,15 +102,22 @@ const CodeSlide02CodeExplanationSplit = ({
           
-

{data.explanationTitle}

-

+

{data.explanationTitle}

+

{data.explanation}

-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide03ApiRequestResponse.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide03ApiRequestResponse.tsx index 9fe00314..3c8c74d6 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide03ApiRequestResponse.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide03ApiRequestResponse.tsx @@ -73,31 +73,64 @@ const CodeSlide03ApiRequestResponse = ({ }) => { return ( -
+
-

{data.title}

+

{data.title}

-
-
-

+

+
+

{data.method}

-

{data.endpoint}

+

{data.endpoint}

-

Headers

-
+

Headers

+
{data.headers?.map((item) => ( -

{item}

+

{item}

))}
-
-

{data.requestSnippet?.fileName}

-
+            
+

+ {data.requestSnippet?.fileName} +

+
 
                 
                   {data.requestSnippet?.content}
@@ -106,9 +139,24 @@ const CodeSlide03ApiRequestResponse = ({
             
-
-

{data.responseSnippet?.fileName}

-
+          
+

+ {data.responseSnippet?.fileName} +

+
 
               
                 {data.responseSnippet?.content}
@@ -118,7 +166,14 @@ const CodeSlide03ApiRequestResponse = ({
         
-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide04FeatureGrid.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide04FeatureGrid.tsx index 950b2dc6..5062cd8c 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide04FeatureGrid.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide04FeatureGrid.tsx @@ -99,24 +99,37 @@ const CodeSlide04FeatureGrid = ({ data }: { data: Partial }) => { return ( -
+
-

{data.title}

+

{data.title}

{data?.features?.map((feature) => (
-

{feature.title}

- +

{feature.title}

+ {feature.icon.__icon_query__} }) => { />
-

{feature.description}

+

{feature.description}

))}
-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide05ComparisonTable.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide05ComparisonTable.tsx index 2ff35020..0dbd5388 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide05ComparisonTable.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide05ComparisonTable.tsx @@ -51,28 +51,51 @@ export type SchemaType = z.infer; function renderCell(value: string) { if (value.toLowerCase() === "check") { - return ; + return ; } - return {value}; + return {value}; } const CodeSlide05ComparisonTable = ({ data }: { data: Partial }) => { return ( -
+
-

{data.title}

+

{data.title}

-
-
+
{data?.tableColumns?.map((column) => ( -

{column}

+

+ {column} +

))}
@@ -85,17 +108,32 @@ const CodeSlide05ComparisonTable = ({ data }: { data: Partial }) => gridTemplateColumns: `repeat(${data?.tableColumns?.length || 1}, 1fr)`, }} > -

{row.feature}

-
{renderCell(row.column1)}
-
{renderCell(row.column2)}
-
{renderCell(row.column3)}
+

+ {row.feature} +

+
{renderCell(row.column1)}
+
{renderCell(row.column2)}
+
{renderCell(row.column3)}
))}
-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide06Workflow.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide06Workflow.tsx index f573e69e..2b90ee1a 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide06Workflow.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide06Workflow.tsx @@ -81,33 +81,47 @@ export type SchemaType = z.infer; const CodeSlide06Workflow = ({ data }: { data: Partial }) => { return ( -
+
-

{data.title}

+

{data.title}

{data?.steps?.map((step, index) => (
-
+
{step.icon.__icon_query__}
-

{step.title}

-

{step.description}

+

{step.title}

+

{step.description}

{index < (data?.steps?.length || 0) - 1 && ( - - + + )} @@ -115,7 +129,14 @@ const CodeSlide06Workflow = ({ data }: { data: Partial }) => {
-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide07UseCaseList.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide07UseCaseList.tsx index 2d44f2a5..8d0f764e 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide07UseCaseList.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide07UseCaseList.tsx @@ -36,31 +36,52 @@ export type SchemaType = z.infer; const CodeSlide07UseCaseList = ({ data }: { data: Partial }) => { return ( -
+
-

{data.title}

+

{data.title}

{data?.items?.map((item, index) => (
- + {index + 1} -

{item}

+

{item}

))}
-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide08CodeExplanationText.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide08CodeExplanationText.tsx index b22c127f..871d2155 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide08CodeExplanationText.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide08CodeExplanationText.tsx @@ -32,16 +32,29 @@ export type SchemaType = z.infer; const CodeSlide08CodeExplanationText = ({ data }: { data: Partial }) => { return ( -
+
-

{data.title}

+

{data.title}

-

{data.explanationTitle}

-

{data.explanation}

+

{data.explanationTitle}

+

{data.explanation}

-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide09TableOfContent.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide09TableOfContent.tsx index aa72323d..a1aebc91 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide09TableOfContent.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide09TableOfContent.tsx @@ -49,15 +49,15 @@ function TocColumn({ items }: { items: { number: string; label: string, descript return ( -
+
- +
-

{item.number}

-

{item.label}

- {item.description &&

{item.description}

} +

{item.number}

+

{item.label}

+ {item.description &&

{item.description}

}
); @@ -72,11 +72,17 @@ const CodeSlide09TableOfContent = ({ data }: { data: Partial }) => { return ( -
+
-

{data.title}

+

{data.title}

@@ -84,7 +90,14 @@ const CodeSlide09TableOfContent = ({ data }: { data: Partial }) => {
-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide10MetricsSplit.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide10MetricsSplit.tsx index 666ba65c..7cfeda87 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide10MetricsSplit.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide10MetricsSplit.tsx @@ -52,35 +52,53 @@ export const Schema = z.object({ export type SchemaType = z.infer; const CodeSlide10MetricsSplit = ({ data }: { data: Partial }) => { - const slideData = Schema.parse(data); + return ( -
+
-

{slideData.title}

+

{data.title}

-

{slideData.explanationTitle}

-

{slideData.explanation}

+

{data.explanationTitle}

+

{data.explanation}

- {slideData.metrics.map((metric, index) => ( + {data?.metrics?.map((metric, index) => (
-

{metric.value}

-

{metric.label}

-

{metric.period}

+

{metric.value}

+

{metric.label}

+

{metric.period}

))}
-
- {slideData.pageLabel} +
+ {data?.pageLabel}
); diff --git a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide11MetricsGrid.tsx b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide11MetricsGrid.tsx index ac0d5659..5e9761cc 100644 --- a/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide11MetricsGrid.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Code/CodeSlide11MetricsGrid.tsx @@ -46,27 +46,46 @@ export type SchemaType = z.infer; const CodeSlide11MetricsGrid = ({ data }: { data: Partial }) => { return ( -
+
-

{data.title}

+

{data.title}

{data?.metrics?.map((metric, index) => (
-

{metric.value}

-

{metric.label}

-

{metric.period}

+

{metric.value}

+

{metric.label}

+

{metric.period}

))}
-
+
{data.pageLabel}
diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationAboutSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationAboutSlide.tsx index b8502868..4bb11c5d 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationAboutSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationAboutSlide.tsx @@ -56,16 +56,22 @@ const EducationAboutSlide = ({ data }: { data: Partial }) => { return (<> -
+
-

+

{data.companyName}

-

+

{data.intro}

-

+

{data.body}

@@ -77,8 +83,15 @@ const EducationAboutSlide = ({ data }: { data: Partial }) => { alt={data.topFeatureImage?.__image_prompt__} className="absolute inset-0 h-full w-full object-cover z-1 " /> -
-

+

+
+

{data.topPanelText}

@@ -96,8 +109,15 @@ const EducationAboutSlide = ({ data }: { data: Partial }) => {
-
-

+

+
+

{data.bottomPanelText}

diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationChartPrimitives.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationChartPrimitives.tsx index a27e2a44..151077c6 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationChartPrimitives.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationChartPrimitives.tsx @@ -84,17 +84,17 @@ type PieLabelProps = { }; const DEFAULT_COLORS = [ - "#4A15A8", - "#5B45AD", - "#7E6CC0", - "#9F94CD", - "#6A31B8", - "#4D2A97", + "var(--graph-0,#4A15A8)", + "var(--graph-1,#5B45AD)", + "var(--graph-2,#7E6CC0)", + "var(--graph-3,#9F94CD)", + "var(--graph-4,#6A31B8)", + "var(--graph-5,#4D2A97)", ]; -const AXIS = "#7C7A83"; -const GRID = "#CFCBD8"; -const PRIMARY_TEXT = "#3E3C45"; +const AXIS = "var(--background-text,#7C7A83)"; +const GRID = "var(--stroke,#CFCBD8)"; +const PRIMARY_TEXT = "var(--background-text,#3E3C45)"; function formatComma(value: number | string) { if (typeof value === "number") { @@ -201,7 +201,7 @@ const renderPieInsideLabel = (props: any) => { y={y} textAnchor="middle" dominantBaseline="central" - fill="#ffffff" + fill="var(--primary-text,#ffffff)" fontSize={fontSize} fontWeight={600} style={{ @@ -247,10 +247,16 @@ function CustomTooltip({ active, payload, label }: TooltipProps) { } return ( -
-

{label}

+
+

{label}

{payload.map((entry, index) => ( -

+

{entry.name ?? entry.dataKey}: {String(entry.value)}

))} @@ -268,7 +274,7 @@ function renderPieLabel({ name, percent = 0, x = 0, y = 0, textAnchor = "middle" } return ( - + {`${name ?? ""} ${(percent * 100).toFixed(0)}%`} ); @@ -298,7 +304,7 @@ export default function EducationChartPrimitives({ divergingLabels: [string, string]; }) { const axisProps = { - tick: { fill: AXIS, fontSize: 12, fontFamily: "serif" }, + tick: { fill: AXIS, fontSize: 12, fontFamily: "var(--body-font-family,'Times New Roman')" }, axisLine: { stroke: GRID }, tickLine: { stroke: GRID }, } as const; diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationContentSplitSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationContentSplitSlide.tsx index 0061b169..500039c5 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationContentSplitSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationContentSplitSlide.tsx @@ -36,7 +36,13 @@ const EducationContentSplitSlide = ({ data }: { data: Partial }) => const { heading, tagline, body, collageImage } = data; return ( -
+
@@ -61,11 +67,11 @@ const EducationContentSplitSlide = ({ data }: { data: Partial }) =>
-

{data.heading}

-

- {data.tagline} +

{heading}

+

+ {tagline}

-

{body}

+

{body}

diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationCoverSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationCoverSlide.tsx index 5e1ced4e..d081716c 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationCoverSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationCoverSlide.tsx @@ -31,18 +31,33 @@ const EducationCoverSlide = ({ data }: { data: Partial }) => { const { companyName, title, backgroundImage } = data; return ( -
+
{backgroundImage?.__image_prompt__} -
+
-
-

{data.companyName}

+
+

{companyName}

{title}

diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationImageGallerySlide.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationImageGallerySlide.tsx index 0f12403b..1d520d10 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationImageGallerySlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationImageGallerySlide.tsx @@ -33,7 +33,13 @@ const EducationImageGallerySlide = ({ data }: { data: Partial }) => const { title, body, galleryImages } = data; return ( -
+
}) =>
-

+

{title}

-

+

{body}

diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationReportChartSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationReportChartSlide.tsx index 24d272b7..3a75cfae 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationReportChartSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationReportChartSlide.tsx @@ -90,7 +90,7 @@ export const Schema = z.object({ dateRange: z.string().min(8).max(22).default("Apr 10 - Apr 17").meta({ description: "Right-panel date range label.", }), - chartType: ChartTypeSchema.default("area").meta({ + chartType: ChartTypeSchema.default("bar").meta({ description: "Chart type selector. Supports bar, grouped, stacked, clustered, diverging, line, area, pie/donut, and scatter.", }), @@ -131,33 +131,39 @@ export type SchemaType = z.infer; const EducationReportChartSlide = ({ data }: { data: Partial }) => { - const slideData = Schema.parse(data); + const slideData = data; const chartHeightClass = slideData.showStatusMessage ? "h-[372px]" : "h-[486px]"; return ( -
+
-

+

{slideData.title}

-

+

{slideData.body}

-

+

{slideData.footnote}

-
-

+
+

{slideData.chartTitle}

-

+

{slideData.dateRange}

@@ -165,9 +171,9 @@ const EducationReportChartSlide = ({ data }: { data: Partial }) => {
diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationServicesSplitSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationServicesSplitSlide.tsx index ac5bc8fd..d491e193 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationServicesSplitSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationServicesSplitSlide.tsx @@ -23,7 +23,7 @@ const ServiceSchema = z.object({ tagline: z.string().min(3).max(12).meta({ description: "Short label under each service heading.", }), - body: z.string().min(40).max(90).meta({ + body: z.string().max(40).meta({ description: "Service description paragraph.", }), }); @@ -91,10 +91,16 @@ const EducationServicesSplitSlide = ({ data }: { data: Partial }) => return ( -
+
-

+

{title}

@@ -109,7 +115,10 @@ const EducationServicesSplitSlide = ({ data }: { data: Partial }) => {sections?.map((section, index) => (
}) =>
-

{section.heading}

-

+

{section.heading}

+

{section.tagline}

-

+

{section.body}

diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationStatisticsGridSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationStatisticsGridSlide.tsx index bd599daa..ec698ea3 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationStatisticsGridSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationStatisticsGridSlide.tsx @@ -51,16 +51,22 @@ const EducationStatisticsGridSlide = ({ data }: { data: Partial }) = return ( -
+
-
+
-

+

{data.title}

-

+

{data.description}

@@ -71,12 +77,12 @@ const EducationStatisticsGridSlide = ({ data }: { data: Partial }) =
-

+

{stat?.value}

-

+

{stat?.label}

@@ -88,12 +94,12 @@ const EducationStatisticsGridSlide = ({ data }: { data: Partial }) =
-

+

{stat.value}

-

+

{stat.label}

@@ -112,12 +118,12 @@ const EducationStatisticsGridSlide = ({ data }: { data: Partial }) =
-

+

{stat?.value}

-

+

{stat?.label}

@@ -131,12 +137,12 @@ const EducationStatisticsGridSlide = ({ data }: { data: Partial }) =
-

+

{stat.value}

-

+

{stat.label}

diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationTableOfContentsSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationTableOfContentsSlide.tsx index e6e18552..f7d900b2 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationTableOfContentsSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationTableOfContentsSlide.tsx @@ -47,26 +47,32 @@ export type SchemaType = z.infer; const EducationTableOfContentsSlide = ({ data }: { data: Partial }) => { return ( -
+
-
-

+
+

{data.titleLine1}
{data.titleLine2}

-
+
{data.items?.map((item, index) => (
- + {item.number} - + {item.label}
diff --git a/electron/servers/nextjs/app/presentation-templates/Education/EducationTimelineSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Education/EducationTimelineSlide.tsx index 0871cf62..86b1fcc8 100644 --- a/electron/servers/nextjs/app/presentation-templates/Education/EducationTimelineSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Education/EducationTimelineSlide.tsx @@ -49,9 +49,15 @@ const EducationTimelineSlide = ({ data }: { data: Partial }) => { const isSixOrLess = milestones?.length && milestones?.length <= 6; return ( -
+
-

+

{title}

@@ -82,13 +88,13 @@ function TimelineUpToSix({
-
- {index !== milestones.length - 1 &&
} +
+ {index !== milestones.length - 1 &&
}
-

+

{milestone.year}

-

+

{milestone.description}

@@ -114,10 +120,10 @@ function TimelineMoreThanSix({ - + {/* bottom horizontal line */} - {/*
*/} + {/*
*/}
-
- {index !== milestones.length - 1 &&
} +
+ {index !== milestones.length - 1 &&
}
-

+

{milestone.year}

-

+

{milestone.description}

@@ -147,7 +153,7 @@ function TimelineMoreThanSix({ {/* bottom row */}
@@ -158,16 +164,16 @@ function TimelineMoreThanSix({ return (
- {/* {colIndex === 0 &&
} */} - {true &&
} -
+ {/* {colIndex === 0 &&
} */} +
+
-

+

{item.year}

-

+

{item.description}

diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/BusinessChallengesCardsSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/BusinessChallengesCardsSlide.tsx index 1258be58..378f8d1a 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/BusinessChallengesCardsSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/BusinessChallengesCardsSlide.tsx @@ -11,7 +11,7 @@ const CardSchema = z.object({ heading: z.string().min(4).max(12).meta({ description: "Card heading for one challenge column.", }), - body: z.string().min(30).max(60).meta({ + body: z.string().max(40).meta({ description: "Card body copy for one challenge column.", }), dark: z.boolean().default(false).meta({ @@ -26,7 +26,7 @@ export const Schema = z.object({ taglineLabel: z.string().min(3).max(10).default("TAGLINE").meta({ description: "Short label above the left-side paragraph.", }), - taglineBody: z.string().min(40).max(100).default( + taglineBody: z.string().max(80).default( "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea." ).meta({ description: "Supporting paragraph on the left side.", @@ -43,7 +43,7 @@ export const Schema = z.object({ }), cards: z .array(CardSchema) - .min(3) + .max(3) .default([ { @@ -75,12 +75,15 @@ const BusinessChallengesCardsSlide = ({ data }: { data: Partial }) = return (

{title}

@@ -88,11 +91,16 @@ const BusinessChallengesCardsSlide = ({ data }: { data: Partial }) =

{taglineLabel}

-

{taglineBody}

+

+ {taglineBody} +

@@ -109,17 +117,29 @@ const BusinessChallengesCardsSlide = ({ data }: { data: Partial }) =

{card.heading}

{card.body}

diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/BusinessChallengesGridSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/BusinessChallengesGridSlide.tsx index b6cdce83..a3243257 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/BusinessChallengesGridSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/BusinessChallengesGridSlide.tsx @@ -9,7 +9,7 @@ const ChallengeSchema = z.object({ heading: z.string().min(4).max(12).meta({ description: "Short heading for a single challenge block.", }), - body: z.string().min(40).max(96).meta({ + body: z.string().max(40).meta({ description: "Description text for a single challenge block.", }), }); @@ -53,27 +53,38 @@ const BusinessChallengesGridSlide = ({ data }: { data: Partial }) => return (

{title}

{challenges?.map((challenge, index) => (
-

+

{challenge.heading}

-

{challenge.body}

+

+ {challenge.body} +

))}
diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/ComparisonChartSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/ComparisonChartSlide.tsx index 3a19af33..2987d3e0 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/ComparisonChartSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/ComparisonChartSlide.tsx @@ -19,10 +19,10 @@ const RowSchema = z.object({ }); export const Schema = z.object({ - title: z.string().min(8).max(32).default("Comparison Chart").meta({ + title: z.string().min(8).max(20).default("Comparison Chart").meta({ description: "Main heading shown above the table.", }), - subtitle: z.string().min(30).max(140).default( + subtitle: z.string().max(80).default( "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt." ).meta({ description: "Short subtitle shown under the main heading.", @@ -37,7 +37,7 @@ export const Schema = z.object({ }), rows: z .array(RowSchema) - .min(3) + .max(3) .default([ { @@ -119,26 +119,47 @@ const ComparisonChartSlide = ({ data }: { data: Partial }) => { return (

{title}

-

{subtitle}

+

+ {subtitle} +

-
+
{columns?.map((column, index) => (
{column}
@@ -156,16 +177,28 @@ const ComparisonChartSlide = ({ data }: { data: Partial }) => { return (
-
+
{row.label}
{cells?.map((status, cellIndex) => (
}) = const { title, subtitle, columns, highlightedHeaderIndex, rows } = data; return ( -
+
-

+

{title}

-

+

{subtitle}

-
- - - +
+
+ + {columns?.map((column, index) => { const isHighlighted = index + 1 === highlightedHeaderIndex; return ( {rows?.map((row, rowIndex) => { const cells = [row.cell1, row.cell2, row.cell3, row.cell4]; + const isHighlighted = rowIndex + 1 === highlightedHeaderIndex; + return ( {cells?.map((cell, cellIndex) => ( diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/CoverSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/CoverSlide.tsx index 2073ac26..87557f15 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/CoverSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/CoverSlide.tsx @@ -44,9 +44,15 @@ const CoverSlide = ({ data }: { data: Partial }) => { return (
-
+
}) => { className="h-[42px] w-[171px] object-cover" /> -

+

{label}

@@ -84,7 +93,7 @@ const CoverSlide = ({ data }: { data: Partial }) => { style={{ height: "365px", background: - "linear-gradient(0deg, rgba(218, 225, 222, 0.00) 0%, #DAE1DE 80.33%)", + "linear-gradient(0deg, rgba(218, 225, 222, 0.00) 0%, var(--background-color,#DAE1DE) 80.33%)", }} />
diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/ImageGallerySlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/ImageGallerySlide.tsx index 093d7e8e..f11e7ba5 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/ImageGallerySlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/ImageGallerySlide.tsx @@ -7,10 +7,10 @@ export const slideLayoutDescription = "A gallery slide with a title and paragraph on the left and a five-image collage on the right and bottom."; export const Schema = z.object({ - title: z.string().min(5).max(16).default("Image Gallery").meta({ + title: z.string().max(12).default("Image Gallery").meta({ description: "Main gallery heading.", }), - description: z.string().min(50).max(130).default( + description: z.string().max(80).default( "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore." ).meta({ description: "Supporting paragraph shown under the title.", @@ -18,7 +18,7 @@ export const Schema = z.object({ topCenterImage: z.object({ __image_url__: z.string().default("https://images.unsplash.com/photo-1521737711867-e3b97375f902?auto=format&fit=crop&w=800&q=80"), - __image_prompt__: z.string().min(10).max(100).default("Design team discussing project board"), + __image_prompt__: z.string().max(80).default("Design team discussing project board"), }).default({ __image_url__: "https://images.unsplash.com/photo-1521737711867-e3b97375f902?auto=format&fit=crop&w=800&q=80", __image_prompt__: "Design team discussing project board", @@ -28,7 +28,7 @@ export const Schema = z.object({ topRightImage: z.object({ __image_url__: z.string().default("https://images.unsplash.com/photo-1455390582262-044cdead277a?auto=format&fit=crop&w=800&q=80"), - __image_prompt__: z.string().min(10).max(100).default("Creative desk with notebook and photos"), + __image_prompt__: z.string().max(80).default("Creative desk with notebook and photos"), }).default({ __image_url__: "https://images.unsplash.com/photo-1455390582262-044cdead277a?auto=format&fit=crop&w=800&q=80", @@ -39,7 +39,7 @@ export const Schema = z.object({ bottomWideImage: z.object({ __image_url__: z.string().default("https://images.unsplash.com/photo-1477959858617-67f85cf4f1df?auto=format&fit=crop&w=1300&q=80"), - __image_prompt__: z.string().min(10).max(100).default("City skyline seen from office window"), + __image_prompt__: z.string().max(80).default("City skyline seen from office window"), }).default({ __image_url__: "https://images.unsplash.com/photo-1477959858617-67f85cf4f1df?auto=format&fit=crop&w=1300&q=80", @@ -50,7 +50,7 @@ export const Schema = z.object({ bottomCenterImage: z.object({ __image_url__: z.string().default("https://images.unsplash.com/photo-1517048676732-d65bc937f952?auto=format&fit=crop&w=900&q=80"), - __image_prompt__: z.string().min(10).max(100).default("Art gallery wall with framed photos"), + __image_prompt__: z.string().max(80).default("Art gallery wall with framed photos"), }).default({ __image_url__: "https://images.unsplash.com/photo-1517048676732-d65bc937f952?auto=format&fit=crop&w=900&q=80", @@ -61,7 +61,7 @@ export const Schema = z.object({ bottomRightImage: z.object({ __image_url__: z.string().default("https://images.unsplash.com/photo-1521791136064-7986c2920216?auto=format&fit=crop&w=900&q=80"), - __image_prompt__: z.string().min(10).max(100).default("Office workshop with presentation board"), + __image_prompt__: z.string().max(80).default("Office workshop with presentation board"), }).default({ __image_url__: "https://images.unsplash.com/photo-1521791136064-7986c2920216?auto=format&fit=crop&w=900&q=80", @@ -87,18 +87,26 @@ const ImageGallerySlide = ({ data }: { data: Partial }) => { return (

{title}

-

{description}

+

+ {description} +

}) => { return (
-
+
{portraitImage?.__image_url__ && ( }) => {

{title}

@@ -83,10 +90,14 @@ const IntroductionSlide = ({ data }: { data: Partial }) => {

{block.label}

-

+

{block.body}

diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/KpiCardsSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/KpiCardsSlide.tsx index 705803fb..2c5d5ff0 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/KpiCardsSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/KpiCardsSlide.tsx @@ -7,10 +7,10 @@ export const slideLayoutDescription = "A KPI overview slide with a dark-tinted background image, large title, and a two-row grid of six white KPI cards."; const KpiSchema = z.object({ - value: z.string().min(1).max(8).meta({ + value: z.string().max(5).meta({ description: "Primary KPI value shown in a card.", }), - body: z.string().min(10).max(28).meta({ + body: z.string().max(20).meta({ description: "Short KPI supporting text.", }), }); @@ -64,7 +64,10 @@ const KpiCardsSlide = ({ data }: { data: Partial }) => { return (
{backgroundImage?.__image_url__ && ( }) => { /> )} -
+
-

{title}

@@ -86,8 +96,15 @@ const KpiCardsSlide = ({ data }: { data: Partial }) => {
{items?.map((item, index) => ( -
-
+
+
{kpiIcon?.__icon_query__} }) => {

{item.value}

-

+

{item.body}

diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/MarketOpportunitySlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/MarketOpportunitySlide.tsx index 377c2b0e..07f887f2 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/MarketOpportunitySlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/MarketOpportunitySlide.tsx @@ -45,12 +45,11 @@ export const Schema = z.object({ export type SchemaType = z.infer; - const COLORS = [ - "#5f7f79", - "#1f5a4f", - "#0d4f43", - "#06463d", + "var(--graph-0,#5f7f79)", + "var(--graph-1,#1f5a4f)", + "var(--graph-2,#0d4f43)", + "var(--graph-3,#06463d)", ]; const MarketOpportunitySlide = ({ data }: { data: Partial }) => { @@ -59,25 +58,47 @@ const MarketOpportunitySlide = ({ data }: { data: Partial }) => { return (

{title}

-

{subtitle}

+

+ {subtitle} +

{bullets?.map((bullet, index) => (
- -

{bullet.text}

- - + +

+ {bullet.text} +

+ +
))}
@@ -88,14 +109,17 @@ const MarketOpportunitySlide = ({ data }: { data: Partial }) => { key={index} className="absolute rounded-full" style={{ - width: 237 + (index * 50), - height: 237 + (index * 50), + width: 237 + index * 50, + height: 237 + index * 50, bottom: 0, right: 0, backgroundColor: COLORS[index], }} > -

+

{value}

diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/MeetTeamSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/MeetTeamSlide.tsx index 5922c14d..7094003a 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/MeetTeamSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/MeetTeamSlide.tsx @@ -34,14 +34,14 @@ export const Schema = z.object({ taglineLabel: z.string().min(3).max(10).default("TAGLINE").meta({ description: "Small heading above team description.", }), - taglineBody: z.string().min(50).max(100).default( + taglineBody: z.string().max(70).default( "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea." ).meta({ description: "Short descriptive paragraph at top-right.", }), members: z .array(MemberSchema) - .min(4) + .max(4) .default([ { @@ -94,12 +94,15 @@ const MeetTeamSlide = ({ data }: { data: Partial }) => { return (

{title}

@@ -107,11 +110,16 @@ const MeetTeamSlide = ({ data }: { data: Partial }) => {

{taglineLabel}

-

{taglineBody}

+

+ {taglineBody} +

@@ -125,17 +133,29 @@ const MeetTeamSlide = ({ data }: { data: Partial }) => { />

{member.title}

{member.name}

diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/MissionVisionSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/MissionVisionSlide.tsx index 7b94a574..ea7fd434 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/MissionVisionSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/MissionVisionSlide.tsx @@ -46,31 +46,60 @@ const MissionVisionSlide = ({ data }: { data: Partial }) => { return (

{title}

-
-

+

+

{missionLabel}

-

{missionBody}

+

+ {missionBody} +

-
-

+

+

{visionLabel}

-

{visionBody}

+

+ {visionBody} +

-
+
{image?.__image_url__ && ( }) => { return (

{title}

@@ -78,14 +81,22 @@ const OurServicesSlide = ({ data }: { data: Partial }) => {

{taglineLabel}

-

{taglineBody}

+

+ {taglineBody} +

-
+
{featureImage?.__image_url__ && ( }) => {

{service.heading}

{service.body}

diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/PricingPlanSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/PricingPlanSlide.tsx index fd24e29a..e9a4a4dd 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/PricingPlanSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/PricingPlanSlide.tsx @@ -10,12 +10,12 @@ const PlanSchema = z.object({ price: z.string().min(4).max(12).meta({ description: "Plan price label shown at the top of each card.", }), - description: z.string().min(18).max(26).meta({ + description: z.string().max(20).meta({ description: "Short statement describing the plan.", }), features: z - .array(z.string().min(10).max(24)) - .min(4) + .array(z.string().max(18)) + .max(4) .meta({ description: "Four bullet features shown in the pricing card.", @@ -41,7 +41,6 @@ export const Schema = z.object({ }), plans: z .array(PlanSchema) - .min(3) .max(3) .default([ { @@ -91,12 +90,15 @@ const PricingPlanSlide = ({ data }: { data: Partial }) => { return (

{title}

@@ -109,17 +111,29 @@ const PricingPlanSlide = ({ data }: { data: Partial }) => {

{plan.price}

{plan.description}

@@ -135,7 +149,11 @@ const PricingPlanSlide = ({ data }: { data: Partial }) => { />

{feature}

diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/ProcessSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/ProcessSlide.tsx index 8e57213f..5b1cae5f 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/ProcessSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/ProcessSlide.tsx @@ -80,12 +80,15 @@ const ProcessSlide = ({ data }: { data: Partial }) => { return (

{title}

@@ -110,23 +113,28 @@ const ProcessSlide = ({ data }: { data: Partial }) => { }} /> - +
- +

{step.label}

-

{step.body}

+

+ {step.body} +

) @@ -141,23 +149,28 @@ const ProcessSlide = ({ data }: { data: Partial }) => {

{step.label}

-

{step.body}

+

+ {step.body} +

- + {step.icon.__icon_query__}
- +
diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/ReportSnapshotSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/ReportSnapshotSlide.tsx index e980999c..3b564c5b 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/ReportSnapshotSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/ReportSnapshotSlide.tsx @@ -229,17 +229,21 @@ export const Schema = z.object({ export type SchemaType = z.infer; -const MINI_BAR_DARK = "#0B4B40"; -const MINI_BAR_LIGHT = "#CED3D1"; -const DONUT_COLORS = ["#0B4B40", "#4B6B61", "#7B938C"]; -const KPI_ICON_BG = "#063C73"; +const MINI_BAR_DARK = "var(--graph-0,#0B4B40)"; +const MINI_BAR_LIGHT = "var(--graph-1,#CED3D1)"; +const DONUT_COLORS = [ + "var(--graph-0,#0B4B40)", + "var(--graph-1,#4B6B61)", + "var(--graph-2,#7B938C)", +]; +const KPI_ICON_BG = "var(--graph-3,#063C73)"; const PulseIcon = () => (
{sideImage?.__image_url__ && ( }) => { /> )} -
+

{title}

-

+

{taglineLabel}

-

+

{taglineBody}

@@ -350,8 +374,14 @@ const ReportSnapshotSlide = ({ data }: { data: Partial }) => {
-

{chartTitle}

+

+ {chartTitle} +

{activeChartStyle === "mini-bars" && ( <> @@ -362,7 +392,7 @@ const ReportSnapshotSlide = ({ data }: { data: Partial }) => { margin={{ top: 0, right: 8, left: -6, bottom: 0 }} barCategoryGap={16} > - + }) => { tickFormatter={(value) => `$${value}`} axisLine={false} tickLine={false} - tick={{ fill: "#6C7271", fontSize: 10 }} + tick={{ fill: "var(--background-text,#6C7271)", fontSize: 10 }} /> }) => {
-

{footerLabel}

-

{footerValue}

+

+ {footerLabel} +

+

+ {footerValue} +

)} @@ -431,11 +471,19 @@ const ReportSnapshotSlide = ({ data }: { data: Partial }) => { className="h-[14px] w-[14px] rounded-full" style={{ backgroundColor: DONUT_COLORS[index % DONUT_COLORS.length] }} /> -

+

{legendLabels?.[index] ?? entry.name}

-

{percent}%

+

+ {percent}% +

); })} @@ -452,18 +500,18 @@ const ReportSnapshotSlide = ({ data }: { data: Partial }) => { margin={{ top: 12, right: 6, left: -12, bottom: 0 }} barCategoryGap={20} > - + }) => { maxBarSize={20} isAnimationActive={false} > - + - + @@ -489,12 +547,28 @@ const ReportSnapshotSlide = ({ data }: { data: Partial }) => {
- -

{legendLabels?.[0] ?? "Option A"}

+ +

+ {legendLabels?.[0] ?? "Option A"} +

- -

{legendLabels?.[1] ?? "Option B"}

+ +

+ {legendLabels?.[1] ?? "Option B"} +

@@ -505,20 +579,33 @@ const ReportSnapshotSlide = ({ data }: { data: Partial }) => {
- + }) => { }) => {
- -

{legendLabels?.[0] ?? "Option A"}

+ +

+ {legendLabels?.[0] ?? "Option A"} +

- -

{legendLabels?.[1] ?? "Option B"}

+ +

+ {legendLabels?.[1] ?? "Option B"} +

@@ -560,9 +663,16 @@ const ReportSnapshotSlide = ({ data }: { data: Partial }) => { >
{visibleMetricCards.map((metric, index) => ( -
+
-
+
{usePulseFallback ? ( ) : ( @@ -574,9 +684,19 @@ const ReportSnapshotSlide = ({ data }: { data: Partial }) => { /> )}
-

{metric.value}

+

+ {metric.value} +

-

{metric.body}

+

+ {metric.body} +

))}
diff --git a/electron/servers/nextjs/app/presentation-templates/ProductOverview/TableOfContentSlide.tsx b/electron/servers/nextjs/app/presentation-templates/ProductOverview/TableOfContentSlide.tsx index 5cdba0a3..deb4f2ec 100644 --- a/electron/servers/nextjs/app/presentation-templates/ProductOverview/TableOfContentSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/ProductOverview/TableOfContentSlide.tsx @@ -1,7 +1,7 @@ import * as z from "zod"; -const PRODUCT_BG = "#d7dddd"; -const PRODUCT_DARK = "#05463d"; +const PRODUCT_BG = "var(--background-color,#d7dddd)"; +const PRODUCT_DARK = "var(--primary-color,#05463d)"; export const slideLayoutId = "product-overview-table-of-content-slide"; @@ -55,7 +55,10 @@ const TableOfContentSlide = ({ data }: { data: Partial }) => { return (
@@ -64,12 +67,25 @@ const TableOfContentSlide = ({ data }: { data: Partial }) => {
-

+

{section.title}

-

{section.description}

+

+ {section.description} +

-

{section.number}

+

+ {section.number} +

))}
@@ -78,11 +94,14 @@ const TableOfContentSlide = ({ data }: { data: Partial }) => {

{title}

-

+

{description}

diff --git a/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisBarSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisBarSlide.tsx index f1cc57b2..cd98a65c 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisBarSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisBarSlide.tsx @@ -77,11 +77,25 @@ const DataAnalysisBarSlide = ({ data }: { data: Partial }) => { const series = chartData?.series ?? []; return ( -
-
+
+
-

{title}

+

+ {title} +

@@ -89,7 +103,13 @@ const DataAnalysisBarSlide = ({ data }: { data: Partial }) => { {items?.map((item, index) => (
-
+
{itemIcon?.__icon_query__} }) => { style={{ filter: "brightness(0) invert(1)" }} />
-

{item.title}

+

+ {item.title} +

-

{item.description}

+

+ {item.description} +

))}
@@ -110,8 +140,14 @@ const DataAnalysisBarSlide = ({ data }: { data: Partial }) => {
-
- +
+

{legendLabel}

diff --git a/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisDashboardSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisDashboardSlide.tsx index 02fc5580..b1743e96 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisDashboardSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisDashboardSlide.tsx @@ -141,7 +141,13 @@ function SummaryCard({ }) { return (
-
+
{iconAlt
-

{value}

-

{label}

+

+ {value} +

+

+ {label} +

); @@ -167,16 +183,32 @@ const DataAnalysisDashboardSlide = ({ data }: { data: Partial }) => const otherHalfChart = charts?.slice(Math.ceil(charts.length / 2)); return ( -
-
+
+
-

{title}

+

+ {title} +

{summaryCards && summaryCards.length > 0 &&
+ style={{ + gridTemplateColumns: `repeat(${summaryCards.length}, minmax(220px, 1fr))`, + backgroundColor: "var(--card-color,#ffffff)", + }}> {summaryCards?.map((card, index) => ( }) => {halfChart && halfChart.length > 0 &&
{halfChart?.map((chart, index) => (
}) => {otherHalfChart && otherHalfChart.length > 0 &&
{otherHalfChart?.map((chart, index) => (
-
+
+
-

{data.title}

+

+ {data.title} +

-
+
{data.insightIcon?.__icon_query__}
-

{data.insightBody}

+

+ {data.insightBody} +

-
- +
+

{data.legendLabel}

diff --git a/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisLineStatsSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisLineStatsSlide.tsx index e946fec1..3098795d 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisLineStatsSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisLineStatsSlide.tsx @@ -88,18 +88,32 @@ type StatMetric = { function StatPill({ metrics }: { metrics: StatMetric[] }) { return ( -
+
{metrics.map((metric, index) => (

{metric.value}

{metric.label}

-

{metric.description}

+

+ {metric.description} +

{index === 0 && (
- +
)} @@ -116,22 +130,39 @@ const DataAnalysisLineStatsSlide = ({ data }: { data: Partial }) => const series = chartData?.series ?? []; return ( -
-
+
+
-

{title}

+

+ {title} +

-
+
- + {seriesALabel} - + {seriesBLabel}
@@ -143,13 +174,20 @@ const DataAnalysisLineStatsSlide = ({ data }: { data: Partial }) => data={rows} series={series} colorFallback="#157CFF" - dualLineColors={["#9fb6ff", "#4d4ef3"]} + density="default" + dualLineColors={["var(--graph-0,#9fb6ff)", "var(--graph-1,#4d4ef3)"]} />
-
- +
+

{data.legendLabel}

diff --git a/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisListSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisListSlide.tsx index 5f09fad3..26260404 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisListSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/DataAnalysisListSlide.tsx @@ -52,14 +52,23 @@ const DataAnalysisListSlide = ({ data }: { data: Partial }) => { const { title, itemIcon, items } = data; return ( -
+
-

+

{title}

@@ -68,7 +77,13 @@ const DataAnalysisListSlide = ({ data }: { data: Partial }) => { {items?.map((item, index) => (
-
+
{itemIcon?.__icon_query__} }) => { style={{ filter: "brightness(0) invert(1)" }} />
-

+

{item.title}

-

+

{item.description}

diff --git a/electron/servers/nextjs/app/presentation-templates/Report/IntroSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/IntroSlide.tsx index 1af15451..88f87f8e 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/IntroSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/IntroSlide.tsx @@ -15,24 +15,43 @@ const IntroSlide = ({ data }: { data: Partial }) => { const { title, subtitle, name, position } = data; return ( -
+
- - + + - - + +
-

{title}

-

{subtitle}

+

+ {title} +

+

+ {subtitle} +

-
+
-

{name}

-

{position}

+

{name}

+

{position}

diff --git a/electron/servers/nextjs/app/presentation-templates/Report/IntroductionImageSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/IntroductionImageSlide.tsx index 327e7f8a..16eb8267 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/IntroductionImageSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/IntroductionImageSlide.tsx @@ -45,25 +45,37 @@ const IntroductionImageSlide = ({ data }: { data: Partial }) => { const { title, body, bullets, featureImage } = data; return ( -
+
-

+

{title}

-

+

{body}

-
    +
      {bullets?.map((bullet, index) => (
    • {bullet} @@ -73,7 +85,10 @@ const IntroductionImageSlide = ({ data }: { data: Partial }) => {
-
+
{featureImage?.__image_prompt__} +
{metrics.map((metric, index) => ( @@ -99,14 +105,20 @@ function StatPill({ {metric.value}

{metric.label}

-

+

{metric.description}

{index === 0 &&
- +
} @@ -123,25 +135,37 @@ const IntroductionStatsSlide = ({ data }: { data: Partial }) => { const { title, body, bullets, statColumns } = data; return ( -
+
-

+

{title}

-

+

{body}

-
    +
      {bullets?.map((bullet, index) => (
    • {bullet} diff --git a/electron/servers/nextjs/app/presentation-templates/Report/MilestoneSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/MilestoneSlide.tsx index 94470948..530a0391 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/MilestoneSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/MilestoneSlide.tsx @@ -66,14 +66,23 @@ const MilestoneSlide = ({ data }: { data: Partial }) => { const { title, activeIndex, items } = data; return ( -
      +
      -

      +

      {title}

      @@ -91,17 +100,29 @@ const MilestoneSlide = ({ data }: { data: Partial }) => { ? "z-10 bg-[#157CFF] text-white" : "border border-[#157CFF] bg-white text-[#157CFE]" } ${index > 0 ? "ml-[-45px]" : ""} `} + style={{ + backgroundColor: isActive ? "var(--primary-color,#157CFF)" : "var(--card-color,#ffffff)", + borderColor: "var(--primary-color,#157CFF)", + color: isActive ? "var(--primary-text,#ffffff)" : "var(--primary-color,#157CFE)", + }} > - + {item.stepNumber}
      -
      0 ? 'pr-[33px]' : ''} ${index === 0 ? 'px-[33px]' : ''}`}> -

      +
      0 ? 'pr-[33px]' : ''} ${index === 0 ? 'px-[33px]' : ''}`} + style={{ color: "var(--background-text,#232223)" }} + > +

      {item.heading}

      -

      +

      {item.description}

      diff --git a/electron/servers/nextjs/app/presentation-templates/Report/PerformanceSnapshotSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/PerformanceSnapshotSlide.tsx index fa2902b3..a9aa00a0 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/PerformanceSnapshotSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/PerformanceSnapshotSlide.tsx @@ -80,7 +80,13 @@ function StatPill({ return ( -
      +
      {metrics.map((metric, index) => ( @@ -92,14 +98,20 @@ function StatPill({ {metric.value}

      {metric.label}

      -

      +

      {metric.description}

      {index === 0 &&
      - +
      } @@ -115,14 +127,23 @@ const PerformanceSnapshotSlide = ({ data }: { data: Partial }) => { const { title, columns } = data; return ( -
      +
      -

      +

      {title}

      diff --git a/electron/servers/nextjs/app/presentation-templates/Report/ServicesSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/ServicesSlide.tsx index 9df93cdb..bb471e15 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/ServicesSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/ServicesSlide.tsx @@ -108,14 +108,23 @@ const ServicesSlide = ({ data }: { data: Partial }) => { const { title, activeIndex, items } = data; return ( -
      +
      -

      +

      {title}

      @@ -135,6 +144,9 @@ const ServicesSlide = ({ data }: { data: Partial }) => { style={{ width: items?.length === 3 ? '266px' : items?.length === 4 ? '192px' : items?.length === 5 ? '157px' : '266px', height: items?.length === 3 ? '266px' : items?.length === 4 ? '192px' : items?.length === 5 ? '157px' : '270px', + backgroundColor: isActive ? "var(--primary-color,#157CFF)" : "transparent", + borderColor: "var(--primary-color,#157CFF)", + color: isActive ? "var(--primary-text,#ffffff)" : "var(--primary-color,#157CFE)", }} > }) => { />
      -

      {item.heading}

      -

      {item.description} @@ -194,7 +210,10 @@ const ServicesSlide = ({ data }: { data: Partial }) => { width: items?.length === 3 ? '117px' : items?.length === 4 ? '84px' : items?.length === 5 ? '60px' : '112px', }} height="15" viewBox="0 0 119 15" fill="none"> - +

      )} diff --git a/electron/servers/nextjs/app/presentation-templates/Report/SolutionSlide.tsx b/electron/servers/nextjs/app/presentation-templates/Report/SolutionSlide.tsx index 8e881bce..2d75e8ee 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/SolutionSlide.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/SolutionSlide.tsx @@ -70,7 +70,13 @@ function SolutionCard({ description: string; }) { return ( -
      +

      {stepNumber}

      {description} @@ -84,14 +90,23 @@ const SolutionSlide = ({ data }: SolutionSlideProps) => { const visibleCards = showImage ? cards?.slice(0, 2) : cards; return ( -

      +
      {title && ( -

      +

      {title}

      )} @@ -100,7 +115,10 @@ const SolutionSlide = ({ data }: SolutionSlideProps) => { {showImage ? (
      {featureImage?.__image_url__ && ( -
      +
      {featureImage?.__image_prompt__}; const TeamSlide = ({ data }: { data: Partial }) => { return ( -
      +
      @@ -93,9 +99,19 @@ const TeamSlide = ({ data }: { data: Partial }) => { alt={member.image.__image_prompt__} className="h-full w-full object-cover" /> -
      -
      -

      {member.title}

      +
      +
      +

      + {member.title} +

      {member.name}

      diff --git a/electron/servers/nextjs/app/presentation-templates/Report/flexibleReportChart.tsx b/electron/servers/nextjs/app/presentation-templates/Report/flexibleReportChart.tsx index 75be9b1c..7c901f26 100644 --- a/electron/servers/nextjs/app/presentation-templates/Report/flexibleReportChart.tsx +++ b/electron/servers/nextjs/app/presentation-templates/Report/flexibleReportChart.tsx @@ -249,7 +249,7 @@ export function normalizeFlexibleChartData( return { data: mapped, series }; } -const graphVar = (index: number, fallback: string) => `var(--graph-${index % 8}, ${fallback})`; +const graphVar = (index: number, fallback: string) => `var(--graph-${index % 10}, ${fallback})`; export type ChartDensity = "default" | "compact"; @@ -269,7 +269,7 @@ export function FlexibleReportChart({ data: chartData, series = [], colorFallback = "#157CFF", - dualLineColors = ["#9fb6ff", "#4d4ef3"], + dualLineColors = ["var(--graph-0,#9fb6ff)", "var(--graph-1,#4d4ef3)"], density = "default", }: FlexibleReportChartProps) { const areaGradientId = `flex-area-${useId().replace(/:/g, "")}`; @@ -352,25 +352,24 @@ export function FlexibleReportChart({ const nm = String(name ?? ""); const short = nm.length <= ui.pieMaxNameLen; const pct = `${(percent * 100).toFixed(0)}%`; - const fontSize = compact ? (short ? 6 : 5) : short ? 10 : 9; + const fontSize = compact ? (short ? 6 : 5) : short ? 12 : 12; const labelText = compact ? pct : short ? `${name} ${pct}` : pct; return ( - - {labelText} - + + + {/* */} + + {labelText} + + ); }; @@ -399,7 +398,7 @@ export function FlexibleReportChart({ @@ -425,7 +424,13 @@ export function FlexibleReportChart({ axisLine={false} /> - + @@ -629,7 +634,7 @@ export function FlexibleReportChart({ tickLine={false} axisLine={false} /> - + diff --git a/electron/servers/nextjs/app/presentation-templates/index.tsx b/electron/servers/nextjs/app/presentation-templates/index.tsx index d2783b16..9a40bcee 100644 --- a/electron/servers/nextjs/app/presentation-templates/index.tsx +++ b/electron/servers/nextjs/app/presentation-templates/index.tsx @@ -36,7 +36,7 @@ import CoverSlide, { Schema as PoCoverSchema, slideLayoutId as PoCoverId, slideL import ImageGallerySlide, { Schema as PoImageGallerySchema, slideLayoutId as PoImageGalleryId, slideLayoutName as PoImageGalleryName, slideLayoutDescription as PoImageGalleryDesc } from "./ProductOverview/ImageGallerySlide"; import IntroductionSlide, { Schema as PoIntroductionSchema, slideLayoutId as PoIntroductionId, slideLayoutName as PoIntroductionName, slideLayoutDescription as PoIntroductionDesc } from "./ProductOverview/IntroductionSlide"; import KpiCardsSlide, { Schema as PoKpiCardsSchema, slideLayoutId as PoKpiCardsId, slideLayoutName as PoKpiCardsName, slideLayoutDescription as PoKpiCardsDesc } from "./ProductOverview/KpiCardsSlide"; -import MarketOpportunitySlide, { Schema as PoMarketOpportunitySchema, slideLayoutId as PoMarketOpportunityId, slideLayoutName as PoMarketOpportunityName, slideLayoutDescription as PoMarketOpportunityDesc } from "./ProductOverview/MarketOpportunitySlide"; +// import MarketOpportunitySlide, { Schema as PoMarketOpportunitySchema, slideLayoutId as PoMarketOpportunityId, slideLayoutName as PoMarketOpportunityName, slideLayoutDescription as PoMarketOpportunityDesc } from "./ProductOverview/MarketOpportunitySlide"; import MeetTeamSlide, { Schema as PoMeetTeamSchema, slideLayoutId as PoMeetTeamId, slideLayoutName as PoMeetTeamName, slideLayoutDescription as PoMeetTeamDesc } from "./ProductOverview/MeetTeamSlide"; import MissionVisionSlide, { Schema as PoMissionVisionSchema, slideLayoutId as PoMissionVisionId, slideLayoutName as PoMissionVisionName, slideLayoutDescription as PoMissionVisionDesc } from "./ProductOverview/MissionVisionSlide"; import OurServicesSlide, { Schema as PoOurServicesSchema, slideLayoutId as PoOurServicesId, slideLayoutName as PoOurServicesName, slideLayoutDescription as PoOurServicesDesc } from "./ProductOverview/OurServicesSlide"; @@ -274,7 +274,7 @@ export const productOverviewTemplates: TemplateWithData[] = [ createTemplateEntry(TableOfContentSlide, PoTableOfContentSchema, PoTableOfContentId, PoTableOfContentName, PoTableOfContentDesc, "product-overview", "TableOfContentSlide"), createTemplateEntry(IntroductionSlide, PoIntroductionSchema, PoIntroductionId, PoIntroductionName, PoIntroductionDesc, "product-overview", "IntroductionSlide"), createTemplateEntry(MissionVisionSlide, PoMissionVisionSchema, PoMissionVisionId, PoMissionVisionName, PoMissionVisionDesc, "product-overview", "MissionVisionSlide"), - createTemplateEntry(MarketOpportunitySlide, PoMarketOpportunitySchema, PoMarketOpportunityId, PoMarketOpportunityName, PoMarketOpportunityDesc, "product-overview", "MarketOpportunitySlide"), + // createTemplateEntry(MarketOpportunitySlide, PoMarketOpportunitySchema, PoMarketOpportunityId, PoMarketOpportunityName, PoMarketOpportunityDesc, "product-overview", "MarketOpportunitySlide"), createTemplateEntry(BusinessChallengesGridSlide, PoBizChallengesGridSchema, PoBizChallengesGridId, PoBizChallengesGridName, PoBizChallengesGridDesc, "product-overview", "BusinessChallengesGridSlide"), createTemplateEntry(BusinessChallengesCardsSlide, PoBizChallengesCardsSchema, PoBizChallengesCardsId, PoBizChallengesCardsName, PoBizChallengesCardsDesc, "product-overview", "BusinessChallengesCardsSlide"), createTemplateEntry(OurServicesSlide, PoOurServicesSchema, PoOurServicesId, PoOurServicesName, PoOurServicesDesc, "product-overview", "OurServicesSlide"),

{column} @@ -115,12 +136,23 @@ const ComparisonTableWithTextSlide = ({ data }: { data: Partial }) =
{cell}