@cloudflare/component-button 3.1.15 → 3.1.18

package/CHANGELOG.md

@@ -3,6 +3,30 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.1.18](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-button@3.1.17...@cloudflare/component-button@3.1.18) (2022-05-04)
+
+**Note:** Version bump only for package @cloudflare/component-button
+
+
+
+
+
+## [3.1.17](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-button@3.1.16...@cloudflare/component-button@3.1.17) (2022-05-04)
+
+**Note:** Version bump only for package @cloudflare/component-button
+
+
+
+
+
+## [3.1.16](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-button@3.1.15...@cloudflare/component-button@3.1.16) (2022-05-03)
+
+**Note:** Version bump only for package @cloudflare/component-button
+
+
+
+
+
 ## [3.1.15](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-button@3.1.14...@cloudflare/component-button@3.1.15) (2022-04-29)
 
 **Note:** Version bump only for package @cloudflare/component-button

package/dist/Button.d.ts

@@ -106,6 +106,7 @@ declare type Props = {
     iconType?: IconType;
     iconLabel?: string;
     iconSize?: number;
+    iconPosition?: 'left' | 'right';
     ariaLabel?: string;
     stretch?: boolean;
     noWrapText?: boolean;
@@ -132,6 +133,7 @@ declare const _default: React.ComponentType<{
     iconType?: IconType | undefined;
     iconLabel?: string | undefined;
     iconSize?: number | undefined;
+    iconPosition?: "right" | "left" | undefined;
     noWrapText?: boolean | undefined;
     p?: import("csstype").PaddingProperty<string | number> | [import("csstype").PaddingProperty<string | number> | undefined, import("csstype").PaddingProperty<string | number> | undefined] | [import("csstype").PaddingProperty<string | number> | undefined, import("csstype").PaddingProperty<string | number> | undefined, import("csstype").PaddingProperty<string | number> | undefined] | undefined;
     color?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;

package/es/Button.js

@@ -250,6 +250,8 @@ const Button = /*#__PURE__*/React.forwardRef((props, ref) => {
         iconType = props.iconType,
         iconLabel = props.iconLabel,
         iconSize = props.iconSize,
+        _props$iconPosition = props.iconPosition,
+        iconPosition = _props$iconPosition === void 0 ? 'left' : _props$iconPosition,
         form = props.form,
         tabIndex = props.tabIndex,
         ariaLabel = props.ariaLabel;
@@ -266,11 +268,17 @@ const Button = /*#__PURE__*/React.forwardRef((props, ref) => {
     tabIndex: tabIndex,
     ref: ref,
     "aria-label": ariaLabel
-  }), iconType && /*#__PURE__*/React.createElement(Icon, {
+  }), iconType && iconPosition === 'left' && /*#__PURE__*/React.createElement(Icon, {
     size: iconSize,
     type: iconType,
-    label: iconLabel || false
-  }), children);
+    label: iconLabel || false,
+    mr: 1
+  }), children, iconType && iconPosition === 'right' && /*#__PURE__*/React.createElement(Icon, {
+    size: iconSize,
+    type: iconType,
+    label: iconLabel || false,
+    ml: 1
+  }));
 });
 Button.propTypes = {
   onClick: PropTypes.func,

package/lib/Button.js

@@ -269,6 +269,8 @@ var Button = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       iconType = props.iconType,
       iconLabel = props.iconLabel,
       iconSize = props.iconSize,
+      _props$iconPosition = props.iconPosition,
+      iconPosition = _props$iconPosition === void 0 ? 'left' : _props$iconPosition,
       form = props.form,
       tabIndex = props.tabIndex,
       ariaLabel = props.ariaLabel;
@@ -287,11 +289,17 @@ var Button = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     tabIndex: tabIndex,
     ref: ref,
     "aria-label": ariaLabel
-  }), iconType && /*#__PURE__*/_react.default.createElement(_componentIcon.Icon, {
+  }), iconType && iconPosition === 'left' && /*#__PURE__*/_react.default.createElement(_componentIcon.Icon, {
     size: iconSize,
     type: iconType,
-    label: iconLabel || false
-  }), children);
+    label: iconLabel || false,
+    mr: 1
+  }), children, iconType && iconPosition === 'right' && /*#__PURE__*/_react.default.createElement(_componentIcon.Icon, {
+    size: iconSize,
+    type: iconType,
+    label: iconLabel || false,
+    ml: 1
+  }));
 });
 
 Button.propTypes = {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudflare/component-button",
   "description": "Cloudflare Button Component",
-  "version": "3.1.15",
+  "version": "3.1.18",
   "main": "lib/index.js",
   "module": "es/index.js",
   "author": "James Kyle <jkyle@cloudflare.com>",
@@ -12,9 +12,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@cloudflare/component-icon": "^7.1.6",
-    "@cloudflare/style-const": "^5.2.28",
-    "@cloudflare/style-container": "^7.8.11",
+    "@cloudflare/component-icon": "^7.1.9",
+    "@cloudflare/style-const": "^5.2.31",
+    "@cloudflare/style-container": "^7.8.14",
     "polished": "^4.1.4",
     "prop-types": "^15.6.0"
   },
@@ -32,5 +32,5 @@
     "test-coverage": "stratus test --coverage",
     "test-watch": "stratus test --watch"
   },
-  "gitHead": "76e30988cdbf9a7948fdf91dc6bab7b4c44345e2"
+  "gitHead": "fb870b4bc549113f4fd47560e6cc92f9fdff1c29"
 }