Block fields: Add object type support for media and link controls #74435
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
talldan
added
[Type] Enhancement
github-actions
bot
added
[Package] Block library
talldan
requested review from
andrewserong,
oandregal,
ramonjd and
youknowriad
|
Size Change: +65 B (0%) Total Size: 3.08 MB
ℹ️ View Unchanged
|
talldan
commented
Jan 8, 2026
Comment on lines
96
to
131
| getValue: ( { item } ) => { | ||
| if ( fieldDef.mapping ) { | ||
| // Extract mapped properties from the block attributes | ||
| // When a field is an object, flatten all the properties to the root | ||
| // of the block attributes. | ||
| if ( fieldDef.type === 'object' && fieldDef.properties ) { | ||
| const mappedValue = {}; | ||
| Object.entries( fieldDef.mapping ).forEach( | ||
| ( [ key, attrKey ] ) => { | ||
| mappedValue[ key ] = item[ attrKey ]; | ||
| } | ||
| ); | ||
|
|
||
| // Normalize to canonical structure based on field type | ||
| if ( fieldDef.type === 'media' ) { | ||
| return normalizeMediaValue( mappedValue, fieldDef ); | ||
| } | ||
| if ( fieldDef.type === 'link' ) { | ||
| return normalizeLinkValue( mappedValue, fieldDef ); | ||
| } | ||
|
|
||
| // For other types, return as-is | ||
| // Convert to field keys. | ||
| Object.keys( fieldDef.properties ).forEach( ( key ) => { | ||
| const attributeKey = | ||
| fieldDef.properties[ key ].id ?? key; | ||
| if ( item[ attributeKey ] ) { | ||
| mappedValue[ key ] = item[ attributeKey ]; | ||
| } | ||
| } ); | ||
| return mappedValue; | ||
| } | ||
| // For simple id-based fields, use the id as the attribute key | ||
| return item[ fieldDef.id ]; | ||
| }, | ||
| setValue: ( { item, value } ) => { | ||
| if ( fieldDef.mapping ) { | ||
| // Denormalize from canonical structure back to mapped keys | ||
| let denormalizedValue = value; | ||
| if ( fieldDef.type === 'media' ) { | ||
| denormalizedValue = denormalizeMediaValue( | ||
| value, | ||
| fieldDef | ||
| ); | ||
| } else if ( fieldDef.type === 'link' ) { | ||
| denormalizedValue = denormalizeLinkValue( | ||
| value, | ||
| fieldDef | ||
| ); | ||
| } | ||
| setValue: ( { value } ) => { | ||
| // When a field is an object, flatten all the properties to the root | ||
| // of the block attributes. | ||
| if ( fieldDef.type === 'object' && fieldDef.properties ) { | ||
| const mappedValue = {}; | ||
|
|
||
| // Build an object with all mapped attributes | ||
| const updates = {}; | ||
| Object.entries( fieldDef.mapping ).forEach( | ||
| ( [ key, attrKey ] ) => { | ||
| // If key is explicitly in value, use it (even if undefined to allow clearing) | ||
| // Otherwise, preserve the old value | ||
| if ( key in denormalizedValue ) { | ||
| updates[ attrKey ] = | ||
| denormalizedValue[ key ]; | ||
| } else { | ||
| updates[ attrKey ] = item[ attrKey ]; | ||
| } | ||
| // Convert to attribute keys. | ||
| Object.keys( fieldDef.properties ).forEach( ( key ) => { | ||
| if ( value[ key ] ) { | ||
| const attributeKey = | ||
| fieldDef.properties[ key ].id ?? key; | ||
| mappedValue[ attributeKey ] = value[ key ]; | ||
| } | ||
| ); | ||
| return updates; | ||
| } ); | ||
| return mappedValue; | ||
| } | ||
| // For simple id-based fields, use the id as the attribute key | ||
| return { [ fieldDef.id ]: value }; | ||
| }, |
Contributor
Author
There was a problem hiding this comment.
getValue and setValue is I think where the main code of interest is.
The thing that was unexpected to me is that I still had to map back and forth from the field keys to the attribute keys. I assumed the dataform would do this for me. Maybe it's something I missed, or perhaps it's because a custom getValues / setValues is being declared.
The other thing is that although we declare the field as having a structure like this:
{ image: { id, url, caption } }
The block attributes are all a flat object:
{ id, url, caption }
So in getValue/setValue the properties need to be flattened/unnested. This could be another reason why the mapping between keys is still required 🤔
oandregal
force-pushed
the
add/field-type-object
branch
from
122b8ab to
3742e56
Compare
ramonjd
reviewed
Jan 9, 2026
| } | ||
| // Convert to attribute keys. | ||
| Object.keys( fieldDef.properties ).forEach( ( key ) => { | ||
| if ( value[ key ] ) { |
Member
There was a problem hiding this comment.
I'm still getting my head around this and #74409 but just noticed this line... will value[ key ] always be truthy? I know the PR is still in draft, so didn't want to jump ahead.
ramonjd
reviewed
Jan 9, 2026
| if ( key === 'caption' || key === 'alt' ) { | ||
| resetValue[ key ] = ''; | ||
| } | ||
| resetValue[ key ] = undefined; |
Member
There was a problem hiding this comment.
will this overwrite an empty string?
andrewserong
reviewed
Jan 9, 2026
Contributor
There was a problem hiding this comment.
This is already looking like a good improvement. Judging from @oandregal's comments / latest update in #74409 it looks like we can try out the group field type. From my reading of it, although it doesn't include the custom getValue and setValue methods, it seems we'd still need to handle mapping? I'm wondering if it's okay for the consumer to do it, or if there's additional logic that should happen on the field's end (in the DataViews package).
Apologies if I'm missing something obvious, though!
… to demonstrate changes
talldan
force-pushed
the
add/object-type-support-for-media-block-fields
branch
from
6faf7f1 to
cfb0fba
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
Based on #74409
Takes some steps towards aligning the block fields implementation with dataforms/fields APIs.
#74409 proposes adding an
'object''group' type that has sub properties, which would be useful for media and link fields. This PR adopts it.How?
The PR generally switches away from using a custom
typefor the field types instead adding anEditproperty to implement the custom controls for fields.The
mappingproperty becomesproperties.In general I've tried to remove as much special code as possible from the implementation to make it closer to a native DataForm, but some mapping from field properties to attributes still seems to be required. I'm not sure if this is due to something wrong in the implementation of block fields.
Testing Instructions
Prerequisite: Enable the two 'contentOnly' gutenberg experiments