@cloudflare/component-button 3.0.5 → 3.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/CHANGELOG.md +33 -0
  2. package/dist/Button.d.ts +3 -0
  3. package/dist/ButtonGroup.d.ts +3 -0
  4. package/dist/IconTextButton.d.ts +1 -0
  5. package/dist/TextButton.d.ts +3 -0
  6. package/dist/UnstyledButton.d.ts +3 -0
  7. package/es/IconTextButton.js +7 -2
  8. package/lib/IconTextButton.js +8 -2
  9. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -3,6 +3,39 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [3.1.2](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-button@3.1.1...@cloudflare/component-button@3.1.2) (2022-03-28)
7
+
8
+ **Note:** Version bump only for package @cloudflare/component-button
9
+
10
+
11
+
12
+
13
+
14
+ ## [3.1.1](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-button@3.1.0...@cloudflare/component-button@3.1.1) (2022-03-24)
15
+
16
+ **Note:** Version bump only for package @cloudflare/component-button
17
+
18
+
19
+
20
+
21
+
22
+ # [3.1.0](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-button@3.0.5...@cloudflare/component-button@3.1.0) (2022-03-24)
23
+
24
+
25
+ ### Bug Fixes
26
+
27
+ * **stratus:** A11Y-106 conflicting files ([19209dc](http://stash.cfops.it:7999/fe/stratus/commits/19209dc))
28
+ * **stratus:** A11Y-106 merge conflicting file ([940a252](http://stash.cfops.it:7999/fe/stratus/commits/940a252))
29
+
30
+
31
+ ### Features
32
+
33
+ * **stratus:** UI-5116 added iconPosition to IconTextButton ([99fea39](http://stash.cfops.it:7999/fe/stratus/commits/99fea39))
34
+
35
+
36
+
37
+
38
+
6
39
  ## [3.0.5](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-button@3.0.4...@cloudflare/component-button@3.0.5) (2022-03-23)
7
40
 
8
41
  **Note:** Version bump only for package @cloudflare/component-button
package/dist/Button.d.ts CHANGED
@@ -177,6 +177,9 @@ declare const _default: React.ComponentType<{
177
177
  borderTopStyle?: import("csstype").BorderTopStyleProperty | [import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined] | [import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined] | undefined;
178
178
  borderTopWidth?: import("csstype").BorderTopWidthProperty<string | number> | [import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined] | [import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined] | undefined;
179
179
  boxSizing?: import("csstype").BoxSizingProperty | [import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined] | [import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined] | undefined;
180
+ flexBasis?: import("csstype").FlexBasisProperty<string | number> | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | undefined;
181
+ flexDirection?: import("csstype").FlexDirectionProperty | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | undefined;
182
+ flexGrow?: import("csstype").GlobalsNumber | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | undefined;
180
183
  justifyContent?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;
181
184
  marginBottom?: import("csstype").MarginBottomProperty<string | number> | [import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined] | [import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined] | undefined;
182
185
  paddingBottom?: import("csstype").PaddingBottomProperty<string | number> | [import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined] | [import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined] | undefined;
package/dist/ButtonGroup.d.ts CHANGED
@@ -49,6 +49,9 @@ declare const _default: React.ComponentType<{
49
49
  borderTopStyle?: import("csstype").BorderTopStyleProperty | [import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined] | [import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined] | undefined;
50
50
  borderTopWidth?: import("csstype").BorderTopWidthProperty<string | number> | [import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined] | [import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined] | undefined;
51
51
  boxSizing?: import("csstype").BoxSizingProperty | [import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined] | [import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined] | undefined;
52
+ flexBasis?: import("csstype").FlexBasisProperty<string | number> | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | undefined;
53
+ flexDirection?: import("csstype").FlexDirectionProperty | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | undefined;
54
+ flexGrow?: import("csstype").GlobalsNumber | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | undefined;
52
55
  justifyContent?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;
53
56
  marginBottom?: import("csstype").MarginBottomProperty<string | number> | [import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined] | [import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined] | undefined;
54
57
  paddingBottom?: import("csstype").PaddingBottomProperty<string | number> | [import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined] | [import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined] | undefined;
package/dist/IconTextButton.d.ts CHANGED
@@ -3,6 +3,7 @@ import { IconType } from '@cloudflare/component-icon';
3
3
  declare type IconTextButtonProps = {
4
4
  onClick: (e: React.MouseEvent<any>) => void;
5
5
  iconType: IconType;
6
+ iconPosition?: 'left' | 'right';
6
7
  };
7
8
  declare const IconTextButton: React.FC<IconTextButtonProps>;
8
9
  export default IconTextButton;
package/dist/TextButton.d.ts CHANGED
@@ -311,6 +311,9 @@ declare const TextButton: import("react").ComponentType<{
311
311
  borderTopStyle?: import("csstype").BorderTopStyleProperty | [import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined] | [import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined] | undefined;
312
312
  borderTopWidth?: import("csstype").BorderTopWidthProperty<string | number> | [import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined] | [import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined] | undefined;
313
313
  boxSizing?: import("csstype").BoxSizingProperty | [import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined] | [import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined] | undefined;
314
+ flexBasis?: import("csstype").FlexBasisProperty<string | number> | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | undefined;
315
+ flexDirection?: import("csstype").FlexDirectionProperty | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | undefined;
316
+ flexGrow?: import("csstype").GlobalsNumber | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | undefined;
314
317
  justifyContent?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;
315
318
  marginBottom?: import("csstype").MarginBottomProperty<string | number> | [import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined] | [import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined] | undefined;
316
319
  paddingBottom?: import("csstype").PaddingBottomProperty<string | number> | [import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined] | [import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined] | undefined;
package/dist/UnstyledButton.d.ts CHANGED
@@ -311,6 +311,9 @@ declare const UnstyledButton: import("react").ComponentType<{
311
311
  borderTopStyle?: import("csstype").BorderTopStyleProperty | [import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined] | [import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined, import("csstype").BorderTopStyleProperty | undefined] | undefined;
312
312
  borderTopWidth?: import("csstype").BorderTopWidthProperty<string | number> | [import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined] | [import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined, import("csstype").BorderTopWidthProperty<string | number> | undefined] | undefined;
313
313
  boxSizing?: import("csstype").BoxSizingProperty | [import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined] | [import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined, import("csstype").BoxSizingProperty | undefined] | undefined;
314
+ flexBasis?: import("csstype").FlexBasisProperty<string | number> | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | [import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined, import("csstype").FlexBasisProperty<string | number> | undefined] | undefined;
315
+ flexDirection?: import("csstype").FlexDirectionProperty | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | [import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined, import("csstype").FlexDirectionProperty | undefined] | undefined;
316
+ flexGrow?: import("csstype").GlobalsNumber | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | [import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined, import("csstype").GlobalsNumber | undefined] | undefined;
314
317
  justifyContent?: string | [string | undefined, string | undefined] | [string | undefined, string | undefined, string | undefined] | undefined;
315
318
  marginBottom?: import("csstype").MarginBottomProperty<string | number> | [import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined] | [import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined, import("csstype").MarginBottomProperty<string | number> | undefined] | undefined;
316
319
  paddingBottom?: import("csstype").PaddingBottomProperty<string | number> | [import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined] | [import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined, import("csstype").PaddingBottomProperty<string | number> | undefined] | undefined;
package/es/IconTextButton.js CHANGED
@@ -10,14 +10,19 @@ const IconTextWrapper = createStyledComponent(() => ({
10
10
  const IconTextButton = ({
11
11
  onClick,
12
12
  iconType,
13
+ iconPosition = 'left',
13
14
  children
14
15
  }) => /*#__PURE__*/React.createElement(TextButton, {
15
16
  type: "button",
16
17
  onClick: onClick
17
- }, /*#__PURE__*/React.createElement(IconTextWrapper, null, /*#__PURE__*/React.createElement(Icon, {
18
+ }, /*#__PURE__*/React.createElement(IconTextWrapper, null, iconPosition === 'left' && /*#__PURE__*/React.createElement(Icon, {
18
19
  type: iconType,
19
20
  mr: 1,
20
21
  label: iconType
21
- }), children));
22
+ }), children, iconPosition === 'right' && /*#__PURE__*/React.createElement(Icon, {
23
+ type: iconType,
24
+ ml: 1,
25
+ label: iconType
26
+ })));
22
27
 
23
28
  export default IconTextButton;
package/lib/IconTextButton.js CHANGED
@@ -25,15 +25,21 @@ var IconTextWrapper = (0, _styleContainer.createStyledComponent)(function () {
25
25
  var IconTextButton = function IconTextButton(_ref) {
26
26
  var onClick = _ref.onClick,
27
27
  iconType = _ref.iconType,
28
+ _ref$iconPosition = _ref.iconPosition,
29
+ iconPosition = _ref$iconPosition === void 0 ? 'left' : _ref$iconPosition,
28
30
  children = _ref.children;
29
31
  return /*#__PURE__*/_react.default.createElement(_TextButton.default, {
30
32
  type: "button",
31
33
  onClick: onClick
32
- }, /*#__PURE__*/_react.default.createElement(IconTextWrapper, null, /*#__PURE__*/_react.default.createElement(_componentIcon.Icon, {
34
+ }, /*#__PURE__*/_react.default.createElement(IconTextWrapper, null, iconPosition === 'left' && /*#__PURE__*/_react.default.createElement(_componentIcon.Icon, {
33
35
  type: iconType,
34
36
  mr: 1,
35
37
  label: iconType
36
- }), children));
38
+ }), children, iconPosition === 'right' && /*#__PURE__*/_react.default.createElement(_componentIcon.Icon, {
39
+ type: iconType,
40
+ ml: 1,
41
+ label: iconType
42
+ })));
37
43
  };
38
44
 
39
45
  var _default = IconTextButton;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@cloudflare/component-button",
3
3
  "description": "Cloudflare Button Component",
4
- "version": "3.0.5",
4
+ "version": "3.1.2",
5
5
  "main": "lib/index.js",
6
6
  "module": "es/index.js",
7
7
  "author": "James Kyle <jkyle@cloudflare.com>",
@@ -12,9 +12,9 @@
12
12
  "access": "public"
13
13
  },
14
14
  "dependencies": {
15
- "@cloudflare/component-icon": "^7.0.5",
16
- "@cloudflare/style-const": "^5.2.17",
17
- "@cloudflare/style-container": "^7.7.8",
15
+ "@cloudflare/component-icon": "^7.0.7",
16
+ "@cloudflare/style-const": "^5.2.18",
17
+ "@cloudflare/style-container": "^7.8.0",
18
18
  "polished": "^4.1.4",
19
19
  "prop-types": "^15.6.0"
20
20
  },
@@ -32,5 +32,5 @@
32
32
  "test-coverage": "stratus test --coverage",
33
33
  "test-watch": "stratus test --watch"
34
34
  },
35
- "gitHead": "fdb7772c900a48db5c347967f0ffd0ddd8c88451"
35
+ "gitHead": "d5b838307b054a9e0c2b6d785a7357213e500848"
36
36
  }