substitute: hero, icon, imageBox, pricingBox

Author: Arukuen

src/block/hero/substitute.js

@@ -1,23 +1,12 @@
 export const substitute = {
 	from: 'stackable/hero',
-	variants: [ 'stackable/hero' ],
-	to: [ 'stackable/columns' ],
 	transform: ( oldAttributes, innerBlocks ) => {
 		return [
 			'stackable/columns',
 			{
-				// TODO: See if passing the entire oldAttributes works.
 				...oldAttributes,
-				// hasBackground: oldAttributes.hasBackground,
-				// blockBackgroundMediaUrl: oldAttributes.blockBackgroundMediaUrl,
-				// align: oldAttributes.align,
-				// contentAlign: oldAttributes.contentAlign,
-				// innerBlockContentAlign: oldAttributes.innerBlockContentAlign,
-				// blockHeight: oldAttributes.blockHeight,
-				// blockVerticalAlign: oldAttributes.blockVerticalAlign,
-				// hasContainer: oldAttributes.hasContainer,
 			},
-			[ 'stackable/column', {}, innerBlocks ],
+			[ [ 'stackable/column', {}, innerBlocks ] ],
 		]
 	},
 }

src/block/icon/substitute.js

@@ -1,7 +1,14 @@
-// TODO: this results in an error. test with Blooom Service 1 design
 export const substitute = {
 	from: 'stackable/icon',
-	to: [ 'core/paragraph' ],
+	transform: () => {
+		return [
+			'core/paragraph',
+			{
+				content: '',
+			},
+		]
+	},
+
 }
 
 export default substitute

src/block/image-box/substitute.js

@@ -0,0 +1,27 @@
+export const substitute = {
+	from: 'stackable/image-box',
+	transform: ( oldAttributes, innerBlocks ) => {
+		const imageUrl = innerBlocks[ 0 ][ 1 ]?.imageUrl
+		const imageHeight = innerBlocks[ 0 ][ 1 ]?.imageHeight
+
+		innerBlocks = innerBlocks.filter( block => ! [ 'stackable/image', 'core/image' ].includes( block[ 0 ] ) )
+
+		return [
+			'stackable/columns',
+			{
+				...oldAttributes,
+				hasBackground: true,
+				blockBackgroundMediaUrl: imageUrl,
+				blockPadding: {
+					top: imageHeight,
+					right: 0,
+					bottom: 0,
+					left: 0,
+				},
+			},
+			innerBlocks,
+		]
+	},
+}
+
+export default substitute

src/block/pricing-box/substitute.js

@@ -0,0 +1,14 @@
+export const substitute = {
+	from: 'stackable/pricing-box',
+	transform: ( oldAttributes, innerBlocks ) => {
+		return [
+			'stackable/columns',
+			{
+				...oldAttributes,
+			},
+			[ [ 'stackable/column', {}, innerBlocks ] ],
+		]
+	},
+}
+
+export default substitute