@ahmedrowaihi/pdf-forge-preview 1.0.0-canary.0

package/src/utils/get-template-component.ts

@@ -0,0 +1,158 @@
+import path from 'node:path';
+import type { render } from '@ahmedrowaihi/pdf-forge-components';
+import { type BuildFailure, build, type OutputFile } from 'esbuild';
+import type React from 'react';
+import type { RawSourceMap } from 'source-map-js';
+import { z } from 'zod';
+import { convertStackWithSourceMap } from './convert-stack-with-sourcemap';
+import { renderingUtilitiesExporter } from './esbuild/renderring-utilities-exporter';
+import { isErr } from './result';
+import { createContext, runBundledCode } from './run-bundled-code';
+import type { ErrorObject } from './types/error-object';
+import type { Template as TemplateComponent } from './types/template';
+
+const TemplateComponentModule = z.object({
+  default: z.any(),
+  render: z.function(),
+  reactPDFCreateReactElement: z.function(),
+});
+
+export const getTemplateComponent = async (
+  templatePath: string,
+  jsxRuntimePath: string,
+): Promise<
+  | {
+      templateComponent: TemplateComponent;
+
+      createElement: typeof React.createElement;
+
+      /**
+       * Renders the HTML with `data-source-file`/`data-source-line` attributes that should only be
+       * used internally in the preview server and never shown to the user.
+       */
+      renderWithReferences: typeof render;
+      render: typeof render;
+
+      sourceMapToOriginalFile: RawSourceMap;
+    }
+  | { error: ErrorObject }
+> => {
+  let outputFiles: OutputFile[];
+  try {
+    const buildData = await build({
+      bundle: true,
+      entryPoints: [templatePath],
+      plugins: [renderingUtilitiesExporter([templatePath])],
+      platform: 'node',
+      write: false,
+
+      jsxDev: true,
+      jsxImportSource: jsxRuntimePath,
+
+      format: 'cjs',
+      jsx: 'automatic',
+      logLevel: 'silent',
+      // allows for using jsx on a .js file
+      loader: {
+        '.js': 'jsx',
+      },
+      outdir: 'stdout', // just a stub for esbuild, it won't actually write to this folder
+      sourcemap: 'external',
+    });
+    outputFiles = buildData.outputFiles;
+  } catch (exception) {
+    const buildFailure = exception as BuildFailure;
+    return {
+      error: {
+        message: buildFailure.message,
+        stack: buildFailure.stack,
+        name: buildFailure.name,
+        cause: buildFailure.cause,
+      },
+    };
+  }
+
+  const sourceMapFile = outputFiles[0]!;
+  const bundledTemplateFile = outputFiles[1]!;
+  const builtTemplateCode = bundledTemplateFile.text;
+
+  const sourceMapToTemplate = JSON.parse(sourceMapFile.text) as RawSourceMap;
+  // because it will have a path like <tsconfigLocation>/stdout/template.js.map
+  sourceMapToTemplate.sourceRoot = path.resolve(sourceMapFile.path, '../..');
+  sourceMapToTemplate.sources = sourceMapToTemplate.sources.map((source) =>
+    path.resolve(sourceMapFile.path, '..', source),
+  );
+
+  const context = createContext(templatePath);
+  context.shouldIncludeSourceReference = false;
+  const runningResult = runBundledCode(
+    builtTemplateCode,
+    templatePath,
+    context,
+  );
+
+  if (isErr(runningResult)) {
+    const { error } = runningResult;
+    if (error instanceof Error) {
+      error.stack &&= error.stack.split('at Script.runInContext (node:vm')[0];
+
+      return {
+        error: {
+          name: error.name,
+          message: error.message,
+          stack: convertStackWithSourceMap(
+            error.stack,
+            templatePath,
+            sourceMapToTemplate,
+          ),
+          cause: error.cause,
+        },
+      };
+    }
+
+    throw error;
+  }
+
+  const parseResult = TemplateComponentModule.safeParse(runningResult.value);
+
+  if (parseResult.error) {
+    return {
+      error: {
+        name: 'Error',
+        message: `The template component at ${templatePath} does not contain the expected exports`,
+        stack: new Error().stack,
+        cause: parseResult.error,
+      },
+    };
+  }
+
+  if (typeof parseResult.data.default !== 'function') {
+    return {
+      error: {
+        name: 'Error',
+        message: `The template component at ${templatePath} does not contain a default exported function`,
+        stack: new Error().stack,
+        cause: parseResult.error,
+      },
+    };
+  }
+
+  const { data: componentModule } = parseResult;
+
+  const typedRender = componentModule.render as typeof render;
+
+  return {
+    templateComponent: componentModule.default as TemplateComponent,
+    renderWithReferences: (async (...args: Parameters<typeof render>) => {
+      context.shouldIncludeSourceReference = true;
+      const renderingResult = await typedRender(...args);
+      context.shouldIncludeSourceReference = false;
+      return renderingResult;
+    }) as typeof render,
+    render: typedRender,
+    createElement:
+      componentModule.reactPDFCreateReactElement as typeof React.createElement,
+
+    sourceMapToOriginalFile: sourceMapToTemplate,
+  };
+};

package/src/utils/get-templates-directory-metadata.ts

@@ -0,0 +1,195 @@
+import fs from 'node:fs';
+import path from 'node:path';
+
+const isFileATemplate = async (fullPath: string): Promise<boolean> => {
+  let fileHandle: fs.promises.FileHandle;
+  try {
+    fileHandle = await fs.promises.open(fullPath, 'r');
+  } catch (exception) {
+    console.warn(exception);
+    return false;
+  }
+  const stat = await fileHandle.stat();
+
+  if (stat.isDirectory()) {
+    await fileHandle.close();
+    return false;
+  }
+
+  const { ext } = path.parse(fullPath);
+
+  if (!['.js', '.tsx', '.jsx'].includes(ext)) {
+    await fileHandle.close();
+    return false;
+  }
+
+  const fileContents = await fileHandle.readFile('utf8');
+
+  await fileHandle.close();
+
+  const hasES6DefaultExport = /\bexport\s+default\b/gm.test(fileContents);
+
+  const hasCommonJSExport = /\bmodule\.exports\s*=/gm.test(fileContents);
+
+  const hasNamedExport = /\bexport\s+\{[^}]*\bdefault\b[^}]*\}/gm.test(
+    fileContents,
+  );
+
+  return hasES6DefaultExport || hasCommonJSExport || hasNamedExport;
+};
+
+export interface TemplatesDirectory {
+  absolutePath: string;
+  relativePath: string;
+  directoryName: string;
+  templateFilenames: string[];
+  subDirectories: TemplatesDirectory[];
+}
+
+const directoryContainsTemplates = async (
+  directoryPath: string,
+): Promise<boolean> => {
+  try {
+    const dirents = await fs.promises.readdir(directoryPath, {
+      withFileTypes: true,
+    });
+
+    const visibleDirents = dirents.filter(
+      (dirent) => !dirent.name.startsWith('.'),
+    );
+
+    const fileTemplateChecks = await Promise.all(
+      visibleDirents
+        .filter((dirent) => dirent.isFile())
+        .map((dirent) =>
+          isFileATemplate(path.join(directoryPath, dirent.name)),
+        ),
+    );
+
+    if (fileTemplateChecks.some((isTemplate) => isTemplate)) {
+      return true;
+    }
+
+    const subDirectoryChecks = await Promise.all(
+      visibleDirents
+        .filter(
+          (dirent) =>
+            dirent.isDirectory() &&
+            !dirent.name.startsWith('_') &&
+            dirent.name !== 'static',
+        )
+        .map((dirent) =>
+          directoryContainsTemplates(path.join(directoryPath, dirent.name)),
+        ),
+    );
+
+    return subDirectoryChecks.some((hasTemplates) => hasTemplates);
+  } catch {
+    return false;
+  }
+};
+
+const mergeDirectoriesWithSubDirectories = (
+  templatesDirectoryMetadata: TemplatesDirectory,
+): TemplatesDirectory => {
+  let currentResultingMergedDirectory: TemplatesDirectory =
+    templatesDirectoryMetadata;
+
+  while (
+    currentResultingMergedDirectory.templateFilenames.length === 0 &&
+    currentResultingMergedDirectory.subDirectories.length === 1
+  ) {
+    const onlySubDirectory = currentResultingMergedDirectory.subDirectories[0]!;
+    currentResultingMergedDirectory = {
+      ...onlySubDirectory,
+      directoryName: path.join(
+        currentResultingMergedDirectory.directoryName,
+        onlySubDirectory.directoryName,
+      ),
+    };
+  }
+
+  return currentResultingMergedDirectory;
+};
+
+export const getTemplatesDirectoryMetadata = async (
+  absolutePathToTemplatesDirectory: string,
+  keepFileExtensions = false,
+  isSubDirectory = false,
+
+  baseDirectoryPath = absolutePathToTemplatesDirectory,
+): Promise<TemplatesDirectory | undefined> => {
+  if (!fs.existsSync(absolutePathToTemplatesDirectory)) return;
+
+  const dirents = await fs.promises.readdir(absolutePathToTemplatesDirectory, {
+    withFileTypes: true,
+  });
+
+  const visibleDirents = dirents.filter(
+    (dirent) => !dirent.name.startsWith('.'),
+  );
+
+  const isTemplatePredicates = await Promise.all(
+    visibleDirents.map((dirent) =>
+      isFileATemplate(path.join(absolutePathToTemplatesDirectory, dirent.name)),
+    ),
+  );
+  const templateFilenames = visibleDirents
+    .filter((_, i) => isTemplatePredicates[i])
+    .map((dirent) =>
+      keepFileExtensions
+        ? dirent.name
+        : dirent.name.replace(path.extname(dirent.name), ''),
+    );
+
+  const directoryCandidates = visibleDirents.filter(
+    (dirent) =>
+      dirent.isDirectory() &&
+      !dirent.name.startsWith('_') &&
+      dirent.name !== 'static',
+  );
+
+  const directoriesWithTemplates = await Promise.all(
+    directoryCandidates.map(async (dirent) => {
+      const direntAbsolutePath = path.join(
+        absolutePathToTemplatesDirectory,
+        dirent.name,
+      );
+      const hasTemplates = await directoryContainsTemplates(direntAbsolutePath);
+      return { dirent, hasTemplates };
+    }),
+  );
+
+  const subDirectories = await Promise.all(
+    directoriesWithTemplates
+      .filter(({ hasTemplates }) => hasTemplates)
+      .map(({ dirent }) => {
+        const direntAbsolutePath = path.join(
+          absolutePathToTemplatesDirectory,
+          dirent.name,
+        );
+
+        return getTemplatesDirectoryMetadata(
+          direntAbsolutePath,
+          keepFileExtensions,
+          true,
+          baseDirectoryPath,
+        ) as Promise<TemplatesDirectory>;
+      }),
+  );
+
+  const templatesMetadata = {
+    absolutePath: absolutePathToTemplatesDirectory,
+    relativePath: path.relative(
+      baseDirectoryPath,
+      absolutePathToTemplatesDirectory,
+    ),
+    directoryName: absolutePathToTemplatesDirectory.split(path.sep).pop()!,
+    templateFilenames,
+    subDirectories,
+  } satisfies TemplatesDirectory;
+
+  return isSubDirectory
+    ? mergeDirectoriesWithSubDirectories(templatesMetadata)
+    : templatesMetadata;
+};

package/src/utils/index.ts

@@ -0,0 +1,6 @@
+export * from './cn';
+export * from './copy-text-to-clipboard';
+export * from './language-map';
+export * from './sanitize';
+export * from './types/as';
+export * from './unreachable';

package/src/utils/language-map.ts

@@ -0,0 +1,7 @@
+const languageMap = {
+  tsx: 'React',
+  html: 'HTML',
+  markdown: 'Plain Text',
+};
+
+export default languageMap;

package/src/utils/load-stream.ts

@@ -0,0 +1,15 @@
+export async function* loadStream<T>(stream: ReadableStream<T>) {
+  const reader = stream.getReader();
+  try {
+    while (true) {
+      const { value, done } = await reader.read();
+      if (done) {
+        break;
+      }
+
+      yield value;
+    }
+  } finally {
+    reader.releaseLock();
+  }
+}

package/src/utils/register-spinner-autostopping.ts

@@ -0,0 +1,28 @@
+import logSymbols from 'log-symbols';
+import type { Ora } from 'ora';
+
+const spinners = new Set<Ora>();
+
+process.on('SIGINT', () => {
+  spinners.forEach((spinner) => {
+    if (spinner.isSpinning) {
+      spinner.stop();
+    }
+  });
+});
+
+process.on('exit', (code) => {
+  if (code !== 0) {
+    spinners.forEach((spinner) => {
+      if (spinner.isSpinning) {
+        spinner.stopAndPersist({
+          symbol: logSymbols.error,
+        });
+      }
+    });
+  }
+});
+
+export const registerSpinnerAutostopping = (spinner: Ora) => {
+  spinners.add(spinner);
+};

package/src/utils/result.ts

@@ -0,0 +1,49 @@
+type Ok<T, _E> = {
+  value: T;
+};
+type Error<_T, E> = {
+  error: E;
+};
+
+/**
+ * Do not destructure this object, it is meant to have all fields together
+ * in the same object
+ */
+export type Result<T, E> = Ok<T, E> | Error<T, E>;
+
+export function isErr<T, E>(result: Result<T, E>): result is Error<T, E> {
+  return 'error' in result;
+}
+
+export function isOk<T, E>(result: Result<T, E>): result is Ok<T, E> {
+  return 'value' in result && !('error' in result);
+}
+
+export function mapResult<T, E, B>(
+  result: Result<T, E>,
+  callback: (value: T) => B,
+): Result<B, E> {
+  if (isOk(result)) {
+    return ok(callback(result.value));
+  }
+
+  return result;
+}
+
+export function ok<T, E>(value: NoInfer<T>): Ok<T, E>;
+// biome-ignore lint/suspicious/noConfusingVoidType: This is required for void return types on functions that can still error
+export function ok<_T extends void = void, E = never>(value: void): Ok<void, E>;
+export function ok<T, E>(value: NoInfer<T>): Ok<T, E> {
+  return {
+    value,
+  };
+}
+
+export function err<T, E>(error: NoInfer<E>): Error<T, E>;
+// biome-ignore lint/suspicious/noConfusingVoidType: This is required for void return types on functions that can still error
+export function err<T, _E extends void = void>(error: void): Error<T, void>;
+export function err<T, E>(error: NoInfer<E>): Error<T, E> {
+  return {
+    error,
+  };
+}

package/src/utils/run-bundled-code.ts

@@ -0,0 +1,86 @@
+import path from 'node:path';
+import vm from 'node:vm';
+import { err, ok, type Result } from './result';
+import { staticNodeModulesForVM } from './static-node-modules-for-vm';
+
+export const createContext = (filename: string): vm.Context => {
+  return new Proxy(
+    {
+      module: {
+        exports: {},
+      },
+      __filename: filename,
+      __dirname: path.dirname(filename),
+      require: (specifiedModule: string) => {
+        let m = specifiedModule;
+        if (specifiedModule.startsWith('node:')) {
+          m = m.split(':')[1]!;
+        }
+
+        if (m in staticNodeModulesForVM) {
+          return staticNodeModulesForVM[m];
+        }
+
+        return require(`${specifiedModule}`) as unknown;
+        // this string templating was necessary to not have
+        // webpack warnings like:
+        //
+        // Import trace for requested module:
+        // ./src/utils/get-template-component.tsx
+        // ./src/app/page.tsx
+        //  ⚠ ./src/utils/get-template-component.tsx
+        // Critical dependency: the request of a dependency is an expression
+      },
+    },
+    {
+      get(target, property: string) {
+        if (property in target) {
+          return target[property];
+        }
+
+        return globalThis[property as keyof typeof globalThis];
+      },
+      has(target, property: string) {
+        return property in target || property in globalThis;
+      },
+      set(target, property, value) {
+        target[property] = value;
+        return true;
+      },
+      getOwnPropertyDescriptor(target, property) {
+        return (
+          Object.getOwnPropertyDescriptor(target, property) ??
+          Object.getOwnPropertyDescriptor(globalThis, property)
+        );
+      },
+      ownKeys(target) {
+        const keys = new Set([
+          ...Reflect.ownKeys(globalThis),
+          ...Reflect.ownKeys(target),
+        ]);
+        return Array.from(keys);
+      },
+      defineProperty(target, property, descriptor) {
+        Object.defineProperty(target, property, descriptor);
+        return true;
+      },
+      deleteProperty(target, property) {
+        return delete target[property];
+      },
+    },
+  );
+};
+
+export const runBundledCode = (
+  code: string,
+  filename: string,
+  fakeContext: vm.Context = createContext(filename),
+): Result<unknown, unknown> => {
+  try {
+    vm.runInNewContext(code, fakeContext, { filename });
+  } catch (exception) {
+    return err(exception);
+  }
+
+  return ok(fakeContext.module.exports as unknown);
+};

package/src/utils/sanitize.ts

@@ -0,0 +1,6 @@
+/**
+ * Sanitizes text by replacing underscores and hyphens with spaces
+ */
+export const sanitize = (text: string): string => {
+  return text.replace(/[_-]/g, ' ');
+};

package/src/utils/sleep.ts

@@ -0,0 +1,3 @@
+export function sleep(ms: number) {
+  return new Promise((resolve) => setTimeout(resolve, ms));
+}

package/src/utils/snake-to-camel.ts

@@ -0,0 +1,5 @@
+export function snakeToCamel(snakeStr: string) {
+  return snakeStr
+    .toLowerCase()
+    .replace(/-+([a-z])/g, (_match, letter) => letter.toUpperCase());
+}

package/src/utils/static-node-modules-for-vm.ts

@@ -0,0 +1,93 @@
+import assert from 'node:assert';
+import asyncHooks from 'node:async_hooks';
+import buffer from 'node:buffer';
+import childProcess from 'node:child_process';
+import cluster from 'node:cluster';
+import console from 'node:console';
+import constants from 'node:constants';
+import crypto from 'node:crypto';
+import dgram from 'node:dgram';
+import diagnosticsChannel from 'node:diagnostics_channel';
+import dns from 'node:dns';
+import domain from 'node:domain';
+import events from 'node:events';
+import fs from 'node:fs';
+import fsPromises from 'node:fs/promises';
+import http from 'node:http';
+import http2 from 'node:http2';
+import https from 'node:https';
+import inspector from 'node:inspector';
+import module from 'node:module';
+import net from 'node:net';
+import os from 'node:os';
+import path from 'node:path';
+import perfHooks from 'node:perf_hooks';
+import process from 'node:process';
+import querystring from 'node:querystring';
+import readline from 'node:readline';
+import repl from 'node:repl';
+import stream from 'node:stream';
+import stringDecoder from 'node:string_decoder';
+import timers from 'node:timers';
+import timersPromises from 'node:timers/promises';
+import tls from 'node:tls';
+import tty from 'node:tty';
+import url from 'node:url';
+import util from 'node:util';
+import utilTypes from 'node:util/types';
+import v8 from 'node:v8';
+import vm from 'node:vm';
+import workerThreads from 'node:worker_threads';
+import zlib from 'node:zlib';
+// Static node modules for VM context
+import punycode from 'module-punycode';
+
+/**
+ * A map of the name of the modules (including `node:` prefixed ones)
+ * provided by Node because dynamic requires of them, even on the server
+ * will not be resolved properly
+ */
+export const staticNodeModulesForVM = {
+  assert,
+  async_hooks: asyncHooks,
+  buffer,
+  child_process: childProcess,
+  cluster,
+  console,
+  constants,
+  crypto,
+  dgram,
+  diagnostics_channel: diagnosticsChannel,
+  dns,
+  domain,
+  events,
+  fs,
+  'fs/promises': fsPromises,
+  http,
+  http2,
+  https,
+  inspector,
+  module,
+  net,
+  os,
+  path,
+  perf_hooks: perfHooks,
+  process,
+  punycode,
+  querystring,
+  readline,
+  repl,
+  stream,
+  string_decoder: stringDecoder,
+  timers,
+  'timers/promises': timersPromises,
+  tls,
+  tty,
+  url,
+  util,
+  'util/types': utilTypes,
+  v8,
+  vm,
+  worker_threads: workerThreads,
+  zlib,
+};

package/src/utils/style-text.ts

@@ -0,0 +1,11 @@
+/**
+ * Centralized fallback for Node versions (<20.12.0) without util.styleText.
+ * Returns the original text when styleText is unavailable.
+ */
+import * as nodeUtil from 'node:util';
+
+type StyleTextFunction = (style: string, text: string) => string;
+
+export const styleText: StyleTextFunction = (nodeUtil as any).styleText
+  ? (nodeUtil as any).styleText
+  : (_: string, text: string) => text;

package/src/utils/types/as.ts

@@ -0,0 +1,26 @@
+export type As<
+  DefaultTag extends React.ElementType,
+  T1 extends React.ElementType,
+  T2 extends React.ElementType = T1,
+  T3 extends React.ElementType = T1,
+  T4 extends React.ElementType = T1,
+  T5 extends React.ElementType = T1,
+> =
+  | (React.ComponentPropsWithRef<DefaultTag> & {
+      as?: DefaultTag;
+    })
+  | (React.ComponentPropsWithRef<T1> & {
+      as: T1;
+    })
+  | (React.ComponentPropsWithRef<T2> & {
+      as: T2;
+    })
+  | (React.ComponentPropsWithRef<T3> & {
+      as: T3;
+    })
+  | (React.ComponentPropsWithRef<T4> & {
+      as: T4;
+    })
+  | (React.ComponentPropsWithRef<T5> & {
+      as: T5;
+    });