@occmundial/occ-atomic 3.0.0-beta.16 → 3.0.0-beta.18

Sign up to get free protection for your applications and to get access to all the features.
Files changed (10) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/build/Checkbox/Checkbox.js +4 -4
  3. package/build/Pill/Choice/Choice.js +6 -4
  4. package/build/Pill/Choice/styles.js +13 -10
  5. package/build/Pill/Group/styles.js +5 -5
  6. package/build/Pill/Stack/Stack.js +2 -2
  7. package/build/Pill/Stack/styles.js +5 -8
  8. package/build/Radio/Radio.js +4 -4
  9. package/build/SlideToggle/SlideToggle.js +4 -4
  10. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,18 @@
1
+ # [3.0.0-beta.18](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.17...v3.0.0-beta.18) (2024-06-21)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * Replace onKeyDown for onKeyUp ([e574e9c](https://github.com/occmundial/occ-atomic/commit/e574e9c42f7a55723794269ede7a4f58dd899e58))
7
+
8
+ # [3.0.0-beta.17](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.16...v3.0.0-beta.17) (2024-06-19)
9
+
10
+
11
+ ### Bug Fixes
12
+
13
+ * Change icon size and adjust margin ([0411455](https://github.com/occmundial/occ-atomic/commit/041145590cd765e5b81937f07ef676d2fc5e8826))
14
+ * Remove selector not active for focus visible ([dbec333](https://github.com/occmundial/occ-atomic/commit/dbec33316a94826d2007a044b634f944ffe01715))
15
+
1
16
  # [3.0.0-beta.16](https://github.com/occmundial/occ-atomic/compare/v3.0.0-beta.15...v3.0.0-beta.16) (2024-06-19)
2
17
 
3
18
 
package/build/Checkbox/Checkbox.js CHANGED
@@ -86,8 +86,8 @@ var Checkbox = /*#__PURE__*/function (_React$Component) {
86
86
  }
87
87
  }
88
88
  }, {
89
- key: "handleKeyDown",
90
- value: function handleKeyDown(e) {
89
+ key: "handleKeyUp",
90
+ value: function handleKeyUp(e) {
91
91
  if (e.keyCode == 13 || e.keyCode == 32) {
92
92
  e.preventDefault();
93
93
  this.toggle();
@@ -118,8 +118,8 @@ var Checkbox = /*#__PURE__*/function (_React$Component) {
118
118
  return /*#__PURE__*/_react["default"].createElement("div", _extends({
119
119
  id: id,
120
120
  tabIndex: disabled ? -1 : 0,
121
- onKeyDown: function onKeyDown(e) {
122
- return _this2.handleKeyDown(e);
121
+ onKeyUp: function onKeyUp(e) {
122
+ return _this2.handleKeyUp(e);
123
123
  },
124
124
  className: "".concat(classes.cont).concat(iconClass).concat(disabled ? " ".concat(classes.disabled) : '').concat(className ? " ".concat(className) : ''),
125
125
  onClick: this.toggle,
package/build/Pill/Choice/Choice.js CHANGED
@@ -83,15 +83,17 @@ var Choice = function Choice(props) {
83
83
  }), leftIcon && /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
84
84
  iconName: leftIcon,
85
85
  colors: [conditionedStyles.iconColor],
86
- width: 18,
87
- height: 18
86
+ className: classes.leftIcon,
87
+ width: 16,
88
+ height: 16
88
89
  }), children && /*#__PURE__*/_react["default"].createElement("span", {
89
90
  className: "".concat(classes.text, " ").concat(classes[conditionedStyles.text])
90
91
  }, children), rightIcon && /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
91
92
  iconName: rightIcon,
92
93
  colors: [conditionedStyles.iconColor],
93
- width: 18,
94
- height: 18
94
+ className: classes.rightIcon,
95
+ width: 16,
96
+ height: 16
95
97
  }));
96
98
  };
97
99
 
package/build/Pill/Choice/styles.js CHANGED
@@ -44,12 +44,11 @@ var _default = {
44
44
  '&:hover': {
45
45
  background: _colors["default"].pill.unselected.bg.hover
46
46
  },
47
- '&:active, &:focus': {
47
+ '&:active': {
48
48
  background: _colors["default"].pill.unselected.bg.active
49
49
  },
50
- '&:not(:active):focus-visible': {
51
- boxShadow: _shadows["default"]['focus-indigo'],
52
- background: _colors["default"].pill.unselected.bg["default"]
50
+ '&:focus-visible': {
51
+ boxShadow: _shadows["default"]['focus-indigo']
53
52
  }
54
53
  },
55
54
  disabled: {
@@ -57,16 +56,16 @@ var _default = {
57
56
  pointerEvents: 'none'
58
57
  },
59
58
  selected: {
60
- background: "".concat(_colors["default"].pill.selected.bg["default"], " !important"),
59
+ background: _colors["default"].pill.selected.bg["default"],
61
60
  zIndex: 1,
62
61
  color: _colors["default"].text.white.primary,
63
62
  '&:hover': {
64
63
  background: _colors["default"].pill.selected.bg.hover
65
64
  },
66
- '&:active, &:focus': {
65
+ '&:active': {
67
66
  background: _colors["default"].pill.selected.bg.active
68
67
  },
69
- '&:not(:active):focus-visible': {
68
+ '&:focus-visible': {
70
69
  boxShadow: _shadows["default"]['focus-indigo']
71
70
  }
72
71
  },
@@ -80,9 +79,7 @@ var _default = {
80
79
  font: (0, _styles.parseFontValue)(_fonts["default"]['body-regular']),
81
80
  textOverflow: 'ellipsis',
82
81
  whiteSpace: 'nowrap',
83
- padding: [0, _spacing["default"]['size-1']],
84
- marginLeft: _spacing["default"]['size-1'],
85
- marginRight: _spacing["default"]['size-1']
82
+ padding: [0, _spacing["default"]['size-1']]
86
83
  },
87
84
  textSelectedDisabled: {
88
85
  color: _colors["default"].text.white.secondary
@@ -95,6 +92,12 @@ var _default = {
95
92
  },
96
93
  textEnabled: {
97
94
  color: _colors["default"].text.indigo.primary
95
+ },
96
+ leftIcon: {
97
+ marginRight: _spacing["default"]['size-1']
98
+ },
99
+ rightIcon: {
100
+ marginLeft: _spacing["default"]['size-1']
98
101
  }
99
102
  };
100
103
  exports["default"] = _default;
package/build/Pill/Group/styles.js CHANGED
@@ -43,15 +43,15 @@ var _default = {
43
43
  whiteSpace: 'nowrap',
44
44
  transition: '0.3s all',
45
45
  cursor: 'pointer',
46
- '&:not(:active):focus-visible': {
47
- boxShadow: _shadows["default"]['focus-indigo'],
48
- background: 'none'
49
- },
50
46
  '&:hover': {
51
47
  background: _colors["default"].pill.unselected.bg.hover
52
48
  },
53
- '&:active, &:focus': {
49
+ '&:active': {
54
50
  background: _colors["default"].pill.unselected.bg.active
51
+ },
52
+ '&:focus-visible': {
53
+ boxShadow: _shadows["default"]['focus-indigo'],
54
+ background: 'none'
55
55
  }
56
56
  },
57
57
  selected: {
package/build/Pill/Stack/Stack.js CHANGED
@@ -52,8 +52,8 @@ var Stack = function Stack(_ref) {
52
52
  className: classes.close,
53
53
  iconName: "cross",
54
54
  colors: [disabled ? _colors["default"].icon.brand.disabled : _colors["default"].icon.brand["default"]],
55
- width: 18,
56
- height: 18
55
+ width: 16,
56
+ height: 16
57
57
  })));
58
58
  };
59
59
 
package/build/Pill/Stack/styles.js CHANGED
@@ -42,12 +42,11 @@ var _default = {
42
42
  '&:hover': {
43
43
  background: _colors["default"].pill.unselected.bg.hover
44
44
  },
45
- '&:active, &:focus': {
45
+ '&:active': {
46
46
  background: _colors["default"].pill.unselected.bg.active
47
47
  },
48
- '&:not(:active):focus-visible': {
49
- boxShadow: _shadows["default"]['focus-indigo'],
50
- background: _colors["default"].pill.unselected.bg["default"]
48
+ '&:focus-visible': {
49
+ boxShadow: _shadows["default"]['focus-indigo']
51
50
  }
52
51
  },
53
52
  disabled: {
@@ -61,8 +60,7 @@ var _default = {
61
60
  color: _colors["default"].text.indigo.primary,
62
61
  textOverflow: 'ellipsis',
63
62
  whiteSpace: 'nowrap',
64
- padding: [0, _spacing["default"]['size-1']],
65
- marginRight: _spacing["default"]['size-1']
63
+ padding: [0, _spacing["default"]['size-1']]
66
64
  },
67
65
  textDisabled: {
68
66
  color: _colors["default"].text.indigo.secondary
@@ -73,8 +71,7 @@ var _default = {
73
71
  display: 'inline-flex',
74
72
  justifyContent: 'center',
75
73
  alignItems: 'center',
76
- marginRight: -_spacing["default"]['size-1'],
77
- marginLeft: -_spacing["default"]['size-1']
74
+ marginLeft: _spacing["default"]['size-1']
78
75
  }
79
76
  };
80
77
  exports["default"] = _default;
package/build/Radio/Radio.js CHANGED
@@ -78,8 +78,8 @@ var Radio = /*#__PURE__*/function (_React$Component) {
78
78
  }
79
79
  }
80
80
  }, {
81
- key: "handleKeyDown",
82
- value: function handleKeyDown(e, option) {
81
+ key: "handleKeyUp",
82
+ value: function handleKeyUp(e, option) {
83
83
  if (e.keyCode == 13 || e.keyCode == 32) {
84
84
  e.preventDefault();
85
85
  this.onChange(option);
@@ -106,8 +106,8 @@ var Radio = /*#__PURE__*/function (_React$Component) {
106
106
  id: option.trk,
107
107
  key: option.value,
108
108
  tabIndex: option.disabled ? -1 : 0,
109
- onKeyDown: function onKeyDown(e) {
110
- return _this2.handleKeyDown(e, option);
109
+ onKeyUp: function onKeyUp(e) {
110
+ return _this2.handleKeyUp(e, option);
111
111
  },
112
112
  "data-testid": option.testId
113
113
  }, option.testId && {
package/build/SlideToggle/SlideToggle.js CHANGED
@@ -84,8 +84,8 @@ var SlideToggle = /*#__PURE__*/function (_React$Component) {
84
84
  }
85
85
  }
86
86
  }, {
87
- key: "handleKeyDown",
88
- value: function handleKeyDown(e) {
87
+ key: "handleKeyUp",
88
+ value: function handleKeyUp(e) {
89
89
  if (e.keyCode == 13 || e.keyCode == 32) {
90
90
  e.preventDefault();
91
91
  this.toggle();
@@ -111,8 +111,8 @@ var SlideToggle = /*#__PURE__*/function (_React$Component) {
111
111
  return /*#__PURE__*/_react["default"].createElement("div", {
112
112
  id: id,
113
113
  tabIndex: disabled ? -1 : 0,
114
- onKeyDown: function onKeyDown(e) {
115
- return _this2.handleKeyDown(e);
114
+ onKeyUp: function onKeyUp(e) {
115
+ return _this2.handleKeyUp(e);
116
116
  },
117
117
  onClick: this.toggle,
118
118
  className: "".concat(classes.cont).concat(disabled ? " ".concat(classes.disabled) : '').concat(className ? " ".concat(className) : ''),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@occmundial/occ-atomic",
3
- "version": "3.0.0-beta.16",
3
+ "version": "3.0.0-beta.18",
4
4
  "description": "Collection of shareable styled React components for OCC applications.",
5
5
  "homepage": "http://occmundial.github.io/occ-atomic",
6
6
  "main": "build/index.js",