@zohodesk/components 1.5.5 → 1.5.6

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 (14) hide show
  1. package/README.md +11 -0
  2. package/es/AppContainer/AppContainer.module.css +1 -1
  3. package/es/ListItem/ListItemWithCheckBox.js +2 -0
  4. package/es/ListItem/ListItemWithRadio.js +2 -0
  5. package/es/ListItem/props/defaultProps.js +2 -0
  6. package/es/ListItem/props/propTypes.js +2 -0
  7. package/es/shared/ArrowIcon/ArrowIcon.module.css +2 -3
  8. package/lib/AppContainer/AppContainer.module.css +1 -1
  9. package/lib/ListItem/ListItemWithCheckBox.js +2 -0
  10. package/lib/ListItem/ListItemWithRadio.js +2 -0
  11. package/lib/ListItem/props/defaultProps.js +2 -0
  12. package/lib/ListItem/props/propTypes.js +2 -0
  13. package/lib/shared/ArrowIcon/ArrowIcon.module.css +2 -3
  14. package/package.json +1 -1
package/README.md CHANGED
@@ -2,6 +2,17 @@
2
2
 
3
3
  Dot UI is a customizable React component library built to deliver a clean, accessible, and developer-friendly UI experience. It offers a growing set of reusable components designed to align with modern design systems and streamline application development across projects.
4
4
 
5
+ # 1.5.6
6
+
7
+ - **ListItemWithRadio, ListItemWithCheckBox**
8
+ - `needBorder` prop supported
9
+
10
+ - **ArrowIcon**
11
+ - Fixes of visible state and color from the container hover
12
+
13
+ - **AppContainer**
14
+ - The --zd-font-family variable now includes an empty string ('') as its fallback font-family value.
15
+
5
16
  # 1.5.5
6
17
 
7
18
  - **Popup**
package/es/AppContainer/AppContainer.module.css CHANGED
@@ -10,7 +10,7 @@
10
10
  }
11
11
  .container, .container button, .container input, .container textarea ,.container select {
12
12
  /* font-family: var(--zd_regular); */
13
- font-family: var(--zd-font-family), var(--zd_fallback_font, ZDLato);
13
+ font-family: var(--zd-font-family, ''), var(--zd_fallback_font, ZDLato);
14
14
  }
15
15
  .tooltip {
16
16
  height: 0 ;
package/es/ListItem/ListItemWithCheckBox.js CHANGED
@@ -52,6 +52,7 @@ export default class ListItemWithCheckBox extends React.Component {
52
52
  checked,
53
53
  autoHover,
54
54
  palette,
55
+ needBorder,
55
56
  dataId,
56
57
  dataSelectorId,
57
58
  title,
@@ -88,6 +89,7 @@ export default class ListItemWithCheckBox extends React.Component {
88
89
  isDisabled: isDisabled,
89
90
  active: active,
90
91
  autoHover: autoHover,
92
+ needBorder: needBorder,
91
93
  customClass: customListItem,
92
94
  dataId: `${dataId ? dataId : value}_ListItemWithCheckBox`,
93
95
  dataSelectorId: dataSelectorId,
package/es/ListItem/ListItemWithRadio.js CHANGED
@@ -52,6 +52,7 @@ export default class ListItemWithRadio extends React.Component {
52
52
  checked,
53
53
  autoHover,
54
54
  palette,
55
+ needBorder,
55
56
  id,
56
57
  dataId,
57
58
  dataSelectorId,
@@ -89,6 +90,7 @@ export default class ListItemWithRadio extends React.Component {
89
90
  isDisabled: isDisabled,
90
91
  active: active,
91
92
  autoHover: autoHover,
93
+ needBorder: needBorder,
92
94
  customClass: customListItem,
93
95
  dataId: dataId,
94
96
  dataSelectorId: dataSelectorId,
package/es/ListItem/props/defaultProps.js CHANGED
@@ -56,6 +56,7 @@ export const ListItemWithCheckBoxDefaultProps = {
56
56
  autoHover: false,
57
57
  checked: false,
58
58
  highlight: false,
59
+ needBorder: true,
59
60
  palette: 'default',
60
61
  size: 'medium',
61
62
  value: 'List',
@@ -91,6 +92,7 @@ export const ListItemWithRadioDefaultProps = {
91
92
  autoHover: false,
92
93
  checked: false,
93
94
  highlight: false,
95
+ needBorder: true,
94
96
  palette: 'default',
95
97
  size: 'medium',
96
98
  value: 'List',
package/es/ListItem/props/propTypes.js CHANGED
@@ -137,6 +137,7 @@ export const ListItemWithCheckBox_Props = {
137
137
  title: PropTypes.string,
138
138
  value: PropTypes.string,
139
139
  secondaryValue: PropTypes.string,
140
+ needBorder: PropTypes.bool,
140
141
  renderValueRightPlaceholderNode: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
141
142
  lhsAlignContent: PropTypes.oneOf(['start', 'center', 'end']),
142
143
  lhsJustifyContent: PropTypes.oneOf(['start', 'center', 'end']),
@@ -213,6 +214,7 @@ export const ListItemWithRadio_Props = {
213
214
  title: PropTypes.string,
214
215
  value: PropTypes.string,
215
216
  secondaryValue: PropTypes.string,
217
+ needBorder: PropTypes.bool,
216
218
  renderValueRightPlaceholderNode: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
217
219
  lhsAlignContent: PropTypes.oneOf(['start', 'center', 'end']),
218
220
  lhsJustifyContent: PropTypes.oneOf(['start', 'center', 'end']),
package/es/shared/ArrowIcon/ArrowIcon.module.css CHANGED
@@ -13,7 +13,7 @@
13
13
  visibility: hidden;
14
14
  }
15
15
 
16
- .transparentContainer .rotated,
16
+ .transparentContainer .active,
17
17
  .transparentContainer:hover .arrowIcon {
18
18
  opacity: 1;
19
19
  visibility: visible;
@@ -29,8 +29,7 @@
29
29
 
30
30
  .rotated,
31
31
  .active,
32
- .arrowContainer:hover .arrowIcon,
33
- .transparentContainer:hover .arrowIcon {
32
+ .arrowContainer:hover .arrowIcon {
34
33
  --local-arrowIcon-color: var(--zdt_arrowicon_hover_icon);
35
34
  }
36
35
 
package/lib/AppContainer/AppContainer.module.css CHANGED
@@ -10,7 +10,7 @@
10
10
  }
11
11
  .container, .container button, .container input, .container textarea ,.container select {
12
12
  /* font-family: var(--zd_regular); */
13
- font-family: var(--zd-font-family), var(--zd_fallback_font, ZDLato);
13
+ font-family: var(--zd-font-family, ''), var(--zd_fallback_font, ZDLato);
14
14
  }
15
15
  .tooltip {
16
16
  height: 0 ;
package/lib/ListItem/ListItemWithCheckBox.js CHANGED
@@ -110,6 +110,7 @@ var ListItemWithCheckBox = /*#__PURE__*/function (_React$Component) {
110
110
  checked = _this$props4.checked,
111
111
  autoHover = _this$props4.autoHover,
112
112
  palette = _this$props4.palette,
113
+ needBorder = _this$props4.needBorder,
113
114
  dataId = _this$props4.dataId,
114
115
  dataSelectorId = _this$props4.dataSelectorId,
115
116
  title = _this$props4.title,
@@ -148,6 +149,7 @@ var ListItemWithCheckBox = /*#__PURE__*/function (_React$Component) {
148
149
  isDisabled: isDisabled,
149
150
  active: active,
150
151
  autoHover: autoHover,
152
+ needBorder: needBorder,
151
153
  customClass: customListItem,
152
154
  dataId: "".concat(dataId ? dataId : value, "_ListItemWithCheckBox"),
153
155
  dataSelectorId: dataSelectorId,
package/lib/ListItem/ListItemWithRadio.js CHANGED
@@ -110,6 +110,7 @@ var ListItemWithRadio = /*#__PURE__*/function (_React$Component) {
110
110
  checked = _this$props4.checked,
111
111
  autoHover = _this$props4.autoHover,
112
112
  palette = _this$props4.palette,
113
+ needBorder = _this$props4.needBorder,
113
114
  id = _this$props4.id,
114
115
  dataId = _this$props4.dataId,
115
116
  dataSelectorId = _this$props4.dataSelectorId,
@@ -149,6 +150,7 @@ var ListItemWithRadio = /*#__PURE__*/function (_React$Component) {
149
150
  isDisabled: isDisabled,
150
151
  active: active,
151
152
  autoHover: autoHover,
153
+ needBorder: needBorder,
152
154
  customClass: customListItem,
153
155
  dataId: dataId,
154
156
  dataSelectorId: dataSelectorId,
package/lib/ListItem/props/defaultProps.js CHANGED
@@ -65,6 +65,7 @@ var ListItemWithCheckBoxDefaultProps = {
65
65
  autoHover: false,
66
66
  checked: false,
67
67
  highlight: false,
68
+ needBorder: true,
68
69
  palette: 'default',
69
70
  size: 'medium',
70
71
  value: 'List',
@@ -102,6 +103,7 @@ var ListItemWithRadioDefaultProps = {
102
103
  autoHover: false,
103
104
  checked: false,
104
105
  highlight: false,
106
+ needBorder: true,
105
107
  palette: 'default',
106
108
  size: 'medium',
107
109
  value: 'List',
package/lib/ListItem/props/propTypes.js CHANGED
@@ -127,6 +127,7 @@ var ListItemWithCheckBox_Props = {
127
127
  title: _propTypes["default"].string,
128
128
  value: _propTypes["default"].string,
129
129
  secondaryValue: _propTypes["default"].string,
130
+ needBorder: _propTypes["default"].bool,
130
131
  renderValueRightPlaceholderNode: _propTypes["default"].oneOfType([_propTypes["default"].node, _propTypes["default"].func]),
131
132
  lhsAlignContent: _propTypes["default"].oneOf(['start', 'center', 'end']),
132
133
  lhsJustifyContent: _propTypes["default"].oneOf(['start', 'center', 'end']),
@@ -205,6 +206,7 @@ var ListItemWithRadio_Props = {
205
206
  title: _propTypes["default"].string,
206
207
  value: _propTypes["default"].string,
207
208
  secondaryValue: _propTypes["default"].string,
209
+ needBorder: _propTypes["default"].bool,
208
210
  renderValueRightPlaceholderNode: _propTypes["default"].oneOfType([_propTypes["default"].node, _propTypes["default"].func]),
209
211
  lhsAlignContent: _propTypes["default"].oneOf(['start', 'center', 'end']),
210
212
  lhsJustifyContent: _propTypes["default"].oneOf(['start', 'center', 'end']),
package/lib/shared/ArrowIcon/ArrowIcon.module.css CHANGED
@@ -13,7 +13,7 @@
13
13
  visibility: hidden;
14
14
  }
15
15
 
16
- .transparentContainer .rotated,
16
+ .transparentContainer .active,
17
17
  .transparentContainer:hover .arrowIcon {
18
18
  opacity: 1;
19
19
  visibility: visible;
@@ -29,8 +29,7 @@
29
29
 
30
30
  .rotated,
31
31
  .active,
32
- .arrowContainer:hover .arrowIcon,
33
- .transparentContainer:hover .arrowIcon {
32
+ .arrowContainer:hover .arrowIcon {
34
33
  --local-arrowIcon-color: var(--zdt_arrowicon_hover_icon);
35
34
  }
36
35
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zohodesk/components",
3
- "version": "1.5.5",
3
+ "version": "1.5.6",
4
4
  "main": "es/index.js",
5
5
  "module": "es/index.js",
6
6
  "private": false,