@wordpress/block-library 8.34.0 → 9.0.0

package/build-module/button/deprecated.js

@@ -1,8 +1,7 @@
-import { createElement } from "react";
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -14,6 +13,7 @@ import { compose } from '@wordpress/compose';
  * Internal dependencies
  */
 import migrateFontFamily from '../utils/migrate-font-family';
+import { jsx as _jsx } from "react/jsx-runtime";
 const migrateBorderRadius = attributes => {
   const {
     borderRadius,
@@ -48,7 +48,7 @@ function migrateAlign(attributes) {
   } = attributes;
   return {
     ...otherAttributes,
-    className: classnames(otherAttributes.className, `align${attributes.align}`)
+    className: clsx(otherAttributes.className, `align${attributes.align}`)
   };
 }
 const migrateCustomColorsAndGradients = attributes => {
@@ -212,7 +212,7 @@ const v11 = {
     const borderProps = getBorderClassesAndStyles(attributes);
     const colorProps = getColorClassesAndStyles(attributes);
     const spacingProps = getSpacingClassesAndStyles(attributes);
-    const buttonClasses = classnames('wp-block-button__link', colorProps.className, borderProps.className, {
+    const buttonClasses = clsx('wp-block-button__link', colorProps.className, borderProps.className, {
       // For backwards compatibility add style that isn't provided via
       // block support.
       'no-border-radius': style?.border?.radius === 0
@@ -227,24 +227,25 @@ const v11 = {
     // if it had already been assigned, for the sake of backward-compatibility.
     // A title will no longer be assigned for new or updated button block links.
 
-    const wrapperClasses = classnames(className, {
+    const wrapperClasses = clsx(className, {
       [`has-custom-width wp-block-button__width-${width}`]: width,
       [`has-custom-font-size`]: fontSize || style?.typography?.fontSize
     });
-    return createElement("div", {
+    return /*#__PURE__*/_jsx("div", {
       ...useBlockProps.save({
         className: wrapperClasses
+      }),
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        className: buttonClasses,
+        href: url,
+        title: title,
+        style: buttonStyle,
+        value: text,
+        target: linkTarget,
+        rel: rel
       })
-    }, createElement(RichText.Content, {
-      tagName: "a",
-      className: buttonClasses,
-      href: url,
-      title: title,
-      style: buttonStyle,
-      value: text,
-      target: linkTarget,
-      rel: rel
-    }));
+    });
   }
 };
 const v10 = {
@@ -340,7 +341,7 @@ const v10 = {
     const borderProps = getBorderClassesAndStyles(attributes);
     const colorProps = getColorClassesAndStyles(attributes);
     const spacingProps = getSpacingClassesAndStyles(attributes);
-    const buttonClasses = classnames('wp-block-button__link', colorProps.className, borderProps.className, {
+    const buttonClasses = clsx('wp-block-button__link', colorProps.className, borderProps.className, {
       // For backwards compatibility add style that isn't provided via
       // block support.
       'no-border-radius': style?.border?.radius === 0
@@ -355,24 +356,25 @@ const v10 = {
     // if it had already been assigned, for the sake of backward-compatibility.
     // A title will no longer be assigned for new or updated button block links.
 
-    const wrapperClasses = classnames(className, {
+    const wrapperClasses = clsx(className, {
       [`has-custom-width wp-block-button__width-${width}`]: width,
       [`has-custom-font-size`]: fontSize || style?.typography?.fontSize
     });
-    return createElement("div", {
+    return /*#__PURE__*/_jsx("div", {
       ...useBlockProps.save({
         className: wrapperClasses
+      }),
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        className: buttonClasses,
+        href: url,
+        title: title,
+        style: buttonStyle,
+        value: text,
+        target: linkTarget,
+        rel: rel
       })
-    }, createElement(RichText.Content, {
-      tagName: "a",
-      className: buttonClasses,
-      href: url,
-      title: title,
-      style: buttonStyle,
-      value: text,
-      target: linkTarget,
-      rel: rel
-    }));
+    });
   },
   migrate: migrateFontFamily,
   isEligible({
@@ -451,7 +453,7 @@ const deprecated = [v11, v10, {
     }
     const borderRadius = style?.border?.radius;
     const colorProps = getColorClassesAndStyles(attributes);
-    const buttonClasses = classnames('wp-block-button__link', colorProps.className, {
+    const buttonClasses = clsx('wp-block-button__link', colorProps.className, {
       'no-border-radius': style?.border?.radius === 0
     });
     const buttonStyle = {
@@ -463,24 +465,25 @@ const deprecated = [v11, v10, {
     // if it had already been assigned, for the sake of backward-compatibility.
     // A title will no longer be assigned for new or updated button block links.
 
-    const wrapperClasses = classnames(className, {
+    const wrapperClasses = clsx(className, {
       [`has-custom-width wp-block-button__width-${width}`]: width,
       [`has-custom-font-size`]: fontSize || style?.typography?.fontSize
     });
-    return createElement("div", {
+    return /*#__PURE__*/_jsx("div", {
       ...useBlockProps.save({
         className: wrapperClasses
+      }),
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        className: buttonClasses,
+        href: url,
+        title: title,
+        style: buttonStyle,
+        value: text,
+        target: linkTarget,
+        rel: rel
       })
-    }, createElement(RichText.Content, {
-      tagName: "a",
-      className: buttonClasses,
-      href: url,
-      title: title,
-      style: buttonStyle,
-      value: text,
-      target: linkTarget,
-      rel: rel
-    }));
+    });
   },
   migrate: compose(migrateFontFamily, migrateBorderRadius)
 }, {
@@ -544,7 +547,7 @@ const deprecated = [v11, v10, {
       width
     } = attributes;
     const colorProps = getColorClassesAndStyles(attributes);
-    const buttonClasses = classnames('wp-block-button__link', colorProps.className, {
+    const buttonClasses = clsx('wp-block-button__link', colorProps.className, {
       'no-border-radius': borderRadius === 0
     });
     const buttonStyle = {
@@ -556,23 +559,24 @@ const deprecated = [v11, v10, {
     // if it had already been assigned, for the sake of backward-compatibility.
     // A title will no longer be assigned for new or updated button block links.
 
-    const wrapperClasses = classnames(className, {
+    const wrapperClasses = clsx(className, {
       [`has-custom-width wp-block-button__width-${width}`]: width
     });
-    return createElement("div", {
+    return /*#__PURE__*/_jsx("div", {
       ...useBlockProps.save({
         className: wrapperClasses
+      }),
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        className: buttonClasses,
+        href: url,
+        title: title,
+        style: buttonStyle,
+        value: text,
+        target: linkTarget,
+        rel: rel
       })
-    }, createElement(RichText.Content, {
-      tagName: "a",
-      className: buttonClasses,
-      href: url,
-      title: title,
-      style: buttonStyle,
-      value: text,
-      target: linkTarget,
-      rel: rel
-    }));
+    });
   },
   migrate: compose(migrateFontFamily, migrateBorderRadius)
 }, {
@@ -636,7 +640,7 @@ const deprecated = [v11, v10, {
       width
     } = attributes;
     const colorProps = getColorClassesAndStyles(attributes);
-    const buttonClasses = classnames('wp-block-button__link', colorProps.className, {
+    const buttonClasses = clsx('wp-block-button__link', colorProps.className, {
       'no-border-radius': borderRadius === 0
     });
     const buttonStyle = {
@@ -648,23 +652,24 @@ const deprecated = [v11, v10, {
     // if it had already been assigned, for the sake of backward-compatibility.
     // A title will no longer be assigned for new or updated button block links.
 
-    const wrapperClasses = classnames(className, {
+    const wrapperClasses = clsx(className, {
       [`has-custom-width wp-block-button__width-${width}`]: width
     });
-    return createElement("div", {
+    return /*#__PURE__*/_jsx("div", {
       ...useBlockProps.save({
         className: wrapperClasses
+      }),
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        className: buttonClasses,
+        href: url,
+        title: title,
+        style: buttonStyle,
+        value: text,
+        target: linkTarget,
+        rel: rel
       })
-    }, createElement(RichText.Content, {
-      tagName: "a",
-      className: buttonClasses,
-      href: url,
-      title: title,
-      style: buttonStyle,
-      value: text,
-      target: linkTarget,
-      rel: rel
-    }));
+    });
   },
   migrate: compose(migrateFontFamily, migrateBorderRadius)
 }, {
@@ -719,13 +724,13 @@ const deprecated = [v11, v10, {
       title,
       url
     } = attributes;
-    const buttonClasses = classnames('wp-block-button__link', {
+    const buttonClasses = clsx('wp-block-button__link', {
       'no-border-radius': borderRadius === 0
     });
     const buttonStyle = {
       borderRadius: borderRadius ? borderRadius + 'px' : undefined
     };
-    return createElement(RichText.Content, {
+    return /*#__PURE__*/_jsx(RichText.Content, {
       tagName: "a",
       className: buttonClasses,
       href: url,
@@ -803,7 +808,7 @@ const deprecated = [v11, v10, {
     const textClass = getColorClassName('color', textColor);
     const backgroundClass = !customGradient && getColorClassName('background-color', backgroundColor);
     const gradientClass = __experimentalGetGradientClass(gradient);
-    const buttonClasses = classnames('wp-block-button__link', {
+    const buttonClasses = clsx('wp-block-button__link', {
       'has-text-color': textColor || customTextColor,
       [textClass]: textClass,
       'has-background': backgroundColor || customBackgroundColor || customGradient || gradient,
@@ -822,16 +827,18 @@ const deprecated = [v11, v10, {
     // if it had already been assigned, for the sake of backward-compatibility.
     // A title will no longer be assigned for new or updated button block links.
 
-    return createElement("div", null, createElement(RichText.Content, {
-      tagName: "a",
-      className: buttonClasses,
-      href: url,
-      title: title,
-      style: buttonStyle,
-      value: text,
-      target: linkTarget,
-      rel: rel
-    }));
+    return /*#__PURE__*/_jsx("div", {
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        className: buttonClasses,
+        href: url,
+        title: title,
+        style: buttonStyle,
+        value: text,
+        target: linkTarget,
+        rel: rel
+      })
+    });
   }
 }, {
   attributes: {
@@ -898,7 +905,7 @@ const deprecated = [v11, v10, {
     } = attributes;
     const textClass = getColorClassName('color', textColor);
     const backgroundClass = getColorClassName('background-color', backgroundColor);
-    const buttonClasses = classnames('wp-block-button__link', {
+    const buttonClasses = clsx('wp-block-button__link', {
       'has-text-color': textColor || customTextColor,
       [textClass]: textClass,
       'has-background': backgroundColor || customBackgroundColor,
@@ -908,16 +915,18 @@ const deprecated = [v11, v10, {
       backgroundColor: backgroundClass ? undefined : customBackgroundColor,
       color: textClass ? undefined : customTextColor
     };
-    return createElement("div", null, createElement(RichText.Content, {
-      tagName: "a",
-      className: buttonClasses,
-      href: url,
-      title: title,
-      style: buttonStyle,
-      value: text,
-      target: linkTarget,
-      rel: rel
-    }));
+    return /*#__PURE__*/_jsx("div", {
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        className: buttonClasses,
+        href: url,
+        title: title,
+        style: buttonStyle,
+        value: text,
+        target: linkTarget,
+        rel: rel
+      })
+    });
   }
 }, {
   attributes: {
@@ -954,7 +963,7 @@ const deprecated = [v11, v10, {
     } = attributes;
     const textClass = getColorClassName('color', textColor);
     const backgroundClass = getColorClassName('background-color', backgroundColor);
-    const buttonClasses = classnames('wp-block-button__link', {
+    const buttonClasses = clsx('wp-block-button__link', {
       'has-text-color': textColor || customTextColor,
       [textClass]: textClass,
       'has-background': backgroundColor || customBackgroundColor,
@@ -964,14 +973,16 @@ const deprecated = [v11, v10, {
       backgroundColor: backgroundClass ? undefined : customBackgroundColor,
       color: textClass ? undefined : customTextColor
     };
-    return createElement("div", null, createElement(RichText.Content, {
-      tagName: "a",
-      className: buttonClasses,
-      href: url,
-      title: title,
-      style: buttonStyle,
-      value: text
-    }));
+    return /*#__PURE__*/_jsx("div", {
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        className: buttonClasses,
+        href: url,
+        title: title,
+        style: buttonStyle,
+        value: text
+      })
+    });
   }
 }, {
   attributes: {
@@ -1003,16 +1014,17 @@ const deprecated = [v11, v10, {
       color: textColor
     };
     const linkClass = 'wp-block-button__link';
-    return createElement("div", {
-      className: `align${align}`
-    }, createElement(RichText.Content, {
-      tagName: "a",
-      className: linkClass,
-      href: url,
-      title: title,
-      style: buttonStyle,
-      value: text
-    }));
+    return /*#__PURE__*/_jsx("div", {
+      className: `align${align}`,
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        className: linkClass,
+        href: url,
+        title: title,
+        style: buttonStyle,
+        value: text
+      })
+    });
   },
   migrate: oldColorsMigration
 }, {
@@ -1040,20 +1052,21 @@ const deprecated = [v11, v10, {
       color,
       textColor
     } = attributes;
-    return createElement("div", {
+    return /*#__PURE__*/_jsx("div", {
       className: `align${align}`,
       style: {
         backgroundColor: color
-      }
-    }, createElement(RichText.Content, {
-      tagName: "a",
-      href: url,
-      title: title,
-      style: {
-        color: textColor
       },
-      value: text
-    }));
+      children: /*#__PURE__*/_jsx(RichText.Content, {
+        tagName: "a",
+        href: url,
+        title: title,
+        style: {
+          color: textColor
+        },
+        value: text
+      })
+    });
   },
   migrate: oldColorsMigration
 }];