feat(pdf): rename acquisition-library to pdf-library and update package name to @mintel/pdf

packages/pdf-library/src/components/pdf/modules/SitemapModule.tsx

@@ -0,0 +1,125 @@
+"use client";
+
+import * as React from "react";
+import {
+  View as PDFView,
+  Text as PDFText,
+  StyleSheet,
+} from "@react-pdf/renderer";
+import { DocumentTitle, COLORS, FONT_SIZES } from "../SharedUI";
+
+const styles = StyleSheet.create({
+  section: { marginBottom: 32 },
+  intro: {
+    fontSize: FONT_SIZES.BODY,
+    color: COLORS.TEXT_DIM,
+    lineHeight: 1.4,
+    marginBottom: 24,
+    textAlign: "justify",
+  },
+  sitemapTree: { marginTop: 8 },
+  rootNode: {
+    padding: 12,
+    backgroundColor: COLORS.GRID,
+    marginBottom: 20,
+    borderLeftWidth: 2,
+    borderLeftColor: COLORS.CHARCOAL,
+  },
+  rootTitle: {
+    fontSize: FONT_SIZES.HEADING,
+    fontWeight: "bold",
+    color: COLORS.CHARCOAL,
+    letterSpacing: 0.5,
+  },
+  categorySection: { marginBottom: 20 },
+  categoryHeader: {
+    flexDirection: "row",
+    alignItems: "center",
+    paddingBottom: 6,
+    borderBottomWidth: 1,
+    borderBottomColor: COLORS.BLUEPRINT,
+    marginBottom: 10,
+  },
+  categoryIcon: {
+    width: 8,
+    height: 8,
+    backgroundColor: COLORS.GRID,
+    borderInlineWidth: 1,
+    borderColor: COLORS.DIVIDER,
+    marginRight: 10,
+  },
+  categoryTitle: {
+    fontSize: FONT_SIZES.BODY,
+    fontWeight: "bold",
+    color: COLORS.CHARCOAL,
+    textTransform: "uppercase",
+    letterSpacing: 1,
+  },
+  pagesGrid: { flexDirection: "row", flexWrap: "wrap" },
+  pageCard: {
+    width: "48%",
+    marginRight: "2%",
+    marginBottom: 12,
+    padding: 10,
+    borderWidth: 1,
+    borderColor: COLORS.GRID,
+    backgroundColor: "#fafafa",
+  },
+  pageTitle: {
+    fontSize: FONT_SIZES.BODY,
+    fontWeight: "bold",
+    color: COLORS.TEXT_MAIN,
+    marginBottom: 4,
+  },
+  pageDesc: {
+    fontSize: FONT_SIZES.TINY,
+    color: COLORS.TEXT_DIM,
+    lineHeight: 1.3,
+  },
+});
+
+export const SitemapModule = ({ state }: any) => (
+  <>
+    <DocumentTitle title="Informationsarchitektur" isHero={true} />
+    <PDFView style={styles.section}>
+      <PDFText style={styles.intro}>
+        Die folgende Struktur definiert die logische Hierarchie und
+        Benutzerführung. Sie dient als Bauplan für die technische Umsetzung und
+        stellt sicher, dass alle relevanten Geschäftsbereiche intuitiv
+        auffindbar sind.
+      </PDFText>
+
+      <PDFView style={styles.sitemapTree}>
+        <PDFView style={styles.rootNode}>
+          <PDFText style={styles.rootTitle}>Seitenstruktur</PDFText>
+        </PDFView>
+
+        {state.sitemap?.map((cat: any, i: number) => (
+          <PDFView key={i} style={styles.categorySection} wrap={false}>
+            <PDFView style={styles.categoryHeader}>
+              <PDFView style={styles.categoryIcon} />
+              <PDFText style={styles.categoryTitle}>{cat.category}</PDFText>
+            </PDFView>
+
+            <PDFView style={styles.pagesGrid}>
+              {cat.pages.map((p: any, j: number) => (
+                <PDFView
+                  key={j}
+                  style={[
+                    styles.pageCard,
+                    j % 2 === 1 ? { marginRight: 0 } : {},
+                  ]}
+                >
+                  <PDFText style={styles.pageTitle}>{p.title}</PDFText>
+                  {p.desc && (
+                    <PDFText style={styles.pageDesc}>{p.desc}</PDFText>
+                  )}
+                </PDFView>
+              ))}
+            </PDFView>
+          </PDFView>
+        ))}
+      </PDFView>
+    </PDFView>
+  </>
+);