feat: fork WP author-family blocks (post-author-name, post-author-biography, avatar)

packages/renderer-parity.json

@@ -41,6 +41,9 @@
         "core/post-excerpt",
         "core/post-date",
         "core/post-author",
+        "core/post-author-name",
+        "core/post-author-biography",
+        "core/avatar",
         "core/post-featured-image",
         "core/site-title",
         "core/site-tagline",
@@ -84,6 +87,9 @@
         "artisanpack/post-excerpt",
         "artisanpack/post-date",
         "artisanpack/post-author",
+        "artisanpack/post-author-name",
+        "artisanpack/post-author-biography",
+        "artisanpack/avatar",
         "artisanpack/post-featured-image",
         "artisanpack/site-title",
         "artisanpack/site-tagline",

packages/visual-editor-renderer-blade/resources/views/blocks/artisanpack/avatar.blade.php

@@ -0,0 +1,10 @@
+{{--
+	artisanpack/avatar — author family fork (#518).
+
+	Delegates to the core/avatar partial so the forked block renders
+	byte-identical markup. The forked-block cutover keeps core/avatar
+	registered in the editor, and the PostResolver stamps the same
+	_resolved* attributes for both namespaces, so a one-line @include
+	keeps the two renderers from drifting.
+--}}
+@include('visual-editor-renderer-blade::blocks.core.avatar')

packages/visual-editor-renderer-blade/resources/views/blocks/artisanpack/post-author-biography.blade.php

@@ -0,0 +1,11 @@
+{{--
+	artisanpack/post-author-biography — author family fork (#518).
+
+	Delegates to the core/post-author-biography partial so the forked
+	block renders byte-identical markup. The forked-block cutover keeps
+	core/post-author-biography registered in the editor, and the
+	PostResolver stamps the same _resolved* attributes for both
+	namespaces, so a one-line @include keeps the two renderers from
+	drifting.
+--}}
+@include('visual-editor-renderer-blade::blocks.core.post-author-biography')

packages/visual-editor-renderer-blade/resources/views/blocks/artisanpack/post-author-name.blade.php

@@ -0,0 +1,10 @@
+{{--
+	artisanpack/post-author-name — author family fork (#518).
+
+	Delegates to the core/post-author-name partial so the forked block
+	renders byte-identical markup. The forked-block cutover keeps
+	core/post-author-name registered in the editor, and the PostResolver
+	stamps the same _resolved* attributes for both namespaces, so a
+	one-line @include keeps the two renderers from drifting.
+--}}
+@include('visual-editor-renderer-blade::blocks.core.post-author-name')

packages/visual-editor-renderer-blade/resources/views/blocks/core/avatar.blade.php

@@ -0,0 +1,26 @@
+@php
+	use ArtisanPackUI\VisualEditorRendererBlade\Support\BlockSupports;
+	use ArtisanPackUI\VisualEditorRendererBlade\Support\UrlSanitizer;
+
+	$size       = isset( $attributes['size'] ) ? max( 1, (int) $attributes['size'] ) : 96;
+	$isLink     = ! empty( $attributes['isLink'] );
+	$linkTarget = isset( $attributes['linkTarget'] ) && is_string( $attributes['linkTarget'] ) ? $attributes['linkTarget'] : '_self';
+
+	$avatarUrl = UrlSanitizer::safe( isset( $attributes['_resolvedAuthorAvatar'] ) && is_string( $attributes['_resolvedAuthorAvatar'] ) ? $attributes['_resolvedAuthorAvatar'] : '' );
+	$alt       = isset( $attributes['_resolvedAuthorName'] ) && is_string( $attributes['_resolvedAuthorName'] ) ? $attributes['_resolvedAuthorName'] : '';
+	$authorUrl = UrlSanitizer::safe( isset( $attributes['_resolvedAuthorUrl'] ) && is_string( $attributes['_resolvedAuthorUrl'] ) ? $attributes['_resolvedAuthorUrl'] : '' );
+
+	$linkAttrs = 'href="' . e( $authorUrl ) . '"';
+	if ( '_blank' === $linkTarget ) {
+		$linkAttrs .= ' target="_blank" rel="noopener noreferrer"';
+	}
+@endphp
+<div{!! BlockSupports::wrapperAttrs( $attributes, [ 'wp-block-avatar' ] ) !!}>
+	@if ( '' !== $avatarUrl )
+		@if ( $isLink && '' !== $authorUrl )
+			<a {!! $linkAttrs !!}><img alt="{{ $alt }}" width="{{ $size }}" height="{{ $size }}" src="{{ $avatarUrl }}"/></a>
+		@else
+			<img alt="{{ $alt }}" width="{{ $size }}" height="{{ $size }}" src="{{ $avatarUrl }}"/>
+		@endif
+	@endif
+</div>

packages/visual-editor-renderer-blade/resources/views/blocks/core/post-author-biography.blade.php

@@ -0,0 +1,6 @@
+@php
+	use ArtisanPackUI\VisualEditorRendererBlade\Support\BlockSupports;
+
+	$bio = isset( $attributes['_resolvedAuthorBio'] ) && is_string( $attributes['_resolvedAuthorBio'] ) ? $attributes['_resolvedAuthorBio'] : '';
+@endphp
+<p{!! BlockSupports::wrapperAttrs( $attributes, [ 'wp-block-post-author-biography' ] ) !!}>{!! $bio !!}</p>

packages/visual-editor-renderer-blade/resources/views/blocks/core/post-author-name.blade.php

@@ -0,0 +1,22 @@
+@php
+	use ArtisanPackUI\VisualEditorRendererBlade\Support\BlockSupports;
+	use ArtisanPackUI\VisualEditorRendererBlade\Support\UrlSanitizer;
+
+	$isLink     = ! empty( $attributes['isLink'] );
+	$linkTarget = isset( $attributes['linkTarget'] ) && is_string( $attributes['linkTarget'] ) ? $attributes['linkTarget'] : '_self';
+
+	$name      = isset( $attributes['_resolvedAuthorName'] ) && is_string( $attributes['_resolvedAuthorName'] ) ? $attributes['_resolvedAuthorName'] : '';
+	$authorUrl = UrlSanitizer::safe( isset( $attributes['_resolvedAuthorUrl'] ) && is_string( $attributes['_resolvedAuthorUrl'] ) ? $attributes['_resolvedAuthorUrl'] : '' );
+
+	$linkAttrs = 'href="' . e( $authorUrl ) . '"';
+	if ( '_blank' === $linkTarget ) {
+		$linkAttrs .= ' target="_blank" rel="noopener noreferrer"';
+	}
+@endphp
+<div{!! BlockSupports::wrapperAttrs( $attributes, [ 'wp-block-post-author-name' ] ) !!}>
+	@if ( $isLink && '' !== $authorUrl )
+		<a {!! $linkAttrs !!}>{{ $name }}</a>
+	@else
+		{{ $name }}
+	@endif
+</div>

packages/visual-editor-renderer-react/src/blocks/core/postContext.tsx

@@ -210,6 +210,79 @@ export function PostAuthorBlock({ attributes }: BlockRendererProps): JSX.Element
     );
 }
 
+export function PostAuthorNameBlock({ attributes }: BlockRendererProps): JSX.Element {
+    const align = attrString(attributes.textAlign);
+    const isLink = attrBoolean(attributes.isLink);
+    const linkTarget = attrString(attributes.linkTarget, '_self');
+    const className = attrString(attributes.className);
+
+    const name = attrString(attributes._resolvedAuthorName);
+    const authorUrl = safeUrl(attrString(attributes._resolvedAuthorUrl));
+
+    const classes = classList([
+        'wp-block-post-author-name',
+        align !== '' ? `has-text-align-${align}` : null,
+        className,
+    ]);
+
+    if (isLink && authorUrl !== '') {
+        const linkProps = buildLinkProps(authorUrl, linkTarget, '');
+
+        return (
+            <div className={classes}>
+                <a {...linkProps}>{name}</a>
+            </div>
+        );
+    }
+
+    return <div className={classes}>{name}</div>;
+}
+
+export function PostAuthorBiographyBlock({ attributes }: BlockRendererProps): JSX.Element {
+    const align = attrString(attributes.textAlign);
+    const className = attrString(attributes.className);
+    const bio = attrString(attributes._resolvedAuthorBio);
+
+    const classes = classList([
+        'wp-block-post-author-biography',
+        align !== '' ? `has-text-align-${align}` : null,
+        className,
+    ]);
+
+    return <p className={classes} dangerouslySetInnerHTML={{ __html: bio }} />;
+}
+
+export function AvatarBlock({ attributes }: BlockRendererProps): JSX.Element {
+    const size = Math.max(1, attrInt(attributes.size, 96));
+    const isLink = attrBoolean(attributes.isLink);
+    const linkTarget = attrString(attributes.linkTarget, '_self');
+    const className = attrString(attributes.className);
+
+    const avatarUrl = safeUrl(attrString(attributes._resolvedAuthorAvatar));
+    const alt = attrString(attributes._resolvedAuthorName);
+    const authorUrl = safeUrl(attrString(attributes._resolvedAuthorUrl));
+
+    const classes = classList(['wp-block-avatar', className]);
+
+    if (avatarUrl === '') {
+        return <div className={classes} />;
+    }
+
+    const img = <img alt={alt} width={size} height={size} src={avatarUrl} />;
+
+    if (isLink && authorUrl !== '') {
+        const linkProps = buildLinkProps(authorUrl, linkTarget, '');
+
+        return (
+            <div className={classes}>
+                <a {...linkProps}>{img}</a>
+            </div>
+        );
+    }
+
+    return <div className={classes}>{img}</div>;
+}
+
 export function PostFeaturedImageBlock({ attributes }: BlockRendererProps): JSX.Element {
     const isLink = attrBoolean(attributes.isLink);
     const linkTarget = attrString(attributes.linkTarget);

packages/visual-editor-renderer-react/src/blocks/registerCoreBlocks.ts

@@ -45,7 +45,10 @@ import {
     NavigationSubmenuBlock,
 } from './core/navigation';
 import {
+    AvatarBlock,
+    PostAuthorBiographyBlock,
     PostAuthorBlock,
+    PostAuthorNameBlock,
     PostContentBlock,
     PostDateBlock,
     PostExcerptBlock,
@@ -153,6 +156,15 @@ const CORE_BLOCKS: Record<string, BlockRenderer> = {
     'artisanpack/post-date': PostDateBlock,
     'core/post-author': PostAuthorBlock,
     'artisanpack/post-author': PostAuthorBlock,
+    // Author family forks (#518) — recommended replacements for the
+    // deprecated core/post-author. Both namespaces share the same
+    // renderer because the saved markup is byte-equivalent.
+    'core/post-author-name': PostAuthorNameBlock,
+    'artisanpack/post-author-name': PostAuthorNameBlock,
+    'core/post-author-biography': PostAuthorBiographyBlock,
+    'artisanpack/post-author-biography': PostAuthorBiographyBlock,
+    'core/avatar': AvatarBlock,
+    'artisanpack/avatar': AvatarBlock,
     'core/post-featured-image': PostFeaturedImageBlock,
     'artisanpack/post-featured-image': PostFeaturedImageBlock,
     'core/site-title': SiteTitleBlock,

packages/visual-editor-renderer-vue/src/blocks/core/postContext.ts

@@ -260,6 +260,94 @@ export const PostAuthorBlock = defineComponent({
     },
 });
 
+export const PostAuthorNameBlock = defineComponent({
+    name: 'PostAuthorNameBlock',
+    props: blockRendererProps,
+    setup(props) {
+        return () => {
+            const align = attrString(props.attributes.textAlign);
+            const isLink = attrBoolean(props.attributes.isLink);
+            const linkTarget = attrString(props.attributes.linkTarget, '_self');
+            const className = attrString(props.attributes.className);
+
+            const name = attrString(props.attributes._resolvedAuthorName);
+            const authorUrl = safeUrl(props.attributes._resolvedAuthorUrl);
+
+            const classes = classList([
+                'wp-block-post-author-name',
+                align !== '' ? `has-text-align-${align}` : null,
+                className,
+            ]);
+
+            if (isLink && authorUrl !== '') {
+                const linkProps = buildLinkProps(authorUrl, linkTarget, '');
+
+                return h('div', { class: classes }, [h('a', linkProps, name)]);
+            }
+
+            return h('div', { class: classes }, name);
+        };
+    },
+});
+
+export const PostAuthorBiographyBlock = defineComponent({
+    name: 'PostAuthorBiographyBlock',
+    props: blockRendererProps,
+    setup(props) {
+        return () => {
+            const align = attrString(props.attributes.textAlign);
+            const className = attrString(props.attributes.className);
+            const bio = attrString(props.attributes._resolvedAuthorBio);
+
+            const classes = classList([
+                'wp-block-post-author-biography',
+                align !== '' ? `has-text-align-${align}` : null,
+                className,
+            ]);
+
+            return h('p', { class: classes, innerHTML: bio });
+        };
+    },
+});
+
+export const AvatarBlock = defineComponent({
+    name: 'AvatarBlock',
+    props: blockRendererProps,
+    setup(props) {
+        return () => {
+            const size = Math.max(1, attrInt(props.attributes.size, 96));
+            const isLink = attrBoolean(props.attributes.isLink);
+            const linkTarget = attrString(props.attributes.linkTarget, '_self');
+            const className = attrString(props.attributes.className);
+
+            const avatarUrl = safeUrl(props.attributes._resolvedAuthorAvatar);
+            const alt = attrString(props.attributes._resolvedAuthorName);
+            const authorUrl = safeUrl(props.attributes._resolvedAuthorUrl);
+
+            const classes = classList(['wp-block-avatar', className]);
+
+            if (avatarUrl === '') {
+                return h('div', { class: classes });
+            }
+
+            const img = h('img', {
+                alt,
+                width: size,
+                height: size,
+                src: avatarUrl,
+            });
+
+            if (isLink && authorUrl !== '') {
+                const linkProps = buildLinkProps(authorUrl, linkTarget, '');
+
+                return h('div', { class: classes }, [h('a', linkProps, [img])]);
+            }
+
+            return h('div', { class: classes }, [img]);
+        };
+    },
+});
+
 export const PostFeaturedImageBlock = defineComponent({
     name: 'PostFeaturedImageBlock',
     props: blockRendererProps,

packages/visual-editor-renderer-vue/src/blocks/registerCoreBlocks.ts

@@ -45,7 +45,10 @@ import {
     NavigationSubmenuBlock,
 } from './core/navigation';
 import {
+    AvatarBlock,
+    PostAuthorBiographyBlock,
     PostAuthorBlock,
+    PostAuthorNameBlock,
     PostContentBlock,
     PostDateBlock,
     PostExcerptBlock,
@@ -153,6 +156,15 @@ const CORE_BLOCKS: Record<string, BlockRenderer> = {
     'artisanpack/post-date': PostDateBlock,
     'core/post-author': PostAuthorBlock,
     'artisanpack/post-author': PostAuthorBlock,
+    // Author family forks (#518) — recommended replacements for the
+    // deprecated core/post-author. Both namespaces share the same
+    // renderer because the saved markup is byte-equivalent.
+    'core/post-author-name': PostAuthorNameBlock,
+    'artisanpack/post-author-name': PostAuthorNameBlock,
+    'core/post-author-biography': PostAuthorBiographyBlock,
+    'artisanpack/post-author-biography': PostAuthorBiographyBlock,
+    'core/avatar': AvatarBlock,
+    'artisanpack/avatar': AvatarBlock,
     'core/post-featured-image': PostFeaturedImageBlock,
     'artisanpack/post-featured-image': PostFeaturedImageBlock,
     'core/site-title': SiteTitleBlock,