@sis-cc/dotstatsuite-visions 6.6.1 → 6.6.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 (4) hide show
  1. package/es/Share/Mode.js +59 -13
  2. package/es/Share/index.js +9 -1
  3. package/lib/Share/Mode.js +59 -12
  4. package/package.json +1 -1
package/es/Share/Mode.js CHANGED
@@ -4,12 +4,13 @@ import React from 'react';
4
4
  import PropTypes from 'prop-types';
5
5
  import * as R from 'ramda';
6
6
  import Card from '@material-ui/core/Card';
7
- import { makeStyles } from '@material-ui/core/styles';
7
+ import { makeStyles, useTheme } from '@material-ui/core/styles';
8
8
  import CardContent from '@material-ui/core/CardContent';
9
9
  import Typography from '@material-ui/core/Typography';
10
10
  import RadioGroup from '@material-ui/core/RadioGroup';
11
11
  import FormControlLabel from '@material-ui/core/FormControlLabel';
12
12
  import Radio from '@material-ui/core/Radio';
13
+ import { Tooltip, Warning as WarningIcon } from '../';
13
14
 
14
15
  var useStyles = makeStyles(function (theme) {
15
16
  return {
@@ -28,16 +29,54 @@ var useStyles = makeStyles(function (theme) {
28
29
  padding: theme.spacing(1, 0)
29
30
  }
30
31
  },
31
- label: theme.typography.body2
32
+ label: theme.typography.body2,
33
+ warning: _extends({
34
+ marginLeft: theme.spacing(0.5),
35
+ width: 'unset',
36
+ fontSize: 'inherit',
37
+ height: '1.3em'
38
+ }, R.pathOr({}, ['mixins', 'share', 'warning'], theme))
32
39
  };
33
40
  });
34
41
 
35
- var Mode = function Mode(_ref) {
36
- var changeMode = _ref.changeMode,
37
- mode = _ref.mode,
38
- _ref$modes = _ref.modes,
39
- modes = _ref$modes === undefined ? [] : _ref$modes,
40
- title = _ref.title;
42
+ var Warning = function Warning(_ref) {
43
+ var title = _ref.title;
44
+
45
+ var classes = useStyles();
46
+ var theme = useTheme();
47
+ var warningColor = R.path(['palette', 'highlight', 'hl1'], theme) || theme.palette.primary.dark;
48
+ var warningTextColor = theme.palette.getContrastText(warningColor);
49
+ return React.createElement(
50
+ Tooltip,
51
+ {
52
+ className: classes.warning,
53
+ title: title,
54
+ tabIndex: 0,
55
+ variant: 'warning',
56
+ 'aria-hidden': false,
57
+ placement: 'bottom',
58
+ PopperProps: {
59
+ modifiers: {
60
+ flip: {
61
+ behavior: ['bottom', 'top', 'left', 'right']
62
+ }
63
+ }
64
+ }
65
+ },
66
+ React.createElement(WarningIcon, { pathBackgroundColor: warningColor, pathColor: warningTextColor })
67
+ );
68
+ };
69
+
70
+ Warning.propTypes = process.env.NODE_ENV !== "production" ? {
71
+ title: PropTypes.string
72
+ } : {};
73
+
74
+ var Mode = function Mode(_ref2) {
75
+ var changeMode = _ref2.changeMode,
76
+ mode = _ref2.mode,
77
+ _ref2$modes = _ref2.modes,
78
+ modes = _ref2$modes === undefined ? [] : _ref2$modes,
79
+ title = _ref2.title;
41
80
 
42
81
  var classes = useStyles();
43
82
  return React.createElement(
@@ -56,14 +95,20 @@ var Mode = function Mode(_ref) {
56
95
  { onChange: function onChange(e) {
57
96
  return changeMode(e.target.value);
58
97
  }, value: mode },
59
- R.map(function (_ref2) {
60
- var label = _ref2.label,
61
- value = _ref2.value;
98
+ R.map(function (_ref3) {
99
+ var label = _ref3.label,
100
+ value = _ref3.value,
101
+ warningMessage = _ref3.warningMessage;
62
102
  return React.createElement(FormControlLabel, {
63
103
  classes: { label: classes.label },
64
104
  key: value,
65
105
  control: React.createElement(Radio, { variant: 'outlined', color: 'primary' }),
66
- label: label,
106
+ label: React.createElement(
107
+ 'span',
108
+ null,
109
+ label,
110
+ warningMessage && React.createElement(Warning, { title: warningMessage })
111
+ ),
67
112
  value: value
68
113
  });
69
114
  })(modes)
@@ -77,7 +122,8 @@ Mode.propTypes = process.env.NODE_ENV !== "production" ? {
77
122
  mode: PropTypes.string,
78
123
  modes: PropTypes.arrayOf(PropTypes.shape({
79
124
  label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
80
- value: PropTypes.string
125
+ value: PropTypes.string,
126
+ warningMessage: PropTypes.string
81
127
  })),
82
128
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.element])
83
129
  } : {};
package/es/Share/index.js CHANGED
@@ -16,7 +16,13 @@
16
16
  * isSharing: PropTypes.bool,
17
17
  * mail: PropTypes.string,
18
18
  * mode: PropTypes.string,
19
- * modes: PropTypes.array,
19
+ * modes: PropTypes.arrayOf(
20
+ * PropTypes.shape({
21
+ * label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
22
+ * value: PropTypes.string,
23
+ * warningMessage: PropTypes.string,
24
+ * }),
25
+ * ),
20
26
  * labels: PropTypes.shape({
21
27
  * title: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
22
28
  * disclaimer: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
@@ -48,9 +54,11 @@
48
54
  * mixins: {
49
55
  * share: {
50
56
  * tile: // font, color...
57
+ * warning: // font, color, height...
51
58
  * }
52
59
  * }
53
60
  * }
61
+ * @demoReady
54
62
  */
55
63
 
56
64
  export { default } from './Share';
package/lib/Share/Mode.js CHANGED
@@ -42,6 +42,8 @@ var _Radio = require('@material-ui/core/Radio');
42
42
 
43
43
  var _Radio2 = _interopRequireDefault(_Radio);
44
44
 
45
+ var _ = require('../');
46
+
45
47
  function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
46
48
 
47
49
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -63,16 +65,54 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
63
65
  padding: theme.spacing(1, 0)
64
66
  }
65
67
  },
66
- label: theme.typography.body2
68
+ label: theme.typography.body2,
69
+ warning: _extends({
70
+ marginLeft: theme.spacing(0.5),
71
+ width: 'unset',
72
+ fontSize: 'inherit',
73
+ height: '1.3em'
74
+ }, R.pathOr({}, ['mixins', 'share', 'warning'], theme))
67
75
  };
68
76
  });
69
77
 
70
- var Mode = function Mode(_ref) {
71
- var changeMode = _ref.changeMode,
72
- mode = _ref.mode,
73
- _ref$modes = _ref.modes,
74
- modes = _ref$modes === undefined ? [] : _ref$modes,
75
- title = _ref.title;
78
+ var Warning = function Warning(_ref) {
79
+ var title = _ref.title;
80
+
81
+ var classes = useStyles();
82
+ var theme = (0, _styles.useTheme)();
83
+ var warningColor = R.path(['palette', 'highlight', 'hl1'], theme) || theme.palette.primary.dark;
84
+ var warningTextColor = theme.palette.getContrastText(warningColor);
85
+ return _react2.default.createElement(
86
+ _.Tooltip,
87
+ {
88
+ className: classes.warning,
89
+ title: title,
90
+ tabIndex: 0,
91
+ variant: 'warning',
92
+ 'aria-hidden': false,
93
+ placement: 'bottom',
94
+ PopperProps: {
95
+ modifiers: {
96
+ flip: {
97
+ behavior: ['bottom', 'top', 'left', 'right']
98
+ }
99
+ }
100
+ }
101
+ },
102
+ _react2.default.createElement(_.Warning, { pathBackgroundColor: warningColor, pathColor: warningTextColor })
103
+ );
104
+ };
105
+
106
+ Warning.propTypes = process.env.NODE_ENV !== "production" ? {
107
+ title: _propTypes2.default.string
108
+ } : {};
109
+
110
+ var Mode = function Mode(_ref2) {
111
+ var changeMode = _ref2.changeMode,
112
+ mode = _ref2.mode,
113
+ _ref2$modes = _ref2.modes,
114
+ modes = _ref2$modes === undefined ? [] : _ref2$modes,
115
+ title = _ref2.title;
76
116
 
77
117
  var classes = useStyles();
78
118
  return _react2.default.createElement(
@@ -91,14 +131,20 @@ var Mode = function Mode(_ref) {
91
131
  { onChange: function onChange(e) {
92
132
  return changeMode(e.target.value);
93
133
  }, value: mode },
94
- R.map(function (_ref2) {
95
- var label = _ref2.label,
96
- value = _ref2.value;
134
+ R.map(function (_ref3) {
135
+ var label = _ref3.label,
136
+ value = _ref3.value,
137
+ warningMessage = _ref3.warningMessage;
97
138
  return _react2.default.createElement(_FormControlLabel2.default, {
98
139
  classes: { label: classes.label },
99
140
  key: value,
100
141
  control: _react2.default.createElement(_Radio2.default, { variant: 'outlined', color: 'primary' }),
101
- label: label,
142
+ label: _react2.default.createElement(
143
+ 'span',
144
+ null,
145
+ label,
146
+ warningMessage && _react2.default.createElement(Warning, { title: warningMessage })
147
+ ),
102
148
  value: value
103
149
  });
104
150
  })(modes)
@@ -112,7 +158,8 @@ Mode.propTypes = process.env.NODE_ENV !== "production" ? {
112
158
  mode: _propTypes2.default.string,
113
159
  modes: _propTypes2.default.arrayOf(_propTypes2.default.shape({
114
160
  label: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.element]),
115
- value: _propTypes2.default.string
161
+ value: _propTypes2.default.string,
162
+ warningMessage: _propTypes2.default.string
116
163
  })),
117
164
  title: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.element])
118
165
  } : {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sis-cc/dotstatsuite-visions",
3
- "version": "6.6.1",
3
+ "version": "6.6.2",
4
4
  "description": "Library of visual components",
5
5
  "author": "OECD",
6
6
  "homepage": "https://visions-qa.siscc.org/#o",