feat(artboard): implement 8 new templates

libs/schema/src/sample.ts

@@ -14,8 +14,8 @@ export const sampleResume: ResumeData = {
     customFields: [],
     picture: {
       url: "https://res.cloudinary.com/amruth-pillai/image/upload/v1699362669/reactive-resume/sample-resume/sample-picture_iitowc.jpg",
-      size: 64,
-      aspectRatio: 0.75,
+      size: 128,
+      aspectRatio: 1,
       borderRadius: 6,
       effects: {
         hidden: false,
@@ -35,7 +35,7 @@ export const sampleResume: ResumeData = {
     },
     awards: {
       name: "Awards",
-      columns: 2,
+      columns: 1,
       visible: true,
       id: "awards",
       items: [
@@ -204,7 +204,7 @@ export const sampleResume: ResumeData = {
     },
     languages: {
       name: "Languages",
-      columns: 2,
+      columns: 1,
       visible: true,
       id: "languages",
       items: [
@@ -240,7 +240,7 @@ export const sampleResume: ResumeData = {
     },
     profiles: {
       name: "Profiles",
-      columns: 5,
+      columns: 2,
       visible: true,
       id: "profiles",
       items: [
@@ -331,7 +331,7 @@ export const sampleResume: ResumeData = {
     },
     references: {
       name: "References",
-      columns: 2,
+      columns: 1,
       visible: true,
       id: "references",
       items: [
@@ -453,21 +453,24 @@ export const sampleResume: ResumeData = {
   },
   metadata: {
     locale: "en",
-    template: "rhyhorn",
+    template: "pikachu",
     layout: [
-      [["profiles", "summary", "experience"], []],
-      [["custom.juryi0w9w9jabsgorks0bixq", "education", "certifications", "awards"], []],
       [
-        ["skills", "interests", "publications", "volunteer", "languages", "projects", "references"],
-        [],
+        ["summary", "experience"],
+        ["profiles", "skills", "awards", "certifications"],
       ],
+      [
+        ["custom.juryi0w9w9jabsgorks0bixq", "education"],
+        ["interests", "languages"],
+      ],
+      [["publications", "volunteer", "projects", "references"], []],
     ],
     css: {
       value: ".section {\n\toutline: 1px solid #000;\n\toutline-offset: 4px;\n}",
       visible: false,
     },
     page: {
-      margin: 18,
+      margin: 24,
       format: "a4",
       options: {
         breakLine: true,
@@ -477,16 +480,16 @@ export const sampleResume: ResumeData = {
     theme: {
       background: "#ffffff",
       text: "#000000",
-      primary: "#78716c",
+      primary: "#DC1A4E",
     },
     typography: {
       font: {
         family: "IBM Plex Serif",
         subset: "latin",
-        variants: ["regular", "italic", "600", "600italic"],
-        size: 14,
+        variants: ["regular", "italic", "500", "600", "600italic"],
+        size: 13,
       },
-      lineHeight: 1.5,
+      lineHeight: 2,
       underlineLinks: true,
     },
     notes:

libs/schema/src/sections/index.ts

@@ -92,8 +92,7 @@ export type Sections = z.infer<typeof sectionsSchema>;
 export type SectionKey = "basics" | keyof Sections | `custom.${string}`;
 export type SectionWithItem<T = unknown> = Sections[FilterKeys<Sections, { items: T[] }>];
 export type SectionItem = SectionWithItem["items"][number];
-export type CustomSection = z.infer<typeof customSchema>;
-export type CustomSectionItem = CustomSection["items"][number];
+export type CustomSectionGroup = z.infer<typeof customSchema>;
 
 // Defaults
 export const defaultSection: Section = {

libs/utils/src/index.ts

@@ -3,9 +3,11 @@ export * from "./namespaces/cefr";
 export * from "./namespaces/csv";
 export * from "./namespaces/date";
 export * from "./namespaces/fonts";
+export * from "./namespaces/number";
 export * from "./namespaces/object";
 export * from "./namespaces/page";
 export * from "./namespaces/promise";
 export * from "./namespaces/string";
 export * from "./namespaces/style";
+export * from "./namespaces/template";
 export * from "./namespaces/types";

libs/utils/src/namespaces/number.ts

@@ -0,0 +1,7 @@
+export const linearTransform = (
+  value: number,
+  inMin: number,
+  inMax: number,
+  outMin: number,
+  outMax: number,
+) => ((value - inMin) * (outMax - outMin)) / (inMax - inMin) + outMin;

libs/utils/src/namespaces/page.ts

@@ -1,5 +1,3 @@
-import { Template } from "./types";
-
 export const pageSizeMap = {
   a4: {
     width: 210,
@@ -10,12 +8,3 @@ export const pageSizeMap = {
     height: 279,
   },
 };
-
-export const templatesList: Template[] = [
-  {
-    id: "rhyhorn",
-    name: "Rhyhorn",
-    image:
-      "https://res.cloudinary.com/amruth-pillai/image/upload/v1699370067/reactive-resume/templates/482-2480x3508_vuf5ev.jpg",
-  },
-];

libs/utils/src/namespaces/template.ts

@@ -0,0 +1,46 @@
+export type TemplateKey =
+  | "onyx"
+  | "kakuna"
+  | "rhyhorn"
+  | "azurill"
+  | "ditto"
+  | "chikorita"
+  | "bronzor"
+  | "pikachu";
+
+export type Template = { id: TemplateKey; name: string };
+
+export const templatesList: Template[] = [
+  {
+    id: "onyx",
+    name: "Onyx",
+  },
+  {
+    id: "kakuna",
+    name: "Kakuna",
+  },
+  {
+    id: "rhyhorn",
+    name: "Rhyhorn",
+  },
+  {
+    id: "azurill",
+    name: "Azurill",
+  },
+  {
+    id: "ditto",
+    name: "Ditto",
+  },
+  {
+    id: "chikorita",
+    name: "Chikorita",
+  },
+  {
+    id: "bronzor",
+    name: "Bronzor",
+  },
+  {
+    id: "pikachu",
+    name: "Pikachu",
+  },
+];

libs/utils/src/namespaces/types.ts

@@ -1,7 +1,5 @@
 export type Json = Record<string, unknown>;
 
-export type Template = { id: string; name: string; image: string };
-
 export type LayoutLocator = { page: number; column: number; section: number };
 
 export type DeepPartial<T> = T extends object ? { [P in keyof T]?: DeepPartial<T[P]> } : T;