Skip to content

Commit

Permalink
Add Columns transform from Media & Text (#29415)
Browse files Browse the repository at this point in the history
* Add Columns transform from Media & Text

* Remove isMatch and reformat

* add text and link colors in transformation

Co-authored-by: ntsekouras <ntsekouras@outlook.com>
  • Loading branch information
stokesman and ntsekouras authored Mar 5, 2021
1 parent e0c2190 commit 2a95397
Showing 1 changed file with 57 additions and 0 deletions.
57 changes: 57 additions & 0 deletions packages/block-library/src/columns/transforms.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,63 @@ const transforms = {
selectedBlocksLength &&
selectedBlocksLength <= MAXIMUM_SELECTED_BLOCKS,
},
{
type: 'block',
blocks: [ 'core/media-text' ],
priority: 1,
transform: ( attributes, innerBlocks ) => {
const {
align,
backgroundColor,
textColor,
style,
mediaAlt: alt,
mediaId: id,
mediaPosition,
mediaSizeSlug: sizeSlug,
mediaType,
mediaUrl: url,
mediaWidth,
verticalAlignment,
} = attributes;
let media;
if ( mediaType === 'image' || ! mediaType ) {
const imageAttrs = { id, alt, url, sizeSlug };
const linkAttrs = {
href: attributes.href,
linkClass: attributes.linkClass,
linkDestination: attributes.linkDestination,
linkTarget: attributes.linkTarget,
rel: attributes.rel,
};
media = [ 'core/image', { ...imageAttrs, ...linkAttrs } ];
} else {
media = [ 'core/video', { id, src: url } ];
}
const innerBlocksTemplate = [
[ 'core/column', { width: `${ mediaWidth }%` }, [ media ] ],
[
'core/column',
{ width: `${ 100 - mediaWidth }%` },
innerBlocks,
],
];
if ( mediaPosition === 'right' ) {
innerBlocksTemplate.reverse();
}
return createBlock(
'core/columns',
{
align,
backgroundColor,
textColor,
style,
verticalAlignment,
},
createBlocksFromInnerBlocksTemplate( innerBlocksTemplate )
);
},
},
],
};

Expand Down

0 comments on commit 2a95397

Please sign in to comment.