@ainsleydev/payload-helper 0.0.3 → 0.0.5

package/dist/util/lexical.js

@@ -0,0 +1,53 @@
+import { createHeadlessEditor } from '@lexical/headless';
+import { $generateNodesFromDOM, $generateHtmlFromNodes } from '@lexical/html';
+import { $getRoot, $getSelection } from 'lexical';
+import { JSDOM } from 'jsdom';
+const editor = createHeadlessEditor({
+    nodes: [],
+    onError: ()=>{}
+});
+/**
+ * Converts an HTML string to a Lexical editor state.
+ *
+ * @param {string} html - The HTML string to convert.
+ * @returns {SerializedEditorState} The serialized editor state.
+ */ export const htmlToLexical = (html)=>{
+    editor.update(()=>{
+        // In a headless environment you can use a package such as JSDom to parse the HTML string.
+        const dom = new JSDOM(html);
+        // Once you have the DOM instance it's easy to generate LexicalNodes.
+        const nodes = $generateNodesFromDOM(editor, dom.window.document);
+        // Select the root
+        $getRoot().select();
+        // Insert them at a selection.
+        const selection = $getSelection();
+        if (selection) selection.insertNodes(nodes);
+    }, {
+        discrete: true
+    });
+    return editor.getEditorState().toJSON();
+};
+/**
+ * Converts a Lexical editor state to an HTML string.
+ *
+ * @param {SerializedEditorState} json - The serialized editor state to convert.
+ * @returns {string} The HTML string.
+ */ export const lexicalToHtml = (json)=>{
+    // Initialize a JSDOM instance
+    const dom = new JSDOM('');
+    // @ts-ignore
+    globalThis.window = dom.window;
+    globalThis.document = dom.window.document;
+    editor.update(()=>{
+        const editorState = editor.parseEditorState(json);
+        editor.setEditorState(editorState);
+    });
+    // Convert the editor state to HTML
+    let html = '';
+    editor.getEditorState().read(()=>{
+        html = $generateHtmlFromNodes(editor);
+    });
+    return html;
+};
+
+//# sourceMappingURL=lexical.js.map

package/dist/util/lexical.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/util/lexical.ts"],"sourcesContent":["import { createHeadlessEditor } from '@lexical/headless';\nimport { $generateNodesFromDOM, $generateHtmlFromNodes } from '@lexical/html';\nimport { $getRoot, $getSelection } from 'lexical';\nimport { JSDOM } from 'jsdom';\nimport type { SerializedEditorState } from 'lexical';\n\nconst editor = createHeadlessEditor({\n\tnodes: [],\n\tonError: () => {},\n});\n\n/**\n * Converts an HTML string to a Lexical editor state.\n *\n * @param {string} html - The HTML string to convert.\n * @returns {SerializedEditorState} The serialized editor state.\n */\nexport const htmlToLexical = (html: string): SerializedEditorState => {\n\teditor.update(\n\t\t() => {\n\t\t\t// In a headless environment you can use a package such as JSDom to parse the HTML string.\n\t\t\tconst dom = new JSDOM(html);\n\n\t\t\t// Once you have the DOM instance it's easy to generate LexicalNodes.\n\t\t\tconst nodes = $generateNodesFromDOM(editor, dom.window.document);\n\n\t\t\t// Select the root\n\t\t\t$getRoot().select();\n\n\t\t\t// Insert them at a selection.\n\t\t\tconst selection = $getSelection();\n\n\t\t\tif (selection) selection.insertNodes(nodes);\n\t\t},\n\t\t{ discrete: true },\n\t);\n\n\treturn editor.getEditorState().toJSON();\n};\n\n/**\n * Converts a Lexical editor state to an HTML string.\n *\n * @param {SerializedEditorState} json - The serialized editor state to convert.\n * @returns {string} The HTML string.\n */\nexport const lexicalToHtml = (json: SerializedEditorState): string => {\n\t// Initialize a JSDOM instance\n\tconst dom = new JSDOM('');\n\n\t// @ts-ignore\n\tglobalThis.window = dom.window;\n\tglobalThis.document = dom.window.document;\n\n\teditor.update(() => {\n\t\tconst editorState = editor.parseEditorState(json);\n\t\teditor.setEditorState(editorState);\n\t});\n\n\t// Convert the editor state to HTML\n\tlet html = '';\n\teditor.getEditorState().read(() => {\n\t\thtml = $generateHtmlFromNodes(editor);\n\t});\n\n\treturn html;\n};\n"],"names":["createHeadlessEditor","$generateNodesFromDOM","$generateHtmlFromNodes","$getRoot","$getSelection","JSDOM","editor","nodes","onError","htmlToLexical","html","update","dom","window","document","select","selection","insertNodes","discrete","getEditorState","toJSON","lexicalToHtml","json","globalThis","editorState","parseEditorState","setEditorState","read"],"mappings":"AAAA,SAASA,oBAAoB,QAAQ,oBAAoB;AACzD,SAASC,qBAAqB,EAAEC,sBAAsB,QAAQ,gBAAgB;AAC9E,SAASC,QAAQ,EAAEC,aAAa,QAAQ,UAAU;AAClD,SAASC,KAAK,QAAQ,QAAQ;AAG9B,MAAMC,SAASN,qBAAqB;IACnCO,OAAO,EAAE;IACTC,SAAS,KAAO;AACjB;AAEA;;;;;CAKC,GACD,OAAO,MAAMC,gBAAgB,CAACC;IAC7BJ,OAAOK,MAAM,CACZ;QACC,0FAA0F;QAC1F,MAAMC,MAAM,IAAIP,MAAMK;QAEtB,qEAAqE;QACrE,MAAMH,QAAQN,sBAAsBK,QAAQM,IAAIC,MAAM,CAACC,QAAQ;QAE/D,kBAAkB;QAClBX,WAAWY,MAAM;QAEjB,8BAA8B;QAC9B,MAAMC,YAAYZ;QAElB,IAAIY,WAAWA,UAAUC,WAAW,CAACV;IACtC,GACA;QAAEW,UAAU;IAAK;IAGlB,OAAOZ,OAAOa,cAAc,GAAGC,MAAM;AACtC,EAAE;AAEF;;;;;CAKC,GACD,OAAO,MAAMC,gBAAgB,CAACC;IAC7B,8BAA8B;IAC9B,MAAMV,MAAM,IAAIP,MAAM;IAEtB,aAAa;IACbkB,WAAWV,MAAM,GAAGD,IAAIC,MAAM;IAC9BU,WAAWT,QAAQ,GAAGF,IAAIC,MAAM,CAACC,QAAQ;IAEzCR,OAAOK,MAAM,CAAC;QACb,MAAMa,cAAclB,OAAOmB,gBAAgB,CAACH;QAC5ChB,OAAOoB,cAAc,CAACF;IACvB;IAEA,mCAAmC;IACnC,IAAId,OAAO;IACXJ,OAAOa,cAAc,GAAGQ,IAAI,CAAC;QAC5BjB,OAAOR,uBAAuBI;IAC/B;IAEA,OAAOI;AACR,EAAE"}

package/dist/util/lexical.test.js

@@ -0,0 +1,21 @@
+import { htmlToLexical } from './lexical';
+describe('htmlToLexical', ()=>{
+    it('should convert an HTML string to a Lexical editor state', ()=>{
+        const html = '<p>Hello, world!</p>';
+        const editorState = htmlToLexical(html);
+        expect(editorState).toEqual({
+            nodes: [
+                {
+                    type: 'paragraph',
+                    children: [
+                        {
+                            text: 'Hello, world!'
+                        }
+                    ]
+                }
+            ]
+        });
+    });
+});
+
+//# sourceMappingURL=lexical.test.js.map

package/dist/util/lexical.test.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/util/lexical.test.ts"],"sourcesContent":["import { htmlToLexical } from './lexical';\n\ndescribe('htmlToLexical', () => {\n\tit('should convert an HTML string to a Lexical editor state', () => {\n\t\tconst html = '<p>Hello, world!</p>';\n\t\tconst editorState = htmlToLexical(html);\n\n\t\texpect(editorState).toEqual({\n\t\t\tnodes: [\n\t\t\t\t{\n\t\t\t\t\ttype: 'paragraph',\n\t\t\t\t\tchildren: [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\ttext: 'Hello, world!',\n\t\t\t\t\t\t},\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t],\n\t\t});\n\t});\n});\n"],"names":["htmlToLexical","describe","it","html","editorState","expect","toEqual","nodes","type","children","text"],"mappings":"AAAA,SAASA,aAAa,QAAQ,YAAY;AAE1CC,SAAS,iBAAiB;IACzBC,GAAG,2DAA2D;QAC7D,MAAMC,OAAO;QACb,MAAMC,cAAcJ,cAAcG;QAElCE,OAAOD,aAAaE,OAAO,CAAC;YAC3BC,OAAO;gBACN;oBACCC,MAAM;oBACNC,UAAU;wBACT;4BACCC,MAAM;wBACP;qBACA;gBACF;aACA;QACF;IACD;AACD"}

package/dist/util/validation.js

@@ -0,0 +1,23 @@
+export const validateURL = async (value)=>{
+    if (!value) {
+        return true;
+    }
+    try {
+        new URL(value);
+        return true;
+    } catch (error) {
+        return 'Please enter a valid URL';
+    }
+};
+export const validatePostcode = async (value)=>{
+    if (!value) {
+        return true;
+    }
+    const postcodeRegex = /^[A-Z]{1,2}\d[A-Z\d]? ?\d[A-Z]{2}$/i;
+    if (!postcodeRegex.test(value)) {
+        return 'Invalid postcode format';
+    }
+    return true;
+};
+
+//# sourceMappingURL=validation.js.map

package/dist/util/validation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/util/validation.ts"],"sourcesContent":["export const validateURL = async (value: string) => {\n\tif (!value) {\n\t\treturn true;\n\t}\n\ttry {\n\t\tnew URL(value);\n\t\treturn true;\n\t} catch (error) {\n\t\treturn 'Please enter a valid URL';\n\t}\n};\n\nexport const validatePostcode = async (value: string) => {\n\tif (!value) {\n\t\treturn true;\n\t}\n\tconst postcodeRegex = /^[A-Z]{1,2}\\d[A-Z\\d]? ?\\d[A-Z]{2}$/i;\n\tif (!postcodeRegex.test(value)) {\n\t\treturn 'Invalid postcode format';\n\t}\n\treturn true;\n};\n"],"names":["validateURL","value","URL","error","validatePostcode","postcodeRegex","test"],"mappings":"AAAA,OAAO,MAAMA,cAAc,OAAOC;IACjC,IAAI,CAACA,OAAO;QACX,OAAO;IACR;IACA,IAAI;QACH,IAAIC,IAAID;QACR,OAAO;IACR,EAAE,OAAOE,OAAO;QACf,OAAO;IACR;AACD,EAAE;AAEF,OAAO,MAAMC,mBAAmB,OAAOH;IACtC,IAAI,CAACA,OAAO;QACX,OAAO;IACR;IACA,MAAMI,gBAAgB;IACtB,IAAI,CAACA,cAAcC,IAAI,CAACL,QAAQ;QAC/B,OAAO;IACR;IACA,OAAO;AACR,EAAE"}

package/package.json

@@ -1,13 +1,15 @@
 {
 	"name": "@ainsleydev/payload-helper",
-	"version": "0.0.3",
+	"version": "0.0.5",
 	"description": "Payload CMS utilities, collections and global types for ainsley.dev builds",
 	"license": "MIT",
+	"type": "module",
 	"keywords": [
 		"payload",
-		"payloadcms",
 		"cms",
-		"utilities"
+		"plugin",
+		"typescript",
+		"react"
 	],
 	"repository": {
 		"type": "git",
@@ -19,20 +21,50 @@
 		"email": "hello@ainsley.dev",
 		"url": "https://ainsley.dev"
 	},
+	"main": "./src/index.ts",
+	"types": "./src/index.ts",
 	"scripts": {
+		"build": "pnpm run clean && pnpm build:types && pnpm build:swc",
+		"build:swc": "swc ./src -d ./dist --config-file .swcrc --strip-leading-paths",
+		"build:types": "tsc --emitDeclarationOnly --outDir dist",
+		"format": "biome format --write .",
+		"lint": "biome lint --write .",
 		"release": "npm publish --access public",
-		"test": "echo \"Error: no test specified\" && exit 1"
+		"clean": "rimraf {dist,*.tsbuildinfo}",
+		"test": "jest"
 	},
+	"bin": {
+		"payload-helper": "bin.js"
+	},
+	"files": [
+		"dist",
+		"bin.js"
+	],
 	"dependencies": {
+		"@lexical/headless": "^0.16.1",
+		"@lexical/html": "^0.16.1",
 		"@nouance/payload-better-fields-plugin": "^1.4.1",
-		"@payloadcms/richtext-slate": "beta",
-		"@payloadcms/richtext-lexical": "beta",
-		"json-schema": "^0.4.0",
-		"payload": "beta",
-		"pluralize": "^8.0.0"
+		"@payloadcms/richtext-lexical": "3.0.0-beta.67",
+		"@types/json-schema": "^7.0.15",
+		"chalk": "^5.3.0",
+		"commander": "^12.1.0",
+		"jsdom": "^24.1.1",
+		"lexical": "^0.16.1",
+		"payload": "3.0.0-beta.67"
 	},
 	"devDependencies": {
-		"@ainsleydev/eslint-config": "workspace:*"
+		"@ainsleydev/eslint-config": "workspace:*",
+		"@jest/globals": "^29.7.0",
+		"@swc/cli": "^0.4.0",
+		"@swc/core": "^1.7.2",
+		"@types/jest": "^29.5.12",
+		"@types/jsdom": "^21.1.7",
+		"jest": "^29.7.0",
+		"json-schema": "^0.4.0",
+		"rimraf": "3.0.2",
+		"ts-jest": "^29.2.3",
+		"ts-node": "^10.9.2",
+		"typescript": "^5.5.4"
 	},
 	"engines": {
 		"node": ">=18",

package/eslint.config.mjs

@@ -1,4 +0,0 @@
-import config from '@ainsleydev/eslint-config/eslint.config.mjs';
-
-/** @type { import("eslint").Linter.FlatConfig[] } */
-export default [...config];

package/src/collections/Media.ts

@@ -1,154 +0,0 @@
-import type { CollectionConfig, Field } from 'payload';
-import { lexicalEditor } from '@payloadcms/richtext-lexical';
-
-/**
- * Media Collection Configuration
- * Additional fields will be appended to the media collection.
- *
- * @param filePath
- * @param additionalFields
- * @constructor
- */
-export const Media = (additionalFields?: Field[]): CollectionConfig => {
-	return {
-		slug: 'media',
-		access: {
-			read: () => true,
-		},
-		fields: [
-			{
-				name: 'alt',
-				type: 'text',
-				required: true,
-			},
-			{
-				name: 'caption',
-				type: 'richText',
-				required: false,
-				editor: lexicalEditor({
-					features: ({ defaultFeatures }) => {
-						return defaultFeatures.filter((feature) => {
-							return feature.key === 'paragraph' || feature.key === 'link';
-						});
-					},
-				}),
-			},
-			...(additionalFields ? additionalFields : []),
-		],
-		upload: {
-			staticDir: 'media',
-			imageSizes: [
-				// Original Size (for WebP & Avif)
-				{
-					name: 'webp',
-					width: undefined,
-					height: undefined,
-					formatOptions: {
-						format: 'webp',
-						options: {
-							quality: 80,
-						},
-					},
-				},
-				{
-					name: 'avif',
-					width: undefined,
-					height: undefined,
-					formatOptions: {
-						format: 'avif',
-						options: {
-							quality: 80,
-						},
-					},
-				},
-				// Thumbnail Sizes
-				{
-					name: 'thumbnail',
-					width: 400,
-					height: 300,
-					position: 'centre',
-				},
-				{
-					name: 'thumbnail_webp',
-					width: 400,
-					height: 300,
-					position: 'centre',
-					formatOptions: {
-						format: 'webp',
-						options: {
-							quality: 80,
-						},
-					},
-				},
-				{
-					name: 'thumbnail_avif',
-					width: 400,
-					height: 300,
-					position: 'centre',
-					formatOptions: {
-						format: 'avif',
-						options: {
-							quality: 80,
-						},
-					},
-				},
-				// Mobile Sizes
-				{
-					name: 'mobile',
-					width: 768,
-					height: undefined,
-				},
-				{
-					name: 'mobile_webp',
-					width: 768,
-					height: undefined,
-					formatOptions: {
-						format: 'webp',
-						options: {
-							quality: 80,
-						},
-					},
-				},
-				{
-					name: 'mobile_avif',
-					width: 768,
-					height: undefined,
-					formatOptions: {
-						format: 'avif',
-						options: {
-							quality: 80,
-						},
-					},
-				},
-				// Tablet Sizes
-				{
-					name: 'tablet',
-					width: 1024,
-					height: undefined,
-				},
-				{
-					name: 'tablet_webp',
-					width: 1024,
-					height: undefined,
-					formatOptions: {
-						format: 'webp',
-						options: {
-							quality: 80,
-						},
-					},
-				},
-				{
-					name: 'tablet_avif',
-					width: 1024,
-					height: undefined,
-					formatOptions: {
-						format: 'avif',
-						options: {
-							quality: 80,
-						},
-					},
-				},
-			],
-		},
-	};
-};

package/src/collections/Redirects.ts

@@ -1,56 +0,0 @@
-import type { CollectionConfig } from 'payload';
-
-/**
- * Redirects Collection Configuration
- * In favour of the native plugin for more granular control.
- *
- * TODO: Potential to add regex redirects here, i.e product-category/(.*)$ => /category/$1
- *
- * @constructor
- */
-export const Redirects = (overrides?: Partial<CollectionConfig>): CollectionConfig => {
-	return {
-		slug: 'redirects',
-		admin: {
-			useAsTitle: 'from',
-		},
-		fields: [
-			{
-				name: 'from',
-				type: 'text',
-				label: 'From URL',
-				required: true,
-				index: true,
-				admin: {
-					description: 'The URL you want to redirect from, ensure it starts with a /',
-				},
-			},
-			{
-				name: 'to',
-				type: 'text',
-				label: 'Destination URL',
-				required: true,
-				admin: {
-					description:
-						'The URL you want to redirect to, can be a relative or absolute URL',
-				},
-			},
-			{
-				name: 'code',
-				type: 'select',
-				label: 'Redirect Code',
-				required: true,
-				defaultValue: '301',
-				options: [
-					{ label: '301 - Permanent', value: '301' },
-					{ label: '302 - Temporary', value: '302' },
-					{ label: '307 - Temporary Redirect', value: '307' },
-					{ label: '308 - Permanent Redirect', value: '308' },
-					{ label: '410 - Content Deleted', value: '410' },
-					{ label: '451 - Unavailable For Legal Reasons', value: '451' },
-				],
-			},
-		],
-		...(overrides ? overrides : {}),
-	};
-};

package/src/common/SEO.ts

@@ -1,45 +0,0 @@
-import { Field } from 'payload';
-import { validateURL } from '../util/validation';
-
-/**
- * SEO Fields define the additional fields that appear
- * within the Payload SEO plugin.
- */
-export const SEOFields: Field[] = [
-	{
-		type: 'row',
-		fields: [
-			{
-				name: 'private',
-				type: 'checkbox',
-				label: 'Private',
-				defaultValue: false,
-				admin: {
-					width: '50%',
-					description:
-						'Enable private mode to prevent robots from crawling the page or website. When enabled it will output <meta name="robots" content="noindex" /> on the frontend.',
-				},
-			},
-			{
-				name: 'canonicalURL',
-				type: 'text',
-				label: 'Canonical',
-				admin: {
-					width: '50%',
-					description:
-						'A canonical URL is the version of a webpage chosen by search engines like Google as the main version when there are duplicates.',
-				},
-				validate: validateURL,
-			},
-		],
-	},
-	{
-		name: 'structuredData',
-		type: 'json',
-		label: 'Structured Data',
-		admin: {
-			description:
-				'Structured data is a standardized format for providing information about a page and classifying the page content. The site Schema.org contains a standardised list of markup that the major search engines — Google, Bing, Yahoo and Yandex — have collectively agreed to support.',
-		},
-	},
-];

package/src/endpoints/slug.ts

@@ -1,32 +0,0 @@
-import { PayloadHandler, PayloadRequest } from 'payload';
-
-/**
- * Find a document in the given collection by its slug.
- *
- * @param collection
- */
-export const findBySlug = (collection: string): PayloadHandler => {
-	return async (req: PayloadRequest): Promise<Response> => {
-		try {
-			const data = await req.payload.find({
-				collection,
-				where: {
-					slug: {
-						equals: req.routeParams.slug,
-					},
-				},
-				limit: 1,
-			});
-			if (data.docs.length === 0) {
-				return new Response(JSON.stringify({ error: 'not found' }), { status: 404 });
-			} else {
-				return new Response(JSON.stringify(data.docs[0]), { status: 200 });
-			}
-		} catch (error) {
-			console.error('Error occurred while fetching document:', error);
-			return new Response(JSON.stringify({ error: 'Internal server error' }), {
-				status: 500,
-			});
-		}
-	};
-};