MC-3864: Fix alpha value in background colour

- Remove legacy preferred color format converters

Author: davemacaulay

app/code/Magento/PageBuilder/docs/master-format.md

@@ -82,8 +82,7 @@ Contained:
 Attributes
 1. data-enable-parallax [1, 0]
 2. data-parallax-speed [0-1]
-3. data-background-color-format [hex, rgb, hsl, hsv, name, none]
-4. class
+3. class
 
 Full Width:
 ```
@@ -105,8 +104,7 @@ Attributes
 3. data-appearance [full-width, full-bleed]
 4. data-enable-parallax [1, 0]
 5. data-parallax-speed [0-1]
-6. data-background-color-format [hex, rgb, hsl, hsv, name, none]
-7. class
+6. class
 
 Inline styles
 1. background-color

app/code/Magento/PageBuilder/view/adminhtml/web/js/mass-converter/preferred-color-format.js

@@ -65,13 +65,6 @@
                         <static_style source="flex_direction" value="column"/>
                     </element>
                 </elements>
-                <converters>
-                    <converter name="preferred_color_format" component="Magento_PageBuilder/js/mass-converter/preferred-color-format">
-                        <config>
-                            <item name="background_color_format" value="background_color_format"/>
-                        </config>
-                    </converter>
-                </converters>
             </appearance>
             <appearance name="align-top"
                         preview_template="Magento_PageBuilder/content-type/column/full-height/preview"
@@ -110,13 +103,6 @@
                         <static_style source="flex_direction" value="column"/>
                     </element>
                 </elements>
-                <converters>
-                    <converter name="preferred_color_format" component="Magento_PageBuilder/js/mass-converter/preferred-color-format">
-                        <config>
-                            <item name="background_color_format" value="background_color_format"/>
-                        </config>
-                    </converter>
-                </converters>
             </appearance>
             <appearance name="align-center"
                         preview_template="Magento_PageBuilder/content-type/column/full-height/preview"
@@ -155,13 +141,6 @@
                         <static_style source="flex_direction" value="column"/>
                     </element>
                 </elements>
-                <converters>
-                    <converter name="preferred_color_format" component="Magento_PageBuilder/js/mass-converter/preferred-color-format">
-                        <config>
-                            <item name="background_color_format" value="background_color_format"/>
-                        </config>
-                    </converter>
-                </converters>
             </appearance>
             <appearance name="align-bottom"
                         preview_template="Magento_PageBuilder/content-type/column/full-height/preview"
@@ -200,13 +179,6 @@
                         <static_style source="flex_direction" value="column"/>
                     </element>
                 </elements>
-                <converters>
-                    <converter name="preferred_color_format" component="Magento_PageBuilder/js/mass-converter/preferred-color-format">
-                        <config>
-                            <item name="background_color_format" value="background_color_format"/>
-                        </config>
-                    </converter>
-                </converters>
             </appearance>
         </appearances>
     </type>

app/code/Magento/PageBuilder/view/adminhtml/web/ts/js/mass-converter/preferred-color-format.ts

@@ -52,7 +52,6 @@
                             <style name="padding" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/paddings" converter="Magento_PageBuilder/js/converter/style/paddings" preview_converter="Magento_PageBuilder/js/content-type/row/converter/style/paddings"/>
                             <attribute name="enable_parallax" source="data-enable-parallax"/>
                             <attribute name="parallax_speed" source="data-parallax-speed"/>
-                            <attribute name="background_color_format" source="data-background-color-format" persistence_mode="write"/>
                             <css name="css_classes"/>
                         </element>
                         <element name="container">
@@ -61,13 +60,6 @@
                             <static_style source="flex_direction" value="column"/>
                         </element>
                     </elements>
-                    <converters>
-                        <converter name="preferred_color_format" component="Magento_PageBuilder/js/mass-converter/preferred-color-format">
-                            <config>
-                                <item name="background_color_format" value="background_color_format"/>
-                            </config>
-                        </converter>
-                    </converters>
             </appearance>
             <appearance name="full-width"
                         preview_template="Magento_PageBuilder/content-type/row/full-width/preview"
@@ -95,7 +87,6 @@
                         <attribute name="appearance" source="data-appearance"/>
                         <attribute name="enable_parallax" source="data-enable-parallax"/>
                         <attribute name="parallax_speed" source="data-parallax-speed"/>
-                        <attribute name="background_color_format" source="data-background-color-format" persistence_mode="write"/>
                         <css name="css_classes"/>
                     </element>
                     <element name="inner" />
@@ -105,41 +96,33 @@
                         <static_style source="flex_direction" value="column"/>
                     </element>
                 </elements>
-                <converters>
-                    <converter name="preferred_color_format" component="Magento_PageBuilder/js/mass-converter/preferred-color-format">
-                        <config>
-                            <item name="background_color_format" value="background_color_format"/>
-                        </config>
-                    </converter>
-                </converters>
             </appearance>
             <appearance name="full-bleed"
                         preview_template="Magento_PageBuilder/content-type/row/full-bleed/preview"
                         render_template="Magento_PageBuilder/content-type/row/full-bleed/master"
                         reader="Magento_PageBuilder/js/master-format/read/configurable">
                 <elements>
                     <element name="main">
-                            <style name="background_color" source="background_color"/>
-                            <style name="background_image" source="background_image" converter="Magento_PageBuilder/js/converter/style/background-image" preview_converter="Magento_PageBuilder/js/converter/style/preview/background-image"/>
-                            <style name="background_position" source="background_position"/>
-                            <style name="background_size" source="background_size"/>
-                            <style name="background_repeat" source="background_repeat"/>
-                            <style name="background_attachment" source="background_attachment"/>
-                            <style name="text_align" source="text_align"/>
-                            <style name="border" source="border_style" converter="Magento_PageBuilder/js/converter/style/border-style"/>
-                            <style name="border_color" source="border_color" converter="Magento_PageBuilder/js/converter/style/color"/>
-                            <style name="border_width" source="border_width" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
-                            <style name="border_radius" source="border_radius" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
-                            <style name="justify_content" source="justify_content" persistence_mode="read"/>
-                            <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
-                            <style name="display" source="display" converter="Magento_PageBuilder/js/converter/style/display" preview_converter="Magento_PageBuilder/js/converter/style/preview/display"/>
-                            <style name="margins" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/margins" converter="Magento_PageBuilder/js/converter/style/margins" preview_converter="Magento_PageBuilder/js/content-type/row/converter/style/margins"/>
-                            <style name="padding" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/paddings" converter="Magento_PageBuilder/js/converter/style/paddings" preview_converter="Magento_PageBuilder/js/content-type/row/converter/style/paddings"/>
-                            <attribute name="name" source="data-role"/>
-                            <attribute name="appearance" source="data-appearance"/>
-                            <attribute name="enable_parallax" source="data-enable-parallax"/>
-                            <attribute name="parallax_speed" source="data-parallax-speed"/>
-                            <attribute name="background_color_format" source="data-background-color-format" persistence_mode="write"/>
+                        <style name="background_color" source="background_color"/>
+                        <style name="background_image" source="background_image" converter="Magento_PageBuilder/js/converter/style/background-image" preview_converter="Magento_PageBuilder/js/converter/style/preview/background-image"/>
+                        <style name="background_position" source="background_position"/>
+                        <style name="background_size" source="background_size"/>
+                        <style name="background_repeat" source="background_repeat"/>
+                        <style name="background_attachment" source="background_attachment"/>
+                        <style name="text_align" source="text_align"/>
+                        <style name="border" source="border_style" converter="Magento_PageBuilder/js/converter/style/border-style"/>
+                        <style name="border_color" source="border_color" converter="Magento_PageBuilder/js/converter/style/color"/>
+                        <style name="border_width" source="border_width" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
+                        <style name="border_radius" source="border_radius" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
+                        <style name="justify_content" source="justify_content" persistence_mode="read"/>
+                        <style name="min_height" source="min_height" converter="Magento_PageBuilder/js/converter/style/remove-px"/>
+                        <style name="display" source="display" converter="Magento_PageBuilder/js/converter/style/display" preview_converter="Magento_PageBuilder/js/converter/style/preview/display"/>
+                        <style name="margins" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/margins" converter="Magento_PageBuilder/js/converter/style/margins" preview_converter="Magento_PageBuilder/js/content-type/row/converter/style/margins"/>
+                        <style name="padding" storage_key="margins_and_padding" reader="Magento_PageBuilder/js/property/paddings" converter="Magento_PageBuilder/js/converter/style/paddings" preview_converter="Magento_PageBuilder/js/content-type/row/converter/style/paddings"/>
+                        <attribute name="name" source="data-role"/>
+                        <attribute name="appearance" source="data-appearance"/>
+                        <attribute name="enable_parallax" source="data-enable-parallax"/>
+                        <attribute name="parallax_speed" source="data-parallax-speed"/>
                         <css name="css_classes"/>
                     </element>
                     <element name="container">
@@ -148,13 +131,6 @@
                         <static_style source="flex_direction" value="column"/>
                     </element>
                 </elements>
-                <converters>
-                    <converter name="preferred_color_format" component="Magento_PageBuilder/js/mass-converter/preferred-color-format">
-                        <config>
-                            <item name="background_color_format" value="background_color_format"/>
-                        </config>
-                    </converter>
-                </converters>
             </appearance>
         </appearances>
     </type>