@sis-cc/dotstatsuite-visions 12.39.0 → 12.41.0

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 (12) hide show
  1. package/es/CollapseButtons/Item.js +62 -54
  2. package/es/SisccFooter/SisccFooter.js +2 -0
  3. package/es/Spotlight/Spotlight.js +9 -3
  4. package/es/theme.js +16 -1
  5. package/lib/CollapseButtons/Item.js +63 -54
  6. package/lib/SisccFooter/SisccFooter.js +2 -0
  7. package/lib/Spotlight/Spotlight.js +9 -3
  8. package/lib/theme.js +16 -1
  9. package/package.json +1 -1
  10. package/umd/@sis-cc/dotstatsuite-visions.js +152 -121
  11. package/umd/@sis-cc/dotstatsuite-visions.min.js +6 -6
  12. package/umd/@sis-cc/dotstatsuite-visions.min.js.map +1 -1
package/es/CollapseButtons/Item.js CHANGED
@@ -8,6 +8,7 @@ import Button from '@mui/material/Button';
8
8
  import Link from '@mui/material/Link';
9
9
  import makeStyles from '@mui/styles/makeStyles';
10
10
  import SvgIcon from '@mui/material/SvgIcon';
11
+ import { Typography } from '@mui/material';
11
12
 
12
13
  var useStyles = makeStyles(function (theme) {
13
14
  return {
@@ -62,64 +63,71 @@ var Item = function Item(_ref) {
62
63
  Grid,
63
64
  { className: classes.paperItem },
64
65
  React.createElement(
65
- Button,
66
- {
67
- 'aria-label': R.prop('label')(item),
68
- className: classes.button,
69
- fullWidth: true,
70
- 'data-testid': testId,
71
- role: 'link',
72
- onClick: function onClick() {
73
- if (R.not(R.is(Function)(action))) return;
74
- action(parentId, R.prop('id')(item));
75
- },
76
- tabIndex: 0
77
- },
66
+ Typography,
67
+ { variant: 'h4' },
78
68
  React.createElement(
79
- SvgIcon,
80
- { className: classes.svg },
81
- React.createElement('path', { d: R.prop('svgPath')(item) })
82
- ),
83
- React.createElement(
84
- Grid,
85
- { container: true, item: true, xs: 12, direction: 'column' },
69
+ Button,
70
+ {
71
+ 'aria-label': R.prop('label')(item),
72
+ className: classes.button,
73
+ fullWidth: true,
74
+ 'data-testid': testId,
75
+ role: 'link',
76
+ onClick: function onClick() {
77
+ if (R.not(R.is(Function)(action))) return;
78
+ action(parentId, R.prop('id')(item));
79
+ },
80
+ tabIndex: 0
81
+ },
86
82
  React.createElement(
87
- 'span',
88
- { className: classes.itemTitle },
89
- labelAccessor(item, parentId)
83
+ SvgIcon,
84
+ { className: classes.svg },
85
+ React.createElement('path', { d: R.prop('svgPath')(item) })
90
86
  ),
91
87
  React.createElement(
92
- 'span',
93
- { className: classes.itemSubtitle },
94
- R.map(function (subtopic) {
95
- if (R.not(R.is(Object)(subtopic))) return subtopic;
96
- if (R.not(isSecondLevelClikable)) return labelAccessor(subtopic, parentId);
97
- var id = R.prop('id')(subtopic);
98
- return React.createElement(
99
- Link,
100
- {
101
- key: id,
102
- className: classes.itemSubtitleLink,
103
- role: 'link',
104
- onClick: function onClick(e) {
105
- if (R.not(R.is(Function)(action))) return;
106
- action(parentId, id);
107
- e.stopPropagation();
108
- },
109
- onKeyDown: function onKeyDown(e) {
110
- if (e.key === 'Enter' || e.key === ' ') {
111
- if (R.not(R.is(Function)(action))) return;
112
- action(parentId, id);
113
- e.stopPropagation();
114
- }
115
- },
116
- tabIndex: 0,
117
- underline: 'none',
118
- style: { display: 'list-item' }
119
- },
120
- labelAccessor(subtopic, parentId)
121
- );
122
- })(R.pipe(R.propOr([], 'subtopics'), R.ifElse(R.always(isSecondLevelClikable), R.identity, R.intersperse(' • ')))(item))
88
+ Grid,
89
+ { container: true, item: true, xs: 12, direction: 'column' },
90
+ React.createElement(
91
+ 'span',
92
+ { className: classes.itemTitle },
93
+ labelAccessor(item, parentId)
94
+ ),
95
+ React.createElement(
96
+ 'span',
97
+ { className: classes.itemSubtitle },
98
+ R.map(function (subtopic) {
99
+ if (R.not(R.is(Object)(subtopic))) return subtopic;
100
+ if (R.not(isSecondLevelClikable)) return labelAccessor(subtopic, parentId);
101
+ var id = R.prop('id')(subtopic);
102
+ return React.createElement(
103
+ Typography,
104
+ { variant: 'h5', key: id },
105
+ React.createElement(
106
+ Link,
107
+ {
108
+ className: classes.itemSubtitleLink,
109
+ role: 'link',
110
+ onClick: function onClick(e) {
111
+ if (R.not(R.is(Function)(action))) return;
112
+ action(parentId, id);
113
+ e.stopPropagation();
114
+ },
115
+ onKeyDown: function onKeyDown(e) {
116
+ if (e.key === 'Enter' || e.key === ' ') {
117
+ if (R.not(R.is(Function)(action))) return;
118
+ action(parentId, id);
119
+ e.stopPropagation();
120
+ }
121
+ },
122
+ tabIndex: 0,
123
+ underline: 'none',
124
+ style: { display: 'list-item' }
125
+ },
126
+ labelAccessor(subtopic, parentId)
127
+ )
128
+ );
129
+ })(R.pipe(R.propOr([], 'subtopics'), R.ifElse(R.always(isSecondLevelClikable), R.identity, R.intersperse(' • ')))(item))
130
+ )
123
131
  )
124
132
  )
125
133
  )
package/es/SisccFooter/SisccFooter.js CHANGED
@@ -61,6 +61,8 @@ var SisccFooter = React.forwardRef(function (_ref, ref) {
61
61
  ref: ref,
62
62
  'data-testid': 'footer-bar-test-id',
63
63
  position: 'static',
64
+ component: 'footer',
65
+ role: 'contentinfo',
64
66
  className: cx(classes.appBar, (_cx = {}, _cx[classes.fixed] = isFixed, _cx))
65
67
  },
66
68
  React.createElement(
package/es/Spotlight/Spotlight.js CHANGED
@@ -30,6 +30,7 @@ var Spotlight = function Spotlight(_ref) {
30
30
  className = _ref.className,
31
31
  _ref$withAutoFocus = _ref.withAutoFocus,
32
32
  withAutoFocus = _ref$withAutoFocus === undefined ? false : _ref$withAutoFocus,
33
+ labels = _ref.labels,
33
34
  _ref$testId = _ref.testId,
34
35
  testId = _ref$testId === undefined ? 'spotlight' : _ref$testId;
35
36
 
@@ -59,7 +60,12 @@ var Spotlight = function Spotlight(_ref) {
59
60
  { className: classes.root, elevation: 0 },
60
61
  React.createElement(
61
62
  IconButton,
62
- { className: classes.leftIcon, disabled: true, 'aria-label': 'search', size: 'large' },
63
+ {
64
+ className: classes.leftIcon,
65
+ disabled: true,
66
+ 'aria-label': R.propOr('search', 'searchSpotlight')(labels),
67
+ size: 'large'
68
+ },
63
69
  React.createElement(Search, null)
64
70
  ),
65
71
  React.createElement(InputBase, {
@@ -91,7 +97,7 @@ var Spotlight = function Spotlight(_ref) {
91
97
  hasClearAll && !R.isEmpty(value) ? React.createElement(
92
98
  IconButton,
93
99
  {
94
- 'aria-label': 'Clear',
100
+ 'aria-label': R.propOr('clear', 'clearSpotlight')(labels),
95
101
  onClick: onClearTerm,
96
102
  className: cx(classes.rightIcon, classes.clear),
97
103
  size: 'large'
@@ -118,7 +124,7 @@ var Spotlight = function Spotlight(_ref) {
118
124
  disabled: R.isEmpty(value),
119
125
  color: 'primary',
120
126
  className: classes.rightIcon,
121
- 'aria-label': 'commit',
127
+ 'aria-label': R.propOr('commit', 'commitSpotlight')(labels),
122
128
  onClick: onCommitTerm,
123
129
  size: 'large'
124
130
  },
package/es/theme.js CHANGED
@@ -384,8 +384,23 @@ export var sisccTheme = function sisccTheme(_ref) {
384
384
  },
385
385
  typography: {
386
386
  fontFamily: "'Helvetica Neue', Helvetica, Arial, sans-serif",
387
+ h1: {
388
+ fontSize: '2em'
389
+ },
390
+ h2: {
391
+ fontSize: '1.5em'
392
+ },
393
+ h3: {
394
+ fontSize: '14px'
395
+ },
396
+ h4: {
397
+ fontSize: '14px'
398
+ },
399
+ h5: {
400
+ fontSize: '12px'
401
+ },
387
402
  h6: {
388
- fontSize: '1.0625rem'
403
+ fontSize: '12px'
389
404
  },
390
405
  body1: {
391
406
  fontSize: '0.750rem',
package/lib/CollapseButtons/Item.js CHANGED
@@ -36,6 +36,8 @@ var _SvgIcon = require('@mui/material/SvgIcon');
36
36
 
37
37
  var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
38
38
 
39
+ var _material = require('@mui/material');
40
+
39
41
  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; } }
40
42
 
41
43
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -93,64 +95,71 @@ var Item = function Item(_ref) {
93
95
  _Grid2.default,
94
96
  { className: classes.paperItem },
95
97
  _react2.default.createElement(
96
- _Button2.default,
97
- {
98
- 'aria-label': R.prop('label')(item),
99
- className: classes.button,
100
- fullWidth: true,
101
- 'data-testid': testId,
102
- role: 'link',
103
- onClick: function onClick() {
104
- if (R.not(R.is(Function)(action))) return;
105
- action(parentId, R.prop('id')(item));
106
- },
107
- tabIndex: 0
108
- },
98
+ _material.Typography,
99
+ { variant: 'h4' },
109
100
  _react2.default.createElement(
110
- _SvgIcon2.default,
111
- { className: classes.svg },
112
- _react2.default.createElement('path', { d: R.prop('svgPath')(item) })
113
- ),
114
- _react2.default.createElement(
115
- _Grid2.default,
116
- { container: true, item: true, xs: 12, direction: 'column' },
101
+ _Button2.default,
102
+ {
103
+ 'aria-label': R.prop('label')(item),
104
+ className: classes.button,
105
+ fullWidth: true,
106
+ 'data-testid': testId,
107
+ role: 'link',
108
+ onClick: function onClick() {
109
+ if (R.not(R.is(Function)(action))) return;
110
+ action(parentId, R.prop('id')(item));
111
+ },
112
+ tabIndex: 0
113
+ },
117
114
  _react2.default.createElement(
118
- 'span',
119
- { className: classes.itemTitle },
120
- labelAccessor(item, parentId)
115
+ _SvgIcon2.default,
116
+ { className: classes.svg },
117
+ _react2.default.createElement('path', { d: R.prop('svgPath')(item) })
121
118
  ),
122
119
  _react2.default.createElement(
123
- 'span',
124
- { className: classes.itemSubtitle },
125
- R.map(function (subtopic) {
126
- if (R.not(R.is(Object)(subtopic))) return subtopic;
127
- if (R.not(isSecondLevelClikable)) return labelAccessor(subtopic, parentId);
128
- var id = R.prop('id')(subtopic);
129
- return _react2.default.createElement(
130
- _Link2.default,
131
- {
132
- key: id,
133
- className: classes.itemSubtitleLink,
134
- role: 'link',
135
- onClick: function onClick(e) {
136
- if (R.not(R.is(Function)(action))) return;
137
- action(parentId, id);
138
- e.stopPropagation();
139
- },
140
- onKeyDown: function onKeyDown(e) {
141
- if (e.key === 'Enter' || e.key === ' ') {
142
- if (R.not(R.is(Function)(action))) return;
143
- action(parentId, id);
144
- e.stopPropagation();
145
- }
146
- },
147
- tabIndex: 0,
148
- underline: 'none',
149
- style: { display: 'list-item' }
150
- },
151
- labelAccessor(subtopic, parentId)
152
- );
153
- })(R.pipe(R.propOr([], 'subtopics'), R.ifElse(R.always(isSecondLevelClikable), R.identity, R.intersperse(' • ')))(item))
120
+ _Grid2.default,
121
+ { container: true, item: true, xs: 12, direction: 'column' },
122
+ _react2.default.createElement(
123
+ 'span',
124
+ { className: classes.itemTitle },
125
+ labelAccessor(item, parentId)
126
+ ),
127
+ _react2.default.createElement(
128
+ 'span',
129
+ { className: classes.itemSubtitle },
130
+ R.map(function (subtopic) {
131
+ if (R.not(R.is(Object)(subtopic))) return subtopic;
132
+ if (R.not(isSecondLevelClikable)) return labelAccessor(subtopic, parentId);
133
+ var id = R.prop('id')(subtopic);
134
+ return _react2.default.createElement(
135
+ _material.Typography,
136
+ { variant: 'h5', key: id },
137
+ _react2.default.createElement(
138
+ _Link2.default,
139
+ {
140
+ className: classes.itemSubtitleLink,
141
+ role: 'link',
142
+ onClick: function onClick(e) {
143
+ if (R.not(R.is(Function)(action))) return;
144
+ action(parentId, id);
145
+ e.stopPropagation();
146
+ },
147
+ onKeyDown: function onKeyDown(e) {
148
+ if (e.key === 'Enter' || e.key === ' ') {
149
+ if (R.not(R.is(Function)(action))) return;
150
+ action(parentId, id);
151
+ e.stopPropagation();
152
+ }
153
+ },
154
+ tabIndex: 0,
155
+ underline: 'none',
156
+ style: { display: 'list-item' }
157
+ },
158
+ labelAccessor(subtopic, parentId)
159
+ )
160
+ );
161
+ })(R.pipe(R.propOr([], 'subtopics'), R.ifElse(R.always(isSecondLevelClikable), R.identity, R.intersperse(' • ')))(item))
162
+ )
154
163
  )
155
164
  )
156
165
  )
package/lib/SisccFooter/SisccFooter.js CHANGED
@@ -92,6 +92,8 @@ var SisccFooter = _react2.default.forwardRef(function (_ref, ref) {
92
92
  ref: ref,
93
93
  'data-testid': 'footer-bar-test-id',
94
94
  position: 'static',
95
+ component: 'footer',
96
+ role: 'contentinfo',
95
97
  className: (0, _classnames2.default)(classes.appBar, (_cx = {}, _cx[classes.fixed] = isFixed, _cx))
96
98
  },
97
99
  _react2.default.createElement(
package/lib/Spotlight/Spotlight.js CHANGED
@@ -74,6 +74,7 @@ var Spotlight = function Spotlight(_ref) {
74
74
  className = _ref.className,
75
75
  _ref$withAutoFocus = _ref.withAutoFocus,
76
76
  withAutoFocus = _ref$withAutoFocus === undefined ? false : _ref$withAutoFocus,
77
+ labels = _ref.labels,
77
78
  _ref$testId = _ref.testId,
78
79
  testId = _ref$testId === undefined ? 'spotlight' : _ref$testId;
79
80
 
@@ -103,7 +104,12 @@ var Spotlight = function Spotlight(_ref) {
103
104
  { className: classes.root, elevation: 0 },
104
105
  _react2.default.createElement(
105
106
  _IconButton2.default,
106
- { className: classes.leftIcon, disabled: true, 'aria-label': 'search', size: 'large' },
107
+ {
108
+ className: classes.leftIcon,
109
+ disabled: true,
110
+ 'aria-label': R.propOr('search', 'searchSpotlight')(labels),
111
+ size: 'large'
112
+ },
107
113
  _react2.default.createElement(_Search2.default, null)
108
114
  ),
109
115
  _react2.default.createElement(_InputBase2.default, {
@@ -135,7 +141,7 @@ var Spotlight = function Spotlight(_ref) {
135
141
  hasClearAll && !R.isEmpty(value) ? _react2.default.createElement(
136
142
  _IconButton2.default,
137
143
  {
138
- 'aria-label': 'Clear',
144
+ 'aria-label': R.propOr('clear', 'clearSpotlight')(labels),
139
145
  onClick: onClearTerm,
140
146
  className: (0, _classnames2.default)(classes.rightIcon, classes.clear),
141
147
  size: 'large'
@@ -162,7 +168,7 @@ var Spotlight = function Spotlight(_ref) {
162
168
  disabled: R.isEmpty(value),
163
169
  color: 'primary',
164
170
  className: classes.rightIcon,
165
- 'aria-label': 'commit',
171
+ 'aria-label': R.propOr('commit', 'commitSpotlight')(labels),
166
172
  onClick: onCommitTerm,
167
173
  size: 'large'
168
174
  },
package/lib/theme.js CHANGED
@@ -388,8 +388,23 @@ var sisccTheme = exports.sisccTheme = function sisccTheme(_ref) {
388
388
  },
389
389
  typography: {
390
390
  fontFamily: "'Helvetica Neue', Helvetica, Arial, sans-serif",
391
+ h1: {
392
+ fontSize: '2em'
393
+ },
394
+ h2: {
395
+ fontSize: '1.5em'
396
+ },
397
+ h3: {
398
+ fontSize: '14px'
399
+ },
400
+ h4: {
401
+ fontSize: '14px'
402
+ },
403
+ h5: {
404
+ fontSize: '12px'
405
+ },
391
406
  h6: {
392
- fontSize: '1.0625rem'
407
+ fontSize: '12px'
393
408
  },
394
409
  body1: {
395
410
  fontSize: '0.750rem',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sis-cc/dotstatsuite-visions",
3
- "version": "12.39.0",
3
+ "version": "12.41.0",
4
4
  "description": "Library of visual components",
5
5
  "author": "OECD",
6
6
  "homepage": "https://visions-qa.siscc.org/#o",