html-to-gutenberg 4.2.9 → 4.2.10

package/index.ts

@@ -1,68 +1,173 @@
-// Utility functions exported for testing
-export function hasTailwindCdnSource(jsFiles: string[]): boolean {
-  const tailwindCdnRegex = /https:\/\/(cdn\.tailwindcss\.com(\?[^"'\s]*)?|cdn\.jsdelivr\.net\/npm\/@tailwindcss\/browser@4(\.\d+){0,2})/;
-  return jsFiles.some((url: string) => tailwindCdnRegex.test(url));
-}
-
-export function replaceSourceUrlVars(str: string, source: any): string {
-  if (!source) return str;
-  const escapedSource = String(source).replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-  const pattern = new RegExp(`var.url+'${escapedSource}([^']*)'`, 'g');
-  return str.replace(pattern, (match: string, path: string) => `\${vars.url}${path}`);
-}
-
-// ...existing code...
-
-// Export the main block function as default
-// (Moved block implementation from index.js below)
-
-import fetch from 'node-fetch';
-import presetReact from '@babel/preset-react';
-import * as babel from '@babel/core';
-import * as cheerio from 'cheerio';
-import scopeCss from 'css-scoping';
-import extractAssets from 'fetch-page-assets';
-import fs from 'fs';
-import dotenv from 'dotenv';
-import pkg from './package.json';
-import convert from 'node-html-to-jsx';
-import path from 'path';
-
-import {
-  imports,
-  images,
-  characters
-} from './globals.js';
-
-const { version } = pkg;
-
-const block = async (
-  htmlContent: string,
-  options: {
-    name?: string;
-    prefix?: string;
-    category?: string;
-    basePath?: string;
-    shouldSaveFiles?: boolean;
-    generateIconPreview?: boolean;
-    jsFiles?: string[];
-    cssFiles?: string[];
-    source?: string | null;
-  } = {
-      name: 'My block',
-      prefix: 'wp',
-      category: 'common',
-      basePath: process.cwd(),
-      shouldSaveFiles: true,
-      generateIconPreview: false,
-      jsFiles: [],
-      cssFiles: [],
-      source: null,
-    }
+export type GeneratedFiles = Record<string, string>;
+
+export type JobOutputFile = {
+  id: string;
+  name: string;
+  type: string;
+  size: number;
+  path: string;
+  url: string;
+  kind: 'source' | 'asset' | 'bundle';
+};
+
+export type JobBundle = {
+  id: string;
+  name: string;
+  type: string;
+  size: number;
+  path: string;
+  url: string;
+  zipUrl: string;
+};
+
+export type JobManifest = {
+  jobId: string;
+  status: 'completed';
+  output: {
+    files: JobOutputFile[];
+    bundle: JobBundle;
+  };
+};
+
+export type NormalizedBlockOptions = {
+  title: string;
+  name: string;
+  slug: string;
+  namespace: string;
+  prefix: string;
+  baseUrl: string | null;
+  source: string | null;
+  category: string;
+  registerCategoryIfMissing: boolean;
+  outputPath: string;
+  basePath: string;
+  writeFiles: boolean;
+  shouldSaveFiles: boolean;
+  generatePreviewImage: boolean;
+  generateIconPreview: boolean;
+  jsFiles: string[];
+  cssFiles: string[];
+  outputMode: 'job' | 'legacy';
+  uploadToR2: boolean;
+  jobId?: string;
+};
+
+export type BlockOptions = {
+  title?: string;
+  slug?: string;
+  baseUrl?: string | null;
+  namespace?: string;
+  category?: string;
+  registerCategoryIfMissing?: boolean;
+  outputPath?: string;
+  writeFiles?: boolean;
+  generatePreviewImage?: boolean;
+  jsFiles?: string[];
+  cssFiles?: string[];
+  outputMode?: 'job' | 'legacy';
+  uploadToR2?: boolean;
+  jobId?: string;
+  name?: string;
+  prefix?: string;
+  source?: string | null;
+  basePath?: string;
+  shouldSaveFiles?: boolean;
+  generateIconPreview?: boolean;
+};
+
+export declare const createProfiler: (enabled: boolean) => {
+  start(label: string): void;
+  end(label: string): void;
+};
+
+export declare const findSelfClosingJsxEnd: (
+  content: string,
+  startIndex: number
+) => number;
+
+export declare const replaceSelfClosingJsxComponent: (
+  content: string,
+  componentName: string,
+  replacer: (componentSource: string) => string
+) => string;
+
+export declare const getMediaUploadSaveTemplate: (
+  image?: {
+    randomUrlVariable: string;
+    randomAltVariable: string;
+    imgClass?: string;
+  }
+) => string;
+
+export declare const replaceMediaUploadComponents: (
+  content: string,
+  imageRegistry: Array<{
+    randomUrlVariable: string;
+    randomAltVariable: string;
+    imgClass?: string;
+  }>
+) => string;
+
+export declare const replaceRichTextComponents: (content: string) => string;
+
+export declare const buildAssetExtractionOptions: (
+  basePath: string,
+  options?: {
+    uploadToR2?: boolean;
+    returnDetails?: boolean;
+    jobId?: string;
+    r2Prefix?: string;
+  }
 ) => {
-  // ...existing block implementation from index.js...
+  basePath: string;
+  saveFile: false;
+  verbose: false;
+  maxRetryAttempts: 1;
+  retryDelay: 0;
+  concurrency: 8;
+  uploadToR2: boolean;
+  returnDetails: boolean;
+  jobId?: string;
+  r2Prefix?: string;
 };
 
-export default block;
+export declare const slugifyBlockValue: (value?: string) => string;
+export declare const formatCategoryLabel: (category?: string) => string;
+export declare const normalizeBlockOptions: (
+  options?: BlockOptions
+) => NormalizedBlockOptions;
+
+export declare const replaceRelativeUrls: (
+  html: string,
+  replacer: (url: string) => string
+) => string;
+
+export declare const replaceRelativeUrlsInCss: (
+  css: string,
+  replacer: (url: string) => string
+) => string;
 
+export declare const replaceRelativeUrlsInHtml: (
+  html: string,
+  baseUrl: string
+) => string;
 
+export declare const replaceRelativeUrlsInCssWithBase: (
+  css: string,
+  cssFileUrl: string
+) => string;
+
+export declare const unwrapBody: (code: string) => string;
+
+export declare const transformBlockFile: (
+  blockCode: string
+) => { code?: string } | string;
+
+export declare const getSnapApiUrl: () => string;
+
+declare const block: (
+  htmlContent: string,
+  options?: BlockOptions
+) => Promise<GeneratedFiles | JobManifest>;
+
+export default block;

package/package.json

@@ -1,5 +1,6 @@
 {
   "dependencies": {
+    "@aws-sdk/client-s3": "^3.888.0",
     "@babel/core": "^7.29.0",
     "@babel/preset-react": "^7.28.5",
     "@svgr/core": "^8.1.0",
@@ -8,6 +9,8 @@
     "dotenv": "^17.3.1",
     "fetch-page-assets": "^1.2.7",
     "fs": "^0.0.1-security",
+    "jszip": "^3.10.1",
+    "mime-types": "^3.0.1",
     "node-fetch": "^3.3.2",
     "node-html-to-jsx": "^1.4.4",
     "path": "^0.12.7"
@@ -25,6 +28,7 @@
     "@typescript-eslint/eslint-plugin": "^8.56.1",
     "@typescript-eslint/parser": "^8.56.1",
     "chai": "^6.2.2",
+    "c8": "^11.0.0",
     "coveralls": "^3.1.1",
     "eslint": "^10.0.2",
     "mocha": "^11.3.0",
@@ -34,20 +38,20 @@
     "ts-node": "^10.9.2",
     "typescript-eslint": "^8.56.1"
   },
-  "types": "index.ts",
+  "types": "index.d.ts",
   "name": "html-to-gutenberg",
-  "version": "4.2.9",
+  "version": "4.2.10",
   "description": "Transform any valid HTML string into fully editable WP Gutenberg blocks in seconds rather than hours.",
   "main": "index.js",
   "directories": {
     "test": "test"
   },
   "scripts": {
-    "postinstall": "mv ./node_modules/fetch-page-assets/index.ts ./node_modules/fetch-page-assets/index.ts.bak || true",
-    "test": "mocha -r ts-node/register index.test.ts",
+    "postinstall": "mv ./node_modules/fetch-page-assets/index.ts ./node_modules/fetch-page-assets/index.ts.bak || true && node ./scripts/patch-fetch-page-assets.mjs",
+    "test": "mocha -r ts-node/register/transpile-only index.test.ts fetch-page-assets.test.ts",
     "build": "tsc",
-    "coverage": "nyc mocha -r ts-node/register index.test.ts",
-    "coveralls": "nyc mocha -r ts-node/register index.test.ts && nyc report --reporter=lcov && cat coverage/lcov.info | coveralls"
+    "coverage": "c8 mocha -r ts-node/register/transpile-only index.test.ts fetch-page-assets.test.ts",
+    "coveralls": "c8 mocha -r ts-node/register/transpile-only index.test.ts fetch-page-assets.test.ts && c8 report --reporter=lcov && cat coverage/lcov.info | coveralls"
   },
   "repository": {
     "type": "git",
@@ -72,28 +76,25 @@
     "url": "https://github.com/DiogoAngelim/html-to-gutenberg/issues"
   },
   "homepage": "https://www.html-to-gutenberg.io",
-  "nyc": {
+  "c8": {
     "reporter": [
-      "lcov",
-      "text"
-    ],
-    "exclude": [
-      "coverage"
+      "text",
+      "lcov"
     ],
     "include": [
-      "src/*.ts",
-      "src/**/*.ts"
+      "index.js",
+      "utils.ts",
+      "globals.js",
+      "vendor/fetch-page-assets/index.js"
     ],
-    "extension": [
-      ".ts",
-      ".js"
+    "exclude": [
+      "coverage",
+      "dist",
+      "node_modules",
+      "scripts",
+      "**/*.test.ts"
     ],
-    "all": true,
-    "sourceMap": true,
-    "instrument": true,
-    "require": [
-      "ts-node/register"
-    ]
+    "all": true
   },
   "jest": {
     "preset": "ts-jest/presets/js-with-ts",
@@ -127,4 +128,4 @@
       "<rootDir>/dist/*.test.js"
     ]
   }
-}
+}

package/r2.js

@@ -0,0 +1,163 @@
+import crypto from 'crypto';
+import dotenv from 'dotenv';
+import { S3Client, PutObjectCommand } from '@aws-sdk/client-s3';
+import JSZip from 'jszip';
+import mime from 'mime-types';
+import path from 'path';
+
+dotenv.config({ quiet: true });
+
+let r2Client;
+
+const trimSlashes = (value = '') => value.replace(/^\/+|\/+$/g, '');
+
+export const createJobId = () => {
+  return `conv_${crypto.randomUUID().replace(/-/g, '').slice(0, 12)}`;
+};
+
+export const inferContentType = (fileName, fallback = 'application/octet-stream') => {
+  return mime.lookup(fileName) || fallback;
+};
+
+export const getR2Config = () => {
+  const accountId = process.env.CLOUDFLARE_R2_ACCOUNT_ID;
+  const bucket = process.env.CLOUDFLARE_R2_BUCKET;
+  const accessKeyId = process.env.CLOUDFLARE_R2_ACCESS_KEY_ID;
+  const secretAccessKey = process.env.CLOUDFLARE_R2_SECRET_ACCESS_KEY;
+  const publicBaseUrl = process.env.CLOUDFLARE_R2_PUBLIC_BASE_URL || '';
+  const endpoint =
+    process.env.CLOUDFLARE_R2_ENDPOINT || (accountId ? `https://${accountId}.r2.cloudflarestorage.com` : '');
+
+  return {
+    accountId,
+    bucket,
+    accessKeyId,
+    secretAccessKey,
+    publicBaseUrl: publicBaseUrl.replace(/\/+$/, ''),
+    endpoint,
+    mockMode: process.env.HTG_R2_MOCK === '1',
+  };
+};
+
+export const getR2Client = () => {
+  if (r2Client) {
+    return r2Client;
+  }
+
+  const config = getR2Config();
+
+  if (!config.bucket) {
+    throw new Error('CLOUDFLARE_R2_BUCKET is required.');
+  }
+
+  if (!config.endpoint) {
+    throw new Error('CLOUDFLARE_R2_ACCOUNT_ID or CLOUDFLARE_R2_ENDPOINT is required.');
+  }
+
+  if (!config.accessKeyId || !config.secretAccessKey) {
+    throw new Error('CLOUDFLARE_R2_ACCESS_KEY_ID and CLOUDFLARE_R2_SECRET_ACCESS_KEY are required.');
+  }
+
+  r2Client = new S3Client({
+    region: 'auto',
+    endpoint: config.endpoint,
+    credentials: {
+      accessKeyId: config.accessKeyId,
+      secretAccessKey: config.secretAccessKey,
+    },
+  });
+
+  return r2Client;
+};
+
+export const buildR2Url = (storageKey) => {
+  const { publicBaseUrl, mockMode } = getR2Config();
+  if (!publicBaseUrl) {
+    if (mockMode) {
+      return `https://storage.example.com/${trimSlashes(storageKey)}`;
+    }
+    throw new Error('CLOUDFLARE_R2_PUBLIC_BASE_URL is required for real R2 uploads.');
+  }
+  return `${publicBaseUrl}/${trimSlashes(storageKey)}`;
+};
+
+export const uploadBufferToR2 = async ({
+  storageKey,
+  body,
+  contentType,
+  cacheControl,
+  metadata,
+}) => {
+  const config = getR2Config();
+  const normalizedKey = trimSlashes(storageKey);
+  const bufferBody = Buffer.isBuffer(body) ? body : Buffer.from(body);
+  const resolvedContentType = contentType || inferContentType(path.basename(normalizedKey));
+
+  if (config.mockMode) {
+    return {
+      storageKey: normalizedKey,
+      path: `/${normalizedKey}`,
+      url: buildR2Url(normalizedKey),
+      size: bufferBody.byteLength,
+      type: resolvedContentType,
+    };
+  }
+
+  const client = getR2Client();
+
+  await client.send(
+    new PutObjectCommand({
+      Bucket: config.bucket,
+      Key: normalizedKey,
+      Body: bufferBody,
+      ContentType: resolvedContentType,
+      CacheControl: cacheControl,
+      Metadata: metadata,
+    })
+  );
+
+  return {
+    storageKey: normalizedKey,
+    path: `/${normalizedKey}`,
+    url: buildR2Url(normalizedKey),
+    size: bufferBody.byteLength,
+    type: resolvedContentType,
+  };
+};
+
+export const createFileRecord = ({
+  id,
+  name,
+  kind,
+  storageKey,
+  size,
+  type,
+  url,
+}) => {
+  return {
+    id,
+    name,
+    type,
+    size,
+    path: `/${trimSlashes(storageKey)}`,
+    url,
+    kind,
+  };
+};
+
+export const zipEntriesToBuffer = async (entries) => {
+  const zip = new JSZip();
+
+  for (const entry of entries) {
+    if (!entry || entry.body == null) {
+      continue;
+    }
+
+    zip.file(trimSlashes(entry.zipPath || entry.name), entry.body);
+  }
+
+  return zip.generateAsync({
+    type: 'nodebuffer',
+    compression: 'DEFLATE',
+  });
+};