@wp-typia/create 0.1.0

package/templates/advanced/src/types.ts.mustache

@@ -0,0 +1,46 @@
+import type { TextAlignment } from "@wp-typia/block-types/block-editor/alignment";
+import { tags } from "typia";
+
+/**
+ * {{title}} block attributes with Typia validation
+ */
+export interface {{titleCase}}Attributes {
+	/**
+	 * Unique identifier
+	 */
+	id?: string & tags.Format<"uuid">;
+	
+	/**
+	 * Block version for migrations
+	 */
+	version?: number & tags.Type<"uint32"> & tags.Default<1>;
+	
+	/**
+	 * Custom CSS class
+	 */
+	className?: string & tags.MaxLength<100>;
+	
+	/**
+	 * Main content
+	 */
+	content: string & tags.MinLength<0> & tags.MaxLength<1000> & tags.Default<"">;
+	
+	/**
+	 * Text alignment
+	 */
+	alignment?: TextAlignment & tags.Default<"left">;
+	
+	/**
+	 * Is the block visible
+	 */
+	isVisible?: boolean & tags.Default<true>;
+}
+
+/**
+ * {{title}} interactivity state
+ */
+export interface {{titleCase}}State {
+	isActive: boolean;
+	isLoading: boolean;
+	error?: string;
+}

package/templates/advanced/src/utils/classnames.ts.mustache

@@ -0,0 +1,51 @@
+/**
+ * Conditional classnames utility
+ */
+export function classNames(...args: (string | Record<string, boolean> | undefined | null | false)[]): string {
+	const classes: string[] = [];
+
+	for (const arg of args) {
+		if (!arg) continue;
+
+		if (typeof arg === 'string') {
+			classes.push(arg);
+		} else if (typeof arg === 'object') {
+			for (const [key, value] of Object.entries(arg)) {
+				if (value) {
+					classes.push(key);
+				}
+			}
+		}
+	}
+
+	return classes.join(' ');
+}
+
+/**
+ * Generate block class with BEM methodology
+ */
+export function blockClass(
+	blockName: string,
+	element?: string,
+	modifier?: string | Record<string, boolean>
+): string {
+	let className = blockName;
+	
+	if (element) {
+		className += `__${element}`;
+	}
+	
+	if (modifier) {
+		if (typeof modifier === 'string') {
+			className += `--${modifier}`;
+		} else {
+			for (const [mod, enabled] of Object.entries(modifier)) {
+				if (enabled) {
+					className += `--${mod}`;
+				}
+			}
+		}
+	}
+	
+	return className;
+}

package/templates/advanced/src/utils/debounce.ts.mustache

@@ -0,0 +1,37 @@
+/**
+ * Debounce function
+ */
+export function debounce<T extends (...args: any[]) => void>(
+	func: T,
+	wait: number
+): (...args: Parameters<T>) => void {
+	let timeout: NodeJS.Timeout;
+
+	return function executedFunction(...args: Parameters<T>) {
+		const later = () => {
+			clearTimeout(timeout);
+			func(...args);
+		};
+
+		clearTimeout(timeout);
+		timeout = setTimeout(later, wait);
+	};
+}
+
+/**
+ * Throttle function
+ */
+export function throttle<T extends (...args: any[]) => void>(
+	func: T,
+	limit: number
+): (...args: Parameters<T>) => void {
+	let inThrottle: boolean;
+
+	return function executedFunction(...args: Parameters<T>) {
+		if (!inThrottle) {
+			func.apply(this, args);
+			inThrottle = true;
+			setTimeout(() => inThrottle = false, limit);
+		}
+	};
+}

package/templates/advanced/src/utils/index.ts.mustache

@@ -0,0 +1,7 @@
+/**
+ * {{title}} utilities
+ */
+
+export * from './uuid';
+export * from './classnames';
+export * from './debounce';

package/templates/advanced/src/utils/uuid.ts.mustache

@@ -0,0 +1,17 @@
+/**
+ * Generate UUID v4
+ */
+export function generateUUID(): string {
+	return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
+		const r = Math.random() * 16 | 0;
+		const v = c === 'x' ? r : (r & 0x3 | 0x8);
+		return v.toString(16);
+	});
+}
+
+/**
+ * Generate short ID (8 characters)
+ */
+export function generateShortId(): string {
+	return Math.random().toString(36).substring(2, 10);
+}

package/templates/advanced/src/validators.ts.mustache

@@ -0,0 +1,39 @@
+import typia from "typia";
+import { {{titleCase}}Attributes } from "./types";
+
+/**
+ * Typia validators for the block attributes
+ */
+export const validators = {
+	validate: typia.createValidate<{{titleCase}}Attributes>(),
+	assert: typia.createAssert<{{titleCase}}Attributes>(),
+	is: typia.createIs<{{titleCase}}Attributes>(),
+	random: typia.createRandom<{{titleCase}}Attributes>(),
+	clone: typia.misc.createClone<{{titleCase}}Attributes>(),
+	prune: typia.misc.createPrune<{{titleCase}}Attributes>(),
+};
+
+/**
+ * Create safe attribute updater with validation
+ */
+export function createAttributeUpdater(
+	attributes: {{titleCase}}Attributes,
+	setAttributes: (attrs: Partial<{{titleCase}}Attributes>) => void,
+	validator = validators.validate
+) {
+	return <K extends keyof {{titleCase}}Attributes>(
+		key: K,
+		value: {{titleCase}}Attributes[K]
+	) => {
+		const newAttrs = { ...attributes, [key]: value };
+		
+		const validation = validator(newAttrs);
+		if (validation.success) {
+			setAttributes({ [key]: value } as Partial<{{titleCase}}Attributes>);
+			return true;
+		} else {
+			console.error(`Validation failed for ${String(key)}:`, validation.errors);
+			return false;
+		}
+	};
+}

package/templates/advanced/src/view.ts.mustache

@@ -0,0 +1,59 @@
+import { store, getContext } from '@wordpress/interactivity';
+import { {{titleCase}}State } from './types';
+
+const { state, actions, callbacks } = store('{{namespace}}/{{slug}}', {
+	state: {
+		isActive: false,
+		isVisible: true,
+		isLoading: false,
+	} as {{titleCase}}State,
+	
+	actions: {
+		toggle() {
+			state.isActive = !state.isActive;
+			console.log('{{titleCase}} toggled:', state.isActive);
+		},
+		
+		hide() {
+			state.isVisible = false;
+		},
+		
+		show() {
+			state.isVisible = true;
+		},
+		
+		async loadContent() {
+			state.isLoading = true;
+			
+			try {
+				// Simulate async operation
+				await new Promise(resolve => setTimeout(resolve, 1000));
+				
+				// Get context data
+				const context = getContext<{
+					content: string;
+					alignment: string;
+				}>();
+				
+				console.log('{{titleCase}} content loaded:', context);
+				
+			} catch (error) {
+				state.error = error instanceof Error ? error.message : 'Unknown error';
+				console.error('{{titleCase}} loading failed:', error);
+			} finally {
+				state.isLoading = false;
+			}
+		}
+	},
+	
+	callbacks: {
+		init() {
+			console.log('{{titleCase}} initialized with Typia validation and Interactivity API');
+		},
+		
+		mounted() {
+			const context = getContext();
+			console.log('{{titleCase}} mounted with context:', context);
+		}
+	},
+});

package/templates/advanced/tsconfig.json.mustache

@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "jsx": "react-jsx",
+    "strict": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "baseUrl": "."
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "build"]
+}

package/templates/advanced/webpack.config.js.mustache

@@ -0,0 +1,95 @@
+const fs = require("fs");
+const path = require("path");
+const defaultConfig = require("@wordpress/scripts/config/webpack.config");
+
+const METADATA_FILENAMES = new Set([
+	"block.json",
+	"render.php",
+	"typia.manifest.json",
+	"typia-validator.php",
+	"typia-migration-registry.php",
+]);
+
+class MetadataAssetPlugin {
+	apply(compiler) {
+		compiler.hooks.thisCompilation.tap("MetadataAssetPlugin", (compilation) => {
+			compilation.hooks.processAssets.tap(
+				{
+					name: "MetadataAssetPlugin",
+					stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONS,
+				},
+				() => {
+					for (const entry of getMetadataEntries()) {
+						if (compilation.getAsset(entry.outputPath)) {
+							continue;
+						}
+
+						compilation.emitAsset(
+							entry.outputPath,
+							new compiler.webpack.sources.RawSource(fs.readFileSync(entry.inputPath)),
+						);
+					}
+				},
+			);
+		});
+	}
+}
+
+function getMetadataEntries() {
+	const entries = [];
+
+	for (const filename of METADATA_FILENAMES) {
+		const rootFilePath = path.resolve(process.cwd(), filename);
+		if (fs.existsSync(rootFilePath)) {
+			entries.push({
+				inputPath: rootFilePath,
+				outputPath: filename,
+			});
+		}
+	}
+
+	const srcDir = path.resolve(process.cwd(), "src");
+	if (!fs.existsSync(srcDir)) {
+		return entries;
+	}
+
+	for (const inputPath of findMetadataFiles(srcDir)) {
+		entries.push({
+			inputPath,
+			outputPath: path.relative(srcDir, inputPath),
+		});
+	}
+
+	return entries;
+}
+
+function findMetadataFiles(directory) {
+	const metadataFiles = [];
+
+	for (const entry of fs.readdirSync(directory, { withFileTypes: true })) {
+		const entryPath = path.join(directory, entry.name);
+
+		if (entry.isDirectory()) {
+			metadataFiles.push(...findMetadataFiles(entryPath));
+			continue;
+		}
+		if (entry.isFile() && METADATA_FILENAMES.has(entry.name)) {
+			metadataFiles.push(entryPath);
+		}
+	}
+
+	return metadataFiles;
+}
+
+module.exports = async () => {
+	const { default: UnpluginTypia } = await import("@typia/unplugin/webpack");
+
+	return {
+		...defaultConfig,
+		plugins: [
+			UnpluginTypia(),
+			...(defaultConfig.plugins || []),
+			new MetadataAssetPlugin(),
+		],
+	};
+};

package/templates/basic/package.json.mustache

@@ -0,0 +1,39 @@
+{
+  "name": "{{slug}}",
+  "version": "0.1.0",
+  "packageManager": "bun@1.3.10",
+  "description": "{{description}}",
+  "author": "{{author}}",
+  "license": "GPL-2.0-or-later",
+  "main": "build/index.js",
+  "scripts": {
+    "sync-types": "tsx scripts/sync-types-to-block-json.ts",
+    "build": "bun run sync-types && wp-scripts build",
+    "start": "bun run sync-types && wp-scripts start",
+    "dev": "bun run start",
+    "lint:js": "wp-scripts lint-js",
+    "lint:css": "wp-scripts lint-style",
+    "lint": "bun run lint:js && bun run lint:css",
+    "format": "wp-scripts format"
+  },
+  "devDependencies": {
+    "@wp-typia/block-types": "^0.1.0",
+    "ajv": "^8.18.0",
+    "@types/wordpress__block-editor": "^11.5.17",
+    "@types/wordpress__blocks": "^12.5.18",
+    "@types/wordpress__components": "^23.8.0",
+    "@wordpress/browserslist-config": "^6.42.0",
+    "@wordpress/scripts": "^30.22.0",
+    "@typia/unplugin": "^12.0.1",
+    "tsx": "^4.20.5",
+    "typescript": "^5.9.2",
+    "typia": "^12.0.1"
+  },
+  "dependencies": {
+    "@wordpress/block-editor": "^15.2.0",
+    "@wordpress/blocks": "^15.2.0",
+    "@wordpress/components": "^30.2.0",
+    "@wordpress/element": "^6.29.0",
+    "@wordpress/i18n": "^6.2.0"
+  }
+}