@wp-typia/project-tools 0.11.1

package/templates/persistence/src/block.json.mustache

@@ -0,0 +1,52 @@
+{
+	"$schema": "https://schemas.wp.org/trunk/block.json",
+	"apiVersion": 3,
+	"name": "{{namespace}}/{{slugKebabCase}}",
+	"version": "{{blockMetadataVersion}}",
+	"title": "{{title}}",
+	"category": "{{category}}",
+	"icon": "{{icon}}",
+	"description": "{{description}}",
+	"example": {},
+	"supports": {
+		"html": false,
+		"align": true,
+		"anchor": true,
+		"className": true,
+		"interactivity": true
+	},
+	"attributes": {
+		"content": {
+			"type": "string",
+			"source": "html",
+			"selector": ".{{cssClassName}}__content",
+			"default": "{{title}} persistence block"
+		},
+		"alignment": {
+			"type": "string",
+			"enum": ["left", "center", "right"],
+			"default": "left"
+		},
+		"isVisible": {
+			"type": "boolean",
+			"default": true
+		},
+		"showCount": {
+			"type": "boolean",
+			"default": true
+		},
+		"buttonLabel": {
+			"type": "string",
+			"default": "Persist Count"
+		},
+		"resourceKey": {
+			"type": "string",
+			"default": ""
+		}
+	},
+	"textdomain": "{{textDomain}}",
+	"editorScript": "file:./index.js",
+	"style": "file:./style-index.css",
+	"viewScriptModule": "file:./interactivity.js",
+	"render": "file:./render.php"
+}

package/templates/persistence/src/edit.tsx.mustache

@@ -0,0 +1,165 @@
+import { __ } from '@wordpress/i18n';
+import {
+	AlignmentToolbar,
+	BlockControls,
+	InspectorControls,
+	RichText,
+	useBlockProps,
+} from '@wordpress/block-editor';
+import {
+	Notice,
+	PanelBody,
+	TextControl,
+} from '@wordpress/components';
+import currentManifest from './typia.manifest.json';
+import {
+	InspectorFromManifest,
+	type ManifestDocument,
+	useEditorFields,
+	useTypedAttributeUpdater,
+} from '@wp-typia/block-runtime/inspector';
+import type { {{pascalCase}}Attributes } from './types';
+import {
+	sanitize{{pascalCase}}Attributes,
+	validate{{pascalCase}}Attributes,
+} from './validators';
+import { useTypiaValidation } from './hooks';
+
+export default function Edit( {
+	attributes,
+	setAttributes,
+}: {
+	attributes: {{pascalCase}}Attributes;
+	setAttributes: ( attrs: Partial< {{pascalCase}}Attributes > ) => void;
+} ) {
+	const editorFields = useEditorFields(
+		currentManifest as ManifestDocument,
+		{
+			manual: [ 'content', 'resourceKey' ],
+			labels: {
+				buttonLabel: __( 'Button Label', '{{textDomain}}' ),
+				resourceKey: __( 'Resource Key', '{{textDomain}}' ),
+				showCount: __( 'Show Count', '{{textDomain}}' ),
+			},
+		}
+	);
+	const { errorMessages, isValid } = useTypiaValidation(
+		attributes,
+		validate{{pascalCase}}Attributes
+	);
+	const validateEditorUpdate = (
+		nextAttributes: {{pascalCase}}Attributes
+	) => {
+		try {
+			return {
+				data: sanitize{{pascalCase}}Attributes( nextAttributes ),
+				errors: [],
+				isValid: true as const,
+			};
+		} catch {
+			return validate{{pascalCase}}Attributes( nextAttributes );
+		}
+	};
+	const { updateField } = useTypedAttributeUpdater(
+		attributes,
+		setAttributes,
+		validateEditorUpdate
+	);
+	const alignmentValue = editorFields.getStringValue(
+		attributes,
+		'alignment',
+		'left'
+	);
+	const persistencePolicy = '{{persistencePolicy}}';
+	const persistencePolicyDescription =
+		persistencePolicy === 'authenticated'
+			? __( 'Writes require a logged-in user and a valid REST nonce.', '{{textDomain}}' )
+			: __( 'Anonymous writes use signed short-lived public tokens, per-request ids, and coarse rate limiting.', '{{textDomain}}' );
+
+	return (
+		<>
+			<BlockControls>
+				<AlignmentToolbar
+					value={ alignmentValue }
+					onChange={ ( value ) =>
+						updateField(
+							'alignment',
+							( value || alignmentValue ) as NonNullable< {{pascalCase}}Attributes[ 'alignment' ] >
+						)
+					}
+				/>
+			</BlockControls>
+			<InspectorControls>
+				<InspectorFromManifest
+					attributes={ attributes }
+					fieldLookup={ editorFields }
+					onChange={ updateField }
+					paths={ [ 'alignment', 'isVisible', 'showCount', 'buttonLabel' ] }
+					title={ __( 'Persistence Settings', '{{textDomain}}' ) }
+				>
+					<TextControl
+						label={ __( 'Resource Key', '{{textDomain}}' ) }
+						value={ attributes.resourceKey ?? '' }
+						onChange={ ( value ) => updateField( 'resourceKey', value ) }
+						help={ __( 'Stable persisted identifier used by the storage-backed counter endpoint.', '{{textDomain}}' ) }
+					/>
+					<Notice status="info" isDismissible={ false }>
+						{ __( 'Storage mode: {{dataStorageMode}}', '{{textDomain}}' ) }
+					</Notice>
+					<Notice status="info" isDismissible={ false }>
+						{ __( 'Persistence policy: {{persistencePolicy}}', '{{textDomain}}' ) }
+						<br />
+						{ persistencePolicyDescription }
+					</Notice>
+					<Notice status="info" isDismissible={ false }>
+						{ __( 'Render mode: dynamic. `render.php` bootstraps post context, storage-backed state, and write-policy data before hydration.', '{{textDomain}}' ) }
+					</Notice>
+				</InspectorFromManifest>
+				{ ! isValid && (
+					<PanelBody
+						title={ __( 'Validation Errors', '{{textDomain}}' ) }
+						initialOpen
+					>
+						{ errorMessages.map( ( error, index ) => (
+							<Notice key={ index } status="error" isDismissible={ false }>
+								{ error }
+							</Notice>
+						) ) }
+					</PanelBody>
+				) }
+			</InspectorControls>
+			<div
+				{ ...useBlockProps( {
+					className: '{{cssClassName}}',
+					style: {
+						textAlign:
+							alignmentValue as NonNullable< {{pascalCase}}Attributes[ 'alignment' ] >,
+					},
+				} ) }
+			>
+				<RichText
+					tagName="p"
+					value={ attributes.content }
+					onChange={ ( value ) => updateField( 'content', value ) }
+					placeholder={ __( '{{title}} persistence block', '{{textDomain}}' ) }
+				/>
+				<p className="{{cssClassName}}__meta">
+					{ __( 'Resource key:', '{{textDomain}}' ) } { attributes.resourceKey || '—' }
+				</p>
+				<p className="{{cssClassName}}__meta">
+					{ __( 'Storage mode:', '{{textDomain}}' ) } {{dataStorageMode}}
+				</p>
+				<p className="{{cssClassName}}__meta">
+					{ __( 'Persistence policy:', '{{textDomain}}' ) } {{persistencePolicy}}
+				</p>
+				{ ! isValid && (
+					<Notice status="error" isDismissible={ false }>
+						<ul>
+							{ errorMessages.map( ( error, index ) => <li key={ index }>{ error }</li> ) }
+						</ul>
+					</Notice>
+				) }
+			</div>
+		</>
+	);
+}

package/templates/persistence/src/render.php.mustache

@@ -0,0 +1,126 @@
+<?php
+/**
+ * Dynamic render entry for the {{title}} block.
+ *
+ * @package {{pascalCase}}
+ */
+
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+$validator_path = __DIR__ . '/typia-validator.php';
+if ( ! file_exists( $validator_path ) ) {
+	return '';
+}
+
+$validator = require $validator_path;
+if ( ! is_object( $validator ) || ! method_exists( $validator, 'apply_defaults' ) || ! method_exists( $validator, 'validate' ) ) {
+	return '';
+}
+
+$normalized   = $validator->apply_defaults( is_array( $attributes ) ? $attributes : array() );
+$validation   = $validator->validate( $normalized );
+$resource_key = isset( $normalized['resourceKey'] ) ? (string) $normalized['resourceKey'] : '';
+
+if ( empty( $validation['valid'] ) || '' === $resource_key ) {
+	return '';
+}
+
+$alignment          = isset( $normalized['alignment'] ) ? (string) $normalized['alignment'] : 'left';
+$button_label       = isset( $normalized['buttonLabel'] ) ? (string) $normalized['buttonLabel'] : 'Persist Count';
+$content            = isset( $normalized['content'] ) ? (string) $normalized['content'] : '';
+$post_id            = is_object( $block ) && isset( $block->context['postId'] )
+	? (int) $block->context['postId']
+	: (int) get_queried_object_id();
+$storage_mode       = '{{dataStorageMode}}';
+$persistence_policy = '{{persistencePolicy}}';
+$can_write          = false;
+$notice_message     = 'authenticated' === $persistence_policy
+	? __( 'Sign in to persist this counter.', '{{textDomain}}' )
+	: __( 'Reload the page to refresh this write token.', '{{textDomain}}' );
+$context            = array(
+	'buttonLabel'       => $button_label,
+	'canWrite'          => false,
+	'count'             => 0,
+	'isVisible'         => ! empty( $normalized['isVisible'] ),
+	'persistencePolicy' => $persistence_policy,
+	'postId'            => (int) $post_id,
+	'resourceKey'       => $resource_key,
+	'storage'           => $storage_mode,
+);
+
+if ( 'authenticated' === $persistence_policy ) {
+	$can_write = $post_id > 0 && is_user_logged_in();
+	if ( $can_write ) {
+		$context['restNonce'] = wp_create_nonce( 'wp_rest' );
+	}
+} elseif ( $post_id > 0 && function_exists( '{{phpPrefix}}_create_public_write_token' ) ) {
+	$public_write = {{phpPrefix}}_create_public_write_token( (int) $post_id, $resource_key );
+	if ( is_array( $public_write ) ) {
+		$token      = isset( $public_write['token'] ) ? (string) $public_write['token'] : '';
+		$expires_at = isset( $public_write['expiresAt'] ) ? (int) $public_write['expiresAt'] : 0;
+
+		if ( '' !== $token ) {
+			$context['publicWriteToken'] = $token;
+			$can_write                   = true;
+		}
+
+		if ( $expires_at > 0 ) {
+			$context['publicWriteExpiresAt'] = $expires_at;
+		}
+	}
+}
+
+$context['canWrite'] = $can_write;
+
+$wrapper_attributes = get_block_wrapper_attributes(
+	array(
+		'data-wp-context'       => wp_json_encode( $context ),
+		'data-wp-interactive'   => '{{slugKebabCase}}',
+		'data-wp-init'          => 'callbacks.init',
+		'data-wp-run--mounted' => 'callbacks.mounted',
+	)
+);
+?>
+
+<div <?php echo $wrapper_attributes; ?>>
+	<div class="{{frontendCssClassName}}">
+		<p class="{{frontendCssClassName}}__content" style="<?php echo esc_attr( 'text-align:' . $alignment ); ?>">
+			<?php echo esc_html( $content ); ?>
+		</p>
+		<?php if ( ! $can_write ) : ?>
+			<p class="{{frontendCssClassName}}__notice">
+				<?php echo esc_html( $notice_message ); ?>
+			</p>
+		<?php endif; ?>
+		<p
+			class="{{frontendCssClassName}}__error"
+			role="status"
+			aria-live="polite"
+			aria-atomic="true"
+			data-wp-bind--hidden="!state.error"
+			data-wp-text="state.error"
+			hidden
+		></p>
+		<?php if ( ! empty( $normalized['showCount'] ) ) : ?>
+			<span
+				class="{{frontendCssClassName}}__count"
+				role="status"
+				aria-live="polite"
+				aria-atomic="true"
+				data-wp-text="state.count"
+			>
+				0
+			</span>
+		<?php endif; ?>
+		<button
+			type="button"
+			<?php echo $can_write ? '' : 'disabled'; ?>
+			data-wp-bind--disabled="!context.canWrite"
+			data-wp-on--click="actions.increment"
+		>
+			<?php echo esc_html( $button_label ); ?>
+		</button>
+	</div>
+</div>

package/templates/persistence/src/style.scss.mustache

@@ -0,0 +1,46 @@
+.{{cssClassName}} {
+	border: 1px solid #dcdcde;
+	border-radius: 12px;
+	padding: 16px;
+	background: #fff;
+
+	&__meta {
+		color: #50575e;
+		font-size: 13px;
+		margin: 8px 0 0;
+	}
+}
+
+.{{frontendCssClassName}} {
+	display: grid;
+	gap: 12px;
+	border: 1px solid #dcdcde;
+	border-radius: 12px;
+	padding: 16px;
+	background: #f6f7f7;
+
+	&__count {
+		display: inline-flex;
+		min-width: 3rem;
+		justify-content: center;
+		font-weight: 700;
+	}
+
+	&__notice,
+	&__error {
+		margin: 0;
+		font-size: 13px;
+	}
+
+	&__notice {
+		color: #50575e;
+	}
+
+	&__error {
+		color: #b32d2e;
+	}
+
+	button {
+		width: fit-content;
+	}
+}

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

@@ -0,0 +1,55 @@
+import type { TextAlignment } from '@wp-typia/block-types/block-editor/alignment';
+import type {
+	TypiaValidationError,
+	ValidationResult,
+} from '@wp-typia/block-runtime/validation';
+import { tags } from 'typia';
+
+export type {
+	TypiaValidationError,
+	ValidationResult,
+} from '@wp-typia/block-runtime/validation';
+
+export interface {{pascalCase}}Attributes {
+	content: string &
+		tags.MinLength< 1 > &
+		tags.MaxLength< 250 > &
+		tags.Default< '{{title}} persistence block' >;
+	alignment?: TextAlignment & tags.Default< 'left' >;
+	isVisible?: boolean & tags.Default< true >;
+	showCount?: boolean & tags.Default< true >;
+	buttonLabel?: string &
+		tags.MinLength< 1 > &
+		tags.MaxLength< 40 > &
+		tags.Default< 'Persist Count' >;
+	resourceKey?: string &
+		tags.MinLength< 1 > &
+		tags.MaxLength< 100 > &
+		tags.Default< 'primary' >;
+}
+
+export interface {{pascalCase}}Context {
+	buttonLabel: string;
+	canWrite: boolean;
+	count: number;
+	persistencePolicy: 'authenticated' | 'public';
+	postId: number;
+	publicWriteExpiresAt?: number;
+	publicWriteToken?: string;
+	resourceKey: string;
+	restNonce?: string;
+	storage: 'post-meta' | 'custom-table';
+	isVisible: boolean;
+}
+
+export interface {{pascalCase}}State {
+	canWrite: boolean;
+	count: number;
+	error?: string;
+	isHydrated: boolean;
+	isLoading: boolean;
+	isSaving: boolean;
+	isVisible: boolean;
+}
+
+export type {{pascalCase}}ValidationResult = ValidationResult< {{pascalCase}}Attributes >;