@sis-cc/dotstatsuite-visions 6.5.1 → 6.5.2

package/es/CollapseButtons/CollapseButtons.js

@@ -38,7 +38,9 @@ var CollapseButtons = function CollapseButtons(props) {
       breakpoint = _props$breakpoint === undefined ? function (theme) {
     return theme.breakpoints.down('sm');
   } : _props$breakpoint,
-      justify = props.justify;
+      justify = props.justify,
+      _props$textTransform = props.textTransform,
+      textTransform = _props$textTransform === undefined ? 'none' : _props$textTransform;
 
 
   var classes = useStyles();
@@ -80,6 +82,7 @@ var CollapseButtons = function CollapseButtons(props) {
         Grid,
         _extends({ item: true, xs: 12, sm: 12, md: R.nth(nbColumns)(COLUMNS) }, gridButtonsProps, { key: id }),
         React.createElement(ToggleButton, {
+          textTransform: textTransform,
           label: label,
           tabindex: R.isNil(toggleId) || R.prop(id)(toggleId) || R.compose(R.not, R.head, R.values)(toggleId) ? 0 : -1,
           isOpen: R.prop(id)(toggleId),
@@ -151,7 +154,8 @@ CollapseButtons.propTypes = process.env.NODE_ENV !== "production" ? {
   isSecondLevelClikable: PropTypes.bool,
   breakpoint: PropTypes.func,
   gridButtonsProps: PropTypes.object,
-  justify: PropTypes.string
+  justify: PropTypes.string,
+  textTransform: PropTypes.string
 } : {};
 
 export default CollapseButtons;

package/es/CollapseButtons/index.js

@@ -10,6 +10,8 @@
  * | 'space-around'
  * | 'space-evenly'
  *
+ * textTransform: 'none' | 'capitalize' | 'uppercase' | 'lowercase'
+ *
  * to manage layout you have three properties
  * nbColumns: numbers of column you want to have
  * gridButtonsProps: mainly to manage breakpoints in the differents layout of buttons but you can change all the grid properties. (nbColumns is use with the "sm" breakpoint)
@@ -51,6 +53,7 @@
  *   breakpoint: PropTypes.func,
  *   gridButtonsProps: PropTypes.object,
  *   justify: PropTypes.string,
+ *   textTransform: PropTypes.string,
  * };
  * @theme
  * // button (See ToggleButton Component)

package/es/ToggleButton/ToggleButton.js

@@ -24,7 +24,10 @@ var useStyles = makeStyles(function (theme) {
       }
     },
     label: {
-      textTransform: 'capitalize',
+      textTransform: function textTransform(_ref) {
+        var _textTransform = _ref.textTransform;
+        return _textTransform;
+      },
       textAlign: 'left',
       fontSize: '0.9375rem',
       lineHeight: '1.0'
@@ -36,17 +39,19 @@ var useStyles = makeStyles(function (theme) {
   };
 });
 
-var ToggleButton = function ToggleButton(_ref) {
+var ToggleButton = function ToggleButton(_ref2) {
   var _cx;
 
-  var isOpen = _ref.isOpen,
-      label = _ref.label,
-      toggle = _ref.toggle,
-      testId = _ref.testId,
-      _ref$tabindex = _ref.tabindex,
-      tabindex = _ref$tabindex === undefined ? 0 : _ref$tabindex;
+  var isOpen = _ref2.isOpen,
+      label = _ref2.label,
+      toggle = _ref2.toggle,
+      testId = _ref2.testId,
+      _ref2$tabindex = _ref2.tabindex,
+      tabindex = _ref2$tabindex === undefined ? 0 : _ref2$tabindex,
+      _ref2$textTransform = _ref2.textTransform,
+      textTransform = _ref2$textTransform === undefined ? 'capitalize' : _ref2$textTransform;
 
-  var classes = useStyles();
+  var classes = useStyles({ textTransform: textTransform });
   return React.createElement(
     Button,
     {
@@ -69,7 +74,8 @@ ToggleButton.propTypes = process.env.NODE_ENV !== "production" ? {
   tabindex: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
   isOpen: PropTypes.bool,
   label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
-  toggle: PropTypes.func
+  toggle: PropTypes.func,
+  textTransform: PropTypes.string
 } : {};
 
 export default ToggleButton;

package/es/ToggleButton/index.js

@@ -1,6 +1,8 @@
 /**
  * Button use api of material ui https://material-ui.com/api/button/
  *
+ * textTransform: 'none' | 'capitalize' | 'uppercase' | 'lowercase'
+ *
  * @memberOf VISIONS
  * @name ToggleButton
  * @tag component
@@ -12,6 +14,7 @@
  *   isOpen: PropTypes.bool,
  *   label: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
  *   toggle: PropTypes.func,
+ *   textTransform: PropTypes.string,
  * };
  *
  * @theme

package/lib/CollapseButtons/CollapseButtons.js

@@ -72,7 +72,9 @@ var CollapseButtons = function CollapseButtons(props) {
       breakpoint = _props$breakpoint === undefined ? function (theme) {
     return theme.breakpoints.down('sm');
   } : _props$breakpoint,
-      justify = props.justify;
+      justify = props.justify,
+      _props$textTransform = props.textTransform,
+      textTransform = _props$textTransform === undefined ? 'none' : _props$textTransform;
 
 
   var classes = useStyles();
@@ -114,6 +116,7 @@ var CollapseButtons = function CollapseButtons(props) {
         _Grid2.default,
         _extends({ item: true, xs: 12, sm: 12, md: R.nth(nbColumns)(COLUMNS) }, gridButtonsProps, { key: id }),
         _react2.default.createElement(_.ToggleButton, {
+          textTransform: textTransform,
           label: label,
           tabindex: R.isNil(toggleId) || R.prop(id)(toggleId) || R.compose(R.not, R.head, R.values)(toggleId) ? 0 : -1,
           isOpen: R.prop(id)(toggleId),
@@ -185,7 +188,8 @@ CollapseButtons.propTypes = process.env.NODE_ENV !== "production" ? {
   isSecondLevelClikable: _propTypes2.default.bool,
   breakpoint: _propTypes2.default.func,
   gridButtonsProps: _propTypes2.default.object,
-  justify: _propTypes2.default.string
+  justify: _propTypes2.default.string,
+  textTransform: _propTypes2.default.string
 } : {};
 
 exports.default = CollapseButtons;

package/lib/ToggleButton/ToggleButton.js

@@ -53,7 +53,10 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
       }
     },
     label: {
-      textTransform: 'capitalize',
+      textTransform: function textTransform(_ref) {
+        var _textTransform = _ref.textTransform;
+        return _textTransform;
+      },
       textAlign: 'left',
       fontSize: '0.9375rem',
       lineHeight: '1.0'
@@ -65,17 +68,19 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
   };
 });
 
-var ToggleButton = function ToggleButton(_ref) {
+var ToggleButton = function ToggleButton(_ref2) {
   var _cx;
 
-  var isOpen = _ref.isOpen,
-      label = _ref.label,
-      toggle = _ref.toggle,
-      testId = _ref.testId,
-      _ref$tabindex = _ref.tabindex,
-      tabindex = _ref$tabindex === undefined ? 0 : _ref$tabindex;
+  var isOpen = _ref2.isOpen,
+      label = _ref2.label,
+      toggle = _ref2.toggle,
+      testId = _ref2.testId,
+      _ref2$tabindex = _ref2.tabindex,
+      tabindex = _ref2$tabindex === undefined ? 0 : _ref2$tabindex,
+      _ref2$textTransform = _ref2.textTransform,
+      textTransform = _ref2$textTransform === undefined ? 'capitalize' : _ref2$textTransform;
 
-  var classes = useStyles();
+  var classes = useStyles({ textTransform: textTransform });
   return _react2.default.createElement(
     _Button2.default,
     {
@@ -98,7 +103,8 @@ ToggleButton.propTypes = process.env.NODE_ENV !== "production" ? {
   tabindex: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]),
   isOpen: _propTypes2.default.bool,
   label: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.element]),
-  toggle: _propTypes2.default.func
+  toggle: _propTypes2.default.func,
+  textTransform: _propTypes2.default.string
 } : {};
 
 exports.default = ToggleButton;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sis-cc/dotstatsuite-visions",
-  "version": "6.5.1",
+  "version": "6.5.2",
   "description": "Library of visual components",
   "author": "OECD",
   "homepage": "https://visions-qa.siscc.org/#o",