From d2afac61b085f48257ca5ca7f89c3e815365e42e Mon Sep 17 00:00:00 2001 From: Alquen Sarmiento Date: Mon, 30 Jun 2025 16:07:23 +0800 Subject: [PATCH 1/7] fix: correct a typo --- src/block-components/typography/deprecated.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/block-components/typography/deprecated.js b/src/block-components/typography/deprecated.js index 0b162743b8..1bebe4ef39 100644 --- a/src/block-components/typography/deprecated.js +++ b/src/block-components/typography/deprecated.js @@ -96,7 +96,7 @@ export const deprecateTypographyShadowColor = { const shadowParentHover = getAttribute( 'textShadowParentHover' ) || shadowHover if ( getAttribute( 'textShadow' ) && getAttribute( 'textShadow' ).indexOf( 'rgba' ) !== -1 ) { - const { options, color } = extractRgba( shadowHover ) + const { options, color } = extractRgba( shadow ) const hex = rgbaToHexAlpha( color ) newAttributes[ getAttrName( 'textShadow' ) ] = `${ options } ${ hex }` } From e72b8e7be6897f25a138b08cc636da1143cd868e Mon Sep 17 00:00:00 2001 From: Alquen Sarmiento Date: Mon, 30 Jun 2025 16:08:24 +0800 Subject: [PATCH 2/7] fix: only run the migration if text shadow uses rgba --- src/block-components/typography/deprecated.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/block-components/typography/deprecated.js b/src/block-components/typography/deprecated.js index 1bebe4ef39..b12bf04059 100644 --- a/src/block-components/typography/deprecated.js +++ b/src/block-components/typography/deprecated.js @@ -77,7 +77,9 @@ export const deprecateTypographyShadowColor = { const getAttrName = getAttrNameFunction( attrNameTemplate ) const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ] - if ( getAttribute( 'textShadow' ) || getAttribute( 'textShadowHover' ) || getAttribute( 'textShadowParentHover' ) ) { + if ( ( getAttribute( 'textShadow' ) && getAttribute( 'textShadow' ).indexOf( 'rgba' ) !== -1 ) || + ( getAttribute( 'textShadowHover' ) && getAttribute( 'textShadowHover' ).indexOf( 'rgba' ) !== -1 ) || + ( getAttribute( 'textShadowParentHover' ) && getAttribute( 'textShadowParentHover' ).indexOf( 'rgba' ) ) ) { return true } From e80fb9651774bf6acf639d9237010c6fc966f540 Mon Sep 17 00:00:00 2001 From: Alquen Sarmiento Date: Mon, 30 Jun 2025 16:12:34 +0800 Subject: [PATCH 3/7] fix: update the shadows option to using hex --- src/block-components/typography/edit.js | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/src/block-components/typography/edit.js b/src/block-components/typography/edit.js index fc34d1fb3b..df35fc50ff 100644 --- a/src/block-components/typography/edit.js +++ b/src/block-components/typography/edit.js @@ -34,17 +34,17 @@ import { useSelect } from '@wordpress/data' const TYPOGRAPHY_SHADOWS = [ 'none', - '2px 2px 4px rgba(0, 0, 0, 0.2)', - '6px 6px 4px rgba(120, 120, 120, 0.2)', - '2px 4px 5px rgba(0, 0, 0, 0.4)', - '0px 0px 5px rgba(0, 0, 0, 0.4)', - '4px 4px 0px rgba(0, 0, 0, 1)', - '0px 15px 14px rgba(18, 63, 82, 0.3)', - '25px 10px 14px rgba(18, 63, 82, 0.3)', - '25px 10px 30px rgba(18, 63, 82, 0.3)', - '0px 0px 40px rgba(18, 63, 82, 0.6)', - '0px 0px 62px rgba(71, 73, 79, 1)', - '0px 0px 100px rgba(71, 73, 79, 1)', + '2px 2px 4px #00000033', + '6px 6px 4px #78787833', + '2px 4px 5px #00000066', + '0px 0px 5px #00000066', + '4px 4px 0px #000000ff', + '0px 15px 14px #123f524c', + '25px 10px 14px #123f524c', + '25px 10px 30px #123f524c', + '0px 0px 40px #123f5299', + '0px 0px 62px #47494fff', + '0px 0px 100px #47494fff', ] const GRADIENT_OPTIONS = [ From c221b3fc84ed744e027a661a699877538000533d Mon Sep 17 00:00:00 2001 From: Alquen Sarmiento Date: Mon, 30 Jun 2025 16:23:47 +0800 Subject: [PATCH 4/7] fix: border shadows --- .../helpers/borders/deprecated.js | 4 +++- src/components/shadow-control/index.js | 18 +++++++++--------- 2 files changed, 12 insertions(+), 10 deletions(-) diff --git a/src/block-components/helpers/borders/deprecated.js b/src/block-components/helpers/borders/deprecated.js index e2b0d52936..9e27c40f64 100644 --- a/src/block-components/helpers/borders/deprecated.js +++ b/src/block-components/helpers/borders/deprecated.js @@ -56,7 +56,9 @@ export const deprecateShadowColor = { const getAttrName = getAttrNameFunction( attrNameTemplate ) const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ] - if ( getAttribute( 'shadow' ) || getAttribute( 'shadowHover' ) || getAttribute( 'shadowParentHover' ) ) { + if ( ( getAttribute( 'shadow' ) && getAttribute( 'shadow' ).indexOf( 'rgba' ) !== -1 ) || + ( getAttribute( 'shadowHover' ) && getAttribute( 'shadowHover' ).indexOf( 'rgba' ) !== -1 ) || + ( getAttribute( 'shadowParentHover' ) && getAttribute( 'shadowParentHover' ).indexOf( 'rgba' ) ) ) { return true } diff --git a/src/components/shadow-control/index.js b/src/components/shadow-control/index.js index 4a31e224b6..78ac81d721 100644 --- a/src/components/shadow-control/index.js +++ b/src/components/shadow-control/index.js @@ -25,15 +25,15 @@ import { Button, Dashicon } from '@wordpress/components' export const getShadows = () => { return applyFilters( 'stackable.shadows', [ 'none', - '0 0 0 1px rgba(120, 120, 120, 0.1)', - '0 0 0 2px rgba(120, 120, 120, 0.1)', - '0 5px 5px 0 rgba(18, 63, 82, 0.035)', - '0px 2px 20px rgba(153, 153, 153, 0.2)', - '0 5px 30px -10px rgba(18, 63, 82, 0.3)', - '0px 10px 30px rgba(0, 0, 0, 0.05)', - '7px 5px 30px rgba(72, 73, 121, 0.15)', - '0px 10px 60px rgba(0, 0, 0, 0.1)', - '0px 70px 90px -20px rgba(72, 73, 121, 0.30)', + '0 0 0 1px #7878781a', + '0 0 0 2px #7878781a', + '0 5px 5px 0 #123f5209', + '0px 2px 20px #99999933', + '0 5px 30px -10px #123f524c', + '0px 10px 30px #0000000d', + '7px 5px 30px #48497926', + '0px 10px 60px #0000001a', + '0px 70px 90px -20px #4849794c', ] ) } From 97897f99d5e89deac9f2063a24f3f6910bd6b3bf Mon Sep 17 00:00:00 2001 From: Alquen Sarmiento Date: Mon, 30 Jun 2025 16:48:46 +0800 Subject: [PATCH 5/7] fix: additional conversion from rgba to hex --- src/block-components/image/edit.js | 18 +++++++++--------- src/block-components/separator/edit.js | 18 +++++++++--------- 2 files changed, 18 insertions(+), 18 deletions(-) diff --git a/src/block-components/image/edit.js b/src/block-components/image/edit.js index 255b24dad7..d68c8dfc14 100644 --- a/src/block-components/image/edit.js +++ b/src/block-components/image/edit.js @@ -42,15 +42,15 @@ import { useBlockEditContext } from '@wordpress/block-editor' // Note: image drop shadows do not accept negative spread. export const IMAGE_SHADOWS = [ 'none', - '0px 0 1px rgba(120, 120, 120, 0.5)', - '0px 0 2px rgba(120, 120, 120, 0.5)', - '0px 5px 10px rgba(153, 153, 153, 0.35)', - '0px 2px 20px rgba(153, 153, 153, 0.2)', - '25px 10px 30px rgba(18, 63, 82, 0.3)', - '0px 10px 30px rgba(0, 0, 0, 0.1)', - '7px 5px 30px rgba(72, 73, 121, 0.15)', - '0px 10px 60px rgba(0, 0, 0, 0.1)', - '70px 60px 60px rgba(72, 73, 121, 0.2) ', + '0px 0 1px #78787880', + '0px 0 2px #78787880', + '0px 5px 10px #99999959', + '0px 2px 20px #99999933', + '25px 10px 30px #123f524c', + '0px 10px 30px #0000001a', + '7px 5px 30px #48497926', + '0px 10px 60px #0000001a', + '70px 60px 60px #48497933 ', ] const Controls = props => { diff --git a/src/block-components/separator/edit.js b/src/block-components/separator/edit.js index 32065bf10d..7374acb074 100644 --- a/src/block-components/separator/edit.js +++ b/src/block-components/separator/edit.js @@ -31,16 +31,16 @@ import { getAttributeNameFunc } from '~stackable/util' const SEPARATOR_SHADOWS = [ 'none', - '0px 0 1px rgba(120, 120, 120, 0.5)', - '0px 0 2px rgba(120, 120, 120, 0.5)', + '0px 0 1px #78787880', + '0px 0 2px #78787880', '2px 4px 6px #000', // This is a dark shadow similar to the shadow we used by default in v2. - '0px 5px 10px rgba(153, 153, 153, 0.35)', - '0px 2px 20px rgba(153, 153, 153, 0.2)', - '25px 10px 30px rgba(18, 63, 82, 0.3)', - '0px 10px 30px rgba(0, 0, 0, 0.05)', - '7px 5px 30px rgba(72, 73, 121, 0.15)', - '0px 10px 60px rgba(0, 0, 0, 0.1)', - '70px 130px -60px rgba(72, 73, 121, 0.38) ', + '0px 5px 10px #99999959', + '0px 2px 20px #99999933', + '25px 10px 30px #123f524c', + '0px 10px 30px #0000000d', + '7px 5px 30px #48497926', + '0px 10px 60px #0000001a', + '70px 130px -60px #48497961 ', ] const SeparatorControls = props => { From 0cae007356ca396f5d077eaada2d02db3ee0edbc Mon Sep 17 00:00:00 2001 From: Alquen Sarmiento Date: Tue, 1 Jul 2025 11:40:08 +0800 Subject: [PATCH 6/7] fix: typo --- src/block-components/helpers/borders/deprecated.js | 2 +- src/block-components/typography/deprecated.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/block-components/helpers/borders/deprecated.js b/src/block-components/helpers/borders/deprecated.js index 9e27c40f64..5d33e3cfb9 100644 --- a/src/block-components/helpers/borders/deprecated.js +++ b/src/block-components/helpers/borders/deprecated.js @@ -58,7 +58,7 @@ export const deprecateShadowColor = { if ( ( getAttribute( 'shadow' ) && getAttribute( 'shadow' ).indexOf( 'rgba' ) !== -1 ) || ( getAttribute( 'shadowHover' ) && getAttribute( 'shadowHover' ).indexOf( 'rgba' ) !== -1 ) || - ( getAttribute( 'shadowParentHover' ) && getAttribute( 'shadowParentHover' ).indexOf( 'rgba' ) ) ) { + ( getAttribute( 'shadowParentHover' ) && getAttribute( 'shadowParentHover' ).indexOf( 'rgba' ) !== -1 ) ) { return true } diff --git a/src/block-components/typography/deprecated.js b/src/block-components/typography/deprecated.js index b12bf04059..22b86d8ca1 100644 --- a/src/block-components/typography/deprecated.js +++ b/src/block-components/typography/deprecated.js @@ -79,7 +79,7 @@ export const deprecateTypographyShadowColor = { if ( ( getAttribute( 'textShadow' ) && getAttribute( 'textShadow' ).indexOf( 'rgba' ) !== -1 ) || ( getAttribute( 'textShadowHover' ) && getAttribute( 'textShadowHover' ).indexOf( 'rgba' ) !== -1 ) || - ( getAttribute( 'textShadowParentHover' ) && getAttribute( 'textShadowParentHover' ).indexOf( 'rgba' ) ) ) { + ( getAttribute( 'textShadowParentHover' ) && getAttribute( 'textShadowParentHover' ).indexOf( 'rgba' ) !== -1 ) ) { return true } From c86f5d7dc1ac847f92cdea83d6944bcf4ea2e81c Mon Sep 17 00:00:00 2001 From: Alquen Sarmiento Date: Wed, 2 Jul 2025 15:35:31 +0800 Subject: [PATCH 7/7] fix: add the additional deprecation for handling shadow --- .../alignment/deprecated/index.js | 28 +++++- .../columns/deprecated/index.js | 51 ++++++++++- .../helpers/size/deprecated.js | 16 +++- src/block-components/typography/deprecated.js | 16 +++- src/block/accordion/deprecated.js | 30 ++++++ src/block/blockquote/deprecated.js | 33 +++++++ src/block/button-group/deprecated/index.js | 30 ++++++ src/block/button/deprecated.js | 36 ++++++++ src/block/call-to-action/deprecated.js | 89 ++++++++++++++++++ src/block/card/deprecated.js | 86 ++++++++++++++++++ src/block/carousel/deprecated.js | 44 +++++++++ src/block/column/deprecated.js | 89 ++++++++++++++++++ src/block/columns/deprecated.js | 50 ++++++++++ src/block/count-up/deprecated.js | 36 ++++++++ src/block/countdown/deprecated.js | 44 +++++++++ src/block/divider/deprecated.js | 29 ++++++ src/block/expand/deprecated.js | 29 ++++++ src/block/feature-grid/deprecated.js | 50 ++++++++++ src/block/feature/deprecated.js | 58 ++++++++++++ src/block/heading/deprecated.js | 36 ++++++++ src/block/hero/deprecated.js | 89 ++++++++++++++++++ src/block/horizontal-scroller/deprecated.js | 29 ++++++ src/block/icon-box/deprecated.js | 43 +++++++++ src/block/icon-button/deprecated.js | 32 +++++++ src/block/icon-label/deprecated.js | 29 ++++++ src/block/icon-list-item/deprecated.js | 31 +++++++ src/block/icon-list/deprecated/index.js | 74 +++++++++++++++ src/block/icon/deprecated.js | 29 ++++++ src/block/image-box/deprecated.js | 29 ++++++ src/block/image/deprecated.js | 36 ++++++++ src/block/map/deprecated.js | 29 ++++++ src/block/notification/deprecated.js | 85 +++++++++++++++++ src/block/number-box/deprecated.js | 34 +++++++ src/block/posts/deprecated.js | 91 +++++++++++++++++++ src/block/price/deprecated.js | 29 ++++++ src/block/pricing-box/deprecated.js | 85 +++++++++++++++++ src/block/progress-bar/deprecated.js | 36 ++++++++ src/block/progress-circle/deprecated.js | 36 ++++++++ src/block/separator/deprecated.js | 31 +++++++ src/block/spacer/deprecated.js | 29 ++++++ src/block/subtitle/deprecated.js | 36 ++++++++ src/block/tab-content/deprecated.js | 40 ++++++++ src/block/tab-labels/deprecated.js | 42 +++++++++ src/block/table-of-contents/deprecated.js | 35 +++++++ src/block/tabs/deprecated.js | 40 ++++++++ src/block/team-member/deprecated.js | 85 +++++++++++++++++ src/block/testimonial/deprecated.js | 85 +++++++++++++++++ src/block/text/deprecated.js | 36 ++++++++ src/block/timeline/deprecated.js | 36 ++++++++ src/block/video-popup/deprecated.js | 30 ++++++ 50 files changed, 2244 insertions(+), 7 deletions(-) diff --git a/src/block-components/alignment/deprecated/index.js b/src/block-components/alignment/deprecated/index.js index 9d97fa7fcc..3a93792e8b 100644 --- a/src/block-components/alignment/deprecated/index.js +++ b/src/block-components/alignment/deprecated/index.js @@ -21,9 +21,15 @@ export const deprecateInnerBlockRowGapAndContainerHeight = { const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ] const containerHeight = getAttribute( 'containerHeight' ) + const containerHeightTablet = getAttribute( 'containerHeightTablet' ) + const containerHeightMobile = getAttribute( 'containerHeightMobile' ) const innerBlockRowGap = getAttribute( 'innerBlockRowGap' ) + const innerBlockRowGapTablet = getAttribute( 'innerBlockRowGapTablet' ) + const innerBlockRowGapMobile = getAttribute( 'innerBlockRowGapMobile' ) - return typeof containerHeight === 'number' || typeof innerBlockRowGap === 'number' + return typeof containerHeight === 'number' || typeof innerBlockRowGap === 'number' || + typeof containerHeightTablet === 'number' || typeof innerBlockRowGapTablet === 'number' || + typeof containerHeightMobile === 'number' || typeof innerBlockRowGapMobile === 'number' }, migrate: attrNameTemplate => attributes => { const getAttrName = getAttrNameFunction( attrNameTemplate ) @@ -34,16 +40,36 @@ export const deprecateInnerBlockRowGapAndContainerHeight = { } const containerHeight = getAttribute( 'containerHeight' ) + const containerHeightTablet = getAttribute( 'containerHeightTablet' ) + const containerHeightMobile = getAttribute( 'containerHeightMobile' ) const innerBlockRowGap = getAttribute( 'innerBlockRowGap' ) + const innerBlockRowGapTablet = getAttribute( 'innerBlockRowGapTablet' ) + const innerBlockRowGapMobile = getAttribute( 'innerBlockRowGapMobile' ) if ( typeof containerHeight === 'number' ) { newAttributes[ getAttrName( 'containerHeight' ) ] = String( containerHeight ) } + if ( typeof containerHeightTablet === 'number' ) { + newAttributes[ getAttrName( 'containerHeightTablet' ) ] = String( containerHeightTablet ) + } + + if ( typeof containerHeightMobile === 'number' ) { + newAttributes[ getAttrName( 'containerHeightMobile' ) ] = String( containerHeightMobile ) + } + if ( typeof innerBlockRowGap === 'number' ) { newAttributes[ getAttrName( 'innerBlockRowGap' ) ] = String( innerBlockRowGap ) } + if ( typeof innerBlockRowGapTablet === 'number' ) { + newAttributes[ getAttrName( 'innerBlockRowGapTablet' ) ] = String( innerBlockRowGapTablet ) + } + + if ( typeof innerBlockRowGapMobile === 'number' ) { + newAttributes[ getAttrName( 'innerBlockRowGapMobile' ) ] = String( innerBlockRowGapMobile ) + } + return newAttributes }, } diff --git a/src/block-components/columns/deprecated/index.js b/src/block-components/columns/deprecated/index.js index 795cd3bedd..bf4aa91eb4 100644 --- a/src/block-components/columns/deprecated/index.js +++ b/src/block-components/columns/deprecated/index.js @@ -32,34 +32,77 @@ export const deprecateColumnAndRowGap = { const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ] const columnSpacing = getAttribute( 'columnSpacing' ) + const columnSpacingTablet = getAttribute( 'columnSpacingTablet' ) + const columnSpacingMobile = getAttribute( 'columnSpacingMobile' ) + const columnGap = getAttribute( 'columnGap' ) + const columnGapTablet = getAttribute( 'columnGapTablet' ) + const columnGapMobile = getAttribute( 'columnGapMobile' ) + const rowGap = getAttribute( 'rowGap' ) + const rowGapTablet = getAttribute( 'rowGapTablet' ) + const rowGapMobile = getAttribute( 'rowGapMobile' ) - return typeof columnSpacing === 'number' || typeof columnGap === 'number' || typeof rowGap === 'number' + return ( + typeof columnSpacing === 'number' || + typeof columnSpacingTablet === 'number' || + typeof columnSpacingMobile === 'number' || + typeof columnGap === 'number' || + typeof columnGapTablet === 'number' || + typeof columnGapMobile === 'number' || + typeof rowGap === 'number' || + typeof rowGapTablet === 'number' || + typeof rowGapMobile === 'number' + ) }, + migrate: attrNameTemplate => attributes => { const getAttrName = getAttrNameFunction( attrNameTemplate ) const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ] - const newAttributes = { - ...attributes, - } + const newAttributes = { ...attributes } const columnSpacing = getAttribute( 'columnSpacing' ) + const columnSpacingTablet = getAttribute( 'columnSpacingTablet' ) + const columnSpacingMobile = getAttribute( 'columnSpacingMobile' ) + const columnGap = getAttribute( 'columnGap' ) + const columnGapTablet = getAttribute( 'columnGapTablet' ) + const columnGapMobile = getAttribute( 'columnGapMobile' ) + const rowGap = getAttribute( 'rowGap' ) + const rowGapTablet = getAttribute( 'rowGapTablet' ) + const rowGapMobile = getAttribute( 'rowGapMobile' ) if ( typeof columnSpacing === 'number' ) { newAttributes[ getAttrName( 'columnSpacing' ) ] = String( columnSpacing ) } + if ( typeof columnSpacingTablet === 'number' ) { + newAttributes[ getAttrName( 'columnSpacingTablet' ) ] = String( columnSpacingTablet ) + } + if ( typeof columnSpacingMobile === 'number' ) { + newAttributes[ getAttrName( 'columnSpacingMobile' ) ] = String( columnSpacingMobile ) + } if ( typeof columnGap === 'number' ) { newAttributes[ getAttrName( 'columnGap' ) ] = String( columnGap ) } + if ( typeof columnGapTablet === 'number' ) { + newAttributes[ getAttrName( 'columnGapTablet' ) ] = String( columnGapTablet ) + } + if ( typeof columnGapMobile === 'number' ) { + newAttributes[ getAttrName( 'columnGapMobile' ) ] = String( columnGapMobile ) + } if ( typeof rowGap === 'number' ) { newAttributes[ getAttrName( 'rowGap' ) ] = String( rowGap ) } + if ( typeof rowGapTablet === 'number' ) { + newAttributes[ getAttrName( 'rowGapTablet' ) ] = String( rowGapTablet ) + } + if ( typeof rowGapMobile === 'number' ) { + newAttributes[ getAttrName( 'rowGapMobile' ) ] = String( rowGapMobile ) + } return newAttributes }, diff --git a/src/block-components/helpers/size/deprecated.js b/src/block-components/helpers/size/deprecated.js index 27ef5c2b20..5075fb1ca7 100644 --- a/src/block-components/helpers/size/deprecated.js +++ b/src/block-components/helpers/size/deprecated.js @@ -22,8 +22,12 @@ export const deprecateSizeControlHeight = { const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ] const height = getAttribute( 'height' ) + const heightTablet = getAttribute( 'heightTablet' ) + const heightMobile = getAttribute( 'heightMobile' ) - return typeof height === 'number' + return typeof height === 'number' || + typeof heightTablet === 'number' || + typeof heightMobile === 'number' }, migrate: attrNameTemplate => attributes => { const getAttrName = getAttrNameFunction( attrNameTemplate ) @@ -34,11 +38,21 @@ export const deprecateSizeControlHeight = { } const height = getAttribute( 'height' ) + const heightTablet = getAttribute( 'heightTablet' ) + const heightMobile = getAttribute( 'heightMobile' ) if ( typeof height === 'number' ) { newAttributes[ getAttrName( 'height' ) ] = String( height ) } + if ( typeof heightTablet === 'number' ) { + newAttributes[ getAttrName( 'heightTablet' ) ] = String( heightTablet ) + } + + if ( typeof heightMobile === 'number' ) { + newAttributes[ getAttrName( 'heightMobile' ) ] = String( heightMobile ) + } + return newAttributes }, } diff --git a/src/block-components/typography/deprecated.js b/src/block-components/typography/deprecated.js index 22b86d8ca1..1b21a72766 100644 --- a/src/block-components/typography/deprecated.js +++ b/src/block-components/typography/deprecated.js @@ -125,8 +125,12 @@ export const deprecateTypographyFontSize = { const getAttribute = _attrName => attributes[ getAttrName( _attrName ) ] const fontSize = getAttribute( 'fontSize' ) + const fontSizeTablet = getAttribute( 'fontSizeTablet' ) + const fontSizeMobile = getAttribute( 'fontSizeMobile' ) - return typeof fontSize === 'number' + return typeof fontSize === 'number' || + typeof fontSizeTablet === 'number' || + typeof fontSizeMobile === 'number' }, migrate: attrNameTemplate => attributes => { const getAttrName = getAttrNameFunction( attrNameTemplate ) @@ -137,11 +141,21 @@ export const deprecateTypographyFontSize = { } const fontSize = getAttribute( 'fontSize' ) + const fontSizeTablet = getAttribute( 'fontSizeTablet' ) + const fontSizeMobile = getAttribute( 'fontSizeMobile' ) if ( typeof fontSize === 'number' ) { newAttributes[ getAttrName( 'fontSize' ) ] = String( fontSize ) } + if ( typeof fontSizeTablet === 'number' ) { + newAttributes[ getAttrName( 'fontSizeTablet' ) ] = String( fontSizeTablet ) + } + + if ( typeof fontSizeMobile === 'number' ) { + newAttributes[ getAttrName( 'fontSizeMobile' ) ] = String( fontSizeMobile ) + } + return newAttributes }, } diff --git a/src/block/accordion/deprecated.js b/src/block/accordion/deprecated.js index bce1e02cec..8a7c833728 100644 --- a/src/block/accordion/deprecated.js +++ b/src/block/accordion/deprecated.js @@ -8,6 +8,28 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -32,6 +54,14 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/blockquote/deprecated.js b/src/block/blockquote/deprecated.js index 5c5a5fa493..6a2380b8d7 100644 --- a/src/block/blockquote/deprecated.js +++ b/src/block/blockquote/deprecated.js @@ -8,6 +8,31 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { + ...attributes, + version: 2, + } + + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -36,6 +61,14 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/button-group/deprecated/index.js b/src/block/button-group/deprecated/index.js index cc9d3534ad..4842df46a8 100644 --- a/src/block/button-group/deprecated/index.js +++ b/src/block/button-group/deprecated/index.js @@ -10,6 +10,28 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -34,6 +56,14 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/button/deprecated.js b/src/block/button/deprecated.js index b104b12496..05ac06b4f8 100644 --- a/src/block/button/deprecated.js +++ b/src/block/button/deprecated.js @@ -10,6 +10,32 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasButtonShadow = deprecateShadowColor.isEligible( 'button%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasButtonShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'button%s' )( newAttributes ) + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateButtonGradientColor.migrate( 'button%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize attributes: attributes( '3.15.3' ), @@ -39,6 +65,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasButtonShadow = deprecateShadowColor.isEligible( 'button%s' )( attributes ) diff --git a/src/block/call-to-action/deprecated.js b/src/block/call-to-action/deprecated.js index d7c8e0c7d4..24a77936bd 100644 --- a/src/block/call-to-action/deprecated.js +++ b/src/block/call-to-action/deprecated.js @@ -36,6 +36,81 @@ addFilter( 'stackable.call-to-action.save.innerClassNames', 'stackable/3.8.0', ( } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) + const hasBottomSeparatorShadow = deprecateShadowColor.isEligible( 'bottomSeparator%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTopSeparatorShadow || hasBottomSeparatorShadow + }, + migrate: ( attributes, innerBlocks ) => { + const isNotV4 = attributes.version < 2 || typeof attributes.version === 'undefined' + + let newAttributes = { + ...attributes, + } + + if ( isNotV4 ) { + newAttributes = { + ...newAttributes, + version: 2, + } + + // Update the vertical align into flexbox + const hasOldVerticalAlign = !! attributes.containerVerticalAlign // Column only, this was changed to flexbox + + if ( hasOldVerticalAlign ) { + newAttributes = { + ...newAttributes, + containerVerticalAlign: '', + innerBlockAlign: attributes.containerVerticalAlign, + } + } + + // If the inner blocks are horizontal, adjust to accomodate the new + // column gap, it will modify blocks because people used block + // margins before instead of a proper column gap. + if ( attributes.innerBlockOrientation === 'horizontal' ) { + innerBlocks.forEach( ( block, index ) => { + if ( index ) { + if ( ! block.attributes.blockMargin ) { + block.attributes.blockMargin = { + top: '', + right: '', + bottom: '', + left: '', + } + } + if ( block.attributes.blockMargin.left === '' ) { + block.attributes.blockMargin.left = 24 + } + } + } ) + + newAttributes = { + ...newAttributes, + innerBlockColumnGap: 0, + } + } + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'topSeparator%s' )( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'bottomSeparator%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateInnerBlockRowGapAndContainerHeight.migrate( '%s' )( newAttributes ) + + return [ newAttributes, innerBlocks ] + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -114,6 +189,20 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.innerBlockRowGap === 'string' || + typeof attributes?.innerBlockRowGapTablet === 'string' || + typeof attributes?.innerBlockRowGapMobile === 'string' || + typeof attributes?.containerHeight === 'string' || + typeof attributes?.containerHeightTablet === 'string' || + typeof attributes?.containerHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) diff --git a/src/block/card/deprecated.js b/src/block/card/deprecated.js index 032439e3c5..1840966585 100644 --- a/src/block/card/deprecated.js +++ b/src/block/card/deprecated.js @@ -87,6 +87,78 @@ addFilter( 'stackable.card.save.innerClassNames', 'stackable/3.0.2', ( output, p } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: ( attributes, innerBlocks ) => { + const isNotV4 = attributes.version < 2 || typeof attributes.version === 'undefined' + + let newAttributes = { + ...attributes, + } + + if ( isNotV4 ) { + newAttributes = { + ...newAttributes, + version: 2, + } + + // Update the vertical align into flexbox + const hasOldVerticalAlign = !! attributes.containerVerticalAlign // Column only, this was changed to flexbox + + if ( hasOldVerticalAlign ) { + newAttributes = { + ...newAttributes, + containerVerticalAlign: '', + innerBlockAlign: attributes.containerVerticalAlign, + } + } + + // If the inner blocks are horizontal, adjust to accomodate the new + // column gap, it will modify blocks because people used block + // margins before instead of a proper column gap. + if ( attributes.innerBlockOrientation === 'horizontal' ) { + innerBlocks.forEach( ( block, index ) => { + if ( index ) { + if ( ! block.attributes.blockMargin ) { + block.attributes.blockMargin = { + top: '', + right: '', + bottom: '', + left: '', + } + } + if ( block.attributes.blockMargin.left === '' ) { + block.attributes.blockMargin.left = 24 + } + } + } ) + + newAttributes = { + ...newAttributes, + innerBlockColumnGap: 0, + } + } + } + + newAttributes = deprecationImageOverlayOpacity.migrate( newAttributes ), + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateInnerBlockRowGapAndContainerHeight.migrate( '%s' )( newAttributes ) + + return [ newAttributes, innerBlocks ] + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -164,6 +236,20 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.innerBlockRowGap === 'string' || + typeof attributes?.innerBlockRowGapTablet === 'string' || + typeof attributes?.innerBlockRowGapMobile === 'string' || + typeof attributes?.containerHeight === 'string' || + typeof attributes?.containerHeightTablet === 'string' || + typeof attributes?.containerHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/carousel/deprecated.js b/src/block/carousel/deprecated.js index 8ad029e728..b22c5e7651 100644 --- a/src/block/carousel/deprecated.js +++ b/src/block/carousel/deprecated.js @@ -9,6 +9,33 @@ import { attributes } from './schema' import { withVersion } from '~stackable/higher-order' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) + const hasBottomSeparatorShadow = deprecateShadowColor.isEligible( 'bottomSeparator%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTopSeparatorShadow || hasBottomSeparatorShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'topSeparator%s' )( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'bottomSeparator%s' )( newAttributes ) + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateColumnAndRowGap.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height and gaps attributes: attributes( '3.15.3' ), @@ -38,6 +65,23 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.columnSpacing === 'string' || + typeof attributes?.columnSpacingTablet === 'string' || + typeof attributes?.columnSpacingMobile === 'string' || + typeof attributes?.columnGap === 'string' || + typeof attributes?.columnGapTablet === 'string' || + typeof attributes?.columnGapMobile === 'string' || + typeof attributes?.rowGap === 'string' || + typeof attributes?.rowGapTablet === 'string' || + typeof attributes?.rowGapMobile === 'string' + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) diff --git a/src/block/column/deprecated.js b/src/block/column/deprecated.js index bd56ff8659..57f0333d53 100644 --- a/src/block/column/deprecated.js +++ b/src/block/column/deprecated.js @@ -76,6 +76,81 @@ addFilter( 'stackable.column.save.blockClassNames', 'stackable/3.8.0', ( output, } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: ( attributes, innerBlocks ) => { + const isNotV4 = attributes.version < 4 || typeof attributes.version === 'undefined' + + let newAttributes = { + ...attributes, + } + + if ( isNotV4 ) { + newAttributes = { + ...newAttributes, + version: 4, + className: classnames( attributes.className, { + 'stk-block-column--v2': false, + 'stk-block-column--v3': false, + } ), + } + + // Update the vertical align into flexbox + const hasOldVerticalAlign = !! attributes.containerVerticalAlign // Column only, this was changed to flexbox + + if ( hasOldVerticalAlign ) { + newAttributes = { + ...newAttributes, + containerVerticalAlign: '', + innerBlockAlign: attributes.containerVerticalAlign, + } + } + + // If the inner blocks are horizontal, adjust to accomodate the new + // column gap, it will modify blocks because people used block + // margins before instead of a proper column gap. + if ( attributes.innerBlockOrientation === 'horizontal' ) { + innerBlocks.forEach( ( block, index ) => { + if ( index ) { + if ( ! block.attributes.blockMargin ) { + block.attributes.blockMargin = { + top: '', + right: '', + bottom: '', + left: '', + } + } + if ( block.attributes.blockMargin.left === '' ) { + block.attributes.blockMargin.left = 24 + } + } + } ) + + newAttributes = { + ...newAttributes, + innerBlockColumnGap: 0, + } + } + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateInnerBlockRowGapAndContainerHeight.migrate( '%s' )( newAttributes ) + + return [ newAttributes, innerBlocks ] + }, + }, { // Support the change of type for block height, innerBlockRowGap and containerHeight attributes: attributes( '3.15.3' ), @@ -156,6 +231,20 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.innerBlockRowGap === 'string' || + typeof attributes?.innerBlockRowGapTablet === 'string' || + typeof attributes?.innerBlockRowGapMobile === 'string' || + typeof attributes?.containerHeight === 'string' || + typeof attributes?.containerHeightTablet === 'string' || + typeof attributes?.containerHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/columns/deprecated.js b/src/block/columns/deprecated.js index 2a9a521b85..2895ea2d2b 100644 --- a/src/block/columns/deprecated.js +++ b/src/block/columns/deprecated.js @@ -37,6 +37,39 @@ addFilter( 'stackable.columns.save.contentClassNames', 'stackable/3.8.0', ( clas } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) + const hasBottomSeparatorShadow = deprecateShadowColor.isEligible( 'bottomSeparator%s' )( attributes ) + const hasColumnFit = !! attributes.columnFit + + return hasBlockShadow || hasContainerShadow || hasTopSeparatorShadow || hasBottomSeparatorShadow || hasColumnFit + }, + migrate: attributes => { + let newAttributes = { + ...attributes, + columnFit: '', + columnFitAlign: '', + columnJustify: !! attributes.columnFit ? ( attributes.columnFitAlign || 'flex-start' ) : '', + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'topSeparator%s' )( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'bottomSeparator%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateColumnAndRowGap.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height and gaps attributes: attributes( '3.15.3' ), @@ -72,6 +105,23 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.columnSpacing === 'string' || + typeof attributes?.columnSpacingTablet === 'string' || + typeof attributes?.columnSpacingMobile === 'string' || + typeof attributes?.columnGap === 'string' || + typeof attributes?.columnGapTablet === 'string' || + typeof attributes?.columnGapMobile === 'string' || + typeof attributes?.rowGap === 'string' || + typeof attributes?.rowGapTablet === 'string' || + typeof attributes?.rowGapMobile === 'string' + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) diff --git a/src/block/count-up/deprecated.js b/src/block/count-up/deprecated.js index f2f6276b34..5872008157 100644 --- a/src/block/count-up/deprecated.js +++ b/src/block/count-up/deprecated.js @@ -9,6 +9,32 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTextShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyShadowColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -38,6 +64,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) diff --git a/src/block/countdown/deprecated.js b/src/block/countdown/deprecated.js index 474c6fc751..981b9f2a49 100644 --- a/src/block/countdown/deprecated.js +++ b/src/block/countdown/deprecated.js @@ -8,6 +8,34 @@ import { attributes } from './schema' import { withVersion } from '~stackable/higher-order' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( 'digit%s' )( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( 'label%s' )( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( 'message%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'digit%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'label%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'message%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -43,6 +71,22 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.digitfontSize === 'string' || + typeof attributes?.digitfontSizeTablet === 'string' || + typeof attributes?.digitfontSizeMobile === 'string' || + typeof attributes?.labelFontSize === 'string' || + typeof attributes?.labelFontSizeTablet === 'string' || + typeof attributes?.labelFontSizeMobile === 'string' || + typeof attributes?.messagefontSize === 'string' || + typeof attributes?.messagefontSizeTablet === 'string' || + typeof attributes?.messagefontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/divider/deprecated.js b/src/block/divider/deprecated.js index 12f770094a..e2431f73ee 100644 --- a/src/block/divider/deprecated.js +++ b/src/block/divider/deprecated.js @@ -8,6 +8,28 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -32,6 +54,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/expand/deprecated.js b/src/block/expand/deprecated.js index 12f770094a..e2431f73ee 100644 --- a/src/block/expand/deprecated.js +++ b/src/block/expand/deprecated.js @@ -8,6 +8,28 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -32,6 +54,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/feature-grid/deprecated.js b/src/block/feature-grid/deprecated.js index 54f389c38f..98767bc51e 100644 --- a/src/block/feature-grid/deprecated.js +++ b/src/block/feature-grid/deprecated.js @@ -61,6 +61,39 @@ addFilter( 'stackable.feature-grid.save.blockClassNames', 'stackable/3.1.0', ( o } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) + const hasBottomSeparatorShadow = deprecateShadowColor.isEligible( 'bottomSeparator%s' )( attributes ) + const hasColumnFit = !! attributes.columnFit + + return hasBlockShadow || hasContainerShadow || hasTopSeparatorShadow || hasBottomSeparatorShadow || hasColumnFit + }, + migrate: attributes => { + let newAttributes = { + ...attributes, + columnFit: '', + columnFitAlign: '', + columnJustify: !! attributes.columnFit ? ( attributes.columnFitAlign || 'flex-start' ) : '', + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'topSeparator%s' )( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'bottomSeparator%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateColumnAndRowGap.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height and gaps attributes: attributes( '3.15.3' ), @@ -96,6 +129,23 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.columnSpacing === 'string' || + typeof attributes?.columnSpacingTablet === 'string' || + typeof attributes?.columnSpacingMobile === 'string' || + typeof attributes?.columnGap === 'string' || + typeof attributes?.columnGapTablet === 'string' || + typeof attributes?.columnGapMobile === 'string' || + typeof attributes?.rowGap === 'string' || + typeof attributes?.rowGapTablet === 'string' || + typeof attributes?.rowGapMobile === 'string' + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) diff --git a/src/block/feature/deprecated.js b/src/block/feature/deprecated.js index 0131681705..6c01d3e038 100644 --- a/src/block/feature/deprecated.js +++ b/src/block/feature/deprecated.js @@ -63,6 +63,47 @@ addFilter( 'stackable.feature.save.innerClassNames', 'stackable/3.8.0', ( output } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) + const hasBottomSeparatorShadow = deprecateShadowColor.isEligible( 'bottomSeparator%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTopSeparatorShadow || hasBottomSeparatorShadow + }, + migrate: attributes => { + let newAttributes = { + ...attributes, + version: 2, + } + + // Update the old column fit into flexbox + const hasOldColumnFit = !! attributes.columnFit + if ( hasOldColumnFit ) { + newAttributes = { + ...newAttributes, + columnFit: '', + columnFitAlign: '', + columnJustify: attributes.columnFitAlign, + } + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'topSeparator%s' )( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'bottomSeparator%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateColumnAndRowGap.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height and gaps attributes: attributes( '3.15.3' ), @@ -106,6 +147,23 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.columnSpacing === 'string' || + typeof attributes?.columnSpacingTablet === 'string' || + typeof attributes?.columnSpacingMobile === 'string' || + typeof attributes?.columnGap === 'string' || + typeof attributes?.columnGapTablet === 'string' || + typeof attributes?.columnGapMobile === 'string' || + typeof attributes?.rowGap === 'string' || + typeof attributes?.rowGapTablet === 'string' || + typeof attributes?.rowGapMobile === 'string' + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) diff --git a/src/block/heading/deprecated.js b/src/block/heading/deprecated.js index 940d743ed1..e055a65ce4 100644 --- a/src/block/heading/deprecated.js +++ b/src/block/heading/deprecated.js @@ -34,6 +34,32 @@ addFilter( 'stackable.heading.save.blockClassNames', 'stackable/3.6.1', ( output } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTextShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyShadowColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -63,6 +89,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) diff --git a/src/block/hero/deprecated.js b/src/block/hero/deprecated.js index 6f4530145c..e162634571 100644 --- a/src/block/hero/deprecated.js +++ b/src/block/hero/deprecated.js @@ -36,6 +36,81 @@ addFilter( 'stackable.hero.save.innerClassNames', 'stackable/3.8.0', ( output, p } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) + const hasBottomSeparatorShadow = deprecateShadowColor.isEligible( 'bottomSeparator%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTopSeparatorShadow || hasBottomSeparatorShadow + }, + migrate: ( attributes, innerBlocks ) => { + const isNotV4 = attributes.version < 2 || typeof attributes.version === 'undefined' + + let newAttributes = { + ...attributes, + } + + if ( isNotV4 ) { + newAttributes = { + ...newAttributes, + version: 2, + } + + // Update the vertical align into flexbox + const hasOldVerticalAlign = !! attributes.containerVerticalAlign // Column only, this was changed to flexbox + + if ( hasOldVerticalAlign ) { + newAttributes = { + ...newAttributes, + containerVerticalAlign: '', + innerBlockAlign: attributes.containerVerticalAlign, + } + } + + // If the inner blocks are horizontal, adjust to accomodate the new + // column gap, it will modify blocks because people used block + // margins before instead of a proper column gap. + if ( attributes.innerBlockOrientation === 'horizontal' ) { + innerBlocks.forEach( ( block, index ) => { + if ( index ) { + if ( ! block.attributes.blockMargin ) { + block.attributes.blockMargin = { + top: '', + right: '', + bottom: '', + left: '', + } + } + if ( block.attributes.blockMargin.left === '' ) { + block.attributes.blockMargin.left = 24 + } + } + } ) + + newAttributes = { + ...newAttributes, + innerBlockColumnGap: 0, + } + } + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'topSeparator%s' )( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'bottomSeparator%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateInnerBlockRowGapAndContainerHeight.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -114,6 +189,20 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.innerBlockRowGap === 'string' || + typeof attributes?.innerBlockRowGapTablet === 'string' || + typeof attributes?.innerBlockRowGapMobile === 'string' || + typeof attributes?.containerHeight === 'string' || + typeof attributes?.containerHeightTablet === 'string' || + typeof attributes?.containerHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTopSeparatorShadow = deprecateShadowColor.isEligible( 'topSeparator%s' )( attributes ) diff --git a/src/block/horizontal-scroller/deprecated.js b/src/block/horizontal-scroller/deprecated.js index 649edab8b7..b40123c2dc 100644 --- a/src/block/horizontal-scroller/deprecated.js +++ b/src/block/horizontal-scroller/deprecated.js @@ -22,6 +22,28 @@ addFilter( 'stackable.horizontal-scroller.save.contentClassNames', 'stackable/3_ } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -46,6 +68,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/icon-box/deprecated.js b/src/block/icon-box/deprecated.js index c04ed26da7..9ae1118a33 100644 --- a/src/block/icon-box/deprecated.js +++ b/src/block/icon-box/deprecated.js @@ -8,6 +8,42 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { + ...attributes, + version: 2, + } + + // Update the vertical align into flexbox + const hasOldVerticalAlign = !! attributes.containerVerticalAlign // Column only, this was changed to flexbox + + if ( hasOldVerticalAlign ) { + newAttributes = { + ...newAttributes, + containerVerticalAlign: '', + innerBlockAlign: attributes.containerVerticalAlign, + } + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -47,6 +83,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/icon-button/deprecated.js b/src/block/icon-button/deprecated.js index cab6b3f206..dd13430558 100644 --- a/src/block/icon-button/deprecated.js +++ b/src/block/icon-button/deprecated.js @@ -9,6 +9,31 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasButtonShadow = deprecateShadowColor.isEligible( 'button%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasButtonShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateButtonGradientColor.migrate( 'button%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'button%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -35,6 +60,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasButtonShadow = deprecateShadowColor.isEligible( 'button%s' )( attributes ) diff --git a/src/block/icon-label/deprecated.js b/src/block/icon-label/deprecated.js index 9ae19d5cd8..c8d486f748 100644 --- a/src/block/icon-label/deprecated.js +++ b/src/block/icon-label/deprecated.js @@ -8,6 +8,28 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -77,6 +99,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/icon-list-item/deprecated.js b/src/block/icon-list-item/deprecated.js index 1afa1eaa31..d58a9a609c 100644 --- a/src/block/icon-list-item/deprecated.js +++ b/src/block/icon-list-item/deprecated.js @@ -7,6 +7,27 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -32,6 +53,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/icon-list/deprecated/index.js b/src/block/icon-list/deprecated/index.js index 38173ea3cf..3c336666c6 100644 --- a/src/block/icon-list/deprecated/index.js +++ b/src/block/icon-list/deprecated/index.js @@ -68,6 +68,70 @@ const getEquivalentIconSize = iconSize => { } const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + supports: { + anchor: true, + spacing: true, + __unstablePasteTextInline: true, + __experimentalSelector: 'ol,ul', + __experimentalOnMerge: true, + }, + migrate: ( attributes, innerBlocks ) => { + let newAttributes = { ...attributes } + const { + text, icons, iconSize, ordered, iconGap, + } = attributes + + const _iconSize = iconSize ? iconSize : 1 + const _iconGap = iconGap ? iconGap : 0 + + newAttributes = { + ...newAttributes, + listFullWidth: false, + iconVerticalAlignment: 'baseline', + iconGap: _iconGap + 4, // Our gap is smaller now. + iconSize: ordered + ? getEquivalentFontSize( _iconSize ) + : getEquivalentIconSize( _iconSize ), + } + + if ( ! text ) { + const block = createBlock( 'stackable/icon-list-item' ) + innerBlocks = [ block ] + } else { + const contents = textToArray( text ) + const blocks = contents.map( ( content, index ) => { + const newBlock = createBlock( 'stackable/icon-list-item', { + text: content, + icon: getUniqueIcon( icons, index ), + } ) + newBlock.attributes.uniqueId = createUniqueClass( newBlock.clientId ) + + return newBlock + } ) + innerBlocks = blocks + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return [ newAttributes, innerBlocks ] + }, + }, { // Support the change of type for font size and block height attributes: attributes( '3.15.3' ), @@ -136,6 +200,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/icon/deprecated.js b/src/block/icon/deprecated.js index 12f770094a..e2431f73ee 100644 --- a/src/block/icon/deprecated.js +++ b/src/block/icon/deprecated.js @@ -8,6 +8,28 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -32,6 +54,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/image-box/deprecated.js b/src/block/image-box/deprecated.js index 12f770094a..e2431f73ee 100644 --- a/src/block/image-box/deprecated.js +++ b/src/block/image-box/deprecated.js @@ -8,6 +8,28 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -32,6 +54,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/image/deprecated.js b/src/block/image/deprecated.js index 94d231f322..2a31e92763 100644 --- a/src/block/image/deprecated.js +++ b/src/block/image/deprecated.js @@ -60,6 +60,32 @@ addFilter( 'stackable.image.save.wrapper', 'stackable/image-caption-wrapper', ( } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasImageShadow = deprecateShadowColor.isEligible( 'image%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasImageShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecationImageOverlayOpacity.migrate( newAttributes ) + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'image%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'figcaption%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize attributes: attributes( '3.15.3' ), @@ -89,6 +115,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.figcaptionFontSize === 'string' || + typeof attributes?.figcaptionFontSizeTablet === 'string' || + typeof attributes?.figcaptionFontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasImageShadow = deprecateShadowColor.isEligible( 'image%s' )( attributes ) diff --git a/src/block/map/deprecated.js b/src/block/map/deprecated.js index 06a727f8d6..d59af7c8b3 100644 --- a/src/block/map/deprecated.js +++ b/src/block/map/deprecated.js @@ -35,6 +35,28 @@ addFilter( 'stackable.map.icon-options', 'stackable/3.13.0', ( output, attribute } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -59,6 +81,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/notification/deprecated.js b/src/block/notification/deprecated.js index 7301fc146c..2448b7b5fe 100644 --- a/src/block/notification/deprecated.js +++ b/src/block/notification/deprecated.js @@ -36,6 +36,77 @@ addFilter( 'stackable.notification.save.innerClassNames', 'stackable/3.8.0', ( o } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: ( attributes, innerBlocks ) => { + const isNotV4 = attributes.version < 2 || typeof attributes.version === 'undefined' + + let newAttributes = { + ...attributes, + } + + if ( isNotV4 ) { + newAttributes = { + ...newAttributes, + version: 2, + } + + // Update the vertical align into flexbox + const hasOldVerticalAlign = !! attributes.containerVerticalAlign // Column only, this was changed to flexbox + + if ( hasOldVerticalAlign ) { + newAttributes = { + ...newAttributes, + containerVerticalAlign: '', + innerBlockAlign: attributes.containerVerticalAlign, + } + } + + // If the inner blocks are horizontal, adjust to accomodate the new + // column gap, it will modify blocks because people used block + // margins before instead of a proper column gap. + if ( attributes.innerBlockOrientation === 'horizontal' ) { + innerBlocks.forEach( ( block, index ) => { + if ( index ) { + if ( ! block.attributes.blockMargin ) { + block.attributes.blockMargin = { + top: '', + right: '', + bottom: '', + left: '', + } + } + if ( block.attributes.blockMargin.left === '' ) { + block.attributes.blockMargin.left = 24 + } + } + } ) + + newAttributes = { + ...newAttributes, + innerBlockColumnGap: 0, + } + } + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateInnerBlockRowGapAndContainerHeight.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -112,6 +183,20 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.innerBlockRowGap === 'string' || + typeof attributes?.innerBlockRowGapTablet === 'string' || + typeof attributes?.innerBlockRowGapMobile === 'string' || + typeof attributes?.containerHeight === 'string' || + typeof attributes?.containerHeightTablet === 'string' || + typeof attributes?.containerHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/number-box/deprecated.js b/src/block/number-box/deprecated.js index cc3107628a..36e5a108f3 100644 --- a/src/block/number-box/deprecated.js +++ b/src/block/number-box/deprecated.js @@ -54,6 +54,30 @@ const depecatedSave_3_13_11 = props => { } const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasShapeShadow = deprecateShadowColor.isEligible( 'shape%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasShapeShadow + }, + migrate: attributes => { + let newAttributes = deprecateBlockBackgroundColorOpacity.migrate( attributes ) + newAttributes = deprecationBackgrounColorOpacity.migrate( 'shape%s' )( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'shape%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize attributes: attributes( '3.15.3' ), @@ -85,6 +109,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasShapeShadow = deprecateShadowColor.isEligible( 'shape%s' )( attributes ) diff --git a/src/block/posts/deprecated.js b/src/block/posts/deprecated.js index 22930e2b83..0b525a7200 100644 --- a/src/block/posts/deprecated.js +++ b/src/block/posts/deprecated.js @@ -42,6 +42,75 @@ addFilter( 'stackable.posts.title.readmore-content', 'stackable/3_0_2', addUndef addFilter( 'stackable.posts.feature-image', 'stackable/3_6_3', determineFeatureImage ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasImageShadow = deprecateShadowColor.isEligible( 'image%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasImageShadow + }, + migrate: attributes => { + let newAttributes = { + ...attributes, + version: 2, + } + + // We used to have an "Inner content width" which is now just the block width + const hasOldInnerContentWidth = attributes.innerBlockContentWidth || attributes.innerBlockContentWidthTablet || attributes.innerBlockContentWidthMobile + + if ( hasOldInnerContentWidth ) { + newAttributes = { + ...newAttributes, + innerBlockContentWidth: '', + innerBlockContentWidthTablet: '', + innerBlockContentWidthMobile: '', + innerBlockContentWidthUnit: 'px', + innerBlockContentWidthUnitTablet: '', + innerBlockContentWidthUnitMobile: '', + blockWidth: attributes.innerBlockContentWidth, + blockWidthTablet: attributes.innerBlockContentWidthTablet, + blockWidthMobile: attributes.innerBlockContentWidthMobile, + blockWidthUnit: attributes.innerBlockContentWidthUnit, + blockWidthUnitTablet: attributes.innerBlockContentWidthUnitTablet, + blockWidthUnitMobile: attributes.innerBlockContentWidthUnitMobile, + innerBlockAlign: '', + innerBlockAlignTablet: '', + innerBlockAlignMobile: '', + blockHorizontalAlign: attributes.innerBlockAlign, + blockHorizontalAlignTablet: attributes.innerBlockAlignTablet, + blockHorizontalAlignMobile: attributes.innerBlockAlignMobile, + } + } + + newAttributes = deprecationImageOverlayOpacity.migrate( newAttributes ) + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + + newAttributes = deprecateTypographyGradientColor.migrate( 'title%s' )( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( 'category%s' )( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( 'excerpt%s' )( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( 'meta%s' )( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( 'readmore%s' )( newAttributes ) + + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'image%s' )( newAttributes ) + + newAttributes = deprecateTypographyFontSize.migrate( 'title%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'category%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'excerpt%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'meta%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'readmore%s' )( newAttributes ) + + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -120,6 +189,28 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.titleFontSize === 'string' || + typeof attributes?.titleFontSizeTablet === 'string' || + typeof attributes?.titleFontSizeMobile === 'string' || + typeof attributes?.categoryFontSize === 'string' || + typeof attributes?.categoryFontSizeTablet === 'string' || + typeof attributes?.categoryFontSizeMobile === 'string' || + typeof attributes?.excerptFontSize === 'string' || + typeof attributes?.excerptFontSizeTablet === 'string' || + typeof attributes?.excerptFontSizeMobile === 'string' || + typeof attributes?.metaFontSize === 'string' || + typeof attributes?.metaFontSizeTablet === 'string' || + typeof attributes?.metaFontSizeMobile === 'string' || + typeof attributes?.readmoreFontSize === 'string' || + typeof attributes?.readmoreFontSizeTablet === 'string' || + typeof attributes?.readmoreFontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasImageShadow = deprecateShadowColor.isEligible( 'image%s' )( attributes ) diff --git a/src/block/price/deprecated.js b/src/block/price/deprecated.js index 12f770094a..e2431f73ee 100644 --- a/src/block/price/deprecated.js +++ b/src/block/price/deprecated.js @@ -8,6 +8,28 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -32,6 +54,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/pricing-box/deprecated.js b/src/block/pricing-box/deprecated.js index 194bed3fbf..45c7dc74ce 100644 --- a/src/block/pricing-box/deprecated.js +++ b/src/block/pricing-box/deprecated.js @@ -35,6 +35,77 @@ addFilter( 'stackable.pricing-box.save.innerClassNames', 'stackable/3.8.0', ( ou } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: ( attributes, innerBlocks ) => { + const isNotV4 = attributes.version < 2 || typeof attributes.version === 'undefined' + + let newAttributes = { + ...attributes, + } + + if ( isNotV4 ) { + newAttributes = { + ...newAttributes, + version: 2, + } + + // Update the vertical align into flexbox + const hasOldVerticalAlign = !! attributes.containerVerticalAlign // Column only, this was changed to flexbox + + if ( hasOldVerticalAlign ) { + newAttributes = { + ...newAttributes, + containerVerticalAlign: '', + innerBlockAlign: attributes.containerVerticalAlign, + } + } + + // If the inner blocks are horizontal, adjust to accomodate the new + // column gap, it will modify blocks because people used block + // margins before instead of a proper column gap. + if ( attributes.innerBlockOrientation === 'horizontal' ) { + innerBlocks.forEach( ( block, index ) => { + if ( index ) { + if ( ! block.attributes.blockMargin ) { + block.attributes.blockMargin = { + top: '', + right: '', + bottom: '', + left: '', + } + } + if ( block.attributes.blockMargin.left === '' ) { + block.attributes.blockMargin.left = 24 + } + } + } ) + + newAttributes = { + ...newAttributes, + innerBlockColumnGap: 0, + } + } + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateInnerBlockRowGapAndContainerHeight.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -111,6 +182,20 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.innerBlockRowGap === 'string' || + typeof attributes?.innerBlockRowGapTablet === 'string' || + typeof attributes?.innerBlockRowGapMobile === 'string' || + typeof attributes?.containerHeight === 'string' || + typeof attributes?.containerHeightTablet === 'string' || + typeof attributes?.containerHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/progress-bar/deprecated.js b/src/block/progress-bar/deprecated.js index f2f6276b34..5872008157 100644 --- a/src/block/progress-bar/deprecated.js +++ b/src/block/progress-bar/deprecated.js @@ -9,6 +9,32 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTextShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyShadowColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -38,6 +64,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) diff --git a/src/block/progress-circle/deprecated.js b/src/block/progress-circle/deprecated.js index f2f6276b34..5872008157 100644 --- a/src/block/progress-circle/deprecated.js +++ b/src/block/progress-circle/deprecated.js @@ -9,6 +9,32 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTextShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyShadowColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -38,6 +64,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) diff --git a/src/block/separator/deprecated.js b/src/block/separator/deprecated.js index d5f04d49c5..c304a9490c 100644 --- a/src/block/separator/deprecated.js +++ b/src/block/separator/deprecated.js @@ -9,6 +9,30 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasSeparatorShadow = deprecateShadowColor.isEligible( 'separator%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasSeparatorShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'separator%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -34,6 +58,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasSeparatorShadow = deprecateShadowColor.isEligible( 'separator%s' )( attributes ) diff --git a/src/block/spacer/deprecated.js b/src/block/spacer/deprecated.js index 12f770094a..e2431f73ee 100644 --- a/src/block/spacer/deprecated.js +++ b/src/block/spacer/deprecated.js @@ -8,6 +8,28 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -32,6 +54,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/subtitle/deprecated.js b/src/block/subtitle/deprecated.js index 67a57c8e50..38e50b929f 100644 --- a/src/block/subtitle/deprecated.js +++ b/src/block/subtitle/deprecated.js @@ -9,6 +9,32 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTextShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyShadowColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -38,6 +64,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) diff --git a/src/block/tab-content/deprecated.js b/src/block/tab-content/deprecated.js index fe39c800d5..10891afcf8 100644 --- a/src/block/tab-content/deprecated.js +++ b/src/block/tab-content/deprecated.js @@ -9,6 +9,29 @@ import { attributes } from './schema' import { withVersion } from '~stackable/higher-order' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateColumnAndRowGap.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height and gaps attributes: attributes( '3.15.3' ), @@ -36,6 +59,23 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.columnSpacing === 'string' || + typeof attributes?.columnSpacingTablet === 'string' || + typeof attributes?.columnSpacingMobile === 'string' || + typeof attributes?.columnGap === 'string' || + typeof attributes?.columnGapTablet === 'string' || + typeof attributes?.columnGapMobile === 'string' || + typeof attributes?.rowGap === 'string' || + typeof attributes?.rowGapTablet === 'string' || + typeof attributes?.rowGapMobile === 'string' + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/tab-labels/deprecated.js b/src/block/tab-labels/deprecated.js index 81268855a2..3ac0c9cde3 100644 --- a/src/block/tab-labels/deprecated.js +++ b/src/block/tab-labels/deprecated.js @@ -9,6 +9,38 @@ import { attributes } from './schema' import { withVersion } from '~stackable/higher-order' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTabButtonShadow = deprecateShadowColor.isEligible( 'tab%s' )( attributes ) + const hasActiveTabButtonShadow = deprecateShadowColor.isEligible( 'activeTab%s' )( attributes ) + const hasTextShadow = deprecateTypographyShadowColor.isEligible( 'tab%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTextShadow || hasTabButtonShadow || hasActiveTabButtonShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( 'tab%s' )( newAttributes ) + newAttributes = deprecateButtonGradientColor.migrate( 'tab%s' )( newAttributes ) + newAttributes = deprecateButtonGradientColor.migrate( 'activeTab%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyShadowColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'tab%s' )( newAttributes ) + newAttributes = deprecateShadowColor.migrate( 'activeTab%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'tab%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -42,6 +74,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.tabFontSize === 'string' || + typeof attributes?.tabFontSizeTablet === 'string' || + typeof attributes?.tabFontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTabButtonShadow = deprecateShadowColor.isEligible( 'tab%s' )( attributes ) diff --git a/src/block/table-of-contents/deprecated.js b/src/block/table-of-contents/deprecated.js index b1e3ebcdd5..a010d66a0f 100644 --- a/src/block/table-of-contents/deprecated.js +++ b/src/block/table-of-contents/deprecated.js @@ -36,6 +36,31 @@ addFilter( 'stackable.table-of-contents.save.tableOfContentsClasses', 'stackable } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( 'title%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( 'title%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize and blockHeight attributes: attributes( '3.15.3' ), @@ -66,6 +91,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.titleFontSize === 'string' || + typeof attributes?.titleFontSizeTablet === 'string' || + typeof attributes?.titleFontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/tabs/deprecated.js b/src/block/tabs/deprecated.js index 5935646d95..d7510e5a40 100644 --- a/src/block/tabs/deprecated.js +++ b/src/block/tabs/deprecated.js @@ -8,6 +8,39 @@ import { attributes } from './schema' import { withVersion } from '~stackable/higher-order' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + const hasContainerOpacity = deprecateContainerBackgroundColorOpacity.isEligible( attributes ) + if ( hasContainerOpacity ) { + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + } + + const hasBlockOpacity = deprecateBlockBackgroundColorOpacity.isEligible( attributes ) + if ( hasBlockOpacity ) { + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + } + + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return { + ...newAttributes, + equalTabHeight: true, + } + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -43,6 +76,13 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/team-member/deprecated.js b/src/block/team-member/deprecated.js index 5b53977354..b474271c95 100644 --- a/src/block/team-member/deprecated.js +++ b/src/block/team-member/deprecated.js @@ -36,6 +36,77 @@ addFilter( 'stackable.team-member.save.innerClassNames', 'stackable/3.8.0', ( ou } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: ( attributes, innerBlocks ) => { + const isNotV4 = attributes.version < 2 || typeof attributes.version === 'undefined' + + let newAttributes = { + ...attributes, + } + + if ( isNotV4 ) { + newAttributes = { + ...newAttributes, + version: 2, + } + + // Update the vertical align into flexbox + const hasOldVerticalAlign = !! attributes.containerVerticalAlign // Column only, this was changed to flexbox + + if ( hasOldVerticalAlign ) { + newAttributes = { + ...newAttributes, + containerVerticalAlign: '', + innerBlockAlign: attributes.containerVerticalAlign, + } + } + + // If the inner blocks are horizontal, adjust to accomodate the new + // column gap, it will modify blocks because people used block + // margins before instead of a proper column gap. + if ( attributes.innerBlockOrientation === 'horizontal' ) { + innerBlocks.forEach( ( block, index ) => { + if ( index ) { + if ( ! block.attributes.blockMargin ) { + block.attributes.blockMargin = { + top: '', + right: '', + bottom: '', + left: '', + } + } + if ( block.attributes.blockMargin.left === '' ) { + block.attributes.blockMargin.left = 24 + } + } + } ) + + newAttributes = { + ...newAttributes, + innerBlockColumnGap: 0, + } + } + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateInnerBlockRowGapAndContainerHeight.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -112,6 +183,20 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.innerBlockRowGap === 'string' || + typeof attributes?.innerBlockRowGapTablet === 'string' || + typeof attributes?.innerBlockRowGapMobile === 'string' || + typeof attributes?.containerHeight === 'string' || + typeof attributes?.containerHeightTablet === 'string' || + typeof attributes?.containerHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/testimonial/deprecated.js b/src/block/testimonial/deprecated.js index c2223e61da..03c2ef618a 100644 --- a/src/block/testimonial/deprecated.js +++ b/src/block/testimonial/deprecated.js @@ -36,6 +36,77 @@ addFilter( 'stackable.testimonial.save.innerClassNames', 'stackable/3.8.0', ( ou } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: ( attributes, innerBlocks ) => { + const isNotV4 = attributes.version < 2 || typeof attributes.version === 'undefined' + + let newAttributes = { + ...attributes, + } + + if ( isNotV4 ) { + newAttributes = { + ...newAttributes, + version: 2, + } + + // Update the vertical align into flexbox + const hasOldVerticalAlign = !! attributes.containerVerticalAlign // Column only, this was changed to flexbox + + if ( hasOldVerticalAlign ) { + newAttributes = { + ...newAttributes, + containerVerticalAlign: '', + innerBlockAlign: attributes.containerVerticalAlign, + } + } + + // If the inner blocks are horizontal, adjust to accomodate the new + // column gap, it will modify blocks because people used block + // margins before instead of a proper column gap. + if ( attributes.innerBlockOrientation === 'horizontal' ) { + innerBlocks.forEach( ( block, index ) => { + if ( index ) { + if ( ! block.attributes.blockMargin ) { + block.attributes.blockMargin = { + top: '', + right: '', + bottom: '', + left: '', + } + } + if ( block.attributes.blockMargin.left === '' ) { + block.attributes.blockMargin.left = 24 + } + } + } ) + + newAttributes = { + ...newAttributes, + innerBlockColumnGap: 0, + } + } + } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + newAttributes = deprecateInnerBlockRowGapAndContainerHeight.migrate( '%s' )( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -112,6 +183,20 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' || + typeof attributes?.innerBlockRowGap === 'string' || + typeof attributes?.innerBlockRowGapTablet === 'string' || + typeof attributes?.innerBlockRowGapMobile === 'string' || + typeof attributes?.containerHeight === 'string' || + typeof attributes?.containerHeightTablet === 'string' || + typeof attributes?.containerHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) diff --git a/src/block/text/deprecated.js b/src/block/text/deprecated.js index 09db68cd5f..e4ae508e7b 100644 --- a/src/block/text/deprecated.js +++ b/src/block/text/deprecated.js @@ -9,6 +9,32 @@ import { } from '~stackable/block-components' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTextShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyShadowColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize attributes: attributes( '3.15.3' ), @@ -38,6 +64,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) diff --git a/src/block/timeline/deprecated.js b/src/block/timeline/deprecated.js index c4979c84ac..c840940f3e 100644 --- a/src/block/timeline/deprecated.js +++ b/src/block/timeline/deprecated.js @@ -9,6 +9,32 @@ import { attributes } from './schema' import { withVersion } from '~stackable/higher-order' const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) + + return hasBlockShadow || hasContainerShadow || hasTextShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateTypographyGradientColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateTypographyShadowColor.migrate( '%s' )( newAttributes ) + newAttributes = deprecateTypographyFontSize.migrate( '%s' )( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for fontSize attributes: attributes( '3.15.3' ), @@ -38,6 +64,16 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( typeof attributes?.fontSize === 'string' || + typeof attributes?.fontSizeTablet === 'string' || + typeof attributes?.fontSizeMobile === 'string' || + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) const hasTextShadow = deprecateTypographyShadowColor.isEligible( '%s' )( attributes ) diff --git a/src/block/video-popup/deprecated.js b/src/block/video-popup/deprecated.js index 471924dfde..6150abb525 100644 --- a/src/block/video-popup/deprecated.js +++ b/src/block/video-popup/deprecated.js @@ -28,6 +28,28 @@ addFilter( 'stackable.video-popup.save.div.content', 'stackable/3.12.14', ( outp } ) const deprecated = [ + { + // Handle the migration of shadow attributes with the change of type in 3.15.3 + attributes: attributes( '3.16.2' ), + save: withVersion( '3.16.2' )( Save ), + isEligible: attributes => { + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) + const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes ) + + return hasBlockShadow || hasContainerShadow + }, + migrate: attributes => { + let newAttributes = { ...attributes } + + newAttributes = deprecateContainerBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockBackgroundColorOpacity.migrate( newAttributes ) + newAttributes = deprecateBlockShadowColor.migrate( newAttributes ) + newAttributes = deprecateContainerShadowColor.migrate( newAttributes ) + newAttributes = deprecateBlockHeight.migrate( newAttributes ) + + return newAttributes + }, + }, { // Support the change of type for block height attributes: attributes( '3.15.3' ), @@ -52,6 +74,14 @@ const deprecated = [ attributes: attributes( '3.12.11' ), save: withVersion( '3.12.11' )( Save ), isEligible: attributes => { + if ( ( + typeof attributes?.blockHeight === 'string' || + typeof attributes?.blockHeightTablet === 'string' || + typeof attributes?.blockHeightMobile === 'string' ) + ) { + return false + } + const hasBlockShadow = deprecateBlockShadowColor.isEligible( attributes ) const hasContainerShadow = deprecateContainerShadowColor.isEligible( attributes )